forked from verdnatura/salix-front
52 lines
1.3 KiB
Vue
52 lines
1.3 KiB
Vue
<script setup>
|
|
import { computed } from 'vue';
|
|
import { useI18n } from 'vue-i18n';
|
|
|
|
const { t, te } = useI18n();
|
|
|
|
const props = defineProps({
|
|
item: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
const itemComputed = computed(() => {
|
|
const item = JSON.parse(JSON.stringify(props.item));
|
|
const [, , section] = item.title.split('.');
|
|
|
|
if (!te(item.title)) item.title = t(`globals.pageTitles.${section}`);
|
|
return item;
|
|
});
|
|
</script>
|
|
<template>
|
|
<QItem
|
|
active-class="bg-vn-hover"
|
|
class="min-height"
|
|
:to="{ name: itemComputed.name }"
|
|
clickable
|
|
v-ripple
|
|
>
|
|
<QItemSection avatar v-if="itemComputed.icon">
|
|
<QIcon :name="itemComputed.icon" />
|
|
</QItemSection>
|
|
<QItemSection avatar v-if="!itemComputed.icon">
|
|
<QIcon name="disabled_by_default" />
|
|
</QItemSection>
|
|
<QItemSection>
|
|
{{ t(itemComputed.title) }}
|
|
<QTooltip v-if="item.keyBinding">
|
|
{{ 'Ctrl + Alt + ' + item?.keyBinding?.toUpperCase() }}
|
|
</QTooltip>
|
|
</QItemSection>
|
|
<QItemSection side>
|
|
<slot name="side" :item="itemComputed" />
|
|
</QItemSection>
|
|
</QItem>
|
|
</template>
|
|
<style lang="scss" scoped>
|
|
.q-item {
|
|
min-height: 5vh;
|
|
}
|
|
</style>
|