66 lines
1.6 KiB
Vue
66 lines
1.6 KiB
Vue
<template>
|
|
<q-item clickable tag="a" target="self" :to="{ name: link }" v-if="isGranted">
|
|
<q-item-section v-if="icon" avatar>
|
|
<q-icon :name="icon" />
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<q-item-label>{{ realTitle }}</q-item-label>
|
|
<!--<q-item-label caption>
|
|
{{ caption }}
|
|
</q-item-label>-->
|
|
</q-item-section>
|
|
</q-item>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { useStore } from 'vuex';
|
|
import { computed, defineComponent } from 'vue';
|
|
import { hasPermissions } from 'src/utils/permission';
|
|
|
|
export default defineComponent({
|
|
name: 'EssentialLink',
|
|
props: {
|
|
title: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
caption: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
link: {
|
|
type: String,
|
|
default: 'dashboard',
|
|
},
|
|
icon: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
permissions: {
|
|
default: () => Array<string>(),
|
|
type: Array as () => Array<string>,
|
|
},
|
|
},
|
|
|
|
setup(props) {
|
|
let title = computed<string>(() => {
|
|
if (props.title.includes('loadFromStore')) {
|
|
const store = useStore();
|
|
|
|
const startIndex = props.title.indexOf('(') + 1;
|
|
const endIndex = props.title.indexOf(')');
|
|
const substring = props.title.substring(startIndex, endIndex).replace(/"/g, '');
|
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
|
return <string>store.getters[substring];
|
|
}
|
|
return props.title;
|
|
});
|
|
|
|
const isGranted = computed(() => hasPermissions(props.permissions));
|
|
|
|
return { realTitle: title, isGranted };
|
|
},
|
|
});
|
|
</script>
|