From 81b0bab380b395497daa26ef68bdb215a7104d93 Mon Sep 17 00:00:00 2001
From: xing <fthvgb1@163.com>
Date: Wed, 17 Jun 2020 10:53:59 +0800
Subject: [PATCH] =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=8A=98=E5=8F=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Home.vue | 22 +++++++++++++++++++---
 1 file changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/components/Home.vue b/src/components/Home.vue
index 91f842c..5db3358 100644
--- a/src/components/Home.vue
+++ b/src/components/Home.vue
@@ -8,8 +8,10 @@
       <el-button type="info" @click="logout">退出</el-button>
     </el-header>
     <el-container>
-      <el-aside width="200px">
-        <el-menu unique-opened
+      <el-aside :width="isCollapsed ? '64px' : '200px'">
+        <div @click="toggleCollapse" class="toggle-button">|||</div>
+
+        <el-menu unique-opened :collapse="isCollapsed" :collapse-transition="false"
           background-color="#313743"
           text-color="#fff"
           active-text-color="#3497FF">
@@ -49,10 +51,15 @@ export default {
         101: 'iconfont icon-shangpin',
         102: 'iconfont icon-danju',
         145: 'iconfont icon-baobiao'
-      }
+      },
+      isCollapsed: false,
+      width: '200px'
     }
   },
   methods: {
+    toggleCollapse () {
+      this.isCollapsed = !this.isCollapsed
+    },
     logout () {
       sessionStorage.clear()
       this.$router.push('/login')
@@ -107,4 +114,13 @@ export default {
   .el-menu {
     border-right: none;
   }
+  .toggle-button{
+    background-color: #495164;
+    color: #ffffff;
+    font-size: 10px;
+    line-height: 24px;
+    text-align: center;
+    letter-spacing: .2em;
+    cursor: pointer;
+  }
 </style>