71 lines
2.1 KiB
Vue
71 lines
2.1 KiB
Vue
<template>
|
||
<div v-if="kycProfileUuid && companyData" class="space-y-2">
|
||
<div class="flex items-center gap-2">
|
||
<span class="badge badge-outline badge-sm">{{ companyData.companyType || 'Компания' }}</span>
|
||
<span v-if="companyData.registrationYear" class="text-xs text-base-content/60">
|
||
с {{ companyData.registrationYear }} г.
|
||
</span>
|
||
<span v-if="companyData.isActive" class="badge badge-success badge-xs">Активна</span>
|
||
</div>
|
||
<div v-if="companyData.sourcesCount" class="text-xs text-base-content/60">
|
||
{{ companyData.sourcesCount }} {{ pluralize(companyData.sourcesCount, 'источник', 'источника', 'источников') }} данных
|
||
</div>
|
||
</div>
|
||
<div v-else-if="kycProfileUuid && pending" class="text-xs text-base-content/60">
|
||
Загрузка данных...
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { GetKycProfileTeaserDocument } from '~/composables/graphql/public/kyc-generated'
|
||
|
||
const props = defineProps<{
|
||
kycProfileUuid?: string | null
|
||
}>()
|
||
|
||
const { execute } = useGraphQL()
|
||
|
||
const companyData = ref<{
|
||
companyType?: string | null
|
||
registrationYear?: number | null
|
||
isActive?: boolean | null
|
||
sourcesCount?: number | null
|
||
} | null>(null)
|
||
|
||
const pending = ref(false)
|
||
|
||
const loadCompanyData = async () => {
|
||
if (!props.kycProfileUuid) return
|
||
pending.value = true
|
||
try {
|
||
const data = await execute(
|
||
GetKycProfileTeaserDocument,
|
||
{ profileUuid: props.kycProfileUuid },
|
||
'public',
|
||
'kyc'
|
||
)
|
||
companyData.value = data?.kycProfileTeaser || null
|
||
} catch (error) {
|
||
console.error('Error loading company data:', error)
|
||
} finally {
|
||
pending.value = false
|
||
}
|
||
}
|
||
|
||
watch(() => props.kycProfileUuid, (uuid) => {
|
||
if (uuid) {
|
||
loadCompanyData()
|
||
} else {
|
||
companyData.value = null
|
||
}
|
||
}, { immediate: true })
|
||
|
||
const pluralize = (n: number, one: string, few: string, many: string) => {
|
||
const mod10 = n % 10
|
||
const mod100 = n % 100
|
||
if (mod10 === 1 && mod100 !== 11) return one
|
||
if (mod10 >= 2 && mod10 <= 4 && (mod100 < 10 || mod100 >= 20)) return few
|
||
return many
|
||
}
|
||
</script>
|