diff --git a/frontend/src/store/store.js b/frontend/src/store/store.js index b97bf47a1..b59f2ceb8 100644 --- a/frontend/src/store/store.js +++ b/frontend/src/store/store.js @@ -1,13 +1,13 @@ import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) -import axios from 'axios'; -import VueCookies from 'vue-cookies'; -import router from '../routes/router.js'; +import router from '../routes/router.js' +import loginAPI from '../apis/loginAPI' +// TODO make persistent: https://translate.google.de/translate?hl=de&sl=en&u=https://sandulat.com/safely-persisting-vuex-store-in-local-storage/&prev=search&pto=aue export const store = new Vuex.Store({ state: { - path: 'http://192.168.0.89/account/', + /*path: 'http://192.168.0.89/account/', is_auth: false, is_admin: false, active: false, @@ -16,77 +16,65 @@ export const store = new Vuex.Store({ name:"", email:"" }, - dataLogout: {"session_id": -127182} + dataLogout: {"session_id": -127182}*/ + session_id: null, + email: null }, - mutations: { - isActive(state) { - //("Im Store PRÜFEN PRÜFEN" ) - return true + // Retrieve a state variable + getters: { + /*isActive: (state, getters) => { + return state.active; + }*/ + }, + // Syncronous mutation of the state + mutations: { + email: (state, email) => { + console.log('mutation: email') + state.email = email }, - login (state, logindata) { - //console.log("Im Store LOGIN() start " ) - //console.log("logon state =>", state ) - //console.log("logon TEST =>", logindata ) - axios.post("http://localhost/login_api/unsecureLogin", logindata).then((ldata) => { - - //console.log("Im Store LOGIN() axios then.statusText ", ldata.statusText); - if (ldata.statusText === "OK") { - console.log("STORE login() ldatasession_id", ldata.data.session_id) - state.is_auth = true - state.active = true - $cookies.set('gdd_is_auth','true'); - $cookies.set('gdd_session_id', ldata.data.session_id); - $cookies.set('gdd_email',logindata.email); - state.user.email = logindata.email - - //console.log("STORE login() to " + state.is_auth) - router.push('/KontoOverview') - - } - - return true - }, (error) => { - console.log(error); - }); - //console.log("STORE login() from" + state.is_auth) - //if (state.is_auth) { - // state.is_auth = false - // state.active = false - //} else { - // state.is_auth = true - // state.active = true - //} - // console.log("STORE login() to " + state.is_auth) + session_id: (state,session_id) => { + console.log('mutation: session_id') + state.session_id = session_id }, - creatUser( state, formdata) { - //console.log("Im Store creatUser() start " ) - axios.post("http://localhost/login_api/createUser", formdata).then((ldata) => { - - console.log("Im Store creatUser() axios then ", ldata); - // this.ldata = ldata.data; - return true - - }, (error) => { - console.log(error); - }); + }, + // Asyncronous actions - used for api calls + actions: { + login: async ({ dispatch, commit }, data) => { + console.log('action: login') + const result = await loginAPI.login(data.email,data.password) + console.log(result) + if( result.success ){ + // We are not logged in, we need to do that manually. + // TODO show user a success message + commit('session_id', result.result.data.session_id) + commit('email', data.email) + router.push('/KontoOverview') + } else { + // Register failed, we perform a logout + dispatch('logout') + } + }, + createUser: async ({ dispatch }, data) => { + console.log('action: createUser') + const result = await loginAPI.create(data.email,data.first_name,data.last_name,data.password) + if( result.success ){ + // TODO We are not logged in, we need to do that manually. + // TODO show user a success message + } else { + // Register failed, we perform a logout + dispatch('logout') + } }, - logout(state){ - axios.post("http://localhost/login_api/logout", this.dataLogout).then((ldata) => { - - //console.log("Im Store logout() axios then ", ldata); - // this.ldata = ldata.data; - //return true - state.is_auth = false - state.is_admin = false - state.active = false - $cookies.set('gdd_is_auth','false'); - $cookies.remove('gdd_email'); - $cookies.remove('gdd_session_id'); - router.push('/Landing') - }, (error) => { - console.log(error); - }); - + logout: async ({ commit , state }) => { + // Are we actually logged in? + if(state.session_id){ + const result = await loginAPI.logout(state.session_id) + // The result can be error, but thats ok with us + } + + commit('session_id', null) + commit('email', null) + router.push('/landing') } } }) \ No newline at end of file diff --git a/frontend/src/views/Landing.vue b/frontend/src/views/Landing.vue index 856565a25..72f0cb88f 100644 --- a/frontend/src/views/Landing.vue +++ b/frontend/src/views/Landing.vue @@ -81,7 +81,7 @@ - Anmelden + Anmelden @@ -114,25 +114,12 @@ export default { }, methods: { login() { - if (this.lemail != '' || this.lpwd != '') { - //console.log("landingpage login() ") - //console.log("landingpage login() lemail ", this.lemail) - //console.log("landingpage login() lpwd ", this.lpwd) - this.$store.commit('login', {"email": this.lemail, "password": this.lpwd}) - } - - //this.$router.push('/KontoOverview') - + //if (this.lemail !== '' || this.lpwd !== '') { // TODO this should be done via form validation + this.$store.dispatch('login', {email: this.lemail, password: this.lpwd}) + //} }, - creatUser() { - console.log("landingpage creatUser() ") - console.log("landingpage login() remail ", this.remail) - console.log("landingpage login() rfname ", this.rfname) - console.log("landingpage login() rlname ", this.rlname) - console.log("landingpage login() rpwd ", this.rpwd) - this.$store.commit('creatUser', {"email":this.remail, "first_name":this.rfname, "last_name":this.rlname , "emailType": 2, "password":this.rpwd}) - //this.$router.push('/KontoOverview') - + createUser() { + this.$store.dispatch('createUser', {email:this.remail, first_name:this.rfname, last_name:this.rlname, password:this.rpwd}) }, loginAsAdmin () { console.log("app.vue admin login(): " + this.$store.state.is_admin) diff --git a/frontend/src/views/Layout/DashboardLayout.vue b/frontend/src/views/Layout/DashboardLayout.vue index 72793376d..d05f49b7e 100755 --- a/frontend/src/views/Layout/DashboardLayout.vue +++ b/frontend/src/views/Layout/DashboardLayout.vue @@ -88,7 +88,7 @@ components: { DashboardNavbar, ContentFooter, - DashboardContent, + // DashboardContent, FadeTransition }, methods: { @@ -100,7 +100,7 @@ }, logout(){ //console.log("DashboardLayout.vue user logout() : ") - this.$store.commit('logout') + this.$store.dispatch('logout') } }, mounted() { diff --git a/frontend/src/views/Layout/DashboardNavbar.vue b/frontend/src/views/Layout/DashboardNavbar.vue index a373a058c..b6b31cef4 100755 --- a/frontend/src/views/Layout/DashboardNavbar.vue +++ b/frontend/src/views/Layout/DashboardNavbar.vue @@ -41,7 +41,7 @@ Image placeholder - {{this.$store.state.user.email}} + {{this.$store.state.email}} @@ -84,9 +84,9 @@ import { BaseNav, Modal } from '@/components'; export default { components: { - CollapseTransition, + // CollapseTransition, BaseNav, - Modal + // Modal }, props: { type: { @@ -121,7 +121,7 @@ export default { }, logout(){ //console.log("DashboardNavbar.vue user logout() : ") - this.$store.commit('logout') + this.$store.dispatch('logout') } } };