Merge pull request #47 from coverjs/36-adekang

36 添加固定首页至菜单栏最顶部
lakyjs · Nov 21, 2024 · 3a45fc0 · 3a45fc0
2 parents b1b9aa6 + cb40a8c
commit 3a45fc0
Show file tree

Hide file tree

Showing 13 changed files with 56 additions and 32 deletions.
diff --git a/src/components/SubMenu/index.vue b/src/components/SubMenu/index.vue
@@ -49,7 +49,7 @@ const { t } = useI18n();
         <async-icon :icon="item.icon" />
       </template>
       <RouterLink v-if="link" :to="item.path">
-        {{ t(item.locale!) ?? item.name }}
+        {{ t(item.locale!) || item.name }}
       </RouterLink>
     </a-menu-item>
   </template>

diff --git a/src/enums/pageEnum.ts b/src/enums/pageEnum.ts
@@ -1,4 +1,5 @@
 export enum PageEnum {
   BASE_LOGIN = '/login',
-  BASE_HOME = '/',
+  BASE_INDEX = '/',
+  BASE_HOME = '/home',
 }
diff --git a/src/locales/langs/en-US.json b/src/locales/langs/en-US.json
@@ -112,7 +112,6 @@
         "pageStyle": "Page Style",
         "light": "Light",
         "dark": "Dark",
-
         "light-short": "Light",
         "dark-short": "Dark",
         "auto-match": "Auto"
@@ -146,6 +145,9 @@
       "userAdmin": "User Admin",
       "roleAdmin": "Role Admin",
       "menuAdmin": "Menu Admin"
+    },
+    "home": {
+      "home": "Home"
     }
   }
 }
diff --git a/src/locales/langs/zh-CN.json b/src/locales/langs/zh-CN.json
@@ -145,6 +145,9 @@
       "userAdmin": "用户管理",
       "roleAdmin": "角色管理",
       "menuAdmin": "菜单管理"
+    },
+    "home": {
+      "home": "首页"
     }
   }
 }
diff --git a/src/pages/home.vue b/src/pages/home.vue
@@ -0,0 +1,18 @@
+<script setup lang="ts">
+import welcomeImg from '@/assets/welcome.png';
+defineOptions({
+  name: 'HomePage',
+});
+</script>
+
+<template>
+  <div>
+    <img class="welcome-img" :src="welcomeImg" alt="welcomeImg" />
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.welcome-img {
+  width: 100%;
+}
+</style>
diff --git a/src/pages/index.vue b/src/pages/index.vue
@@ -1,18 +1,18 @@
 <script setup lang="ts">
-import welcomImg from '@/assets/welcome.png';
+import welcomeImg from '@/assets/welcome.png';
 defineOptions({
-  name: 'HomePage',
+  name: 'PageIndex',
 });
 </script>
 
 <template>
   <div>
-    <img class="welcom-img" :src="welcomImg" alt="welcomImg" />
+    <img class="welcome-img" :src="welcomeImg" alt="welcomeImg" />
   </div>
 </template>
 
 <style lang="scss" scoped>
