Fixed Typings

This commit is contained in:
Tim Gröger 2020-10-31 19:33:05 +01:00
parent a1f1be7fb6
commit ef71481931
7 changed files with 74 additions and 63 deletions

View File

@ -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();

View File

@ -1,20 +1,22 @@
<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-icon :name="icon"/>
</q-item-section>
<q-item-section>
<q-item-label>{{ realTitle }}</q-item-label>
<q-item-label caption>
{{ caption }}
{{ permissions }}
</q-item-label>
</q-item-section>
</q-item>
</template>
<script lang="ts">
import { computed, 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: 'EssentialLink',
@ -37,10 +39,13 @@ export default defineComponent({
icon: {
type: String,
default: ''
},
permissions: {
default: undefined
}
},
setup(props, { root }) {
setup(props, {root}) {
let title = computed<string>(() => {
if (props.title.includes('loadFromStore')) {
const startIndex = props.title.indexOf('(') + 1;
@ -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>

View File

@ -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>

View File

@ -14,7 +14,7 @@
<q-toolbar-title>
<q-avatar>
<img src="logo.svg" />
<img src="logo.svg"/>
</q-avatar>
<span class="gt-xs">
Flaschengeist
@ -28,10 +28,10 @@
: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()" />
<q-btn flat round dense icon="mdi-exit-to-app" @click="logout()"/>
</q-toolbar>
</q-header>
@ -51,10 +51,10 @@
:title="link.title"
:link="link.link"
:icon="link.icon"
v-if="hasPermissions(link.permissions)"
:permissions="link.permissions"
/>
</q-list>
<q-separator />
<q-separator/>
<!-- Plugin functions -->
<!-- <router-view name="plugin-nav" /> -->
@ -65,7 +65,7 @@
:title="link.title"
:link="link.link"
:icon="link.icon"
v-if="hasPermissions(link.permissions)"
:permissions="link.permissions"
/>
</q-list>
@ -81,7 +81,7 @@
/>
</div>
<q-separator />
<q-separator/>
<essential-link
v-for="(link, index) in links"
@ -89,12 +89,12 @@
:title="link.title"
:link="link.link"
:icon="link.icon"
v-if="hasPermissions(link.permissions)"
:permissions="link.permissions"
/>
</q-drawer>
<q-page-container>
<router-view />
<router-view/>
</q-page-container>
</q-layout>
</template>
@ -102,11 +102,11 @@
<script lang="ts">
import EssentialLink from 'components/navigation/EssentialLink.vue';
import ShortCutLink from 'components/navigation/ShortCutLink.vue';
import { Screen } from 'quasar';
import { defineComponent, ref, computed } from '@vue/composition-api';
import { Store } from 'vuex';
import { StateInterface } from 'src/store';
import { FG_Plugin } from 'src/plugins';
import {Screen} from 'quasar';
import {defineComponent, ref, computed} from '@vue/composition-api';
import {Store} from 'vuex';
import {StateInterface} from 'src/store';
import {FG_Plugin} from 'src/plugins';
const links = [
{
@ -140,7 +140,7 @@ declare module 'vue/types/vue' {
export default defineComponent({
name: 'MainLayout',
components: { EssentialLink, ShortCutLink },
components: {EssentialLink, ShortCutLink},
setup(_, ctx) {
const leftDrawer = ref(false);
@ -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,
hasPermissions
logout
};
}
});

View File

@ -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) {
if (permissions) {
return permissions.every(permission => {
return root.$store.getters['user/permissions'].includes(permission)
})
}
return true
}
return { checkMain, mainRoutes, hasPermissions };
return { checkMain, mainRoutes };
}
});
</script>

View File

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

View File

@ -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) {
if (permissions) {
return permissions.every(permission => {
return root.$store.getters['user/permissions'].includes(permission)
})
}
return true
}
return { checkMain, mainRoutes, hasPermissions};
return { checkMain, mainRoutes};
}
});
</script>