Browse Source
fix: 布局为双列菜单或者水平模式下, 一级菜单高亮问题 (#5870)
Co-authored-by: 王泳超 <wangyongchao@testor.com.cn>
pull/5876/head
wyc001122
10 months ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with
31 additions and
15 deletions
-
packages/@core/ui-kit/menu-ui/src/components/menu.vue
-
packages/effects/layouts/src/basic/menu/use-extra-menu.ts
-
packages/effects/layouts/src/basic/menu/use-mixed-menu.ts
-
packages/effects/layouts/src/basic/menu/use-navigation.ts
|
|
|
@ -23,7 +23,6 @@ import { |
|
|
|
|
|
|
|
import { useNamespace } from '@vben-core/composables'; |
|
|
|
import { Ellipsis } from '@vben-core/icons'; |
|
|
|
import { isHttpUrl } from '@vben-core/shared/utils'; |
|
|
|
|
|
|
|
import { useResizeObserver } from '@vueuse/core'; |
|
|
|
|
|
|
|
@ -248,9 +247,6 @@ function handleMenuItemClick(data: MenuItemClicked) { |
|
|
|
if (!path || !parentPaths) { |
|
|
|
return; |
|
|
|
} |
|
|
|
if (!isHttpUrl(path)) { |
|
|
|
activePath.value = path; |
|
|
|
} |
|
|
|
|
|
|
|
emit('select', path, parentPaths); |
|
|
|
} |
|
|
|
|
|
|
|
@ -13,7 +13,7 @@ import { useNavigation } from './use-navigation'; |
|
|
|
|
|
|
|
function useExtraMenu(useRootMenus?: ComputedRef<MenuRecordRaw[]>) { |
|
|
|
const accessStore = useAccessStore(); |
|
|
|
const { navigation } = useNavigation(); |
|
|
|
const { navigation, willOpenedByWindow } = useNavigation(); |
|
|
|
|
|
|
|
const menus = computed(() => useRootMenus?.value ?? accessStore.accessMenus); |
|
|
|
|
|
|
|
@ -33,11 +33,15 @@ function useExtraMenu(useRootMenus?: ComputedRef<MenuRecordRaw[]>) { |
|
|
|
* @param menu |
|
|
|
*/ |
|
|
|
const handleMixedMenuSelect = async (menu: MenuRecordRaw) => { |
|
|
|
extraMenus.value = menu?.children ?? []; |
|
|
|
extraActiveMenu.value = menu.parents?.[parentLevel.value] ?? menu.path; |
|
|
|
const hasChildren = extraMenus.value.length > 0; |
|
|
|
const _extraMenus = menu?.children ?? []; |
|
|
|
const hasChildren = _extraMenus.length > 0; |
|
|
|
|
|
|
|
if (!willOpenedByWindow(menu.path)) { |
|
|
|
extraMenus.value = _extraMenus ?? []; |
|
|
|
extraActiveMenu.value = menu.parents?.[parentLevel.value] ?? menu.path; |
|
|
|
sidebarExtraVisible.value = hasChildren; |
|
|
|
} |
|
|
|
|
|
|
|
sidebarExtraVisible.value = hasChildren; |
|
|
|
if (!hasChildren) { |
|
|
|
await navigation(menu.path); |
|
|
|
} else if (preferences.sidebar.autoActivateChild) { |
|
|
|
|
|
|
|
@ -10,7 +10,7 @@ import { findRootMenuByPath } from '@vben/utils'; |
|
|
|
import { useNavigation } from './use-navigation'; |
|
|
|
|
|
|
|
function useMixedMenu() { |
|
|
|
const { navigation } = useNavigation(); |
|
|
|
const { navigation, willOpenedByWindow } = useNavigation(); |
|
|
|
const accessStore = useAccessStore(); |
|
|
|
const route = useRoute(); |
|
|
|
const splitSideMenus = ref<MenuRecordRaw[]>([]); |
|
|
|
@ -89,11 +89,15 @@ function useMixedMenu() { |
|
|
|
navigation(key); |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
const rootMenu = menus.value.find((item) => item.path === key); |
|
|
|
rootMenuPath.value = rootMenu?.path ?? ''; |
|
|
|
splitSideMenus.value = rootMenu?.children ?? []; |
|
|
|
if (splitSideMenus.value.length === 0) { |
|
|
|
const _splitSideMenus = rootMenu?.children ?? []; |
|
|
|
|
|
|
|
if (!willOpenedByWindow(key)) { |
|
|
|
rootMenuPath.value = rootMenu?.path ?? ''; |
|
|
|
splitSideMenus.value = _splitSideMenus; |
|
|
|
} |
|
|
|
|
|
|
|
if (_splitSideMenus.length === 0) { |
|
|
|
navigation(key); |
|
|
|
} else if (rootMenu && preferences.sidebar.autoActivateChild) { |
|
|
|
navigation( |
|
|
|
|
|
|
|
@ -29,7 +29,19 @@ function useNavigation() { |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
return { navigation }; |
|
|
|
const willOpenedByWindow = (path: string) => { |
|
|
|
const route = routeMetaMap.get(path); |
|
|
|
const { openInNewWindow = false } = route?.meta ?? {}; |
|
|
|
if (isHttpUrl(path)) { |
|
|
|
return true; |
|
|
|
} else if (openInNewWindow) { |
|
|
|
return true; |
|
|
|
} else { |
|
|
|
return false; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
return { navigation, willOpenedByWindow }; |
|
|
|
} |
|
|
|
|
|
|
|
export { useNavigation }; |
|
|
|
|