src/boot/login.ts

@@ -8,13 +8,6 @@ export default boot<Store<StateInterface>>(({ router, store }) => {
     const session = store.state.session.currentSession;
 
     if (to.name != 'login') {
-      if (!session || session.expires <= new Date()) {
-        store.dispatch('session/logout').catch(error => {
-          console.warn(error);
-        });
-        return;
-      }
-
       if (
         to.matched.every((record: RouteRecord) => {
           if (!('meta' in record) || !('permissions' in record.meta))
@@ -30,6 +23,20 @@ export default boot<Store<StateInterface>>(({ router, store }) => {
           }
         })
       ) {
+        if (
+          !to.matched.every((record: RouteRecord) => {
+            if (!('meta' in record) || !('permissions' in record.meta))
+              return true;
+            else return false;
+          })
+        ) {
+          if (!session || session.expires <= new Date()) {
+            store.dispatch('session/logout').catch(error => {
+              console.warn(error);
+            });
+            return;
+          }
+        }
         next();
       } else {
         next({ name: 'login', query: { redirect: to.fullPath } });

src/pages/about/About.vue

@@ -5,11 +5,11 @@
     v-if="$route.name == 'about' || $route.name == 'about_out'"
   >
     <div class="fit row justify-center content-center items-center">
-        <q-img
-          :src="$q.dark.isActive? 'logo.svg' : 'logo-dark.svg'"
-          class="col-12 q-ma-md"
-          style="min-width: 200px; max-width: 400px"
-        />
+      <q-img
+        :src="$q.dark.isActive? 'logo.svg' : 'logo-dark.svg'"
+        class="col-12 q-ma-md"
+        style="min-width: 200px; max-width: 400px"
+      />
       <div class="col-12 text-h4 text-center q-pa-sm">
         Flaschengeist
         <div class="text-caption">
@@ -17,16 +17,16 @@
         </div>
       </div>
       <div class="col-12 text-center q-ma-sm" style="max-width: 600px;">
-            Flaschengeist ist ein dynamischen Managementsystem für Studentenclubs.
-            Es ermöglicht unter anderem die Mitgliederverwaltung, Dienstverwaltung,
-            Arbeitsgruppenverwaltung und vieles meher. Es kann fast alles ermöglich
-            werden, wenn ein Plugin dafür geschrieben wird. Jeder Club hat die
-            Möglichkeit sein eigenes Flaschengeist zu hosten. Ziel ist später
-            Clubübergreifend dezentralisiert miteinander zu arbeiten.
+        Flaschengeist ist ein dynamischen Managementsystem für Studentenclubs.
+        Es ermöglicht unter anderem die Mitgliederverwaltung, Dienstverwaltung,
+        Arbeitsgruppenverwaltung und vieles meher. Es kann fast alles ermöglich
+        werden, wenn ein Plugin dafür geschrieben wird. Jeder Club hat die
+        Möglichkeit sein eigenes Flaschengeist zu hosten. Ziel ist später
+        Clubübergreifend dezentralisiert miteinander zu arbeiten.
       </div>
 
 
-    <q-separator />
+      <q-separator/>
       <div class="col-12 text-h6 q-pa-sm" v-if="$route.name == 'about'">
         Geladene Plugins:
       </div>
@@ -44,32 +44,32 @@
           </q-chip>
         </q-chip>
       </div>
-      <q-separator />
+      <q-separator/>
       <div class="col-12 text-h6 q-pa-sm">
         Entwickler:
       </div>
 
-    <div
-      class="fit row inline wrap justify-around items-start content-start"
-    >
-      <developer
-        v-for="(developer, index) in developers"
-        :key="'dev' + index"
-        class="col-xs-12 col-md-5 col-lg-3 q-ma-sm"
-        :firstname="developer.firstname"
-        :lastname="developer.lastname"
-        :job="developer.job"
-        :club="developer.club"
-        :description="developer.description"
-        :pic="developer.pic"
-      />
-    </div>
+      <div
+        class="fit row inline wrap justify-around items-start content-start"
+      >
+        <developer
+          v-for="(developer, index) in developers"
+          :key="'dev' + index"
+          class="col-xs-12 col-md-5 col-lg-3 q-ma-sm"
+          :firstname="developer.firstname"
+          :lastname="developer.lastname"
+          :job="developer.job"
+          :club="developer.club"
+          :description="developer.description"
+          :pic="developer.pic"
+        />
+      </div>
     </div>
   </q-page>
 </template>
 
 <script lang="ts">
-import { defineComponent } from '@vue/composition-api';
+import {defineComponent} from '@vue/composition-api';
 import Developer from 'components/about/Developer.vue';
 
 const developers = [
@@ -105,9 +105,9 @@ const developers = [
 ];
 export default defineComponent({
   // name: 'PageName'
-  components: { Developer },
+  components: {Developer},
   setup() {
-    return { developers };
+    return {developers};
   }
 });
 </script>

src/router/routes.ts

@@ -22,17 +22,18 @@ const routes: RouteConfig[] = [
     path: '/main',
     redirect: 'dashboard',
     component: () => import('layouts/MainLayout.vue'),
+    meta: { permissions: ['user']},
     children: [
       {
         name: 'dashboard',
         path: 'dashboard',
-        meta: { permission: 'user' },
+        meta: { permissions: ['user'] },
         component: () => import('pages/Dashboard.vue')
       },
       {
         name: 'about',
         path: 'about',
-        meta: { permission: 'user' },
+        meta: { permissions: ['user'] },
         component: () => import('pages/about/About.vue')
       }
     ]