From 4765d8f3cf9f224ef83697a5e734736235c7ae79 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A7=8B=E5=B8=86?= <201379873@qq.com>
Date: Sun, 2 Jun 2024 10:56:25 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=E5=B7=A6=E4=BE=A7=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E8=A2=ABlogo=E4=B8=8E=E7=B3=BB=E7=BB=9F=E5=90=8D=E7=A7=B0?=
 =?UTF-8?q?=E8=BF=87=E9=95=BF=E5=AF=BC=E8=87=B4=E6=98=BE=E7=A4=BA=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/Asider/index.vue | 24 +++++++++---------------
 1 file changed, 9 insertions(+), 15 deletions(-)

diff --git a/src/layout/components/Asider/index.vue b/src/layout/components/Asider/index.vue
index cef3d5b..eb92510 100644
--- a/src/layout/components/Asider/index.vue
+++ b/src/layout/components/Asider/index.vue
@@ -1,20 +1,9 @@
 <template>
-  <div
-    v-if="isDesktop"
-    class="asider"
-    :class="{ 'app-menu-dark': appStore.menuDark }"
-    :style="appStore.menuDark ? appStore.themeCSSVar : undefined"
-  >
+  <div v-if="isDesktop" class="asider" :class="{ 'app-menu-dark': appStore.menuDark }"
+    :style="appStore.menuDark ? appStore.themeCSSVar : undefined">
     <Logo :collapsed="appStore.menuCollapse"></Logo>
-    <a-layout-sider
-      class="menu"
-      collapsible
-      breakpoint="xl"
-      hide-trigger
-      :width="225"
-      :collapsed="appStore.menuCollapse"
-      @collapse="handleCollapse"
-    >
+    <a-layout-sider class="menu" collapsible breakpoint="xl" hide-trigger width="auto"
+      :collapsed="appStore.menuCollapse" @collapse="handleCollapse">
       <a-scrollbar outer-class="h-full" style="height: 100%; overflow: auto">
         <Menu></Menu>
       </a-scrollbar>
@@ -39,15 +28,18 @@ const handleCollapse = (isCollapsed: boolean) => {
 
 <style lang="scss" scoped>
 :deep(.arco-menu.arco-menu-vertical.arco-menu-collapsed) {
+
   // Menu菜单组件修改
   .arco-menu-icon {
     margin-right: 0;
     padding: 10px 0;
   }
+
   .arco-menu-has-icon {
     padding: 0;
     justify-content: center;
   }
+
   .arco-menu-title {
     display: none;
   }
@@ -65,7 +57,9 @@ const handleCollapse = (isCollapsed: boolean) => {
   box-sizing: border-box;
   color: var(--color-text-1);
   background-color: var(--color-bg-1);
+
   .menu {
+    width: 100%;
     flex: 1;
     overflow: hidden;
     background-color: inherit;