2024-11-28 19:34:54 +08:00

58 lines
2.2 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import type { Router } from "vue-router"
import { usePermissionStore } from "@/pinia/stores/permission"
import { useUserStore } from "@/pinia/stores/user"
import { routerConfig } from "@/router/config"
import { isWhiteList } from "@/router/whitelist"
import { setRouteChange } from "@@/composables/useRouteListener"
import { useTitle } from "@@/composables/useTitle"
import { getToken } from "@@/utils/cache/cookies"
import NProgress from "nprogress"
import "nprogress/nprogress.css"
NProgress.configure({ showSpinner: false })
const { setTitle } = useTitle()
export function registerNavigationGuard(router: Router) {
// 全局前置守卫
router.beforeEach(async (to, _from, next) => {
NProgress.start()
const userStore = useUserStore()
const permissionStore = usePermissionStore()
// 如果没有登陆
if (!getToken()) {
// 如果在免登录的白名单中,则直接进入
if (isWhiteList(to)) return next()
// 其他没有访问权限的页面将被重定向到登录页面
return next("/login")
}
// 如果已经登录,并准备进入 Login 页面,则重定向到主页
if (to.path === "/login") return next({ path: "/" })
// 如果用户已经获得其权限角色
if (userStore.roles.length !== 0) return next()
// 否则要重新获取权限角色
try {
await userStore.getInfo()
// 注意:角色必须是一个数组! 例如: ["admin"] 或 ["developer", "editor"]
const roles = userStore.roles
// 生成可访问的 Routes
routerConfig.dynamic ? permissionStore.setRoutes(roles) : permissionStore.setAllRoutes()
// 将 "有访问权限的动态路由" 添加到 Router 中
permissionStore.addRoutes.forEach(route => router.addRoute(route))
// 设置 replace: true, 因此导航将不会留下历史记录
next({ ...to, replace: true })
} catch (error) {
// 过程中发生任何错误,都直接重置 Token并重定向到登录页面
userStore.resetToken()
ElMessage.error((error as Error).message || "路由守卫发生错误")
next("/login")
}
})
// 全局后置钩子
router.afterEach((to) => {
setRouteChange(to)
setTitle(to.meta.title)
NProgress.done()
})
}