feat(kyc): comprehensive demo profile page with full business data
All checks were successful
Build Docker Image / build (push) Successful in 4m14s

- Реквизиты: ИНН, КПП, ОГРН, ОКПО, дата регистрации
- Руководство с ФИО и должностью
- Учредители с долями владения и уставным капиталом
- Контакты: адрес, телефон, email, сайт
- Финансовые показатели: выручка, прибыль, активы, сотрудники
- Арбитражные дела: истец/ответчик с суммами
- Виды деятельности (ОКВЭД) с основным и дополнительными
- История изменений в виде timeline
This commit is contained in:
Ruslan Bakiev
2026-01-27 20:35:32 +07:00
parent 02419abdd1
commit 1f996d27e5

View File

@@ -1,6 +1,6 @@
<template>
<div class="min-h-screen bg-base-200">
<div class="container mx-auto px-4 py-8 max-w-4xl">
<div class="container mx-auto px-4 py-8 max-w-5xl">
<!-- Back button -->
<NuxtLink :to="backUrl" class="btn btn-ghost btn-sm mb-4">
<Icon name="lucide:arrow-left" size="16" />
@@ -8,65 +8,322 @@
</NuxtLink>
<!-- Mock KYC Profile (demo mode) -->
<Card v-if="isDemo" padding="md">
<Stack gap="4">
<!-- Header -->
<div class="flex items-start justify-between">
<div v-if="isDemo" class="flex flex-col gap-6">
<!-- Header Card -->
<Card padding="lg">
<div class="flex flex-col md:flex-row md:items-start md:justify-between gap-4">
<div>
<Text weight="semibold" size="lg">{{ $t('kyc.demo.companyName') }}</Text>
<div class="flex items-center gap-2 mt-1">
<span class="badge badge-outline badge-sm">ООО</span>
<span class="text-xs text-base-content/60">с 2018 г.</span>
<span class="badge badge-success badge-xs">{{ $t('catalog.info.active') }}</span>
<div class="flex items-center gap-3">
<div class="w-16 h-16 bg-primary/10 rounded-xl flex items-center justify-center">
<Icon name="lucide:building-2" size="32" class="text-primary" />
</div>
<div>
<Text weight="bold" size="xl">ООО "АГРОТОРГ ПЛЮС"</Text>
<div class="flex items-center gap-2 mt-1">
<span class="badge badge-success">Действующая</span>
<span class="badge badge-outline badge-sm">ООО</span>
<span class="text-sm text-base-content/60">с 2015 года</span>
</div>
</div>
</div>
</div>
<div class="flex flex-col items-end gap-2">
<div class="flex items-center gap-2">
<Icon name="lucide:shield-check" size="20" class="text-success" />
<span class="text-sm font-medium text-success">Верифицирован</span>
</div>
<span class="text-xs text-base-content/50">Обновлено: {{ new Date().toLocaleDateString('ru-RU') }}</span>
</div>
</div>
</Card>
<!-- Main Info -->
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<!-- Left Column -->
<div class="flex flex-col gap-6">
<!-- Реквизиты -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:file-text" size="20" />
Реквизиты
</Text>
<div class="grid grid-cols-2 gap-4">
<div>
<Text tone="muted" size="sm">ИНН</Text>
<Text weight="medium" class="font-mono">7707456789</Text>
</div>
<div>
<Text tone="muted" size="sm">КПП</Text>
<Text weight="medium" class="font-mono">770701001</Text>
</div>
<div>
<Text tone="muted" size="sm">ОГРН</Text>
<Text weight="medium" class="font-mono">1157746123456</Text>
</div>
<div>
<Text tone="muted" size="sm">ОКПО</Text>
<Text weight="medium" class="font-mono">12345678</Text>
</div>
<div class="col-span-2">
<Text tone="muted" size="sm">Дата регистрации</Text>
<Text weight="medium">15 марта 2015 г.</Text>
</div>
</div>
</Card>
<!-- Руководство -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:user-cog" size="20" />
Руководство
</Text>
<div class="space-y-3">
<div class="flex items-center gap-3 p-3 bg-base-200 rounded-lg">
<div class="avatar placeholder">
<div class="w-10 h-10 rounded-full bg-primary text-primary-content">
<span>ПС</span>
</div>
</div>
<div>
<Text weight="medium">Петров Сергей Александрович</Text>
<Text tone="muted" size="sm">Генеральный директор</Text>
</div>
</div>
</div>
</Card>
<!-- Учредители -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:users" size="20" />
Учредители
</Text>
<div class="space-y-3">
<div class="flex items-center justify-between p-3 bg-base-200 rounded-lg">
<div class="flex items-center gap-3">
<div class="avatar placeholder">
<div class="w-10 h-10 rounded-full bg-secondary text-secondary-content">
<span>ПС</span>
</div>
</div>
<div>
<Text weight="medium">Петров Сергей Александрович</Text>
<Text tone="muted" size="sm">Физическое лицо</Text>
</div>
</div>
<span class="badge badge-primary">60%</span>
</div>
<div class="flex items-center justify-between p-3 bg-base-200 rounded-lg">
<div class="flex items-center gap-3">
<div class="avatar placeholder">
<div class="w-10 h-10 rounded-full bg-secondary text-secondary-content">
<span>ИА</span>
</div>
</div>
<div>
<Text weight="medium">Иванова Анна Петровна</Text>
<Text tone="muted" size="sm">Физическое лицо</Text>
</div>
</div>
<span class="badge badge-primary">40%</span>
</div>
</div>
<div class="mt-4 pt-4 border-t border-base-200">
<div class="flex justify-between">
<Text tone="muted" size="sm">Уставный капитал</Text>
<Text weight="semibold">500 000 </Text>
</div>
</div>
</Card>
</div>
<!-- Right Column -->
<div class="flex flex-col gap-6">
<!-- Контакты -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:contact" size="20" />
Контакты
</Text>
<div class="space-y-3">
<div class="flex items-center gap-3">
<Icon name="lucide:map-pin" size="18" class="text-base-content/50" />
<Text size="sm">123456, г. Москва, ул. Складская, д. 15, оф. 301</Text>
</div>
<div class="flex items-center gap-3">
<Icon name="lucide:phone" size="18" class="text-base-content/50" />
<Text size="sm">+7 (495) 123-45-67</Text>
</div>
<div class="flex items-center gap-3">
<Icon name="lucide:mail" size="18" class="text-base-content/50" />
<Text size="sm">info@agrotorg-plus.ru</Text>
</div>
<div class="flex items-center gap-3">
<Icon name="lucide:globe" size="18" class="text-base-content/50" />
<Text size="sm">www.agrotorg-plus.ru</Text>
</div>
</div>
</Card>
<!-- Финансы -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:bar-chart-3" size="20" />
Финансовые показатели (2024)
</Text>
<div class="space-y-4">
<div>
<div class="flex justify-between mb-1">
<Text tone="muted" size="sm">Выручка</Text>
<Text weight="semibold" class="text-success"> 15%</Text>
</div>
<Text weight="bold" size="lg">245 800 000 </Text>
</div>
<div>
<div class="flex justify-between mb-1">
<Text tone="muted" size="sm">Чистая прибыль</Text>
<Text weight="semibold" class="text-success"> 23%</Text>
</div>
<Text weight="bold" size="lg">18 450 000 </Text>
</div>
<div>
<div class="flex justify-between mb-1">
<Text tone="muted" size="sm">Активы</Text>
</div>
<Text weight="bold" size="lg">89 200 000 </Text>
</div>
<div class="pt-3 border-t border-base-200">
<div class="flex justify-between">
<Text tone="muted" size="sm">Сотрудников</Text>
<Text weight="medium">47 человек</Text>
</div>
</div>
</div>
</Card>
<!-- Арбитраж -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:scale" size="20" />
Арбитражные дела
</Text>
<div class="space-y-3">
<div class="flex items-center justify-between">
<div class="flex items-center gap-2">
<span class="badge badge-warning badge-sm">Истец</span>
<Text size="sm">3 дела</Text>
</div>
<Text weight="medium" size="sm">1 250 000 </Text>
</div>
<div class="flex items-center justify-between">
<div class="flex items-center gap-2">
<span class="badge badge-error badge-sm">Ответчик</span>
<Text size="sm">1 дело</Text>
</div>
<Text weight="medium" size="sm">320 000 </Text>
</div>
<div class="pt-3 border-t border-base-200">
<Text tone="muted" size="xs">Завершенных: 2 выигранных, 1 урегулировано</Text>
</div>
</div>
</Card>
</div>
</div>
<!-- Виды деятельности -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:briefcase" size="20" />
Виды деятельности (ОКВЭД)
</Text>
<div class="space-y-2">
<div class="flex items-start gap-3 p-3 bg-primary/5 rounded-lg border border-primary/20">
<span class="badge badge-primary badge-sm mt-0.5">Основной</span>
<div>
<Text weight="medium" size="sm">46.21 - Торговля оптовая зерном, необработанным табаком, семенами и кормами для сельскохозяйственных животных</Text>
</div>
</div>
<div class="flex items-start gap-3 p-3 bg-base-200 rounded-lg">
<span class="badge badge-ghost badge-sm mt-0.5">Доп.</span>
<Text size="sm">46.11 - Деятельность агентов по оптовой торговле сельскохозяйственным сырьем</Text>
</div>
<div class="flex items-start gap-3 p-3 bg-base-200 rounded-lg">
<span class="badge badge-ghost badge-sm mt-0.5">Доп.</span>
<Text size="sm">52.10 - Деятельность по складированию и хранению</Text>
</div>
<div class="flex items-start gap-3 p-3 bg-base-200 rounded-lg">
<span class="badge badge-ghost badge-sm mt-0.5">Доп.</span>
<Text size="sm">49.41 - Деятельность автомобильного грузового транспорта</Text>
</div>
</div>
</Card>
<!-- История изменений -->
<Card padding="md">
<Text weight="semibold" size="lg" class="mb-4 flex items-center gap-2">
<Icon name="lucide:history" size="20" />
История изменений
</Text>
<div class="relative">
<div class="absolute left-4 top-0 bottom-0 w-0.5 bg-base-300" />
<div class="space-y-4">
<div class="flex gap-4 relative">
<div class="w-8 h-8 rounded-full bg-primary flex items-center justify-center z-10">
<Icon name="lucide:check" size="16" class="text-primary-content" />
</div>
<div class="flex-1 pb-4">
<Text weight="medium" size="sm">Смена юридического адреса</Text>
<Text tone="muted" size="xs">12 января 2024</Text>
</div>
</div>
<div class="flex gap-4 relative">
<div class="w-8 h-8 rounded-full bg-base-300 flex items-center justify-center z-10">
<Icon name="lucide:user-plus" size="16" />
</div>
<div class="flex-1 pb-4">
<Text weight="medium" size="sm">Изменение состава учредителей</Text>
<Text tone="muted" size="xs">5 августа 2023</Text>
</div>
</div>
<div class="flex gap-4 relative">
<div class="w-8 h-8 rounded-full bg-base-300 flex items-center justify-center z-10">
<Icon name="lucide:banknote" size="16" />
</div>
<div class="flex-1 pb-4">
<Text weight="medium" size="sm">Увеличение уставного капитала</Text>
<Text tone="muted" size="xs">20 марта 2022</Text>
</div>
</div>
<div class="flex gap-4 relative">
<div class="w-8 h-8 rounded-full bg-base-300 flex items-center justify-center z-10">
<Icon name="lucide:building" size="16" />
</div>
<div class="flex-1">
<Text weight="medium" size="sm">Регистрация компании</Text>
<Text tone="muted" size="xs">15 марта 2015</Text>
</div>
</div>
</div>
</div>
</Card>
<!-- Details grid -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div>
<Text tone="muted" size="sm">ИНН</Text>
<Text weight="medium">7707083893</Text>
</div>
<div>
<Text tone="muted" size="sm">ОГРН</Text>
<Text weight="medium">1027700132195</Text>
</div>
<div>
<Text tone="muted" size="sm">{{ $t('kyc.demo.director') }}</Text>
<Text weight="medium">Иванов Иван Иванович</Text>
</div>
<div>
<Text tone="muted" size="sm">{{ $t('kyc.demo.capital') }}</Text>
<Text weight="medium">10 000 </Text>
</div>
<div class="md:col-span-2">
<Text tone="muted" size="sm">{{ $t('kyc.demo.address') }}</Text>
<Text weight="medium">г. Москва, ул. Примерная, д. 1</Text>
</div>
<div class="md:col-span-2">
<Text tone="muted" size="sm">{{ $t('kyc.demo.activities') }}</Text>
<div class="flex flex-wrap gap-1 mt-1">
<span class="badge badge-ghost badge-sm">Оптовая торговля</span>
<span class="badge badge-ghost badge-sm">Логистика</span>
<span class="badge badge-ghost badge-sm">Складские услуги</span>
</div>
</div>
<!-- Sources Footer -->
<div class="flex flex-wrap items-center justify-between gap-4 text-xs text-base-content/50 px-2">
<div class="flex items-center gap-4">
<span class="flex items-center gap-1">
<Icon name="lucide:database" size="14" />
Источники: ЕГРЮЛ, ФНС, Росстат, Арбитр
</span>
</div>
<span>Данные актуальны на {{ new Date().toLocaleDateString('ru-RU') }}</span>
</div>
<!-- Footer -->
<div class="flex items-center justify-between text-xs text-base-content/50 pt-2 border-t border-base-200">
<span>{{ $t('kyc.demo.sources') }}: ЕГРЮЛ, ФНС, Росстат</span>
<span>{{ $t('kyc.demo.updated') }}: {{ new Date().toLocaleDateString('ru-RU') }}</span>
</div>
<!-- Demo notice -->
<div class="alert alert-info">
<Icon name="lucide:info" size="16" />
<span>{{ $t('kyc.demo.notice') }}</span>
</div>
</Stack>
</Card>
<!-- Demo notice -->
<div class="alert alert-info">
<Icon name="lucide:info" size="16" />
<span>{{ $t('kyc.demo.notice') }}</span>
</div>
</div>
<!-- Real KYC Profile Card -->
<KycProfileCard v-else :kyc-profile-uuid="uuid" />
@@ -87,7 +344,6 @@ const isDemo = computed(() => uuid.value === 'demo-kyc-profile')
// Back URL - try to go back to previous page or catalog
const backUrl = computed(() => {
// If there's a referrer from catalog, use it
return localePath('/catalog')
})
</script>