chore: optimizing the implementation logic of theme color modification; 🌟

src/App.vue

@@ -7,6 +7,7 @@
 <script>
 import enquireScreen from './utils/device'
 import {mapState} from 'vuex'
+import themeUtil from '@/utils/themeUtil';
 
 export default {
   name: 'App',
@@ -31,10 +32,16 @@ export default {
     },
     lang(val) {
       this.setLanguage(val)
+    },
+    themeColor(val) {
+      let closeMessage = this.$message.loading(`您选择了主题色 ${val}, 正在切换...`)
+      themeUtil.changeThemeColor(val).then(() => {
+        setTimeout(closeMessage, 1000)
+      })
     }
   },
   computed: {
-    ...mapState('setting', ['weekMode', 'lang'])
+    ...mapState('setting', ['theme', 'themeColor', 'weekMode', 'lang'])
   },
   methods: {
     setWeekModeTheme(weekMode) {

src/components/setting/Setting.vue

@@ -84,7 +84,6 @@ import SettingItem from './SettingItem'
 import ColorCheckbox from '../checkbox/ColorCheckbox'
 import ImgCheckbox from '../checkbox/ImgCheckbox'
 import Clipboard from 'clipboard'
-import themeUtil from '../../utils/themeUtil'
 import { mapState, mapMutations } from 'vuex'
 
 const ColorCheckboxGroup = ColorCheckbox.Group
@@ -112,12 +111,7 @@ export default {
   methods: {
     onColorChange (values, colors) {
       if (colors.length > 0) {
-        let closeMessage = this.$message.loading(`您选择了主题色 ${colors}, 正在切换...`)
+        this.setThemeColor(colors[0])
-        let _this = this
-        themeUtil.changeThemeColor(colors[0]).then(() => {
-          _this.setThemeColor(colors[0])
-          closeMessage()
-        })
       }
     },
     copyCode () {