77 lines
2.2 KiB
Vue
77 lines
2.2 KiB
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
|
|
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
name: string
|
|
size?: number
|
|
strokeWidth?: number
|
|
color?: string | null
|
|
}>(),
|
|
{
|
|
size: 20,
|
|
strokeWidth: 1.5,
|
|
color: null,
|
|
},
|
|
)
|
|
|
|
/** Short admin names → Vuesax linear keys from BasicPacks icons.json */
|
|
const ICON_MAP: Record<string, string> = {
|
|
home: 'vuesax-linear:home',
|
|
orders: 'vuesax-linear:document-text',
|
|
customers: 'vuesax-linear:profile-2user',
|
|
products: 'vuesax-linear:box-1',
|
|
catalogs: 'vuesax-linear:category',
|
|
companies: 'vuesax-linear:buildings',
|
|
checks: 'vuesax-linear:card-receive',
|
|
cash: 'vuesax-linear:money-4',
|
|
shipping: 'vuesax-linear:truck-time',
|
|
reports: 'vuesax-linear:chart-2',
|
|
settings: 'vuesax-linear:setting-2',
|
|
users: 'vuesax-linear:people',
|
|
logout: 'vuesax-linear:logout',
|
|
search: 'vuesax-linear:search-normal',
|
|
bell: 'vuesax-linear:notification',
|
|
message: 'vuesax-linear:message',
|
|
calendar: 'vuesax-linear:calendar',
|
|
menu: 'vuesax-linear:menu',
|
|
filter: 'vuesax-linear:filter',
|
|
more: 'vuesax-linear:more',
|
|
'chevron-left': 'vuesax-linear:arrow-left-1',
|
|
'chevron-right': 'vuesax-linear:arrow-right-1',
|
|
/** RTL back — same direction as user app IconChevronBack */
|
|
'chevron-back': 'vuesax-linear:arrow-right-1',
|
|
'chevron-down': 'vuesax-linear:arrow-down',
|
|
print: 'vuesax-linear:printer',
|
|
sms: 'vuesax-linear:sms',
|
|
check: 'vuesax-linear:tick-circle',
|
|
cart: 'vuesax-linear:bag-2',
|
|
file: 'vuesax-linear:document-text',
|
|
wallet: 'vuesax-linear:wallet',
|
|
'check-circle': 'vuesax-linear:tick-circle',
|
|
phone: 'vuesax-linear:call',
|
|
'id-card': 'vuesax-linear:personalcard',
|
|
lock: 'vuesax-linear:lock',
|
|
eye: 'vuesax-linear:eye',
|
|
'eye-off': 'vuesax-linear:eye-slash',
|
|
user: 'vuesax-linear:profile-circle',
|
|
building: 'vuesax-linear:building',
|
|
trash: 'vuesax-linear:trash',
|
|
}
|
|
|
|
const iconKey = computed(() => {
|
|
if (props.name.startsWith('vuesax-linear:')) return props.name
|
|
return ICON_MAP[props.name] ?? 'vuesax-linear:info-circle'
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<BasicIcon
|
|
:icon="iconKey"
|
|
:size="size"
|
|
:stroke-width="strokeWidth"
|
|
:color="color"
|
|
/>
|
|
</template>
|