vuex部分优化

src/store/index.ts

@@ -1,16 +1,21 @@
 import { LoginResponse } from '@/types/auth'
+import { BaseInfo } from '@/types/user'
 import { InjectionKey } from 'vue'
 import { createStore, Store, useStore as baseUseStore } from 'vuex'
 import createPersistedState from 'vuex-persistedstate'
 import auth, { AuthState } from './modules/auth'
 import refresh, { RefreshState } from './modules/refresh'
 
+export const PERSISTED_KEY = 'VUEX_PERSISTED'
 export const key: InjectionKey<Store<State>> = Symbol()
 
 export interface State {
     isLogin: boolean
     accessToken: string
     tokenType: string
+    openId: string
+    loginAt: number
+    user: BaseInfo
     auth?: AuthState
     refresh?: RefreshState
 }
@@ -20,7 +25,10 @@ export default createStore<State>({
     state: {
         isLogin: false,
         accessToken: '',
-        tokenType: ''
+        tokenType: '',
+        openId: '',
+        loginAt: 0,
+        user: {} as BaseInfo
     },
     getters: {
         isLogin: (state: State): boolean => {
@@ -28,18 +36,32 @@ export default createStore<State>({
         },
         accessToken: (state: State): string => {
             return state.tokenType + ' ' + state.accessToken
+        },
+        user: (state: State): BaseInfo => {
+            return state.user
         }
     },
     mutations: {
         setAccessToken (state: State, payload: LoginResponse) {
             state.accessToken = payload.access_token
             state.tokenType = payload.token_type
+            state.loginAt = Date.now()
             state.isLogin = true
         },
         cleanAccessToken (state: State) {
             state.accessToken = ''
             state.tokenType = ''
+            state.loginAt = 0
             state.isLogin = false
+        },
+        setOpenId (state: State, openId: string): void {
+            state.openId = openId
+        },
+        setUserInfo (state: State, payload: BaseInfo) {
+            state.user = payload
+        },
+        cleanUserInfo (state: State) {
+            state.user = {} as BaseInfo
         }
     },
     actions: {},
@@ -47,7 +69,9 @@ export default createStore<State>({
         auth,
         refresh
     },
-    plugins: [createPersistedState()]
+    plugins: [createPersistedState({
+        key: PERSISTED_KEY
+    })]
 })
 
 // import { useStore } from '@/store'

src/store/modules/auth.ts

@@ -1,5 +1,5 @@
 import { auth } from '@/api'
-import { State } from '@/store'
+import { PERSISTED_KEY, State } from '@/store'
 import { LoginData } from '@/types/auth'
 import { Module } from 'vuex'
 
@@ -14,6 +14,7 @@ export default {
             return new Promise((resolve, reject) => {
                 auth.login(payload).then(response => {
                     commit('setAccessToken', response, { root: true })
+                    // 刷新用户中心页面
                     commit('refresh/setUser', true, { root: true })
                     resolve(response)
                 }).catch(error => {
@@ -24,6 +25,8 @@ export default {
         Logout ({ commit }) {
             return new Promise((resolve) => {
                 commit('cleanAccessToken', null, { root: true })
+                commit('cleanUserInfo', null, { root: true })
+                localStorage.removeItem(PERSISTED_KEY)
                 resolve(true)
             })
         }