From 779b32d22ff9fb5c35a79a07167e426d032d4de6 Mon Sep 17 00:00:00 2001
From: RogerWork <roger.x.sun@qq.com>
Date: Tue, 31 Oct 2023 18:25:47 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E8=BE=B9=E6=A0=8F=E6=94=B6?=
 =?UTF-8?q?=E8=B5=B7=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/PageSiderbar.vue | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/layout/components/PageSiderbar.vue b/src/layout/components/PageSiderbar.vue
index e39159c..37eb547 100644
--- a/src/layout/components/PageSiderbar.vue
+++ b/src/layout/components/PageSiderbar.vue
@@ -1,5 +1,11 @@
 <template>
   <div class="page-sidebar">
+    <div class="collape-bar">
+      <el-icon class="cursor" @click="isCollapse = !isCollapse">
+        <expand v-if="isCollapse"></expand>
+        <fold v-else></fold>
+      </el-icon>
+    </div>
     <el-menu :default-active="defaultActive" router class="sidemenu" :collapse="isCollapse">
       <el-sub-menu v-for="(item,i) in treeData" :key="i" :index="item.path">
         <template #title>
@@ -26,6 +32,7 @@ import {menuTreeData} from "@/mock/data.js";
 import {useRoute} from "vue-router";
 import {useI18n} from "vue-i18n";
 import {ref, computed} from "vue";
+import {Expand, Fold} from "@element-plus/icons-vue";
 
 
 const route = useRoute();
@@ -57,6 +64,15 @@ $side-width: 200px;
   .sidemenu .el-menu:not(.el-menu--colapse) {
     width: $side-width;
   }
+  .collape-bar {
+    color: #ffffff;
+    font-size: 16px;
+    line-height: 36px;
+    text-align: center;
+    .c-icon {
+      cursor: pointer;
+    }
+  }
 }
 
 </style>