theme

Former-commit-id: 3fb5e37f648c98c9636ba8ac88f683e52cf8435e [formerly 3fb5e37f648c98c9636ba8ac88f683e52cf8435e [formerly 3fb5e37f648c98c9636ba8ac88f683e52cf8435e [formerly 3fb5e37f648c98c9636ba8ac88f683e52cf8435e [formerly 6f73a709ba4288f514deb2d74eb8603180b60b08 [formerly 28415f3ce8f01f9f26a0752a5f08d855bc4c56e2]]]]]
Former-commit-id: f199fcac91cb1b3aeef843974db74d0f9d622699
Former-commit-id: eec00c4f5e48c1a19ac096d3a8900bbb7ae361db
Former-commit-id: 9c7eb4c2f9115fda9b7d69e1c53444c99aeadb90 [formerly aac10159598f69b5c31ab136beb5ae11686ed2d6]
Former-commit-id: d38da464fd9a05e1ec2defc27ac4d8d4bed05ec3
Former-commit-id: eadfd85257cb054017000aca8100e5e68b359e2d
Former-commit-id: 9ce4b0a7b75a4ea9b9e24e96161a515bcadc6f04
Former-commit-id: ed40880ed8dda9601d859d5db5f19ab7bd42ade7
Former-commit-id: 3cbf4301dd98c44d8c4f1da0432922511ba9c7e3

src/layout/header-aside/components/header-theme/components/d2-theme-list/index.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import { mapState, mapMutations } from 'vuex'
+import { mapState, mapActions } from 'vuex'
 export default {
   name: 'd2-theme-list',
   data () {
@@ -36,7 +36,7 @@ export default {
     ])
   },
   methods: {
-    ...mapMutations('d2admin/theme', [
+    ...mapActions('d2admin/theme', [
       'set'
     ]),
     handleSelectTheme (name) {

src/pages/demo/playground/store/theme/index.vue

@@ -31,7 +31,7 @@
 </template>
 
 <script>
-import { mapState, mapMutations } from 'vuex'
+import { mapState, mapActions } from 'vuex'
 export default {
   data () {
     return {
@@ -48,7 +48,7 @@ export default {
     ])
   },
   methods: {
-    ...mapMutations('d2admin/theme', [
+    ...mapActions('d2admin/theme', [
       'set'
     ]),
     handleSelectTheme (name) {

src/store/modules/d2admin/modules/account.js

@@ -98,7 +98,7 @@ export default {
         // DB -> store 加载用户名
         await dispatch('d2admin/user/load', null, { root: true })
         // DB -> store 加载主题
-        commit('d2admin/theme/load', null, { root: true })
+        await dispatch('d2admin/theme/load', null, { root: true })
         // DB -> store 加载页面过渡效果设置
         commit('d2admin/transition/load', null, { root: true })
         // DB -> store 持久化数据加载上次退出时的多页列表

src/store/modules/d2admin/modules/theme.js

@@ -18,40 +18,50 @@ export default {
       return state.list.find(theme => theme.name === state.activeName)
     }
   },
-  mutations: {
+  actions: {
     /**
      * @description 激活一个主题
      * @param {Object} state vuex state
      * @param {String} themeValue 需要激活的主题名称
      */
-    set (state, themeName) {
-      // 检查这个主题在主题列表里是否存在
-      state.activeName = state.list.find(e => e.name === themeName) ? themeName : state.list[0].name
-      // 将 vuex 中的主题应用到 dom
-      this.commit('d2admin/theme/dom')
-      // 持久化
-      this.dispatch('d2admin/db/set', {
-        dbName: 'sys',
-        path: 'theme.activeName',
-        value: state.activeName,
-        user: true
+    set ({ state, commit, dispatch }, themeName) {
+      return new Promise(async resolve => {
+        // 检查这个主题在主题列表里是否存在
+        state.activeName = state.list.find(e => e.name === themeName) ? themeName : state.list[0].name
+        // 将 vuex 中的主题应用到 dom
+        commit('dom')
+        // 持久化
+        await dispatch('d2admin/db/set', {
+          dbName: 'sys',
+          path: 'theme.activeName',
+          value: state.activeName,
+          user: true
+        }, { root: true })
+        // end
+        resolve()
       })
     },
     /**
      * @description 从持久化数据加载主题设置
      * @param {Object} state vuex state
      */
-    async load (state) {
-      // store 赋值
-      state.activeName = await this.dispatch('d2admin/db/get', {
-        dbName: 'sys',
-        path: 'theme.activeName',
-        defaultValue: state.list[0].name,
-        user: true
+    load ({ state, commit, dispatch }) {
+      return new Promise(async resolve => {
+        // store 赋值
+        state.activeName = await dispatch('d2admin/db/get', {
+          dbName: 'sys',
+          path: 'theme.activeName',
+          defaultValue: state.list[0].name,
+          user: true
+        }, { root: true })
+        // 将 vuex 中的主题应用到 dom
+        commit('dom')
+        // end
+        resolve()
       })
-      // 更新到页面
-      this.commit('d2admin/theme/dom')
-    },
+    }
+  },
+  mutations: {
     /**
      * @description 将 vuex 中的主题应用到 dom
      * @param {Object} state vuex state