feat: 用户权限,修改系统主题色

src/App.vue

@@ -1,10 +1,21 @@
 <script setup lang="ts">
 import { NConfigProvider } from "naive-ui";
 import { zhCN, dateZhCN } from "naive-ui";
+const themeOverrides = {
+  common: {
+    primaryColor: "#646CFF",
+    primaryColorHover: "rgba(100,108,255,.8)",
+    primaryColorPressed: "rgba(100,108,255,.8)",
+  },
+};
 </script>
 
 <template>
-  <n-config-provider :locale="zhCN" :date-locale="dateZhCN">
+  <n-config-provider
+    :locale="zhCN"
+    :date-locale="dateZhCN"
+    :theme-overrides="themeOverrides"
+  >
     <router-view />
   </n-config-provider>
 </template>

src/api/system/menu.ts

@@ -13,8 +13,8 @@ export const insertMenu = (params: Object) => {
   return post(url.insert, params);
 };
 
-export const getMenuTree = () => {
+export const getMenuTree = (params?: any) => {
-  return get(url.tree);
+  return get(url.tree, params);
 };
 
 export const updateMenu = (params: Object) => {

src/enums/pageEnum.ts

@@ -8,7 +8,7 @@ export enum PageEnum {
   REDIRECT = "/redirect",
   REDIRECT_NAME = "Redirect",
   // 首页
-  BASE_HOME = "/system/menu",
+  BASE_HOME = "/system/role",
   // 错误
   ERROR_PAGE_NAME_403 = "ErrorPage403",
   ERROR_PAGE_NAME_404 = "ErrorPage404",

src/router/generator.ts

@@ -47,6 +47,8 @@ export const generateRoutes = (routerMap, parent?): any[] => {
       !item.redirect &&
         (currentRoute.redirect = `${item.path}/${item.children[0].path}`);
       // Recursion
+      console.log(currentRoute.redirect, "currentRoute.redirect");
+
       currentRoute.children = generateRoutes(item.children, currentRoute);
     }
     return currentRoute;
@@ -58,7 +60,7 @@ export const generateRoutes = (routerMap, parent?): any[] => {
  * @returns {Promise<Router>}
  */
 export const generateDynamicRoutes = async (): Promise<RouteRecordRaw[]> => {
-  const { data } = await getMenuTree();
+  const { data } = await getMenuTree({ mode: 1 });
   const router = generateRoutes(data);
   asyncImportRoute(router);
   return router;

src/router/index.ts

@@ -26,11 +26,18 @@ export const RootRoute: RouteRecordRaw = {
   path: "/",
   name: "Root",
   redirect: "/system/menu",
+  // async beforeEnter(to, from, next) {
+  //   next(await reqRedirectUrl());
+  // },
   meta: {
     title: "Root",
   },
 };
 
+// async function reqRedirectUrl() {
+//   return "/system/role";
+// }
+
 //需要验证权限
 export const asyncRoutes = [];
 

src/router/router-guards.ts

@@ -59,13 +59,16 @@ export async function createRouterGuards(router: Router) {
       return;
     }
 
-    await userStore.getInfo();
+    try {
-    const routes = await asyncRouteStore.generateRoutes();
+      await userStore.getInfo();
-
+      const routes = await asyncRouteStore.generateRoutes();
-    // 动态添加可访问路由表
+      // 动态添加可访问路由表
-    routes.forEach((item: unknown) => {
+      routes.forEach((item: unknown) => {
-      router.addRoute(item as unknown as RouteRecordRaw);
+        router.addRoute(item as unknown as RouteRecordRaw);
-    });
+      });
+    } catch (error) {
+      next(LOGIN_PATH);
+    }
 
     //添加404
     const isErrorPage = router

src/store/modules/asyncRoute.ts

@@ -1,24 +1,9 @@
 import { defineStore } from "pinia";
 import { RouteRecordRaw } from "vue-router";
 import { store } from "@/store";
-import { asyncRoutes, constantRouter } from "@/router/index";
+import { constantRouter } from "@/router/index";
 import { generateDynamicRoutes } from "@/router/generator";
 
-interface TreeHelperConfig {
-  id: string;
-  children: string;
-  pid: string;
-}
-
-const DEFAULT_CONFIG: TreeHelperConfig = {
-  id: "id",
-  children: "children",
-  pid: "pid",
-};
-
-const getConfig = (config: Partial<TreeHelperConfig>) =>
-  Object.assign({}, DEFAULT_CONFIG, config);
-
 export interface IAsyncRouteState {
   menus: RouteRecordRaw[];
   routers: any[];
@@ -27,26 +12,6 @@ export interface IAsyncRouteState {
   isDynamicRouteAdded: boolean;
 }
 
-function filter<T = any>(
-  tree: T[],
-  func: (n: T) => boolean,
-  config: Partial<TreeHelperConfig> = {}
-): T[] {
-  config = getConfig(config);
-  const children = config.children as string;
-
-  function listFilter(list: T[]) {
-    return list
-      .map((node: any) => ({ ...node }))
-      .filter((node) => {
-        node[children] = node[children] && listFilter(node[children]);
-        return func(node) || (node[children] && node[children].length);
-      });
-  }
-
-  return listFilter(tree);
-}
-
 export const useAsyncRouteStore = defineStore({
   id: "app-async-route",
   state: (): IAsyncRouteState => ({
@@ -54,7 +19,6 @@ export const useAsyncRouteStore = defineStore({
     routers: constantRouter,
     routersAdded: [],
     keepAliveComponents: [],
-    // Whether the route has been dynamically added
     isDynamicRouteAdded: false,
   }),
   getters: {
@@ -93,7 +57,6 @@ export const useAsyncRouteStore = defineStore({
       } catch (error) {
         console.log(error);
       }
-      // accessedRouters = accessedRouters.filter(routeFilter);
       this.setRouters(accessedRouters);
       this.setMenus(accessedRouters);
       return toRaw(accessedRouters);
@@ -101,7 +64,6 @@ export const useAsyncRouteStore = defineStore({
   },
 });
 
-// Need to be used outside the setup
 export function useAsyncRoute() {
   return useAsyncRouteStore(store);
 }

src/utils/router.ts

@@ -1,7 +1,7 @@
 import router from "@/router";
 import { ResultEnum } from "@/enums/httpEnum";
 import { ErrorPageNameMap } from "@/enums/pageEnum";
-import { cryptoDecode } from "./crypto";
+// import { cryptoDecode } from "./crypto";
 import { StorageEnum } from "@/enums/storageEnum";
 import { storage } from "@/utils/storage";