From e080a1a7593e83a49d623ffdd452fd0e1c617889 Mon Sep 17 00:00:00 2001 From: Derick Montague Date: Wed, 4 Dec 2019 16:30:08 -0600 Subject: Add login and logout functionality - Add AuthenticationStore - Add ability to login and logout - Add route navigation guard - Add login styles - Add temporary authentication for api call - Add Login directory - Add index.js In order to login a .env.development.local file that contains BASE_URL="https:// or " Signed-off-by: Derick Montague Change-Id: I88b93e287e66f4bae82a1ec2934cdef12d78264e --- src/store/api.js | 15 ++---- src/store/index.js | 4 +- .../modules/Authentication/AuthenticanStore.js | 56 ++++++++++++++++++++++ 3 files changed, 64 insertions(+), 11 deletions(-) create mode 100644 src/store/modules/Authentication/AuthenticanStore.js (limited to 'src/store') diff --git a/src/store/api.js b/src/store/api.js index d40ad0ad..39a6355c 100644 --- a/src/store/api.js +++ b/src/store/api.js @@ -2,15 +2,9 @@ import Axios from "axios"; const api = Axios.create(); -// TODO: this is a temporary workaround until -// authentication with login is working -const username = process.env.VUE_APP_USERNAME; -const password = process.env.VUE_APP_PASSWORD; -if (username && password) { - api.defaults.auth = {}; - api.defaults.auth.username = username; - api.defaults.auth.password = password; -} +// TODO: Permanent authentication solution +// Using defaults to set auth for sending +// auth object in header export default { get(path) { @@ -30,5 +24,6 @@ export default { }, all(promises) { return Axios.all(promises); - } + }, + defaults: api.defaults }; diff --git a/src/store/index.js b/src/store/index.js index af06a471..b4be6ccd 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,8 +1,9 @@ import Vue from "vue"; import Vuex from "vuex"; -import LocalUserManagementStore from "./modules/AccessControl/LocalUserMangementStore"; import GlobalStore from "./modules/GlobalStore"; +import AuthenticationStore from "./modules/Authentication/AuthenticanStore"; +import LocalUserManagementStore from "./modules/AccessControl/LocalUserMangementStore"; Vue.use(Vuex); @@ -12,6 +13,7 @@ export default new Vuex.Store({ actions: {}, modules: { global: GlobalStore, + authentication: AuthenticationStore, localUsers: LocalUserManagementStore } }); diff --git a/src/store/modules/Authentication/AuthenticanStore.js b/src/store/modules/Authentication/AuthenticanStore.js new file mode 100644 index 00000000..828c3cc8 --- /dev/null +++ b/src/store/modules/Authentication/AuthenticanStore.js @@ -0,0 +1,56 @@ +import api from "../../api"; + +const AuthenticationStore = { + namespaced: true, + state: { + auth: {}, + status: "", + token: sessionStorage.getItem("token") || "" + }, + getters: { + authStatus: state => state.status, + isLoggedIn: state => !!state.token + }, + mutations: { + authRequest(state) { + state.status = "loading"; + }, + authSuccess(state, token, auth) { + state.status = "authenicated"; + state.auth = auth; + state.token = token; + }, + authError(state) { + state.status = "error"; + }, + logout(state) { + state.status = ""; + state.token = ""; + } + }, + actions: { + login({ commit }, auth) { + commit("authRequest"); + return api + .post("/login", auth) + .then(response => { + const token = response.data.token; + sessionStorage.setItem("token", token); + api.defaults.auth = auth; // TODO Permanent Solution + commit("authSuccess", token, auth); + }) + .catch(error => { + commit("authError"); + sessionStorage.removeItem("token"); + throw new Error(error); + }); + }, + logout({ commit }) { + commit("logout"); + sessionStorage.removeItem("token"); + api.defaults.auth = {}; // Permanent solution + } + } +}; + +export default AuthenticationStore; -- cgit v1.2.3