From 574055c2749b9a183af44a0aaacab45f898cfff2 Mon Sep 17 00:00:00 2001
From: "zhu.wei1" <540201731@qq.com>
Date: Wed, 26 Jun 2024 16:51:14 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=B7=A6=E4=BE=A7=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E6=94=B6=E8=B5=B7=E5=90=8E=EF=BC=8C=E7=BB=84=E4=BB=B6=E8=8F=9C?=
 =?UTF-8?q?=E5=8D=95=E7=9A=84=E5=AD=90=E8=8F=9C=E5=8D=95=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E4=B8=8D=E5=85=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Menu/src/Menu.vue                    |  7 ++++++-
 .../Menu/src/components/useRenderMenuItem.tsx       | 13 +++++++++++--
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/components/Menu/src/Menu.vue b/src/components/Menu/src/Menu.vue
index d7c69ec..56dbf25 100644
--- a/src/components/Menu/src/Menu.vue
+++ b/src/components/Menu/src/Menu.vue
@@ -98,7 +98,7 @@ export default defineComponent({
         >
           {{
             default: () => {
-              const { renderMenuItem } = useRenderMenuItem()
+              const { renderMenuItem } = useRenderMenuItem(menuMode)
               return renderMenuItem(unref(routers))
             }
           }}
@@ -257,4 +257,9 @@ export default defineComponent({
     }
   }
 }
+@submenu-prefix-cls: ~'@{adminNamespace}-submenu-popper';
+.@{submenu-prefix-cls}--vertical {
+  overflow-y: auto;
+  max-height: 100%;
+}
 </style>
diff --git a/src/components/Menu/src/components/useRenderMenuItem.tsx b/src/components/Menu/src/components/useRenderMenuItem.tsx
index 301313f..66c5bf0 100644
--- a/src/components/Menu/src/components/useRenderMenuItem.tsx
+++ b/src/components/Menu/src/components/useRenderMenuItem.tsx
@@ -1,12 +1,17 @@
 import { ElSubMenu, ElMenuItem } from 'element-plus'
+import { unref } from 'vue'
 import { hasOneShowingChild } from '../helper'
 import { isUrl } from '@/utils/is'
 import { useRenderMenuTitle } from './useRenderMenuTitle'
 import { pathResolve } from '@/utils/routerHelper'
+import { useDesign } from '@/hooks/web/useDesign'
+
+const { getPrefixCls } = useDesign()
+const prefixCls = getPrefixCls('submenu')
 
 const { renderMenuTitle } = useRenderMenuTitle()
 
-export const useRenderMenuItem = () =>
+export const useRenderMenuItem = (menuMode) =>
   // allRouters: AppRouteRecordRaw[] = [],
   {
     const renderMenuItem = (routers: AppRouteRecordRaw[], parentPath = '/') => {
@@ -33,7 +38,11 @@ export const useRenderMenuItem = () =>
             )
           } else {
             return (
-              <ElSubMenu index={fullPath}>
+              <ElSubMenu
+                index={fullPath}
+                popper-append-to-body
+                popperClass={unref(menuMode) === 'vertical' ? `${prefixCls}-popper--vertical` : ''}
+              >
                 {{
                   title: () => renderMenuTitle(meta),
                   default: () => renderMenuItem(v.children!, fullPath)