first commit
This commit is contained in:
jianxin committed
commit
a2fda685ec
2 files changed
+228
No files matched your search
+177
@@ -0,0 +1,177 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>商品信息生成器</title>
|
||||
<style>
|
||||
body { max-width: 1200px; margin: 0 auto; padding: 20px; font-family: Arial, sans-serif; }
|
||||
.container { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
|
||||
textarea { width: 100%; height: 300px; margin: 10px 0; }
|
||||
button { padding: 10px 20px; margin: 10px 0; }
|
||||
.error { color: red; }
|
||||
.field-info {
|
||||
background: #f5f5f5;
|
||||
padding: 10px;
|
||||
margin: 5px 0;
|
||||
border-radius: 4px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>商品信息生成器</h1>
|
||||
|
||||
<div class="container">
|
||||
<div>
|
||||
<h2>1. 输入样例JSON创建模板</h2>
|
||||
<textarea id="sampleJson" placeholder="粘贴示例商品JSON..."></textarea>
|
||||
<button onclick="generateTemplate()">生成模板</button>
|
||||
<div id="templateError" class="error"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h2>2. 生成的模板和Schema</h2>
|
||||
<textarea id="template" readonly></textarea>
|
||||
<h3>Schema定义：</h3>
|
||||
<div id="schemaDisplay"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h2>3. 输入新商品数据</h2>
|
||||
<textarea id="productData" placeholder="输入要替换的数据，每行一个值..."></textarea>
|
||||
<button onclick="generateProduct()">生成商品信息</button>
|
||||
<div id="productError" class="error"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h2>4. 生成的商品信息</h2>
|
||||
<textarea id="output" readonly></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let currentTemplate = null;
|
||||
let templateFields = [];
|
||||
let schemaInfo = {};
|
||||
|
||||
function generateTemplate() {
|
||||
const sampleJson = document.getElementById('sampleJson').value;
|
||||
const templateError = document.getElementById('templateError');
|
||||
|
||||
try {
|
||||
const sample = JSON.parse(sampleJson);
|
||||
currentTemplate = sample;
|
||||
templateFields = extractFields(sample);
|
||||
generateSchema(sample);
|
||||
|
||||
document.getElementById('template').value = JSON.stringify(sample, null, 2);
|
||||
displaySchema();
|
||||
templateError.textContent = `模板已生成，需要填充的字段：\n${templateFields.join(', ')}`;
|
||||
templateError.style.color = 'green';
|
||||
} catch (e) {
|
||||
templateError.textContent = '无效的JSON格式';
|
||||
templateError.style.color = 'red';
|
||||
}
|
||||
}
|
||||
|
||||
function extractFields(obj, prefix = '', fields = []) {
|
||||
for (let key in obj) {
|
||||
const value = obj[key];
|
||||
const fullPath = prefix ? `${prefix}.${key}` : key;
|
||||
|
||||
if (typeof value === 'string' && value.startsWith('{{') && value.endsWith('}}')) {
|
||||
fields.push(value.slice(2, -2).trim());
|
||||
} else if (typeof value === 'object' && value !== null) {
|
||||
extractFields(value, fullPath, fields);
|
||||
}
|
||||
}
|
||||
return fields;
|
||||
}
|
||||
|
||||
function generateSchema(obj, path = '') {
|
||||
for (let key in obj) {
|
||||
const value = obj[key];
|
||||
const currentPath = path ? `${path}.${key}` : key;
|
||||
|
||||
if (typeof value === 'string' && value.startsWith('{{') && value.endsWith('}}')) {
|
||||
const fieldName = value.slice(2, -2).trim();
|
||||
schemaInfo[fieldName] = {
|
||||
path: currentPath,
|
||||
type: inferType(key),
|
||||
description: `${key}的值`
|
||||
};
|
||||
} else if (typeof value === 'object' && value !== null) {
|
||||
generateSchema(value, currentPath);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function inferType(key) {
|
||||
const pricePattern = /(price|费用|价格|金额)/i;
|
||||
const numberPattern = /(count|数量|个数|数字|number)/i;
|
||||
const datePattern = /(date|时间|日期)/i;
|
||||
|
||||
if (pricePattern.test(key)) return 'price';
|
||||
if (numberPattern.test(key)) return 'number';
|
||||
if (datePattern.test(key)) return 'date';
|
||||
return 'string';
|
||||
}
|
||||
|
||||
function displaySchema() {
|
||||
const schemaDisplay = document.getElementById('schemaDisplay');
|
||||
schemaDisplay.innerHTML = '';
|
||||
|
||||
for (const [field, info] of Object.entries(schemaInfo)) {
|
||||
const fieldDiv = document.createElement('div');
|
||||
fieldDiv.className = 'field-info';
|
||||
fieldDiv.innerHTML = `
|
||||
<strong>字段名：</strong> ${field}<br>
|
||||
<strong>路径：</strong> ${info.path}<br>
|
||||
<strong>类型：</strong> ${info.type}<br>
|
||||
<strong>描述：</strong> ${info.description}
|
||||
`;
|
||||
schemaDisplay.appendChild(fieldDiv);
|
||||
}
|
||||
}
|
||||
|
||||
function generateProduct() {
|
||||
if (!currentTemplate) {
|
||||
document.getElementById('productError').textContent = '请先生成模板';
|
||||
return;
|
||||
}
|
||||
|
||||
const productData = document.getElementById('productData').value;
|
||||
const values = productData.trim().split('\n');
|
||||
|
||||
if (values.length !== templateFields.length) {
|
||||
document.getElementById('productError').textContent =
|
||||
`需要 ${templateFields.length} 个值，但提供了 ${values.length} 个`;
|
||||
return;
|
||||
}
|
||||
|
||||
const fieldValues = {};
|
||||
templateFields.forEach((field, index) => {
|
||||
fieldValues[field] = values[index];
|
||||
});
|
||||
|
||||
const result = JSON.parse(JSON.stringify(currentTemplate));
|
||||
fillTemplate(result, fieldValues);
|
||||
|
||||
document.getElementById('output').value = JSON.stringify(result, null, 2);
|
||||
document.getElementById('productError').textContent = '商品信息已生成';
|
||||
document.getElementById('productError').style.color = 'green';
|
||||
}
|
||||
|
||||
function fillTemplate(obj, values) {
|
||||
for (let key in obj) {
|
||||
const value = obj[key];
|
||||
if (typeof value === 'string' && value.startsWith('{{') && value.endsWith('}}')) {
|
||||
const field = value.slice(2, -2).trim();
|
||||
obj[key] = values[field];
|
||||
} else if (typeof value === 'object' && value !== null) {
|
||||
fillTemplate(value, values);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user