chore[litemall-vue]: 参考litemall-admin结构，重新调整litemall-vue的src结构

litemall-vue/src/main.js

 import Vue from 'vue';
 import App from './App.vue';
-import router from './vue/router';
+import router from './router';
+import store from './store'
 import './assets/scss/global.scss';
 import '@/assets/scss/iconfont/iconfont.css';
 
 import VeeValidate, { Validator } from 'vee-validate';
-import VueCountdown from '@/vue/plugins/vue-countdown';
+import VueCountdown from '@/plugins/vue-countdown';
 import zhCN from 'vee-validate/dist/locale/zh_CN';
 
-import axios from '@/vue/plugins/axios';
-import filters from '@/vue/filter';
+import axios from '@/plugins/axios';
+import filters from '@/filter';
 
 Vue.use(VueCountdown);
 Vue.use(axios);
@@ -41,5 +42,6 @@ Vue.config.productionTip = false;
 
 new Vue({
   router,
+  store,
   render: h => h(App)
 }).$mount('#app');

litemall-vue/src/vue/router/home.js → litemall-vue/src/router/home.js

-const Tabbar = () =>
-  import(/* webpackChunkName: "Tabbar" */ '@/vue/components/Tabbar/');
-import asyncLoader from 'core/async-loader';
+const Tabbar = () => import('@/components/Tabbar/');
 
 export default [
   {
     path: '/',
     name: 'home',
     components: {
-      default: asyncLoader('home/tabbar-home'),
+      default: () => import('@/views/home/tabbar-home'),
       tabbar: Tabbar
     },
     meta: {

litemall-vue/src/vue/router/index.js → litemall-vue/src/router/index.js

 import Vue from 'vue';
 import Router from 'vue-router';
-import { getLocalStorage } from '@/core/utils/local-storage';
+import { getLocalStorage } from '@/utils/local-storage';
 
 import home from './home';
 import items from './items';

litemall-vue/src/vue/router/items.js → litemall-vue/src/router/items.js

-import asyncLoader from 'core/async-loader';
-
 const Tabbar = () =>
-  import(/* webpackChunkName: "Tabbar" */ '@/vue/components/Tabbar/');
+  import(/* webpackChunkName: "Tabbar" */ '@/components/Tabbar/');
 
 export default [
   {
@@ -11,7 +9,7 @@ export default [
       keepAlive: true
     },
     components: {
-      default: asyncLoader('items/tabbar-class'),
+      default:  () => import('@/views/items/tabbar-class'),
       tabbar: Tabbar
     }
   },
@@ -21,7 +19,7 @@ export default [
     meta: {
       keepAlive: true
     },
-    component: asyncLoader('items/search')
+    component: () => import('@/views/items/search')
   },
   {
     path: '/items/search/result',
@@ -29,19 +27,19 @@ export default [
     meta: {
       keepAlive: true
     },
-    component: asyncLoader('items/search-result'),
+    component: () => import('@/views/items/search-result'),
     props: route => route.query
   },
   {
     path: '/items/detail/:itemId',
     name: 'detail',
     props: true,
-    component: asyncLoader('items/detail')
+    component: () => import('@/views/items/detail')
   },
   {
     path: '/items/list',
     name: 'list',
-    component: asyncLoader('items/list'),
+    component: () => import('@/views/items/list'),
     props: route => ({
       itemClass: +route.query.itemClass
     })

litemall-vue/src/vue/router/login.js → litemall-vue/src/router/login.js

-import asyncLoader from 'core/async-loader';
-const login = asyncLoader('login/login');
-const registerGetCode = asyncLoader('login/register-getCode');
-const registerSubmit = asyncLoader('login/register-submit');
-const registerStatus = asyncLoader('login/register-status');
-const forget = asyncLoader('login/forget');
-const forgetReset = asyncLoader('login/forget-reset');
-const forgetStatus = asyncLoader('login/forget-status');
-
 export default [
   {
     path: '/login',
     name: 'login',
-    component: login
+    component: () => import('@/views/login/login')
   },
   {
     path: '/login/registerGetCode',
     name: 'registerGetCode',
-    component: registerGetCode
+    component: () => import('@/views/login/register-getCode')
   },
   {
     path: '/login/registerSubmit',
     name: 'registerSubmit',
-    component: registerSubmit
+    component: () => import('@/views/login/register-submit')
   },
   {
     path: '/login/registerStatus/:status',
     name: 'registerStatus',
     props: true,
-    component: registerStatus
+    component: () => import('@/views/login/register-status')
   },
   {
     path: '/login/forget',
     name: 'forget',
-    component: forget
+    component: () => import('@/views/login/forget')
   },
   {
     path: '/login/forget/reset',
     name: 'forgetReset',
-    component: forgetReset
+    component: () => import('@/views/login/forget-reset')
   },
   {
     path: '/login/forget/reset/:status',
     name: 'forgetStatus',
     props: true,
-    component: forgetStatus
+    component: () => import('@/views/login/forget-status')
   }
 ];

litemall-vue/src/vue/router/order.js → litemall-vue/src/router/order.js

-import asyncLoader from 'core/async-loader';
-const tab_cart = asyncLoader('order/tabbar-cart');
-const PlaceOrderEntity = asyncLoader('order/place-order-entity');
-const orderDetail = asyncLoader('order/orderDetail');
-const PlaceOrderVirtual = asyncLoader('order/place-order-virtual');
-const Payment = asyncLoader('order/payment');
-const PaymentStatus = asyncLoader('order/payment-status');
-
-const Tabbar = () =>
-  import(/* webpackChunkName: "Tabbar" */ '@/vue/components/Tabbar/');
+const Tabbar = () => import('@/components/Tabbar/');
 
 export default [
   {
@@ -16,32 +7,35 @@ export default [
     meta: {
       login: true
     },
-    components: { default: tab_cart, tabbar: Tabbar }
+    components: { 
+      default: () => import('@/views/order/tabbar-cart'), 
+      tabbar: Tabbar 
+    }
   },
   {
     path: '/order/placeOrderEntity',
     name: 'placeOrderEntity',
-    component: PlaceOrderEntity
+    component: () => import('@/views/order/place-order-entity')
   },
   {
     path: '/order/orderDetail',
     name: 'orderDetail',
-    component: orderDetail
+    component: () => import('@/views/order/orderDetail')
   },
   {
     path: '/order/placeOrderVirtual',
     name: 'placeOrderVirtual',
-    component: PlaceOrderVirtual
+    component: () => import('@/views/order/place-order-virtual')
   },
   {
     path: '/order/payment',
     name: 'payment',
-    component: Payment
+    component: () => import('@/views/order/payment')
   },
   {
     path: '/order/payment/:status',
     name: 'paymentStatus',
-    component: PaymentStatus,
+    component: () => import('@/views/order/payment-status'),
     props: true
   }
 ];

litemall-vue/src/vue/router/user.js → litemall-vue/src/router/user.js

-import asyncLoader from 'core/async-loader';
+const tab_user = () => import('@/views/user/tabbar-user');
+const UserCollect = () => import('@/views/user/module-collect');
+const UserInvitation = () => import('@/views/user/module-invitation');
+const UserAddress = () => import('@/views/user/module-address');
+const UserAddressEdit = () => import('@/views/user/module-address-edit');
+const UserServer = () => import('@/views/user/module-server');
 
-const tab_user = asyncLoader('user/tabbar-user');
-const UserCollect = asyncLoader('user/module-collect');
-const UserInvitation = asyncLoader('user/module-invitation');
-const UserAddress = asyncLoader('user/module-address');
-const UserAddressEdit = asyncLoader('user/module-address-edit');
-const UserServer = asyncLoader('user/module-server');
+const UserInformation = () => import('@/views/user/user-information-set');
+const UserInfo_SetBg = () => import('@/views/user/user-information-set/set-bg');
+const UserInfo_SetMobile = () => import('@/views/user/user-information-set/set-mobile');
+const UserInfo_SetNickname = () => import('@/views/user/user-information-set/set-nickname');
+const UserInfo_SetPassword = () => import('@/views/user/user-information-set/set-password');
 
-const UserInformation = asyncLoader('user/user-information-set');
-const UserInfo_SetBg = asyncLoader('user/user-information-set/set-bg');
-const UserInfo_SetMobile = asyncLoader('user/user-information-set/set-mobile');
-const UserInfo_SetNickname = asyncLoader(
-  'user/user-information-set/set-nickname'
-);
-const UserInfo_SetPassword = asyncLoader(
-  'user/user-information-set/set-password'
-);
+const UserOrderEntityList = () => import('@/views/user/order-entity-list');
+const UserOrderEleList = () => import('@/views/user/order-ele-list');
+const UserRefundList = () => import('@/views/user/refund-list');
 
-const UserOrderEntityList = asyncLoader('user/order-entity-list');
-const UserOrderEleList = asyncLoader('user/order-ele-list');
-const UserRefundList = asyncLoader('user/refund-list');
-
-const Tabbar = () =>
-  import(/* webpackChunkName: "Tabbar" */ '@/vue/components/Tabbar/');
+const Tabbar = () => import('@/components/Tabbar/');
 
 export default [
   {

litemall-vue/src/store/getters.js

+const getters = {
+  sidebar: state => state.app.sidebar,
+  language: state => state.app.language,
+  size: state => state.app.size,
+  device: state => state.app.device,
+
+  token: state => state.user.token,
+  avatar: state => state.user.avatar,
+  name: state => state.user.name,
+  introduction: state => state.user.introduction,
+  status: state => state.user.status,
+  roles: state => state.user.roles,
+  perms: state => state.user.perms,
+  setting: state => state.user.setting
+}
+export default getters

litemall-vue/src/store/index.js

+import Vue from 'vue'
+import Vuex from 'vuex'
+import app from './modules/app'
+import user from './modules/user'
+import getters from './getters'
+
+Vue.use(Vuex)
+
+const store = new Vuex.Store({
+  modules: {
+    app,
+    user
+  },
+  getters
+})
+
+export default store

litemall-vue/src/store/modules/app.js

+import Cookies from 'js-cookie'
+
+const app = {
+  state: {
+    sidebar: {
+      opened: !+Cookies.get('sidebarStatus'),
+      withoutAnimation: false
+    },
+    device: 'desktop',
+    language: Cookies.get('language') || 'en',
+    size: Cookies.get('size') || 'medium'
+  },
+  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
+    },
+    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)
+    }
+  }
+}
+
+export default app

litemall-vue/src/store/modules/user.js

+import { loginByUsername, logout, getUserInfo } from '@/api/user'
+import { getToken, setToken, removeToken } from '@/utils/auth'
+
+const user = {
+  state: {
+    user: '',
+    status: '',
+    code: '',
+    token: getToken(),
+    name: '',
+    avatar: '',
+    introduction: '',
+    roles: [],
+    perms: [],
+    setting: {
+      articlePlatform: []
+    }
+  },
+
+  mutations: {
+    SET_CODE: (state, code) => {
+      state.code = code
+    },
+    SET_TOKEN: (state, token) => {
+      state.token = token
+    },
+    SET_INTRODUCTION: (state, introduction) => {
+      state.introduction = introduction
+    },
+    SET_SETTING: (state, setting) => {
+      state.setting = setting
+    },
+    SET_STATUS: (state, status) => {
+      state.status = status
+    },
+    SET_NAME: (state, name) => {
+      state.name = name
+    },
+    SET_AVATAR: (state, avatar) => {
+      state.avatar = avatar
+    },
+    SET_ROLES: (state, roles) => {
+      state.roles = roles
+    },
+    SET_PERMS: (state, perms) => {
+      state.perms = perms
+    }
+  },
+
+  actions: {
+    // 用户名登录
+    LoginByUsername({ commit }, userInfo) {
+      const username = userInfo.username.trim()
+      return new Promise((resolve, reject) => {
+        loginByUsername(username, userInfo.password).then(response => {
+          const token = response.data.data
+          commit('SET_TOKEN', token)
+          setToken(token)
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 获取用户信息
+    GetUserInfo({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        getUserInfo(state.token).then(response => {
+          const data = response.data.data
+
+          if (data.perms && data.perms.length > 0) { // 验证返回的perms是否是一个非空数组
+            commit('SET_PERMS', data.perms)
+          } else {
+            reject('getInfo: perms must be a non-null array !')
+          }
+
+          commit('SET_ROLES', data.roles)
+          commit('SET_NAME', data.name)
+          commit('SET_AVATAR', data.avatar)
+          commit('SET_INTRODUCTION', data.introduction)
+          resolve(response)
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 第三方验证登录
+    // LoginByThirdparty({ commit, state }, code) {
+    //   return new Promise((resolve, reject) => {
+    //     commit('SET_CODE', code)
+    //     loginByThirdparty(state.status, state.email, state.code).then(response => {
+    //       commit('SET_TOKEN', response.data.token)
+    //       setToken(response.data.token)
+    //       resolve()
+    //     }).catch(error => {
+    //       reject(error)
+    //     })
+    //   })
+    // },
+
+    // 登出
+    LogOut({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        logout(state.token).then(() => {
+          commit('SET_TOKEN', '')
+          commit('SET_ROLES', [])
+          commit('SET_PERMS', [])
+          removeToken()
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 前端 登出
+    FedLogOut({ commit }) {
+      return new Promise(resolve => {
+        commit('SET_TOKEN', '')
+        removeToken()
+        resolve()
+      })
+    },
+
+    // 动态修改权限
+    ChangeRoles({ commit, dispatch }, role) {
+      return new Promise(resolve => {
+        commit('SET_TOKEN', role)
+        setToken(role)
+        getUserInfo(role).then(response => {
+          const data = response.data
+          commit('SET_ROLES', data.roles)
+          commit('SET_PERMS', data.perms)
+          commit('SET_NAME', data.name)
+          commit('SET_AVATAR', data.avatar)
+          commit('SET_INTRODUCTION', data.introduction)
+          dispatch('GenerateRoutes', data) // 动态修改权限后 重绘侧边菜单
+          resolve()
+        })
+      })
+    }
+  }
+}
+
+export default user

litemall-vue/src/utils/auth.js

+import Cookies from 'js-cookie'
+
+const TokenKey = 'X-Litemall-Admin-Token'
+
+export function getToken() {
+  return Cookies.get(TokenKey)
+}
+
+export function setToken(token) {
+  return Cookies.set(TokenKey, token)
+}
+
+export function removeToken() {
+  return Cookies.remove(TokenKey)
+}