Files
BarevClub/apps/landing/app/[locale]/land6/page.tsx
T

131 lines
5.8 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import '../../variants.css';
import { quote } from '@barev/core';
import { createT, formatAmd, formatDateTime, isLocale, LOCALES, type Locale } from '@barev/i18n';
import { notFound } from 'next/navigation';
import { BotLink, BotLinkProvider } from '../../../components/client';
import { VariantHeader, variantMetadata } from '../../../components/variant';
import { getCatalog, getCleaning } from '../../../lib/data';
export const revalidate = 300;
export const dynamicParams = false;
export function generateStaticParams() {
return LOCALES.map((locale) => ({ locale }));
}
export function generateMetadata({ params }: { params: Promise<{ locale: string }> }) {
return variantMetadata(params, '/land6', 'landing.v6.tag');
}
/** Пример дохода агентства: условные клиенты и заказы, цена и процент — настоящие из каталога и настроек */
const EXAMPLE = { clients: 20, orders: 2 };
/** Печать клуба: текст по кругу и «Barev» в центре */
function Stamp() {
return (
<svg className="v6-stamp" viewBox="0 0 160 160" aria-hidden="true">
<defs>
<path id="v6-ring" d="M80 80 m-58 0 a58 58 0 1 1 116 0 a58 58 0 1 1 -116 0" />
</defs>
<circle cx="80" cy="80" r="74" fill="none" stroke="currentColor" strokeWidth="3" />
<circle cx="80" cy="80" r="44" fill="none" stroke="currentColor" strokeWidth="2" />
{/* длина текста = окружность r=58 (2π·58 ≈ 364), чтобы конец не наезжал на начало */}
<text fontSize="14" fontWeight="700" fill="currentColor">
<textPath href="#v6-ring" textLength="356" lengthAdjust="spacing">
BAREV CLUB ✦ YEREVAN ✦ PARTNER ✦
</textPath>
</text>
<text x="80" y="88" textAnchor="middle" fontSize="24" fontWeight="800" fontStyle="italic" fill="currentColor">
Barev
</text>
</svg>
);
}
/** Версия 6 «Для агентств»: B2B-страница главного канала привлечения, оформленная как договор с пунктами и печатью */
export default async function Land6({ params }: { params: Promise<{ locale: string }> }) {
const { locale: raw } = await params;
if (!isLocale(raw)) notFound();
const locale: Locale = raw;
const t = createT(locale);
const amd = (n: number) => formatAmd(locale, n);
const [catalog, cleaning] = await Promise.all([getCatalog(), getCleaning()]);
const agency = catalog.agency ?? { commissionPct: 10, attributionMonths: 12 };
const price = quote(cleaning.pricing, { cleaningType: 'regular', rooms: 2, bathrooms: 1 }).totalPrice;
const amount = Math.round((EXAMPLE.clients * EXAMPLE.orders * price * agency.commissionPct) / 100);
const vars = { pct: agency.commissionPct, months: agency.attributionMonths, days: catalog.barevPlus.giftDays };
const sections = [
{ key: 's1', items: ['s1i1', 's1i2', 's1i3'] },
{ key: 's2', items: ['s2i1', 's2i2', 's2i3'] },
{ key: 's3', items: ['s3i1', 's3i2', 's3i3'] },
];
return (
<BotLinkProvider locale={locale} bot={catalog.botUsername}>
<div className="v6">
<div className="v-wrap">
<VariantHeader locale={locale} path="/land6" />
<article className="v6-doc">
<div className="v6-doc__top">
<span className="v6-tag">{t('landing.v6.tag')}</span>
<span className="v6-date">
{t('landing.v6.docDate')}, {formatDateTime(locale, new Date(), { day: 'numeric', month: 'long', year: 'numeric' })}
</span>
</div>
<h1 className="v6-title">{t('landing.v6.title')}</h1>
<p className="v6-sub">{t('landing.v6.sub')}</p>
<div className="v6-body">
<div className="v6-clauses">
{sections.map((s, i) => (
<section key={s.key} className="v6-clause">
<h2>
<span>{i + 1}.</span> {t(`landing.v6.${s.key}`)}
</h2>
<ol>
{s.items.map((item, j) => (
<li key={item}>
<span className="v6-num">
{i + 1}.{j + 1}
</span>
<span>{t(`landing.v6.${item}`, vars)}</span>
</li>
))}
</ol>
</section>
))}
</div>
<aside className="v6-example">
<div className="v6-example__title">{t('landing.v6.exampleTitle')}</div>
<div className="v6-example__calc">{t('landing.v6.exampleText', { clients: EXAMPLE.clients, orders: EXAMPLE.orders, price: amd(price) })}</div>
<div className="v6-example__pct">× {agency.commissionPct}%</div>
<div className="v6-example__result">{t('landing.v6.exampleResult', { amount: amd(amount) })}</div>
<p>{t('landing.v6.exampleNote')}</p>
</aside>
</div>
<div className="v6-sign">
<div className="v6-sign__line">
<span />
{t('landing.v6.signAgency')}
</div>
<div className="v6-sign__line v6-sign__line--us">
<Stamp />
<span />
{t('landing.v6.signUs')}
</div>
</div>
<BotLink className="bc-btn bc-btn--accent v6-cta">{t('landing.v6.cta')}</BotLink>
</article>
<footer className="v-footer">
<span>{t('landing.footer.brand')}</span>
<a href={`/${locale}/privacy`}>{t('landing.footer.privacy')}</a>
</footer>
</div>
</div>
</BotLinkProvider>
);
}