78 lines
3.7 KiB
TypeScript
78 lines
3.7 KiB
TypeScript
"use client";
|
||
|
||
import { CalendarCheckIcon } from "lucide-react";
|
||
|
||
import { bookingReasons } from "@/entities/site-content";
|
||
import { Badge } from "@/shared/ui/badge";
|
||
import { Button } from "@/shared/ui/button";
|
||
import { Container } from "@/shared/ui/container";
|
||
import { InnerHero } from "@/shared/ui/inner-hero";
|
||
import { Input } from "@/shared/ui/input";
|
||
import { Textarea } from "@/shared/ui/textarea";
|
||
import { ClinicalDisclaimer } from "@/widgets/clinical-disclaimer";
|
||
import { PatientChecklist } from "@/widgets/patient-checklist";
|
||
import { PatientJourney } from "@/widgets/patient-journey";
|
||
import { SafetyNotes } from "@/widgets/safety-notes";
|
||
import { SpecialistSchedule } from "@/widgets/specialist-schedule";
|
||
|
||
function ReservationForm() {
|
||
return (
|
||
<Container className="grid gap-8 py-14 lg:grid-cols-[0.82fr_1.18fr]">
|
||
<div>
|
||
<Badge variant="outline" className="mb-5 rounded-md border-primary/30 text-primary">
|
||
<CalendarCheckIcon className="size-4" />
|
||
Triage form
|
||
</Badge>
|
||
<h2 className="text-4xl font-semibold leading-tight sm:text-5xl">Запись начинается с цели визита</h2>
|
||
<p className="mt-4 text-sm leading-7 text-muted-foreground">
|
||
Форма статическая. Она показывает будущий booking flow: причина обращения, желаемый маршрут, документы и безопасное предупреждение
|
||
о неэкстренном формате.
|
||
</p>
|
||
<div className="mt-6 rounded-md border border-amber-200 bg-amber-50 p-4 text-sm leading-6 text-amber-900">
|
||
При резком ухудшении состояния, сильной боли, травме или угрозе жизни нужно обращаться в экстренные службы.
|
||
</div>
|
||
</div>
|
||
<form className="grid gap-4 rounded-md border border-border bg-card p-5">
|
||
<div className="grid gap-3 sm:grid-cols-2">
|
||
<Input placeholder="Имя пациента" />
|
||
<Input placeholder="Телефон или email" />
|
||
<Input placeholder="Желаемая дата" />
|
||
<Input placeholder="Удобное время" />
|
||
</div>
|
||
<div className="grid gap-2">
|
||
<div className="text-sm font-semibold">Причина обращения</div>
|
||
<div className="flex flex-wrap gap-2">
|
||
{bookingReasons.map((reason) => (
|
||
<button key={reason} type="button" className="rounded-md border border-border bg-background px-3 py-2 text-sm font-medium text-muted-foreground">
|
||
{reason}
|
||
</button>
|
||
))}
|
||
</div>
|
||
</div>
|
||
<Textarea placeholder="Кратко опишите цель визита, прошлые исследования, ограничения или вопросы координатору" />
|
||
<Button type="button" className="h-11 rounded-md">
|
||
Отправить заявку координатору
|
||
</Button>
|
||
</form>
|
||
</Container>
|
||
);
|
||
}
|
||
|
||
export function BookingPage() {
|
||
return (
|
||
<>
|
||
<InnerHero
|
||
eyebrow="Booking"
|
||
title="Запись как triage: цель визита, подготовка и неэкстренный контекст"
|
||
text="Форма не отправляет данные наружу. Она показывает UI будущей записи: причина обращения, слот, документы и предупреждение о плановом формате."
|
||
/>
|
||
<SpecialistSchedule />
|
||
<ReservationForm />
|
||
<PatientJourney />
|
||
<PatientChecklist />
|
||
<SafetyNotes />
|
||
<ClinicalDisclaimer />
|
||
</>
|
||
);
|
||
}
|