左侧导航栏样式做到了统一

.claude/settings.local.json

@@ -37,7 +37,9 @@
       "Bash(mysql:*)",
       "Bash(ls:*)",
       "Bash(xargs:*)",
-      "Bash(/root/miniconda3/bin/pip install psutil)"
+      "Bash(/root/miniconda3/bin/pip install psutil)",
+      "Bash(python -m py_compile:*)",
+      "Bash(git checkout:*)"
     ]
   }
 }

src/api/datasets.py

@@ -171,13 +171,26 @@ def delete_dataset(id):
 
 # ============ 数据集文件上传接口 ============
 
-@datasets_bp.route('/upload/<int:dataset_id>', methods=['POST'])
+def make_response_with_cors(data, status=200):
+    """创建带CORS头的响应"""
+    response = jsonify(data)
+    response.headers['Access-Control-Allow-Origin'] = '*'
+    response.headers['Access-Control-Allow-Methods'] = 'GET, POST, OPTIONS'
+    response.headers['Access-Control-Allow-Headers'] = 'Content-Type'
+    return response
+
+@datasets_bp.route('/upload/<int:dataset_id>', methods=['POST', 'OPTIONS'])
 def upload_dataset_file(dataset_id):
     """上传数据集文件"""
+    # 处理 OPTIONS 预检请求
+    if request.method == 'OPTIONS':
+        response = make_response_with_cors({'status': 'ok'})
+        return response
+
     # 检查数据集是否存在
     dataset = generic_get_by_id('dataset_manage', dataset_id)
     if not dataset:
-        return jsonify({'code': 1, 'message': '数据集不存在'})
+        return make_response_with_cors({'code': 1, 'message': '数据集不存在'})
 
     # 确保上传目录存在（datasets根目录）
     os.makedirs(DATASET_FOLDER, exist_ok=True)
@@ -186,7 +199,7 @@ def upload_dataset_file(dataset_id):
     errors = []
 
     if 'files' not in request.files:
-        return jsonify({'code': 1, 'message': '没有文件被上传'})
+        return make_response_with_cors({'code': 1, 'message': '没有文件被上传'})
 
     files = request.files.getlist('files')
 
@@ -205,8 +218,9 @@ def upload_dataset_file(dataset_id):
             file.save(file_path)
             file_size = os.path.getsize(file_path)
 
-            # 获取文件扩展名
-            ext = filename.rsplit('.', 1)[1].lower()
+            # 获取文件扩展名（安全处理无扩展名的情况）
+            parts = filename.rsplit('.', 1)
+            ext = parts[1].lower() if len(parts) > 1 else 'unknown'
 
             # 保存文件信息到数据库
             conn = get_db_connection()
@@ -245,7 +259,7 @@ def upload_dataset_file(dataset_id):
         conn.close()
 
     if errors:
