From b7d7b6779fd1db622ce9f52e20dfd924666f4f32 Mon Sep 17 00:00:00 2001
From: ray <1490493387@qq.com>
Date: Tue, 8 Oct 2024 23:56:35 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20:bug:=20=E6=B7=B7=E5=90=88=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E5=B7=A6=E4=BE=A7=E8=8F=9C=E5=8D=95=E8=B6=85=E5=87=BA?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E9=AB=98=E5=BA=A6=E9=97=AE=E9=A2=98=E4=BF=AE?=
 =?UTF-8?q?=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# #IAVE1Q
---
 src/layout/index.vue | 21 ++++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/layout/index.vue b/src/layout/index.vue
index 31c701e0..e22f263a 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -12,8 +12,13 @@
 
     <!-- 混合布局 -->
     <div v-if="layout === LayoutEnum.MIX" class="mix-container">
-      <div class="mix-container__left">
-        <SidebarMenu :menu-list="mixLeftMenus" :base-path="activeTopMenuPath" />
+      <div class="mix-container-sidebar">
+        <el-scrollbar>
+          <SidebarMenu
+            :menu-list="mixLeftMenus"
+            :base-path="activeTopMenuPath"
+          />
+        </el-scrollbar>
         <div class="sidebar-toggle">
           <hamburger
             :is-active="appStore.sidebar.opened"
@@ -73,7 +78,7 @@ const mixLeftMenus = computed(() => permissionStore.mixLeftMenus); // 混合布
 
 watch(
   () => activeTopMenuPath.value,
-  (newVal) => {
+  (newVal: string) => {
     permissionStore.setMixLeftMenus(newVal);
   },
   {
@@ -205,10 +210,16 @@ watch(route, () => {
     height: 100%;
     padding-top: $navbar-height;
 
-    .mix-container__left {
+    .mix-container-sidebar {
       position: relative;
       width: $sidebar-width;
       height: 100%;
+      background-color: var(--menu-background);
+
+      :deep(.el-scrollbar) {
+        // 50px 是底部收缩按钮的高度
+        height: calc(100vh - $navbar-height - 50px);
+      }
 
       :deep(.el-menu) {
         height: 100%;
@@ -261,7 +272,7 @@ watch(route, () => {
     }
 
     .mix-container {
-      .mix-container__left {
+      &-sidebar {
         width: $sidebar-width-collapsed;
       }
     }