fix: 优化页面标签组件与相关路由配置
This commit is contained in:
@@ -54,30 +54,35 @@ export const FALLBACK_MENU_NODES: MenuNode[] = [
|
|||||||
name: '赛事列表',
|
name: '赛事列表',
|
||||||
path: 'events/list',
|
path: 'events/list',
|
||||||
component: 'events/list',
|
component: 'events/list',
|
||||||
|
componentName: 'EventList',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'events_orders',
|
id: 'events_orders',
|
||||||
name: '订单管理',
|
name: '订单管理',
|
||||||
path: 'events/orders',
|
path: 'events/orders',
|
||||||
component: 'events/orders',
|
component: 'events/orders',
|
||||||
|
componentName: 'EventOrders',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'events_users',
|
id: 'events_users',
|
||||||
name: '用户列表',
|
name: '用户列表',
|
||||||
path: 'events/users',
|
path: 'events/users',
|
||||||
component: 'events/users',
|
component: 'events/users',
|
||||||
|
componentName: 'EventUsers',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'events_banner',
|
id: 'events_banner',
|
||||||
name: 'Banner配置',
|
name: 'Banner配置',
|
||||||
path: 'events/banner',
|
path: 'events/banner',
|
||||||
component: 'events/banner',
|
component: 'events/banner',
|
||||||
|
componentName: 'EventBanner',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'events_logs',
|
id: 'events_logs',
|
||||||
name: '赛事操作日志',
|
name: '赛事操作日志',
|
||||||
path: 'events/logs',
|
path: 'events/logs',
|
||||||
component: 'events/logs',
|
component: 'events/logs',
|
||||||
|
componentName: 'EventLogs',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
@@ -92,24 +97,28 @@ export const FALLBACK_MENU_NODES: MenuNode[] = [
|
|||||||
name: '提现申请',
|
name: '提现申请',
|
||||||
path: 'finance/withdraw',
|
path: 'finance/withdraw',
|
||||||
component: 'finance/withdraw',
|
component: 'finance/withdraw',
|
||||||
|
componentName: 'FinanceWithdraw',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'finance_wallet',
|
id: 'finance_wallet',
|
||||||
name: '用户钱包',
|
name: '用户钱包',
|
||||||
path: 'finance/wallet',
|
path: 'finance/wallet',
|
||||||
component: 'finance/wallet',
|
component: 'finance/wallet',
|
||||||
|
componentName: 'FinanceWallet',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'finance_payments',
|
id: 'finance_payments',
|
||||||
name: '支付流水',
|
name: '支付流水',
|
||||||
path: 'finance/payments',
|
path: 'finance/payments',
|
||||||
component: 'finance/payments',
|
component: 'finance/payments',
|
||||||
|
componentName: 'FinancePayments',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'finance_reports',
|
id: 'finance_reports',
|
||||||
name: '账务报表',
|
name: '账务报表',
|
||||||
path: 'finance/reports',
|
path: 'finance/reports',
|
||||||
component: 'finance/reports',
|
component: 'finance/reports',
|
||||||
|
componentName: 'FinanceReports',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
@@ -124,18 +133,21 @@ export const FALLBACK_MENU_NODES: MenuNode[] = [
|
|||||||
name: '用户管理',
|
name: '用户管理',
|
||||||
path: 'system/users',
|
path: 'system/users',
|
||||||
component: 'system/users',
|
component: 'system/users',
|
||||||
|
componentName: 'SystemUsers',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'system_roles',
|
id: 'system_roles',
|
||||||
name: '角色权限',
|
name: '角色权限',
|
||||||
path: 'system/roles',
|
path: 'system/roles',
|
||||||
component: 'system/roles',
|
component: 'system/roles',
|
||||||
|
componentName: 'SystemRoles',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'system_logs',
|
id: 'system_logs',
|
||||||
name: '操作日志',
|
name: '操作日志',
|
||||||
path: 'system/logs',
|
path: 'system/logs',
|
||||||
component: 'system/logs',
|
component: 'system/logs',
|
||||||
|
componentName: 'SystemLogs',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
|||||||
+5
-2
@@ -63,12 +63,15 @@ router.afterEach((to) => {
|
|||||||
// 隐藏的路由(如详情页、编辑页)不进 tab,避免标签栏被噪声污染
|
// 隐藏的路由(如详情页、编辑页)不进 tab,避免标签栏被噪声污染
|
||||||
// /login 也不进 tab
|
// /login 也不进 tab
|
||||||
if (to.meta?.hideInMenu || to.path === '/login') return;
|
if (to.meta?.hideInMenu || to.path === '/login') return;
|
||||||
if (typeof to.name !== 'string' || typeof to.meta?.title !== 'string') return;
|
if (typeof to.meta?.title !== 'string') return;
|
||||||
|
|
||||||
|
const componentName = (to.meta.componentName as string) || (to.name as string);
|
||||||
|
if (!componentName) return;
|
||||||
|
|
||||||
const { addTab } = useTabsStore();
|
const { addTab } = useTabsStore();
|
||||||
addTab({
|
addTab({
|
||||||
path: to.path,
|
path: to.path,
|
||||||
name: to.name,
|
name: componentName,
|
||||||
title: to.meta.title,
|
title: to.meta.title,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -152,6 +152,7 @@ function transformMenuToRoutes(nodes: MenuNode[], parentPath = ''): RouteRecordR
|
|||||||
hideInMenu: node.hideInMenu,
|
hideInMenu: node.hideInMenu,
|
||||||
activeMenu: node.activeMenu,
|
activeMenu: node.activeMenu,
|
||||||
externalLink: node.externalLink,
|
externalLink: node.externalLink,
|
||||||
|
componentName: node.componentName,
|
||||||
},
|
},
|
||||||
} as RouteRecordRaw;
|
} as RouteRecordRaw;
|
||||||
|
|
||||||
|
|||||||
@@ -57,6 +57,12 @@ export interface MenuNode {
|
|||||||
activeMenu?: string;
|
activeMenu?: string;
|
||||||
/** 是否禁用(禁用后路由不注册、菜单不显示) */
|
/** 是否禁用(禁用后路由不注册、菜单不显示) */
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
|
/**
|
||||||
|
* 组件 name(PascalCase,用于 KeepAlive 缓存匹配)
|
||||||
|
* 例如: 'EventList'、'SystemUsers'
|
||||||
|
* 后端下发此字段后路由守卫会自动写入 cachedViews
|
||||||
|
*/
|
||||||
|
componentName?: string;
|
||||||
/** 子菜单/子路由 */
|
/** 子菜单/子路由 */
|
||||||
children?: MenuNode[];
|
children?: MenuNode[];
|
||||||
}
|
}
|
||||||
@@ -101,5 +107,7 @@ declare module 'vue-router' {
|
|||||||
affix?: boolean;
|
affix?: boolean;
|
||||||
/** 不参与标签缓存,即使访问过也不进 keep-alive */
|
/** 不参与标签缓存,即使访问过也不进 keep-alive */
|
||||||
noCache?: boolean;
|
noCache?: boolean;
|
||||||
|
/** 组件 name,用于 KeepAlive 缓存匹配(如 'EventList') */
|
||||||
|
componentName?: string;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user