ruoyi-plus-vben5/packages/business/layouts/src/basic/menu/use-extra-menu.ts

93 lines
2.4 KiB
TypeScript
Raw Normal View History

2024-05-19 21:20:42 +08:00
import type { MenuRecordRaw } from '@vben-core/typings';
import { computed, ref } from 'vue';
import { useRoute } from 'vue-router';
2024-05-19 21:20:42 +08:00
2024-06-08 19:49:06 +08:00
import { preferences } from '@vben-core/preferences';
import { useAccessStore } from '@vben-core/stores';
2024-05-19 21:20:42 +08:00
import { findRootMenuByPath } from './helper';
import { useNavigation } from './use-navigation';
2024-05-19 21:20:42 +08:00
function useExtraMenu() {
const accessStore = useAccessStore();
const { navigation } = useNavigation();
2024-05-19 21:20:42 +08:00
const menus = computed(() => accessStore.getAccessMenus);
const route = useRoute();
const extraMenus = ref<MenuRecordRaw[]>([]);
const extraVisible = ref<boolean>(false);
const extraActiveMenu = ref('');
/**
*
* @param menu
*/
const handleMixedMenuSelect = async (menu: MenuRecordRaw) => {
2024-05-19 21:20:42 +08:00
extraMenus.value = menu?.children ?? [];
extraActiveMenu.value = menu.parents?.[0] ?? menu.path;
const hasChildren = extraMenus.value.length > 0;
extraVisible.value = hasChildren;
if (!hasChildren) {
await navigation(menu.path);
2024-05-19 21:20:42 +08:00
}
};
/**
*
* @param menu
* @param rootMenu
*/
const handleDefaultSelect = (
menu: MenuRecordRaw,
rootMenu?: MenuRecordRaw,
) => {
extraMenus.value = rootMenu?.children ?? [];
extraActiveMenu.value = menu.parents?.[0] ?? menu.path;
2024-06-01 23:15:29 +08:00
if (preferences.sidebar.expandOnHover) {
2024-05-19 21:20:42 +08:00
extraVisible.value = extraMenus.value.length > 0;
}
};
/**
*
*/
const handleSideMouseLeave = () => {
2024-06-01 23:15:29 +08:00
if (preferences.sidebar.expandOnHover) {
2024-05-19 21:20:42 +08:00
return;
}
extraVisible.value = false;
const { findMenu, rootMenu, rootMenuPath } = findRootMenuByPath(
menus.value,
route.path,
);
extraActiveMenu.value = rootMenuPath ?? findMenu?.path ?? '';
extraMenus.value = rootMenu?.children ?? [];
};
const handleMenuMouseEnter = (menu: MenuRecordRaw) => {
2024-06-01 23:15:29 +08:00
if (!preferences.sidebar.expandOnHover) {
2024-05-19 21:20:42 +08:00
const { findMenu } = findRootMenuByPath(menus.value, menu.path);
extraMenus.value = findMenu?.children ?? [];
extraActiveMenu.value = menu.parents?.[0] ?? menu.path;
extraVisible.value = extraMenus.value.length > 0;
}
};
return {
extraActiveMenu,
extraMenus,
extraVisible,
handleDefaultSelect,
handleMenuMouseEnter,
handleMixedMenuSelect,
handleSideMouseLeave,
};
}
export { useExtraMenu };