mutation简化

tag去除圆角
默认动画改为`烟花`

vue/src/assets/styles/tagsView.scss

@@ -20,7 +20,6 @@
             padding: 0 12px;
             font-size: 12px;
             margin: 4px;
-            border-radius: 3px;
             user-select: none;
 
             &:first-of-type {

vue/src/bizComponents/CategoryTree/index.vue

@@ -24,7 +24,7 @@
         },
         mounted() {
             getAllCategories()
-                .then(data => this.$store.commit('dataCache/SET_CATEGORIES', data))
+                .then(data => this.$store.commit('dataCache/categories', data))
                 .finally(() => this.loading = false)
         }
     }

vue/src/layout/components/Header.vue

@@ -39,7 +39,7 @@
         },
         watch: {
             hideHeader(v) {
-                this.$store.commit('app/setHasHeader', !v)
+                this.$store.commit('app/hasHeader', !v)
                 v ? this.addEvent() : this.removeEvent()
             }
         },

vue/src/layout/components/Sidebar/index.vue

@@ -73,7 +73,7 @@
             },
             select(index) {
                 if (this.$route.path === index) {
-                    this.$store.commit('tagsView/DEL_CACHED_VIEW', this.$route)
+                    this.$store.commit('tagsView/delCachedView', this.$route)
                     this.$nextTick(() => this.$router.replace({path: '/redirect' + this.$route.fullPath}))
                 }
                 else this.$router.push(index)

vue/src/layout/components/TagsView/index.vue

@@ -96,7 +96,7 @@
             initTags() {
                 this.affixTags = this.filterAffixTags(this.routes)
                 for (let tag of this.affixTags) {
-                    this.$store.commit('tagsView/ADD_VISITED_VIEW', tag)
+                    this.$store.commit('tagsView/addVisitedView', tag)
                 }
             },
 
@@ -114,7 +114,7 @@
                     this.$refs.scrollPane.moveToTarget(tag)
                     //更新全路径
                     if (tag.to.fullPath !== this.$route.fullPath) {
-                        this.$store.commit('tagsView/UPDATE_VISITED_VIEW', this.$route)
+                        this.$store.commit('tagsView/updateVisitedViews', this.$route)
                     }
                 })
             },
@@ -124,7 +124,7 @@
             * 刷新所选、关闭所选、关闭其他、关闭所有
             * */
             refreshSelectedTag(view) {
-                this.$store.commit('tagsView/DEL_CACHED_VIEW', view)
+                this.$store.commit('tagsView/delCachedView', view)
                 this.$nextTick(() => this.$router.replace({path: '/redirect' + view.fullPath}))
             },
             closeSelectedTag(view) {

vue/src/layout/components/TagsView/mixin/decideRouterTransition.js

@@ -5,12 +5,12 @@ export default {
         //根据访问的tab页的左右顺序来确定路由动画
         decideRouteTransition(to, from) {
             let fromIndex = this.visitedViews.findIndex(i => i.path === from.path)
-            if (fromIndex < 0) return this.$store.commit('tagsView/SET_TRANSITION_NAME', rightSideRouteTransition)
+            if (fromIndex < 0) return this.$store.commit('tagsView/transitionName', rightSideRouteTransition)
 
             let toIndex = this.visitedViews.findIndex(i => i.path === to.path)
-            if (toIndex < 0) return this.$store.commit('tagsView/SET_TRANSITION_NAME', rightSideRouteTransition)
+            if (toIndex < 0) return this.$store.commit('tagsView/transitionName', rightSideRouteTransition)
 
-            this.$store.commit('tagsView/SET_TRANSITION_NAME', toIndex > fromIndex ? rightSideRouteTransition : leftSideRouteTransition)
+            this.$store.commit('tagsView/transitionName', toIndex > fromIndex ? rightSideRouteTransition : leftSideRouteTransition)
         },
     }
 }

vue/src/store/modules/app.js

