feat: 分类管理和知识库管理
功能: - 分类管理：可动态添加手机、电脑、汽车等参数大类 - 知识库管理：增删改查知识条目，支持分类筛选 - 概览统计增加分类和知识数量 - 侧边栏导航优化
This commit is contained in:
@@ -6,10 +6,15 @@
|
||||
<title>后台管理 - ParamHub</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link href="https://cdn.jsdelivr.net/npm/remixicon@3.5.0/fonts/remixicon.css" rel="stylesheet">
|
||||
<style>
|
||||
.sidebar-link { transition: all 0.2s; }
|
||||
.sidebar-link:hover { background: #374151; }
|
||||
.sidebar-link.active { background: #4f46e5; color: white; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-gray-100 min-h-screen">
|
||||
<!-- 侧边栏 -->
|
||||
<aside class="fixed left-0 top-0 w-64 h-full bg-gray-800 text-white">
|
||||
<aside class="fixed left-0 top-0 w-64 h-full bg-gray-800 text-white overflow-y-auto">
|
||||
<div class="p-4 border-b border-gray-700">
|
||||
<div class="flex items-center gap-2">
|
||||
<i class="ri-dashboard-3-line text-2xl"></i>
|
||||
@@ -18,23 +23,31 @@
|
||||
<div class="text-sm text-gray-400 mt-1">后台管理</div>
|
||||
</div>
|
||||
<nav class="p-4">
|
||||
<div class="space-y-2">
|
||||
<a href="#overview" onclick="showSection('overview')" class="flex items-center gap-2 px-3 py-2 rounded-lg bg-indigo-600 text-white">
|
||||
<div class="space-y-1">
|
||||
<a href="#overview" onclick="showSection('overview')" class="sidebar-link active flex items-center gap-2 px-3 py-2 rounded-lg" data-section="overview">
|
||||
<i class="ri-home-4-line"></i>
|
||||
<span>概览</span>
|
||||
</a>
|
||||
<a href="#models" onclick="showSection('models')" class="flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-gray-700 text-gray-300">
|
||||
<a href="#categories" onclick="showSection('categories')" class="sidebar-link flex items-center gap-2 px-3 py-2 rounded-lg text-gray-300" data-section="categories">
|
||||
<i class="ri-folder-line"></i>
|
||||
<span>分类管理</span>
|
||||
</a>
|
||||
<a href="#models" onclick="showSection('models')" class="sidebar-link flex items-center gap-2 px-3 py-2 rounded-lg text-gray-300" data-section="models">
|
||||
<i class="ri-robot-line"></i>
|
||||
<span>模型管理</span>
|
||||
</a>
|
||||
<a href="#gpus" onclick="showSection('gpus')" class="flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-gray-700 text-gray-300">
|
||||
<a href="#gpus" onclick="showSection('gpus')" class="sidebar-link flex items-center gap-2 px-3 py-2 rounded-lg text-gray-300" data-section="gpus">
|
||||
<i class="ri-cpu-line"></i>
|
||||
<span>GPU管理</span>
|
||||
</a>
|
||||
<a href="#cpus" onclick="showSection('cpus')" class="flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-gray-700 text-gray-300">
|
||||
<a href="#cpus" onclick="showSection('cpus')" class="sidebar-link flex items-center gap-2 px-3 py-2 rounded-lg text-gray-300" data-section="cpus">
|
||||
<i class="ri-memory-line"></i>
|
||||
<span>CPU管理</span>
|
||||
</a>
|
||||
<a href="#knowledge" onclick="showSection('knowledge')" class="sidebar-link flex items-center gap-2 px-3 py-2 rounded-lg text-gray-300" data-section="knowledge">
|
||||
<i class="ri-book-open-line"></i>
|
||||
<span>知识库管理</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-8 pt-4 border-t border-gray-700">
|
||||
<a href="/" target="_blank" class="flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-gray-700 text-gray-400">
|
||||
@@ -51,80 +64,118 @@
|
||||
<section id="section-overview">
|
||||
<h1 class="text-2xl font-bold text-gray-800 mb-6">管理概览</h1>
|
||||
|
||||
<!-- 统计卡片 -->
|
||||
<div class="grid grid-cols-4 gap-6 mb-8">
|
||||
<div class="bg-white rounded-xl p-6 shadow-sm">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-blue-100 flex items-center justify-center">
|
||||
<i class="ri-robot-line text-2xl text-blue-600"></i>
|
||||
<div class="grid grid-cols-5 gap-4 mb-8">
|
||||
<div class="bg-white rounded-xl p-5 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 rounded-lg bg-blue-100 flex items-center justify-center">
|
||||
<i class="ri-folder-line text-xl text-blue-600"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-2xl font-bold text-gray-800" id="stat-categories">-</div>
|
||||
<div class="text-xs text-gray-500">分类数量</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-5 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 rounded-lg bg-indigo-100 flex items-center justify-center">
|
||||
<i class="ri-robot-line text-xl text-indigo-600"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-2xl font-bold text-gray-800" id="stat-models">-</div>
|
||||
<div class="text-sm text-gray-500">模型数量</div>
|
||||
<div class="text-xs text-gray-500">模型数量</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-6 shadow-sm">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-green-100 flex items-center justify-center">
|
||||
<i class="ri-cpu-line text-2xl text-green-600"></i>
|
||||
<div class="bg-white rounded-xl p-5 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 rounded-lg bg-green-100 flex items-center justify-center">
|
||||
<i class="ri-cpu-line text-xl text-green-600"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-2xl font-bold text-gray-800" id="stat-gpus">-</div>
|
||||
<div class="text-sm text-gray-500">GPU数量</div>
|
||||
<div class="text-xs text-gray-500">GPU数量</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-6 shadow-sm">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-purple-100 flex items-center justify-center">
|
||||
<i class="ri-memory-line text-2xl text-purple-600"></i>
|
||||
<div class="bg-white rounded-xl p-5 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 rounded-lg bg-purple-100 flex items-center justify-center">
|
||||
<i class="ri-memory-line text-xl text-purple-600"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-2xl font-bold text-gray-800" id="stat-cpus">-</div>
|
||||
<div class="text-sm text-gray-500">CPU数量</div>
|
||||
<div class="text-xs text-gray-500">CPU数量</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-6 shadow-sm">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-orange-100 flex items-center justify-center">
|
||||
<i class="ri-time-line text-2xl text-orange-600"></i>
|
||||
<div class="bg-white rounded-xl p-5 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 rounded-lg bg-teal-100 flex items-center justify-center">
|
||||
<i class="ri-book-open-line text-xl text-teal-600"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-lg font-bold text-gray-800" id="stat-time">-</div>
|
||||
<div class="text-sm text-gray-500">更新时间</div>
|
||||
<div class="text-2xl font-bold text-gray-800" id="stat-knowledge">-</div>
|
||||
<div class="text-xs text-gray-500">知识条目</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 快捷操作 -->
|
||||
<div class="bg-white rounded-xl p-6 shadow-sm mb-8">
|
||||
<h2 class="text-lg font-semibold text-gray-800 mb-4">快捷操作</h2>
|
||||
<div class="grid grid-cols-4 gap-4">
|
||||
<button onclick="showSection('models'); openAddModal('model')" class="px-4 py-3 bg-blue-50 text-blue-600 rounded-lg hover:bg-blue-100 transition">
|
||||
<i class="ri-add-line mr-2"></i>添加模型
|
||||
<div class="grid grid-cols-5 gap-3">
|
||||
<button onclick="showSection('categories'); openAddModal('category')" class="px-4 py-3 bg-blue-50 text-blue-600 rounded-lg hover:bg-blue-100 transition text-sm">
|
||||
<i class="ri-add-line mr-1"></i>添加分类
|
||||
</button>
|
||||
<button onclick="showSection('gpus'); openAddModal('gpu')" class="px-4 py-3 bg-green-50 text-green-600 rounded-lg hover:bg-green-100 transition">
|
||||
<i class="ri-add-line mr-2"></i>添加GPU
|
||||
<button onclick="showSection('models'); openAddModal('model')" class="px-4 py-3 bg-indigo-50 text-indigo-600 rounded-lg hover:bg-indigo-100 transition text-sm">
|
||||
<i class="ri-add-line mr-1"></i>添加模型
|
||||
</button>
|
||||
<button onclick="showSection('cpus'); openAddModal('cpu')" class="px-4 py-3 bg-purple-50 text-purple-600 rounded-lg hover:bg-purple-100 transition">
|
||||
<i class="ri-add-line mr-2"></i>添加CPU
|
||||
<button onclick="showSection('gpus'); openAddModal('gpu')" class="px-4 py-3 bg-green-50 text-green-600 rounded-lg hover:bg-green-100 transition text-sm">
|
||||
<i class="ri-add-line mr-1"></i>添加GPU
|
||||
</button>
|
||||
<button onclick="showSection('cpus'); openAddModal('cpu')" class="px-4 py-3 bg-purple-50 text-purple-600 rounded-lg hover:bg-purple-100 transition text-sm">
|
||||
<i class="ri-add-line mr-1"></i>添加CPU
|
||||
</button>
|
||||
<button onclick="showSection('knowledge'); openAddModal('knowledge')" class="px-4 py-3 bg-teal-50 text-teal-600 rounded-lg hover:bg-teal-100 transition text-sm">
|
||||
<i class="ri-add-line mr-1"></i>添加知识
|
||||
</button>
|
||||
<a href="/" target="_blank" class="px-4 py-3 bg-gray-50 text-gray-600 rounded-lg hover:bg-gray-100 transition text-center">
|
||||
<i class="ri-external-link-line mr-2"></i>查看前台
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 最近添加 -->
|
||||
<div class="bg-white rounded-xl p-6 shadow-sm">
|
||||
<h2 class="text-lg font-semibold text-gray-800 mb-4">最近添加的模型</h2>
|
||||
<div id="recent-models" class="space-y-2">加载中...</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 分类管理 -->
|
||||
<section id="section-categories" class="hidden">
|
||||
<div class="flex justify-between items-center mb-6">
|
||||
<h1 class="text-2xl font-bold text-gray-800">分类管理</h1>
|
||||
<button onclick="openAddModal('category')" class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition">
|
||||
<i class="ri-add-line mr-2"></i>添加分类
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-xl shadow-sm overflow-hidden">
|
||||
<table class="w-full">
|
||||
<thead class="bg-gray-50 border-b">
|
||||
<tr>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">图标</th>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">名称</th>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">描述</th>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">排序</th>
|
||||
<th class="px-4 py-3 text-center text-sm font-medium text-gray-600">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="admin-categories-table">
|
||||
<tr><td colspan="5" class="text-center text-gray-400 py-8">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 模型管理 -->
|
||||
<section id="section-models" class="hidden">
|
||||
<div class="flex justify-between items-center mb-6">
|
||||
@@ -208,12 +259,49 @@
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 知识库管理 -->
|
||||
<section id="section-knowledge" class="hidden">
|
||||
<div class="flex justify-between items-center mb-6">
|
||||
<h1 class="text-2xl font-bold text-gray-800">知识库管理</h1>
|
||||
<button onclick="openAddModal('knowledge')" class="px-4 py-2 bg-teal-600 text-white rounded-lg hover:bg-teal-700 transition">
|
||||
<i class="ri-add-line mr-2"></i>添加知识
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- 分类筛选 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-4 mb-4">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-sm text-gray-600">筛选分类：</span>
|
||||
<button onclick="filterKnowledge('')" class="px-3 py-1 rounded text-sm bg-gray-100 text-gray-600 hover:bg-gray-200" id="filter-all">全部</button>
|
||||
<div id="category-filters" class="flex gap-2"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-xl shadow-sm overflow-hidden">
|
||||
<table class="w-full">
|
||||
<thead class="bg-gray-50 border-b">
|
||||
<tr>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">图标</th>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">标题</th>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">分类</th>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">简介</th>
|
||||
<th class="px-4 py-3 text-left text-sm font-medium text-gray-600">排序</th>
|
||||
<th class="px-4 py-3 text-center text-sm font-medium text-gray-600">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="admin-knowledge-table">
|
||||
<tr><td colspan="6" class="text-center text-gray-400 py-8">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- 编辑弹窗 -->
|
||||
<div id="editModal" class="fixed inset-0 bg-black/50 z-50 hidden flex items-center justify-center">
|
||||
<div class="bg-white rounded-xl max-w-2xl w-full mx-4 max-h-[90vh] overflow-auto">
|
||||
<div class="p-6 border-b flex justify-between items-center sticky top-0 bg-white">
|
||||
<div class="p-6 border-b flex justify-between items-center sticky top-0 bg-white z-10">
|
||||
<h2 class="text-xl font-bold text-gray-800" id="modalTitle">添加/编辑</h2>
|
||||
<button onclick="closeModal()" class="text-gray-400 hover:text-gray-600">
|
||||
<i class="ri-close-line text-2xl"></i>
|
||||
@@ -231,23 +319,29 @@
|
||||
let currentType = '';
|
||||
let currentId = '';
|
||||
let currentData = {};
|
||||
let categories = [];
|
||||
let currentFilter = '';
|
||||
|
||||
// 切换显示区域
|
||||
function showSection(section) {
|
||||
document.querySelectorAll('section').forEach(s => s.classList.add('hidden'));
|
||||
document.getElementById('section-' + section).classList.remove('hidden');
|
||||
|
||||
// 更新导航样式
|
||||
document.querySelectorAll('nav a').forEach(a => {
|
||||
a.className = a.getAttribute('onclick')?.includes(section)
|
||||
? 'flex items-center gap-2 px-3 py-2 rounded-lg bg-indigo-600 text-white'
|
||||
: 'flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-gray-700 text-gray-300';
|
||||
document.querySelectorAll('.sidebar-link').forEach(a => {
|
||||
a.classList.remove('active', 'text-white');
|
||||
a.classList.add('text-gray-300');
|
||||
});
|
||||
const activeLink = document.querySelector(`.sidebar-link[data-section="${section}"]`);
|
||||
if (activeLink) {
|
||||
activeLink.classList.add('active', 'text-white');
|
||||
activeLink.classList.remove('text-gray-300');
|
||||
}
|
||||
|
||||
// 加载对应数据
|
||||
if (section === 'categories') loadAdminCategories();
|
||||
if (section === 'models') loadAdminModels();
|
||||
if (section === 'gpus') loadAdminGpus();
|
||||
if (section === 'cpus') loadAdminCpus();
|
||||
if (section === 'knowledge') loadAdminKnowledge();
|
||||
}
|
||||
|
||||
// 加载概览统计
|
||||
@@ -255,12 +349,12 @@
|
||||
const res = await fetch('/api/stats');
|
||||
const data = await res.json();
|
||||
|
||||
document.getElementById('stat-categories').textContent = data.categories_count;
|
||||
document.getElementById('stat-models').textContent = data.models_count;
|
||||
document.getElementById('stat-gpus').textContent = data.gpus_count;
|
||||
document.getElementById('stat-cpus').textContent = data.cpus_count;
|
||||
document.getElementById('stat-time').textContent = new Date().toLocaleString('zh-CN');
|
||||
document.getElementById('stat-knowledge').textContent = data.knowledge_count;
|
||||
|
||||
// 最近添加的模型
|
||||
const models = data.latest_models || [];
|
||||
document.getElementById('recent-models').innerHTML = models.length > 0
|
||||
? models.map(m => `
|
||||
@@ -275,6 +369,36 @@
|
||||
: '<div class="text-gray-400">暂无数据</div>';
|
||||
}
|
||||
|
||||
// 加载分类列表
|
||||
async function loadAdminCategories() {
|
||||
const res = await fetch('/api/categories');
|
||||
categories = await res.json();
|
||||
|
||||
if (categories.length === 0) {
|
||||
document.getElementById('admin-categories-table').innerHTML = '<tr><td colspan="5" class="text-center text-gray-400 py-8">暂无数据</td></tr>';
|
||||
return;
|
||||
}
|
||||
|
||||
const colorMap = {blue: 'bg-blue-100 text-blue-600', green: 'bg-green-100 text-green-600', purple: 'bg-purple-100 text-purple-600', orange: 'bg-orange-100 text-orange-600', teal: 'bg-teal-100 text-teal-600', red: 'bg-red-100 text-red-600'};
|
||||
|
||||
document.getElementById('admin-categories-table').innerHTML = categories.map(c => `
|
||||
<tr class="border-b hover:bg-gray-50">
|
||||
<td class="px-4 py-3">
|
||||
<div class="w-10 h-10 rounded-lg ${colorMap[c.color] || 'bg-gray-100 text-gray-600'} flex items-center justify-center">
|
||||
<i class="${c.icon} text-xl"></i>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-4 py-3 font-medium text-gray-800">${c.name}</td>
|
||||
<td class="px-4 py-3 text-gray-600 text-sm">${c.description || '-'}</td>
|
||||
<td class="px-4 py-3">${c.order || 0}</td>
|
||||
<td class="px-4 py-3 text-center">
|
||||
<button onclick="editItem('category', '${c.id}')" class="text-blue-600 hover:text-blue-800 mr-2"><i class="ri-edit-line"></i></button>
|
||||
<button onclick="deleteItem('category', '${c.id}')" class="text-red-600 hover:text-red-800"><i class="ri-delete-bin-line"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
`).join('');
|
||||
}
|
||||
|
||||
// 加载模型列表
|
||||
async function loadAdminModels() {
|
||||
const res = await fetch('/api/models');
|
||||
@@ -293,12 +417,8 @@
|
||||
<td class="px-4 py-3 text-gray-600">${m.context_length || '-'}</td>
|
||||
<td class="px-4 py-3">${m.is_open_source ? '<span class="text-green-600">开源</span>' : '<span class="text-gray-600">商业</span>'}</td>
|
||||
<td class="px-4 py-3 text-center">
|
||||
<button onclick="editItem('model', '${m.id}')" class="text-blue-600 hover:text-blue-800 mr-2">
|
||||
<i class="ri-edit-line"></i>
|
||||
</button>
|
||||
<button onclick="deleteItem('model', '${m.id}')" class="text-red-600 hover:text-red-800">
|
||||
<i class="ri-delete-bin-line"></i>
|
||||
</button>
|
||||
<button onclick="editItem('model', '${m.id}')" class="text-blue-600 hover:text-blue-800 mr-2"><i class="ri-edit-line"></i></button>
|
||||
<button onclick="deleteItem('model', '${m.id}')" class="text-red-600 hover:text-red-800"><i class="ri-delete-bin-line"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
`).join('');
|
||||
@@ -322,12 +442,8 @@
|
||||
<td class="px-4 py-3 text-gray-600">${g.architecture}</td>
|
||||
<td class="px-4 py-3 text-gray-600">$${g.price_usd || '-'}</td>
|
||||
<td class="px-4 py-3 text-center">
|
||||
<button onclick="editItem('gpu', '${g.id}')" class="text-blue-600 hover:text-blue-800 mr-2">
|
||||
<i class="ri-edit-line"></i>
|
||||
</button>
|
||||
<button onclick="deleteItem('gpu', '${g.id}')" class="text-red-600 hover:text-red-800">
|
||||
<i class="ri-delete-bin-line"></i>
|
||||
</button>
|
||||
<button onclick="editItem('gpu', '${g.id}')" class="text-blue-600 hover:text-blue-800 mr-2"><i class="ri-edit-line"></i></button>
|
||||
<button onclick="deleteItem('gpu', '${g.id}')" class="text-red-600 hover:text-red-800"><i class="ri-delete-bin-line"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
`).join('');
|
||||
@@ -351,32 +467,71 @@
|
||||
<td class="px-4 py-3 text-gray-600">${c.base_clock_ghz}-${c.boost_clock_ghz}GHz</td>
|
||||
<td class="px-4 py-3 text-gray-600">$${c.price_usd || '-'}</td>
|
||||
<td class="px-4 py-3 text-center">
|
||||
<button onclick="editItem('cpu', '${c.id}')" class="text-blue-600 hover:text-blue-800 mr-2">
|
||||
<i class="ri-edit-line"></i>
|
||||
</button>
|
||||
<button onclick="deleteItem('cpu', '${c.id}')" class="text-red-600 hover:text-red-800">
|
||||
<i class="ri-delete-bin-line"></i>
|
||||
</button>
|
||||
<button onclick="editItem('cpu', '${c.id}')" class="text-blue-600 hover:text-blue-800 mr-2"><i class="ri-edit-line"></i></button>
|
||||
<button onclick="deleteItem('cpu', '${c.id}')" class="text-red-600 hover:text-red-800"><i class="ri-delete-bin-line"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
`).join('');
|
||||
}
|
||||
|
||||
// 加载知识列表
|
||||
async function loadAdminKnowledge() {
|
||||
// 先加载分类
|
||||
const catRes = await fetch('/api/categories');
|
||||
categories = await catRes.json();
|
||||
|
||||
// 渲染分类筛选按钮
|
||||
document.getElementById('category-filters').innerHTML = categories.map(c => `
|
||||
<button onclick="filterKnowledge('${c.id}')" class="px-3 py-1 rounded text-sm bg-gray-100 text-gray-600 hover:bg-gray-200" id="filter-${c.id}">${c.name}</button>
|
||||
`).join('');
|
||||
|
||||
// 加载知识
|
||||
let url = '/api/knowledge';
|
||||
if (currentFilter) url += `?category=${currentFilter}`;
|
||||
|
||||
const res = await fetch(url);
|
||||
const knowledge = await res.json();
|
||||
|
||||
if (knowledge.length === 0) {
|
||||
document.getElementById('admin-knowledge-table').innerHTML = '<tr><td colspan="6" class="text-center text-gray-400 py-8">暂无数据</td></tr>';
|
||||
return;
|
||||
}
|
||||
|
||||
document.getElementById('admin-knowledge-table').innerHTML = knowledge.map(k => {
|
||||
const cat = categories.find(c => c.id === k.category);
|
||||
return `
|
||||
<tr class="border-b hover:bg-gray-50">
|
||||
<td class="px-4 py-3"><i class="${k.icon || 'ri-file-list-line'} text-xl text-gray-400"></i></td>
|
||||
<td class="px-4 py-3 font-medium text-gray-800">${k.title}</td>
|
||||
<td class="px-4 py-3 text-gray-600">${cat ? cat.name : '-'}</td>
|
||||
<td class="px-4 py-3 text-gray-500 text-sm max-w-xs truncate">${k.content || '-'}</td>
|
||||
<td class="px-4 py-3">${k.order || 0}</td>
|
||||
<td class="px-4 py-3 text-center">
|
||||
<button onclick="editItem('knowledge', '${k.id}')" class="text-blue-600 hover:text-blue-800 mr-2"><i class="ri-edit-line"></i></button>
|
||||
<button onclick="deleteItem('knowledge', '${k.id}')" class="text-red-600 hover:text-red-800"><i class="ri-delete-bin-line"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
`;
|
||||
}).join('');
|
||||
}
|
||||
|
||||
// 筛选知识
|
||||
function filterKnowledge(category) {
|
||||
currentFilter = category;
|
||||
loadAdminKnowledge();
|
||||
}
|
||||
|
||||
// 打开添加弹窗
|
||||
function openAddModal(type) {
|
||||
currentType = type;
|
||||
currentId = '';
|
||||
currentData = {};
|
||||
|
||||
document.getElementById('modalTitle').textContent = '添加' + (type === 'model' ? '模型' : type === 'gpu' ? 'GPU' : 'CPU');
|
||||
const titles = {category: '分类', model: '模型', gpu: 'GPU', cpu: 'CPU', knowledge: '知识'};
|
||||
document.getElementById('modalTitle').textContent = '添加' + titles[type];
|
||||
|
||||
if (type === 'model') {
|
||||
document.getElementById('modalContent').innerHTML = getModelForm();
|
||||
} else if (type === 'gpu') {
|
||||
document.getElementById('modalContent').innerHTML = getGpuForm();
|
||||
} else {
|
||||
document.getElementById('modalContent').innerHTML = getCpuForm();
|
||||
}
|
||||
const forms = {category: getCategoryForm, model: getModelForm, gpu: getGpuForm, cpu: getCpuForm, knowledge: getKnowledgeForm};
|
||||
document.getElementById('modalContent').innerHTML = forms[type]();
|
||||
|
||||
document.getElementById('editModal').classList.remove('hidden');
|
||||
}
|
||||
@@ -386,18 +541,14 @@
|
||||
currentType = type;
|
||||
currentId = id;
|
||||
|
||||
const res = await fetch(`/api/${type}s/${id}`);
|
||||
const res = await fetch(`/api/${type === 'category' ? 'categories' : type === 'knowledge' ? 'knowledge' : type + 's'}/${id}`);
|
||||
currentData = await res.json();
|
||||
|
||||
document.getElementById('modalTitle').textContent = '编辑' + (type === 'model' ? '模型' : type === 'gpu' ? 'GPU' : 'CPU');
|
||||
const titles = {category: '分类', model: '模型', gpu: 'GPU', cpu: 'CPU', knowledge: '知识'};
|
||||
document.getElementById('modalTitle').textContent = '编辑' + titles[type];
|
||||
|
||||
if (type === 'model') {
|
||||
document.getElementById('modalContent').innerHTML = getModelForm(currentData);
|
||||
} else if (type === 'gpu') {
|
||||
document.getElementById('modalContent').innerHTML = getGpuForm(currentData);
|
||||
} else {
|
||||
document.getElementById('modalContent').innerHTML = getCpuForm(currentData);
|
||||
}
|
||||
const forms = {category: getCategoryForm, model: getModelForm, gpu: getGpuForm, cpu: getCpuForm, knowledge: getKnowledgeForm};
|
||||
document.getElementById('modalContent').innerHTML = forms[type](currentData);
|
||||
|
||||
document.getElementById('editModal').classList.remove('hidden');
|
||||
}
|
||||
@@ -406,12 +557,11 @@
|
||||
async function deleteItem(type, id) {
|
||||
if (!confirm('确定删除？')) return;
|
||||
|
||||
await fetch(`/api/${type}s/${id}`, { method: 'DELETE' });
|
||||
|
||||
if (type === 'model') loadAdminModels();
|
||||
if (type === 'gpu') loadAdminGpus();
|
||||
if (type === 'cpu') loadAdminCpus();
|
||||
const endpoint = type === 'category' ? 'categories' : type === 'knowledge' ? 'knowledge' : type + 's';
|
||||
await fetch(`/api/${endpoint}/${id}`, { method: 'DELETE' });
|
||||
|
||||
const loaders = {category: loadAdminCategories, model: loadAdminModels, gpu: loadAdminGpus, cpu: loadAdminCpus, knowledge: loadAdminKnowledge};
|
||||
loaders[type]();
|
||||
loadOverview();
|
||||
}
|
||||
|
||||
@@ -423,11 +573,11 @@
|
||||
|
||||
formData.forEach((value, key) => {
|
||||
if (value) {
|
||||
// 数值字段转换
|
||||
if (['parameters', 'context_length', 'mmlu', 'humaneval', 'input_price', 'output_price',
|
||||
const numFields = ['parameters', 'context_length', 'mmlu', 'humaneval', 'input_price', 'output_price',
|
||||
'memory_gb', 'cuda_cores', 'tensor_cores', 'memory_bandwidth_gbs',
|
||||
'fp32_tflops', 'fp16_tflops', 'int8_perf_tops', 'price_usd', 'release_year',
|
||||
'cores', 'threads', 'base_clock_ghz', 'boost_clock_ghz', 'l3_cache_mb', 'tdp_watts'].includes(key)) {
|
||||
'cores', 'threads', 'base_clock_ghz', 'boost_clock_ghz', 'l3_cache_mb', 'tdp_watts', 'order'];
|
||||
if (numFields.includes(key)) {
|
||||
data[key] = parseFloat(value);
|
||||
} else if (key === 'is_open_source') {
|
||||
data[key] = value === 'true';
|
||||
@@ -437,16 +587,16 @@
|
||||
}
|
||||
});
|
||||
|
||||
const endpoint = currentType === 'category' ? 'categories' : currentType === 'knowledge' ? 'knowledge' : currentType + 's';
|
||||
|
||||
if (currentId) {
|
||||
// 更新
|
||||
await fetch(`/api/${currentType}s/${currentId}`, {
|
||||
await fetch(`/api/${endpoint}/${currentId}`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
});
|
||||
} else {
|
||||
// 创建
|
||||
await fetch(`/api/${currentType}s`, {
|
||||
await fetch(`/api/${endpoint}`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
@@ -455,10 +605,8 @@
|
||||
|
||||
closeModal();
|
||||
|
||||
if (currentType === 'model') loadAdminModels();
|
||||
if (currentType === 'gpu') loadAdminGpus();
|
||||
if (currentType === 'cpu') loadAdminCpus();
|
||||
|
||||
const loaders = {category: loadAdminCategories, model: loadAdminModels, gpu: loadAdminGpus, cpu: loadAdminCpus, knowledge: loadAdminKnowledge};
|
||||
loaders[currentType]();
|
||||
loadOverview();
|
||||
}
|
||||
|
||||
@@ -467,7 +615,7 @@
|
||||
}
|
||||
|
||||
// 表单模板
|
||||
function getModelForm(data = {}) {
|
||||
function getCategoryForm(data = {}) {
|
||||
return `
|
||||
<form id="itemForm" class="space-y-4">
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
@@ -476,114 +624,108 @@
|
||||
<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="organization" value="${data.organization || ''}" required class="w-full px-3 py-2 border rounded-lg">
|
||||
<label class="text-sm text-gray-600 mb-1 block">图标</label>
|
||||
<input type="text" name="icon" value="${data.icon || 'ri-folder-line'}" placeholder="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">参数量(B) *</label>
|
||||
<input type="number" name="parameters" value="${data.parameters || ''}" 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="architecture" value="${data.architecture || ''}" 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="number" name="context_length" value="${data.context_length || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">类型</label>
|
||||
<select name="is_open_source" class="w-full px-3 py-2 border rounded-lg">
|
||||
<option value="false" ${!data.is_open_source ? 'selected' : ''}>商业</option>
|
||||
<option value="true" ${data.is_open_source ? 'selected' : ''}>开源</option>
|
||||
<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>
|
||||
<option value="purple" ${data.color === 'purple' ? 'selected' : ''}>紫色</option>
|
||||
<option value="orange" ${data.color === 'orange' ? 'selected' : ''}>橙色</option>
|
||||
<option value="teal" ${data.color === 'teal' ? 'selected' : ''}>青色</option>
|
||||
<option value="red" ${data.color === 'red' ? 'selected' : ''}>红色</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">MMLU分数</label>
|
||||
<input type="number" name="mmlu" value="${data.mmlu || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">HumanEval分数</label>
|
||||
<input type="number" name="humaneval" value="${data.humaneval || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">输入价格($/1K)</label>
|
||||
<input type="number" name="input_price" value="${data.input_price || ''}" step="0.001" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">输出价格($/1K)</label>
|
||||
<input type="number" name="output_price" value="${data.output_price || ''}" step="0.001" 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="license" value="${data.license || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
<label class="text-sm text-gray-600 mb-1 block">排序</label>
|
||||
<input type="number" name="order" value="${data.order || 0}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">描述</label>
|
||||
<textarea name="description" rows="3" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea>
|
||||
<textarea name="description" rows="2" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea>
|
||||
</div>
|
||||
</form>
|
||||
`;
|
||||
}
|
||||
|
||||
function getKnowledgeForm(data = {}) {
|
||||
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">标题 *</label>
|
||||
<input type="text" name="title" value="${data.title || ''}" required class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">分类</label>
|
||||
<select name="category" class="w-full px-3 py-2 border rounded-lg">
|
||||
<option value="">选择分类</option>
|
||||
${categories.map(c => `<option value="${c.id}" ${data.category === c.id ? 'selected' : ''}>${c.name}</option>`).join('')}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">图标</label>
|
||||
<input type="text" name="icon" value="${data.icon || 'ri-file-list-line'}" 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="number" name="order" value="${data.order || 0}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">简介 *</label>
|
||||
<textarea name="content" rows="2" required class="w-full px-3 py-2 border rounded-lg">${data.content || ''}</textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">详细内容</label>
|
||||
<textarea name="detail" rows="6" class="w-full px-3 py-2 border rounded-lg">${data.detail || ''}</textarea>
|
||||
</div>
|
||||
</form>
|
||||
`;
|
||||
}
|
||||
|
||||
function getModelForm(data = {}) {
|
||||
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">名称 *</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="organization" value="${data.organization || ''}" required class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">参数量(B) *</label><input type="number" name="parameters" value="${data.parameters || ''}" 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="architecture" value="${data.architecture || ''}" 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="number" name="context_length" value="${data.context_length || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">类型</label><select name="is_open_source" class="w-full px-3 py-2 border rounded-lg"><option value="false" ${!data.is_open_source ? 'selected' : ''}>商业</option><option value="true" ${data.is_open_source ? 'selected' : ''}>开源</option></select></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">MMLU分数</label><input type="number" name="mmlu" value="${data.mmlu || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">HumanEval分数</label><input type="number" name="humaneval" value="${data.humaneval || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">输入价格($/1K)</label><input type="number" name="input_price" value="${data.input_price || ''}" step="0.001" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">输出价格($/1K)</label><input type="number" name="output_price" value="${data.output_price || ''}" step="0.001" 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="license" value="${data.license || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
</div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">描述</label><textarea name="description" rows="3" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea></div>
|
||||
</form>
|
||||
`;
|
||||
}
|
||||
|
||||
function getGpuForm(data = {}) {
|
||||
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">名称 *</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="manufacturer" value="${data.manufacturer || ''}" 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="architecture" value="${data.architecture || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">显存(GB) *</label>
|
||||
<input type="number" name="memory_gb" value="${data.memory_gb || ''}" required class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">CUDA核心</label>
|
||||
<input type="number" name="cuda_cores" value="${data.cuda_cores || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">Tensor核心</label>
|
||||
<input type="number" name="tensor_cores" value="${data.tensor_cores || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">显存带宽(GB/s)</label>
|
||||
<input type="number" name="memory_bandwidth_gbs" value="${data.memory_bandwidth_gbs || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">FP32性能(TF)</label>
|
||||
<input type="number" name="fp32_tflops" value="${data.fp32_tflops || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">FP16性能(TF)</label>
|
||||
<input type="number" name="fp16_tflops" value="${data.fp16_tflops || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">INT8性能(TOP)</label>
|
||||
<input type="number" name="int8_perf_tops" value="${data.int8_perf_tops || ''}" 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="number" name="price_usd" value="${data.price_usd || ''}" 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="number" name="release_year" value="${data.release_year || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">描述</label>
|
||||
<textarea name="description" rows="3" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea>
|
||||
<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="manufacturer" value="${data.manufacturer || ''}" 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="architecture" value="${data.architecture || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">显存(GB) *</label><input type="number" name="memory_gb" value="${data.memory_gb || ''}" required class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">CUDA核心</label><input type="number" name="cuda_cores" value="${data.cuda_cores || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">Tensor核心</label><input type="number" name="tensor_cores" value="${data.tensor_cores || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">显存带宽(GB/s)</label><input type="number" name="memory_bandwidth_gbs" value="${data.memory_bandwidth_gbs || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">FP32性能(TF)</label><input type="number" name="fp32_tflops" value="${data.fp32_tflops || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">FP16性能(TF)</label><input type="number" name="fp16_tflops" value="${data.fp16_tflops || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">INT8性能(TOP)</label><input type="number" name="int8_perf_tops" value="${data.int8_perf_tops || ''}" 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="number" name="price_usd" value="${data.price_usd || ''}" 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="number" name="release_year" value="${data.release_year || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
</div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">描述</label><textarea name="description" rows="3" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea></div>
|
||||
</form>
|
||||
`;
|
||||
}
|
||||
@@ -592,65 +734,27 @@
|
||||
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">名称 *</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="manufacturer" value="${data.manufacturer || ''}" 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="architecture" value="${data.architecture || ''}" 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="number" name="cores" value="${data.cores || ''}" 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="number" name="threads" value="${data.threads || ''}" required class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">基础频率(GHz)</label>
|
||||
<input type="number" name="base_clock_ghz" value="${data.base_clock_ghz || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">加速频率(GHz)</label>
|
||||
<input type="number" name="boost_clock_ghz" value="${data.boost_clock_ghz || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">L3缓存(MB)</label>
|
||||
<input type="number" name="l3_cache_mb" value="${data.l3_cache_mb || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">TDP功耗(W)</label>
|
||||
<input type="number" name="tdp_watts" value="${data.tdp_watts || ''}" 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="number" name="price_usd" value="${data.price_usd || ''}" 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="number" name="release_year" value="${data.release_year || ''}" class="w-full px-3 py-2 border rounded-lg">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-sm text-gray-600 mb-1 block">描述</label>
|
||||
<textarea name="description" rows="3" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea>
|
||||
<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="manufacturer" value="${data.manufacturer || ''}" 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="architecture" value="${data.architecture || ''}" 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="number" name="cores" value="${data.cores || ''}" 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="number" name="threads" value="${data.threads || ''}" required class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">基础频率(GHz)</label><input type="number" name="base_clock_ghz" value="${data.base_clock_ghz || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">加速频率(GHz)</label><input type="number" name="boost_clock_ghz" value="${data.boost_clock_ghz || ''}" step="0.1" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">L3缓存(MB)</label><input type="number" name="l3_cache_mb" value="${data.l3_cache_mb || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">TDP功耗(W)</label><input type="number" name="tdp_watts" value="${data.tdp_watts || ''}" 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="number" name="price_usd" value="${data.price_usd || ''}" 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="number" name="release_year" value="${data.release_year || ''}" class="w-full px-3 py-2 border rounded-lg"></div>
|
||||
</div>
|
||||
<div><label class="text-sm text-gray-600 mb-1 block">描述</label><textarea name="description" rows="3" class="w-full px-3 py-2 border rounded-lg">${data.description || ''}</textarea></div>
|
||||
</form>
|
||||
`;
|
||||
}
|
||||
|
||||
// 点击弹窗外部关闭
|
||||
document.getElementById('editModal').addEventListener('click', function(e) {
|
||||
if (e.target === this) closeModal();
|
||||
});
|
||||
|
||||
// 初始化
|
||||
loadOverview();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user