fixed: 进入404页面不会触发获取菜单.

2023-08-15 18:34:09 +08:00
parent fa8dc6d8fa
commit 4facfc66cd
12 changed files with 54 additions and 22 deletions
--- a/orion-ops-ui/src/components/menu/tree/index.vue
+++ b/orion-ops-ui/src/components/menu/tree/index.vue
@@ -33,13 +33,22 @@
      /**
       * 跳转
       */
-      const goto = (item: RouteRecordRaw) => {
+      const goto = (e: any, item: RouteRecordRaw) => {
        // 打开外链
        if (regexUrl.test(item.path)) {
          openWindow(item.path);
          selectedKey.value = [item.name as string];
          return;
        }
+        // 新页面打开
+        if (e.ctrlKey) {
+          const { href } = router.resolve({
+            name: item.name,
+          });
+          openWindow(href);
+          selectedKey.value = [item.name as string];
+          return;
+        }
        // 设置 selectedKey
        const { hideInMenu, activeMenu } = item.meta as RouteMeta;
        if (route.name === item.name && !hideInMenu && !activeMenu) {
@@ -124,7 +133,7 @@
                  <a-menu-item
                    key={element?.name}
                    v-slots={{ icon }}
-                    onClick={() => goto(element)}
+                    onClick={($event: any) => goto($event, element)}
                  >
                    {element?.meta?.locale || ''}
                  </a-menu-item>
--- a/orion-ops-ui/src/components/menu/tree/use-menu-tree.ts
+++ b/orion-ops-ui/src/components/menu/tree/use-menu-tree.ts
--- a/orion-ops-ui/src/components/navbar/index.vue
+++ b/orion-ops-ui/src/components/navbar/index.vue
@@ -192,7 +192,7 @@
  import useLocale from '@/hooks/locale';
  import useUser from '@/hooks/user';
  import { triggerMouseEvent } from '@/utils';
-  import Menu from '@/components/menu/index.vue';
+  import Menu from '@/components/menu/tree/index.vue';
  import MessageBox from '../message-box/index.vue';

  const appStore = useAppStore();
--- a/orion-ops-ui/src/hooks/permission.ts
+++ b/orion-ops-ui/src/hooks/permission.ts
@@ -1,6 +1,6 @@
 import { RouteLocationNormalized, RouteRecordNormalized, RouteRecordRaw } from 'vue-router';
 import { useAppStore, useUserStore } from '@/store';
-import { WHITE_ROUTER_LIST } from '@/router/constants';
+import { STATUS_ROUTER_LIST, WHITE_ROUTER_LIST } from '@/router/constants';

 export default function usePermission() {
  const appStore = useAppStore();
@@ -10,8 +10,12 @@ export default function usePermission() {
     * 是否可访问路由
     */
    accessRouter(route: RouteLocationNormalized | RouteRecordRaw) {
+      // 没有名字证明路由不存在
+      if (route.name === undefined) {
+        return false;
+      }
      // 检查路由是否存在于授权路由中
-      const menuConfig = [...appStore.appAsyncMenus, ...WHITE_ROUTER_LIST];
+      const menuConfig = [...appStore.appAsyncMenus, ...WHITE_ROUTER_LIST, ...STATUS_ROUTER_LIST];
      let exist = false;
      while (menuConfig.length && !exist) {
        const element = menuConfig.shift();
--- a/orion-ops-ui/src/layout/default-layout.vue
+++ b/orion-ops-ui/src/layout/default-layout.vue
@@ -52,7 +52,7 @@
  import { useRoute, useRouter } from 'vue-router';
  import { useAppStore } from '@/store';
  import NavBar from '@/components/navbar/index.vue';
-  import Menu from '@/components/menu/index.vue';
+  import Menu from '@/components/menu/tree/index.vue';
  import Footer from '@/components/footer/index.vue';
  import TabBar from '@/components/tab-bar/index.vue';
  import useResponsive from '@/hooks/responsive';
--- a/orion-ops-ui/src/router/constants.ts
+++ b/orion-ops-ui/src/router/constants.ts
@@ -18,9 +18,15 @@ export const DEFAULT_ROUTE_FULL_PATH = '/dashboard/workplace';
 */
 export const WHITE_ROUTER_LIST = [
  { name: LOGIN_ROUTE_NAME, children: [] },
+  { name: REDIRECT_ROUTE_NAME, children: [] },
+];
+
+/**
+ * 状态路由
+ */
+export const STATUS_ROUTER_LIST = [
  { name: NOT_FOUND_ROUTER_NAME, children: [] },
  { name: FORBIDDEN_ROUTER_NAME, children: [] },
-  { name: REDIRECT_ROUTE_NAME, children: [] },
 ];

 /**
--- a/orion-ops-ui/src/router/routes/base.ts
+++ b/orion-ops-ui/src/router/routes/base.ts
@@ -53,7 +53,7 @@ export const REDIRECT_ROUTER: RouteRecordRaw = {
 * 403 页面
 */
 export const FORBIDDEN_ROUTE: RouteRecordRaw = {
-  path: '/:pathMatch(.*)*',
+  path: '/403',
  name: FORBIDDEN_ROUTER_NAME,
  component: () => import('@/views/exception/forbidden/index.vue'),
 };
@@ -62,7 +62,8 @@ export const FORBIDDEN_ROUTE: RouteRecordRaw = {
 * 404 页面
 */
 export const NOT_FOUND_ROUTE: RouteRecordRaw = {
-  path: '/:pathMatch(.*)*',
+  // path: '/:pathMatch(.*)*',
+  path: '/404',
  name: NOT_FOUND_ROUTER_NAME,
  component: () => import('@/views/exception/not-found/index.vue'),
 };
--- a/orion-ops-ui/src/router/routes/modules/user.ts
+++ b/orion-ops-ui/src/router/routes/modules/user.ts
@@ -7,14 +7,14 @@ const USER: AppRouteRecordRaw = {
  component: DEFAULT_LAYOUT,
  children: [
    {
-      path: '/user/userChild1',
-      name: 'userChild1',
-      component: () => import('@/views/user/child1/index.vue'),
+      name: 'userRole',
+      path: '/user/role',
+      component: () => import('@/views/user/role/index.vue'),
    },
    {
-      path: '/user/userChild2',
-      name: 'userChild2',
-      component: () => import('@/views/user/child2/index.vue'),
+      name: 'userUser',
+      path: '/user/user',
+      component: () => import('@/views/user/user/index.vue'),
    },
  ],
 };
--- a/orion-ops-ui/src/views/system/menu/components/menu-form-modal.vue
+++ b/orion-ops-ui/src/views/system/menu/components/menu-form-modal.vue
@@ -114,8 +114,9 @@
  import { MenuTypeEnum, MenuVisibleEnum, MenuCacheEnum } from '../types/enum.types';
  import { toOptions } from '@/utils/enum';
  import IconPicker from '@sanqi377/arco-vue-icon-picker';
-  import MenuTreeSelector from '@/views/system/menu/components/menu-tree-selector.vue';
+  import MenuTreeSelector from './menu-tree-selector.vue';
  import { createMenu, updateMenu } from '@/api/system/menu';
+  import { Message } from '@arco-design/web-vue';

  const { visible, setVisible } = useVisible();
  const { loading, setLoading } = useLoading();
@@ -155,7 +156,11 @@
  const openAdd = (record: any) => {
    title.value = '添加菜单';
    isAddHandle.value = true;
-    renderForm({ ...defaultForm(), ...record });
+    renderForm({ ...defaultForm(), parentId: record.parentId });
+    // 如果是父菜单默认选中子菜单 如果是子菜单默认选中功能
+    if (record.type === 1 || record.type === 2) {
+      formModel.type = record.type + 1;
+    }
    setVisible(true);
  };

@@ -185,13 +190,20 @@
      if (error) {
        return false;
      }
+      if (formModel.parentId === 0
+        && (formModel.type === MenuTypeEnum.SUB_MENU.value || formModel.type === MenuTypeEnum.FUNCTION.value)) {
+        Message.error('创建子目录或功能时 父菜单不能为根目录');
+        return false;
+      }
      if (isAddHandle.value) {
        // 新增
        await createMenu(formModel as any);
+        Message.success('创建成功');
        emits('added');
      } else {
        // 修改
        await updateMenu(formModel as any);
+        Message.success('修改成功');
        emits('updated');
      }
      // 清空
--- a/orion-ops-ui/src/views/system/menu/components/menu-table.vue
+++ b/orion-ops-ui/src/views/system/menu/components/menu-table.vue
@@ -122,7 +122,7 @@
                    size="mini"
                    v-if="record.type !== MenuTypeEnum.FUNCTION.value"
                    v-permission="['infra:system-menu:create']"
-                    @click="emits('openAdd', { parentId: record.id })">
+                    @click="emits('openAdd', { parentId: record.id, type: record.type })">
            新增
          </a-button>
          <!-- 修改 -->
@@ -276,7 +276,7 @@
    await loadMenuData();
  };

-  // 卸载时清除 store
+  // 卸载时清除 menu cache
  onUnmounted(() => {
    cacheStore.resetMenu();
  });
--- a/orion-ops-ui/src/views/system/menu/components/menu-tree-selector.vue
+++ b/orion-ops-ui/src/views/system/menu/components/menu-tree-selector.vue
@@ -4,7 +4,7 @@
                 :disabled="disabled"
                 :allow-search="true"
                 :filter-tree-node="filterTreeNode"
-                 placeholder="请选择上级菜单" />
+                 placeholder="请选择菜单" />
 </template>

 <script lang="ts">
@@ -20,7 +20,7 @@

  const props = defineProps({
    modelValue: Number,
-    disabled: Boolean
+    disabled: Boolean,
  });

  const emits = defineEmits(['update:modelValue']);
--- a/orion-ops-ui/src/views/system/menu/index.vue
+++ b/orion-ops-ui/src/views/system/menu/index.vue
@@ -4,7 +4,7 @@
    <menu-table ref="table"
                @openAdd="(e) => modal.openAdd(e)"
                @openUpdate="(e) => modal.openUpdate(e)" />
-    <!-- 添加修改框 -->
+    <!-- 添加修改模态框 -->
    <menu-form-modal ref="modal"
                     @added="() => table.addedCallback()"
                     @updated="() => table.updatedCallback()" />