-        return jsonify({
+        return make_response_with_cors({
             'code': 0,
             'message': f'部分文件上传成功，{len(errors)}个文件失败',
             'data': {
@@ -254,7 +268,7 @@ def upload_dataset_file(dataset_id):
             }
         })
 
-    return jsonify({
+    return make_response_with_cors({
         'code': 0,
         'message': f'成功上传 {len(uploaded_files)} 个文件',
         'data': {

web/pages/components/sidebar.html

@@ -0,0 +1,164 @@
+<!-- 共享侧边栏组件 -->
+<!-- 使用方法：在页面中通过 JavaScript 动态加载此组件 -->
+
+<!-- 侧边导航 -->
+<aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
+    <!-- 平台LOGO区域 -->
+    <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+        <img src="assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+        <span class="text-white font-medium text-base">远光软件微调平台</span>
+    </div>
+
+    <!-- 导航主区域 -->
+    <nav class="flex-1 overflow-y-auto py-2 relative">
+        <!-- 滑块指示器 -->
+        <div class="sidebar-slider" id="sidebar-slider"></div>
+
+        <!-- 第一分区：模型服务 -->
+        <div class="sidebar-section-title">模型服务</div>
+        <div class="nav-item-wrapper">
+            <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-cogs w-5 text-center"></i>
+                <span class="ml-2">模型调优</span>
+            </a>
+        </div>
+        <div class="nav-item-wrapper">
+            <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-database w-5 text-center"></i>
+                <span class="ml-2">我的模型</span>
+            </a>
+        </div>
+        <div class="nav-item-wrapper">
+            <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-line-chart w-5 text-center"></i>
+                <span class="ml-2">模型评测</span>
+            </a>
+        </div>
+        <div class="nav-item-wrapper">
+            <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-server w-5 text-center"></i>
+                <span class="ml-2">模型对比</span>
+            </a>
+        </div>
+
+        <!-- 第二分区：资源管理 -->
+        <div class="sidebar-section-title mt-6">资源管理</div>
+        <div class="nav-item-wrapper">
+            <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-cube w-5 text-center"></i>
+                <span class="ml-2">模型管理</span>
+            </a>
+        </div>
+        <div class="nav-item-wrapper">
+            <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-file-text w-5 text-center"></i>
+                <span class="ml-2">数据集管理</span>
+            </a>
+        </div>
+        <div class="nav-item-wrapper">
+            <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-database w-5 text-center"></i>
+                <span class="ml-2">其他工具</span>
+            </a>
+        </div>
+
+        <!-- 第三分区：系统设置 -->
+        <div class="sidebar-section-title mt-6">系统设置</div>
+        <div class="nav-item-wrapper">
+            <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                <i class="fa fa-bar-chart w-5 text-center"></i>
+                <span class="ml-2">平台性能</span>
+            </a>
+        </div>
+    </nav>
+
+    <!-- 底部信息区域 -->
+    <div class="p-4 border-t border-[#001529]/30 text-xs mt-auto">
+        <div class="mb-2 text-[#bfcbd9]/80">默认业务空间</div>
+        <div class="flex items-center justify-between">
+            <span class="text-[#bfcbd9]">版本 v1.0.0</span>
+            <i class="fa fa-question-circle-o text-[#bfcbd9]/70"></i>
+        </div>
+    </div>
+</aside>
+
+<style>
+    .sidebar-section-title {
+        padding: 0.5rem 1rem;
+        font-size: 0.75rem;
+        color: rgba(191, 203, 217, 0.7);
+        font-weight: 500;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+    }
+    .nav-link:hover {
+        background-color: rgba(0, 21, 41, 0.2);
+    }
+    .sidebar-slider {
+        position: absolute;
+        width: 4px;
+        height: 0;
+        background-color: #1890ff;
+        border-radius: 0 2px 2px 0;
+        transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                    height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+        pointer-events: none;
+        z-index: 10;
+    }
+    .nav-item-wrapper {
+        position: relative;
+    }
+    .nav-link {
+        position: relative;
+        z-index: 1;
+    }
+</style>
+
+<script>
+    // 更新侧边栏滑块位置和高亮当前页
+    function initSidebar(currentPage) {
+        // 设置当前页高亮
+        if (currentPage) {
+            document.querySelectorAll('.nav-link').forEach(link => {
+                if (link.dataset.page === currentPage) {
+                    link.classList.add('bg-[#1890ff]/10', 'text-[#1890ff]');
+                    link.classList.remove('hover:bg-[#001529]/20');
+                }
+            });
+        }
+
+        // 更新滑块位置
+        const slider = document.getElementById('sidebar-slider');
+        if (slider) {
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
+
+        // 绑定导航点击事件
+        document.querySelectorAll('.nav-link').forEach(link => {
+            link.addEventListener('click', function(e) {
+                // 如果是当前页的链接，不阻止
+                if (this.dataset.page === currentPage) return;
+                // 外部链接不阻止
+                if (!this.href.includes('main.html')) return;
+                e.preventDefault();
+                window.location.href = this.href;
+            });
+        });
+    }
+
+    // 页面加载后初始化
+    document.addEventListener('DOMContentLoaded', function() {
+        // 延迟执行以确保DOM完全就绪
+        setTimeout(() => {
+            const currentPage = window.currentPageName || 'fine-tune';
+            initSidebar(currentPage);
+        }, 100);
+    });
+</script>

web/pages/custom-tool-create.html

@@ -60,59 +60,98 @@
         .text-primary { color: #1890ff; }
         .border-primary { border-color: #1890ff; }
         :root { --primary: #1890ff; --danger: #f5222d; --success: #52c41a; }
+
+        /* 侧边栏滑块动画 */
+        .sidebar-slider {
+            position: absolute;
+            width: 4px;
+            height: 0;
+            background-color: #1890ff;
+            border-radius: 0 2px 2px 0;
+            transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                        height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            pointer-events: none;
+            z-index: 10;
+        }
+        .nav-item-wrapper {
+            position: relative;
+        }
+        .nav-link {
+            position: relative;
+            z-index: 1;
+        }
     </style>
 </head>
 <body class="antialiased bg-gray-50 flex h-screen overflow-hidden">
     <!-- 侧边导航 -->
     <aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
         <!-- 平台LOGO区域 -->
-        <div class="p-4 border-b border-[#001529]/30 flex items-center">
-            <img src="../assets/logo/logo.png" alt="Logo" class="w-6 h-6 object-contain mr-2">
-            <span class="text-white font-medium">远光软件微调平台</span>
+        <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+            <img src="../assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+            <span class="text-white font-medium text-base">远光软件微调平台</span>
         </div>
 
         <!-- 导航主区域 -->
-        <nav class="flex-1 overflow-y-auto py-2">
+        <nav class="flex-1 overflow-y-auto py-2 relative">
+            <!-- 滑块指示器 -->
+            <div class="sidebar-slider" id="sidebar-slider"></div>
+
             <!-- 第一分区：模型服务 -->
             <div class="sidebar-section-title">模型服务</div>
-            <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cogs w-5 text-center"></i>
-                <span class="ml-2">模型调优</span>
-            </a>
-            <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">我的模型</span>
-            </a>
-            <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-line-chart w-5 text-center"></i>
-                <span class="ml-2">模型评测</span>
-            </a>
-            <a href="main.html?page=model-deploy" data-page="model-deploy" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-server w-5 text-center"></i>
-                <span class="ml-2">模型对比</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cogs w-5 text-center"></i>
+                    <span class="ml-2">模型调优</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">我的模型</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-line-chart w-5 text-center"></i>
+                    <span class="ml-2">模型评测</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-server w-5 text-center"></i>
+                    <span class="ml-2">模型对比</span>
+                </a>
+            </div>
 
             <!-- 第二分区：资源管理 -->
             <div class="sidebar-section-title mt-6">资源管理</div>
-            <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cube w-5 text-center"></i>
-                <span class="ml-2">模型管理</span>
-            </a>
-            <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-file-text w-5 text-center"></i>
-                <span class="ml-2">数据集管理</span>
-            </a>
-            <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">其他工具</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cube w-5 text-center"></i>
+                    <span class="ml-2">模型管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-file-text w-5 text-center"></i>
+                    <span class="ml-2">数据集管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">其他工具</span>
+                </a>
+            </div>
 
             <!-- 第三分区：系统设置 -->
             <div class="sidebar-section-title mt-6">系统设置</div>
-            <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-bar-chart w-5 text-center"></i>
-                <span class="ml-2">平台性能</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-bar-chart w-5 text-center"></i>
+                    <span class="ml-2">平台性能</span>
+                </a>
+            </div>
         </nav>
 
         <!-- 底部信息区域 -->
@@ -271,8 +310,32 @@
                     }
                 });
             });
+
+            // 设置侧边栏当前页高亮
+            const currentPage = 'data-generate';
+            document.querySelectorAll('.nav-link').forEach(link => {
+                if (link.dataset.page === currentPage) {
+                    link.classList.add('bg-[#1890ff]/10', 'text-[#1890ff]');
+                    link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
+                }
+            });
+            updateSidebarSlider();
         });
 
+        // 更新侧边栏滑块位置
+        function updateSidebarSlider() {
+            const slider = document.getElementById('sidebar-slider');
+            if (!slider) return;
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
+
         // 加载工具数据进行编辑
         function loadToolForEdit() {
             const editToolStr = localStorage.getItem('editTool');

web/pages/dataset-create.html

@@ -7,6 +7,18 @@
     <script src="../lib/tailwindcss/tailwind.js"></script>
     <link href="../lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
     <style>
+        /* 侧边栏滑块动画 */
+        .sidebar-slider {
+            position: absolute;
+            width: 4px;
+            height: 0;
+            background-color: #1890ff;
+            border-radius: 0 2px 2px 0;
+            transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                        height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            pointer-events: none;
+            z-index: 10;
+        }
         .sidebar-section-title {
             padding: 0.5rem 1rem;
             font-size: 0.75rem;
@@ -18,6 +30,13 @@
         .nav-link:hover {
             background-color: rgba(0, 21, 41, 0.2);
         }
+        .nav-item-wrapper {
+            position: relative;
+        }
+        .nav-link {
+            position: relative;
+            z-index: 1;
+        }
         .form-input {
             width: 100%;
             padding: 0.5rem 0.75rem;
@@ -71,53 +90,72 @@
     <!-- 侧边导航 -->
     <aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
         <!-- 平台LOGO区域 -->
-        <div class="p-4 border-b border-[#001529]/30 flex items-center">
-            <img src="../assets/logo/logo.png" alt="Logo" class="w-6 h-6 object-contain mr-2">
-            <span class="text-white font-medium">远光软件微调平台</span>
+        <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+            <img src="../assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+            <span class="text-white font-medium text-base">远光软件微调平台</span>
         </div>
 
         <!-- 导航主区域 -->
-        <nav class="flex-1 overflow-y-auto py-2">
+        <nav class="flex-1 overflow-y-auto py-2 relative">
+            <!-- 滑块指示器 -->
+            <div class="sidebar-slider" id="sidebar-slider"></div>
+
             <!-- 第一分区：模型服务 -->
             <div class="sidebar-section-title">模型服务</div>
-            <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cogs w-5 text-center"></i>
-                <span class="ml-2">模型调优</span>
-            </a>
-            <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">我的模型</span>
-            </a>
-            <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-line-chart w-5 text-center"></i>
-                <span class="ml-2">模型评测</span>
-            </a>
-            <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-server w-5 text-center"></i>
-                <span class="ml-2">模型对比</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cogs w-5 text-center"></i>
+                    <span class="ml-2">模型调优</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">我的模型</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-line-chart w-5 text-center"></i>
+                    <span class="ml-2">模型评测</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-server w-5 text-center"></i>
+                    <span class="ml-2">模型对比</span>
+                </a>
+            </div>
 
             <!-- 第二分区：资源管理 -->
             <div class="sidebar-section-title mt-6">资源管理</div>
-            <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cube w-5 text-center"></i>
-                <span class="ml-2">模型管理</span>
-            </a>
-            <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-file-text w-5 text-center"></i>
-                <span class="ml-2">数据集管理</span>
-            </a>
-            <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">其他工具</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cube w-5 text-center"></i>
+                    <span class="ml-2">模型管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-file-text w-5 text-center"></i>
+                    <span class="ml-2">数据集管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">其他工具</span>
+                </a>
+            </div>
 
             <!-- 第三分区：系统设置 -->
             <div class="sidebar-section-title mt-6">系统设置</div>
-            <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-bar-chart w-5 text-center"></i>
-                <span class="ml-2">平台性能</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-bar-chart w-5 text-center"></i>
+                    <span class="ml-2">平台性能</span>
+                </a>
+            </div>
         </nav>
 
         <!-- 底部信息区域 -->
@@ -136,7 +174,7 @@
         <header class="bg-white border-b border-gray-200 shadow-sm">
             <div class="flex items-center justify-between px-6 h-14">
                 <div class="flex items-center space-x-4">
-                    <a href="#" onclick="goBack()" class="text-gray-500 hover:text-gray-700 flex items-center">
+                    <a href="main.html?page=dataset-manage" class="text-gray-500 hover:text-gray-700 flex items-center">
                         <i class="fa fa-arrow-left"></i>
                         <span class="ml-1">上一步</span>
                     </a>
@@ -393,6 +431,28 @@
                 await loadDatasetData(editId);
             }
 
+            // 设置侧边栏当前页高亮
+            const currentPage = 'dataset-manage';
+            document.querySelectorAll('.nav-link').forEach(link => {
+                if (link.dataset.page === currentPage) {
+                    link.classList.add('bg-[#1890ff]/10', 'text-[#1890ff]');
+                    link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
+                }
+            });
+
+            // 更新滑块位置
+            updateSidebarSlider();
+
+            // 绑定导航点击事件
+            document.querySelectorAll('.nav-link').forEach(link => {
+                link.addEventListener('click', function(e) {
+                    if (!this.href.includes('dataset-create')) {
+                        e.preventDefault();
+                        window.location.href = this.href;
+                    }
+                });
+            });
+
             // 文件上传区域拖拽逻辑
             const uploadArea = document.getElementById('upload-area');
             const fileUpload = document.getElementById('file-upload');
@@ -436,29 +496,25 @@
                 fileUpload.value = '';
             });
 
-            // 绑定导航点击事件
-            document.querySelectorAll('.nav-link').forEach(link => {
-                link.addEventListener('click', function(e) {
-                    if (!this.href.includes('dataset-create')) {
-                        e.preventDefault();
-                        window.location.href = this.href;
-                    }
-                });
-            });
-
             // 初始化单选框选中样式
             initRadioStyles();
-
-            // 设置侧边栏当前页高亮
-            const currentPage = 'dataset-manage';
-            document.querySelectorAll('.nav-link').forEach(link => {
-                if (link.dataset.page === currentPage) {
-                    link.classList.add('active');
-                    link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
-                }
-            });
         });
 
+        // 更新侧边栏滑块位置
+        function updateSidebarSlider() {
+            const slider = document.getElementById('sidebar-slider');
+            if (!slider) return;
+
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
+
         // 加载数据集数据（编辑模式）
         async function loadDatasetData(id) {
             try {
@@ -746,13 +802,6 @@
             }
         }
 
-        // 清空所有文件
-        function clearAllFiles() {
-            selectedFiles = [];
-            updateDataStats();
-            renderFileList();
-        }
-
         // 渲染文件列表
         function renderFileList() {
             const fileListEl = document.getElementById('fileList');

web/pages/dataset-preview.html

@@ -26,59 +26,98 @@
         .text-primary { color: #1890ff; }
         .bg-primary { background-color: #1890ff; }
         .text-danger { color: #f5222d; }
+
+        /* 侧边栏滑块动画 */
+        .sidebar-slider {
+            position: absolute;
+            width: 4px;
+            height: 0;
+            background-color: #1890ff;
+            border-radius: 0 2px 2px 0;
+            transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                        height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            pointer-events: none;
+            z-index: 10;
+        }
+        .nav-item-wrapper {
+            position: relative;
+        }
+        .nav-link {
+            position: relative;
+            z-index: 1;
+        }
     </style>
 </head>
 <body class="antialiased bg-gray-50 flex h-screen overflow-hidden">
     <!-- 侧边导航 -->
     <aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
         <!-- 平台LOGO区域 -->
-        <div class="p-4 border-b border-[#001529]/30 flex items-center">
-            <img src="../assets/logo/logo.png" alt="Logo" class="w-6 h-6 object-contain mr-2">
-            <span class="text-white font-medium">远光软件微调平台</span>
+        <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+            <img src="../assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+            <span class="text-white font-medium text-base">远光软件微调平台</span>
         </div>
 
         <!-- 导航主区域 -->
-        <nav class="flex-1 overflow-y-auto py-2">
+        <nav class="flex-1 overflow-y-auto py-2 relative">
+            <!-- 滑块指示器 -->
+            <div class="sidebar-slider" id="sidebar-slider"></div>
+
             <!-- 第一分区：模型服务 -->
             <div class="sidebar-section-title">模型服务</div>
-            <a href="#" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cogs w-5 text-center"></i>
-                <span class="ml-2">模型调优</span>
-            </a>
-            <a href="#" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">我的模型</span>
-            </a>
-            <a href="#" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-line-chart w-5 text-center"></i>
-                <span class="ml-2">模型评测</span>
-            </a>
-            <a href="#" data-page="model-deploy" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-server w-5 text-center"></i>
-                <span class="ml-2">模型对比</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cogs w-5 text-center"></i>
+                    <span class="ml-2">模型调优</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">我的模型</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-line-chart w-5 text-center"></i>
+                    <span class="ml-2">模型评测</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-server w-5 text-center"></i>
+                    <span class="ml-2">模型对比</span>
+                </a>
+            </div>
 
             <!-- 第二分区：资源管理 -->
             <div class="sidebar-section-title mt-6">资源管理</div>
-            <a href="#" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cube w-5 text-center"></i>
-                <span class="ml-2">模型管理</span>
-            </a>
-            <a href="#" data-page="dataset-manage" class="nav-link sidebar-item-active flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-file-text w-5 text-center"></i>
-                <span class="ml-2">数据集管理</span>
-            </a>
-            <a href="#" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">其他工具</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cube w-5 text-center"></i>
+                    <span class="ml-2">模型管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-file-text w-5 text-center"></i>
+                    <span class="ml-2">数据集管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">其他工具</span>
+                </a>
+            </div>
 
             <!-- 第三分区：系统设置 -->
             <div class="sidebar-section-title mt-6">系统设置</div>
-            <a href="#" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-bar-chart w-5 text-center"></i>
-                <span class="ml-2">平台性能</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-bar-chart w-5 text-center"></i>
+                    <span class="ml-2">平台性能</span>
+                </a>
+            </div>
         </nav>
 
         <!-- 底部信息区域 -->
@@ -199,10 +238,34 @@
                 });
             });
 
+            // 设置侧边栏当前页高亮
+            const currentPage = 'dataset-manage';
+            document.querySelectorAll('.nav-link').forEach(link => {
+                if (link.dataset.page === currentPage) {
+                    link.classList.add('bg-[#1890ff]/10', 'text-[#1890ff]');
+                    link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
+                }
+            });
+            updateSidebarSlider();
+
             // 加载数据集信息
             loadDataset();
         });
 
+        // 更新侧边栏滑块位置
+        function updateSidebarSlider() {
+            const slider = document.getElementById('sidebar-slider');
+            if (!slider) return;
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
+
         // 加载数据集信息
         async function loadDataset() {
             if (!datasetId) {

web/pages/fine-tune-create.html

@@ -18,6 +18,25 @@
         .nav-link:hover {
             background-color: rgba(0, 21, 41, 0.2);
         }
+        /* 侧边栏滑块动画 */
+        .sidebar-slider {
+            position: absolute;
+            width: 4px;
+            height: 0;
+            background-color: #1890ff;
+            border-radius: 0 2px 2px 0;
+            transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                        height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            pointer-events: none;
+            z-index: 10;
+        }
+        .nav-item-wrapper {
+            position: relative;
+        }
+        .nav-link {
+            position: relative;
+            z-index: 1;
+        }
         .form-input {
             width: 100%;
             padding: 0.5rem 0.75rem;
@@ -73,53 +92,72 @@
     <!-- 侧边导航 -->
     <aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
         <!-- 平台LOGO区域 -->
-        <div class="p-4 border-b border-[#001529]/30 flex items-center">
-            <img src="../assets/logo/logo.png" alt="Logo" class="w-6 h-6 object-contain mr-2">
-            <span class="text-white font-medium">远光软件微调平台</span>
+        <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+            <img src="../assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+            <span class="text-white font-medium text-base">远光软件微调平台</span>
         </div>
 
         <!-- 导航主区域 -->
-        <nav class="flex-1 overflow-y-auto py-2">
+        <nav class="flex-1 overflow-y-auto py-2 relative">
+            <!-- 滑块指示器 -->
+            <div class="sidebar-slider" id="sidebar-slider"></div>
+
             <!-- 第一分区：模型服务 -->
             <div class="sidebar-section-title">模型服务</div>
-            <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cogs w-5 text-center"></i>
-                <span class="ml-2">模型调优</span>
-            </a>
-            <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">我的模型</span>
-            </a>
-            <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-line-chart w-5 text-center"></i>
-                <span class="ml-2">模型评测</span>
-            </a>
-            <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-server w-5 text-center"></i>
-                <span class="ml-2">模型对比</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cogs w-5 text-center"></i>
+                    <span class="ml-2">模型调优</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">我的模型</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-line-chart w-5 text-center"></i>
+                    <span class="ml-2">模型评测</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-server w-5 text-center"></i>
+                    <span class="ml-2">模型对比</span>
+                </a>
+            </div>
 
             <!-- 第二分区：资源管理 -->
             <div class="sidebar-section-title mt-6">资源管理</div>
-            <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cube w-5 text-center"></i>
-                <span class="ml-2">模型管理</span>
-            </a>
-            <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-file-text w-5 text-center"></i>
-                <span class="ml-2">数据集管理</span>
-            </a>
-            <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">其他工具</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cube w-5 text-center"></i>
+                    <span class="ml-2">模型管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-file-text w-5 text-center"></i>
+                    <span class="ml-2">数据集管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">其他工具</span>
+                </a>
+            </div>
 
             <!-- 第三分区：系统设置 -->
             <div class="sidebar-section-title mt-6">系统设置</div>
-            <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-bar-chart w-5 text-center"></i>
-                <span class="ml-2">平台性能</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-bar-chart w-5 text-center"></i>
+                    <span class="ml-2">平台性能</span>
+                </a>
+            </div>
         </nav>
 
         <!-- 底部信息区域 -->
@@ -593,10 +631,11 @@
             const currentPage = 'fine-tune';
             document.querySelectorAll('.nav-link').forEach(link => {
                 if (link.dataset.page === currentPage) {
-                    link.classList.add('active');
+                    link.classList.add('bg-[#1890ff]/10', 'text-[#1890ff]');
                     link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
                 }
             });
+            updateSidebarSlider();
 
             // 绑定导航点击事件
             document.querySelectorAll('.nav-link').forEach(link => {
@@ -609,6 +648,20 @@
             });
         });
 
+        // 更新侧边栏滑块位置
+        function updateSidebarSlider() {
+            const slider = document.getElementById('sidebar-slider');
+            if (!slider) return;
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
+
         // 切换验证集切分方式
         function toggleValidSplit() {
             const validSplit = document.querySelector('input[name="valid_split"]:checked').value;

web/pages/main.html

@@ -393,18 +393,12 @@
             },
             'model-eval': {
                 title: '模型评测',
-                api: 'model-eval',
-                hasCreate: true,
-                createText: '新建评测',
-                columns: [
-                    { title: '模型名称', key: 'model_name' },
-                    { title: '数据集', key: 'dataset' },
-                    { title: '指标', key: 'metric' },
-                    { title: '得分', key: 'score', render: (val) => val ? `${val}%` : '-' },
-                    { title: '状态', key: 'status' },
-                    { title: '创建时间', key: 'create_time', render: (val) => val ? new Date(val).toLocaleString('zh-CN') : '-' }
-                ],
-                actions: ['report', 'delete']
+                isExternalPage: true,
+                createConfig: {
+                    page: 'model-eval-create',
+                    hasCreate: true,
+                    createText: '新建评测'
+                }
             },
             'model-compare': {
                 title: '模型对比',
@@ -682,7 +676,39 @@
                         const scriptContent = scriptMatch ? scriptMatch[1] : '';
                         // 移除脚本标签后插入HTML
                         const htmlWithoutScript = html.replace(/<script>[\s\S]*?<\/script>/g, '');
-                        container.innerHTML = htmlWithoutScript;
+
+                        // 如果有创建配置，添加 Tab 切换和创建按钮
+                        let headerHtml = '';
+                        if (config.createConfig && config.createConfig.hasCreate) {
+                            headerHtml = `
+                                <div class="bg-white rounded-lg shadow-sm mb-6 p-4 border-b border-gray-100 flex items-center justify-between">
+                                    <div class="flex items-center space-x-8">
+                                        <button class="tab-btn active pb-3 text-sm font-medium flex items-center text-primary" data-tab="tasks" onclick="switchTab(this, 'tasks')">
+                                            <i class="fa fa-tasks mr-2"></i>评测任务
+                                        </button>
+                                        <button class="tab-btn pb-3 text-sm font-medium flex items-center text-gray-500" data-tab="leaderboard" onclick="switchTab(this, 'leaderboard')">
+                                            <i class="fa fa-trophy mr-2"></i>排行榜
+                                        </button>
+                                        <button class="tab-btn pb-3 text-sm font-medium flex items-center text-gray-500" data-tab="dimensions" onclick="switchTab(this, 'dimensions')">
+                                            <i class="fa fa-sliders mr-2"></i>评测维度
+                                        </button>
+                                    </div>
+                                    <div id="headerActionButtons">
+                                        <button onclick="navigateToPage('${config.createConfig.page}')" class="bg-primary text-white px-4 py-2 rounded-lg text-sm hover:bg-primary/90 transition-colors flex items-center">
+                                            <i class="fa fa-plus mr-2"></i>${config.createConfig.createText}
+                                        </button>
+                                    </div>
+                                </div>
+                                <style>
+                                    .tab-btn { position: relative; transition: all 0.2s; }
+                                    .tab-btn.active { color: #1890ff; }
+                                    .tab-btn.active::after { content: ''; position: absolute; bottom: -16px; left: 0; right: 0; height: 2px; background-color: #1890ff; }
+                                    .tab-btn:hover:not(.active) { color: #1890ff; }
+                                </style>
+                            `;
+                        }
+
+                        container.innerHTML = headerHtml + htmlWithoutScript;
                         // 执行脚本
                         if (scriptContent) {
                             try {
@@ -2341,6 +2367,56 @@
                 showMessage('错误', '创建失败: ' + error.message, 'error');
             }
         }
+
+        // 跳转到页面
+        function navigateToPage(pageName) {
+            // 如果页面名以 -create 结尾，直接跳转到 HTML 页面
+            if (pageName.endsWith('-create')) {
+                window.location.href = `${pageName}.html`;
+            } else {
+                window.location.href = `main.html?page=${pageName}`;
+            }
+        }
+
+        // 切换 Tab
+        function switchTab(btn, tabId) {
+            // 更新按钮状态
+            const parent = btn.parentElement;
+            parent.querySelectorAll('.tab-btn').forEach(b => {
+                b.classList.remove('active', 'text-primary');
+                b.classList.add('text-gray-500');
+            });
+            btn.classList.add('active');
+            btn.classList.remove('text-gray-500');
+
+            // 更新内容显示 - 需要通知外部页面
+            if (typeof window.switchTabContent === 'function') {
+                window.switchTabContent(tabId);
+            }
+
+            // 更新右侧按钮 - 从 tableConfigs 获取当前页面配置
+            const btnContainer = document.getElementById('headerActionButtons');
+            const currentConfig = tableConfigs[currentPage];
+            if (btnContainer) {
+                if (tabId === 'tasks') {
+                    const page = currentConfig?.createConfig?.page || 'model-eval-create';
+                    const text = currentConfig?.createConfig?.createText || '新建评测';
+                    btnContainer.innerHTML = `
+                        <button onclick="navigateToPage('${page}')" class="bg-primary text-white px-4 py-2 rounded-lg text-sm hover:bg-primary/90 transition-colors flex items-center">
+                            <i class="fa fa-plus mr-2"></i>${text}
+                        </button>
+                    `;
+                } else if (tabId === 'leaderboard') {
+                    btnContainer.innerHTML = ''; // 排行榜隐藏按钮
+                } else if (tabId === 'dimensions') {
+                    btnContainer.innerHTML = `
+                        <button onclick="addDimension()" class="bg-primary text-white px-4 py-2 rounded-lg text-sm hover:bg-primary/90 transition-colors flex items-center">
+                            <i class="fa fa-plus mr-2"></i>添加维度
+                        </button>
+                    `;
+                }
+            }
+        }
     </script>
 
     <!-- 自定义消息弹窗 -->

web/pages/model-compare-chat.html

@@ -101,123 +101,134 @@
     </style>
 </head>
 <body class="antialiased bg-gray-50">
-    <!-- 面包屑 -->
-    <div class="flex items-center text-sm mb-6">
-        <a href="main.html?page=model-compare" class="text-primary hover:underline">模型对比</a>
-        <span class="mx-2 text-gray-300">/</span>
-        <span id="breadcrumbTask" class="text-gray-800 font-medium">对比任务</span>
+    <!-- 主内容区域 - 由 main.html 提供侧边栏和顶部导航 -->
+    <div class="bg-white rounded-lg shadow-sm">
+        <!-- 面包屑导航和返回按钮 -->
+        <div class="px-4 py-3 border-b border-gray-100 flex items-center justify-between">
+            <div class="flex items-center text-sm">
+                <a href="main.html?page=model-compare" class="text-primary hover:underline">模型对比</a>
+                <span class="mx-2 text-gray-300">/</span>
+                <span class="text-gray-800 font-medium" id="breadcrumbTask">对话</span>
+            </div>
+            <a href="main.html?page=model-compare" class="text-gray-500 hover:text-gray-700 text-sm flex items-center">
+                <i class="fa fa-arrow-left mr-1"></i>返回列表
+            </a>
+        </div>
+
+        <!-- 页面内容 -->
+        <div class="p-6">
+        <form id="chatForm">
+            <!-- 已配置模型展示 -->
+            <div class="mb-6">
+                <label class="form-label flex items-center mb-3">
+                    <i class="fa fa-server text-primary mr-2"></i>
+                    已配置模型
+                    <span class="ml-2 text-xs text-gray-400 font-normal">（共 <span id="modelCount">0</span> 个）</span>
+                </label>
+                <div id="selectedModelsList" class="flex flex-wrap gap-2">
+                    <!-- 模型标签将通过JS渲染 -->
+                </div>
+            </div>
+
+            <!-- 系统提示词 -->
+            <div class="mb-5">
+                <label class="form-label flex items-center">
+                    <i class="fa fa-cog text-primary mr-2"></i>
+                    系统提示词
+                    <span class="ml-2 text-xs text-gray-400 font-normal">（可选，设置模型行为）</span>
+                </label>
+                <textarea id="systemPrompt" class="form-input" rows="3"
+                    placeholder="例如：你是一个专业的技术助手，善于回答各类问题。请用简洁清晰的语言回答。"></textarea>
+            </div>
+
+            <!-- 用户提问 -->
+            <div class="mb-5">
+                <label class="form-label flex items-center">
+                    <i class="fa fa-comment text-primary mr-2"></i>
+                    用户提问
+                    <span class="text-red-500 ml-1">*</span>
+                </label>
+                <textarea id="userQuestion" class="form-input" rows="4"
+                    placeholder="请输入您想要对比的问题..."></textarea>
+            </div>
+
+            <!-- 推理参数设置 -->
+            <div class="mb-6">
+                <label class="form-label flex items-center mb-4">
+                    <i class="fa fa-sliders text-primary mr-2"></i>
+                    推理参数设置
+                </label>
+                <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
+                    <!-- Temperature -->
+                    <div>
+                        <div class="flex items-center justify-between mb-2">
+                            <span class="text-sm text-gray-600">Temperature</span>
+                            <span id="tempValue" class="text-sm text-primary font-medium">0.7</span>
+                        </div>
+                        <input type="range" id="temperature" class="slider-thumb" min="0" max="2" step="0.1" value="0.7">
+                        <div class="flex justify-between text-xs text-gray-400 mt-1">
+                            <span>保守</span>
+                            <span>随机</span>
+                        </div>
+                    </div>
+
+                    <!-- Top-p -->
+                    <div>
+                        <div class="flex items-center justify-between mb-2">
+                            <span class="text-sm text-gray-600">Top-p</span>
+                            <span id="topPValue" class="text-sm text-primary font-medium">0.9</span>
+                        </div>
+                        <input type="range" id="topP" class="slider-thumb" min="0" max="1" step="0.05" value="0.9">
+                        <div class="flex justify-between text-xs text-gray-400 mt-1">
+                            <span>集中</span>
+                            <span>广泛</span>
+                        </div>
+                    </div>
+
+                    <!-- Top-k -->
+                    <div>
+                        <div class="flex items-center justify-between mb-2">
+                            <span class="text-sm text-gray-600">Top-k</span>
+                            <span id="topKValue" class="text-sm text-primary font-medium">50</span>
+                        </div>
+                        <input type="range" id="topK" class="slider-thumb" min="1" max="100" step="1" value="50">
+                        <div class="flex justify-between text-xs text-gray-400 mt-1">
+                            <span>精确</span>
+                            <span>多样</span>
+                        </div>
+                    </div>
+
+                    <!-- Max Tokens -->
+                    <div>
+                        <div class="flex items-center justify-between mb-2">
+                            <span class="text-sm text-gray-600">Max Tokens</span>
+                            <span id="maxTokensValue" class="text-sm text-primary font-medium">2048</span>
+                        </div>
+                        <input type="range" id="maxTokens" class="slider-thumb" min="256" max="4096" step="256" value="2048">
+                        <div class="flex justify-between text-xs text-gray-400 mt-1">
+                            <span>短</span>
+                            <span>长</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- 按钮区域 -->
+            <div class="flex items-center justify-end pt-4 border-t border-gray-100">
+                <div class="flex items-center space-x-3">
+                    <button type="button" onclick="goBack()" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-lg text-sm hover:bg-gray-300 transition-colors">
+                        取消
+                    </button>
+                    <button type="button" id="startBtn" class="px-6 py-2 bg-primary text-white rounded-lg text-sm hover:bg-primary/90 transition-colors flex items-center disabled:opacity-50 disabled:cursor-not-allowed">
+                        <i class="fa fa-play mr-2"></i>
+                        开始提问
+                    </button>
+                </div>
+            </div>
+        </form>
+        </div>
     </div>
 
-    <form id="chatForm">
-        <!-- 已配置模型展示 -->
-        <div class="mb-6">
-            <label class="form-label flex items-center mb-3">
-                <i class="fa fa-server text-primary mr-2"></i>
-                已配置模型
-                <span class="ml-2 text-xs text-gray-400 font-normal">（共 <span id="modelCount">0</span> 个）</span>
-            </label>
-            <div id="selectedModelsList" class="flex flex-wrap gap-2">
-                <!-- 模型标签将通过JS渲染 -->
-            </div>
-        </div>
-
-        <!-- 系统提示词 -->
-        <div class="mb-5">
-            <label class="form-label flex items-center">
-                <i class="fa fa-cog text-primary mr-2"></i>
-                系统提示词
-                <span class="ml-2 text-xs text-gray-400 font-normal">（可选，设置模型行为）</span>
-            </label>
-            <textarea id="systemPrompt" class="form-input" rows="3"
-                placeholder="例如：你是一个专业的技术助手，善于回答各类问题。请用简洁清晰的语言回答。"></textarea>
-        </div>
-
-        <!-- 用户提问 -->
-        <div class="mb-5">
-            <label class="form-label flex items-center">
-                <i class="fa fa-comment text-primary mr-2"></i>
-                用户提问
-                <span class="text-red-500 ml-1">*</span>
-            </label>
-            <textarea id="userQuestion" class="form-input" rows="4"
-                placeholder="请输入您想要对比的问题..."></textarea>
-        </div>
-
-        <!-- 推理参数设置 -->
-        <div class="mb-6">
-            <label class="form-label flex items-center mb-4">
-                <i class="fa fa-sliders text-primary mr-2"></i>
-                推理参数设置
-            </label>
-            <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
-                <!-- Temperature -->
-                <div>
-                    <div class="flex items-center justify-between mb-2">
-                        <span class="text-sm text-gray-600">Temperature</span>
-                        <span id="tempValue" class="text-sm text-primary font-medium">0.7</span>
-                    </div>
-                    <input type="range" id="temperature" class="slider-thumb" min="0" max="2" step="0.1" value="0.7">
-                    <div class="flex justify-between text-xs text-gray-400 mt-1">
-                        <span>保守</span>
-                        <span>随机</span>
-                    </div>
-                </div>
-
-                <!-- Top-p -->
-                <div>
-                    <div class="flex items-center justify-between mb-2">
-                        <span class="text-sm text-gray-600">Top-p</span>
-                        <span id="topPValue" class="text-sm text-primary font-medium">0.9</span>
-                    </div>
-                    <input type="range" id="topP" class="slider-thumb" min="0" max="1" step="0.05" value="0.9">
-                    <div class="flex justify-between text-xs text-gray-400 mt-1">
-                        <span>集中</span>
-                        <span>广泛</span>
-                    </div>
-                </div>
-
-                <!-- Top-k -->
-                <div>
-                    <div class="flex items-center justify-between mb-2">
-                        <span class="text-sm text-gray-600">Top-k</span>
-                        <span id="topKValue" class="text-sm text-primary font-medium">50</span>
-                    </div>
-                    <input type="range" id="topK" class="slider-thumb" min="1" max="100" step="1" value="50">
-                    <div class="flex justify-between text-xs text-gray-400 mt-1">
-                        <span>精确</span>
-                        <span>多样</span>
-                    </div>
-                </div>
-
-                <!-- Max Tokens -->
-                <div>
-                    <div class="flex items-center justify-between mb-2">
-                        <span class="text-sm text-gray-600">Max Tokens</span>
-                        <span id="maxTokensValue" class="text-sm text-primary font-medium">2048</span>
-                    </div>
-                    <input type="range" id="maxTokens" class="slider-thumb" min="256" max="4096" step="256" value="2048">
-                    <div class="flex justify-between text-xs text-gray-400 mt-1">
-                        <span>短</span>
-                        <span>长</span>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- 按钮区域 -->
-        <div class="flex items-center justify-end pt-4 border-t border-gray-100">
-            <div class="flex items-center space-x-3">
-                <button type="button" onclick="goBack()" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-lg text-sm hover:bg-gray-300 transition-colors">
-                    取消
-                </button>
-                <button type="button" id="startBtn" class="px-6 py-2 bg-primary text-white rounded-lg text-sm hover:bg-primary/90 transition-colors flex items-center disabled:opacity-50 disabled:cursor-not-allowed">
-                    <i class="fa fa-play mr-2"></i>
-                    开始提问
-                </button>
-            </div>
-        </div>
-    </form>
-
     <script>
         // 动态获取 API 基础地址
         const getApiBase = () => {
@@ -325,7 +336,10 @@
 
         // 更新页面标题
         function updatePageTitle(title) {
-            document.getElementById('breadcrumbTask').textContent = title;
+            const breadcrumb = document.getElementById('breadcrumbTask');
+            if (breadcrumb) {
+                breadcrumb.textContent = title;
+            }
         }
 
         // 加载模型列表

web/pages/model-compare-create.html

@@ -18,9 +18,10 @@
         .nav-link:hover {
             background-color: rgba(0, 21, 41, 0.2);
         }
-        .nav-link.active {
-            background-color: rgba(24, 144, 255, 0.2);
+        .sidebar-item-active {
+            background-color: rgba(24, 144, 255, 0.1);
             color: #1890ff;
+            border-left: 4px solid #1890ff;
         }
         .model-card {
             transition: all 0.2s;
@@ -60,59 +61,98 @@
         .text-primary { color: #1890ff; }
         .border-primary { border-color: #1890ff; }
         :root { --primary: #1890ff; --danger: #f5222d; --success: #52c41a; }
+
+        /* 侧边栏滑块动画 */
+        .sidebar-slider {
+            position: absolute;
+            width: 4px;
+            height: 0;
+            background-color: #1890ff;
+            border-radius: 0 2px 2px 0;
+            transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                        height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            pointer-events: none;
+            z-index: 10;
+        }
+        .nav-item-wrapper {
+            position: relative;
+        }
+        .nav-link {
+            position: relative;
+            z-index: 1;
+        }
     </style>
 </head>
 <body class="antialiased bg-gray-50 flex h-screen overflow-hidden">
     <!-- 侧边导航 -->
     <aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
         <!-- 平台LOGO区域 -->
-        <div class="p-4 border-b border-[#001529]/30 flex items-center">
-            <img src="../assets/logo/logo.png" alt="Logo" class="w-6 h-6 object-contain mr-2">
-            <span class="text-white font-medium">远光软件微调平台</span>
+        <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+            <img src="../assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+            <span class="text-white font-medium text-base">远光软件微调平台</span>
         </div>
 
         <!-- 导航主区域 -->
-        <nav class="flex-1 overflow-y-auto py-2">
+        <nav class="flex-1 overflow-y-auto py-2 relative">
+            <!-- 滑块指示器 -->
+            <div class="sidebar-slider" id="sidebar-slider"></div>
+
             <!-- 第一分区：模型服务 -->
             <div class="sidebar-section-title">模型服务</div>
-            <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cogs w-5 text-center"></i>
-                <span class="ml-2">模型调优</span>
-            </a>
-            <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">我的模型</span>
-            </a>
-            <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-line-chart w-5 text-center"></i>
-                <span class="ml-2">模型评测</span>
-            </a>
-            <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-server w-5 text-center"></i>
-                <span class="ml-2">模型对比</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cogs w-5 text-center"></i>
+                    <span class="ml-2">模型调优</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">我的模型</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-line-chart w-5 text-center"></i>
+                    <span class="ml-2">模型评测</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-server w-5 text-center"></i>
+                    <span class="ml-2">模型对比</span>
+                </a>
+            </div>
 
             <!-- 第二分区：资源管理 -->
             <div class="sidebar-section-title mt-6">资源管理</div>
-            <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cube w-5 text-center"></i>
-                <span class="ml-2">模型管理</span>
-            </a>
-            <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-file-text w-5 text-center"></i>
-                <span class="ml-2">数据集管理</span>
-            </a>
-            <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">其他工具</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cube w-5 text-center"></i>
+                    <span class="ml-2">模型管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-file-text w-5 text-center"></i>
+                    <span class="ml-2">数据集管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">其他工具</span>
+                </a>
+            </div>
 
             <!-- 第三分区：系统设置 -->
             <div class="sidebar-section-title mt-6">系统设置</div>
-            <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-bar-chart w-5 text-center"></i>
-                <span class="ml-2">平台性能</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="#" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-bar-chart w-5 text-center"></i>
+                    <span class="ml-2">平台性能</span>
+                </a>
+            </div>
         </nav>
 
         <!-- 底部信息区域 -->
@@ -151,14 +191,17 @@
 
         <!-- 内容区域 -->
         <main class="flex-1 overflow-y-auto p-6 bg-gray-50">
-            <div class="bg-white rounded-lg shadow-sm">
-                <div class="flex items-center justify-between p-4 border-b border-gray-100">
-                    <div class="flex items-center text-sm">
-                        <a href="main.html?page=model-compare" class="text-primary hover:underline">模型对比</a>
-                        <span class="mx-2 text-gray-300">/</span>
-                        <span class="text-gray-800 font-medium">新建对比</span>
-                    </div>
+            <!-- 页面标题 -->
+            <div class="bg-white rounded-lg shadow-sm w-full p-4 border-b border-gray-100 mb-4">
+                <div class="flex items-center text-sm">
+                    <a href="main.html?page=model-compare" class="text-primary hover:underline">模型对比</a>
+                    <span class="mx-2 text-gray-300">/</span>
+                    <span class="text-gray-800 font-medium">新建对比</span>
                 </div>
+            </div>
+
+            <!-- 表单内容 -->
+            <div class="bg-white rounded-lg shadow-sm w-full">
                 <div class="p-6">
                         <form id="createForm">
                             <!-- 基本信息 -->
@@ -491,6 +534,15 @@
 
         // 页面加载完成后初始化
         document.addEventListener('DOMContentLoaded', function() {
+            // 绑定侧边栏导航点击事件
+            document.querySelectorAll('.nav-link').forEach(link => {
+                link.addEventListener('click', function(e) {
+                    e.preventDefault();
+                    const page = this.dataset.page;
+                    window.location.href = `main.html?page=${page}`;
+                });
+            });
+
             // 绑定输入事件
             const nameInput = document.querySelector('input[name="name"]');
             const descInput = document.querySelector('textarea[name="description"]');
@@ -527,11 +579,26 @@
             const currentPage = 'model-compare';
             document.querySelectorAll('.nav-link').forEach(link => {
                 if (link.dataset.page === currentPage) {
-                    link.classList.add('active');
-                    link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
+                    link.classList.add('sidebar-item-active');
+                    link.classList.remove('hover:bg-[#001529]/20');
                 }
             });
+            updateSidebarSlider();
         });
+
+        // 更新侧边栏滑块位置
+        function updateSidebarSlider() {
+            const slider = document.getElementById('sidebar-slider');
+            if (!slider) return;
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
     </script>
 </body>
 </html>

web/pages/model-compare-result.html

@@ -255,22 +255,17 @@
             window.location.href = `main.html?page=model-compare-chat&id=${compareTaskId}`;
         }
 
-        // 绑定重新提问按钮点击事件
-        function bindRestartBtn() {
-            const restartBtn = document.getElementById('restartBtn');
-            if (restartBtn) {
-                restartBtn.onclick = restartQuestion;
-            }
-        }
-
         // 页面加载完成后初始化
         if (document.readyState === 'loading') {
             document.addEventListener('DOMContentLoaded', initPage);
-            document.addEventListener('DOMContentLoaded', bindRestartBtn);
         } else {
-            // 通过 main.html fetch 加载时，直接绑定
-            setTimeout(bindRestartBtn, 0);
-            setTimeout(initPage, 0);
+            initPage();
+        }
+
+        // 直接绑定按钮点击事件（不依赖 DOMContentLoaded，因为页面可能通过 fetch 加载）
+        const restartBtn = document.getElementById('restartBtn');
+        if (restartBtn) {
+            restartBtn.onclick = restartQuestion;
         }
     </script>
 </body>

web/pages/model-eval-create.html

@@ -7,6 +7,18 @@
     <script src="../lib/tailwindcss/tailwind.js"></script>
     <link href="../lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
     <style>
+        /* 侧边栏滑块动画 */
+        .sidebar-slider {
+            position: absolute;
+            width: 4px;
+            height: 0;
+            background-color: #1890ff;
+            border-radius: 0 2px 2px 0;
+            transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                        height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            pointer-events: none;
+            z-index: 10;
+        }
         .sidebar-section-title {
             padding: 0.5rem 1rem;
             font-size: 0.75rem;
@@ -18,6 +30,13 @@
         .nav-link:hover {
             background-color: rgba(0, 21, 41, 0.2);
         }
+        .nav-item-wrapper {
+            position: relative;
+        }
+        .nav-link {
+            position: relative;
+            z-index: 1;
+        }
         .form-input {
             width: 100%;
             padding: 0.5rem 0.75rem;
@@ -77,53 +96,72 @@
     <!-- 侧边导航 -->
     <aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
         <!-- 平台LOGO区域 -->
-        <div class="p-4 border-b border-[#001529]/30 flex items-center">
-            <img src="../assets/logo/logo.png" alt="Logo" class="w-6 h-6 object-contain mr-2">
-            <span class="text-white font-medium">远光软件微调平台</span>
+        <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+            <img src="../assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+            <span class="text-white font-medium text-base">远光软件微调平台</span>
         </div>
 
         <!-- 导航主区域 -->
-        <nav class="flex-1 overflow-y-auto py-2">
+        <nav class="flex-1 overflow-y-auto py-2 relative">
+            <!-- 滑块指示器 -->
+            <div class="sidebar-slider" id="sidebar-slider"></div>
+
             <!-- 第一分区：模型服务 -->
             <div class="sidebar-section-title">模型服务</div>
-            <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cogs w-5 text-center"></i>
-                <span class="ml-2">模型调优</span>
-            </a>
-            <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">我的模型</span>
-            </a>
-            <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-line-chart w-5 text-center"></i>
-                <span class="ml-2">模型评测</span>
-            </a>
-            <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-server w-5 text-center"></i>
-                <span class="ml-2">模型对比</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cogs w-5 text-center"></i>
+                    <span class="ml-2">模型调优</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">我的模型</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-line-chart w-5 text-center"></i>
+                    <span class="ml-2">模型评测</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-server w-5 text-center"></i>
+                    <span class="ml-2">模型对比</span>
+                </a>
+            </div>
 
             <!-- 第二分区：资源管理 -->
             <div class="sidebar-section-title mt-6">资源管理</div>
-            <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cube w-5 text-center"></i>
-                <span class="ml-2">模型管理</span>
-            </a>
-            <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-file-text w-5 text-center"></i>
-                <span class="ml-2">数据集管理</span>
-            </a>
-            <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">其他工具</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cube w-5 text-center"></i>
+                    <span class="ml-2">模型管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-file-text w-5 text-center"></i>
+                    <span class="ml-2">数据集管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">其他工具</span>
+                </a>
+            </div>
 
             <!-- 第三分区：系统设置 -->
             <div class="sidebar-section-title mt-6">系统设置</div>
-            <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-bar-chart w-5 text-center"></i>
-                <span class="ml-2">平台性能</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-bar-chart w-5 text-center"></i>
+                    <span class="ml-2">平台性能</span>
+                </a>
+            </div>
         </nav>
 
         <!-- 底部信息区域 -->
@@ -350,11 +388,14 @@
             const currentPage = 'model-eval';
             document.querySelectorAll('.nav-link').forEach(link => {
                 if (link.dataset.page === currentPage) {
-                    link.classList.add('active');
+                    link.classList.add('bg-[#1890ff]/10', 'text-[#1890ff]');
                     link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
                 }
             });
 
+            // 更新滑块位置
+            updateSidebarSlider();
+
             // 绑定导航点击事件
             document.querySelectorAll('.nav-link').forEach(link => {
                 link.addEventListener('click', function(e) {
@@ -366,6 +407,21 @@
             });
         });
 
+        // 更新侧边栏滑块位置
+        function updateSidebarSlider() {
+            const slider = document.getElementById('sidebar-slider');
+            if (!slider) return;
+
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
+
         // 切换评测方式
         function toggleEvalType(type) {
             updateEvalTypeStyle(type);

web/pages/model-eval.html

@@ -0,0 +1,291 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>模型评测 / 远光软件微调平台</title>
+    <script src="../lib/tailwindcss/tailwind.js"></script>
+    <link href="../lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
+    <style>
+        .bg-primary { background-color: #1890ff; }
+        .text-primary { color: #1890ff; }
+        .border-primary { border-color: #1890ff; }
+        :root { --primary: #1890ff; }
+    </style>
+</head>
+<body class="antialiased bg-gray-50">
+    <!-- 表格容器 -->
+    <div id="tableContainer">
+        <!-- 评测任务表格 -->
+        <div id="tasksTable" class="tab-content active">
+            <div class="bg-white rounded-lg shadow-sm">
+                <div class="px-6 py-4 border-b border-gray-100">
+                    <h3 class="text-lg font-medium text-gray-800">评测任务列表</h3>
+                </div>
+                <div class="overflow-x-auto">
+                    <table class="w-full">
+                        <thead class="bg-gray-50">
+                            <tr>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">模型名称</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">数据集</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">指标</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">得分</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">状态</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">创建时间</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">操作</th>
+                            </tr>
+                        </thead>
+                        <tbody id="tasksBody" class="bg-white divide-y divide-gray-200">
+                            <!-- 动态加载 -->
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </div>
+
+        <!-- 排行榜表格 -->
+        <div id="leaderboardTable" class="tab-content hidden">
+            <div class="bg-white rounded-lg shadow-sm">
+                <div class="px-6 py-4 border-b border-gray-100">
+                    <h3 class="text-lg font-medium text-gray-800">模型排行榜</h3>
+                </div>
+                <div class="overflow-x-auto">
+                    <table class="w-full">
+                        <thead class="bg-gray-50">
+                            <tr>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">排名</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">模型名称</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">平均得分</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">评测次数</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">最后评测</th>
+                            </tr>
+                        </thead>
+                        <tbody id="leaderboardBody" class="bg-white divide-y divide-gray-200">
+                            <!-- 动态加载 -->
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </div>
+
+        <!-- 评测维度表格 -->
+        <div id="dimensionsTable" class="tab-content hidden">
+            <div class="bg-white rounded-lg shadow-sm">
+                <div class="px-6 py-4 border-b border-gray-100">
+                    <h3 class="text-lg font-medium text-gray-800">评测维度管理</h3>
+                </div>
+                <div class="overflow-x-auto">
+                    <table class="w-full">
+                        <thead class="bg-gray-50">
+                            <tr>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">维度名称</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">指标类型</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">描述</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">状态</th>
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">操作</th>
+                            </tr>
+                        </thead>
+                        <tbody id="dimensionsBody" class="bg-white divide-y divide-gray-200">
+                            <!-- 动态加载 -->
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <script>
+        // 动态获取 API 基础地址
+        const getApiBase = () => {
+            const protocol = window.location.protocol;
+            const hostname = window.location.hostname;
+            return `${protocol}//${hostname}:8080/api`;
+        };
+        const API_BASE = getApiBase();
+
+        // Tab 内容切换函数（供 main.html 调用）
+        window.switchTabContent = function(tabId) {
+            document.querySelectorAll('.tab-content').forEach(content => {
+                content.classList.add('hidden');
+                content.classList.remove('active');
+            });
+            const activeContent = document.getElementById(tabId + 'Table');
+            if (activeContent) {
+                activeContent.classList.remove('hidden');
+                activeContent.classList.add('active');
+            }
+        };
+
+        // 加载评测任务数据
+        async function loadTasks() {
+            try {
+                const response = await fetch(`${API_BASE}/model-eval`);
+                const result = await response.json();
+
+                if (result.code === 0) {
+                    const data = result.data || [];
+                    const tbody = document.getElementById('tasksBody');
+
+                    if (data.length === 0) {
+                        tbody.innerHTML = `
+                            <tr>
+                                <td colspan="7" class="px-6 py-12 text-center text-gray-400">
+                                    <i class="fa fa-inbox text-4xl mb-3"></i>
+                                    <p>暂无评测任务</p>
+                                </td>
+                            </tr>
+                        `;
+                        return;
+                    }
+
+                    tbody.innerHTML = data.map(item => `
+                        <tr class="hover:bg-gray-50">
+                            <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">${item.model_name || '-'}</td>
+                            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.dataset || '-'}</td>
+                            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.metric || '-'}</td>
+                            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.score ? item.score + '%' : '-'}</td>
+                            <td class="px-6 py-4 whitespace-nowrap">
+                                <span class="px-2 py-1 text-xs font-medium rounded-full ${getStatusClass(item.status)}">
+                                    ${item.status || '未知'}
+                                </span>
+                            </td>
+                            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                                ${item.create_time ? new Date(item.create_time).toLocaleString('zh-CN') : '-'}
+                            </td>
+                            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                                <button onclick="viewReport(${item.id})" class="text-primary hover:text-primary/80 mr-3">
+                                    <i class="fa fa-bar-chart"></i> 报告
+                                </button>
+                                <button onclick="deleteTask(${item.id})" class="text-red-500 hover:text-red-600">
+                                    <i class="fa fa-trash"></i> 删除
+                                </button>
+                            </td>
+                        </tr>
+                    `).join('');
+                }
+            } catch (error) {
+                console.error('加载评测任务失败:', error);
+            }
+        }
+
+        // 加载排行榜数据（模拟数据）
+        async function loadLeaderboard() {
+            // 模拟排行榜数据
+            const mockData = [
+                { rank: 1, model_name: 'GPT-4', avg_score: 95.2, eval_count: 128, last_eval: '2026-01-20' },
+                { rank: 2, model_name: 'Claude-3', avg_score: 93.8, eval_count: 96, last_eval: '2026-01-19' },
+                { rank: 3, model_name: '文心一言', avg_score: 89.5, eval_count: 64, last_eval: '2026-01-18' },
+                { rank: 4, model_name: '通义千问', avg_score: 87.3, eval_count: 52, last_eval: '2026-01-17' },
+                { rank: 5, model_name: 'ChatGLM', avg_score: 84.6, eval_count: 45, last_eval: '2026-01-16' }
+            ];
+
+            const tbody = document.getElementById('leaderboardBody');
+            tbody.innerHTML = mockData.map(item => `
+                <tr class="hover:bg-gray-50">
+                    <td class="px-6 py-4 whitespace-nowrap">
+                        <span class="px-2 py-1 text-xs font-bold rounded-full ${getRankClass(item.rank)}">
+                            #${item.rank}
+                        </span>
+                    </td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">${item.model_name}</td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.avg_score}%</td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.eval_count}次</td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.last_eval}</td>
+                </tr>
+            `).join('');
+        }
+
+        // 加载评测维度数据（模拟数据）
+        async function loadDimensions() {
+            // 模拟评测维度数据
+            const mockData = [
+                { id: 1, name: '准确率', type: 'accuracy', desc: '模型预测正确的比例', status: '启用' },
+                { id: 2, name: '召回率', type: 'recall', desc: '找出所有正例的能力', status: '启用' },
+                { id: 3, name: 'F1分数', type: 'f1', desc: '准确率和召回率的调和平均', status: '启用' },
+                { id: 4, name: '推理速度', type: 'speed', desc: '模型推理响应时间', status: '启用' },
+                { id: 5, name: 'BLEU分数', type: 'bleu', desc: '机器翻译质量评估', status: '停用' }
+            ];
+
+            const tbody = document.getElementById('dimensionsBody');
+            tbody.innerHTML = mockData.map(item => `
+                <tr class="hover:bg-gray-50">
+                    <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">${item.name}</td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.type}</td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">${item.desc}</td>
+                    <td class="px-6 py-4 whitespace-nowrap">
+                        <span class="px-2 py-1 text-xs font-medium rounded-full ${item.status === '启用' ? 'bg-green-100 text-green-700' : 'bg-gray-100 text-gray-500'}">
+                            ${item.status}
+                        </span>
+                    </td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                        <button onclick="editDimension(${item.id})" class="text-primary hover:text-primary/80 mr-3">
+                            <i class="fa fa-edit"></i> 编辑
+                        </button>
+                        <button onclick="deleteDimension(${item.id})" class="text-red-500 hover:text-red-600">
+                            <i class="fa fa-trash"></i> 删除
+                        </button>
+                    </td>
+                </tr>
+            `).join('');
+        }
+
+        // 状态样式
+        function getStatusClass(status) {
+            const map = {
+                'completed': 'bg-green-100 text-green-700',
+                'running': 'bg-blue-100 text-blue-700',
+                'pending': 'bg-yellow-100 text-yellow-700',
+                'failed': 'bg-red-100 text-red-700'
+            };
+            return map[status?.toLowerCase()] || 'bg-gray-100 text-gray-500';
+        }
+
+        // 排名样式
+        function getRankClass(rank) {
+            if (rank === 1) return 'bg-yellow-100 text-yellow-700';
+            if (rank === 2) return 'bg-gray-100 text-gray-600';
+            if (rank === 3) return 'bg-orange-100 text-orange-700';
+            return 'bg-gray-50 text-gray-500';
+        }
+
+        // 操作函数
+        function viewReport(id) {
+            alert('查看报告功能开发中');
+        }
+
+        function deleteTask(id) {
+            if (confirm('确定要删除此评测任务吗？')) {
+                alert('删除功能开发中');
+            }
+        }
+
+        function addDimension() {
+            alert('添加维度功能开发中');
+        }
+
+        function editDimension(id) {
+            alert('编辑维度功能开发中');
+        }
+
+        function deleteDimension(id) {
+            if (confirm('确定要删除此维度吗？')) {
+                alert('删除维度功能开发中');
+            }
+        }
+
+        // 页面加载时初始化
+        async function initPage() {
+            await loadTasks();
+            loadLeaderboard();
+            loadDimensions();
+        }
+
+        // 支持通过 main.html fetch 加载
+        if (document.readyState === 'loading') {
+            document.addEventListener('DOMContentLoaded', initPage);
+        } else {
+            initPage();
+        }
+    </script>
+</body>
+</html>

web/pages/model-manage-create.html

@@ -58,59 +58,98 @@
         .text-primary { color: #1890ff; }
         .border-primary { border-color: #1890ff; }
         :root { --primary: #1890ff; --danger: #f5222d; --success: #52c41a; }
+
+        /* 侧边栏滑块动画 */
+        .sidebar-slider {
+            position: absolute;
+            width: 4px;
+            height: 0;
+            background-color: #1890ff;
+            border-radius: 0 2px 2px 0;
+            transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
+                        height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            pointer-events: none;
+            z-index: 10;
+        }
+        .nav-item-wrapper {
+            position: relative;
+        }
+        .nav-link {
+            position: relative;
+            z-index: 1;
+        }
     </style>
 </head>
 <body class="antialiased bg-gray-50 flex h-screen overflow-hidden">
     <!-- 侧边导航 -->
     <aside class="w-64 text-[#bfcbd9] flex-shrink-0 hidden md:block flex flex-col h-full" style="background-color: #001529;">
         <!-- 平台LOGO区域 -->
-        <div class="p-4 border-b border-[#001529]/30 flex items-center">
-            <img src="../assets/logo/logo.png" alt="Logo" class="w-6 h-6 object-contain mr-2">
-            <span class="text-white font-medium">远光软件微调平台</span>
+        <div class="pt-5 pb-3 border-b border-[#001529]/30 flex items-center justify-center pl-2">
+            <img src="../assets/logo/logo.png" alt="Logo" class="w-8 h-8 object-contain mr-2">
+            <span class="text-white font-medium text-base">远光软件微调平台</span>
         </div>
 
         <!-- 导航主区域 -->
-        <nav class="flex-1 overflow-y-auto py-2">
+        <nav class="flex-1 overflow-y-auto py-2 relative">
+            <!-- 滑块指示器 -->
+            <div class="sidebar-slider" id="sidebar-slider"></div>
+
             <!-- 第一分区：模型服务 -->
             <div class="sidebar-section-title">模型服务</div>
-            <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cogs w-5 text-center"></i>
-                <span class="ml-2">模型调优</span>
-            </a>
-            <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">我的模型</span>
-            </a>
-            <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-line-chart w-5 text-center"></i>
-                <span class="ml-2">模型评测</span>
-            </a>
-            <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-server w-5 text-center"></i>
-                <span class="ml-2">模型对比</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html" data-page="fine-tune" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cogs w-5 text-center"></i>
+                    <span class="ml-2">模型调优</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=my-models" data-page="my-models" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">我的模型</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-eval" data-page="model-eval" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-line-chart w-5 text-center"></i>
+                    <span class="ml-2">模型评测</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-compare" data-page="model-compare" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-server w-5 text-center"></i>
+                    <span class="ml-2">模型对比</span>
+                </a>
+            </div>
 
             <!-- 第二分区：资源管理 -->
             <div class="sidebar-section-title mt-6">资源管理</div>
-            <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-cube w-5 text-center"></i>
-                <span class="ml-2">模型管理</span>
-            </a>
-            <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-file-text w-5 text-center"></i>
-                <span class="ml-2">数据集管理</span>
-            </a>
-            <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-database w-5 text-center"></i>
-                <span class="ml-2">其他工具</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=model-manage" data-page="model-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-cube w-5 text-center"></i>
+                    <span class="ml-2">模型管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=dataset-manage" data-page="dataset-manage" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-file-text w-5 text-center"></i>
+                    <span class="ml-2">数据集管理</span>
+                </a>
+            </div>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=data-generate" data-page="data-generate" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-database w-5 text-center"></i>
+                    <span class="ml-2">其他工具</span>
+                </a>
+            </div>
 
             <!-- 第三分区：系统设置 -->
             <div class="sidebar-section-title mt-6">系统设置</div>
-            <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
-                <i class="fa fa-bar-chart w-5 text-center"></i>
-                <span class="ml-2">平台性能</span>
-            </a>
+            <div class="nav-item-wrapper">
+                <a href="main.html?page=config" data-page="config" class="nav-link flex items-center px-4 py-2.5 hover:bg-[#001529]/20 transition-colors">
+                    <i class="fa fa-bar-chart w-5 text-center"></i>
+                    <span class="ml-2">平台性能</span>
+                </a>
+            </div>
         </nav>
 
         <!-- 底部信息区域 -->
@@ -334,12 +373,27 @@
             const currentPage = 'model-manage';
             document.querySelectorAll('.nav-link').forEach(link => {
                 if (link.dataset.page === currentPage) {
-                    link.classList.add('active');
+                    link.classList.add('bg-[#1890ff]/10', 'text-[#1890ff]');
                     link.classList.remove('hover:bg-[#001529]/20', 'transition-colors');
                 }
             });
+            updateSidebarSlider();
         });
 
+        // 更新侧边栏滑块位置
+        function updateSidebarSlider() {
+            const slider = document.getElementById('sidebar-slider');
+            if (!slider) return;
+            const activeLink = document.querySelector('.nav-link.bg-\\[\\#1890ff\\]\\/10');
+            if (activeLink) {
+                const wrapper = activeLink.closest('.nav-item-wrapper');
+                if (wrapper) {
+                    slider.style.top = wrapper.offsetTop + 'px';
+                    slider.style.height = wrapper.offsetHeight + 'px';
+                }
+            }
+        }
+
         // 加载模型数据（编辑模式）
         async function loadModelData(id) {
             try {