根据首页原型图，完善修改菜单样式布局优化

apps/web-vue/src/layout/index.vue

 <template>
   <el-container class="h-full">
-    <el-aside width="240px" style="background-color: #fff">
-      <div class="fs-50 p-10">LOGO</div>
-      <div class="px-10">
-        <el-menu style="border-right: none;" router :default-active="$route.path">
-          <template v-for="(item, index) in menus" :key="index">
-            <el-sub-menu v-if="item.children && item.children.length" :index="item.path">
-              <template #title>
+    <el-aside :width="isCollapse ? '84px':'240px'" style="background-color: #fff">
+      <div class="h-full flex flex-col hidden">
+        <div>
+          <div v-if="!isCollapse" class="flex p-10 flex-center gap-10">
+            <div class="fw-600 color-main">AIGC电商平台</div>
+            <el-select v-model="platform" placeholder="" size="small" style="width: 70px">
+              <el-option label="用户端" :value="1" />
+              <el-option label="管理端" :value="2" />
+            </el-select>
+          </div>
+          <div v-else class="w-60 h-44"></div>
+        </div>
+        <div class="px-10 flex-1 over-y-auto">
+          <el-menu style="border-right: none;" router :default-active="$route.path" :collapse="isCollapse">
+            <template v-for="(item, index) in menus" :key="index">
+              <el-sub-menu v-if="item.children && item.children.length" :index="item.path">
+                <template #title>
+                  <SvgIcon name="HD" size="20" class="mr-10 iconscoal" />
+                  <span>{{ item.name }}</span>
+                </template>
+                <el-menu-item v-for="(child, cindex) in item.children" :key="cindex" :index="item.path + child.path">
+                  <span class="ml-20">{{ child.name }}</span>
+                </el-menu-item>
+              </el-sub-menu>
+              <el-menu-item v-else :index="item.path">
                 <SvgIcon name="HD" size="20" class="mr-10 iconscoal" />
                 <span>{{ item.name }}</span>
-              </template>
-              <el-menu-item v-for="(child, cindex) in item.children" :key="cindex" :index="item.path + child.path">
-                <span class="ml-20">{{ child.name }}</span>
               </el-menu-item>
-            </el-sub-menu>
-            <el-menu-item v-else :index="item.path">
-              <SvgIcon name="HD" size="20" class="mr-10 iconscoal" />
-              <span>{{ item.name }}</span>
-            </el-menu-item>
-          </template>
-        </el-menu>
+            </template>
+          </el-menu>
+        </div>
+        <div v-if="!isCollapse">
+          <div class="p-10">
+            <div class="border-eee round-6 flex-between px-10 py-8">
+              <span>可用积分：</span>
+              <span>90000</span>
+            </div>
+          </div>
+          <div class="flex-between p-10" style="border-top: 1px solid #eee;">
+            <div class="flex-between gap-10">
+              <div class="w-40 h-40 bg-main round"></div>
+              <div>
+                <div>用户名称</div>
+                <div class="fs-12 color-888">超级管理员</div>
+              </div>
+            </div>
+            <el-button type="primary" size="small" link @click="isCollapse = !isCollapse">{{ isCollapse ? '展开' : '收起'
+              }}</el-button>
+          </div>
+        </div>
+        <div  v-else class="pb-20 pt-10 flex-center">
+          <el-button type="primary" size="small" link @click="isCollapse = !isCollapse">{{ isCollapse ? '展开' : '收起'
+              }}</el-button>
+        </div>
       </div>
     </el-aside>
     <el-main class="p-0">
@@ -33,9 +67,12 @@
 </template>
 
 <script setup lang="ts">
+import { ref } from 'vue'
 import { useRoute } from 'vue-router';
-const route = useRoute();
 
+const platform = ref(1)
+const route = useRoute();
+const isCollapse = ref(false)
 const menus = [
   {
     name: '首页',
@@ -101,13 +138,20 @@ const menus = [
       {
         name: '音频管理',
         path: '/audio',
-      }
+      },
     ],
   },
 ];
 </script>
 
 <style lang="scss" scoped>
+.over-y-auto {
+  scrollbar-width: none;
+  /* Firefox */
+  -ms-overflow-style: none;
+  /* IE/Edge */
+}
+
 :deep(.el-menu-item) {
   height: 44px;
   margin-top: 4px;