From 21945dc63c62b8906992a290ad2ca9bb3566fa46 Mon Sep 17 00:00:00 2001
From: Gary Fu <xuebaiyouling@gmail.com>
Date: Mon, 1 May 2023 17:58:09 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9F=BA=E7=A1=80element-plus=E6=A8=A1?=
 =?UTF-8?q?=E6=9D=BF=E9=A1=B9=E7=9B=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LeftMenu.vue | 32 ++++++++++++++++++++++----------
 src/components/TopNav.vue   | 20 +++++++++++++-------
 src/views/HomeView.vue      |  2 +-
 3 files changed, 36 insertions(+), 18 deletions(-)

diff --git a/src/components/LeftMenu.vue b/src/components/LeftMenu.vue
index 5e15081..b2e9c21 100644
--- a/src/components/LeftMenu.vue
+++ b/src/components/LeftMenu.vue
@@ -5,37 +5,49 @@
       :default-openeds="['1']"
     >
       <el-menu-item index="0">
-        SIMPLE Element Plus
+        <span>Simple Element Plus</span>
+        <div v-if="collapseLeft">
+          SEP
+        </div>
       </el-menu-item>
       <el-sub-menu index="1">
         <template #title>
-          <el-icon><setting /></el-icon>系统管理
+          <el-icon><setting /></el-icon>
+          <span>系统管理</span>
         </template>
         <el-menu-item index="1-1">
-          <el-icon><user /></el-icon>用户管理
+          <el-icon><user /></el-icon>
+          <span>用户管理</span>
         </el-menu-item>
         <el-menu-item index="1-2">
-          <el-icon><Menu /></el-icon>角色管理
+          <el-icon><Menu /></el-icon>
+          <span>角色管理</span>
         </el-menu-item>
         <el-menu-item index="1-3">
-          <el-icon><lock /></el-icon>权限管理
+          <el-icon><lock /></el-icon>
+          <span>权限管理</span>
         </el-menu-item>
         <el-menu-item index="1-4">
-          <el-icon><Menu /></el-icon>菜单管理
+          <el-icon><Menu /></el-icon>
+          <span>菜单管理</span>
         </el-menu-item>
       </el-sub-menu>
       <el-sub-menu index="2">
         <template #title>
-          <el-icon><WarningFilled /></el-icon>错误页面
+          <el-icon><WarningFilled /></el-icon>
+          <span>错误页面</span>
         </template>
         <el-menu-item index="1-1">
-          <el-icon><Warning /></el-icon>客户端错误
+          <el-icon><Warning /></el-icon>
+          <span>客户端错误</span>
         </el-menu-item>
         <el-menu-item index="1-2">
-          <el-icon><Warning /></el-icon>没有权限页面
+          <el-icon><Warning /></el-icon>
+          <span>没有权限页面</span>
         </el-menu-item>
         <el-menu-item index="1-3">
-          <el-icon><Warning /></el-icon>服务器错误
+          <el-icon><Warning /></el-icon>
+          <span>服务器错误</span>
         </el-menu-item>
       </el-sub-menu>
     </el-menu>
diff --git a/src/components/TopNav.vue b/src/components/TopNav.vue
index 7bd014c..7a4bce2 100644
--- a/src/components/TopNav.vue
+++ b/src/components/TopNav.vue
@@ -4,17 +4,23 @@
     :ellipsis="false"
   >
     <el-menu-item @click="updateCollapseLeft">
-      <el-icon v-if="!isCollapseLeft">
-        <Fold />
-      </el-icon>
-      <el-icon v-if="isCollapseLeft">
-        <Expand />
-      </el-icon>
+      <template #title>
+        <el-icon v-if="!isCollapseLeft">
+          <Fold />
+        </el-icon>
+        <el-icon v-if="isCollapseLeft">
+          <Expand />
+        </el-icon>
+        <span>&nbsp;</span>
+      </template>
     </el-menu-item>
     <div class="flex-grow" />
     <el-sub-menu index="1">
       <template #title>
-        语言
+        <el-icon v-if="isCollapseLeft">
+          <Expand />
+        </el-icon>
+        <span>语言</span>
       </template>
       <el-menu-item index="2-1">
         中文
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index ad89d0c..7f7fc13 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -9,7 +9,7 @@ const collapseLeft = ref(false)
 
 <template>
   <el-container class="index-container">
-    <el-aside>
+    <el-aside width="auto">
       <left-menu v-model:collapse-left="collapseLeft" />
     </el-aside>
     <el-container>