From 0c50029cf76c3ee560acfb18b0980509892a8c0e Mon Sep 17 00:00:00 2001 From: Pan Date: Wed, 20 Mar 2019 13:44:42 +0800 Subject: [PATCH] vuex add namespaced --- src/components/LangSelect/index.vue | 2 +- src/components/SizeSelect/index.vue | 4 +- src/layout/Layout.vue | 2 +- src/layout/components/Navbar.vue | 4 +- src/layout/components/Settings/index.vue | 2 +- src/layout/components/TagsView/index.vue | 14 +- src/layout/mixin/ResizeHandler.js | 10 +- src/permission.js | 6 +- src/store/modules/app.js | 105 +++--- src/store/modules/errorLog.js | 34 +- src/store/modules/permission.js | 57 ++-- src/store/modules/settings.js | 38 ++- src/store/modules/tagsView.js | 299 +++++++++--------- src/store/modules/user.js | 207 ++++++------ src/utils/errorLog.js | 2 +- src/utils/request.js | 2 +- .../example/components/ArticleDetail.vue | 2 +- src/views/i18n-demo/index.vue | 2 +- src/views/login/index.vue | 2 +- .../permission/components/SwitchRoles.vue | 2 +- 20 files changed, 414 insertions(+), 382 deletions(-) diff --git a/src/components/LangSelect/index.vue b/src/components/LangSelect/index.vue index 9130efc7..7fe30b5d 100644 --- a/src/components/LangSelect/index.vue +++ b/src/components/LangSelect/index.vue @@ -27,7 +27,7 @@ export default { methods: { handleSetLanguage(lang) { this.$i18n.locale = lang - this.$store.dispatch('setLanguage', lang) + this.$store.dispatch('app/setLanguage', lang) this.$message({ message: 'Switch Language Success', type: 'success' diff --git a/src/components/SizeSelect/index.vue b/src/components/SizeSelect/index.vue index 9df4d0ca..e88065b4 100644 --- a/src/components/SizeSelect/index.vue +++ b/src/components/SizeSelect/index.vue @@ -32,7 +32,7 @@ export default { methods: { handleSetSize(size) { this.$ELEMENT.size = size - this.$store.dispatch('setSize', size) + this.$store.dispatch('app/setSize', size) this.refreshView() this.$message({ message: 'Switch Size Success', @@ -41,7 +41,7 @@ export default { }, refreshView() { // In order to make the cached page re-rendered - this.$store.dispatch('delAllCachedViews', this.$route) + this.$store.dispatch('tagsView/delAllCachedViews', this.$route) const { fullPath } = this.$route diff --git a/src/layout/Layout.vue b/src/layout/Layout.vue index c0befd4b..aab2df58 100644 --- a/src/layout/Layout.vue +++ b/src/layout/Layout.vue @@ -48,7 +48,7 @@ export default { }, methods: { handleClickOutside() { - this.$store.dispatch('closeSideBar', { withoutAnimation: false }) + this.$store.dispatch('app/closeSideBar', { withoutAnimation: false }) } } } diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index b1924a25..5a2767a5 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -75,10 +75,10 @@ export default { }, methods: { toggleSideBar() { - this.$store.dispatch('toggleSideBar') + this.$store.dispatch('app/toggleSideBar') }, async logout() { - await this.$store.dispatch('Logout') + await this.$store.dispatch('user/logout') // In order to re-instantiate the vue-router object to avoid bugs location.reload() } diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue index b294b269..6c171b30 100644 --- a/src/layout/components/Settings/index.vue +++ b/src/layout/components/Settings/index.vue @@ -34,7 +34,7 @@ export default { return this.$store.state.settings.tagsView }, set(val) { - this.$store.dispatch('changeSetting', { + this.$store.dispatch('settings/changeSetting', { key: 'tagsView', value: val }) diff --git a/src/layout/components/TagsView/index.vue b/src/layout/components/TagsView/index.vue index 6b63d765..3c479895 100644 --- a/src/layout/components/TagsView/index.vue +++ b/src/layout/components/TagsView/index.vue @@ -106,14 +106,14 @@ export default { for (const tag of affixTags) { // Must have tag name if (tag.name) { - this.$store.dispatch('addVisitedView', tag) + this.$store.dispatch('tagsView/addVisitedView', tag) } } }, addTags() { const { name } = this.$route if (name) { - this.$store.dispatch('addView', this.$route) + this.$store.dispatch('tagsView/addView', this.$route) } return false }, @@ -125,7 +125,7 @@ export default { this.$refs.scrollPane.moveToTarget(tag) // when query is different then update if (tag.to.fullPath !== this.$route.fullPath) { - this.$store.dispatch('updateVisitedView', this.$route) + this.$store.dispatch('tagsView/updateVisitedView', this.$route) } break } @@ -133,7 +133,7 @@ export default { }) }, refreshSelectedTag(view) { - this.$store.dispatch('delCachedView', view).then(() => { + this.$store.dispatch('tagsView/delCachedView', view).then(() => { const { fullPath } = view this.$nextTick(() => { this.$router.replace({ @@ -143,7 +143,7 @@ export default { }) }, closeSelectedTag(view) { - this.$store.dispatch('delView', view).then(({ visitedViews }) => { + this.$store.dispatch('tagsView/delView', view).then(({ visitedViews }) => { if (this.isActive(view)) { this.toLastView(visitedViews) } @@ -151,12 +151,12 @@ export default { }, closeOthersTags() { this.$router.push(this.selectedTag) - this.$store.dispatch('delOthersViews', this.selectedTag).then(() => { + this.$store.dispatch('tagsView/delOthersViews', this.selectedTag).then(() => { this.moveToCurrentTag() }) }, closeAllTags(view) { - this.$store.dispatch('delAllViews').then(({ visitedViews }) => { + this.$store.dispatch('tagsView/delAllViews').then(({ visitedViews }) => { if (this.affixTags.some(tag => tag.path === view.path)) { return } diff --git a/src/layout/mixin/ResizeHandler.js b/src/layout/mixin/ResizeHandler.js index 352ab133..80d8fbfa 100644 --- a/src/layout/mixin/ResizeHandler.js +++ b/src/layout/mixin/ResizeHandler.js @@ -7,7 +7,7 @@ export default { watch: { $route(route) { if (this.device === 'mobile' && this.sidebar.opened) { - store.dispatch('closeSideBar', { withoutAnimation: false }) + store.dispatch('app/closeSideBar', { withoutAnimation: false }) } } }, @@ -17,8 +17,8 @@ export default { mounted() { const isMobile = this.isMobile() if (isMobile) { - store.dispatch('toggleDevice', 'mobile') - store.dispatch('closeSideBar', { withoutAnimation: true }) + store.dispatch('app/toggleDevice', 'mobile') + store.dispatch('app/closeSideBar', { withoutAnimation: true }) } }, methods: { @@ -29,10 +29,10 @@ export default { resizeHandler() { if (!document.hidden) { const isMobile = this.isMobile() - store.dispatch('toggleDevice', isMobile ? 'mobile' : 'desktop') + store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop') if (isMobile) { - store.dispatch('closeSideBar', { withoutAnimation: true }) + store.dispatch('app/closeSideBar', { withoutAnimation: true }) } } } diff --git a/src/permission.js b/src/permission.js index 6b770f01..a03f7bda 100644 --- a/src/permission.js +++ b/src/permission.js @@ -29,18 +29,18 @@ router.beforeEach((to, from, next) => { if (store.getters.roles.length === 0) { // 判断当前用户是否已拉取完user_info信息 store - .dispatch('getInfo') // dispatch @/store/modules/user login getInfo + .dispatch('user/getInfo') .then(res => { // 拉取user_info const { roles } = res // note: roles must be a object array! such as: [{id: '1', name: 'editor'}, {id: '2', name: 'developer'}] - store.dispatch('generateRoutes', { roles }).then(accessRoutes => { + store.dispatch('permission/generateRoutes', { roles }).then(accessRoutes => { // 根据roles权限生成可访问的路由表 router.addRoutes(accessRoutes) // 动态添加可访问路由表 next({ ...to, replace: true }) // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record }) }) .catch(err => { - store.dispatch('resetToken').then(() => { + store.dispatch('user/resetToken').then(() => { Message.error(err) next({ path: '/' }) }) diff --git a/src/store/modules/app.js b/src/store/modules/app.js index fba4b05c..84875dd6 100644 --- a/src/store/modules/app.js +++ b/src/store/modules/app.js @@ -1,59 +1,64 @@ import Cookies from 'js-cookie' -const app = { - state: { - sidebar: { - opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true, - withoutAnimation: false - }, - device: 'desktop', - language: Cookies.get('language') || 'en', - size: Cookies.get('size') || 'medium' +const state = { + sidebar: { + opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true, + withoutAnimation: false }, - mutations: { - TOGGLE_SIDEBAR: state => { - state.sidebar.opened = !state.sidebar.opened - state.sidebar.withoutAnimation = false - if (state.sidebar.opened) { - Cookies.set('sidebarStatus', 1) - } else { - Cookies.set('sidebarStatus', 0) - } - }, - CLOSE_SIDEBAR: (state, withoutAnimation) => { + device: 'desktop', + language: Cookies.get('language') || 'en', + size: Cookies.get('size') || 'medium' +} + +const mutations = { + TOGGLE_SIDEBAR: state => { + state.sidebar.opened = !state.sidebar.opened + state.sidebar.withoutAnimation = false + if (state.sidebar.opened) { + Cookies.set('sidebarStatus', 1) + } else { Cookies.set('sidebarStatus', 0) - state.sidebar.opened = false - state.sidebar.withoutAnimation = withoutAnimation - }, - TOGGLE_DEVICE: (state, device) => { - state.device = device - }, - SET_LANGUAGE: (state, language) => { - state.language = language - Cookies.set('language', language) - }, - SET_SIZE: (state, size) => { - state.size = size - Cookies.set('size', size) } }, - actions: { - toggleSideBar({ commit }) { - commit('TOGGLE_SIDEBAR') - }, - closeSideBar({ commit }, { withoutAnimation }) { - commit('CLOSE_SIDEBAR', withoutAnimation) - }, - toggleDevice({ commit }, device) { - commit('TOGGLE_DEVICE', device) - }, - setLanguage({ commit }, language) { - commit('SET_LANGUAGE', language) - }, - setSize({ commit }, size) { - commit('SET_SIZE', size) - } + CLOSE_SIDEBAR: (state, withoutAnimation) => { + Cookies.set('sidebarStatus', 0) + state.sidebar.opened = false + state.sidebar.withoutAnimation = withoutAnimation + }, + TOGGLE_DEVICE: (state, device) => { + state.device = device + }, + SET_LANGUAGE: (state, language) => { + state.language = language + Cookies.set('language', language) + }, + SET_SIZE: (state, size) => { + state.size = size + Cookies.set('size', size) } } -export default app +const actions = { + toggleSideBar({ commit }) { + commit('TOGGLE_SIDEBAR') + }, + closeSideBar({ commit }, { withoutAnimation }) { + commit('CLOSE_SIDEBAR', withoutAnimation) + }, + toggleDevice({ commit }, device) { + commit('TOGGLE_DEVICE', device) + }, + setLanguage({ commit }, language) { + commit('SET_LANGUAGE', language) + }, + setSize({ commit }, size) { + commit('SET_SIZE', size) + } +} + +export default { + namespaced: true, + state, + mutations, + actions +} diff --git a/src/store/modules/errorLog.js b/src/store/modules/errorLog.js index 50fc1b1a..c97d452a 100644 --- a/src/store/modules/errorLog.js +++ b/src/store/modules/errorLog.js @@ -1,17 +1,23 @@ -const errorLog = { - state: { - logs: [] - }, - mutations: { - ADD_ERROR_LOG: (state, log) => { - state.logs.push(log) - } - }, - actions: { - addErrorLog({ commit }, log) { - commit('ADD_ERROR_LOG', log) - } + +const state = { + logs: [] +} + +const mutations = { + ADD_ERROR_LOG: (state, log) => { + state.logs.push(log) } } -export default errorLog +const actions = { + addErrorLog({ commit }, log) { + commit('ADD_ERROR_LOG', log) + } +} + +export default { + namespaced: true, + state, + mutations, + actions +} diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js index 835b4d09..c697ac61 100644 --- a/src/store/modules/permission.js +++ b/src/store/modules/permission.js @@ -34,32 +34,37 @@ export function filterAsyncRoutes(routes, roles) { return res } -const permission = { - state: { - routes: [], - addRoutes: [] - }, - mutations: { - SET_ROUTES: (state, routes) => { - state.addRoutes = routes - state.routes = constantRoutes.concat(routes) - } - }, - actions: { - generateRoutes({ commit }, data) { - return new Promise(resolve => { - const { roles } = data - let accessedRoutes - if (roles.includes('admin')) { - accessedRoutes = asyncRoutes - } else { - accessedRoutes = filterAsyncRoutes(asyncRoutes, roles) - } - commit('SET_ROUTES', accessedRoutes) - resolve(accessedRoutes) - }) - } +const state = { + routes: [], + addRoutes: [] +} + +const mutations = { + SET_ROUTES: (state, routes) => { + state.addRoutes = routes + state.routes = constantRoutes.concat(routes) } } -export default permission +const actions = { + generateRoutes({ commit }, data) { + return new Promise(resolve => { + const { roles } = data + let accessedRoutes + if (roles.includes('admin')) { + accessedRoutes = asyncRoutes + } else { + accessedRoutes = filterAsyncRoutes(asyncRoutes, roles) + } + commit('SET_ROUTES', accessedRoutes) + resolve(accessedRoutes) + }) + } +} + +export default { + namespaced: true, + state, + mutations, + actions +} diff --git a/src/store/modules/settings.js b/src/store/modules/settings.js index d47505c4..eb84a7aa 100644 --- a/src/store/modules/settings.js +++ b/src/store/modules/settings.js @@ -1,23 +1,29 @@ import defaultSettings from '@/settings' const { showSettings, tagsView } = defaultSettings -const settings = { - state: { - showSettings: showSettings, - tagsView: tagsView - }, - mutations: { - CHANGE_SETTING: (state, { key, value }) => { - if (state.hasOwnProperty(key)) { - state[key] = value - } - } - }, - actions: { - changeSetting({ commit }, data) { - commit('CHANGE_SETTING', data) +const state = { + showSettings: showSettings, + tagsView: tagsView +} + +const mutations = { + CHANGE_SETTING: (state, { key, value }) => { + if (state.hasOwnProperty(key)) { + state[key] = value } } } -export default settings +const actions = { + changeSetting({ commit }, data) { + commit('CHANGE_SETTING', data) + } +} + +export default { + namespaced: true, + state, + mutations, + actions +} + diff --git a/src/store/modules/tagsView.js b/src/store/modules/tagsView.js index 378cbcd3..5cbe32f3 100644 --- a/src/store/modules/tagsView.js +++ b/src/store/modules/tagsView.js @@ -1,161 +1,166 @@ -const tagsView = { - state: { - visitedViews: [], - cachedViews: [] - }, - mutations: { - ADD_VISITED_VIEW: (state, view) => { - if (state.visitedViews.some(v => v.path === view.path)) return - state.visitedViews.push( - Object.assign({}, view, { - title: view.meta.title || 'no-name' - }) - ) - }, - ADD_CACHED_VIEW: (state, view) => { - if (state.cachedViews.includes(view.name)) return - if (!view.meta.noCache) { - state.cachedViews.push(view.name) - } - }, - DEL_VISITED_VIEW: (state, view) => { - for (const [i, v] of state.visitedViews.entries()) { - if (v.path === view.path) { - state.visitedViews.splice(i, 1) - break - } - } - }, - DEL_CACHED_VIEW: (state, view) => { - for (const i of state.cachedViews) { - if (i === view.name) { - const index = state.cachedViews.indexOf(i) - state.cachedViews.splice(index, 1) - break - } - } - }, +const state = { + visitedViews: [], + cachedViews: [] +} - DEL_OTHERS_VISITED_VIEWS: (state, view) => { - state.visitedViews = state.visitedViews.filter(v => { - return v.meta.affix || v.path === view.path +const mutations = { + ADD_VISITED_VIEW: (state, view) => { + if (state.visitedViews.some(v => v.path === view.path)) return + state.visitedViews.push( + Object.assign({}, view, { + title: view.meta.title || 'no-name' }) - }, - DEL_OTHERS_CACHED_VIEWS: (state, view) => { - for (const i of state.cachedViews) { - if (i === view.name) { - const index = state.cachedViews.indexOf(i) - state.cachedViews = state.cachedViews.slice(index, index + 1) - break - } - } - }, + ) + }, + ADD_CACHED_VIEW: (state, view) => { + if (state.cachedViews.includes(view.name)) return + if (!view.meta.noCache) { + state.cachedViews.push(view.name) + } + }, - DEL_ALL_VISITED_VIEWS: state => { - // keep affix tags - const affixTags = state.visitedViews.filter(tag => tag.meta.affix) - state.visitedViews = affixTags - }, - DEL_ALL_CACHED_VIEWS: state => { - state.cachedViews = [] - }, - - UPDATE_VISITED_VIEW: (state, view) => { - for (let v of state.visitedViews) { - if (v.path === view.path) { - v = Object.assign(v, view) - break - } + DEL_VISITED_VIEW: (state, view) => { + for (const [i, v] of state.visitedViews.entries()) { + if (v.path === view.path) { + state.visitedViews.splice(i, 1) + break + } + } + }, + DEL_CACHED_VIEW: (state, view) => { + for (const i of state.cachedViews) { + if (i === view.name) { + const index = state.cachedViews.indexOf(i) + state.cachedViews.splice(index, 1) + break } } - }, - actions: { - addView({ dispatch }, view) { - dispatch('addVisitedView', view) - dispatch('addCachedView', view) - }, - addVisitedView({ commit }, view) { - commit('ADD_VISITED_VIEW', view) - }, - addCachedView({ commit }, view) { - commit('ADD_CACHED_VIEW', view) - }, - delView({ dispatch, state }, view) { - return new Promise(resolve => { - dispatch('delVisitedView', view) - dispatch('delCachedView', view) - resolve({ - visitedViews: [...state.visitedViews], - cachedViews: [...state.cachedViews] - }) - }) - }, - delVisitedView({ commit, state }, view) { - return new Promise(resolve => { - commit('DEL_VISITED_VIEW', view) - resolve([...state.visitedViews]) - }) - }, - delCachedView({ commit, state }, view) { - return new Promise(resolve => { - commit('DEL_CACHED_VIEW', view) - resolve([...state.cachedViews]) - }) - }, + 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) => { + for (const i of state.cachedViews) { + if (i === view.name) { + const index = state.cachedViews.indexOf(i) + state.cachedViews = state.cachedViews.slice(index, index + 1) + break + } + } + }, - delOthersViews({ dispatch, state }, view) { - return new Promise(resolve => { - dispatch('delOthersVisitedViews', view) - dispatch('delOthersCachedViews', view) - resolve({ - visitedViews: [...state.visitedViews], - cachedViews: [...state.cachedViews] - }) - }) - }, - delOthersVisitedViews({ commit, state }, view) { - return new Promise(resolve => { - commit('DEL_OTHERS_VISITED_VIEWS', view) - resolve([...state.visitedViews]) - }) - }, - delOthersCachedViews({ commit, state }, view) { - return new Promise(resolve => { - commit('DEL_OTHERS_CACHED_VIEWS', view) - resolve([...state.cachedViews]) - }) - }, + DEL_ALL_VISITED_VIEWS: state => { + // keep affix tags + const affixTags = state.visitedViews.filter(tag => tag.meta.affix) + state.visitedViews = affixTags + }, + DEL_ALL_CACHED_VIEWS: state => { + state.cachedViews = [] + }, - delAllViews({ dispatch, state }, view) { - return new Promise(resolve => { - dispatch('delAllVisitedViews', view) - dispatch('delAllCachedViews', view) - resolve({ - visitedViews: [...state.visitedViews], - cachedViews: [...state.cachedViews] - }) - }) - }, - delAllVisitedViews({ commit, state }) { - return new Promise(resolve => { - commit('DEL_ALL_VISITED_VIEWS') - resolve([...state.visitedViews]) - }) - }, - delAllCachedViews({ commit, state }) { - return new Promise(resolve => { - commit('DEL_ALL_CACHED_VIEWS') - resolve([...state.cachedViews]) - }) - }, - - updateVisitedView({ commit }, view) { - commit('UPDATE_VISITED_VIEW', view) + UPDATE_VISITED_VIEW: (state, view) => { + for (let v of state.visitedViews) { + if (v.path === view.path) { + v = Object.assign(v, view) + break + } } } } -export default tagsView +const actions = { + addView({ dispatch }, view) { + dispatch('addVisitedView', view) + dispatch('addCachedView', view) + }, + addVisitedView({ commit }, view) { + commit('ADD_VISITED_VIEW', view) + }, + addCachedView({ commit }, view) { + commit('ADD_CACHED_VIEW', view) + }, + + delView({ dispatch, state }, view) { + return new Promise(resolve => { + dispatch('delVisitedView', view) + dispatch('delCachedView', view) + resolve({ + visitedViews: [...state.visitedViews], + cachedViews: [...state.cachedViews] + }) + }) + }, + delVisitedView({ commit, state }, view) { + return new Promise(resolve => { + commit('DEL_VISITED_VIEW', view) + resolve([...state.visitedViews]) + }) + }, + delCachedView({ commit, state }, view) { + return new Promise(resolve => { + commit('DEL_CACHED_VIEW', view) + resolve([...state.cachedViews]) + }) + }, + + delOthersViews({ dispatch, state }, view) { + return new Promise(resolve => { + dispatch('delOthersVisitedViews', view) + dispatch('delOthersCachedViews', view) + resolve({ + visitedViews: [...state.visitedViews], + cachedViews: [...state.cachedViews] + }) + }) + }, + delOthersVisitedViews({ commit, state }, view) { + return new Promise(resolve => { + commit('DEL_OTHERS_VISITED_VIEWS', view) + resolve([...state.visitedViews]) + }) + }, + delOthersCachedViews({ commit, state }, view) { + return new Promise(resolve => { + commit('DEL_OTHERS_CACHED_VIEWS', view) + resolve([...state.cachedViews]) + }) + }, + + delAllViews({ dispatch, state }, view) { + return new Promise(resolve => { + dispatch('delAllVisitedViews', view) + dispatch('delAllCachedViews', view) + resolve({ + visitedViews: [...state.visitedViews], + cachedViews: [...state.cachedViews] + }) + }) + }, + delAllVisitedViews({ commit, state }) { + return new Promise(resolve => { + commit('DEL_ALL_VISITED_VIEWS') + resolve([...state.visitedViews]) + }) + }, + delAllCachedViews({ commit, state }) { + return new Promise(resolve => { + commit('DEL_ALL_CACHED_VIEWS') + resolve([...state.cachedViews]) + }) + }, + + updateVisitedView({ commit }, view) { + commit('UPDATE_VISITED_VIEW', view) + } +} + +export default { + namespaced: true, + state, + mutations, + actions +} diff --git a/src/store/modules/user.js b/src/store/modules/user.js index 55459120..c79f6a62 100644 --- a/src/store/modules/user.js +++ b/src/store/modules/user.js @@ -1,118 +1,123 @@ import { login, logout, getInfo } from '@/api/user' import { getToken, setToken, removeToken } from '@/utils/auth' -const user = { - state: { - token: getToken(), - name: '', - avatar: '', - introduction: '', - roles: [] +const state = { + token: getToken(), + name: '', + avatar: '', + introduction: '', + roles: [] +} + +const mutations = { + SET_TOKEN: (state, token) => { + state.token = token + }, + SET_INTRODUCTION: (state, introduction) => { + state.introduction = introduction + }, + SET_NAME: (state, name) => { + state.name = name + }, + SET_AVATAR: (state, avatar) => { + state.avatar = avatar + }, + SET_ROLES: (state, roles) => { + state.roles = roles + } +} + +const actions = { + // user login + login({ commit }, userInfo) { + const { username, password } = userInfo + return new Promise((resolve, reject) => { + login({ username: username.trim(), password: password }).then(response => { + const { data } = response + commit('SET_TOKEN', data.token) + setToken(data.token) + resolve() + }).catch(error => { + reject(error) + }) + }) }, - mutations: { - SET_TOKEN: (state, token) => { - state.token = token - }, - SET_INTRODUCTION: (state, introduction) => { - state.introduction = introduction - }, - SET_NAME: (state, name) => { - state.name = name - }, - SET_AVATAR: (state, avatar) => { - state.avatar = avatar - }, - SET_ROLES: (state, roles) => { - state.roles = roles - } + // get user info + getInfo({ commit, state }) { + return new Promise((resolve, reject) => { + getInfo(state.token).then(response => { + const { data } = response + + if (!data) { + reject('Verification failed, please Login again.') + } + + const { roles, name, avatar, introduction } = data + + // roles must be a non-empty array + if (!roles || roles.length <= 0) { + reject('getInfo: roles must be a non-null array!') + } + + commit('SET_ROLES', roles) + commit('SET_NAME', name) + commit('SET_AVATAR', avatar) + commit('SET_INTRODUCTION', introduction) + resolve(data) + }).catch(error => { + reject(error) + }) + }) }, - actions: { - // user login - login({ commit }, userInfo) { - const { username, password } = userInfo - return new Promise((resolve, reject) => { - login({ username: username.trim(), password: password }).then(response => { - const { data } = response - commit('SET_TOKEN', data.token) - setToken(data.token) - resolve() - }).catch(error => { - reject(error) - }) - }) - }, - - // get user info - getInfo({ commit, state }) { - return new Promise((resolve, reject) => { - getInfo(state.token).then(response => { - const { data } = response - - if (!data) { - reject('Verification failed, please Login again.') - } - - const { roles, name, avatar, introduction } = data - - // roles must be a non-empty array - if (!roles || roles.length <= 0) { - reject('getInfo: roles must be a non-null array!') - } - - commit('SET_ROLES', roles) - commit('SET_NAME', name) - commit('SET_AVATAR', avatar) - commit('SET_INTRODUCTION', introduction) - resolve(data) - }).catch(error => { - reject(error) - }) - }) - }, - - // user logout - Logout({ commit, state }) { - return new Promise((resolve, reject) => { - logout(state.token).then(() => { - commit('SET_TOKEN', '') - commit('SET_ROLES', []) - removeToken() - resolve() - }).catch(error => { - reject(error) - }) - }) - }, - - // remove token - resetToken({ commit }) { - return new Promise(resolve => { + // user logout + logout({ commit, state }) { + return new Promise((resolve, reject) => { + logout(state.token).then(() => { commit('SET_TOKEN', '') commit('SET_ROLES', []) removeToken() resolve() + }).catch(error => { + reject(error) }) - }, + }) + }, - // 动态修改权限 - changeRoles({ commit, dispatch }, role) { - return new Promise(resolve => { - commit('SET_TOKEN', role) - setToken(role) - getInfo(role).then(response => { - const data = response.data - commit('SET_ROLES', data.roles) - commit('SET_NAME', data.name) - commit('SET_AVATAR', data.avatar) - commit('SET_INTRODUCTION', data.introduction) - dispatch('generateRoutes', data) // 动态修改权限后 重绘侧边菜单 - resolve() - }) + // remove token + resetToken({ commit }) { + return new Promise(resolve => { + commit('SET_TOKEN', '') + commit('SET_ROLES', []) + removeToken() + resolve() + }) + }, + + // 动态修改权限 + changeRoles({ commit, dispatch }, role) { + return new Promise(resolve => { + const token = role + '-token' + commit('SET_TOKEN', token) + setToken(token) + getInfo(token).then(response => { + const { data } = response + const { roles, name, avatar, introduction } = data + commit('SET_ROLES', roles) + commit('SET_NAME', name) + commit('SET_AVATAR', avatar) + commit('SET_INTRODUCTION', introduction) + dispatch('permission/generateRoutes', data) // 动态修改权限后 重绘侧边菜单 + resolve() }) - } + }) } } -export default user +export default { + namespaced: true, + state, + mutations, + actions +} diff --git a/src/utils/errorLog.js b/src/utils/errorLog.js index c3c0597f..c508c789 100644 --- a/src/utils/errorLog.js +++ b/src/utils/errorLog.js @@ -23,7 +23,7 @@ if (checkNeed()) { // Don't ask me why I use Vue.nextTick, it just a hack. // detail see https://forum.vuejs.org/t/dispatch-in-vue-config-errorhandler-has-some-problem/23500 Vue.nextTick(() => { - store.dispatch('addErrorLog', { + store.dispatch('errorLog/addErrorLog', { err, vm, info, diff --git a/src/utils/request.js b/src/utils/request.js index 58fe9fac..3d1c0980 100644 --- a/src/utils/request.js +++ b/src/utils/request.js @@ -57,7 +57,7 @@ service.interceptors.response.use( // cancelButtonText: '取消', // type: 'warning' // }).then(() => { - // store.dispatch('resetToken').then(() => { + // store.dispatch('user/resetToken').then(() => { // location.reload() // 为了重新实例化vue-router对象 避免bug // }) // }) diff --git a/src/views/example/components/ArticleDetail.vue b/src/views/example/components/ArticleDetail.vue index 00f0056f..0deed1c9 100644 --- a/src/views/example/components/ArticleDetail.vue +++ b/src/views/example/components/ArticleDetail.vue @@ -186,7 +186,7 @@ export default { setTagsViewTitle() { const title = this.lang === 'zh' ? '编辑文章' : 'Edit Article' const route = Object.assign({}, this.tempRoute, { title: `${title}-${this.postForm.id}` }) - this.$store.dispatch('updateVisitedView', route) + this.$store.dispatch('tagsView/updateVisitedView', route) }, submitForm() { this.postForm.display_time = parseInt(this.display_time / 1000) diff --git a/src/views/i18n-demo/index.vue b/src/views/i18n-demo/index.vue index 838b0265..60c9a80e 100644 --- a/src/views/i18n-demo/index.vue +++ b/src/views/i18n-demo/index.vue @@ -110,7 +110,7 @@ export default { }, set(lang) { this.$i18n.locale = lang - this.$store.dispatch('setLanguage', lang) + this.$store.dispatch('app/setLanguage', lang) } } }, diff --git a/src/views/login/index.vue b/src/views/login/index.vue index 0a4f82f0..b74512d0 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -136,7 +136,7 @@ export default { if (valid) { this.loading = true // dispatch @/store/modules/user login action - this.$store.dispatch('login', this.loginForm).then(() => { + this.$store.dispatch('user/login', this.loginForm).then(() => { this.loading = false this.$router.push({ path: this.redirect || '/' }) }).catch(() => { diff --git a/src/views/permission/components/SwitchRoles.vue b/src/views/permission/components/SwitchRoles.vue index 5e0cd56c..55297d09 100644 --- a/src/views/permission/components/SwitchRoles.vue +++ b/src/views/permission/components/SwitchRoles.vue @@ -22,7 +22,7 @@ export default { return this.roles[0] }, set(val) { - this.$store.dispatch('changeRoles', val).then(() => { + this.$store.dispatch('user/changeRoles', val).then(() => { this.$emit('change') }) }