simplify and optimize dynamic route registration
This commit is contained in:
parent
06283becab
commit
984d23723e
@ -2,7 +2,7 @@ import { defineStore } from 'pinia'
|
||||
import { computed, ref } from 'vue'
|
||||
import type { Router } from 'vue-router'
|
||||
import { t } from '../i18n'
|
||||
import { registerToolRoute, unregisterToolRoute, syncToolRoutes, registerAllToolRoutes } from '../utils/dynamicRoutes'
|
||||
import { registerToolRoute, unregisterToolRoute, registerAllToolRoutes } from '../utils/dynamicRoutes'
|
||||
|
||||
export interface Tool {
|
||||
id: string
|
||||
@ -203,11 +203,6 @@ export const useToolsStore = defineStore('tools', () => {
|
||||
registerAllToolRoutes(router, userTools.value)
|
||||
}
|
||||
|
||||
// 同步工具路由(移除不存在的,添加新的)
|
||||
function syncRoutes(router: Router) {
|
||||
syncToolRoutes(router, userTools.value)
|
||||
}
|
||||
|
||||
return {
|
||||
userTools,
|
||||
hiddenDefaultToolIds,
|
||||
@ -220,8 +215,7 @@ export const useToolsStore = defineStore('tools', () => {
|
||||
showDefaultTool,
|
||||
updateUserToolsOrder,
|
||||
getDefaultTools,
|
||||
initToolRoutes,
|
||||
syncRoutes
|
||||
initToolRoutes
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
@ -27,17 +27,8 @@ export function registerToolRoute(
|
||||
return false
|
||||
}
|
||||
|
||||
// 确定组件路径
|
||||
// 1. 如果提供了 componentPath,使用它
|
||||
// 2. 如果工具有 componentPath 属性,使用它
|
||||
// 3. 默认使用 tools/{routeName}.vue
|
||||
const finalComponentPath =
|
||||
componentPath ||
|
||||
tool.componentPath ||
|
||||
`../../views/tools/${tool.routeName}.vue`
|
||||
|
||||
// 构建路由路径
|
||||
// 默认使用 tools/{id},但可以通过 tool.routePath 自定义
|
||||
// 确定组件路径和路由路径
|
||||
const finalComponentPath = componentPath || tool.componentPath || `../../views/tools/${tool.routeName}.vue`
|
||||
const routePath = tool.routePath || `tools/${tool.id}`
|
||||
|
||||
// 创建路由配置,添加组件加载错误处理
|
||||
@ -62,14 +53,7 @@ export function registerToolRoute(
|
||||
try {
|
||||
// 将路由添加到 AppLayout 的 children 下
|
||||
// AppLayout 路由应该在应用启动时已存在
|
||||
const parentRouteName = router.hasRoute('AppLayout') ? 'AppLayout' : null
|
||||
if (parentRouteName) {
|
||||
router.addRoute(parentRouteName, route)
|
||||
} else {
|
||||
// 如果 AppLayout 不存在,直接添加到根路由(不应该发生,但作为降级方案)
|
||||
console.warn('AppLayout route not found, adding tool route to root')
|
||||
router.addRoute(route)
|
||||
}
|
||||
router.addRoute('AppLayout', route)
|
||||
console.log(`Tool route registered: ${tool.routeName} -> ${routePath}`)
|
||||
return true
|
||||
} catch (error) {
|
||||
@ -113,41 +97,3 @@ export function registerAllToolRoutes(router: Router, tools: Tool[]): void {
|
||||
console.log(`Registered ${routeTools.length} tool routes`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 同步工具路由(移除不存在的工具路由,添加新的工具路由)
|
||||
* @param router Vue Router 实例
|
||||
* @param currentTools 当前工具列表
|
||||
*/
|
||||
export function syncToolRoutes(router: Router, currentTools: Tool[]): void {
|
||||
// 获取所有已注册的路由
|
||||
const registeredRoutes = router.getRoutes()
|
||||
|
||||
// 找出所有工具路由(通过 meta.toolId 识别)
|
||||
const toolRoutes = registeredRoutes.filter((route) =>
|
||||
route.meta?.toolId && !route.meta?.isDefault
|
||||
)
|
||||
|
||||
// 当前应该存在的工具路由名称
|
||||
const currentRouteNames = new Set(
|
||||
currentTools
|
||||
.filter(t => t.type === 'route' && t.routeName && !t.isDefault)
|
||||
.map(t => t.routeName!)
|
||||
)
|
||||
|
||||
// 移除不再存在的工具路由
|
||||
toolRoutes.forEach((route) => {
|
||||
if (route.name && typeof route.name === 'string' && !currentRouteNames.has(route.name)) {
|
||||
unregisterToolRoute(router, route.name)
|
||||
}
|
||||
})
|
||||
|
||||
// 添加新的工具路由
|
||||
currentTools
|
||||
.filter(t => t.type === 'route' && t.routeName && !t.isDefault)
|
||||
.forEach(tool => {
|
||||
if (tool.routeName && !router.hasRoute(tool.routeName)) {
|
||||
registerToolRoute(router, tool)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user