fabric_trade/fabric_trade_admin
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

some edits

Browse Source
This commit is contained in:
mohmdsdg
2026-08-06 17:12:28 +03:30
parent 4411443fba
commit 43ebebd8c4
41 changed files with 5887 additions and 865 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/icons/AdminIcon.vue
+68 -206
View File
@@ -1,211 +1,73 @@
<script setup lang="ts">
defineProps<{
name: string
size?: number
}>()
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-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>
<svg
:width="size ?? 20"
:height="size ?? 20"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.75"
stroke-linecap="round"
stroke-linejoin="round"
aria-hidden="true"
>
<!-- home -->
<template v-if="name === 'home'">
<path d="M3 10.5 12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1z" />
</template>
<!-- orders -->
<template v-else-if="name === 'orders'">
<rect x="5" y="3" width="14" height="18" rx="2" />
<path d="M9 8h6M9 12h6M9 16h4" />
</template>
<!-- customers -->
<template v-else-if="name === 'customers'">
<circle cx="9" cy="8" r="3" />
<circle cx="17" cy="9" r="2.5" />
<path d="M3 20c0-3 2.7-5 6-5s6 2 6 5M14 20c0-2 1.5-3.5 3.5-3.5" />
</template>
<!-- products -->
<template v-else-if="name === 'products'">
<path d="M12 2 22 7v10l-10 5L2 17V7z" />
<path d="M12 22V12M2 7l10 5 10-5" />
</template>
<!-- catalogs -->
<template v-else-if="name === 'catalogs'">
<circle cx="12" cy="12" r="9" />
<path d="M12 3a15 15 0 0 1 0 18M12 3a15 15 0 0 0 0 18" />
</template>
<!-- companies -->
<template v-else-if="name === 'companies'">
<rect x="4" y="4" width="7" height="16" rx="1" />
<rect x="13" y="8" width="7" height="12" rx="1" />
<path d="M7 8h1M7 12h1M7 16h1M16 12h1M16 16h1" />
</template>
<!-- checks -->
<template v-else-if="name === 'checks'">
<rect x="3" y="6" width="18" height="12" rx="2" />
<path d="M3 10h18M7 14h4" />
</template>
<!-- cash -->
<template v-else-if="name === 'cash'">
<rect x="2" y="6" width="20" height="12" rx="2" />
<circle cx="12" cy="12" r="3" />
</template>
<!-- shipping -->
<template v-else-if="name === 'shipping'">
<path d="M3 6h11v8H3zM14 10h4l3 4v2h-7z" />
<circle cx="7" cy="18" r="2" />
<circle cx="18" cy="18" r="2" />
</template>
<!-- reports -->
<template v-else-if="name === 'reports'">
<path d="M4 20V10M10 20V4M16 20v-8M22 20H2" />
</template>
<!-- settings -->
<template v-else-if="name === 'settings'">
<circle cx="12" cy="12" r="3" />
<path
d="M12 2v2M12 20v2M4.2 4.2l1.4 1.4M18.4 18.4l1.4 1.4M2 12h2M20 12h2M4.2 19.8l1.4-1.4M18.4 5.6l1.4-1.4"
/>
</template>
<!-- users -->
<template v-else-if="name === 'users'">
<circle cx="10" cy="9" r="3" />
<path d="M3 20c0-3 2.2-5 7-5M16 11l2 2 4-4" />
</template>
<!-- logout -->
<template v-else-if="name === 'logout'">
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9" />
</template>
<!-- search -->
<template v-else-if="name === 'search'">
<circle cx="11" cy="11" r="7" />
<path d="m20 20-3.5-3.5" />
</template>
<!-- bell -->
<template v-else-if="name === 'bell'">
<path d="M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9" />
<path d="M13.73 21a2 2 0 0 1-3.46 0" />
</template>
<!-- message -->
<template v-else-if="name === 'message'">
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
<path d="M8 10h8M8 14h5" />
</template>
<!-- calendar -->
<template v-else-if="name === 'calendar'">
<rect x="3" y="5" width="18" height="16" rx="2" />
<path d="M3 10h18M8 3v4M16 3v4" />
</template>
<!-- menu -->
<template v-else-if="name === 'menu'">
<path d="M4 6h16M4 12h16M4 18h16" />
</template>
<!-- filter -->
<template v-else-if="name === 'filter'">
<path d="M4 6h16M7 12h10M10 18h4" />
</template>
<!-- more -->
<template v-else-if="name === 'more'">
<circle cx="12" cy="6" r="1.5" fill="currentColor" stroke="none" />
<circle cx="12" cy="12" r="1.5" fill="currentColor" stroke="none" />
<circle cx="12" cy="18" r="1.5" fill="currentColor" stroke="none" />
</template>
<!-- chevron-left -->
<template v-else-if="name === 'chevron-left'">
<path d="m15 6-6 6 6 6" />
</template>
<!-- chevron-down -->
<template v-else-if="name === 'chevron-down'">
<path d="m6 9 6 6 6-6" />
</template>
<!-- print -->
<template v-else-if="name === 'print'">
<path d="M7 8V3h10v5M7 17H5a2 2 0 0 1-2-2v-5h18v5a2 2 0 0 1-2 2h-2M7 14h10v7H7z" />
</template>
<!-- sms -->
<template v-else-if="name === 'sms'">
<rect x="3" y="5" width="18" height="14" rx="2" />
<path d="M7 9h10M7 13h6" />
</template>
<!-- check -->
<template v-else-if="name === 'check'">
<path d="M20 6 9 17l-5-5" />
</template>
<!-- cart -->
<template v-else-if="name === 'cart'">
<circle cx="9" cy="20" r="1" />
<circle cx="18" cy="20" r="1" />
<path d="M2 2h3l2.5 12H19l2-8H6" />
</template>
<!-- file -->
<template v-else-if="name === 'file'">
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
<path d="M14 2v6h6" />
</template>
<!-- wallet -->
<template v-else-if="name === 'wallet'">
<rect x="2" y="6" width="20" height="14" rx="2" />
<path d="M16 12h2" />
</template>
<!-- check-circle -->
<template v-else-if="name === 'check-circle'">
<circle cx="12" cy="12" r="9" />
<path d="m8 12 3 3 5-5" />
</template>
<!-- phone -->
<template v-else-if="name === 'phone'">
<path
d="M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11 11 0 0 0 3.5.55 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A16 16 0 0 1 3 5a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .55 3.5 1 1 0 0 1-.25 1z"
/>
</template>
<!-- id-card -->
<template v-else-if="name === 'id-card'">
<rect x="3" y="5" width="18" height="14" rx="2" />
<circle cx="9" cy="12" r="2" />
<path d="M14 10h5M14 14h5" />
</template>
<!-- lock -->
<template v-else-if="name === 'lock'">
<rect x="5" y="11" width="14" height="10" rx="2" />
<path d="M8 11V8a4 4 0 1 1 8 0v3" />
</template>
<!-- eye -->
<template v-else-if="name === 'eye'">
<path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z" />
<circle cx="12" cy="12" r="3" />
</template>
<!-- eye-off -->
<template v-else-if="name === 'eye-off'">
<path d="M10.6 10.6a2.5 2.5 0 0 0 3.5 3.5" />
<path d="M6.7 6.7C4.6 8.2 3 10.2 2 12s3.5 7 10 7c1.8 0 3.4-.4 4.8-1.1" />
<path d="M17.3 17.3C19.4 15.8 21 13.8 22 12s-3.5-7-10-7c-1.8 0-3.4.4-4.8 1.1" />
<path d="M2 2l20 20" />
</template>
<!-- user -->
<template v-else-if="name === 'user'">
<circle cx="12" cy="8" r="4" />
<path d="M4 20c0-4 3.6-7 8-7s8 3 8 7" />
</template>
<!-- building -->
<template v-else-if="name === 'building'">
<rect x="5" y="3" width="14" height="18" rx="1" />
<path d="M9 7h1M9 11h1M9 15h1M14 7h1M14 11h1M14 15h1" />
</template>
<!-- trash -->
<template v-else-if="name === 'trash'">
<path d="M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3" />
</template>
<!-- default -->
<template v-else>
<circle cx="12" cy="12" r="9" />
</template>
</svg>
<BasicIcon
:icon="iconKey"
:size="size"
:stroke-width="strokeWidth"
:color="color"
/>
</template>