29 lines
928 B
Vue
29 lines
928 B
Vue
<script setup lang="ts">
|
|
import { defineProps } from 'vue'
|
|
import type { MenuItemModel } from '@/utils/interfaces'
|
|
import { DotOutline } from '@/utils/icons';
|
|
|
|
defineProps({
|
|
item: {
|
|
type: Object as () => MenuItemModel,
|
|
required: true
|
|
},
|
|
isMenuSelected: {
|
|
type: Boolean,
|
|
required: true
|
|
},
|
|
isChildren: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<RouterLink :to="item.href"
|
|
:class="[isMenuSelected ? 'bg-primary-500 text-white font-bold' : 'font-semibold text-aside hover:bg-primary-100 hover:text-gray-900', 'group w-full flex items-center pl-2 py-2 text-xs rounded-lg']">
|
|
<embed :src="isChildren ? DotOutline : item.icon" type="image/svg+xml"
|
|
:class="[isMenuSelected ? 'text-white' : 'text-aside group-hover:text-gray-900', 'mr-3 flex-shrink-0 h-6 w-6']">
|
|
{{ item.name }}
|
|
</RouterLink>
|
|
</template> |