feat(router): 优化 Agent路由加载策略
- 移除静态路由中的占位组件- 删除动态路由加载逻辑 - 在路由守卫中实现 Agent路由的动态加载 - 更新路由元信息和结构
This commit is contained in:
@ -14,7 +14,6 @@ import './core';
|
||||
import 'uno.css';
|
||||
import './mock';
|
||||
// import '@/styles/vars.css'; // 优先加载
|
||||
import { loadDynamicMenus } from './router/routes/modules/agentDynamic';
|
||||
|
||||
const app = createApp(App);
|
||||
app.use(store);
|
||||
@ -22,8 +21,6 @@ app.use(router);
|
||||
app.component('NoData', NoData);
|
||||
|
||||
router.isReady().then(async () => {
|
||||
await loadDynamicMenus(router); // 传入 router 实例
|
||||
|
||||
console.log(router,'router')
|
||||
app.mount('#app');
|
||||
});
|
||||
|
||||
@ -8,6 +8,7 @@
|
||||
import type { Router } from 'vue-router';
|
||||
import { setRouteEmitter } from '@/utils/route-listener';
|
||||
import setupUserLoginInfoGuard from './userLoginInfo';
|
||||
import { MENU_GROUP_IDS } from '@/router/constants';
|
||||
// import setupPermissionGuard from './permission';
|
||||
|
||||
function setupPageGuard(router: Router) {
|
||||
@ -17,7 +18,76 @@ function setupPageGuard(router: Router) {
|
||||
});
|
||||
}
|
||||
|
||||
// 动态加载 agent 路由
|
||||
let isAgentRouteLoaded = false; // 标志位
|
||||
|
||||
async function loadAgentRoute(router: Router) {
|
||||
if (isAgentRouteLoaded) return; // 防止重复加载
|
||||
try {
|
||||
const agentRouter = {
|
||||
path: '/agent',
|
||||
name: 'Agent',
|
||||
redirect: 'agent/index', // 默认重定向到第一个子路由
|
||||
meta: {
|
||||
locale: '扣子智能体',
|
||||
requiresAuth: true,
|
||||
requireLogin: true,
|
||||
id: MENU_GROUP_IDS.AGENT,
|
||||
roles: ['*'],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'AgentIndex',
|
||||
component: () => import('@/views/agent/index'),
|
||||
meta: {
|
||||
title: '首页', // 菜单标题
|
||||
icon: 'home', // 菜单图标(可选)
|
||||
requiresAuth: false,
|
||||
requireLogin: true,
|
||||
id: MENU_GROUP_IDS.AGENT,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'settings',
|
||||
name: 'AgentSettings',
|
||||
component: () => import('@/views/agent/index'),
|
||||
meta: {
|
||||
title: '设置', // 菜单标题
|
||||
icon: 'settings', // 菜单图标(可选)
|
||||
requiresAuth: true,
|
||||
requireLogin: true,
|
||||
id: MENU_GROUP_IDS.AGENT,
|
||||
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'dashboard',
|
||||
name: 'AgentDashboard',
|
||||
component: () => import('@/views/agent/index'),
|
||||
meta: {
|
||||
title: '仪表盘', // 菜单标题
|
||||
icon: 'dashboard', // 菜单图标(可选)
|
||||
requiresAuth: true,
|
||||
requireLogin: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
router.addRoute(agentRouter); // 使用传递进来的 router 实例
|
||||
isAgentRouteLoaded = true; // 标记路由已加载
|
||||
} catch (error) {
|
||||
console.error('Error loading agent route:', error);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default function createRouteGuard(router: Router) {
|
||||
loadAgentRoute(router).then(() => {
|
||||
// 路由加载完成后通知菜单更新
|
||||
setRouteEmitter(router.currentRoute.value);
|
||||
});
|
||||
|
||||
setupPageGuard(router);
|
||||
setupUserLoginInfoGuard(router);
|
||||
// setupPermissionGuard(router);
|
||||
|
||||
@ -4,31 +4,12 @@ import { MENU_GROUP_IDS } from '@/router/constants';
|
||||
import IconRepository from '@/assets/svg/icon-repository.svg';
|
||||
|
||||
const COMPONENTS: AppRouteRecordRaw[] = [
|
||||
// {
|
||||
// path: '/agent',
|
||||
// name: 'Agent',
|
||||
// redirect: 'agent/index',
|
||||
// meta: {
|
||||
// locale: '扣子智能体',
|
||||
// icon: IconRepository,
|
||||
// requiresAuth: true,
|
||||
// requireLogin: true,
|
||||
// roles: ['*'],
|
||||
// id: MENU_GROUP_IDS.AGENT,
|
||||
// },
|
||||
// children: [
|
||||
// {
|
||||
// path: 'index',
|
||||
// name: 'AgentIndex',
|
||||
// component: () => import('@/views/agent/index'),
|
||||
// meta: {
|
||||
// requiresAuth: false,
|
||||
// requireLogin: true,
|
||||
// },
|
||||
// }
|
||||
//
|
||||
// ],
|
||||
// },
|
||||
{
|
||||
path: '/agent',
|
||||
name: 'AgentPlaceholder',
|
||||
component: () => Promise.resolve({ template: '<router-view />' }), // 占位组件
|
||||
|
||||
},
|
||||
];
|
||||
|
||||
export default COMPONENTS;
|
||||
|
||||
@ -1,46 +0,0 @@
|
||||
import { getCategoriesMenus } from '@/api/all/agent';
|
||||
import type { AppRouteRecordRaw } from '../types';
|
||||
import { MENU_GROUP_IDS } from '@/router/constants';
|
||||
import IconRepository from '@/assets/svg/icon-repository.svg';
|
||||
import { IconBookmark } from '@arco-design/web-vue/es/icon';
|
||||
|
||||
export const loadDynamicMenus = async (routerInstance) => {
|
||||
try {
|
||||
const { code, data } = await getCategoriesMenus();
|
||||
|
||||
let router = [
|
||||
{
|
||||
path: '/repository233',
|
||||
name: 'Repository',
|
||||
redirect: 'repository/brandMaterials',
|
||||
meta: {
|
||||
locale: '品牌资产管理',
|
||||
icon: IconRepository,
|
||||
requiresAuth: true,
|
||||
requireLogin: true,
|
||||
roles: ['*'],
|
||||
id: MENU_GROUP_IDS.PROPERTY_ID,
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'brandMaterials',
|
||||
name: 'RepositoryBrandMaterials',
|
||||
meta: {
|
||||
locale: '品牌信息',
|
||||
requiresAuth: true,
|
||||
requireLogin: true,
|
||||
roles: ['*'],
|
||||
},
|
||||
component: () => import('@/views/property-marketing/brands/brand-materials/index.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
// 添加子路由到名为 Agent 的父路由下
|
||||
router.forEach(route => {
|
||||
routerInstance.addRoute('Agent', route);
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Failed to load dynamic menus:', error);
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user