// 全局变量 let currentPage = 'dashboard'; // DOM 加载完成后执行 document.addEventListener('DOMContentLoaded', function() { initializePage(); setupEventListeners(); // 如果是首页，默认显示dashboard内容 if (window.location.pathname === '/web/dashboard') { loadDashboardContent(); } }); // 初始化页面 function initializePage() { // 设置当前页面状态 updateActiveNavigation(); } // 设置事件监听器 function setupEventListeners() { // 导航按钮点击事件 const navButtons = document.querySelectorAll('.nav-button[data-page]'); navButtons.forEach(button => { button.addEventListener('click', function(e) { e.preventDefault(); const page = this.getAttribute('data-page'); loadPage(page); }); }); // 窗口大小变化事件（保留用于可能的响应式优化） window.addEventListener('resize', handleWindowResize); } // 处理窗口大小变化（保留但简化） function handleWindowResize() { // 可以在这里添加响应式相关的处理逻辑 } // 加载页面内容 async function loadPage(page) { const pageContent = document.getElementById('pageContent'); // 显示加载状态 showLoadingState(); try { // 发送AJAX请求获取页面内容 const response = await fetch(`/web/${page}`, { headers: { 'X-Requested-With': 'XMLHttpRequest' } }); if (response.ok) { const html = await response.text(); // 解析HTML，提取内容部分 const parser = new DOMParser(); const doc = parser.parseFromString(html, 'text/html'); const content = doc.querySelector('#pageContent') || doc.querySelector('.container-fluid'); if (content) { // 添加页面切换动画 pageContent.classList.add('page-enter'); pageContent.innerHTML = content.innerHTML; setTimeout(() => { pageContent.classList.remove('page-enter'); pageContent.classList.add('page-enter-active'); }, 10); setTimeout(() => { pageContent.classList.remove('page-enter-active'); }, 310); // 更新当前页面状态 currentPage = page; updateActiveNavigation(); // 更新浏览器历史记录 history.pushState({page: page}, '', `/web/${page}`); } else { throw new Error('无法解析页面内容'); } } else { throw new Error(`HTTP ${response.status}: ${response.statusText}`); } } catch (error) { console.error('加载页面失败:', error); showErrorState(error.message); } } // 显示加载状态 function showLoadingState() { const pageContent = document.getElementById('pageContent'); pageContent.innerHTML = `

加载中...

`; } // 显示错误状态 function showErrorState(message) { const pageContent = document.getElementById('pageContent'); pageContent.innerHTML = `

加载失败

${message}

请稍后重试或联系管理员。

`; } // 更新当前激活的导航项 function updateActiveNavigation() { // 移除所有激活状态 const navButtons = document.querySelectorAll('.nav-button'); navButtons.forEach(button => { button.classList.remove('active'); }); // 设置当前页面为激活状态 const activeButton = document.querySelector(`[data-page="${currentPage}"]`); if (activeButton) { activeButton.classList.add('active'); } } // 加载仪表板内容 function loadDashboardContent() { const pageContent = document.getElementById('pageContent'); pageContent.innerHTML = `

欢迎使用 Kumi

知识库与大模型评测平台

知识库管理

管理你的知识库，包括连接、设置嵌入模型、上传文件和测试功能。

开始使用

大模型评测

配置和测试大语言模型，上传测评数据集，执行评测任务。

开始使用

系统状态

知识库

运行正常

大模型

运行正常

文件服务

运行正常

评测服务

运行正常

`; // 绑定仪表板中的链接事件 const dashboardLinks = document.querySelectorAll('#pageContent [data-page]'); dashboardLinks.forEach(link => { link.addEventListener('click', function(e) { e.preventDefault(); const page = this.getAttribute('data-page'); loadPage(page); }); }); } // 处理浏览器后退/前进按钮 window.addEventListener('popstate', function(event) { if (event.state && event.state.page) { loadPage(event.state.page); } }); // 在 main.js 中添加或更新 document.addEventListener('DOMContentLoaded', function() { // 导航按钮点击处理 document.querySelectorAll('.nav-button').forEach(button => { button.addEventListener('click', function(e) { e.preventDefault(); const page = this.getAttribute('data-page'); if (page) { window.location.href = `/web/${page}`; } }); }); });