♻️ refactor: theme

Author: zxwk1998

mock/controller/user.js

@@ -79,7 +79,6 @@ module.exports = [
             'https://gcore.jsdelivr.net/gh/zxwk1998/image/avatar/avatar_2.png',
             'https://gcore.jsdelivr.net/gh/zxwk1998/image/avatar/avatar_3.png',
             'https://gcore.jsdelivr.net/gh/zxwk1998/image/avatar/avatar_4.png',
-            'https://gcore.jsdelivr.net/gh/zxwk1998/image/avatar/avatar_5.png',
           ],
         },
       }

src/layouts/components/VabAppMain/index.vue

@@ -63,14 +63,14 @@
         this.$nextTick(() => {
           this.routerView = true
         })
-      };
+      }
 
       //重载所有路由
       this.$baseEventBus.$on('reload-router-view', handleReloadRouterView)
 
       this.$once('hook:beforeDestroy', () => {
-        this.$baseEventBus.$off('reload-router-view', handleReloadRouterView);
-      });
+        this.$baseEventBus.$off('reload-router-view', handleReloadRouterView)
+      })
     },
     mounted() {},
     methods: {

src/layouts/components/VabAvatar/index.vue

@@ -12,9 +12,9 @@
     <el-dropdown-menu slot="dropdown">
       <el-dropdown-item command="github">github地址</el-dropdown-item>
       <el-dropdown-item command="gitee" divided>码云地址</el-dropdown-item>
-      <el-dropdown-item command="pro" divided>pro付费版地址</el-dropdown-item>
-      <el-dropdown-item command="plus" divided>plus付费版地址</el-dropdown-item>
-      <el-dropdown-item command="shop" divided>shop-vite付费版地址</el-dropdown-item>
+      <el-dropdown-item command="pro" divided>admin pro 地址</el-dropdown-item>
+      <el-dropdown-item command="plus" divided>admin plus 地址</el-dropdown-item>
+      <el-dropdown-item command="shop" divided>shop vite 地址</el-dropdown-item>
       <el-dropdown-item command="logout" divided>退出登录</el-dropdown-item>
     </el-dropdown-menu>
   </el-dropdown>
@@ -84,10 +84,10 @@
     padding: 0;
 
     .user-avatar {
-      width: 40px;
-      height: 40px;
+      width: 30px;
+      height: 30px;
       cursor: pointer;
-      border-radius: 50%;
+      border-radius: 5px;
     }
 
     .user-name {

src/layouts/components/VabNavBar/index.vue

@@ -38,7 +38,7 @@
     data() {
       return {
         pulse: false,
-        timeOutID: null
+        timeOutID: null,
       }
     },
     computed: {
@@ -66,9 +66,9 @@
     },
 
     beforeDestroy() {
-      clearTimeout(this.timeOutID);
-    }
-  };
+      clearTimeout(this.timeOutID)
+    },
+  }
 </script>
 
 <style lang="scss" scoped>

src/layouts/components/VabThemeBar/index.vue

@@ -17,26 +17,26 @@
         <div class="el-drawer__body">
           <el-form ref="form" :model="theme" label-position="top">
             <el-form-item label="主题">
-              <el-radio-group v-model="theme.name">
+              <el-radio-group v-model="theme.name" @change="handleSaveTheme">
                 <el-radio-button label="default">默认</el-radio-button>
                 <el-radio-button label="green">绿荫草场</el-radio-button>
                 <el-radio-button label="glory">荣耀典藏</el-radio-button>
               </el-radio-group>
             </el-form-item>
             <el-form-item label="布局">
-              <el-radio-group v-model="theme.layout">
+              <el-radio-group v-model="theme.layout" @change="handleSaveTheme">
                 <el-radio-button label="vertical">纵向布局</el-radio-button>
                 <el-radio-button label="horizontal">横向布局</el-radio-button>
               </el-radio-group>
             </el-form-item>
             <el-form-item label="头部">
-              <el-radio-group v-model="theme.header">
+              <el-radio-group v-model="theme.header" @change="handleSaveTheme">
                 <el-radio-button label="fixed">固定头部</el-radio-button>
                 <el-radio-button label="noFixed">不固定头部</el-radio-button>
               </el-radio-group>
             </el-form-item>
             <el-form-item label="多标签">
-              <el-radio-group v-model="theme.tabsBar">
+              <el-radio-group v-model="theme.tabsBar" @change="handleSaveTheme">
                 <el-radio-button label="true">开启</el-radio-button>
                 <el-radio-button label="false">不开启</el-radio-button>
               </el-radio-group>
@@ -87,7 +87,7 @@
       const theme = localStorage.getItem('vue-admin-better-theme')
       if (null !== theme) {
         this.theme = JSON.parse(theme)
-        this.handleSetTheme()
+        this.handleSaveTheme()
       } else {
         this.theme.layout = this.layout
         this.theme.header = this.header
@@ -110,7 +110,7 @@
       handleOpenThemeBar() {
         this.drawerVisible = true
       },
-      handleSetTheme() {
+      handleSaveTheme() {
         let { name, layout, header, tabsBar } = this.theme
         localStorage.setItem(
           'vue-admin-better-theme',
@@ -127,9 +127,6 @@
         document.getElementsByTagName('body')[0].className = `vue-admin-better-theme-${name}`
         this.drawerVisible = false
       },
-      handleSaveTheme() {
-        this.handleSetTheme()
-      },
       handleSetDfaultTheme() {
         let { name } = this.theme
         document.getElementsByTagName('body')[0].classList.remove(`vue-admin-better-theme-${name}`)