fix(ui06): grouped sidebar menu items missing click navigation

B1 分组展平渲染的 ElMenuItem 只渲染了标题插槽,未绑定跳转——点击无反应。
补 onGroupedItemClick:handleMenuJump(外链/iframe/普通路由统一语义,同
SidebarSubmenu.goPage)+ 移动端关闭抽屉。

Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
浅念
2026-09-23 09:15:14 +08:00
parent 6074fc8ed3
commit 1a52d0a028
@@ -101,7 +101,12 @@
> >
<!-- UI06:普通左侧菜单按 meta.menuGroup 展平分组(示例侧栏结构) --> <!-- UI06:普通左侧菜单按 meta.menuGroup 展平分组(示例侧栏结构) -->
<template v-if="isGroupedMode"> <template v-if="isGroupedMode">
<ElMenuItem v-for="item in flatMenuItems.ungrouped" :key="item.path" :index="item.path"> <ElMenuItem
v-for="item in flatMenuItems.ungrouped"
:key="item.path"
:index="item.path"
@click="onGroupedItemClick(item)"
>
<div class="menu-icon flex-cc"> <div class="menu-icon flex-cc">
<ArtSvgIcon <ArtSvgIcon
:icon="item.meta.icon" :icon="item.meta.icon"
@@ -113,7 +118,12 @@
</ElMenuItem> </ElMenuItem>
<template v-for="group in flatMenuItems.groups" :key="group.label"> <template v-for="group in flatMenuItems.groups" :key="group.label">
<li v-if="menuOpen" class="ui06-menu-group-label">{{ $t(group.label) }}</li> <li v-if="menuOpen" class="ui06-menu-group-label">{{ $t(group.label) }}</li>
<ElMenuItem v-for="item in group.items" :key="item.path" :index="item.path"> <ElMenuItem
v-for="item in group.items"
:key="item.path"
:index="item.path"
@click="onGroupedItemClick(item)"
>
<div class="menu-icon flex-cc"> <div class="menu-icon flex-cc">
<ArtSvgIcon <ArtSvgIcon
:icon="item.meta.icon" :icon="item.meta.icon"
@@ -235,6 +245,15 @@
return { groups, ungrouped } return { groups, ungrouped }
}) })
/**
* UI06 分组菜单项点击:外链/iframe/普通路由统一走 handleMenuJump
* (与 SidebarSubmenu.goPage 同语义);移动端同步关闭抽屉。
*/
function onGroupedItemClick(item: AppRouteRecord): void {
handleMenuJump(item)
handleMenuClose()
}
// 移动端屏幕判断(使用 computed 避免重复计算) // 移动端屏幕判断(使用 computed 避免重复计算)
const isMobileScreen = computed(() => width.value < MOBILE_BREAKPOINT) const isMobileScreen = computed(() => width.value < MOBILE_BREAKPOINT)