import { ActionContext , MutationPayload , Store } from 'vuex' ; import { AuthUser , VueAuthStore } from '../../interfaces' ; import { IVueAuthOptions } from '../auth' ; export type AuthVuexState = { token ? : string ; user ? : AuthUser ; } ; export default class StoreVuex extends VueAuthStore { private readonly module ? : string ; private readonly ACTION_SET_TOKEN = 'SET_TOKEN' ; private readonly ACTION_SET_USER = 'SET_USER' ; constructor ( Vue , options ) { super ( Vue , options ) ; if ( ! this . Vue . store ) { throw Error ( '[vue-auth-plugin] vuex is a required dependency if you want to use "vuex" as storage' ) ; } this . store = this . Vue . store as Store < any > ; this . module = this . options . vuexStoreSpace ; this . createVueAuthStore ( ) ; this . initVue ( ) ; } public getRoles ( ) { return this . store . getters ?. [ `${ this . module }/getRoles` ] ; } public getToken ( ) { return this . store . getters ?. [ `${ this . module }/getToken` ] ; } public getUser ( ) { return this . store . getters ?. [ `${ this . module }/getUser` ] ; } public setToken ( token ) { this . store . dispatch ( `${ this . module }/setToken` , token ) ; } public setUser ( user ) { this . store . dispatch ( `${ this . module }/setUser` , user ) ; } private createVueAuthStore ( ) { const { rolesVar } = this . options ; const module = { namespaced : true , state : { token : this . options . Vue . $data . token , user : this . options . Vue . $data . user , } as AuthVuexState , mutations : { SET_TOKEN : ( state , token ) => { state . token = token ; } , SET_USER : ( state , user ) => { state . user = user ; } , } , actions : { setToken : ( actionContext , token ) => { actionContext . commit ( this . ACTION_SET_TOKEN , token ) ; } , setUser : ( actionContext , user ) => { actionContext . commit ( this . ACTION_SET_USER , user ) ; } , } , getters : { getToken : ( state ) : string | undefined => { return state . token ; } , getUser : ( state ) : AuthUser | undefined => { return state . user ; } , getRoles : ( state ) : string [ ] => { const user = state . user ; return user && rolesVar && user [ rolesVar ] ; } , } , } ; if ( this . module ) { this . store . registerModule ( this . module , module ) ; } this . store . subscribe ( ( mutation ) => { const { payload , type } = mutation ; if ( type === `${ this . module }/${ this . ACTION_SET_TOKEN }` && payload !== this . options . Vue . $data . token ) { this . options . Vue . $data . token = payload ; } else if ( type === `${ this . module }/${ this . ACTION_SET_USER }` && payload !== this . options . Vue . $data . user ) { this . options . Vue . $data . user = payload ; } } ) ; } }