From 380bffe8312117189f1c151725bec38a2f050aa6 Mon Sep 17 00:00:00 2001
From: ocean-gao <gaopandyx@163.com>
Date: Thu, 23 May 2024 20:32:01 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20plugin-layout=20=E5=85=BC=E5=AE=B9?=
 =?UTF-8?q?=E9=A1=B6=E9=83=A8=E5=AF=BC=E8=88=AA=E6=A0=8F=E7=88=B6=E8=8F=9C?=
 =?UTF-8?q?=E5=8D=95=E6=B2=A1=E6=9C=89=E9=85=8D=E7=BD=AE=E8=B7=B3=E8=BD=AC?=
 =?UTF-8?q?=E9=93=BE=E6=8E=A5=E7=9A=84=E6=83=85=E5=86=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/runtime/views/BaseLayout.vue          | 14 +++++++---
 .../src/runtime/views/Menu.vue                | 28 +++++++++++++++++--
 2 files changed, 35 insertions(+), 7 deletions(-)

diff --git a/packages/fes-plugin-layout/src/runtime/views/BaseLayout.vue b/packages/fes-plugin-layout/src/runtime/views/BaseLayout.vue
index f064f68d..b56fd9e2 100644
--- a/packages/fes-plugin-layout/src/runtime/views/BaseLayout.vue
+++ b/packages/fes-plugin-layout/src/runtime/views/BaseLayout.vue
@@ -140,6 +140,7 @@
                     :menus="rootMenus"
                     mode="horizontal"
                     :inverted="theme === 'dark'"
+                    :navigation="currentNavigation"
                 />
                 <div class="layout-header-custom">
                     <slot name="renderCustom" :menus="menus" />
@@ -229,6 +230,7 @@ import { useRoute, useRouter } from '@@/core/coreExports';
 import { FAside, FFooter, FHeader, FLayout, FMain } from '@fesjs/fes-design';
 import { computed, nextTick, ref, watch } from 'vue';
 import defaultLogo from '../assets/logo.png';
+import { flatNodes } from '../helpers/utils';
 import LayoutMenu from './Menu.vue';
 import MultiTabProvider from './MultiTabProvider.vue';
 
@@ -335,12 +337,16 @@ export default {
         );
 
         const rootMenus = computed(() => {
-            return props.menus.filter((menu) => {
-                return menu.path;
-            }).map((menu) => {
-                const { children, ...others } = menu;
+            return props.menus.map((menu) => {
+                const { children, match, ...others } = menu;
+                const flatChildren = flatNodes(children || []);
                 return {
                     ...others,
+                    match: (match || [])
+                        .concat(...flatChildren.map(item => []
+                            .concat(item.match || [])
+                            .concat(item.path)),
+                        ),
                     _children: children,
                 };
             });
diff --git a/packages/fes-plugin-layout/src/runtime/views/Menu.vue b/packages/fes-plugin-layout/src/runtime/views/Menu.vue
index 3a74738a..adbf089b 100644
--- a/packages/fes-plugin-layout/src/runtime/views/Menu.vue
+++ b/packages/fes-plugin-layout/src/runtime/views/Menu.vue
@@ -73,6 +73,7 @@ export default {
             type: Boolean,
             default: false,
         },
+        navigation: String,
     },
     setup(props) {
         const route = useRoute();
@@ -93,7 +94,13 @@ export default {
             if (matchMenus.length === 0) {
                 return route.path;
             }
-            return matchMenus[0].path;
+            // 兼容 top-left 布局情况下，匹配菜单可能没有 path 的情况
+            if (props.navigation === 'top-left') {
+                return matchMenus[0].value;
+            }
+            else {
+                return matchMenus[0].path;
+            }
         });
 
         const expandedKeysRef = ref(props.expandedKeys);
@@ -124,12 +131,27 @@ export default {
         );
 
         const onMenuClick = (e) => {
-            const path = e.value;
+            let path = e.value;
+            let currentMenu = menuArray.value.find(item => item.value === path);
+
+            // 兼容 top-left 顶部导航没有链接的情况
+            if (props.navigation === 'top-left' && currentMenu && !currentMenu.path) {
+                // 判断当前菜单是否有子菜单
+                if (currentMenu._children && currentMenu._children.length > 0) {
+                    path = currentMenu._children[0].path;
+                    currentMenu = currentMenu._children[0];
+                }
+            }
+
             if (/^https?:\/\//.test(path)) {
                 window.open(path, '_blank');
             }
             else if (/^\//.test(path)) {
-                router.push(path);
+                router.push({
+                    path,
+                    query: currentMenu.query || {},
+                    params: currentMenu.params || {},
+                });
             }
             else {
                 console.warn('[plugin-layout]: 菜单的path只能是以http(s)开头的网址或者路由地址');