122 lines
4.3 KiB
TypeScript
122 lines
4.3 KiB
TypeScript
import router from './router'
|
|
import { useAppStoreWithOut } from '@/store/modules/app'
|
|
import type { RouteRecordRaw } from 'vue-router'
|
|
import { useTitle } from '@/hooks/web/useTitle'
|
|
import { useNProgress } from '@/hooks/web/useNProgress'
|
|
import { usePermissionStoreWithOut } from '@/store/modules/permission'
|
|
import { usePageLoading } from '@/hooks/web/usePageLoading'
|
|
import { NO_REDIRECT_WHITE_LIST } from '@/constants'
|
|
import { useUserStoreWithOut } from '@/store/modules/user'
|
|
import { getMyMenus } from '@/api/permission'
|
|
import { isRealRoute } from '@/utils/routerHelper'
|
|
|
|
const { start, done } = useNProgress()
|
|
|
|
const { loadStart, loadDone } = usePageLoading()
|
|
|
|
// 默认落地页 = 超管分配的第一个菜单页;只认「真能解析出路由」的路径,避免菜单表里失效路径导致 404
|
|
const firstMenuPath = (paths?: unknown) =>
|
|
((paths as string[]) || []).find((p) => {
|
|
if (typeof p !== 'string' || !p.includes('/index')) return false
|
|
const matched = router.resolve(p).matched
|
|
return matched.length > 0 && !matched.some((m) => m.name === '404Page')
|
|
}) as string | undefined
|
|
|
|
router.beforeEach(async (to, from, next) => {
|
|
start()
|
|
loadStart()
|
|
const permissionStore = usePermissionStoreWithOut()
|
|
const appStore = useAppStoreWithOut()
|
|
const userStore = useUserStoreWithOut()
|
|
console.log(
|
|
'[permission] to.path=',
|
|
to.path,
|
|
'to.matched=',
|
|
to.matched.length,
|
|
'isAddRouters=',
|
|
permissionStore.getIsAddRouters,
|
|
'hasUser=',
|
|
!!userStore.getUserInfo
|
|
)
|
|
if (userStore.getUserInfo) {
|
|
if (to.path === '/login') {
|
|
next({ path: firstMenuPath(userStore.getRoleRouters) || '/' })
|
|
} else {
|
|
if (permissionStore.getIsAddRouters) {
|
|
next()
|
|
return
|
|
}
|
|
|
|
// 每次路由初始化时从后端实时获取最新菜单权限
|
|
let roleRouters: string[] = []
|
|
try {
|
|
const res = (await getMyMenus()) as any
|
|
if (res && res.data && res.data.length > 0) {
|
|
roleRouters = res.data
|
|
userStore.setRoleRouters(roleRouters)
|
|
}
|
|
} catch (e) {
|
|
// 接口失败时回退使用缓存
|
|
roleRouters = (userStore.getRoleRouters as string[]) || []
|
|
}
|
|
|
|
// 是否使用动态路由
|
|
if (appStore.getDynamicRouter) {
|
|
appStore.serverDynamicRouter
|
|
? await permissionStore.generateRoutes(
|
|
'server',
|
|
roleRouters as unknown as AppCustomRouteRecordRaw[]
|
|
)
|
|
: await permissionStore.generateRoutes('frontEnd', roleRouters as string[])
|
|
} else {
|
|
await permissionStore.generateRoutes('static')
|
|
}
|
|
|
|
permissionStore.getAddRouters.forEach((route) => {
|
|
router.addRoute(route as unknown as RouteRecordRaw) // 动态添加可访问路由表
|
|
})
|
|
console.log(
|
|
'[permission] roleRouters=',
|
|
roleRouters,
|
|
'addRouters=',
|
|
permissionStore.getAddRouters.map((r: any) => r.path)
|
|
)
|
|
const redirectPath = from.query.redirect || to.path
|
|
const redirect = decodeURIComponent(redirectPath as string)
|
|
// 过滤掉兜底 404 路由
|
|
const realRoutes = permissionStore.getAddRouters.filter(
|
|
(r) => r.path !== '/:path(.*)*' && r.name !== '404Page'
|
|
)
|
|
const firstRoute = realRoutes[0]
|
|
const firstPath = firstMenuPath(roleRouters) || firstRoute?.path || '/'
|
|
// 只有真能解析出路由的 redirect 才作数,否则落到第一个可用菜单页。
|
|
// 旧写法会把 redirect(例如强制登出时留在 URL 上的 /404)原样 next(),直接撞 404 兜底。
|
|
const finalPath = isRealRoute(router, redirect) ? redirect : firstPath
|
|
const nextData = to.path === finalPath ? { ...to, replace: true } : { path: finalPath }
|
|
console.log(
|
|
'[permission] redirect=',
|
|
redirect,
|
|
'firstPath=',
|
|
firstPath,
|
|
'finalPath=',
|
|
finalPath
|
|
)
|
|
permissionStore.setIsAddRouters(true)
|
|
next(nextData)
|
|
}
|
|
} else {
|
|
if (NO_REDIRECT_WHITE_LIST.indexOf(to.path) !== -1) {
|
|
next()
|
|
} else {
|
|
// 未登录:'/404' 这种本身就不该存在的路径不要写进 redirect,否则登录后又被跳回 404
|
|
next(to.path === '/404' || to.name === '404Page' ? '/login' : `/login?redirect=${to.path}`)
|
|
}
|
|
}
|
|
})
|
|
|
|
router.afterEach((to) => {
|
|
useTitle(to?.meta?.title as string)
|
|
done() // 结束Progress
|
|
loadDone()
|
|
})
|