From b75e67eab1b2f953b17785811175f14e85314dec Mon Sep 17 00:00:00 2001
From: sundongyu <2811054731@qq.com>
Date: Mon, 22 Apr 2024 17:14:35 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=E5=AE=8C=E6=88=90=E4=BA=86?=
 =?UTF-8?q?=E5=B7=A6=E4=BE=A7=E8=8F=9C=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .prettierrc.json                     |   4 +-
 src/layout/components/AsideIndex.vue | 135 ++++++++++++++++++++-------
 2 files changed, 101 insertions(+), 38 deletions(-)

diff --git a/.prettierrc.json b/.prettierrc.json
index 66e2335..49d573d 100644
--- a/.prettierrc.json
+++ b/.prettierrc.json
@@ -3,6 +3,6 @@
   "semi": false,
   "tabWidth": 2,
   "singleQuote": true,
-  "printWidth": 100,
+  "printWidth": 120,
   "trailingComma": "none"
-}
\ No newline at end of file
+}
diff --git a/src/layout/components/AsideIndex.vue b/src/layout/components/AsideIndex.vue
index 75e1f31..ed286c8 100644
--- a/src/layout/components/AsideIndex.vue
+++ b/src/layout/components/AsideIndex.vue
@@ -1,59 +1,124 @@
 <template>
-  <div style="height: 100vh">
-    <t-menu
-      v-model:expanded="expanded"
-      theme="light"
-      default-value="3-2"
-      expand-mutex
-      :collapsed="collapsed"
-    >
+  <div style="height: 100vh; overflow: auto">
+    <t-menu v-model:expanded="expanded" theme="light" default-value="0" expand-mutex :collapsed="collapsed">
       <template #logo>
         <img :src="iconUrl" alt="logo" :width="collapsed ? 35 : 136" />
       </template>
-      <t-submenu value="3">
+      <!-- 首页 -->
+      <t-menu-item value="0">
         <template #icon>
-          <t-icon name="mail" />
+          <t-icon name="home" />
+        </template>
+        首页
+      </t-menu-item>
+      <!-- 购物 -->
+      <t-submenu value="1">
+        <template #icon>
+          <t-icon name="play-circle" />
         </template>
         <template #title>
-          <span>消息区</span>
+          <span>购物</span>
         </template>
-        <t-submenu value="3-1" title="二级菜单">
-          <t-menu-item value="3-1-1"> 三级菜单内容 </t-menu-item>
-          <t-menu-item value="3-1-2"> 三级菜单内容 </t-menu-item>
-          <t-menu-item value="3-1-3"> 三级菜单内容 </t-menu-item>
-        </t-submenu>
-        <t-submenu value="3-5" title="二级菜单">
-          <t-menu-item value="3-5-1"> 三级菜单内容 </t-menu-item>
-          <t-menu-item value="3-5-2"> 三级菜单内容 </t-menu-item>
-          <t-menu-item value="3-5-3"> 三级菜单内容 </t-menu-item>
-        </t-submenu>
+        <t-menu-item value="1-1"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="1-2"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="1-3"> 二级菜单内容 </t-menu-item>
+      </t-submenu>
+      <!-- 销货 -->
+      <t-submenu value="2">
+        <template #icon>
+          <t-icon name="play-circle" />
+        </template>
+        <template #title>
+          <span>销货</span>
+        </template>
+        <t-menu-item value="2-1"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="2-2"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="2-3"> 二级菜单内容 </t-menu-item>
+      </t-submenu>
+      <!-- 仓库 -->
+      <t-submenu value="3">
+        <template #icon>
+          <t-icon name="play-circle" />
+        </template>
+        <template #title>
+          <span>仓库</span>
+        </template>
+        <t-menu-item value="3-1"> 二级菜单内容 </t-menu-item>
         <t-menu-item value="3-2"> 二级菜单内容 </t-menu-item>
         <t-menu-item value="3-3"> 二级菜单内容 </t-menu-item>
-        <t-menu-item value="3-4"> 二级菜单内容 </t-menu-item>
       </t-submenu>
-      <t-menu-item value="user-circle">
-        <template #icon>
-          <t-icon name="user-circle" />
-        </template>
-        个人中心
-      </t-menu-item>
+      <!-- 资金 -->
       <t-submenu value="4">
         <template #icon>
           <t-icon name="play-circle" />
         </template>
         <template #title>
-          <span>视频区</span>
+          <span>资金</span>
         </template>
         <t-menu-item value="4-1"> 二级菜单内容 </t-menu-item>
         <t-menu-item value="4-2"> 二级菜单内容 </t-menu-item>
         <t-menu-item value="4-3"> 二级菜单内容 </t-menu-item>
       </t-submenu>
-      <t-menu-item value="edit1">
+      <!-- 报表 -->
+      <t-submenu value="5">
         <template #icon>
-          <t-icon name="edit-1" />
+          <t-icon name="play-circle" />
         </template>
-        资源编辑
-      </t-menu-item>
+        <template #title>
+          <span>报表</span>
+        </template>
+        <t-menu-item value="5-1"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="5-2"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="5-3"> 二级菜单内容 </t-menu-item>
+      </t-submenu>
+      <!-- 商品 -->
+      <t-submenu value="6">
+        <template #icon>
+          <t-icon name="play-circle" />
+        </template>
+        <template #title>
+          <span>商品</span>
+        </template>
+        <t-menu-item value="6-1"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="6-2"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="6-3"> 二级菜单内容 </t-menu-item>
+      </t-submenu>
+      <!-- 资料 -->
+      <t-submenu value="7">
+        <template #icon>
+          <t-icon name="play-circle" />
+        </template>
+        <template #title>
+          <span>资料</span>
+        </template>
+        <t-menu-item value="7-1"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="7-2"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="7-3"> 二级菜单内容 </t-menu-item>
+      </t-submenu>
+      <!-- 系统 -->
+      <t-submenu value="8">
+        <template #icon>
+          <t-icon name="play-circle" />
+        </template>
+        <template #title>
+          <span>系统</span>
+        </template>
+        <t-menu-item value="8-1"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="8-2"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="8-3"> 二级菜单内容 </t-menu-item>
+      </t-submenu>
+      <!-- 配置 -->
+      <t-submenu value="9">
+        <template #icon>
+          <t-icon name="play-circle" />
+        </template>
+        <template #title>
+          <span>配置</span>
+        </template>
+        <t-menu-item value="9-1"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="9-2"> 二级菜单内容 </t-menu-item>
+        <t-menu-item value="9-3"> 二级菜单内容 </t-menu-item>
+      </t-submenu>
       <template #operations>
         <t-button variant="text" shape="square" @click="changeCollapsed">
           <template #icon><t-icon name="view-list" /></template>
@@ -67,9 +132,7 @@
 import { ref } from 'vue'
 import type { MenuProps, ButtonProps } from 'tdesign-vue-next'
 const collapsed = ref(false)
-const iconUrl = ref(
-  'https://oteam-tdesign-1258344706.cos.ap-guangzhou.myqcloud.com/site/logo%402x.png'
-)
+const iconUrl = ref('https://oteam-tdesign-1258344706.cos.ap-guangzhou.myqcloud.com/site/logo%402x.png')
 const changeCollapsed: ButtonProps['onClick'] = () => {
   collapsed.value = !collapsed.value
   iconUrl.value = collapsed.value