diff --git a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/_store.js b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/_store.js index 921b33f7..81783a82 100644 --- a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/_store.js +++ b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/_store.js @@ -21,12 +21,12 @@ export default new Vuex.Store({ state: { config: {}, watchlist: [], - watchlistId: null, loading: false, authToken: sessionStorage.getItem('token'), loggedIn: !!sessionStorage.getItem('token'), isTeamer: JSON.parse(sessionStorage.getItem('isTeamer')), memberId: JSON.parse(sessionStorage.getItem('memberId')), + memberName: sessionStorage.getItem('memberName'), countries: [], abilities: [], timeFrames: [], @@ -44,31 +44,30 @@ export default new Vuex.Store({ }, initWatchlist (state, list = null) { if (list) { - sessionStorage.setItem('watchlist', JSON.stringify(list.items)); - sessionStorage.setItem('watchlistId', JSON.stringify(list.id)); + sessionStorage.setItem('watchlist', JSON.stringify(list)); } else if (!sessionStorage.getItem('watchlist')) { - sessionStorage.setItem('watchlist', JSON.stringify([])); - sessionStorage.setItem('watchlistId', JSON.stringify(null)); + sessionStorage.setItem('watchlist', JSON.stringify({ id: null, items: [] })); } state.watchlist = JSON.parse(sessionStorage.getItem('watchlist')); - state.watchlistId = JSON.parse(sessionStorage.getItem('watchlistId')); }, watchlistToggle (state, uid) { - let list = state.watchlist; + let list = state.watchlist.items; let watchlistIndex = list.indexOf(uid); if (watchlistIndex === -1) { list.push(uid) } else { list.splice(watchlistIndex, 1) } - state.watchlist = list; - sessionStorage.setItem('watchlist', JSON.stringify(list)); - if (state.watchlistId) { - axios({ - url: '/api/watchlists/' + state.watchlistId, - data: state.watchlist, - method: 'put' + state.watchlist.items = list; + sessionStorage.setItem('watchlist', JSON.stringify(state.watchlist)); + + if (state.loggedIn) { + const client = axios.create({ + headers: { + 'X-Auth-Token': state.authToken + } }); + client.put('/api/watchlists/' + state.watchlist.id, state.watchlist); } }, loginSuccess (state, token) { @@ -84,9 +83,12 @@ export default new Vuex.Store({ state.isTeamer = false; state.teamerId = null; state.authToken = null; + state.watchlist = { id: null, items: [] }; sessionStorage.removeItem('token'); sessionStorage.removeItem('isTeamer'); sessionStorage.removeItem('memberId'); + sessionStorage.removeItem('memberName'); + sessionStorage.removeItem('watchlist'); }, alert (state, payload) { state.message.text = payload.message; @@ -96,9 +98,11 @@ export default new Vuex.Store({ state.isTeamer = true; sessionStorage.setItem('isTeamer', JSON.stringify(true)); }, - setMember (state, memberId) { - state.memberId = memberId; - sessionStorage.setItem('memberId', memberId); + setMember (state, member) { + state.memberId = member.id; + state.memberName = member.name; + sessionStorage.setItem('memberId', member.id); + sessionStorage.setItem('memberName', member.name); }, loadingBegin (state) { state.loading = true; @@ -134,7 +138,7 @@ export default new Vuex.Store({ withCredentials: true }).then((response) => { let memberId = parseInt(response.data.member_id); - commit('setMember', memberId); + commit('setMember', { id: memberId, name: response.data.member_name }); if (response.data.watchlist) { commit('initWatchlist', response.data.watchlist); } @@ -154,6 +158,7 @@ export default new Vuex.Store({ }); }, logout({ commit, state }) { + commit('loadingBegin'); return axios({ url: '/api/logout', headers: { @@ -161,6 +166,14 @@ export default new Vuex.Store({ } }).then(() => { commit('logout'); + commit('loadingFinish'); + }).catch((error) => { + commit('alert', { + message: 'Der Logout ist fehlgeschlagen :(', + class: 'alert-danger' + }); + commit('loadingFinish'); + throw error; }); }, resetPassword({ commit }, email) { @@ -204,10 +217,10 @@ export default new Vuex.Store({ }, getters: { watchlistCount: state => { - return state.watchlist.length; + return state.watchlist.items.length; }, onWatchlist: (state) => (uid) => { - return state.watchlist.indexOf(uid) !== -1; + return state.watchlist.items.indexOf(uid) !== -1; }, authToken: state => { return state.authToken; diff --git a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/Watchlist.vue b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/Watchlist.vue index 707dbfa1..8b7a9662 100644 --- a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/Watchlist.vue +++ b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/Watchlist.vue @@ -88,7 +88,7 @@ }); }, mounted () { - this.watchlist = this.$store.state.watchlist; + this.watchlist = this.$store.state.watchlist.items; Vue.nextTick(() => { this.loadList(); })