持久化Vuex中store数据，避免页面刷新后页面数据丢失

sso-manage-console-web/package.json

@@ -20,7 +20,8 @@
     "vue": "^2.5.2",
     "vue-notifications": "^0.9.0",
     "vue-router": "^3.0.1",
-    "vuex": "^3.0.1"
+    "vuex": "^3.0.1",
+    "vuex-persist": "^1.1.1"
   },
   "devDependencies": {
     "autoprefixer": "^7.1.2",

sso-manage-console-web/src/assets/js/notifications.js

@@ -1,36 +0,0 @@
-import VueNotifications from 'vue-notifications'
-
-// Include mini-toaster (or any other UI-notification library)
-import miniToastr from 'mini-toastr'
-
-// We shall setup types of the messages. ('error' type - red and 'success' - green in mini-toastr)
-const toastTypes = {
-  success: 'success',
-  error: 'error',
-  info: 'info',
-  warn: 'warn'
-}
-
-// This step requires only for mini-toastr, just an initialization
-miniToastr.init({types: toastTypes, appendTarget: document.body})
-
-// Here we are seting up messages output to `mini-toastr`
-// This mean that in case of 'success' message we will call miniToastr.success(message, title, timeout, cb)
-// In case of 'error' we will call miniToastr.error(message, title, timeout, cb)
-// and etc.
-function toast ({title, message, type, timeout, cb}) {
-  return miniToastr[type](message, title, timeout, cb)
-}
-
-// Here we map vue-notifications method to function abowe (to mini-toastr)
-// By default vue-notifications can have 4 methods: 'success', 'error', 'info' and 'warn'
-// But you can specify whatever methods you want.
-// If you won't specify some method here, output would be sent to the browser's console
-const options = {
-  success: toast,
-  error: toast,
-  info: toast,
-  warn: toast
-}
-
-export { VueNotifications, options }

sso-manage-console-web/src/components/accounts/enterprises/EnterpriseAdmin.vue

@@ -17,32 +17,37 @@
     },
     data () {
       return {
-        messages: [
-          {
-            label: '个人UU',
-            value: 'U05168'
-          },
-          {
-            label: '管理员名称',
-            value: '陈正亮',
-            suffixClass: 'admin-message',
-            action: () => { console.log('Ok') }
-          },
-          {
-            label: '手机号',
-            value: '13600001122'
-          },
-          {
-            label: '邮箱',
-            value: '1891141208@163.com'
-          },
-          {
-            label: '申诉状态',
-            value: '申诉中',
-            suffixClass: 'status-message',
-            action: () => { console.log('Ok') }
-          }
-        ]
+        // messages: [
+        //   {
+        //     label: '个人UU',
+        //     value: 'U05168'
+        //   },
+        //   {
+        //     label: '管理员名称',
+        //     value: '陈正亮',
+        //     suffixClass: 'admin-message',
+        //     action: () => { console.log('Ok') }
+        //   },
+        //   {
+        //     label: '手机号',
+        //     value: '13600001122'
+        //   },
+        //   {
+        //     label: '邮箱',
+        //     value: '1891141208@163.com'
+        //   },
+        //   {
+        //     label: '申诉状态',
+        //     value: '申诉中',
+        //     suffixClass: 'status-message',
+        //     action: () => { console.log('Ok') }
+        //   }
+        // ]
+      }
+    },
+    computed: {
+      messages () {
+        return this.$store.getters.enAdmin
       }
     }
   }

sso-manage-console-web/src/components/accounts/enterprises/EnterpriseAuth.vue

@@ -17,28 +17,11 @@
     },
     data () {
       return {
-        messages: [
-          {
-            label: '企业名称',
-            value: '深圳市优软科技有限公司'
-          },
-          {
-            label: '法定代表人',
-            value: '陈正亮'
-          },
-          {
-            label: '营业执照号',
-            value: '1891141208120191'
-          },
-          {
-            label: '营业执照附件',
-            value: '营业执照.jpg'
-          },
-          {
-            label: '企业地址',
-            value: '广东省深圳市南山区高新科技产业园科技南五路英唐大厦五楼'
-          }
-        ]
+      }
+    },
+    computed: {
+      messages () {
+        return this.$store.getters.enAuthInfo
       }
     }
   }

sso-manage-console-web/src/components/accounts/enterprises/EnterpriseBaseAction.vue

@@ -5,15 +5,15 @@
         <li @click="$router.go(-1)">
           <img src="/static/images/go_back.png" alt="GoBack"/>
         </li>
-        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseBasicInfo'}" exact>
+        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseBasicInfo'}" replace>
           <a>基本信息</a><span class="triangle"></span></router-link>
-        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseMembers'}" exact>
+        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseMembers'}" replace>
           <a>成员管理</a><span class="triangle"></span></router-link>
-        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseAdmin'}" exact><a>管理员信息</a><span
+        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseAdmin'}" replace><a>管理员信息</a><span
           class="triangle"></span></router-link>
-        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseAuth'}" exact>
+        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseAuth'}" replace>
           <a>认证信息</a><span class="triangle"></span></router-link>
