mirror of
https://github.com/jeecgboot/JeecgBoot.git
synced 2025-12-08 17:12:28 +08:00
108 lines
3.3 KiB
Vue
108 lines
3.3 KiB
Vue
import type { Menu } from '/@/router/types';
|
||
import type { Ref } from 'vue';
|
||
import { watch, unref, ref, computed } from 'vue';
|
||
import { useRouter } from 'vue-router';
|
||
import { MenuSplitTyeEnum } from '/@/enums/menuEnum';
|
||
import { useThrottleFn } from '@vueuse/core';
|
||
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
|
||
import { getChildrenMenus, getCurrentParentPath, getMenus, getShallowMenus } from '/@/router/menus';
|
||
import { usePermissionStore } from '/@/store/modules/permission';
|
||
import { useAppInject } from '/@/hooks/web/useAppInject';
|
||
|
||
export function useSplitMenu(splitType: Ref<MenuSplitTyeEnum>) {
|
||
// Menu array
|
||
const menusRef = ref<Menu[]>([]);
|
||
const { currentRoute } = useRouter();
|
||
const { getIsMobile } = useAppInject();
|
||
const permissionStore = usePermissionStore();
|
||
const { setMenuSetting, getIsHorizontal, getSplit } = useMenuSetting();
|
||
|
||
const throttleHandleSplitLeftMenu = useThrottleFn(handleSplitLeftMenu, 50);
|
||
|
||
const splitNotLeft = computed(() => unref(splitType) !== MenuSplitTyeEnum.LEFT && !unref(getIsHorizontal));
|
||
|
||
const getSplitLeft = computed(() => !unref(getSplit) || unref(splitType) !== MenuSplitTyeEnum.LEFT);
|
||
|
||
const getSpiltTop = computed(() => unref(splitType) === MenuSplitTyeEnum.TOP);
|
||
|
||
const normalType = computed(() => {
|
||
return unref(splitType) === MenuSplitTyeEnum.NONE || !unref(getSplit);
|
||
});
|
||
|
||
watch(
|
||
[() => unref(currentRoute).path, () => unref(splitType)],
|
||
async ([path]: [string, MenuSplitTyeEnum]) => {
|
||
if (unref(splitNotLeft) || unref(getIsMobile)) return;
|
||
|
||
const { meta } = unref(currentRoute);
|
||
const currentActiveMenu = meta.currentActiveMenu as string;
|
||
let parentPath = await getCurrentParentPath(path);
|
||
if (!parentPath) {
|
||
parentPath = await getCurrentParentPath(currentActiveMenu);
|
||
}
|
||
parentPath && throttleHandleSplitLeftMenu(parentPath);
|
||
},
|
||
{
|
||
immediate: true,
|
||
}
|
||
);
|
||
|
||
// Menu changes
|
||
watch(
|
||
[() => permissionStore.getLastBuildMenuTime, () => permissionStore.getBackMenuList],
|
||
() => {
|
||
genMenus();
|
||
},
|
||
{
|
||
immediate: true,
|
||
}
|
||
);
|
||
|
||
// split Menu changes
|
||
watch(
|
||
() => getSplit.value,
|
||
() => {
|
||
// update-begin--author:liaozhiyang---date:20240919---for：【issues/7209】顶部左侧组合菜单关闭之后左侧导航没还原
|
||
// if (unref(splitNotLeft)) return;
|
||
// update-end--author:liaozhiyang---date:20240919---for：【issues/7209】顶部左侧组合菜单关闭之后左侧导航没还原
|
||
genMenus();
|
||
}
|
||
);
|
||
|
||
// Handle left menu split
|
||
async function handleSplitLeftMenu(parentPath: string) {
|
||
if (unref(getSplitLeft) || unref(getIsMobile)) return;
|
||
|
||
// spilt mode left
|
||
const children = await getChildrenMenus(parentPath);
|
||
|
||
if (!children || !children.length) {
|
||
setMenuSetting({ hidden: true });
|
||
menusRef.value = [];
|
||
return;
|
||
}
|
||
|
||
setMenuSetting({ hidden: false });
|
||
menusRef.value = children;
|
||
}
|
||
|
||
// get menus
|
||
async function genMenus() {
|
||
// normal mode
|
||
if (unref(normalType) || unref(getIsMobile)) {
|
||
menusRef.value = await getMenus();
|
||
return;
|
||
}
|
||
|
||
// split-top
|
||
if (unref(getSpiltTop)) {
|
||
const shallowMenus = await getShallowMenus();
|
||
|
||
menusRef.value = shallowMenus;
|
||
return;
|
||
}
|
||
}
|
||
|
||
return { menusRef };
|
||
}
|