引入tailwind css，调整样式

web/src/components/admin/AdminHeader.vue

@@ -12,22 +12,14 @@
 
     <div class="breadcrumb">
       <el-breadcrumb :separator-icon="ArrowRight">
-        <el-breadcrumb-item v-for="item in breadcrumb">{{
-          item.title
-        }}</el-breadcrumb-item>
+        <el-breadcrumb-item v-for="item in breadcrumb" :key="item.title">{{ item.title }}</el-breadcrumb-item>
       </el-breadcrumb>
     </div>
     <div class="header-right">
       <div class="header-user-con">
         <!-- 切换主题 -->
-        <el-switch
-          style="margin-right: 10px"
-          v-model="dark"
-          inline-prompt
-          :active-action-icon="Moon"
-          :inactive-action-icon="Sunny"
-          @change="changeTheme"
-        />
+        <el-switch style="margin-right: 10px" v-model="dark" inline-prompt :active-action-icon="Moon"
+                   :inactive-action-icon="Sunny" @change="changeTheme"/>
         <!-- 用户名下拉菜单 -->
         <el-dropdown class="user-name" :hide-on-click="true" trigger="click">
           <span class="el-dropdown-link">
@@ -38,9 +30,7 @@
           </span>
           <template #dropdown>
             <el-dropdown-menu>
-              <el-dropdown-item>
-                <i class="iconfont icon-version"></i> 当前版本：{{ version }}
-              </el-dropdown-item>
+              <el-dropdown-item><i class="iconfont icon-version"></i> 当前版本：{{ version }}</el-dropdown-item>
               <el-dropdown-item divided @click="logout">
                 <i class="iconfont icon-logout"></i>
                 <span>退出登录</span>
@@ -53,21 +43,14 @@
   </div>
 </template>
 <script setup>
-import { onMounted, ref, watch } from "vue";
-import { getMenuItems, useSidebarStore } from "@/store/sidebar";
-import { useRouter } from "vue-router";
-import {
-  ArrowDown,
-  ArrowRight,
-  Expand,
-  Fold,
-  Moon,
-  Sunny
-} from "@element-plus/icons-vue";
-import { httpGet } from "@/utils/http";
-import { ElMessage } from "element-plus";
-import { removeAdminToken } from "@/store/session";
-import { useSharedStore } from "@/store/sharedata";
+import {onMounted, ref, watch} from "vue";
+import {getMenuItems, useSidebarStore} from "@/store/sidebar";
+import {useRouter} from "vue-router";
+import {ArrowDown, ArrowRight, Expand, Fold, Moon, Sunny} from "@element-plus/icons-vue";
+import {httpGet} from "@/utils/http";
+import {ElMessage} from "element-plus";
+import {removeAdminToken} from "@/store/session";
+import {useSharedStore} from "@/store/sharedata";
 
 const version = ref(process.env.VUE_APP_VERSION);
 const avatar = ref("/images/user-info.jpg");
@@ -76,17 +59,17 @@ const router = useRouter();
 const breadcrumb = ref([]);
 
 const store = useSharedStore();
-const dark = ref(store.adminTheme === "dark");
-const theme = ref(store.adminTheme);
+const dark = ref(store.theme === "dark");
+const theme = ref(store.theme);
 watch(
-  () => store.adminTheme,
+    () => store.theme,
   (val) => {
     theme.value = val;
   }
 );
 
 const changeTheme = () => {
-  store.setAdminTheme(dark.value ? "dark" : "light");
+  store.setTheme(dark.value ? "dark" : "light");
 };
 
 router.afterEach((to) => {
@@ -107,7 +90,7 @@ const initBreadCrumb = (path) => {
       if (items[i].index === path) {
         breadcrumb.value.push({
           title: items[i].title,
-          path: items[i].index
+          path: items[i].index,
         });
         break;
       }
@@ -121,11 +104,11 @@ const initBreadCrumb = (path) => {
           if (subs[j].index === path) {
             breadcrumb.value.push({
               title: items[i].title,
-              path: items[i].index
+              path: items[i].index,
             });
             breadcrumb.value.push({
               title: subs[j].title,
-              path: subs[j].index
+              path: subs[j].index,
             });
             bk = true;
             break;

web/src/components/admin/AdminSidebar.vue

@@ -70,8 +70,8 @@ httpGet('/api/admin/config/get?key=system').then(res => {
   ElMessage.error("加载系统配置失败: " + e.message)
 })
 const store = useSharedStore()
-const theme = ref(store.adminTheme)
-watch(() => store.adminTheme, (val) => {
+const theme = ref(store.theme)
+watch(() => store.theme, (val) => {
   theme.value = val
 })
 const items = [

web/src/components/admin/AdminTags.vue

@@ -42,8 +42,8 @@ import {useSharedStore} from "@/store/sharedata";
 import {ref, watch} from "vue";
 
 const store = useSharedStore()
-const theme = ref(store.adminTheme)
-watch(() => store.adminTheme, (val) => {
+const theme = ref(store.theme)
+watch(() => store.theme, (val) => {
   theme.value = val
 })
 const router = useRouter();