-.welcom-img {
+.welcome-img {
   width: 100%;
 }
 </style>
diff --git a/src/pages/system/menu/index.vue b/src/pages/system/menu/index.vue
@@ -23,7 +23,7 @@ const columns = [
     key: 'icon',
   },
   {
-    title: '组件',
+    title: '路由',
     dataIndex: 'path',
     key: 'path',
   },

diff --git a/src/router/guard/permission.ts b/src/router/guard/permission.ts
@@ -2,6 +2,7 @@ import type { Router } from 'vue-router';
 
 import { useAppStore, useUserStore } from '@/store';
 import { isEmpty, omit } from 'lodash-es';
+import { PageEnum } from '@/enums';
 
 export function createPermissionGuard(router: Router) {
   const userStore = useUserStore();
@@ -17,7 +18,7 @@ export function createPermissionGuard(router: Router) {
     }
 
     if (to.name === 'login' && token) {
-      next('/');
+      next(PageEnum.BASE_HOME);
       return;
     }
 

diff --git a/src/router/index.ts b/src/router/index.ts
@@ -10,6 +10,6 @@ export const router = createRouter({
 });
 
 export function setupRouter(app: App) {
-  setupRouterGuards(router);
   app.use(router);
+  setupRouterGuards(router);
 }
diff --git a/src/router/staticRoutes.ts b/src/router/staticRoutes.ts
@@ -1,23 +1,13 @@
-import type { RouteRecordRaw } from 'vue-router';
-
 import { PageEnum } from '@/enums';
 import { routes } from 'vue-router/auto-routes';
 import { setupLayouts } from 'virtual:generated-layouts';
 
-const Layout = () => import('@/layouts/default.vue');
-
 const staticRoutesPaths = new Set<string>();
-staticRoutesPaths.add(PageEnum.BASE_HOME);
+staticRoutesPaths.add(PageEnum.BASE_INDEX);
 staticRoutesPaths.add(PageEnum.BASE_LOGIN);
+staticRoutesPaths.add(PageEnum.BASE_HOME);
 staticRoutesPaths.add('/:path(.*)');
 
-export const rootRoute: RouteRecordRaw = {
-  path: '/',
-  name: '/',
-  component: Layout,
-  children: [],
-};
-
 export function genRoutes() {
   const result = setupLayouts(routes);
   // 对静态路由的其他操作可以写在这里

diff --git a/src/store/app.ts b/src/store/app.ts
@@ -4,11 +4,11 @@ import { ThemeConfig } from 'ant-design-vue/es/config-provider/context';
 import { theme as antdTheme } from 'ant-design-vue/es';
 import { defaultLayoutSetting } from '@config';
 import { api } from '@/services';
-import { CacheEnum } from '@/enums';
+import { CacheEnum, PageEnum } from '@/enums';
 import { genStorageKey } from '@/utils';
 import { generateMenuAndRoutes } from '@/router/dynamicRoutes.ts';
-import { rootRoute } from '@/router/staticRoutes.ts';
-import { MenuData } from '@/router/types.ts';
+import staticRoutes from '@/router/staticRoutes.ts';
+import { MenuData, MenuDataItem } from '@/router/types.ts';
 
 const isDark = useDark();
 const toggleDark = useToggle(isDark);
@@ -86,6 +86,7 @@ export const useAppStore = defineStore('app', () => {
         return;
     }
   }
+
   /**
    * ----------------------------- theme&layout end-----------------------------
    */
@@ -123,12 +124,19 @@ export const useAppStore = defineStore('app', () => {
   async function generateDynamicRoutes() {
     const { menuData: treeMenuData, routeData: treeRouterData } =
       await getMenuData();
-    menuData.value = treeMenuData;
-    routerData.value = {
-      ...rootRoute,
-      children: treeRouterData,
-    };
-    return routerData.value;
+    const root = staticRoutes.find(item => item.path === '/');
+    root?.children?.push(...treeRouterData);
+    const home = staticRoutes.find(item => item.path === PageEnum.BASE_HOME);
+    const homePage = {
+      ...home?.children![0],
+      path: '/home',
+      name: '首页',
+      locale: 'menu.home.home',
+      icon: 'FileOutlined',
+    } as MenuDataItem;
+    menuData.value = [homePage, ...treeMenuData];
+    routerData.value = treeRouterData;
+    return root!;
   }
 
   /**

diff --git a/src/store/user.ts b/src/store/user.ts
@@ -50,7 +50,7 @@ export const useUserStore = defineStore(
       if (callApi) await api.auth.authLogout();
 
       setToken(void 0);
-      router.replace(PageEnum.BASE_LOGIN);
+      await router.replace(PageEnum.BASE_LOGIN);
       isPollActive.value && stopGetUserInfoPoll();
     }
 

diff --git a/typed-router.d.ts b/typed-router.d.ts
@@ -20,6 +20,7 @@ declare module 'vue-router/auto-routes' {
   export interface RouteNamedMap {
     '/': RouteRecordInfo<'/', '/', Record<never, never>, Record<never, never>>,
     '/[...path]': RouteRecordInfo<'/[...path]', '/:path(.*)', { path: ParamValue<true> }, { path: ParamValue<false> }>,
+    '/home': RouteRecordInfo<'/home', '/home', Record<never, never>, Record<never, never>>,
     'login': RouteRecordInfo<'login', '/login', Record<never, never>, Record<never, never>>,
     '/system/menu/': RouteRecordInfo<'/system/menu/', '/system/menu', Record<never, never>, Record<never, never>>,
     '/system/menu/MenuDrawer': RouteRecordInfo<'/system/menu/MenuDrawer', '/system/menu/MenuDrawer', Record<never, never>, Record<never, never>>,