1.2.3 后台操作按钮调整及其新增开启拼团功能

src/store/getters.js

@@ -0,0 +1,21 @@
+const getters = {
+  sidebar: state => state.app.sidebar,
+  device: state => state.app.device,
+  token: state => state.user.token,
+  visitedViews: state => state.tagsView.visitedViews,
+  cachedViews: state => state.tagsView.cachedViews,
+  roles: state => state.user.roles,
+  user: state => state.user.user,
+  loadMenus: state => state.user.loadMenus,
+  permission_routers: state => state.permission.routers,
+  addRouters: state => state.permission.addRouters,
+  socketApi: state => state.api.socketApi,
+  imagesUploadApi: state => state.api.imagesUploadApi,
+  baseApi: state => state.api.baseApi,
+  fileUploadApi: state => state.api.fileUploadApi,
+  updateAvatarApi: state => state.api.updateAvatarApi,
+  qiNiuUploadApi: state => state.api.qiNiuUploadApi,
+  sqlApi: state => state.api.sqlApi,
+  swaggerApi: state => state.api.swaggerApi
+}
+export default getters

src/store/index.js

@@ -0,0 +1,25 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+import app from './modules/app'
+import api from './modules/api'
+import user from './modules/user'
+import tagsView from './modules/tagsView'
+import permission from './modules/permission'
+import settings from './modules/settings'
+import getters from './getters'
+
+Vue.use(Vuex)
+
+const store = new Vuex.Store({
+  modules: {
+    app,
+    api,
+    user,
+    tagsView,
+    permission,
+    settings
+  },
+  getters
+})
+
+export default store

src/store/modules/api.js

@@ -0,0 +1,23 @@
+const baseUrl = process.env.BASE_API
+const api = {
+  state: {
+    // 实时控制台
+    socketApi: baseUrl + '/websocket?token=kl',
+    // 图片上传
+    imagesUploadApi: baseUrl + '/api/pictures',
+    // 修改头像
+    updateAvatarApi: baseUrl + '/api/users/updateAvatar',
+    // 上传文件到七牛云
+    qiNiuUploadApi: baseUrl + '/api/qiNiuContent',
+    // Sql 监控
+    sqlApi: baseUrl + '/druid',
+    // swagger
+    swaggerApi: baseUrl + '/swagger-ui.html',
+    // 文件上传
+    fileUploadApi: baseUrl + '/api/localStorage',
+    // baseUrl，
+    baseApi: baseUrl
+  }
+}
+
+export default api

src/store/modules/app.js

@@ -0,0 +1,43 @@
+import Cookies from 'js-cookie'
+
+const app = {
+  state: {
+    sidebar: {
+      opened: !+Cookies.get('sidebarStatus'),
+      withoutAnimation: false
+    },
+    device: 'desktop'
+  },
+  mutations: {
+    TOGGLE_SIDEBAR: state => {
+      if (state.sidebar.opened) {
+        Cookies.set('sidebarStatus', 1)
+      } else {
+        Cookies.set('sidebarStatus', 0)
+      }
+      state.sidebar.opened = !state.sidebar.opened
+      state.sidebar.withoutAnimation = false
+    },
+    CLOSE_SIDEBAR: (state, withoutAnimation) => {
+      Cookies.set('sidebarStatus', 1)
+      state.sidebar.opened = false
+      state.sidebar.withoutAnimation = withoutAnimation
+    },
+    TOGGLE_DEVICE: (state, device) => {
+      state.device = device
+    }
+  },
+  actions: {
+    ToggleSideBar: ({ commit }) => {
+      commit('TOGGLE_SIDEBAR')
+    },
+    closeSideBar({ commit }, { withoutAnimation }) {
+      commit('CLOSE_SIDEBAR', withoutAnimation)
+    },
+    toggleDevice({ commit }, device) {
+      commit('TOGGLE_DEVICE', device)
+    }
+  }
+}
+
+export default app

src/store/modules/permission.js

@@ -0,0 +1,44 @@
+import { constantRouterMap } from '@/router/routers'
+import Layout from '@/layout/Layout'
+
+const permission = {
+  state: {
+    routers: constantRouterMap,
+    addRouters: []
+  },
+  mutations: {
+    SET_ROUTERS: (state, routers) => {
+      state.addRouters = routers
+      state.routers = constantRouterMap.concat(routers)
+    }
+  },
+  actions: {
+    GenerateRoutes({ commit }, asyncRouter) {
+      commit('SET_ROUTERS', asyncRouter)
+    }
+  }
+}
+
+export const filterAsyncRouter = (routers) => { // 遍历后台传来的路由字符串，转换为组件对象
+  const accessedRouters = routers.filter(router => {
+    if (router.component) {
+      if (router.component === 'Layout') { // Layout组件特殊处理
+        router.component = Layout
+      } else {
+        const component = router.component
+        router.component = loadView(component)
+      }
+    }
+    if (router.children && router.children.length) {
+      router.children = filterAsyncRouter(router.children)
+    }
+    return true
+  })
+  return accessedRouters
+}
+
+export const loadView = (view) => { // 路由懒加载
+  return () => import(`@/views/${view}`)
+}
+
+export default permission

