Files
CN_Tool_client/frontend/src/routers/modules/dynamicRouter.ts

148 lines
4.9 KiB
TypeScript
Raw Normal View History

2026-04-13 17:32:58 +08:00
import router from '@/routers'
import { LOGIN_URL } from '@/config'
import { type RouteRecordRaw } from 'vue-router'
import { ElNotification } from 'element-plus'
import { useUserStore } from '@/stores/modules/user'
import { useAuthStore } from '@/stores/modules/auth'
// 引入 views 文件夹下所有 vue 文件
const modules = import.meta.glob('@/views/**/*.vue')
2026-04-16 08:11:38 +08:00
const STATIC_ROUTE_NAMES = new Set(['layout', 'login', 'home', 'tools', 'toolWaveform', 'toolMmsMapping', '403', '404', '500'])
2026-04-13 17:32:58 +08:00
let isInitializing = false
/**
*
*/
const clearDynamicRoutes = () => {
const routes = router.getRoutes()
routes.forEach(route => {
if (route.name && !STATIC_ROUTE_NAMES.has(String(route.name))) {
router.removeRoute(route.name)
}
})
}
/**
2026-04-16 08:11:38 +08:00
* component
*
* 1. /foo/bar.vue
* 2. /foo/bar/index.vue
2026-04-13 17:32:58 +08:00
*/
2026-04-16 08:11:38 +08:00
const resolveComponentModule = (path: string) => {
2026-04-13 17:32:58 +08:00
let normalizedPath = path.trim()
if (!normalizedPath.startsWith('/')) {
normalizedPath = '/' + normalizedPath
}
if (normalizedPath.endsWith('.vue')) {
normalizedPath = normalizedPath.slice(0, -4)
}
2026-04-16 08:11:38 +08:00
if (normalizedPath.length > 1 && normalizedPath.endsWith('/')) {
normalizedPath = normalizedPath.slice(0, -1)
}
const candidatePaths = [`/src/views${normalizedPath}.vue`, `/src/views${normalizedPath}/index.vue`]
2026-04-13 17:32:58 +08:00
2026-04-16 08:11:38 +08:00
for (const candidatePath of candidatePaths) {
const moduleLoader = modules[candidatePath]
if (moduleLoader) {
return {
moduleLoader,
resolvedPath: candidatePath
}
}
}
return {
moduleLoader: undefined,
resolvedPath: candidatePaths
}
2026-04-13 17:32:58 +08:00
}
/**
* @description
*/
export const initDynamicRouter = async () => {
if (isInitializing) return Promise.reject(new Error('Dynamic router initialization in progress'))
isInitializing = true
const userStore = useUserStore()
const authStore = useAuthStore()
2026-04-16 08:11:38 +08:00
const unresolvedRoutes: Array<{ name?: string; path?: string; component?: string; candidates: string[] }> = []
2026-04-13 17:32:58 +08:00
try {
// 1. 获取菜单列表 && 按钮权限列表
await authStore.getAuthMenuList()
await authStore.getAuthButtonList()
// 2. 判断当前用户有没有菜单权限
if (!authStore.authMenuListGet.length) {
ElNotification({
title: '无权限访问',
message: '当前账号无任何菜单权限,请联系系统管理员!',
type: 'warning',
duration: 3000
})
userStore.setAccessToken('')
userStore.setRefreshToken('')
userStore.setExp(0)
await router.replace(LOGIN_URL)
return Promise.reject('No permission')
}
// 3. 清理之前的动态路由
clearDynamicRoutes()
// 4. 添加动态路由
for (const item of authStore.flatMenuListGet) {
// 删除 children 避免冗余嵌套
if (item.children) delete item.children
// 处理组件映射
if (item.component && typeof item.component === 'string') {
2026-04-16 08:11:38 +08:00
const { moduleLoader, resolvedPath } = resolveComponentModule(item.component)
2026-04-13 17:32:58 +08:00
if (moduleLoader) {
item.component = moduleLoader
} else {
2026-04-16 08:11:38 +08:00
// 动态路由组件一旦解析失败,对应菜单会落入 404这里必须打印清楚候选路径。
unresolvedRoutes.push({
name: item.name,
path: item.path,
component: item.component,
candidates: resolvedPath
})
2026-04-13 17:32:58 +08:00
continue
}
}
// 类型守卫:确保满足 RouteRecordRaw 接口要求
if (
typeof item.path === 'string' &&
(typeof item.component === 'function' || typeof item.redirect === 'string')
) {
const routeItem = item as unknown as RouteRecordRaw
2026-04-16 08:11:38 +08:00
if (item.meta?.isFull) {
2026-04-13 17:32:58 +08:00
router.addRoute(routeItem)
} else {
router.addRoute('layout', routeItem)
}
} else {
console.warn('Invalid route item:', item)
}
}
2026-04-16 08:11:38 +08:00
if (unresolvedRoutes.length) {
console.error('[dynamic-router] unresolved route components', unresolvedRoutes)
}
2026-04-13 17:32:58 +08:00
} catch (error) {
// 当按钮 || 菜单请求出错时,重定向到登陆页
userStore.setAccessToken('')
userStore.setRefreshToken('')
userStore.setExp(0)
await router.replace(LOGIN_URL)
return Promise.reject(error)
} finally {
isInitializing = false
}
}