初始化 ui.

orion-ops-ui/src/router/guard/index.ts

@@ -0,0 +1,17 @@
+import type { Router } from 'vue-router';
+import { setRouteEmitter } from '@/utils/route-listener';
+import setupUserLoginInfoGuard from './userLoginInfo';
+import setupPermissionGuard from './permission';
+
+function setupPageGuard(router: Router) {
+  router.beforeEach(async (to) => {
+    // emit route change
+    setRouteEmitter(to);
+  });
+}
+
+export default function createRouteGuard(router: Router) {
+  setupPageGuard(router);
+  setupUserLoginInfoGuard(router);
+  setupPermissionGuard(router);
+}

orion-ops-ui/src/router/guard/permission.ts

@@ -0,0 +1,55 @@
+import type { Router, RouteRecordNormalized } from 'vue-router';
+import NProgress from 'nprogress'; // progress bar
+
+import usePermission from '@/hooks/permission';
+import { useUserStore, useAppStore } from '@/store';
+import { appRoutes } from '../routes';
+import { WHITE_LIST, NOT_FOUND } from '../constants';
+
+export default function setupPermissionGuard(router: Router) {
+  router.beforeEach(async (to, from, next) => {
+    const appStore = useAppStore();
+    const userStore = useUserStore();
+    const Permission = usePermission();
+    const permissionsAllow = Permission.accessRouter(to);
+    if (appStore.menuFromServer) {
+      // 针对来自服务端的菜单配置进行处理
+      // Handle routing configuration from the server
+
+      // 根据需要自行完善来源于服务端的菜单配置的permission逻辑
+      // Refine the permission logic from the server's menu configuration as needed
+      if (
+        !appStore.appAsyncMenus.length &&
+        !WHITE_LIST.find((el) => el.name === to.name)
+      ) {
+        await appStore.fetchServerMenuConfig();
+      }
+      const serverMenuConfig = [...appStore.appAsyncMenus, ...WHITE_LIST];
+
+      let exist = false;
+      while (serverMenuConfig.length && !exist) {
+        const element = serverMenuConfig.shift();
+        if (element?.name === to.name) exist = true;
+
+        if (element?.children) {
+          serverMenuConfig.push(
+            ...(element.children as unknown as RouteRecordNormalized[])
+          );
+        }
+      }
+      if (exist && permissionsAllow) {
+        next();
+      } else next(NOT_FOUND);
+    } else {
+      // eslint-disable-next-line no-lonely-if
+      if (permissionsAllow) next();
+      else {
+        const destination =
+          Permission.findFirstPermissionRoute(appRoutes, userStore.role) ||
+          NOT_FOUND;
+        next(destination);
+      }
+    }
+    NProgress.done();
+  });
+}

orion-ops-ui/src/router/guard/userLoginInfo.ts

@@ -0,0 +1,43 @@
+import type { Router, LocationQueryRaw } from 'vue-router';
+import NProgress from 'nprogress'; // progress bar
+
+import { useUserStore } from '@/store';
+import { isLogin } from '@/utils/auth';
+
+export default function setupUserLoginInfoGuard(router: Router) {
+  router.beforeEach(async (to, from, next) => {
+    NProgress.start();
+    const userStore = useUserStore();
+    if (isLogin()) {
+      if (userStore.role) {
+        next();
+      } else {
+        try {
+          await userStore.info();
+          next();
+        } catch (error) {
+          await userStore.logout();
+          next({
+            name: 'login',
+            query: {
+              redirect: to.name,
+              ...to.query,
+            } as LocationQueryRaw,
+          });
+        }
+      }
+    } else {
+      if (to.name === 'login') {
+        next();
+        return;
+      }
+      next({
+        name: 'login',
+        query: {
+          redirect: to.name,
+          ...to.query,
+        } as LocationQueryRaw,
+      });
+    }
+  });
+}