feat: 菜单根据切换核心网显示
This commit is contained in:
@@ -22,6 +22,7 @@ import {
|
||||
import { useRouter } from 'vue-router';
|
||||
import useLayoutStore from '@/store/modules/layout';
|
||||
import useAppStore from '@/store/modules/app';
|
||||
import useCoreStore from '@/store/modules/core';
|
||||
import useNeStore from '@/store/modules/ne';
|
||||
import useRouterStore from '@/store/modules/router';
|
||||
import useTabsStore from '@/store/modules/tabs';
|
||||
@@ -35,7 +36,6 @@ import { parseUrlPath } from '@/plugins/file-static-url';
|
||||
const { proConfig, waterMarkContent } = useLayoutStore();
|
||||
const { t, currentLocale } = useI18n();
|
||||
const routerStore = useRouterStore();
|
||||
const neListStore = useNeStore();
|
||||
const tabsStore = useTabsStore();
|
||||
const appStore = useAppStore();
|
||||
const router = useRouter();
|
||||
@@ -80,9 +80,12 @@ const menuData = computed(() => {
|
||||
rootRoute.children = children;
|
||||
}
|
||||
}
|
||||
const neTypes = neListStore.getNeSelectOtions.map(v => v.value);
|
||||
let routes = clearMenuItem(router.getRoutes());
|
||||
routes = routerStore.clearMenuItemByNeList(routes, neTypes);
|
||||
const coreUid = useCoreStore().getCurrentCoreUid;
|
||||
const neTypes = useNeStore()
|
||||
.fnNeSelectOtions(coreUid)
|
||||
.map(v => v.value);
|
||||
routes = routerStore.clearMenuItemByNeList(routes, coreUid, neTypes);
|
||||
const { menuData } = getMenuData(routes);
|
||||
return menuData;
|
||||
});
|
||||
@@ -311,7 +314,7 @@ onUnmounted(() => {
|
||||
<template #headerContentRender></template>
|
||||
|
||||
<!--插槽-渲染顶部内容区域,仅布局side有效-->
|
||||
<template #menuHeaderExtraRender>
|
||||
<template #menuHeaderExtraRender>
|
||||
<CoreSelect></CoreSelect>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -6,7 +6,9 @@ const coreStore = useCoreStore();
|
||||
const { t } = useI18n();
|
||||
|
||||
/**当前选中 */
|
||||
const coreValue = ref(coreStore.current?.value || 'Global');
|
||||
const coreValue = ref(
|
||||
coreStore.current?.value == 'all' ? 'Global' : coreStore.current?.value
|
||||
);
|
||||
/**选择列表数据 */
|
||||
const coreOtions = ref(coreStore.getSelectOtions);
|
||||
/**选择过滤名称 */
|
||||
|
||||
@@ -27,6 +27,11 @@ const useCoreStore = defineStore('core', {
|
||||
coreSelectOtions: [],
|
||||
}),
|
||||
getters: {
|
||||
/**当前核心网Uid */
|
||||
getCurrentCoreUid(): string {
|
||||
return this.current.value;
|
||||
},
|
||||
/**选择器 */
|
||||
getSelectOtions(): Record<string, any>[] {
|
||||
return this.coreSelectOtions;
|
||||
},
|
||||
|
||||
@@ -11,16 +11,16 @@ type NeList = {
|
||||
/**网元列表 */
|
||||
neList: Record<string, any>[];
|
||||
/**级联options树结构 */
|
||||
neCascaderOptions: Record<string, any>[];
|
||||
neCascaderOptions: Map<string, Record<string, any>[]>;
|
||||
/**选择器单级父类型 */
|
||||
neSelectOtions: Record<string, any>[];
|
||||
neSelectOtions: Map<string, Record<string, any>[]>;
|
||||
};
|
||||
|
||||
const useNeStore = defineStore('ne_list', {
|
||||
state: (): NeList => ({
|
||||
neList: [],
|
||||
neCascaderOptions: [],
|
||||
neSelectOtions: [],
|
||||
neCascaderOptions: new Map(),
|
||||
neSelectOtions: new Map(),
|
||||
}),
|
||||
getters: {
|
||||
/**
|
||||
@@ -72,33 +72,71 @@ const useNeStore = defineStore('ne_list', {
|
||||
// 原始列表
|
||||
this.neList = JSON.parse(JSON.stringify(res.data));
|
||||
|
||||
// 转级联数据
|
||||
const options = parseDataToOptions(
|
||||
res.data,
|
||||
'neType',
|
||||
'neName',
|
||||
'neId'
|
||||
'neUid'
|
||||
);
|
||||
this.neCascaderOptions = options;
|
||||
|
||||
// 转选择器单级父类型
|
||||
this.neSelectOtions = options.map(item => {
|
||||
return {
|
||||
for (const item of options) {
|
||||
const k = item.coreUid;
|
||||
// 转级联数据
|
||||
let cascaderMap = this.neCascaderOptions.get(k);
|
||||
if (cascaderMap) {
|
||||
cascaderMap.push(item);
|
||||
} else {
|
||||
cascaderMap = [item];
|
||||
}
|
||||
this.neCascaderOptions.set(k, cascaderMap);
|
||||
|
||||
// 转选择器单级父类型
|
||||
let selectMap = this.neSelectOtions.get(k);
|
||||
const selectItem = {
|
||||
label: item.label,
|
||||
value: item.value,
|
||||
};
|
||||
});
|
||||
if (selectMap) {
|
||||
selectMap.push(selectItem);
|
||||
} else {
|
||||
selectMap = [selectItem];
|
||||
}
|
||||
this.neSelectOtions.set(k, selectMap);
|
||||
}
|
||||
}
|
||||
return res;
|
||||
},
|
||||
/**
|
||||
* 获取级联options树结构
|
||||
* @param coreUid 核心网元uid
|
||||
*/
|
||||
fnNeCascaderOptions(coreUid: string) {
|
||||
const m = this.neCascaderOptions.get(coreUid);
|
||||
if (!m) {
|
||||
return [];
|
||||
}
|
||||
return m;
|
||||
},
|
||||
/**
|
||||
* 获取选择器单级父类型
|
||||
* @param coreUid 核心网元uid
|
||||
*/
|
||||
fnNeSelectOtions(coreUid: string) {
|
||||
const m = this.neSelectOtions.get(coreUid);
|
||||
if (!m) {
|
||||
return [];
|
||||
}
|
||||
return m;
|
||||
},
|
||||
/**
|
||||
* 含有网元
|
||||
* @param coreUid 核心网元uid
|
||||
* @param metaNeType ['udm', 'ims', 'udm+ims', 'SGWC'] 支持大小写
|
||||
* @returns boolean
|
||||
*/
|
||||
fnHasNe(metaNeType: string[]) {
|
||||
fnHasNe(coreUid: string, metaNeType: string[]) {
|
||||
if (this.neList.length > 0) {
|
||||
const neTypes = this.neSelectOtions.map(item => item.value);
|
||||
const neTypes = this.fnNeSelectOtions(coreUid).map(item => item.value);
|
||||
let match = false; // 匹配
|
||||
for (const netype of metaNeType) {
|
||||
if (netype.indexOf('+') > -1) {
|
||||
|
||||
@@ -58,16 +58,28 @@ const useRouterStore = defineStore('router', {
|
||||
/**
|
||||
* 根据网元类型过滤菜单
|
||||
* @param routes 经过clearMenuItem(router.getRoutes())处理
|
||||
* @param coreUid 核心网元uid
|
||||
* @param neTypes 网元类型
|
||||
* @returns 过滤后的菜单
|
||||
*/
|
||||
clearMenuItemByNeList(
|
||||
routes: RouteRecord[] | RouteRecordRaw[],
|
||||
coreUid: string,
|
||||
neTypes: string[]
|
||||
): RouteRecordRaw[] {
|
||||
return routes
|
||||
.map((item: RouteRecord | RouteRecordRaw) => {
|
||||
const finalItem = { ...item };
|
||||
// 过滤核心网菜单
|
||||
if (coreUid.length < 8 && finalItem.meta?.core == true) {
|
||||
// 全局 网元菜单
|
||||
return null;
|
||||
}
|
||||
if (coreUid.length == 8 && finalItem.meta?.core == false) {
|
||||
// 核心网 非网元菜单
|
||||
return null;
|
||||
}
|
||||
|
||||
// 过滤网元类型
|
||||
if (
|
||||
Array.isArray(finalItem.meta?.neType) &&
|
||||
@@ -96,6 +108,7 @@ const useRouterStore = defineStore('router', {
|
||||
if (finalItem.children && finalItem.children.length > 0) {
|
||||
const children = this.clearMenuItemByNeList(
|
||||
finalItem.children,
|
||||
coreUid,
|
||||
neTypes
|
||||
);
|
||||
// 如果子菜单都被过滤掉了,就不显示
|
||||
|
||||
5
src/typings/router.d.ts
vendored
5
src/typings/router.d.ts
vendored
@@ -9,6 +9,11 @@ declare module 'vue-router' {
|
||||
permissions?: string[];
|
||||
/**角色 */
|
||||
roles?: string[];
|
||||
|
||||
/**租户标识 */
|
||||
tenant?: boolean;
|
||||
/**核心网标识 */
|
||||
core?: boolean;
|
||||
/**网元类型信息 */
|
||||
neType?: string[];
|
||||
}
|
||||
|
||||
@@ -8,13 +8,13 @@ import BackupModal from '@/views/ne/neConfigBackup/components/BackupModal.vue';
|
||||
import { parseDateToStr } from '@/utils/date-utils';
|
||||
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
|
||||
import useI18n from '@/hooks/useI18n';
|
||||
import useCoreStore from '@/store/modules/core';
|
||||
import useNeStore from '@/store/modules/ne';
|
||||
import saveAs from 'file-saver';
|
||||
import { delFile, getFile, listFile } from '@/api/tool/file';
|
||||
import { parseSizeFromFile } from '@/utils/parse-utils';
|
||||
import { pushBackupFTP } from '@/api/neData/backup';
|
||||
const { t } = useI18n();
|
||||
const neListStore = useNeStore();
|
||||
|
||||
/**文件来源 */
|
||||
let sourceState = reactive({
|
||||
@@ -306,9 +306,10 @@ function fnSyncFileToFTP(fileName: string) {
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
const coreUid = useCoreStore().getCurrentCoreUid;
|
||||
sourceState.list = sourceState.list.filter(item => {
|
||||
if (!item.neType) return true;
|
||||
return neListStore.fnHasNe([item.neType]);
|
||||
return useNeStore().fnHasNe(coreUid, [item.neType]);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user