perf: 隐藏标签页功能优化

src/layout/components/setting/index.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { split } from "lodash-es";
-import { nextTick } from "vue";
 import panel from "../panel/index.vue";
 import { useRouter } from "vue-router";
 import { emitter } from "/@/utils/mitt";
@@ -52,11 +51,7 @@ if (settings.tagsVal === null) {
   localOperate("tagsVal", false, "set");
   settings.tagsVal = false;
 }
-nextTick(() => {
-  window.document
-    .querySelector(".app-main")
-    ?.setAttribute("data-show-tag", settings.tagsVal);
-});
+window.document.body.setAttribute("data-show-tag", settings.tagsVal);
 
 function toggleClass(flag: boolean, clsName: string, target?: HTMLElement) {
   const targetEl = target || document.body;

src/layout/components/tag/index.vue

@@ -447,9 +447,7 @@ onBeforeMount(() => {
   emitter.on("tagViewsChange", key => {
     if (unref(showTags) === key) return;
     showTags.value = key;
-    window.document
-      .querySelector(".app-main")
-      ?.setAttribute("data-show-tag", key);
+    window.document.body.setAttribute("data-show-tag", key);
   });
 
   // 改变标签风格

src/style/sidebar.scss

@@ -533,14 +533,6 @@
 }
 
 body[data-layout="vertical"] {
-  .fixed-header + .app-main[data-show-tag="false"] {
-    padding-top: 85px;
-  }
-
-  .fixed-header + .app-main[data-show-tag="true"] {
-    padding-top: 48px;
-  }
-
   .hideSidebar {
     .fixed-header {
       width: calc(100% - 54px) !important;
@@ -596,12 +588,36 @@ body[data-layout="horizontal"] {
     width: 100% !important;
     transition: none !important;
   }
+}
 
-  .fixed-header + .app-main[data-show-tag="false"] {
-    padding-top: 100px;
+// vertical模式下不隐藏标签页
+body[data-layout="vertical"][data-show-tag="false"] {
+  .fixed-header + .app-main {
+    padding-top: 85px;
+  }
+}
+
+// vertical模式下隐藏标签页
+body[data-layout="vertical"][data-show-tag="true"] {
+  .fixed-header + .app-main {
+    padding-top: 48px;
+  }
+}
+
+// horizontal模式下不隐藏标签页
+body[data-layout="horizontal"][data-show-tag="false"] {
+  .fixed-header + .app-main {
+    padding-top: 98px;
+  }
+}
+
+// horizontal模式下隐藏标签页
+body[data-layout="horizontal"][data-show-tag="true"] {
+  .fixed-header {
+    box-shadow: 0 1px 4px rgb(0 21 41 / 8%);
   }
 
-  .fixed-header + .app-main[data-show-tag="true"] {
+  .fixed-header + .app-main {
     padding-top: 62px;
   }
 }