9 changed files with 192 additions and 119 deletions
@ -1,104 +1,13 @@ |
|||
import {createStore} from 'vuex' |
|||
import createPersistedState from "vuex-persistedstate"; |
|||
import axios, {AxiosResponse} from "axios"; |
|||
import qs from 'qs' |
|||
|
|||
import user from './modules/user' |
|||
import backend from './modules/backend' |
|||
|
|||
export default createStore({ |
|||
state: { |
|||
userStatus: false, |
|||
user: {}, |
|||
serverStatus: false |
|||
}, |
|||
mutations: { |
|||
auth_success(state, user) { |
|||
state.userStatus = true |
|||
state.user = user |
|||
}, |
|||
auth_error(state) { |
|||
state.userStatus = false |
|||
}, |
|||
logout(state) { |
|||
state.userStatus = false |
|||
state.serverStatus = false |
|||
state.user = {} |
|||
}, |
|||
serverConnected(state, status) { |
|||
state.serverStatus = status |
|||
} |
|||
}, |
|||
actions: { |
|||
login({commit}, user: { username: string, password: string }) { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'post', |
|||
url: '/auth/login', |
|||
data: qs.stringify({...user}) |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
commit("auth_success", resp.data.user); |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
commit('auth_error') |
|||
reject(err) |
|||
}) |
|||
}) |
|||
}, |
|||
logout({commit}) { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'post', |
|||
url: '/auth/logout' |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
commit("logout"); |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
commit("logout"); |
|||
commit('auth_error') |
|||
reject(err) |
|||
}) |
|||
}) |
|||
}, |
|||
getCurrentUser({commit}) { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'get', |
|||
url: '/auth/current_user' |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
commit("auth_success", resp.data); |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
commit('auth_error') |
|||
reject(err) |
|||
}) |
|||
}) |
|||
}, |
|||
updateUser({commit}, user) { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'put', |
|||
url: `/api/user/${user._id}`, |
|||
data: qs.stringify({...user}) |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
commit("auth_success", resp.data); |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
reject(err) |
|||
}) |
|||
}) |
|||
} |
|||
}, |
|||
modules: {}, |
|||
getters: { |
|||
isLoggedIn: state => state.userStatus, |
|||
user: state => state.user, |
|||
serverStatus: state => state.serverStatus |
|||
modules: { |
|||
user, |
|||
backend |
|||
}, |
|||
plugins: [createPersistedState()] |
|||
}) |
|||
|
|||
@ -0,0 +1,15 @@ |
|||
import {Module, Mutation, VuexModule} from 'vuex-module-decorators' |
|||
|
|||
@Module |
|||
export default class Backend extends VuexModule { |
|||
private serverStatus = false |
|||
|
|||
get currentStatus() { |
|||
return this.serverStatus |
|||
} |
|||
|
|||
@Mutation |
|||
private serverConnected(status: boolean) { |
|||
this.serverStatus = status |
|||
} |
|||
} |
|||
@ -0,0 +1,116 @@ |
|||
import {Action, Module, Mutation, VuexModule} from 'vuex-module-decorators' |
|||
import axios, {AxiosResponse} from "axios"; |
|||
import qs from "qs"; |
|||
|
|||
export interface UserInterface { |
|||
_id: string, |
|||
username: string, |
|||
email: string, |
|||
password: string, |
|||
registered: Date, |
|||
lastLogin: Date, |
|||
} |
|||
|
|||
@Module |
|||
export default class User extends VuexModule { |
|||
private user = <UserInterface>{} |
|||
private userStatus = false |
|||
|
|||
get currentUser() { |
|||
return this.user |
|||
} |
|||
|
|||
get isLoggedIn() { |
|||
return this.userStatus |
|||
} |
|||
|
|||
@Mutation |
|||
private auth_success(user: UserInterface) { |
|||
this.user = user; |
|||
this.userStatus = true; |
|||
} |
|||
|
|||
@Mutation |
|||
private auth_error() { |
|||
this.userStatus = false; |
|||
} |
|||
|
|||
@Mutation |
|||
private auth_logout() { |
|||
this.user = <UserInterface>{} |
|||
this.userStatus = false |
|||
} |
|||
|
|||
@Action |
|||
private login(user: UserInterface) { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'POST', |
|||
url: '/auth/login', |
|||
data: qs.stringify({...user}) |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
this.context.commit('auth_success', resp.data.user) |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
this.context.commit('auth_error') |
|||
reject(err) |
|||
}) |
|||
}) |
|||
} |
|||
|
|||
@Action |
|||
private logout() { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'POST', |
|||
url: '/auth/logout' |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
this.context.commit("auth_logout"); |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
reject(err) |
|||
}) |
|||
}) |
|||
} |
|||
|
|||
@Action |
|||
private getCurrentUser() { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'GET', |
|||
url: '/auth/current_user' |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
this.context.commit("auth_success", resp.data); |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
this.context.commit('auth_error') |
|||
reject(err) |
|||
}) |
|||
}) |
|||
} |
|||
|
|||
@Action |
|||
private updateUser(user: UserInterface) { |
|||
return new Promise((resolve, reject) => { |
|||
axios({ |
|||
method: 'PUT', |
|||
url: `/api/user/${user._id}`, |
|||
data: qs.stringify({...user}) |
|||
}) |
|||
.then((resp: AxiosResponse) => { |
|||
this.context.commit("auth_success", resp.data); |
|||
resolve(resp) |
|||
}) |
|||
.catch((err: Error) => { |
|||
reject(err) |
|||
}) |
|||
}) |
|||
} |
|||
} |
|||
|
|||
Loading…
Reference in new issue