feat: 重构sidebar菜单块逻辑
This commit is contained in:
63
src/stores/modules/side-bar/constants.ts
Normal file
63
src/stores/modules/side-bar/constants.ts
Normal file
@ -0,0 +1,63 @@
|
||||
import { MENU_GROUP_IDS } from '@/router/constants';
|
||||
export const MENU_LIST = [
|
||||
{
|
||||
id: MENU_GROUP_IDS.WORK_BENCH_ID,
|
||||
name: '工作台',
|
||||
pathName: 'Home',
|
||||
permissionKey: '', // 权限key,如果为空,则表示该菜单不需要权限,与后端约定
|
||||
},
|
||||
{
|
||||
id: MENU_GROUP_IDS.DATA_ENGINE_ID,
|
||||
name: '全域数据分析',
|
||||
permissionKey: 'data_analysis',
|
||||
children: [
|
||||
{
|
||||
name: '行业热门话题洞察',
|
||||
pathName: 'DataEngineHotTranslation',
|
||||
},
|
||||
{
|
||||
name: '行业词云',
|
||||
pathName: 'DataEngineHotCloud',
|
||||
},
|
||||
{
|
||||
name: '行业关键词动向',
|
||||
pathName: 'DataEngineKeyWord',
|
||||
},
|
||||
{
|
||||
name: '用户痛点观察',
|
||||
pathName: 'DataEngineUserPainPoints',
|
||||
},
|
||||
{
|
||||
name: '重点品牌动向',
|
||||
pathName: 'DataEngineKeyBrandMovement',
|
||||
},
|
||||
{
|
||||
name: '用户画像',
|
||||
pathName: 'DataEngineUserPersona',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: MENU_GROUP_IDS.PROPERTY_ID,
|
||||
name: '营销资产中台',
|
||||
permissionKey: 'marketing_asset',
|
||||
children: [
|
||||
{
|
||||
name: '品牌资产管理',
|
||||
pathName: 'RepositoryBrandMaterials',
|
||||
},
|
||||
{
|
||||
name: '账号资源中心',
|
||||
pathName: 'MediaAccountAccountManagement',
|
||||
},
|
||||
{
|
||||
name: '投放资源中心',
|
||||
pathName: 'PutAccountAccountManagement',
|
||||
},
|
||||
{
|
||||
name: '智能方案管理',
|
||||
pathName: 'IntelligentSolutionBusinessAnalysisReport',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
@ -3,19 +3,20 @@
|
||||
* @Date: 2025-06-23 22:13:30
|
||||
*/
|
||||
import { defineStore } from 'pinia';
|
||||
import { MENU_GROUP_IDS } from '@/router/constants';
|
||||
import { appRoutes } from '@/router/routes';
|
||||
import router from '@/router';
|
||||
import type { RouteLocationNormalized } from 'vue-router';
|
||||
|
||||
const { DATA_ENGINE_ID, MANAGEMENT_ID } = MENU_GROUP_IDS;
|
||||
import { MENU_LIST } from './constants';
|
||||
import { useEnterpriseStore } from '@/stores/modules/enterprise';
|
||||
|
||||
interface sidebarState {
|
||||
activeMenuId: number | null;
|
||||
menuList: any[];
|
||||
}
|
||||
|
||||
export const useSidebarStore = defineStore('sidebar', {
|
||||
state: (): sidebarState => ({
|
||||
activeMenuId: null,
|
||||
menuList: [],
|
||||
}),
|
||||
actions: {
|
||||
clearActiveMenuId() {
|
||||
@ -24,14 +25,23 @@ export const useSidebarStore = defineStore('sidebar', {
|
||||
setActiveMenuId(id: number) {
|
||||
this.activeMenuId = id;
|
||||
},
|
||||
// navbar菜单列表由企业对应权限决定
|
||||
getNavbarMenuList() {
|
||||
const enterpriseStore = useEnterpriseStore();
|
||||
const enterpriseInfo = enterpriseStore.getEnterpriseInfo();
|
||||
this.menuList = MENU_LIST.filter(
|
||||
(item) => !item.permissionKey || enterpriseInfo?.permissions?.includes(item.permissionKey),
|
||||
);
|
||||
},
|
||||
// 根据当前路由自动设置 activeMenuId
|
||||
setActiveMenuIdByRoute(route: RouteLocationNormalized) {
|
||||
// console.log('setActiveMenuIdByRoute ');
|
||||
const appRoutes = router.options?.routes ?? [];
|
||||
|
||||
// 查找当前路由所属的菜单组
|
||||
const findMenuGroup = (routes: any[]): number | null => {
|
||||
for (const routeItem of routes) {
|
||||
// 检查子路由
|
||||
if (routeItem.children && routeItem.children.length > 0) {
|
||||
if (routeItem.children?.length > 0) {
|
||||
// 检查当前路由是否是这个父路由的子路由
|
||||
const isChildRoute = routeItem.children.some((child: any) => child.name === route.name);
|
||||
if (isChildRoute) {
|
||||
@ -42,6 +52,10 @@ export const useSidebarStore = defineStore('sidebar', {
|
||||
if (childResult !== null) {
|
||||
return routeItem.meta?.id || childResult;
|
||||
}
|
||||
} else {
|
||||
if (routeItem.name === route.name) {
|
||||
return routeItem.meta?.id || null;
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
|
||||
Reference in New Issue
Block a user