💄ui优化

src/i18n/lang/en.json

@@ -87,11 +87,13 @@
     "bottomBar": "Footer",
     "identity": "Identity",
     "content1": "The code is completely free and open source, easy to read and understand, and the interface is simple and beautiful, giving you one more choice and reference for your project.",
-    "topNav": "Top nav",
+    "topNav": "top nav",
     "commonFuncs": "Common Functions",
     "openWatermark": "Open Watermark",
     "workTime": "Today's working times(min)",
-    "onlineClientNum": "Number of online devices"
+    "onlineClientNum": "Number of online devices",
+    "tagsView": "tabs",
+    "tagsPersist": "tabs Persist"
   },
   "common": {
     "ok": "Ok",

src/i18n/lang/zh-cn.json

@@ -91,7 +91,9 @@
     "commonFuncs": "常用功能",
     "openWatermark": "开启水印",
     "workTime": "今日工作时长",
-    "onlineClientNum": "在线设备数"
+    "onlineClientNum": "在线设备数",
+    "tagsView": "标签页",
+    "tagsPersist": "标签持久化"
   },
   "common": {
     "ok": "确定",

src/i18n/lang/zh-tw.json

@@ -91,7 +91,9 @@
     "commonFuncs": "常用功能",
     "openWatermark": "開啟水印",
     "workTime": "今日工作時長(分)",
-    "onlineClientNum": "在線設備數"
+    "onlineClientNum": "在線設備數",
+    "tagsView": "標簽頁",
+    "tagsPersist": "標簽持久化"
   },
   "common": {
     "ok": "確定",

src/layout/components/Settings/index.vue

@@ -21,19 +21,10 @@
       <el-radio-group v-model="mode" size="small">
         <el-radio label="dark">{{ $t('layout.darkMode') }}</el-radio>
         <el-radio label="light">{{ $t('layout.lightMode') }}</el-radio>
-        <!-- <el-radio label="cafe">cafe</el-radio> -->
+        <!-- <el-radio label="cafe">cafe</el-radio>
-        <!-- <el-radio label="contrast">contrast</el-radio> -->
+        <el-radio label="contrast">contrast</el-radio> -->
       </el-radio-group>
     </div>
-    <!-- <div class="drawer-item">
-      <span>暗黑模式</span>
-      <span class="comp-style">
-        <el-switch v-model="isDark" class="mt-2" inline-prompt />
-      </span>
-    </div> -->
-    <!-- <h3 class="drawer-title">
-      {{ $t('layout.themeColor') }}
-    </h3> -->
     <div class="drawer-item">
       <span>{{ $t('layout.themeColor') }}</span>
       <span class="comp-style quick-color-wrap">
@@ -52,7 +43,7 @@
     </div>
 
     <div class="drawer-item">
-      <span>{{ $t('layout.open') }} 标签页</span>
+      <span>{{ $t('layout.open') }} {{ $t('layout.tagsView') }}</span>
       <span class="comp-style">
         <el-switch v-model="tagsView" class="drawer-switch" />
       </span>
@@ -91,7 +82,7 @@
     </div>
 
     <div class="drawer-item">
-      <span>标签持久化</span>
+      <span>{{ $t('layout.tagsPersist') }}</span>
       <span class="comp-style">
         <el-switch v-model="tabsPersist" class="drawer-switch" />
       </span>
@@ -107,7 +98,7 @@
 <script setup>
 import 'element-plus/theme-chalk/index.css'
 import 'element-plus/theme-chalk/dark/css-vars.css'
-import { useDark, useCycleList, useColorMode } from '@vueuse/core'
+import { useColorMode } from '@vueuse/core'
 import { useDynamicTitle } from '@/utils/dynamicTitle'
 import { getLightColor } from '@/utils/index'
 import { getmark } from '@/utils/wartermark'
@@ -130,12 +121,10 @@ const mode = useColorMode({
   modes: {
     // custom colors
     contrast: 'dark contrast',
-    cafe: 'cafe'
+    cafe: 'cafe',
+    auto: 'auto'
   }
 })
-const { next } = useCycleList(['light', 'dark', 'cafe', 'contrast'], { initialValue: mode })
-// const  isDark= useDark()
-
 /** 是否需要topnav */
 const topNav = computed({
   get: () => storeSettings.value.topNav,
@@ -318,13 +307,6 @@ defineExpose({
       height: 48px;
     }
 
-    .custom-img {
-      width: 48px;
-      height: 38px;
-      border-radius: 5px;
-      box-shadow: 1px 1px 2px #898484;
-    }
-
     .setting-drawer-block-checbox-selectIcon {
       position: absolute;
       top: 0;

src/layout/components/TagsView/index.vue

@@ -38,7 +38,6 @@
 import ScrollPane from './ScrollPane'
 import { getNormalPath } from '@/utils/ruoyi'
 import useTagsViewStore from '@/store/modules/tagsView'
-// import useSettingsStore from '@/store/modules/settings'
 import usePermissionStore from '@/store/modules/permission'
 import { isHttp } from '@/utils/validate'
 const visible = ref(false)
@@ -54,7 +53,6 @@ const router = useRouter()
 
 const visitedViews = computed(() => useTagsViewStore().visitedViews)
 const routes = computed(() => usePermissionStore().routes)
-// const theme = computed(() => useSettingsStore().theme);
 
 watch(route, () => {
   addTags()
@@ -77,10 +75,6 @@ function isActive(r) {
 }
 function activeStyle(tag) {
   if (!isActive(tag)) return {}
-  // return {
-  //   'background-color': theme.value,
-  //   'border-color': theme.value,
-  // }
 }
 function isAffix(tag) {
   return tag.meta && tag.meta.affix