src/store/modules/settings.js

@@ -0,0 +1,30 @@
+import Config from '@/config'
+import variables from '@/styles/element-variables.scss'
+
+const settings = {
+  state: {
+    showRightPanel: false,
+    tagsView: Config.tagsView,
+    fixedHeader: Config.fixedHeader,
+    sidebarLogo: Config.sidebarLogo,
+    theme: variables.theme,
+    settingBtn: Config.settingBtn,
+    uniqueOpened: Config.uniqueOpened,
+    showFooter: Config.showFooter,
+    footerTxt: Config.footerTxt,
+    caseNumber: Config.caseNumber
+  },
+  mutations: {
+    CHANGE_SETTING: (state, { key, value }) => {
+      if (state.hasOwnProperty(key)) {
+        state[key] = value
+      }
+    }
+  },
+  actions: {
+    changeSetting({ commit }, data) {
+      commit('CHANGE_SETTING', data)
+    }
+  }
+}
+export default settings

src/store/modules/tagsView.js

@@ -0,0 +1,162 @@
+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
+        }
+      }
+    },
+
+    DEL_OTHERS_VISITED_VIEWS: (state, view) => {
+      for (const [i, v] of state.visitedViews.entries()) {
+        if (v.path === view.path) {
+          state.visitedViews = state.visitedViews.slice(i, i + 1)
+          break
+        }
+      }
+    },
+    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
+        }
+      }
+    },
+
+    DEL_ALL_VISITED_VIEWS: state => {
+      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
+        }
+      }
+    }
+
+  },
+  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 tagsView

src/store/modules/user.js

@@ -0,0 +1,91 @@
+import { login, getInfo } from '@/api/login'
+import { getToken, setToken, removeToken } from '@/utils/auth'
+import { decrypt } from '@/utils/rsaEncrypt'
+
+const user = {
+  state: {
+    token: getToken(),
+    user: {},
+    roles: [],
+    // 第一次加载菜单时用到
+    loadMenus: false
+  },
+
+  mutations: {
+    SET_TOKEN: (state, token) => {
+      state.token = token
+    },
+    SET_USER: (state, user) => {
+      state.user = user
+    },
+    SET_ROLES: (state, roles) => {
+      state.roles = roles
+    },
+    SET_LOAD_MENUS: (state, loadMenus) => {
+      state.loadMenus = loadMenus
+    }
+  },
+
+  actions: {
+    // 登录
+    Login({ commit }, userInfo) {
+      const username = userInfo.username
+      const password = decrypt(userInfo.password)
+      const code = userInfo.code
+      const uuid = userInfo.uuid
+      const rememberMe = userInfo.rememberMe
+      return new Promise((resolve, reject) => {
+        login(username, password, code, uuid).then(res => {
+          setToken(res.token, rememberMe)
+          commit('SET_TOKEN', res.token)
+          setUserInfo(res.user, commit)
+          // 第一次加载菜单时用到， 具体见 src 目录下的 permission.js
+          commit('SET_LOAD_MENUS', true)
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 获取用户信息
+    GetInfo({ commit }) {
+      return new Promise((resolve, reject) => {
+        getInfo().then(res => {
+          setUserInfo(res, commit)
+          resolve(res)
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 登出
+    LogOut({ commit }) {
+      return new Promise((resolve, reject) => {
+        commit('SET_TOKEN', '')
+        commit('SET_ROLES', [])
+        removeToken()
+        resolve()
+      })
+    },
+
+    updateLoadMenus({ commit }) {
+      return new Promise((resolve, reject) => {
+        commit('SET_LOAD_MENUS', false)
+      })
+    }
+  }
+}
+
+export const setUserInfo = (res, commit) => {
+  // 如果没有任何权限，则赋予一个默认的权限，避免请求死循环
+  if (res.roles.length === 0) {
+    commit('SET_ROLES', ['ROLE_SYSTEM_DEFAULT'])
+  } else {
+    commit('SET_ROLES', res.roles)
+  }
+  commit('SET_USER', res)
+}
+
+export default user