feat(catalog): add KYC teaser section to supplier InfoPanel
All checks were successful
Build Docker Image / build (push) Successful in 4m6s

- Add KYC teaser info section (companyType, registrationYear, status, sourcesCount)
- Use mock data for now (backend integration TBD)
- Add 'open-kyc' emit for full profile navigation
- Add kycProfileUuid field to InfoEntity type
- Add i18n translations for both RU and EN
This commit is contained in:
Ruslan Bakiev
2026-01-27 12:30:00 +07:00
parent f269c0daf0
commit 7f8a148aa7
4 changed files with 81 additions and 3 deletions

View File

@@ -53,6 +53,51 @@
</button>
</div>
<!-- KYC Teaser Section (for supplier) -->
<section v-if="entityType === 'supplier' && kycTeaser" class="bg-white/5 rounded-lg p-3">
<h3 class="text-sm font-semibold text-white/80 mb-2 flex items-center gap-2">
<Icon name="lucide:shield-check" size="16" />
{{ $t('catalog.info.kycTeaser') }}
</h3>
<div class="flex flex-col gap-2 text-sm">
<!-- Company Type -->
<div class="flex items-center justify-between">
<span class="text-white/60">{{ $t('catalog.info.companyType') }}</span>
<span class="text-white">{{ kycTeaser.companyType }}</span>
</div>
<!-- Registration Year -->
<div class="flex items-center justify-between">
<span class="text-white/60">{{ $t('catalog.info.registrationYear') }}</span>
<span class="text-white">{{ kycTeaser.registrationYear }}</span>
</div>
<!-- Status -->
<div class="flex items-center justify-between">
<span class="text-white/60">{{ $t('catalog.info.status') }}</span>
<span :class="kycTeaser.isActive ? 'text-success' : 'text-error'">
{{ kycTeaser.isActive ? $t('catalog.info.active') : $t('catalog.info.inactive') }}
</span>
</div>
<!-- Sources Count -->
<div class="flex items-center justify-between">
<span class="text-white/60">{{ $t('catalog.info.sourcesCount') }}</span>
<span class="text-white">{{ kycTeaser.sourcesCount }}</span>
</div>
</div>
<!-- View Full Profile Button -->
<button
class="btn btn-ghost btn-xs text-primary mt-3 w-full"
@click="emit('open-kyc', entity?.kycProfileUuid)"
>
<Icon name="lucide:external-link" size="14" />
{{ $t('catalog.info.viewFullKyc') }}
</button>
</section>
<!-- Products Section (for hub/supplier) -->
<section v-if="entityType === 'hub' || entityType === 'supplier'">
<h3 class="text-sm font-semibold text-white/80 mb-2 flex items-center gap-2">
@@ -166,6 +211,7 @@ const emit = defineEmits<{
'open-info': [type: InfoEntityType, uuid: string]
'select-product': [uuid: string | null]
'update:current-tab': [tab: string]
'open-kyc': [uuid: string | undefined]
}>()
const { t } = useI18n()
@@ -226,6 +272,18 @@ const formatPrice = (price: number | string) => {
return new Intl.NumberFormat('ru-RU').format(num)
}
// Mock KYC teaser data (will be replaced with real data later)
const kycTeaser = computed(() => {
if (props.entityType !== 'supplier') return null
// Mock data for now
return {
companyType: 'ООО',
registrationYear: 2018,
isActive: true,
sourcesCount: 3
}
})
// Handlers for selecting related items
const onProductSelect = (product: InfoProductItem) => {
emit('select-product', product.uuid)