-        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseApps'}" exact>
+        <router-link tag="li" active-class="active" :to="{name: 'EnterpriseApps'}" replace>
           <a>应用管理</a><span class="triangle"></span></router-link>
       </ul>
     </div>
@@ -23,8 +23,15 @@
 </template>
 
 <script>
+  import * as types from '@/store/mutation-types'
+
   export default {
-    name: 'common-menu'
+    name: 'common-menu',
+    beforeRouteLeave (to, from, next) {
+      // 清除 store 数据
+      this.$store.commit(types.CLEAR_ENTERPRISE)
+      next()
+    }
   }
 </script>
 

sso-manage-console-web/src/components/accounts/enterprises/EnterpriseBasicInfo.vue

@@ -101,7 +101,8 @@
       }
     },
     mounted () {
-      this.enterpriseInfo = Object.assign({}, this.enterpriseInfo, this.$route.params)
+      const enterprise = this.$store.state.enterprises.savedEnterprise
+      this.enterpriseInfo = Object.assign({}, this.enterpriseInfo, enterprise)
     }
   }
 </script>

sso-manage-console-web/src/components/accounts/enterprises/EnterpriseHome.vue

@@ -78,6 +78,7 @@
 <script>
   import _ from 'lodash'
   import axios from '@/assets/js/axios'
+  import * as types from '@/store/mutation-types'
   import {ValidCode} from '@/Constant'
   import CommonHome from '../common/CommonHome'
 
@@ -165,6 +166,7 @@
         this.fetchData()
       },
       handleClick (row) {
+        this.$store.commit(types.CHOOSE_ENTERPRISE, row)
         const routeLocation = {name: 'EnterpriseBasicInfo', params: row}
         this.$router.push(routeLocation)
       }

sso-manage-console-web/src/main.js

@@ -3,7 +3,7 @@
 import Vue from 'vue'
 import App from './App'
 import router from './router'
-import {options, VueNotifications} from '@/assets/js/notifications'
+import store from './store'
 import 'bootstrap/dist/css/bootstrap.min.css'
 import 'font-awesome/css/font-awesome.min.css'
 import ElementUI from 'element-ui'
@@ -12,9 +12,6 @@ import 'element-ui/lib/theme-chalk/index.css'
 
 Vue.config.productionTip = false
 
