From 1eab4c586f4ffa712ba87795820a0430e9ca64b9 Mon Sep 17 00:00:00 2001 From: Denys Seredenko Date: Wed, 4 Jan 2023 00:25:46 +0100 Subject: [PATCH] * refactoring and fixes by login feature: #4 --- package-lock.json | 23 ++- package.json | 3 +- src/App.vue | 2 +- src/authentication/AuthHelper.js | 21 +-- src/components/Navbar.vue | 233 ++++++++++++++++--------------- src/router/index.js | 11 +- src/store/index.js | 4 +- src/store/keycloak.module.js | 18 +-- src/views/AboutView.vue | 32 ++--- src/views/AdministrationView.vue | 32 ++--- src/views/ArbeitenView.vue | 32 ++--- src/views/ContactView.vue | 32 ++--- src/views/ContractsView.vue | 10 +- src/views/HomeView.vue | 32 ++--- src/views/SupportView.vue | 32 ++--- 15 files changed, 262 insertions(+), 255 deletions(-) diff --git a/package-lock.json b/package-lock.json index 774cc3b..a72422e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,8 @@ "vue": "^3.2.45", "vue-i18n": "^9.2.2", "vue-router": "^4.1.6", - "vuex": "^4.0.2" + "vuex": "^4.0.2", + "vuex-persistedstate": "^4.1.0" }, "devDependencies": { "@rushstack/eslint-patch": "^1.1.4", @@ -3108,7 +3109,6 @@ "version": "4.2.2", "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz", "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -6913,6 +6913,12 @@ "node": ">=8" } }, + "node_modules/shvl": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/shvl/-/shvl-2.0.3.tgz", + "integrity": "sha512-V7C6S9Hlol6SzOJPnQ7qzOVEWUQImt3BNmmzh40wObhla3XOYMe4gGiYzLrJd5TFa+cI2f9LKIRJTTKZSTbWgw==", + "deprecated": "older versions vulnerable to prototype pollution" + }, "node_modules/signal-exit": { "version": "3.0.7", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz", @@ -7434,6 +7440,19 @@ "vue": "^3.0.2" } }, + "node_modules/vuex-persistedstate": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-4.1.0.tgz", + "integrity": "sha512-3SkEj4NqwM69ikJdFVw6gObeB0NHyspRYMYkR/EbhR0hbvAKyR5gksVhtAfY1UYuWUOCCA0QNGwv9pOwdj+XUQ==", + "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.", + "dependencies": { + "deepmerge": "^4.2.2", + "shvl": "^2.0.3" + }, + "peerDependencies": { + "vuex": "^3.0 || ^4.0.0-rc" + } + }, "node_modules/walker": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.8.tgz", diff --git a/package.json b/package.json index 393063d..ec2f531 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,8 @@ "vue": "^3.2.45", "vue-i18n": "^9.2.2", "vue-router": "^4.1.6", - "vuex": "^4.0.2" + "vuex": "^4.0.2", + "vuex-persistedstate": "^4.1.0" }, "devDependencies": { "@rushstack/eslint-patch": "^1.1.4", diff --git a/src/App.vue b/src/App.vue index b3f75b6..13ee9ea 100644 --- a/src/App.vue +++ b/src/App.vue @@ -4,4 +4,4 @@ import { RouterView } from 'vue-router' \ No newline at end of file + diff --git a/src/authentication/AuthHelper.js b/src/authentication/AuthHelper.js index 8cc8a73..bbaa464 100644 --- a/src/authentication/AuthHelper.js +++ b/src/authentication/AuthHelper.js @@ -3,13 +3,13 @@ import store from '../store' let keycloak = null -export function keycloakSetup() { +export async function keycloakSetup() { keycloak = new Keycloak({ url: 'https://auth.denysoft.eu/', realm: 'FST', clientId: 'frontend' }) - return keycloak + await keycloak .init({ onLoad: 'login-required', checkLoginIframe: false @@ -32,23 +32,10 @@ export function keycloakSetup() { .catch(function () { alert('failed to initialize') }) -} -export function login() { - keycloak.login() + store.commit('initKeycloak', keycloak) + store.commit('isAnonym', false) } export function getKeycloak() { return keycloak } - -export function isVerwaltung() { - return keycloak.hasRealmRole('verwaltung') -} - -export function isEmployee() { - return keycloak.hasRealmRole('employee') -} - -export function isAdmin() { - return keycloak.hasRealmRole('admin') -} diff --git a/src/components/Navbar.vue b/src/components/Navbar.vue index e37bbf7..c0f0a6b 100644 --- a/src/components/Navbar.vue +++ b/src/components/Navbar.vue @@ -1,114 +1,119 @@ - - \ No newline at end of file + + diff --git a/src/router/index.js b/src/router/index.js index 0090ef4..637510d 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -33,8 +33,8 @@ const router = createRouter({ } }, { - path: '/support', - name: 'support', + path: '/administration', + name: 'administration', // this page is lazy-loaded when the route is visited. component: () => import('../views/AdministrationView.vue'), meta: { @@ -87,12 +87,17 @@ const router = createRouter({ } ] }) - router.beforeEach(async (to, from, next) => { + //if user was logged in but reloaded page. So we have all data, need only restore it + if (store.state.keycloak.keycloak !== null && getKeycloak() === null) { + await keycloakSetup() + } + if (to.meta.requiresAuth === true) { if (getKeycloak() === null) { await keycloakSetup() store.commit('initKeycloak', getKeycloak()) + store.commit('isAnonym', false) } if (!getKeycloak().authenticated) { next('/forbidden') diff --git a/src/store/index.js b/src/store/index.js index 11df0d5..2e1e805 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -2,11 +2,13 @@ import { createStore } from 'vuex' import moduleA from './moduleA.module' import moduleB from './moduleB.module' import keycloak from './keycloak.module' +import createPersistedState from 'vuex-persistedstate' export default createStore({ modules: { keycloak: keycloak, a: moduleA, b: moduleB - } + }, + plugins: [createPersistedState()] }) diff --git a/src/store/keycloak.module.js b/src/store/keycloak.module.js index 1b54d48..fbec10d 100644 --- a/src/store/keycloak.module.js +++ b/src/store/keycloak.module.js @@ -1,20 +1,22 @@ export default { state: () => ({ - keycloak: null + keycloak: null, + isAnonym: true }), mutations: { initKeycloak(state, data) { state.keycloak = data + }, + isAnonym(state, data) { + state.isAnonym = data } }, actions: { - initKeycloak({ commit }) { - commit('initKeycloak') - } - }, - getters: { - getKeycloak(state) { - return state.keycloak + initKeycloak({ commit }, data) { + commit('initKeycloak', data) + }, + isAnonym({ commit }, data) { + commit('isAnonym', data) } } } diff --git a/src/views/AboutView.vue b/src/views/AboutView.vue index 36cabee..3da3d34 100644 --- a/src/views/AboutView.vue +++ b/src/views/AboutView.vue @@ -1,17 +1,15 @@ - - - - \ No newline at end of file + + + + diff --git a/src/views/AdministrationView.vue b/src/views/AdministrationView.vue index 30aeb81..703d40e 100644 --- a/src/views/AdministrationView.vue +++ b/src/views/AdministrationView.vue @@ -1,17 +1,15 @@ - - - - \ No newline at end of file + + + + diff --git a/src/views/ArbeitenView.vue b/src/views/ArbeitenView.vue index 9b24506..ee90120 100644 --- a/src/views/ArbeitenView.vue +++ b/src/views/ArbeitenView.vue @@ -1,17 +1,15 @@ - - - - \ No newline at end of file + + + + diff --git a/src/views/ContactView.vue b/src/views/ContactView.vue index 5c84ee3..35a0133 100644 --- a/src/views/ContactView.vue +++ b/src/views/ContactView.vue @@ -1,17 +1,15 @@ - - - - \ No newline at end of file + + + + diff --git a/src/views/ContractsView.vue b/src/views/ContractsView.vue index 124c4b3..3d71846 100644 --- a/src/views/ContractsView.vue +++ b/src/views/ContractsView.vue @@ -1,17 +1,15 @@ - \ No newline at end of file + diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue index 317e6ed..c88bbc9 100644 --- a/src/views/HomeView.vue +++ b/src/views/HomeView.vue @@ -1,17 +1,15 @@ - - - - \ No newline at end of file + + + + diff --git a/src/views/SupportView.vue b/src/views/SupportView.vue index 48df283..0de9430 100644 --- a/src/views/SupportView.vue +++ b/src/views/SupportView.vue @@ -1,17 +1,15 @@ - - - - \ No newline at end of file + + + +