@@ -1,11 +1,12 @@
 import {getLocalPersonalSettings} from "@/utils/localStorage"
+import {createMutations} from "@/utils"
 
 const localSettings = getLocalPersonalSettings()
 
 const state = {
     device: 'pc',
     //登陆页背景动画
-    loginPageBackgroundAnimation: 'reflectRain',
+    loginPageBackgroundAnimation: 'firework',
     //注册页背景动画
     registerPageBackgroundAnimation: 'firework',
     //路由页面滚动高度
@@ -14,24 +15,7 @@ const state = {
     hasHeader: !!!localSettings.headerAutoHidden,
 }
 
-const mutations = {
-    setDevice: (state, device) => {
-        state.device = device
-    },
-    setLoginPageBackgroundAnimation: (state, value) => {
-        state.loginPageBackgroundAnimation = value
-    },
-    setRegisterPageBackgroundAnimation: (state, value) => {
-        state.registerPageBackgroundAnimation = value
-    },
-    setScrollTop(state, scrollTop) {
-        state.scrollTop = scrollTop
-    },
-    setHasHeader(state, hasHeader) {
-        state.hasHeader = hasHeader
-    }
-}
-
+const mutations = createMutations(state)
 
 export default {
     namespaced: true,

vue/src/store/modules/dataCache.js

@@ -12,11 +12,11 @@ const state = {
 }
 
 const mutations = {
-    SET_CATEGORIES(state, categories) {
+    categories(state, categories) {
         state.categories = categories || []
         state.categoryTree = createTree(state.categories)
     },
-    SET_REGION_TREE(state, regionTree) {
+    regionTree(state, regionTree) {
         state.regionTree = regionTree || []
     },
 }
@@ -25,7 +25,7 @@ const actions = {
     initRegion({commit}) {
         return fetch(regionDataUrl)
             .then(r => r.json())
-            .then(r => commit('SET_REGION_TREE', r))
+            .then(r => commit('regionTree', r))
     }
 }
 

vue/src/store/modules/iframe.js

@@ -7,12 +7,12 @@ const state = {
 }
 
 const mutations = {
-    ...createMutations(state, false),
-    ADD_IFRAME(state, src) {
+    ...createMutations(state),
+    addIframe(state, src) {
         if (state.list.some(i => i === src)) return
         state.list.push(src)
     },
-    DEL_IFRAME(state, src) {
+    delIframe(state, src) {
         if (!src) return
         let index = state.list.findIndex(i => i === src)
         index > -1 && state.list.splice(index, 1)
@@ -22,14 +22,14 @@ const mutations = {
 const actions = {
     open({commit}, src) {
         if (!src) return
-        commit('SET_SHOW', true)
-        commit('SET_CURRENT', src)
-        commit('ADD_IFRAME', src)
+        commit('show', true)
+        commit('current', src)
+        commit('addIframe', src)
     },
     close({commit}, src) {
-        commit('SET_SHOW', false)
-        commit('SET_CURRENT', '')
-        commit('DEL_IFRAME', src)
+        commit('show', false)
+        commit('current', '')
+        commit('delIframe', src)
     }
 }
 

vue/src/store/modules/resource.js

@@ -22,7 +22,7 @@ const state = {
 }
 
 const mutations = {
-    SET_ROUTES: (state, routes) => {
+    routes(state, routes) {
         let tempConstantRoutes = JSON.parse(JSON.stringify(finalConstantRoutes))
         let tempAuthorityRoutes = JSON.parse(JSON.stringify(routes))
         clean(tempConstantRoutes)
@@ -30,12 +30,12 @@ const mutations = {
         state.routes = finalConstantRoutes.concat(routes)
         state.sidebarMenus = tempConstantRoutes.concat(tempAuthorityRoutes)
     },
-    SET_DATA: (state, data) => {
+    data(state, data) {
         state.data = data || []
         state.tree = createTree(data)
         setLocalResource(data)
     },
-    SET_INIT_ROUTES_SIGN: (state, sign) => {
+    hasInitRoutes(state, sign) {
         state.hasInitRoutes = sign
     }
 }
@@ -51,8 +51,8 @@ const actions = {
         const {resources, admin} = user
         return new Promise(resolve => {
             let accessedRoutes = getAuthorizedRoutes({resources, admin})
-            commit('SET_ROUTES', accessedRoutes)
-            commit('SET_INIT_ROUTES_SIGN', true)
+            commit('routes', accessedRoutes)
+            commit('hasInitRoutes', true)
             resolve()
         })
     },
@@ -61,7 +61,7 @@ const actions = {
             //if (state.data.length > 0) return resolve();
             getResources()
                 .then(data => {
-                    commit('SET_DATA', data)
+                    commit('data', data)
                     resolve()
                 })
         })

vue/src/store/modules/socket.js

@@ -1,20 +1,14 @@
 import {MessageBox} from "element-ui"
 import {socketUrl} from '@/config'
 import SocketIO from 'socket.io-client'
+import {createMutations} from "@/utils"
 
 const state = {
     socket: null,
     online: true
 }
 
-const mutations = {
-    SET_SOCKET(state, socket) {
-        state.socket = socket
-    },
-    SET_ONLINE(state, online) {
-        state.online = online
-    }
-}
+const mutations = createMutations(state)
 
 const actions = {
     init({state, commit, dispatch, rootState}, user) {
@@ -38,13 +32,13 @@ const actions = {
             })
         })
 
-        commit('SET_SOCKET', socket)
+        commit('socket', socket)
     },
     close({state, commit}) {
         return new Promise(resolve => {
             if (!state.socket) return resolve()
             state.socket.close()
-            commit('SET_SOCKET', null)
+            commit('socket', null)
             resolve()
         })
     }
@@ -59,12 +53,12 @@ function initSocket({id, session_id}) {
 
 function defaultEventBind(socket, {state, commit, dispatch}) {
     socket.on('connect', () => {
-        commit('SET_ONLINE', true)
+        commit('online', true)
         console.log('socket连接成功')
     })
 
     socket.on('disconnect', (reason) => {
-        commit('SET_ONLINE', false)
+        commit('online', false)
         if (reason === 'io server disconnect') {
             return console.log('服务端关闭了socket连接')
         }
@@ -72,12 +66,12 @@ function defaultEventBind(socket, {state, commit, dispatch}) {
     })
 
     socket.on('reconnecting', (attemptNumber) => {
-        commit('SET_ONLINE', false)
+        commit('online', false)
         console.log(`socket第${attemptNumber}次重连中...`)
     })
 
     socket.on('reconnect', (attemptNumber) => {
-        commit('SET_ONLINE', true)
+        commit('online', true)
         console.log(`socket第${attemptNumber}次重连成功`)
     })
 

vue/src/store/modules/tagsView.js

@@ -1,4 +1,5 @@
 import {rightSideRouteTransition} from '@/config'
+import {createMutations} from "@/utils"
 
 const state = {
     visitedViews: [],
@@ -7,78 +8,62 @@ const state = {
 }
 
 const mutations = {
-    SET_VISITED_VIEWS(state, views) {
-        state.visitedViews = views
-    },
-    SET_CACHED_VIEWS(state, views) {
-        state.cachedViews = views
-    },
+    ...createMutations(state),
 
-    ADD_VISITED_VIEW: (state, view) => {
+    addVisitedView(state, view) {
         if (state.visitedViews.some(v => v.path === view.path)) return
         state.visitedViews.push({...view, title: view.meta.title || 'no-name'})
     },
-    ADD_CACHED_VIEW: (state, view) => {
+    addCachedView(state, view) {
         if (state.cachedViews.includes(view.name)) return
         if (!view.meta.noCache && !view.meta.iframe) {
             state.cachedViews.push(view.name)
         }
     },
 
-    DEL_VISITED_VIEW: (state, view) => {
+    delVisitedView(state, view) {
         const index = state.visitedViews.findIndex(i => i.path === view.path)
         index > -1 && state.visitedViews.splice(index, 1)
     },
-    DEL_CACHED_VIEW: (state, view) => {
+    delCachedView(state, view) {
         const index = state.cachedViews.indexOf(view.name)
         index > -1 && state.cachedViews.splice(index, 1)
     },
 
-    DEL_OTHERS_VISITED_VIEWS: (state, view) => {
-        state.visitedViews = state.visitedViews.filter(v => {
-            return v.meta.affix || v.path === view.path
-        })
-    },
-    DEL_OTHERS_CACHED_VIEWS: (state, view) => {
-        const index = state.cachedViews.indexOf(view.name)
-        if (index > -1) {
-            state.cachedViews = state.cachedViews.slice(index, index + 1)
-        }
-        else state.cachedViews = []
-    },
-
-    UPDATE_VISITED_VIEW: (state, view) => {
+    updateVisitedViews(state, view) {
         for (let v of state.visitedViews) {
             if (v.path === view.path) {
                 v = Object.assign(v, view)
                 break
             }
         }
-    },
-
-    SET_TRANSITION_NAME: (state, name) => {
-        state.transitionName = name
     }
 }
 
 const actions = {
-    addView({commit, dispatch}, view) {
-        commit('ADD_VISITED_VIEW', view)
-        commit('ADD_CACHED_VIEW', view)
+    addView({commit}, view) {
+        commit('addVisitedView', view)
+        commit('addCachedView', view)
     },
     delView({commit}, view) {
-        commit('DEL_VISITED_VIEW', view)
-        commit('DEL_CACHED_VIEW', view)
-        commit('iframe/DEL_IFRAME', view.meta ? view.meta.iframe : null, {root: true})
+        commit('delVisitedView', view)
+        commit('delCachedView', view)
+        commit('iframe/delIframe', view.meta ? view.meta.iframe : null, {root: true})
     },
 
-    delOthersViews({commit, state}, view) {
-        commit('DEL_OTHERS_VISITED_VIEWS', view)
-        commit('DEL_OTHERS_CACHED_VIEWS', view)
+    delOthersViews({state, commit}, view) {
+        const visitedViews = state.visitedViews.filter(v => v.meta.affix || v.path === view.path)
+        let cachedViews = []
+        const index = state.cachedViews.indexOf(view.name)
+        if (index > -1) {
+            cachedViews = state.cachedViews.slice(index, index + 1)
+        }
+        commit('visitedViews', visitedViews)
+        commit('cachedViews', cachedViews)
     },
     delAllViews({state, commit}) {
-        commit('SET_VISITED_VIEWS', state.visitedViews.filter(tag => tag.meta.affix))
-        commit('SET_CACHED_VIEWS', [])
+        commit('visitedViews', state.visitedViews.filter(tag => tag.meta.affix))
+        commit('cachedViews', [])
     }
 }
 

vue/src/store/modules/user.js

@@ -21,7 +21,7 @@ const state = {
     session_id: !isEmpty(user.session_id) ? user.session_id : ''
 }
 
-const mutations = createMutations(state)
+const mutations = createMutations(state, true)
 
 const actions = {
     login({commit, dispatch}, userInfo) {
@@ -30,7 +30,7 @@ const actions = {
             login({username: username.trim(), password})
                 .then(user => {
                     user.avatar = autoCompleteUrl(user.avatar)
-                    commit('SET_$ALL', user)
+                    commit('$all', user)
                     setUser(user)
                     return dispatch('socket/init', user, {root: true})
                 })
@@ -42,18 +42,18 @@ const actions = {
     logout({commit, state, dispatch}) {
         return new Promise((resolve, reject) => {
             if (state.prepare_logout) return Promise.reject()
-            commit('SET_PREPARE_LOGOUT', 'yes')
+            commit('prepare_logout', 'yes')
             logout(state.token)
                 .then(() => dispatch('socket/close', null, {root: true}))
                 .then(() => {
                     dispatch('removeUser')
                     dispatch('tagsView/delAllViews', null, {root: true})
-                    commit('resource/SET_INIT_ROUTES_SIGN', false, {root: true})
+                    commit('resource/hasInitRoutes', false, {root: true})
                     resolve()
                     window.location.reload()
                 })
                 .catch(error => reject(error))
-                .finally(() => commit('SET_PREPARE_LOGOUT', ''))
+                .finally(() => commit('prepare_logout', ''))
         })
     },
 
@@ -62,7 +62,7 @@ const actions = {
     },
 
     removeUser({commit}) {
-        commit('SET_$ALL', {resources: {}})
+        commit('$all', {resources: {}})
         setUser()
     }
 }

vue/src/utils/index.js

@@ -151,13 +151,13 @@ export function waitUntilSuccess(success, callback, interval = 1000) {
 }
 
 //store中根据state批量生成对应的mutation
-export function createMutations(state, all = true, keyFunction = key => 'SET_' + key.toUpperCase()) {
+export function createMutations(state, all = false) {
     const arr = Object.keys(state)
     const obj = {}
     arr.forEach(key => {
-        obj[keyFunction(key)] = (s, v) => s[key] = v
+        obj[key] = (s, v) => s[key] = v
     })
-    if (all) obj['SET_$ALL'] = (s, v) => arr.forEach(key => s[key] = v ? v[key] || '' : '')
+    if (all) obj['$all'] = (s, v) => arr.forEach(key => s[key] = v ? v[key] || '' : '')
     return obj
 }
 

vue/src/views/app/login.vue

@@ -129,7 +129,7 @@
             },
             setAnimation(value) {
                 this.clearAnimation()
-                this.$store.commit('app/setLoginPageBackgroundAnimation', value)
+                this.$store.commit('app/loginPageBackgroundAnimation', value)
                 if (isEmpty(value)) return
                 import(`@/plugin/canvasAnimation/${value}`)
                     .then(_ => this.animation = new _.default(document.getElementById('login-background')))

vue/src/views/app/register.vue

@@ -125,7 +125,7 @@
             },
             setAnimation(value) {
                 this.clearAnimation()
-                this.$store.commit('app/setRegisterPageBackgroundAnimation', value)
+                this.$store.commit('app/registerPageBackgroundAnimation', value)
                 if (isEmpty(value)) return
                 import(`@/plugin/canvasAnimation/${value}`)
                     .then(_ => this.animation = new _.default(document.getElementById('login-background')))

vue/src/views/purchase/order/components/CategorySelector.vue

@@ -31,7 +31,7 @@
             init() {
                 if (this.selectableCategories.length > 0) return
                 getAllCategories()
-                    .then(data => this.$store.commit('dataCache/SET_CATEGORIES', data))
+                    .then(data => this.$store.commit('dataCache/categories', data))
             },
             change(v) {
                 if (!v || this.selected.length <= 0) return

vue/src/views/system/category/components/List.vue

@@ -47,7 +47,7 @@
                 this.currentCategory = null
                 this.contextmenu.show = false
                 getAllCategories()
-                    .then(data => this.$store.commit('dataCache/SET_CATEGORIES', data))
+                    .then(data => this.$store.commit('dataCache/categories', data))
                     .finally(() => this.loading = false)
             },
             add() {

vue/src/views/userCenter/components/Avatar.vue

@@ -82,7 +82,7 @@
                     upload(new Blob([data]), this.name)
                         .then(key => updateAvatar(key))
                         .then(({key, msg}) => {
-                            this.$store.commit('user/SET_AVATAR', autoCompleteUrl(key))
+                            this.$store.commit('user/avatar', autoCompleteUrl(key))
                             this.$store.dispatch('user/refresh')
                             elSuccess(msg)
                         })