Fixed Typings

src/boot/login.ts

@@ -27,13 +27,15 @@ export default boot<Store<StateInterface>>(({ router, store }) => {
             to.matched.every((record: RouteRecord) => {
               if (!('meta' in record) || !('permissions' in record.meta))
                 return true;
-              const test = record.meta.permissions.every((permission: string) => {
+              if (record.meta) {
+                if ((<{permissions: FG.Permission[]}>record.meta).permissions) {
+                  return (<{permissions: FG.Permission[]}>record.meta).permissions.every((permission: string) => {
                     return permissions.includes(
                       permission
                     );
                   })
-              console.log('permissions', test)
+                }
-              return test
+              }
             })
           ) {
             next();

src/components/navigation/EssentialLink.vue

@@ -1,5 +1,5 @@
 <template>
-  <q-item clickable tag="a" target="self" :to="{ name: link }">
+  <q-item clickable tag="a" target="self" :to="{ name: link }" v-if="hasPermissions">
     <q-item-section v-if="icon" avatar>
       <q-icon :name="icon"/>
     </q-item-section>
@@ -7,7 +7,7 @@
     <q-item-section>
       <q-item-label>{{ realTitle }}</q-item-label>
       <q-item-label caption>
-        {{ caption }}
+        {{ permissions }}
       </q-item-label>
     </q-item-section>
   </q-item>
@@ -15,6 +15,8 @@
 
 <script lang="ts">
 import {computed, defineComponent} from '@vue/composition-api';
+import {Store} from 'vuex'
+import {StateInterface} from "src/store";
 
 export default defineComponent({
   name: 'EssentialLink',
@@ -37,6 +39,9 @@ export default defineComponent({
     icon: {
       type: String,
       default: ''
+    },
+    permissions: {
+      default: undefined
     }
   },
 
@@ -53,7 +58,18 @@ export default defineComponent({
       }
       return props.title;
     });
-    return { realTitle: title };
+
+    const hasPermissions = computed(() => {
+      let permissions = props.permissions
+      if (permissions) {
+        return (<string[]>permissions).every(permission => {
+          return (<{'user/permissions': string[]}>(<Store<StateInterface>>root.$store).getters)['user/permissions'].includes(permission)
+        })
+      }
+      return true
+    })
+
+    return {realTitle: title, hasPermissions};
   }
 });
 </script>

src/components/navigation/ShortCutLink.vue

@@ -1,9 +1,11 @@
 <template>
-  <q-btn flat dense :icon="icon" :to="{ name: link }" />
+  <q-btn flat dense :icon="icon" :to="{ name: link }" v-if="hasPermissions"/>
 </template>
 
 <script lang="ts">
-import { defineComponent } from '@vue/composition-api';
+import {computed, defineComponent} from '@vue/composition-api';
+import {Store} from "vuex";
+import {StateInterface} from "src/store";
 export default defineComponent({
   name: 'ShortCutLink',
   props: {
@@ -14,7 +16,23 @@ export default defineComponent({
     icon: {
       required: true,
       type: String
+    },
+    permissions: {
+      default: undefined
     }
+  },
+  setup(props, {root}) {
+
+    const hasPermissions = computed(() => {
+      let permissions = props.permissions
+      if (permissions) {
+        return (<string[]>permissions).every(permission => {
+          return (<{'user/permissions': string[]}>(<Store<StateInterface>>root.$store).getters)['user/permissions'].includes(permission)
+        })
+      }
+      return true
+    })
+    return {hasPermissions}
   }
 });
 </script>

src/layouts/MainLayout.vue

@@ -28,7 +28,7 @@
             :key="'shortcut' + index"
             :link="shortcut.link"
             :icon="shortcut.icon"
-            v-if="hasPermissions(shortcut.permissions)"
+            :permissions="shortcut.permissions"
           />
         </div>
         <q-btn flat round dense icon="mdi-exit-to-app" @click="logout()"/>
@@ -51,7 +51,7 @@
           :title="link.title"
           :link="link.link"
           :icon="link.icon"
-          v-if="hasPermissions(link.permissions)"
+          :permissions="link.permissions"
         />
       </q-list>
       <q-separator/>
@@ -65,7 +65,7 @@
           :title="link.title"
           :link="link.link"
           :icon="link.icon"
-          v-if="hasPermissions(link.permissions)"
+          :permissions="link.permissions"
         />
       </q-list>
 
@@ -89,7 +89,7 @@
         :title="link.title"
         :link="link.link"
         :icon="link.icon"
-        v-if="hasPermissions(link.permissions)"
+        :permissions="link.permissions"
       />
     </q-drawer>
 
@@ -151,6 +151,7 @@ export default defineComponent({
       })
     );
     const leftDrawerMini = ref(false);
+
     function leftDrawerClicker() {
       if (leftDrawerMini.value) {
         leftDrawerMini.value = false;
@@ -184,15 +185,6 @@ export default defineComponent({
         });
     }
 
-    function hasPermissions(permissions: FG.Permission[] | undefined) {
-      if (permissions) {
-        return permissions.every(permission => {
-          return ctx.root.$store.getters['user/permissions'].includes(permission)
-        })
-      }
-      return true
-    }
-
     return {
       leftDrawerOpen,
       leftDrawerMini,
@@ -200,8 +192,7 @@ export default defineComponent({
       links,
       pluginChildLinks,
       shortcuts,
-      logout,
+      logout
-      hasPermissions
     };
   }
 });

src/plugins/balance/pages/MainPage.vue

@@ -13,7 +13,7 @@
               :title="route.title"
               :icon="route.icon"
               :link="route.name"
-              v-if="hasPermissions(route.permissions)"
+              :permissions="route.meta.permissions"
             />
           </q-list>
         </q-card-section>
@@ -34,15 +34,7 @@ export default defineComponent({
     const checkMain = computed(() => {
       return root.$route.matched.length == 2;
     });
-    function hasPermissions(permissions: FG.Permission[] | undefined) {
+    return { checkMain, mainRoutes };
-      if (permissions) {
-        return permissions.every(permission => {
-          return root.$store.getters['user/permissions'].includes(permission)
-        })
-      }
-      return true
-    }
-    return { checkMain, mainRoutes, hasPermissions };
   }
 });
 </script>

src/plugins/user/components/settings/Sessions.vue

@@ -66,7 +66,7 @@ export default defineComponent({
         ? 'mdi-linux'
         : platform == 'windows'
         ? 'mdi-microsoft-windows'
-        : platform == 'apple'
+        : platform == 'macos'
         ? 'mdi-apple'
         : 'mdi-help';
     }

src/plugins/user/pages/MainPage.vue

@@ -13,7 +13,7 @@
               :title="route.title"
               :icon="route.icon"
               :link="route.name"
-              v-if="hasPermissions(route.permissions)"
+              :permissions="route.meta.permissions"
             />
           </q-list>
         </q-card-section>
@@ -34,15 +34,7 @@ export default defineComponent({
     const checkMain = computed(() => {
       return root.$route.matched.length == 2;
     });
-    function hasPermissions(permissions: FG.Permission[] | undefined) {
+    return { checkMain, mainRoutes};
-      if (permissions) {
-        return permissions.every(permission => {
-          return root.$store.getters['user/permissions'].includes(permission)
-        })
-      }
-      return true
-    }
-    return { checkMain, mainRoutes, hasPermissions};
   }
 });
 </script>