feat: 分类和子类别ID自动生成 - 不再需要手动填写ID
This commit is contained in:
@@ -449,6 +449,11 @@
|
||||
let currentFilter = '';
|
||||
let dynamicCategoryId = '';
|
||||
|
||||
// 生成随机ID(12位十六进制)
|
||||
function generateId() {
|
||||
return Math.random().toString(16).slice(2, 8) + Math.random().toString(16).slice(2, 8);
|
||||
}
|
||||
|
||||
const colorMap = {
|
||||
blue: 'bg-blue-100 text-blue-600',
|
||||
green: 'bg-green-100 text-green-600',
|
||||
@@ -1227,11 +1232,12 @@
|
||||
}
|
||||
|
||||
// 自定义类别完整编辑表单
|
||||
const autoId = data.id || generateId();
|
||||
return `<form id="itemForm" class="space-y-4">
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">ID *</label><input type="text" name="id" value="${data.id || ''}" ${data.id ? 'readonly' : ''} required class="w-full px-3 py-2 border rounded-lg ${data.id ? 'bg-gray-100' : ''}"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">名称 *</label><input type="text" name="name" value="${data.name || ''}" required class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">图标</label><input type="text" name="icon" value="${data.icon || 'ri-folder-line'}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">ID</label><input type="text" name="id" value="${autoId}" readonly class="w-full px-3 py-2 border rounded-lg bg-gray-100 text-gray-500 font-mono text-xs"><p class="text-xs text-gray-400 mt-1">自动生成,无需填写</p></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">名称 *</label><input type="text" name="name" value="${data.name || ''}" required class="w-full px-3 py-2 border rounded-lg" placeholder="如:手机、电脑"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">图标</label><input type="text" name="icon" value="${data.icon || 'ri-folder-line'}" class="w-full px-3 py-2 border rounded-lg" placeholder="ri-folder-line"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">颜色</label><select name="color" class="w-full px-3 py-2 border rounded-lg">
|
||||
<option value="blue" ${data.color === 'blue' ? 'selected' : ''}>蓝色</option>
|
||||
<option value="green" ${data.color === 'green' ? 'selected' : ''}>绿色</option>
|
||||
@@ -1246,7 +1252,7 @@
|
||||
<option value="false" ${data.visible === false ? 'selected' : ''}>隐藏</option>
|
||||
</select></div>
|
||||
</div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">描述</label><textarea name="description" rows="2" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">描述</label><textarea name="description" rows="2" class="w-full px-3 py-2 border rounded-lg" placeholder="分类描述">${data.description || ''}</textarea></div>
|
||||
|
||||
<!-- 子类别管理 -->
|
||||
<div class="border-t pt-4">
|
||||
@@ -1323,11 +1329,12 @@
|
||||
const keyFeatures = (data.key_features || []).join(', ');
|
||||
const featureLabels = data.feature_labels || {};
|
||||
const featureLabelsStr = Object.entries(featureLabels).map(([k, v]) => `${k}:${v}`).join(', ');
|
||||
const autoSubId = data.id || generateId();
|
||||
|
||||
return `<div class="space-y-4">
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">ID *</label><input type="text" id="sub_id" value="${data.id || ''}" required class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">名称 *</label><input type="text" id="sub_name" value="${data.name || ''}" required class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">ID</label><input type="text" id="sub_id" value="${autoSubId}" readonly class="w-full px-3 py-2 border rounded-lg bg-gray-100 text-gray-500 font-mono text-xs"><p class="text-xs text-gray-400 mt-1">自动生成</p></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">名称 *</label><input type="text" id="sub_name" value="${data.name || ''}" required class="w-full px-3 py-2 border rounded-lg" placeholder="如:旗舰手机"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">图标</label><input type="text" id="sub_icon" value="${data.icon || 'ri-folder-line'}" class="w-full px-3 py-2 border rounded-lg" placeholder="ri-folder-line"></div>
|
||||
</div>
|
||||
<div>
|
||||
@@ -1351,11 +1358,13 @@
|
||||
const keyFeaturesStr = document.getElementById('sub_key_features').value.trim();
|
||||
const featureLabelsStr = document.getElementById('sub_feature_labels').value.trim();
|
||||
|
||||
if (!id || !name) {
|
||||
alert('ID和名称不能为空');
|
||||
if (!name) {
|
||||
alert('名称不能为空');
|
||||
return;
|
||||
}
|
||||
|
||||
// ID自动生成,无需校验
|
||||
|
||||
// 解析 key_features
|
||||
const key_features = keyFeaturesStr ? keyFeaturesStr.split(',').map(s => s.trim()).filter(s => s) : [];
|
||||
|
||||
|
||||
Reference in New Issue
Block a user