-// Activate the plugin
-Vue.use(VueNotifications, options)
-
 // Date format filter
 Vue.filter('date', function (value) {
   if (isNaN(value)) {
@@ -31,6 +28,7 @@ Vue.use(ElementUI)
 new Vue({
   el: '#app',
   router,
+  store,
   template: '<App/>',
   components: { App }
 })

sso-manage-console-web/src/router/index.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
+import store from '../store'
 import Index from '@/components/Index'
 import AccountIndex from '@/components/accounts/AccountIndex'
 import {
@@ -11,6 +12,8 @@ import {AppealHome} from '@/components/accounts/appeals'
 
 Vue.use(Router)
 
+console.log(store)
+
 export default new Router({
   routes: [
     {
@@ -36,11 +39,13 @@ export default new Router({
           path: 'enterprise',
           component: EnterpriseBaseAction,
           beforeEnter: (to, from, next) => {
-            const enterpriseInfo = to.params
-            if (enterpriseInfo.spaceUU) {
+            console.log(store.getters.hasEnInfo)
+
+            //
+            if (store.getters.hasEnInfo) {
               next()
             } else {
-              next({ name: 'EnterpriseHome' })
+              next({ name: 'EnterpriseHome', replace: true })
             }
           },
           children: [
@@ -90,7 +95,7 @@ export default new Router({
             if (userInfo.userUU) {
               next()
             } else {
-              next({ name: 'UserHome' })
+              next({ name: 'UserHome', replace: true })
             }
           }
         },

sso-manage-console-web/src/store/actions.js

@@ -0,0 +1,9 @@
+import * as types from './mutation-types'
+
+export const addToCart = ({ commit, product }) => {
+  if (product.inventory > 0) {
+    commit(types.ADD_TO_CART, {
+      id: product.id
+    })
+  }
+}

sso-manage-console-web/src/store/index.js

@@ -1,4 +1,32 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
+import VuexPersistence from 'vuex-persist'
+import createLogger from 'vuex/dist/logger'
+import * as actions from './actions'
+import enterprises from './modules/enterprises'
 
 Vue.use(Vuex)
+
+// Production environments
+const vuexSession = new VuexPersistence({
+  storage: window.sessionStorage
+})
+
+const plugins = [vuexSession.plugin]
+
+// Debug environments
+const debug = process.env.NODE_ENV !== 'production'
+if (debug) {
+  plugins.push(createLogger())
+}
+
+const store = new Vuex.Store({
+  actions,
+  modules: {
+    enterprises
+  },
+  strict: debug,
+  plugins: plugins
+})
+
+export default store

sso-manage-console-web/src/store/modules/enterprises.js

@@ -0,0 +1,67 @@
+import * as types from '../mutation-types'
+
+// State
+const state = {
+  savedEnterprise: {}
+}
+
+// Getters
+const getters = {
+  enAdmin: state => {
+    const admin = state.savedEnterprise.admin || {}
+    const messages = []
+
+    messages.push({ label: '个人UU', value: admin.userUU || '' })
+
+    messages.push({ label: '管理员名称', value: admin.vipName || '' })
+
+    messages.push({ label: '手机号', value: admin.mobile || '' })
+
+    messages.push({ label: '邮箱', value: admin.email || '' })
+
+    messages.push({ label: '申诉状态', value: '申诉中' })
+    return messages
+  },
+  enAuthInfo: state => {
+    const enterprise = state.savedEnterprise || {}
+    const messages = []
+
+    messages.push({ label: '企业名称', value: enterprise.spaceName || '' })
+
+    messages.push({ label: '法定代表人', value: enterprise.corporation || '' })
+
+    messages.push({ label: '营业执照号', value: enterprise.businessCode || '' })
+
+    messages.push({ label: '营业执照附件', value: enterprise.businessCodeImage || '' })
+
+    messages.push({ label: '企业地址', value: enterprise.companyAddress || '' })
+    return messages
+  },
+  hasEnInfo: state => {
+    return !!(state.savedEnterprise && state.savedEnterprise.spaceUU)
+  }
+}
+
+// Actions
+const actions = {
+
+}
+
+// Mutations
+const mutations = {
+  [types.CHOOSE_ENTERPRISE] (state, enterprise) {
+    if (enterprise) {
+      state.savedEnterprise = enterprise
+    }
+  },
+  [types.CLEAR_ENTERPRISE] (state) {
+    state.savedEnterprise = {}
+  }
+}
+
+export default {
+  state,
+  getters,
+  actions,
+  mutations
+}

sso-manage-console-web/src/store/mutation-types.js

@@ -0,0 +1,6 @@
+export const CHOOSE_ENTERPRISE = 'CHOOSE_ENTERPRISE'
+export const CLEAR_ENTERPRISE = 'CLEAR_ENTERPRISE'
+export const ADD_TO_CART = 'ADD_TO_CART'
+export const SET_CART_ITEMS = 'SET_CART_ITEMS'
+export const SET_CHECKOUT_STATUS = 'SET_CHECKOUT_STATUS'
+export const RECEIVE_PRODUCTS = 'RECEIVE_PRODUCTS'

sso-manage-console-web/yarn.lock

@@ -3317,6 +3317,10 @@ lodash.memoize@^4.1.2:
   version "4.1.2"
   resolved "http://registry.npm.taobao.org/lodash.memoize/download/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
 
+lodash.merge@^4.6.0:
+  version "4.6.0"
+  resolved "http://registry.npm.taobao.org/lodash.merge/download/lodash.merge-4.6.0.tgz#69884ba144ac33fe699737a6086deffadd0f89c5"
+
 lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "http://registry.npm.taobao.org/lodash.uniq/download/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
@@ -5532,6 +5536,12 @@ vue@^2.5.2:
   version "2.5.13"
   resolved "http://registry.npm.taobao.org/vue/download/vue-2.5.13.tgz#95bd31e20efcf7a7f39239c9aa6787ce8cf578e1"
 
+vuex-persist@^1.1.1:
+  version "1.1.1"
+  resolved "http://registry.npm.taobao.org/vuex-persist/download/vuex-persist-1.1.1.tgz#dc3875fa17d5a5881a526276608bdfc8001ed0c1"
+  dependencies:
+    lodash.merge "^4.6.0"
+
 vuex@^3.0.1:
   version "3.0.1"
   resolved "http://registry.npm.taobao.org/vuex/download/vuex-3.0.1.tgz#e761352ebe0af537d4bb755a9b9dc4be3df7efd2"

sso-server/src/main/java/com/uas/sso/entity/Userspace.java

@@ -1,12 +1,20 @@
 package com.uas.sso.entity;
 
 import com.alibaba.fastjson.annotation.JSONField;
-import org.codehaus.jackson.annotate.JsonIgnore;
-
-import javax.persistence.*;
 import java.io.Serializable;
 import java.sql.Timestamp;
 import java.util.List;
+import javax.persistence.CascadeType;
+import javax.persistence.Column;
+import javax.persistence.Entity;
+import javax.persistence.FetchType;
+import javax.persistence.Id;
+import javax.persistence.JoinColumn;
+import javax.persistence.JoinTable;
+import javax.persistence.ManyToMany;
+import javax.persistence.ManyToOne;
+import javax.persistence.Table;
+import org.codehaus.jackson.annotate.JsonIgnore;
 
 /**
  * 企业实体
@@ -184,6 +192,7 @@ public class Userspace implements Serializable {
     /**
      * 企业下的用户
      */
+    @com.fasterxml.jackson.annotation.JsonIgnore
     @ManyToMany
     @JoinTable(name = "sso$user_userspace",
             joinColumns = {@JoinColumn(name="space_uu", referencedColumnName="spaceuu")},