From bc240f414c9347f8c5350adf717cc609d2285810 Mon Sep 17 00:00:00 2001 From: linbin <495561397@qq.com> Date: Fri, 3 Oct 2025 04:44:03 +0800 Subject: [PATCH] =?UTF-8?q?=E7=BB=BC=E8=BF=B0:=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E5=88=86=E9=94=80=E5=95=86=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E4=BA=A4=E4=BA=92=E5=8A=9F=E8=83=BD=E5=92=8C=E8=8F=9C=E5=8D=95?= =?UTF-8?q?=E6=90=9C=E7=B4=A2=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在index.html中为分销管理添加了二级子菜单结构，改善了用户界面 - 增强了菜单项展开/收起的控制逻辑，提供了更好的交互体验 - 实现了菜单搜索功能，支持按文本内容过滤菜单项 - 添加了JavaScript错误监听器用于调试和错误追踪 - 修改了toggleSubmenu函数，优化了菜单展开/收起的行为控制 --- 商家端web/index.html | 145 ++++++++++++++++++++++++++++++++++++++----- 1 file changed, 128 insertions(+), 17 deletions(-) diff --git a/商家端web/index.html b/商家端web/index.html index 2708173..583cc36 100644 --- a/商家端web/index.html +++ b/商家端web/index.html @@ -156,6 +156,10 @@ transform: rotate(90deg); } + .submenu-item.expanded .menu-arrow { + transform: rotate(90deg); + } + .submenu { background-color: #fafafa; display: none; @@ -165,6 +169,39 @@ display: block; } + .submenu-item { + position: relative; + } + + .submenu-item.expanded > .submenu { + display: block; + } + + .submenu .submenu { + background-color: #f0f0f0; + display: none; + } + + /* 确保二级子菜单也能正确显示 */ + .menu-item.expanded .submenu-item.expanded > .submenu, + .submenu-item.expanded > .submenu { + display: block; + } + + /* 特别为分销管理的嵌套子菜单提供显示规则 */ + .menu-item.expanded .submenu .submenu-item.expanded .submenu { + display: block; + } + + /* 确保在品牌管理展开的情况下，分销管理的子菜单能正确显示 */ + .menu-item.expanded .submenu .submenu-item .submenu { + display: none; /* 默认隐藏 */ + } + + .menu-item.expanded .submenu .submenu-item.expanded .submenu { + display: block; /* 只有在展开时才显示 */ + } + .submenu-link { padding: 8px 20px 8px 46px; font-size: 13px; @@ -286,7 +323,7 @@
  • -
    +
    @@ -308,7 +345,7 @@
  • -
    +
    @@ -343,7 +380,7 @@
  • -
    +
    @@ -370,7 +407,7 @@
  • -
    +
    @@ -393,7 +430,7 @@
  • -
    +
    @@ -419,7 +456,7 @@
  • -
    +
    @@ -437,14 +474,25 @@ 品牌市场订单 - - - 分销商管理 - - - - 分销订单与佣金管理 - +
    +
    + + 分销管理 + + + +
    +
    + + + 分销商管理 + + + + 分销订单与佣金管理 + +
    +
    • @@ -467,10 +515,58 @@ sidebar.classList.toggle('open'); } - // 切换子菜单展开/收起 - function toggleSubmenu(element) { + // 切换顶级菜单展开/收起 + function toggleTopLevelSubmenu(element) { + console.log('toggleTopLevelSubmenu called', element); const menuItem = element.parentElement; - menuItem.classList.toggle('expanded'); + console.log('Parent menu item:', menuItem); + + // 切换 expanded 类 + const isExpanded = menuItem.classList.toggle('expanded'); + console.log('Menu item expanded state:', isExpanded); + + // 阻止事件冒泡，防止触发父级菜单的点击事件 + if (event && event.stopPropagation) { + event.stopPropagation(); + } else if (window.event) { + window.event.cancelBubble = true; + } + console.log('Event stopped from propagating'); + } + + // 切换子菜单展开/收起 - 适用于所有层级 + function toggleSubmenu(element, event) { + console.log('toggleSubmenu called', element); + const parentElement = element.parentElement; + console.log('Parent element:', parentElement); + + let targetElement; + + // Check if this is a direct submenu item or nested submenu item + if (parentElement.classList.contains('submenu-item')) { + targetElement = parentElement; + console.log('Found submenu-item element'); + } else { + targetElement = parentElement; + console.log('Using parent element directly'); + } + + console.log('Target element before toggle:', targetElement); + console.log('Target element classList:', targetElement.classList); + + // Toggle expanded class + const isExpanded = targetElement.classList.toggle('expanded'); + console.log('Target element expanded state after toggle:', isExpanded); + console.log('Target element classList after toggle:', targetElement.classList); + + // Prevent event bubbling, to avoid triggering parent menu clicks + if (event && event.stopPropagation) { + event.stopPropagation(); + console.log('Event stopped from propagating'); + } else if (window.event) { + window.event.cancelBubble = true; + console.log('Event cancelBubble set to true'); + } } // 加载内容到iframe @@ -510,17 +606,22 @@ // 菜单搜索功能 document.querySelector('.search-input').addEventListener('input', function(e) { + console.log('Search input event triggered', e.target.value); const searchText = e.target.value.toLowerCase(); const menuItems = document.querySelectorAll('.menu-item'); + console.log('Found', menuItems.length, 'menu items'); menuItems.forEach(item => { const menuText = item.querySelector('.menu-text'); if (menuText) { const text = menuText.textContent.toLowerCase(); + console.log('Checking menu text:', text); if (text.includes(searchText) || searchText === '') { item.style.display = 'block'; + console.log('Display set to block for:', text); } else { item.style.display = 'none'; + console.log('Display set to none for:', text); } } }); @@ -540,6 +641,16 @@ } }); }); + // 添加错误监听器以便调试 + window.addEventListener('error', function(e) { + console.error('JavaScript Error:', e.error); + console.error('Error Message:', e.message); + console.error('Error Filename:', e.filename); + console.error('Error Line Number:', e.lineno); + console.error('Error Column Number:', e.colno); + }); + + console.log('Page loaded and scripts initialized'); \ No newline at end of file