From fd88b2d6c1b4ddb2921ff9f4c10fe9a336b99f3f Mon Sep 17 00:00:00 2001
From: jmal <zhushilun084@gmail.com>
Date: Mon, 18 Mar 2024 14:33:03 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=A0=87=E7=AD=BE=E6=A0=8F?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/Sidebar/index.vue | 63 ++++++++++++++++---------
 src/styles/variables.scss               |  2 +-
 src/views/setting/cloudManager.vue      |  2 +-
 3 files changed, 43 insertions(+), 24 deletions(-)

diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
index 3e4fcbb..9ec849e 100644
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -22,43 +22,33 @@
         </el-menu>
       </el-scrollbar>
     </div>
-    <div class="scrollbar-tag" :class="{ collapse: isCollapse }">标签</div>
+    <div v-if="showTag && tagList.length > 0" class="scrollbar-tag" :class="{ collapse: isCollapse }">标签</div>
     <div class="scroll-decoration-top"></div>
     <el-scrollbar class="tag-list" wrap-class="scrollbar-wrapper">
       <div v-if="isCollapse">
         <ul class="infinite-list">
-          <el-tooltip
-            class="item"
+          <el-tooltip class="item"
+            v-if="showTag"
             effect="dark"
             :content="tag.name"
             placement="right"
             v-for="tag in tagList"
-            :key="tag.tagId"
-          >
+            :key="tag.tagId">
             <li class="infinite-list-item collapse">
-              <svg-icon
-                :style="{ color: tag.color, fontSize: '14px' }"
-                icon-class="tag2"
-              ></svg-icon>
+              <svg-icon :style="{ color: tag.color, fontSize: '14px' }" icon-class="tag2"></svg-icon>
             </li>
           </el-tooltip>
         </ul>
       </div>
       <div v-else>
         <ul class="infinite-list">
-          <li
-            v-for="tag in tagList"
+          <li v-for="tag in tagList"
+              v-if="showTag"
             :key="tag.id"
             class="infinite-list-item"
-            @click="tagClick(tag)"
-          >
-            <!--                <router-link :to="'/tag?tagId=' + tag.id" @click.native="tagClick(tag)">-->
-            <svg-icon
-              :style="{ color: tag.color, fontSize: '14px' }"
-              icon-class="tag2"
-            ></svg-icon>
+            @click="tagClick(tag)">
+            <svg-icon :style="{ color: tag.color, fontSize: '14px' }" icon-class="tag2"></svg-icon>
             <span>{{ tag.name }}</span>
-            <!--                </router-link>-->
           </li>
         </ul>
       </div>
@@ -125,6 +115,7 @@ export default {
       showCopyBtn: false,
       takeUpSpace: 0,
       tagList: [],
+      showTag: false
     }
   },
   computed: {
@@ -173,18 +164,28 @@ export default {
   },
   watch: {
     isCollapse(val){
+    },
+    $route(to) {
+      console.log(to.meta.menuType)
+      this.showTag = to.meta !== undefined && to.meta.menuType !== undefined && to.meta.menuType === 0;
     }
   },
   mounted() {
-    tagApi.tagList({userId: this.$store.state.user.userId,}).then(res => {
-      this.tagList = res.data
-    })
+    this.getTagList()
     Bus.$on('msg/file/change', (msg) => this.onmessage(msg))
   },
   destroyed() {
     Bus.$off('msg/file/change')
   },
   methods: {
+    getTagList() {
+      if (this.$route.meta.menuType === 0) {
+        this.showTag = true
+      }
+      tagApi.tagList({userId: this.$store.state.user.userId}).then(res => {
+        this.tagList = res.data
+      })
+    },
     onmessage(msg) {
       const takeUpSpace = msg.space
       if (takeUpSpace) {
@@ -293,6 +294,24 @@ export default {
   .el-scrollbar {
     padding-bottom: 15px;
   }
+  >>> .submenu-title-noDropdown {
+    padding-left: 15px !important;
+    padding-right: 10px !important;
+  }
+  >>> .el-submenu__title {
+    padding-left: 15px !important;
+    padding-right: 10px !important;
+    .el-submenu__icon-arrow {
+      right: 15px;
+    }
+  }
+  >>> .nest-menu {
+    .el-menu-item {
+      padding-left: 25px !important;
+      padding-right: 20px !important;
+      min-width: unset;
+    }
+  }
 }
 .quota-space {
   font-size: 14px;
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index bb4ddc8..d075fc9 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -9,7 +9,7 @@ $menuHover:#d9d9d9;
 $subMenuBg:#f5f5f5;
 $subMenuHover:#d9d9d9;
 
-$sideBarWidth: 150px;
+$sideBarWidth: 160px;
 
 // the :export directive is the magic sauce for webpack
 // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
diff --git a/src/views/setting/cloudManager.vue b/src/views/setting/cloudManager.vue
index d8e36d7..db6cb6d 100644
--- a/src/views/setting/cloudManager.vue
+++ b/src/views/setting/cloudManager.vue
@@ -13,7 +13,7 @@
           <el-tab-pane label="基本设置" name="1">
             <div v-if="activeName === '1'">
               <div class="config-itme-label">网盘名称：
-                <el-input placeholder="请输入网盘名称" v-model="netdiskName" minlength="1" maxlength="8" size="medium"
+                <el-input placeholder="请输入网盘名称" v-model="netdiskName" minlength="1" maxlength="10" size="medium"
                           :style="{width: inputNetdiskNameWidth+'px'}"
                           @keyup.enter.native="updateNetdiskName" @input="inputNetdiskName">
                   <el-button v-if="showAckBtn" slot="append" icon="el-icon-check" @click="updateNetdiskName"></el-button>