// 通用侧边栏组件的JavaScript逻辑 // 全局状态管理 let currentExpandedMenus = []; // 获取当前页面路径信息 function getCurrentPageInfo() { const path = window.location.pathname; const filename = path.split('/').pop(); // 根据文件名判断当前页面 if (filename === 'index.html' || path.endsWith('/')) { return { section: 'home', page: 'home' }; } else if (filename === 'data-center.html') { return { section: 'data-center', page: 'data-center' }; } else if (filename === 'coupon-marketing.html') { return { section: 'coupon-marketing', page: 'coupon-marketing' }; } else if (path.includes('/member/')) { if (filename === 'level-settings.html') { return { section: 'member', page: 'level-settings' }; } else if (filename === 'level-detail.html') { return { section: 'member', page: 'level-detail' }; } else if (filename === 'level-edit.html') { return { section: 'member', page: 'level-edit' }; } return { section: 'member', page: 'unknown' }; } return { section: 'unknown', page: 'unknown' }; } // 菜单展开/收起功能 function toggleMenu(menuId) { const arrow = document.getElementById(menuId + '-arrow'); const submenu = document.getElementById(menuId + '-submenu'); if (currentExpandedMenus.includes(menuId)) { // 收起菜单 currentExpandedMenus = currentExpandedMenus.filter(id => id !== menuId); if (arrow) { arrow.classList.remove('rotate-180'); } if (submenu) { submenu.classList.add('hidden'); } } else { // 展开菜单 currentExpandedMenus.push(menuId); if (arrow) { arrow.classList.add('rotate-180'); } if (submenu) { submenu.classList.remove('hidden'); submenu.classList.add('fade-in'); } } console.log('菜单状态更新:', menuId, currentExpandedMenus); } // 初始化菜单状态 function initializeSidebar() { const currentPage = getCurrentPageInfo(); // 根据当前页面设置菜单状态 if (currentPage.section === 'member') { // 会员管理菜单默认展开 if (!currentExpandedMenus.includes('member')) { toggleMenu('member'); } // 设置当前页面高亮 highlightCurrentMenu(currentPage); } else if (currentPage.section === 'home') { // 主页高亮 highlightCurrentMenu(currentPage); // 会员管理菜单默认展开 if (!currentExpandedMenus.includes('member')) { toggleMenu('member'); } } else { // 其他页面高亮对应菜单 highlightCurrentMenu(currentPage); } console.log('侧边栏初始化完成,当前页面:', currentPage); } // 高亮当前菜单项 function highlightCurrentMenu(pageInfo) { // 清除所有高亮状态 document.querySelectorAll('.menu-item').forEach(item => { item.classList.remove('text-blue-500'); item.classList.add('text-gray-700'); }); // 根据页面信息高亮对应菜单 let targetElement = null; if (pageInfo.section === 'home') { targetElement = document.querySelector('[data-menu="home"]'); } else if (pageInfo.section === 'data-center') { targetElement = document.querySelector('[data-menu="data-center"]'); } else if (pageInfo.section === 'coupon-marketing') { targetElement = document.querySelector('[data-menu="coupon-marketing"]'); } else if (pageInfo.section === 'member') { if (pageInfo.page === 'level-settings' || pageInfo.page === 'level-detail' || pageInfo.page === 'level-edit') { targetElement = document.querySelector('[data-menu="level-settings"]'); } } if (targetElement) { targetElement.classList.remove('text-gray-700', 'text-gray-600'); targetElement.classList.add('text-blue-500'); } } // 搜索功能 function initializeSidebarSearch() { const searchInput = document.querySelector('input[placeholder*="搜索"]'); if (searchInput) { searchInput.addEventListener('input', function(e) { const searchTerm = e.target.value.toLowerCase(); filterMenuItems(searchTerm); }); } } // 过滤菜单项 function filterMenuItems(searchTerm) { const menuItems = document.querySelectorAll('nav div'); menuItems.forEach(item => { const text = item.textContent.toLowerCase(); if (text.includes(searchTerm) || searchTerm === '') { item.style.display = ''; } else { item.style.display = 'none'; } }); console.log('搜索筛选:', searchTerm); } // 页面跳转函数 function navigateToPage(url) { window.location.href = url; } // 获取相对路径 function getRelativePath(targetPath) { const currentPath = window.location.pathname; const currentDir = currentPath.substring(0, currentPath.lastIndexOf('/')); // 判断当前是否在子目录中 if (currentDir.includes('/pages')) { if (currentDir.includes('/member')) { // 在 member 子目录中 return targetPath.startsWith('../../') ? targetPath : '../../' + targetPath; } else { // 在 pages 目录中 return targetPath.startsWith('../') ? targetPath : '../' + targetPath; } } // 在根目录中 return targetPath; } // 导出函数 window.toggleMenu = toggleMenu; window.initializeSidebar = initializeSidebar; window.initializeSidebarSearch = initializeSidebarSearch; window.navigateToPage = navigateToPage; window.getRelativePath = getRelativePath;