Explorar o código

feat: 重构路由守卫逻辑,移除 guard.js 文件并整合到 index.js

张涛 hai 1 ano
pai
achega
5ea7c30391
Modificáronse 4 ficheiros con 49 adicións e 51 borrados
  1. 0 1
      src/index.js
  2. 0 49
      src/router/guard.js
  3. 48 0
      src/router/index.js
  4. 1 1
      src/views/common/header-btns/ModalLogout.vue

+ 0 - 1
src/index.js

@@ -18,7 +18,6 @@ import WujieVue from 'wujie-vue3';
 import App from './App.vue';
 
 import router from './router'; // 路由
-import './router/guard';
 import directive from './directive'; // 指令
 import { setupI18n } from './i18n';
 

+ 0 - 49
src/router/guard.js

@@ -1,49 +0,0 @@
-import router from './index';
-import { kuky_Authorization } from '../base/storage';
-import { initializeRoutes } from '../utils/permission';
-
-/** 免验证白名单 */
-const whiteList = ['/login', '/reg', '/noPer'];
-
-/** 是否已经生成过路由表 */
-let hasRouteFlag = false;
-export const resetHasRouteFlag = () => {
-  hasRouteFlag = false;
-};
-// 扁平路由表
-let flatRoutes = [];
-
-router.beforeEach(async (to, from, next) => {
-  const isAuthorized = kuky_Authorization.get(); // 获取用户授权状态
-  const isLoginPage = to.path === '/login'; // 判断目标路径是否为登录页
-  const isInWhiteList = whiteList.includes(to.path); // 检查目标路径是否在白名单中
-
-  // 用户已授权的情况
-  if (isAuthorized) {
-    if (!hasRouteFlag) {
-      const { formattedRoutes, accessFlatRoutes } = await initializeRoutes();
-      formattedRoutes.forEach((route) => {
-        if (route.path && route.component) {
-          router.addRoute(route); // 动态添加可访问路由表
-        }
-      });
-      flatRoutes = accessFlatRoutes;
-      hasRouteFlag = true;
-      next({ ...to, replace: true });
-    } else if (isLoginPage) {
-      next('/');
-    } else if (!flatRoutes.some((route) => route.path == to.path) && !isInWhiteList) {
-      next('/noPer'); // 如果用户无访问权限且不在白名单中,重定向到无权限页面
-    } else {
-      next(); // 其他情况,正常访问
-    }
-  } else {
-    // 用户未授权的情况
-    if (isInWhiteList) {
-      // 如果目标路径在免登录白名单中
-      next(); // 允许进入
-    } else {
-      next('/login'); // 否则重定向到登录页面
-    }
-  }
-});

+ 48 - 0
src/router/index.js

@@ -1,5 +1,7 @@
 import { createRouter, createWebHashHistory } from 'vue-router';
 import { systemRoutes } from './route';
+import { kuky_Authorization } from '../base/storage';
+import { initializeRoutes } from '../utils/permission';
 
 const router = createRouter({
   history: createWebHashHistory(),
@@ -7,4 +9,50 @@ const router = createRouter({
   scrollBehavior: () => ({ left: 0, top: 0 })
 });
 
+/** 免验证白名单 */
+const whiteList = ['/login', '/reg', '/noPer'];
+
+/** 是否已经生成过路由表 */
+let hasRouteFlag = false;
+export const resetHasRouteFlag = () => {
+  hasRouteFlag = false;
+};
+// 扁平路由表
+let flatRoutes = [];
+
+router.beforeEach(async (to, from, next) => {
+  const isAuthorized = kuky_Authorization.get(); // 获取用户授权状态
+  const isLoginPage = to.path === '/login'; // 判断目标路径是否为登录页
+  const isInWhiteList = whiteList.includes(to.path); // 检查目标路径是否在白名单中
+
+  // 用户已授权的情况
+  if (isAuthorized) {
+    if (!hasRouteFlag) {
+      const { formattedRoutes, accessFlatRoutes } = await initializeRoutes();
+      formattedRoutes.forEach((route) => {
+        if (route.path && route.component) {
+          router.addRoute(route); // 动态添加可访问路由表
+        }
+      });
+      flatRoutes = accessFlatRoutes;
+      hasRouteFlag = true;
+      next({ ...to, replace: true });
+    } else if (isLoginPage) {
+      next('/');
+    } else if (!flatRoutes.some((route) => route.path == to.path) && !isInWhiteList) {
+      next('/noPer'); // 如果用户无访问权限且不在白名单中,重定向到无权限页面
+    } else {
+      next(); // 其他情况,正常访问
+    }
+  } else {
+    // 用户未授权的情况
+    if (isInWhiteList) {
+      // 如果目标路径在免登录白名单中
+      next(); // 允许进入
+    } else {
+      next('/login'); // 否则重定向到登录页面
+    }
+  }
+});
+
 export default router;

+ 1 - 1
src/views/common/header-btns/ModalLogout.vue

@@ -10,7 +10,7 @@
 import { computed } from 'vue';
 import { useRouter } from 'vue-router';
 import { kuky_Authorization } from '../../../base/storage';
-import { resetHasRouteFlag } from '../../../router/guard';
+import { resetHasRouteFlag } from '../../../router';
 const props = defineProps({
   visible: {
     type: Boolean,