From 82aaa2aeadbccc3c276302e98db256309d3ca282 Mon Sep 17 00:00:00 2001 From: wangxiang <1827945911@qq.com> Date: Fri, 15 Apr 2022 20:08:39 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=9F=E5=AE=9E=E7=8E=B0=E7=99=BB?= =?UTF-8?q?=E5=BD=95=E8=AF=B7=E6=B1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- kicc-ui/src/enums/pageEnum.ts | 2 + kicc-ui/src/locales/lang/en/routes/basic.ts | 1 - .../src/locales/lang/zh-CN/routes/basic.ts | 1 - kicc-ui/src/router/constant.ts | 15 +-- kicc-ui/src/router/guard/permissionGuard.ts | 35 ++---- kicc-ui/src/router/index.ts | 25 ++-- kicc-ui/src/router/routes/basic.ts | 110 ++++++++++-------- kicc-ui/src/router/routes/index.ts | 40 +------ .../src/router/routes/modules/dashboard.ts | 1 - kicc-ui/src/store/modules/multipleTab.ts | 4 +- kicc-ui/src/store/modules/permission.ts | 7 +- kicc-ui/src/store/modules/user.ts | 2 - 12 files changed, 97 insertions(+), 146 deletions(-) diff --git a/kicc-ui/src/enums/pageEnum.ts b/kicc-ui/src/enums/pageEnum.ts index 954ab283..80017903 100644 --- a/kicc-ui/src/enums/pageEnum.ts +++ b/kicc-ui/src/enums/pageEnum.ts @@ -6,6 +6,8 @@ */ export enum PageEnum { + // 项目根路径 + ROOT_HOME = '/', // 基本登录路径 BASE_LOGIN = '/login', // 基本首页路径 diff --git a/kicc-ui/src/locales/lang/en/routes/basic.ts b/kicc-ui/src/locales/lang/en/routes/basic.ts index b6faa00e..8a8383f9 100644 --- a/kicc-ui/src/locales/lang/en/routes/basic.ts +++ b/kicc-ui/src/locales/lang/en/routes/basic.ts @@ -1,4 +1,3 @@ export default { login: 'Login', - errorLogList: 'Error Log', }; diff --git a/kicc-ui/src/locales/lang/zh-CN/routes/basic.ts b/kicc-ui/src/locales/lang/zh-CN/routes/basic.ts index 3d03e8ef..206f1ef3 100644 --- a/kicc-ui/src/locales/lang/zh-CN/routes/basic.ts +++ b/kicc-ui/src/locales/lang/zh-CN/routes/basic.ts @@ -1,4 +1,3 @@ export default { login: '登录', - errorLogList: '错误日志列表', }; diff --git a/kicc-ui/src/router/constant.ts b/kicc-ui/src/router/constant.ts index 4da0d140..91485d70 100644 --- a/kicc-ui/src/router/constant.ts +++ b/kicc-ui/src/router/constant.ts @@ -13,19 +13,12 @@ export const PAGE_NOT_FOUND_NAME = 'PageNotFound'; export const EXCEPTION_COMPONENT = () => import('../views/sys/exception/Exception.vue'); -/** - * 默认布局 - */ +/** 默认布局 */ export const LAYOUT = () => import('/@/layouts/default/index.vue'); -/** - * 父布局 - */ +/** 父布局 */ export const getParentLayout = (_name?: string) => { - return () => - new Promise((resolve) => { - resolve({ - name: PARENT_LAYOUT_NAME, - }); + return () => new Promise((resolve) => { + resolve({ name: PARENT_LAYOUT_NAME }); }); }; diff --git a/kicc-ui/src/router/guard/permissionGuard.ts b/kicc-ui/src/router/guard/permissionGuard.ts index 3140a70e..0f432ee6 100644 --- a/kicc-ui/src/router/guard/permissionGuard.ts +++ b/kicc-ui/src/router/guard/permissionGuard.ts @@ -10,43 +10,34 @@ import type { Router, RouteRecordRaw } from 'vue-router'; import { usePermissionStoreWithOut } from '/@/store/modules/permission'; import { PageEnum } from '/@/enums/pageEnum'; import { useUserStoreWithOut } from '/@/store/modules/user'; -import { PAGE_NOT_FOUND_ROUTE } from '/@/router/routes/basic'; -import { RootRoute } from '/@/router/routes'; - +import { PAGE_NOT_FOUND_NAME } from '/@/router/constant'; const LOGIN_PATH = PageEnum.BASE_LOGIN; -const ROOT_PATH = RootRoute.path; -const whitePathList: PageEnum[] = [LOGIN_PATH]; +const ROOT_HOME = PageEnum.ROOT_HOME; +/** 设置路由白名单 */ +const whitePathList: PageEnum[] = [ LOGIN_PATH ]; export function createPermissionGuard(router: Router) { const userStore = useUserStoreWithOut(); const permissionStore = usePermissionStoreWithOut(); router.beforeEach(async (to, from, next) => { - if ( - from.path === ROOT_PATH && - to.path === PageEnum.BASE_HOME && - userStore.getUserInfo.homePath && - userStore.getUserInfo.homePath !== PageEnum.BASE_HOME - ) { + // 首次登录进来进行跳转页面 + if (from.path === ROOT_HOME && to.path === PageEnum.BASE_HOME && userStore.getUserInfo.homePath !== PageEnum.BASE_HOME) { next(userStore.getUserInfo.homePath); return; } - // 白名单可直接进入 if (whitePathList.includes(to.path as PageEnum)) { next(); return; } - const token = userStore.getAccessToken; - // 令牌不存在 if (!token) { - // 您可以在未经许可的情况下访问。您需要将路由 meta.ignoreAuth 设置为 true + // 您可以在未经许可的情况下访问,您需要将路由meta.ignoreAuth设置为true if (to.meta.ignoreAuth) { next(); return; } - // 重定向登录页面 const redirectData: { path: string; replace: boolean; query?: Recordable } = { path: LOGIN_PATH, @@ -61,31 +52,23 @@ export function createPermissionGuard(router: Router) { next(redirectData); return; } - // 处理完登录后未找到页面直接跳转到404页面 - if ( - from.path === LOGIN_PATH && - to.name === PAGE_NOT_FOUND_ROUTE.name && - to.fullPath !== (userStore.getUserInfo.homePath || PageEnum.BASE_HOME) - ) { + if (from.path === LOGIN_PATH && to.name === PAGE_NOT_FOUND_NAME && to.fullPath !== (userStore.getUserInfo.homePath || PageEnum.BASE_HOME)) { next(userStore.getUserInfo.homePath || PageEnum.BASE_HOME); console.log({ from, to }); return; } - if (permissionStore.getIsDynamicAddedRoute) { next(); return; } - const routes = await permissionStore.buildRoutesAction(); routes.forEach((route) => { router.addRoute(route as unknown as RouteRecordRaw); }); - router.addRoute(PAGE_NOT_FOUND_ROUTE as unknown as RouteRecordRaw); permissionStore.setDynamicAddedRoute(true); - if (to.name === PAGE_NOT_FOUND_ROUTE.name) { + if (to.name === PAGE_NOT_FOUND_NAME) { // 动态添加路由后,此处应当重定向到fullPath,否则会加载404页面内容 // fix: 添加query以免丢失 next({ path: to.fullPath, replace: true, query: to.query }); diff --git a/kicc-ui/src/router/index.ts b/kicc-ui/src/router/index.ts index b1709a45..ed56aa57 100644 --- a/kicc-ui/src/router/index.ts +++ b/kicc-ui/src/router/index.ts @@ -7,32 +7,29 @@ import type { RouteRecordRaw } from 'vue-router'; import type { App } from 'vue'; - import { createRouter, createWebHashHistory } from 'vue-router'; -import { basicRoutes } from './routes'; +import { routesConfig } from './routes'; -// 白名单应该包含基本静态路由 -const WHITE_NAME_LIST: string[] = []; -const getRouteNames = (array: any[]) => - array.forEach((item) => { - WHITE_NAME_LIST.push(item.name); - getRouteNames(item.children || []); - }); -getRouteNames(basicRoutes); +// 固定路由,设置基础路由不需要被重置掉 +const AFFIX_NAME_LIST: string[] = []; +const getRouteNames = (array: any[]) => array.forEach((item) => { + AFFIX_NAME_LIST.push(item.name); + getRouteNames(item.children || []); +});getRouteNames(routesConfig); -// 应用路由器 +// 应用配置的静态路由 export const router = createRouter({ history: createWebHashHistory(import.meta.env.VITE_PUBLIC_PATH as string), - routes: basicRoutes as unknown as RouteRecordRaw[], + routes: routesConfig as unknown as RouteRecordRaw[], strict: true, scrollBehavior: () => ({ left: 0, top: 0 }), }); -// 重置路由器 +// 重置所有路由,除基础路由外 export function resetRouter() { router.getRoutes().forEach((route) => { const { name } = route; - if (name && !WHITE_NAME_LIST.includes(name as string)) { + if (name && !AFFIX_NAME_LIST.includes(name as string)) { router.hasRoute(name) && router.removeRoute(name); } }); diff --git a/kicc-ui/src/router/routes/basic.ts b/kicc-ui/src/router/routes/basic.ts index fc413d95..6c57a789 100644 --- a/kicc-ui/src/router/routes/basic.ts +++ b/kicc-ui/src/router/routes/basic.ts @@ -7,56 +7,70 @@ */ import type { AppRouteRecordRaw } from '/@/router/types'; -import { - REDIRECT_NAME, - LAYOUT, - EXCEPTION_COMPONENT, - PAGE_NOT_FOUND_NAME, -} from '/@/router/constant'; +import { REDIRECT_NAME, LAYOUT, EXCEPTION_COMPONENT, PAGE_NOT_FOUND_NAME } from '/@/router/constant'; +import { PageEnum } from "/@/enums/pageEnum"; +import { useI18n } from "/@/hooks/web/useI18n"; +const { t } = useI18n(); -// 页面上的 404 -export const PAGE_NOT_FOUND_ROUTE: AppRouteRecordRaw = { - path: '/:path(.*)*', - name: PAGE_NOT_FOUND_NAME, - component: LAYOUT, - meta: { - title: 'ErrorPage', - hideBreadcrumb: true, - hideMenu: true, +/** 基础路由配置 */ +export const basicRoute: AppRouteRecordRaw[] = [ + { + path: PageEnum.ROOT_HOME, + name: 'Root', + redirect: PageEnum.BASE_HOME, + meta: { + title: 'Root', + } }, - children: [ - { - path: '/:path(.*)*', - name: PAGE_NOT_FOUND_NAME, - component: EXCEPTION_COMPONENT, - meta: { - title: 'ErrorPage', - hideBreadcrumb: true, - hideMenu: true, - }, + { + path: '/login', + name: 'Login', + component: () => import('/@/views/sys/login/Login.vue'), + meta: { + title: t('routes.basic.login'), + } + }, + { + path: '/:path(.*)*', + name: PAGE_NOT_FOUND_NAME, + component: LAYOUT, + meta: { + title: 'ErrorPage', + hideBreadcrumb: true, + hideMenu: true, }, - ], -}; - -export const REDIRECT_ROUTE: AppRouteRecordRaw = { - path: '/redirect', - name: REDIRECT_NAME, - component: LAYOUT, - meta: { - title: REDIRECT_NAME, - hideBreadcrumb: true, - hideMenu: true, + children: [ + { + path: '/:path(.*)*', + name: PAGE_NOT_FOUND_NAME, + component: EXCEPTION_COMPONENT, + meta: { + title: 'ErrorPage', + hideBreadcrumb: true, + hideMenu: true, + } + } + ] }, - children: [ - { - path: '/redirect/:path(.*)', - name: REDIRECT_NAME, - component: () => import('/@/views/sys/redirect/index.vue'), - meta: { - title: REDIRECT_NAME, - hideBreadcrumb: true, - }, + { + path: '/redirect', + name: REDIRECT_NAME, + component: LAYOUT, + meta: { + title: REDIRECT_NAME, + hideBreadcrumb: true, + hideMenu: true, }, - ], -}; - + children: [ + { + path: '/redirect/:path(.*)', + name: REDIRECT_NAME, + component: () => import('/@/views/sys/redirect/index.vue'), + meta: { + title: REDIRECT_NAME, + hideBreadcrumb: true, + } + } + ] + } +]; diff --git a/kicc-ui/src/router/routes/index.ts b/kicc-ui/src/router/routes/index.ts index f5f52f7f..3a70d382 100644 --- a/kicc-ui/src/router/routes/index.ts +++ b/kicc-ui/src/router/routes/index.ts @@ -5,16 +5,9 @@ * @create: 2022/4/9 */ -import type { AppRouteRecordRaw, AppRouteModule } from '/@/router/types'; - -import { PAGE_NOT_FOUND_ROUTE, REDIRECT_ROUTE } from '/@/router/routes/basic'; - -import { PageEnum } from '/@/enums/pageEnum'; -import {useI18n} from "/@/hooks/web/useI18n"; -const { t } = useI18n(); - +import type { AppRouteModule } from '/@/router/types'; +import { basicRoute } from './basic'; const modules = import.meta.globEager('./modules/**/*.ts'); - const routeModuleList: AppRouteModule[] = []; Object.keys(modules).forEach((key) => { @@ -23,30 +16,7 @@ Object.keys(modules).forEach((key) => { routeModuleList.push(...modList); }); -export const asyncRoutes = [PAGE_NOT_FOUND_ROUTE, ...routeModuleList]; - -export const RootRoute: AppRouteRecordRaw = { - path: '/', - name: 'Root', - redirect: PageEnum.BASE_HOME, - meta: { - title: 'Root', - }, -}; - -export const LoginRoute: AppRouteRecordRaw = { - path: '/login', - name: 'Login', - component: () => import('/@/views/sys/login/Login.vue'), - meta: { - title: t('routes.basic.login'), - }, -}; - -// 白名单未经许可的基本路由 -export const basicRoutes = [ - LoginRoute, - RootRoute, - REDIRECT_ROUTE, - PAGE_NOT_FOUND_ROUTE, +export const routesConfig = [ + ...basicRoute, + ...routeModuleList ]; diff --git a/kicc-ui/src/router/routes/modules/dashboard.ts b/kicc-ui/src/router/routes/modules/dashboard.ts index caddd76c..838d3733 100644 --- a/kicc-ui/src/router/routes/modules/dashboard.ts +++ b/kicc-ui/src/router/routes/modules/dashboard.ts @@ -6,7 +6,6 @@ */ import type { AppRouteModule } from '/@/router/types'; - import { LAYOUT } from '/@/router/constant'; import {useI18n} from "/@/hooks/web/useI18n"; const { t } = useI18n(); diff --git a/kicc-ui/src/store/modules/multipleTab.ts b/kicc-ui/src/store/modules/multipleTab.ts index 3e664d08..37f508f1 100644 --- a/kicc-ui/src/store/modules/multipleTab.ts +++ b/kicc-ui/src/store/modules/multipleTab.ts @@ -12,7 +12,7 @@ import { store } from '/@/store'; import { useGo, useRedo } from '/@/hooks/web/usePage'; import { Persistent } from '/@/utils/cache/persistent'; import { PageEnum } from '/@/enums/pageEnum'; -import { PAGE_NOT_FOUND_ROUTE, REDIRECT_ROUTE } from '/@/router/routes/basic'; +import { PAGE_NOT_FOUND_NAME, REDIRECT_NAME } from '/@/router/constant'; import { getRawRoute } from '/@/utils'; import { MULTIPLE_TABS_KEY } from '/@/enums/cacheEnum'; import projectSetting from '/@/settings/projectSetting'; @@ -117,7 +117,7 @@ export const useMultipleTabStore = defineStore({ path === PageEnum.ERROR_PAGE || path === PageEnum.BASE_LOGIN || !name || - [REDIRECT_ROUTE.name, PAGE_NOT_FOUND_ROUTE.name].includes(name as string) + [REDIRECT_NAME, PAGE_NOT_FOUND_NAME].includes(name as string) ) { return; } diff --git a/kicc-ui/src/store/modules/permission.ts b/kicc-ui/src/store/modules/permission.ts index 5ee21547..e285f67e 100644 --- a/kicc-ui/src/store/modules/permission.ts +++ b/kicc-ui/src/store/modules/permission.ts @@ -13,7 +13,6 @@ import { useI18n } from '/@/hooks/web/useI18n'; import { useUserStore } from './user'; import { transformObjToRoute } from '/@/router/helper/routeHelper'; import { transformRouteToMenu } from '/@/router/helper/menuHelper'; -import { PAGE_NOT_FOUND_ROUTE } from '/@/router/routes/basic'; import { filter } from '/@/utils/helper/treeHelper'; import { getMenuList } from '/@/api/sys/menu'; import { useMessage } from '/@/hooks/web/useMessage'; @@ -68,7 +67,6 @@ export const usePermissionStore = defineStore({ async buildRoutesAction(): Promise { const { t } = useI18n(); const userStore = useUserStore(); - let routes: AppRouteRecordRaw[] = []; const routeRemoveIgnoreFilter = (route: AppRouteRecordRaw) => { const { meta } = route; const { ignoreRoute } = meta || {}; @@ -119,9 +117,8 @@ export const usePermissionStore = defineStore({ this.setMenuList(menuList); // 过滤忽略路由配置项,只构建菜单不构建路由 routeList = filter(routeList, routeRemoveIgnoreFilter); - routes = [PAGE_NOT_FOUND_ROUTE, ...routeList]; - patchHomeAffix(routes); - return routes; + patchHomeAffix(routeList); + return routeList; }).catch(error => { console.error(error); })) as AppRouteRecordRaw[]; diff --git a/kicc-ui/src/store/modules/user.ts b/kicc-ui/src/store/modules/user.ts index 7a36f17d..a4d35101 100644 --- a/kicc-ui/src/store/modules/user.ts +++ b/kicc-ui/src/store/modules/user.ts @@ -18,7 +18,6 @@ import {useMessage} from '/@/hooks/web/useMessage'; import {router} from '/@/router'; import {usePermissionStore} from '/@/store/modules/permission'; import {RouteRecordRaw} from 'vue-router'; -import {PAGE_NOT_FOUND_ROUTE} from '/@/router/routes/basic'; interface UserState { userInfo: Nullable; @@ -118,7 +117,6 @@ export const useUserStore = defineStore({ routes.forEach((route) => { router.addRoute(route as unknown as RouteRecordRaw); }); - router.addRoute(PAGE_NOT_FOUND_ROUTE as unknown as RouteRecordRaw); permissionStore.setDynamicAddedRoute(true); } await router.replace(userInfo.homePath || PageEnum.BASE_HOME);