From 68d2b88c0495b38b53111a3d270d394ece311cca Mon Sep 17 00:00:00 2001
From: duanshuwen <duanshuwen@gogpay.cn>
Date: Thu, 27 Aug 2026 15:33:35 +0800
Subject: [PATCH] =?UTF-8?q?fix(layout/sidebar-item):=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E4=BE=A7=E8=BE=B9=E6=A0=8F=E8=8F=9C=E5=8D=95=E9=A1=B9=E7=9A=84?=
 =?UTF-8?q?=E4=B8=A4=E5=A4=84=E6=98=BE=E7=A4=BA=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将侧边栏内容容器从span改为div，避免Tooltip触发器被误判为隐藏文本
- 折叠父菜单时子菜单强制不折叠以保留子项标题
- 新增对应单元测试覆盖修复场景
---
 .../src/components/layout/SidebarItem.test.ts   | 17 +++++++++++++++++
 .../src/components/layout/SidebarItem.vue       | 10 +++++-----
 2 files changed, 22 insertions(+), 5 deletions(-)
 create mode 100644 WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.test.ts

diff --git a/WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.test.ts b/WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.test.ts
new file mode 100644
index 0000000..b178878
--- /dev/null
+++ b/WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.test.ts
@@ -0,0 +1,17 @@
+import { readFileSync } from "node:fs";
+import { describe, expect, it } from "vitest";
+
+const source = readFileSync(new URL("./SidebarItem.vue", import.meta.url), "utf8");
+
+describe("侧栏菜单图标容器", () => {
+  it("避免折叠菜单把 Tooltip 触发器误判为隐藏文本", () => {
+    expect(source).toContain('<div class="sidebar-item__content">');
+    expect(source).not.toContain('<span class="sidebar-item__content">');
+  });
+});
+
+describe("折叠态子菜单", () => {
+  it("在弹出的子菜单中保留子项标题", () => {
+    expect(source).toContain(':collapsed="false"');
+  });
+});
diff --git a/WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.vue b/WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.vue
index fe23cb0..45db2c0 100644
--- a/WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.vue
+++ b/WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.vue
@@ -39,23 +39,23 @@ const childBasePath = computed(() => resolvedPath.value || props.basePath || "/"
     :aria-label="menu.name" :class="['sidebar-item', `sidebar-item--${navigationType}`]">
     <template #title>
       <el-tooltip :content="menu.name" :disabled="!collapsed" placement="right">
-        <span class="sidebar-item__content">
+        <div class="sidebar-item__content">
           <LayoutIcon :name="getMenuIconName(menu)" :title="collapsed ? menu.name : undefined" size="18" />
           <span v-if="!collapsed" class="sidebar-item__label">{{ menu.name }}</span>
-        </span>
+        </div>
       </el-tooltip>
     </template>
     <SidebarItem v-for="child in visibleChildren" :key="child.id" :menu="child" :base-path="childBasePath"
-      :collapsed="collapsed" :navigation-type="navigationType" />
+      :collapsed="false" :navigation-type="navigationType" />
   </el-sub-menu>
 
   <el-menu-item v-else-if="menu.type === 'page' && resolvedPath" :index="resolvedPath" :aria-label="menu.name"
     :class="['sidebar-item', `sidebar-item--${navigationType}`]">
     <el-tooltip :content="menu.name" :disabled="!collapsed" placement="right">
-      <span class="sidebar-item__content">
+      <div class="sidebar-item__content">
         <LayoutIcon :name="getMenuIconName(menu)" :title="collapsed ? menu.name : undefined" size="18" />
         <span v-if="!collapsed" class="sidebar-item__label">{{ menu.name }}</span>
-      </span>
+      </div>
     </el-tooltip>
   </el-menu-item>
 </template>