From 26f1b37b64c8d22143f1904df5d400650e373623 Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Tue, 4 Jun 2024 13:39:08 +0800
Subject: [PATCH] chore: update

---
 src/layout/components/lay-content/index.vue   |  9 +++--
 .../TagChrome.vue}                            |  0
 src/layout/components/lay-tag/index.scss      | 33 ++++++-------------
 src/layout/components/lay-tag/index.vue       |  7 ++--
 src/style/dark.scss                           | 16 +++++++++
 5 files changed, 33 insertions(+), 32 deletions(-)
 rename src/layout/components/lay-tag/{chrome-tab-bg.vue => components/TagChrome.vue} (100%)

diff --git a/src/layout/components/lay-content/index.vue b/src/layout/components/lay-content/index.vue
index c1c12c97a6..5810d665b7 100644
--- a/src/layout/components/lay-content/index.vue
+++ b/src/layout/components/lay-content/index.vue
@@ -2,20 +2,19 @@
 import { useI18n } from "vue-i18n";
 import LayFrame from "../lay-frame/index.vue";
 import LayFooter from "../lay-footer/index.vue";
+import { useTags } from "@/layout/hooks/useTag";
 import { useGlobal, isNumber } from "@pureadmin/utils";
 import BackTopIcon from "@/assets/svg/back_top.svg?component";
 import { h, computed, Transition, defineComponent } from "vue";
 import { usePermissionStoreHook } from "@/store/modules/permission";
-import { useTags } from "@/layout/hooks/useTag";
 
 const props = defineProps({
   fixedHeader: Boolean
 });
 
 const { t } = useI18n();
-const { $storage, $config } = useGlobal<GlobalPropertiesApi>();
-
 const { showModel } = useTags();
+const { $storage, $config } = useGlobal<GlobalPropertiesApi>();
 
 const isKeepAlive = computed(() => {
   return $config?.KeepAlive;
@@ -56,13 +55,13 @@ const getSectionStyle = computed(() => {
     hideTabs.value && layout ? "padding-top: 48px;" : "",
     !hideTabs.value && layout
       ? showModel.value == "chrome"
-        ? "padding-top: 87px;"
+        ? "padding-top: 85px;"
         : "padding-top: 81px;"
       : "",
     hideTabs.value && !layout.value ? "padding-top: 48px;" : "",
     !hideTabs.value && !layout.value
       ? showModel.value == "chrome"
-        ? "padding-top: 87px;"
+        ? "padding-top: 85px;"
         : "padding-top: 81px;"
       : "",
     props.fixedHeader
diff --git a/src/layout/components/lay-tag/chrome-tab-bg.vue b/src/layout/components/lay-tag/components/TagChrome.vue
similarity index 100%
rename from src/layout/components/lay-tag/chrome-tab-bg.vue
rename to src/layout/components/lay-tag/components/TagChrome.vue
diff --git a/src/layout/components/lay-tag/index.scss b/src/layout/components/lay-tag/index.scss
index 2c82919087..b88121690c 100644
--- a/src/layout/components/lay-tag/index.scss
+++ b/src/layout/components/lay-tag/index.scss
@@ -84,7 +84,11 @@
     white-space: nowrap;
 
     &.chrome-scroll-container {
-      padding-top: 6px;
+      padding-top: 4px;
+
+      .fixed-tag {
+        padding: 0 !important;
+      }
     }
 
     .tab {
@@ -97,15 +101,15 @@
       .scroll-item {
         transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
 
+        &:nth-child(1) {
+          padding: 0 12px;
+        }
+
         &.chrome-item {
           &:nth-child(1) {
-            padding-right: 0;
+            padding: 0;
           }
         }
-
-        &:nth-child(1) {
-          padding: 0 12px;
-        }
       }
 
       .fixed-tag {
@@ -365,20 +369,3 @@
     }
   }
 }
-
-// 暗黑模式下chrome-tab的样式
-html.dark .chrome-tab {
-  .tag-title {
-    color: #666;
-  }
-
-  &:hover {
-    .chrome-tab__bg {
-      color: #333;
-    }
-
-    .tag-title {
-      color: #adadad;
-    }
-  }
-}
diff --git a/src/layout/components/lay-tag/index.vue b/src/layout/components/lay-tag/index.vue
index 63dac712ab..373ceea44c 100644
--- a/src/layout/components/lay-tag/index.vue
+++ b/src/layout/components/lay-tag/index.vue
@@ -5,6 +5,7 @@ import { RouteConfigs } from "../../types";
 import { useTags } from "../../hooks/useTag";
 import { routerArrays } from "@/layout/types";
 import { onClickOutside } from "@vueuse/core";
+import TagChrome from "./components/TagChrome.vue";
 import { handleAliveRoute, getTopMenu } from "@/router/utils";
 import { useSettingStoreHook } from "@/store/modules/settings";
 import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
@@ -23,8 +24,6 @@ import ArrowDown from "@iconify-icons/ri/arrow-down-s-line";
 import ArrowRightSLine from "@iconify-icons/ri/arrow-right-s-line";
 import ArrowLeftSLine from "@iconify-icons/ri/arrow-left-s-line";
 
-import ChromeTabBg from "./chrome-tab-bg.vue";
-
 const {
   Close,
   route,
@@ -612,13 +611,13 @@ onBeforeUnmount(() => {
           </template>
           <div v-else class="chrome-tab">
             <div class="chrome-tab__bg">
-              <ChromeTabBg />
+              <TagChrome />
             </div>
             <span class="tag-title">
               {{ transformI18n(item.meta.title) }}
             </span>
             <span
-              v-if="index !== 0"
+              v-if="isAllEmpty(item?.meta?.fixedTag) ? index !== 0 : false"
               class="chrome-close-btn"
               @click.stop="deleteMenu(item)"
             >
diff --git a/src/style/dark.scss b/src/style/dark.scss
index 7c3cb65cba..74fe074746 100644
--- a/src/style/dark.scss
+++ b/src/style/dark.scss
@@ -115,6 +115,22 @@ html.dark {
           background-color: rgb(255 255 255 / 12%);
         }
       }
+
+      .chrome-tab {
+        .tag-title {
+          color: #666;
+        }
+
+        &:hover {
+          .chrome-tab__bg {
+            color: #333;
+          }
+
+          .tag-title {
+            color: #adadad;
+          }
+        }
+      }
     }
   }