From 3a8cd9afe96ca0ea7697c0844a13b08d69d4cdf4 Mon Sep 17 00:00:00 2001 From: xingyu Date: Fri, 13 Jan 2023 20:18:46 +0800 Subject: [PATCH] refactor: router --- yudao-ui-admin-vue3/src/main.ts | 2 + yudao-ui-admin-vue3/src/permission.ts | 70 ++++++++++++++++++ yudao-ui-admin-vue3/src/router/index.ts | 71 ------------------- yudao-ui-admin-vue3/src/store/modules/user.ts | 7 +- 4 files changed, 78 insertions(+), 72 deletions(-) create mode 100644 yudao-ui-admin-vue3/src/permission.ts diff --git a/yudao-ui-admin-vue3/src/main.ts b/yudao-ui-admin-vue3/src/main.ts index e7c935a28..e4511d9b1 100644 --- a/yudao-ui-admin-vue3/src/main.ts +++ b/yudao-ui-admin-vue3/src/main.ts @@ -35,6 +35,8 @@ import { createApp } from 'vue' import App from './App.vue' +import './permission' + // 创建实例 const setupAll = async () => { const app = createApp(App) diff --git a/yudao-ui-admin-vue3/src/permission.ts b/yudao-ui-admin-vue3/src/permission.ts new file mode 100644 index 000000000..bcba0119d --- /dev/null +++ b/yudao-ui-admin-vue3/src/permission.ts @@ -0,0 +1,70 @@ +import router from './router' +import type { RouteRecordRaw } from 'vue-router' +import { isRelogin } from '@/config/axios/service' +import { getAccessToken } from '@/utils/auth' +import { useTitle } from '@/hooks/web/useTitle' +import { useNProgress } from '@/hooks/web/useNProgress' +import { usePageLoading } from '@/hooks/web/usePageLoading' +import { useDictStoreWithOut } from '@/store/modules/dict' +import { useUserStoreWithOut } from '@/store/modules/user' +import { usePermissionStoreWithOut } from '@/store/modules/permission' + +const { start, done } = useNProgress() + +const { loadStart, loadDone } = usePageLoading() +// 路由不重定向白名单 +const whiteList = [ + '/login', + '/social-login', + '/auth-redirect', + '/bind', + '/register', + '/oauthLogin/gitee' +] + +// 路由加载前 +router.beforeEach(async (to, from, next) => { + start() + loadStart() + if (getAccessToken()) { + if (to.path === '/login') { + next({ path: '/' }) + } else { + // 获取所有字典 + const dictStore = useDictStoreWithOut() + const userStore = useUserStoreWithOut() + const permissionStore = usePermissionStoreWithOut() + if (!dictStore.getIsSetDict) { + dictStore.setDictMap() + } + if (!userStore.getIsSetUser) { + isRelogin.show = true + await userStore.setUserInfoAction() + isRelogin.show = false + // 后端过滤菜单 + await permissionStore.generateRoutes() + permissionStore.getAddRouters.forEach((route) => { + router.addRoute(route as unknown as RouteRecordRaw) // 动态添加可访问路由表 + }) + const redirectPath = from.query.redirect || to.path + const redirect = decodeURIComponent(redirectPath as string) + const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect } + next(nextData) + } else { + next() + } + } + } else { + if (whiteList.indexOf(to.path) !== -1) { + next() + } else { + next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页 + } + } +}) + +router.afterEach((to) => { + useTitle(to?.meta?.title as string) + done() // 结束Progress + loadDone() +}) diff --git a/yudao-ui-admin-vue3/src/router/index.ts b/yudao-ui-admin-vue3/src/router/index.ts index f5fb53dd6..02d913f86 100644 --- a/yudao-ui-admin-vue3/src/router/index.ts +++ b/yudao-ui-admin-vue3/src/router/index.ts @@ -2,19 +2,6 @@ import type { App } from 'vue' import type { RouteRecordRaw } from 'vue-router' import { createRouter, createWebHashHistory } from 'vue-router' import remainingRouter from './modules/remaining' -import { isRelogin } from '@/config/axios/service' -import { getAccessToken } from '@/utils/auth' -import { useTitle } from '@/hooks/web/useTitle' -import { useNProgress } from '@/hooks/web/useNProgress' -import { usePageLoading } from '@/hooks/web/usePageLoading' -import { useDictStoreWithOut } from '@/store/modules/dict' -import { useUserStoreWithOut } from '@/store/modules/user' -import { usePermissionStoreWithOut } from '@/store/modules/permission' -import { getInfoApi } from '@/api/login' - -const { start, done } = useNProgress() - -const { loadStart, loadDone } = usePageLoading() // 创建路由实例 const router = createRouter({ @@ -24,64 +11,6 @@ const router = createRouter({ scrollBehavior: () => ({ left: 0, top: 0 }) }) -// 路由不重定向白名单 -const whiteList = [ - '/login', - '/social-login', - '/auth-redirect', - '/bind', - '/register', - '/oauthLogin/gitee' -] - -// 路由加载前 -router.beforeEach(async (to, from, next) => { - start() - loadStart() - if (getAccessToken()) { - if (to.path === '/login') { - next({ path: '/' }) - } else { - // 获取所有字典 - const dictStore = useDictStoreWithOut() - const userStore = useUserStoreWithOut() - const permissionStore = usePermissionStoreWithOut() - if (!dictStore.getIsSetDict) { - dictStore.setDictMap() - } - if (!userStore.getIsSetUser) { - isRelogin.show = true - const res = await getInfoApi() - await userStore.setUserInfoAction(res) - isRelogin.show = false - // 后端过滤菜单 - await permissionStore.generateRoutes() - permissionStore.getAddRouters.forEach((route) => { - router.addRoute(route as unknown as RouteRecordRaw) // 动态添加可访问路由表 - }) - const redirectPath = from.query.redirect || to.path - const redirect = decodeURIComponent(redirectPath as string) - const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect } - next(nextData) - } else { - next() - } - } - } else { - if (whiteList.indexOf(to.path) !== -1) { - next() - } else { - next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页 - } - } -}) - -router.afterEach((to) => { - useTitle(to?.meta?.title as string) - done() // 结束Progress - loadDone() -}) - export const resetRouter = (): void => { const resetWhiteNameList = ['Redirect', 'Login', 'NoFind', 'Root'] router.getRoutes().forEach((route) => { diff --git a/yudao-ui-admin-vue3/src/store/modules/user.ts b/yudao-ui-admin-vue3/src/store/modules/user.ts index d4f4df55e..2621e2dff 100644 --- a/yudao-ui-admin-vue3/src/store/modules/user.ts +++ b/yudao-ui-admin-vue3/src/store/modules/user.ts @@ -2,6 +2,7 @@ import { store } from '../index' import { defineStore } from 'pinia' import { getAccessToken, removeToken } from '@/utils/auth' import { CACHE_KEY, useCache } from '@/hooks/web/useCache' +import { getInfoApi } from '@/api/login' const { wsCache } = useCache() @@ -43,11 +44,15 @@ export const useUserStore = defineStore('admin-user', { } }, actions: { - async setUserInfoAction(userInfo: UserInfoVO) { + async setUserInfoAction() { if (!getAccessToken()) { this.resetState() return null } + let userInfo = wsCache.get(CACHE_KEY.USER) + if (!userInfo) { + userInfo = await getInfoApi() + } this.permissions = userInfo.permissions this.roles = userInfo.roles this.user = userInfo.user