index.ts 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. import type { App } from 'vue'
  2. import type { RouteRecordRaw } from 'vue-router'
  3. import { createRouter, createWebHashHistory } from 'vue-router'
  4. import remainingRouter from './modules/remaining'
  5. import { isRelogin } from '@/config/axios/service'
  6. import { getAccessToken } from '@/utils/auth'
  7. import { useTitle } from '@/hooks/web/useTitle'
  8. import { useNProgress } from '@/hooks/web/useNProgress'
  9. import { usePageLoading } from '@/hooks/web/usePageLoading'
  10. import { useDictStoreWithOut } from '@/store/modules/dict'
  11. import { useUserStoreWithOut } from '@/store/modules/user'
  12. import { usePermissionStoreWithOut } from '@/store/modules/permission'
  13. import { getInfoApi } from '@/api/login'
  14. const { start, done } = useNProgress()
  15. const { loadStart, loadDone } = usePageLoading()
  16. // 创建路由实例
  17. const router = createRouter({
  18. history: createWebHashHistory(), // createWebHashHistory URL带#,createWebHistory URL不带#
  19. strict: true,
  20. routes: remainingRouter as RouteRecordRaw[],
  21. scrollBehavior: () => ({ left: 0, top: 0 })
  22. })
  23. // 路由不重定向白名单
  24. const whiteList = [
  25. '/login',
  26. '/social-login',
  27. '/auth-redirect',
  28. '/bind',
  29. '/register',
  30. '/oauthLogin/gitee'
  31. ]
  32. // 路由加载前
  33. router.beforeEach(async (to, from, next) => {
  34. start()
  35. loadStart()
  36. if (getAccessToken()) {
  37. if (to.path === '/login') {
  38. next({ path: '/' })
  39. } else {
  40. // 获取所有字典
  41. const dictStore = useDictStoreWithOut()
  42. const userStore = useUserStoreWithOut()
  43. const permissionStore = usePermissionStoreWithOut()
  44. if (!dictStore.getIsSetDict) {
  45. dictStore.setDictMap()
  46. }
  47. if (!userStore.getIsSetUser) {
  48. isRelogin.show = true
  49. const res = await getInfoApi()
  50. await userStore.setUserInfoAction(res)
  51. isRelogin.show = false
  52. // 后端过滤菜单
  53. await permissionStore.generateRoutes()
  54. permissionStore.getAddRouters.forEach((route) => {
  55. router.addRoute(route as unknown as RouteRecordRaw) // 动态添加可访问路由表
  56. })
  57. const redirectPath = from.query.redirect || to.path
  58. const redirect = decodeURIComponent(redirectPath as string)
  59. const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect }
  60. next(nextData)
  61. } else {
  62. next()
  63. }
  64. }
  65. } else {
  66. if (whiteList.indexOf(to.path) !== -1) {
  67. next()
  68. } else {
  69. next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
  70. }
  71. }
  72. })
  73. router.afterEach((to) => {
  74. useTitle(to?.meta?.title as string)
  75. done() // 结束Progress
  76. loadDone()
  77. })
  78. export const resetRouter = (): void => {
  79. const resetWhiteNameList = ['Redirect', 'Login', 'NoFind', 'Root']
  80. router.getRoutes().forEach((route) => {
  81. const { name } = route
  82. if (name && !resetWhiteNameList.includes(name as string)) {
  83. router.hasRoute(name) && router.removeRoute(name)
  84. }
  85. })
  86. }
  87. export const setupRouter = (app: App<Element>) => {
  88. app.use(router)
  89. }
  90. export default router