Merge branch 'feature/myep-cookie-auth' into develop

This commit is contained in:
Björn Fromme
2021-11-03 17:03:12 +01:00
parent c1da7dde8b
commit c9a2b5ee08
9 changed files with 202 additions and 220 deletions
@@ -63,10 +63,10 @@
<script>
import Vue from 'vue'
import { mapState, mapMutations } from 'vuex'
import axios from 'axios'
import flatpickr from 'flatpickr'
import { German } from 'flatpickr/dist/l10n/de'
import FormGroup from './components/FormGroup'
import authenticatedClient from './api'
export default {
components: {
@@ -102,14 +102,14 @@
...mapMutations(['alert', 'beginLoading', 'endLoading']),
loadFormOptions () {
this.beginLoading();
return authenticatedClient({
url: '/api/countries',
}).then(response => {
this.countries = response.data
}).catch(error => {
}).finally(() => {
this.endLoading()
});
return axios({
url: '/api/countries'
}).then(response => {
this.countries = response.data
}).catch(error => {
}).finally(() => {
this.endLoading()
});
},
save () {
this.formErrors = {};
@@ -59,13 +59,12 @@
...mapGetters(['isLoggedIn', 'isTeamer'])
},
mounted () {
if (this.isLoggedIn) {
this.$router.replace({ name: 'address' })
}
this.$store.dispatch('init').then(() => {
if (this.isLoggedIn) {
this.$router.replace({ name: 'address' })
}
})
},
created () {
this.$store.dispatch('init')
}
}
</script>
@@ -171,8 +171,7 @@
import ServiceSelect from './components/ServiceSelect'
import ServicesOverview from './components/ServicesOverview'
import TransportationSelect from './components/TransportationSelect'
import authenticatedClient from './api'
import axios from 'axios'
import {mapGetters, mapMutations, mapState} from 'vuex'
Vue.use(VueScrollTo)
@@ -225,7 +224,7 @@
...mapMutations(['alert', 'beginLoading', 'endLoading']),
loadFormOptions () {
this.beginLoading();
return authenticatedClient({
return axios({
url: '/api/countries',
}).then(response => {
this.countries = response.data
@@ -236,70 +235,65 @@
},
loadBookingData () {
this.beginLoading('Lade Reise- und Buchungsdaten...')
return authenticatedClient.get(`/api/booking/${this.bookingId}`)
.then(response => {
this.bookingData = response.data.bookingData;
this.participantData = response.data.participantData;
this.travelData = response.data.travelData;
})
.catch(() => {
throw new Error('Reise- und Buchungsdaten konnten nicht geladen werden.');
})
.finally(() => {
this.endLoading()
})
return axios({
url: `/api/booking/${this.bookingId}`
}).then(response => {
this.bookingData = response.data.bookingData;
this.participantData = response.data.participantData;
this.travelData = response.data.travelData;
}).catch(() => {
throw new Error('Reise- und Buchungsdaten konnten nicht geladen werden.');
}).finally(() => {
this.endLoading()
})
},
loadEventData () {
this.beginLoading('Lade Vorgangsdaten...')
return authenticatedClient.get(`/api/event/${this.bookingData.bookingNumber}`)
.then(response => {
this.eventData = response.data;
})
.catch(error => {
throw new Error(error.response.data.message);
})
.finally(() => {
this.endLoading()
})
return axios({
url: `/api/event/${this.bookingData.bookingNumber}`
}).then(response => {
this.eventData = response.data;
}).catch(error => {
throw new Error(error.response.data.message);
}).finally(() => {
this.endLoading()
})
},
loadMutableFields () {
this.beginLoading('Lade mögliche Änderungen...')
return authenticatedClient.get(`/api/mutable-fields/${this.travelData.busproId}`)
.then(response => {
this.mutableFields = response.data;
})
.catch(() => {
throw new Error('Mögliche Änderungen konnten nicht geladen werden.');
})
.finally(() => {
this.endLoading()
})
return axios({
url: `/api/mutable-fields/${this.travelData.busproId}`
}).then(response => {
this.mutableFields = response.data;
}).catch(() => {
throw new Error('Mögliche Änderungen konnten nicht geladen werden.');
}).finally(() => {
this.endLoading()
})
},
loadContingents () {
this.beginLoading('Lade Kontingente...')
return authenticatedClient.get(`/api/contingents/${this.travelData.busproId}/${this.bookingData.partnerId}`)
.then(response => {
this.contingents = response.data;
})
.catch(() => {
throw new Error('Kontingente konnten nicht geladen werden.');
})
.finally(() => {
this.endLoading()
})
return axios({
url: `/api/contingents/${this.travelData.busproId}`
}).then(response => {
this.contingents = response.data;
}).catch(() => {
throw new Error('Kontingente konnten nicht geladen werden.');
}).finally(() => {
this.endLoading()
})
},
loadServices () {
this.beginLoading('Lade Leistungen...')
return authenticatedClient.get(`/api/services/${this.travelData.busproId}`)
.then(response => {
this.services = response.data;
})
.catch(() => {
throw new Error('Leistungen konnten nicht geladen werden.');
})
.finally(() => {
this.endLoading()
})
return axios({
url: `/api/services/${this.travelData.busproId}`
}).then(response => {
this.services = response.data;
}).catch(() => {
throw new Error('Leistungen konnten nicht geladen werden.');
}).finally(() => {
this.endLoading()
})
},
getAccommodationLabel (participant) {
if (participant.hasOwnProperty('accommodationId') && participant.accommodationId in this.contingents) {
@@ -429,10 +423,14 @@
return;
}
this.beginLoading()
authenticatedClient.put(`/api/booking/${this.bookingId}`, {
participantData: this.participantData,
selectedTransportations: this.selectedTransportations,
remarks: this.bookingData.remarks
axios({
url: `/api/booking/${this.bookingId}`,
method: 'put',
data: {
participantData: this.participantData,
selectedTransportations: this.selectedTransportations,
remarks: this.bookingData.remarks,
},
}).then(response => {
this.alert({
message: response.data.message,
@@ -51,7 +51,7 @@
<script>
import { mapState, mapMutations } from 'vuex'
import authenticatedClient from './api'
import axios from 'axios'
export default {
data () {
@@ -64,37 +64,41 @@
created () {
this.beginLoading();
return authenticatedClient.get('/api/crm-selections')
.then(response => {
this.crmData = response.data
}).catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
})
}).finally(() => {
this.endLoading()
});
return axios({
url: '/api/crm-selections'
}).then(response => {
this.crmData = response.data
}).catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
})
}).finally(() => {
this.endLoading()
});
},
methods: {
...mapMutations(['beginLoading', 'endLoading', 'alert']),
save () {
this.beginLoading();
return authenticatedClient.put('/api/crm-selections', this.crmData)
.then(() => {
this.alert({
message: 'Die Änderungen wurden gespeichert',
class: 'alert-success'
});
}).catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
this.endLoading();
return axios({
url: '/api/crm-selections',
method: 'put',
data: this.crmData
}).then(() => {
this.alert({
message: 'Die Änderungen wurden gespeichert',
class: 'alert-success'
});
}).catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
this.endLoading();
});
},
hasVisibleSelections (group) {
if (this.hiddenSelectionGroups.indexOf(group.id) !== -1) {
@@ -76,7 +76,7 @@
<script>
import {mapState, mapMutations, mapGetters} from 'vuex'
import authenticatedClient from './api'
import axios from 'axios'
import dayjs from 'dayjs'
import 'dayjs/locale/de'
@@ -96,17 +96,18 @@ import {mapState, mapMutations, mapGetters} from 'vuex'
created () {
this.beginLoading();
return authenticatedClient.get('/api/events')
.then(response => {
this.events = response.data;
}).catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
this.endLoading();
return axios({
url: '/api/events'
}).then(response => {
this.events = response.data;
}).catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
this.endLoading();
});
},
methods: {
...mapMutations(['beginLoading', 'endLoading', 'alert']),
@@ -12,7 +12,7 @@
<script>
import { mapState, mapMutations } from 'vuex'
import authenticatedClient from './api'
import axios from 'axios'
export default {
methods: {
@@ -28,21 +28,23 @@
this.beginLoading();
return authenticatedClient.put('/api/newsletter', data)
.then(() => {
this.alert({
message: 'Die Änderungen wurden gespeichert',
class: 'alert-success'
});
})
.catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
this.endLoading();
return axios({
url: '/api/newsletter',
method: 'put',
data
}).then(() => {
this.alert({
message: 'Die Änderungen wurden gespeichert',
class: 'alert-success'
});
}).catch(error => {
this.alert({
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
this.endLoading();
});
}
},
computed: {
@@ -84,7 +84,7 @@
<script>
import { mapState, mapMutations } from 'vuex'
import authenticatedClient from './api'
import axios from 'axios'
import dayjs from 'dayjs'
import 'dayjs/locale/de'
import FormGroup from './components/FormGroup'
@@ -140,15 +140,16 @@
created () {
this.beginLoading();
return authenticatedClient.get('/api/teamer-data')
.then(response => {
this.abilities = response.data.abilities;
this.timeFrames = response.data.timeFrames;
this.jobProfiles = response.data.jobProfiles;
}).catch(error => {
}).finally(() => {
this.endLoading();
});
return axios({
url: '/api/teamer-data'
}).then(response => {
this.abilities = response.data.abilities;
this.timeFrames = response.data.timeFrames;
this.jobProfiles = response.data.jobProfiles;
}).catch(error => {
}).finally(() => {
this.endLoading();
});
},
computed: {
...mapState(['userData', 'loading'])
@@ -1,26 +0,0 @@
import axios from 'axios'
import createAuthRefreshInterceptor from 'axios-auth-refresh'
const authenticatedClient = axios.create();
const getAccessToken = () => {
return sessionStorage.getItem('myep-auth-token');
};
authenticatedClient.interceptors.request.use(request => {
request.headers['Authorization'] = 'Bearer ' + getAccessToken();
return request;
});
const refreshAuth = failedRequest => axios.post('/api/token_refresh', {
refresh_token: sessionStorage.getItem('myep-refresh-token')
}).then(response => {
sessionStorage.setItem('myep-auth-token', response.data.token);
sessionStorage.setItem('myep-refresh-token', response.data.refresh_token);
failedRequest.response.config.headers['Authorization'] = 'Bearer ' + response.data.token;
return Promise.resolve();
});
createAuthRefreshInterceptor(authenticatedClient, refreshAuth);
export default authenticatedClient
@@ -1,13 +1,12 @@
import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import authenticatedClient from '../api'
const configElement = document.getElementById('appconfig')
const config = JSON.parse(configElement.innerHTML)
axios.defaults.baseURL = config.myEpApiBaseUrl
authenticatedClient.defaults.baseURL = config.myEpApiBaseUrl
axios.defaults.withCredentials = true
Vue.use(Vuex)
@@ -32,8 +31,7 @@ export default new Vuex.Store({
config: {},
loading: false,
statusMessage: '',
authToken: null,
refreshToken: null,
authenticated: false,
userData: defaultUserData,
alert: {
message: '',
@@ -41,12 +39,6 @@ export default new Vuex.Store({
}
},
mutations: {
initSession(state) {
const authToken = sessionStorage.getItem('myep-auth-token');
if (authToken) {
state.authToken = authToken;
}
},
initConfig(state) {
state.config = config
},
@@ -56,18 +48,12 @@ export default new Vuex.Store({
}
state.userData = data
},
login(state, data) {
state.authToken = data.token;
state.refreshToken = data.refresh_token;
sessionStorage.setItem('myep-auth-token', data.token);
sessionStorage.setItem('myep-refresh-token', data.refresh_token);
login(state) {
state.authenticated = true
},
logout(state) {
state.userData = defaultUserData;
state.authToken = null;
state.refreshToken = null;
sessionStorage.removeItem('myep-auth-token');
sessionStorage.removeItem('myep-refresh-token');
state.authenticated = false
},
alert(state, payload) {
state.alert = payload;
@@ -88,18 +74,28 @@ export default new Vuex.Store({
actions: {
init({commit}) {
commit('initConfig');
commit('initSession');
},
login({commit, dispatch}, credentials) {
commit('beginLoading');
return axios({
url: '/api/login_check',
url: '/api/ping',
method: 'get',
}).then(response => {
commit('login')
}).catch(() => {
}).finally(() => {
commit('endLoading');
})
},
login({commit}, credentials) {
commit('beginLoading');
return axios({
url: '/api/login',
method: 'post',
data: {
username: credentials.email,
password: credentials.password
},
withCredentials: true
}).then(response => {
commit('login', response.data);
}).catch(error => {
@@ -116,8 +112,8 @@ export default new Vuex.Store({
logout({commit}) {
commit('beginLoading');
return authenticatedClient({
url: '/api/logout'
return axios({
url: '/api/logout',
}).catch(error => {
}).finally(() => {
commit('logout');
@@ -126,6 +122,7 @@ export default new Vuex.Store({
},
resetPassword({commit}, email) {
commit('beginLoading');
return axios({
url: '/api/reset-password',
data: {email: email},
@@ -138,6 +135,7 @@ export default new Vuex.Store({
},
register({commit}, userData) {
commit('beginLoading');
return axios({
url: '/api/register',
data: userData,
@@ -148,51 +146,56 @@ export default new Vuex.Store({
commit('endLoading');
});
},
loadAddress({commit, state}) {
loadAddress({commit}) {
commit('beginLoading');
return authenticatedClient.get('/api/address')
.then(response => {
commit('setUserData', response.data);
if (response.data.watchlist) {
commit('setWatchlist', response.data.watchlist);
}
}).catch(() => {
commit('alert', {
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
commit('endLoading');
return axios({
url: '/api/address',
method: 'get',
}).then(response => {
commit('setUserData', response.data);
if (response.data.watchlist) {
commit('setWatchlist', response.data.watchlist);
}
}).catch(() => {
commit('alert', {
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
}).finally(() => {
commit('endLoading');
});
},
saveAddress({commit, state}, data) {
commit('beginLoading');
return authenticatedClient.put('/api/address', data)
.then(() => {
commit('alert', {
message: 'Die Änderungen wurden gespeichert',
class: 'alert-success'
});
})
.catch(error => {
if (error.config.status >= 500) {
commit('alert', {
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
} else {
throw error;
}
}).finally(() => {
commit('endLoading');
return axios({
url: '/api/address',
method: 'put',
data
}).then(() => {
commit('alert', {
message: 'Die Änderungen wurden gespeichert',
class: 'alert-success'
});
})
.catch(error => {
if (error.config.status >= 500) {
commit('alert', {
message: 'Es ist ein Fehler aufgetreten :(',
class: 'alert-danger'
});
} else {
throw error;
}
}).finally(() => {
commit('endLoading');
});
}
},
getters: {
onWatchlist: state => uid => state.userData.watchList.indexOf(uid) !== -1,
isLoggedIn: state => !!state.authToken,
isLoggedIn: state => !!state.authenticated,
isTeamer: state => !!state.userData.isTeamer,
isGroupManager: state => !!state.userData.isGroupManager,
}