medcenterstart: apply the v2 design and add the callback dialog
v2 differs from legacy/new only by the callback dialog; the calculator and the new phone number were already in the React landing. The header «Звонок» button opens the «Перезвоним вам» dialog from the fitness landing (name, phone, consent). Unlike fitness, the phone field keeps this landing's +7 mask and refuses fewer than 11 digits, as the mockup does. The server accepts form 'callback', names the deal «Обратный звонок — <имя>» and tags it «обратный звонок». The phone link inside the dialog and in the section sheet still reports a call click. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
3fdc52f707
commit
160f615390
@@ -65,7 +65,7 @@ npm run amo:check
|
||||
email дописывается в карточку.
|
||||
2. Если контакта нет — создаётся новый с именем, телефоном и email.
|
||||
3. Создаётся сделка в воронке `AMO_PIPELINE_ID`, в её **первом этапе**,
|
||||
с тегами `AMO_LEAD_TAGS` + тег `заявка с сайта`.
|
||||
с тегами `AMO_LEAD_TAGS` + тег формы (`заявка с сайта` / `обратный звонок`).
|
||||
4. Данные, для которых в аккаунте есть подходящее поле (компания, направления
|
||||
центра, `utm_*` и т.д.), пишутся в поля; всё остальное — в примечание к
|
||||
сделке. Ничего настраивать в amoCRM заранее не нужно.
|
||||
@@ -73,13 +73,20 @@ npm run amo:check
|
||||
Эндпоинт — `POST /api/leads/medical-centers-no-physio` (адрес взят из исходного
|
||||
лендинга).
|
||||
|
||||
Форм две. Основная — блок «Следующий шаг» внизу страницы: обязательны имя и
|
||||
телефон; сделка называется `Физиотерапия — <центр или имя>`. Вторая — модальное
|
||||
окно «Перезвоним вам», его открывает кнопка «Звонок» в шапке (то же окно, что на
|
||||
фитнес-лендинге): имя, телефон и согласие на обработку данных. Сделка называется
|
||||
`Обратный звонок — <имя>`, в поле или примечании «Форма» — «Быстрый обратный
|
||||
звонок».
|
||||
|
||||
Если amoCRM недоступна, заявка **не теряется**: она пишется в лог сервера
|
||||
(`[lead] payload was: …`) и сохраняется в `localStorage` браузера, а посетитель
|
||||
видит телефон для связи.
|
||||
|
||||
### 4. Что происходит при клике на телефон
|
||||
|
||||
Кнопка звонка (в шапке и в мобильном меню разделов) помимо набора номера отправляет
|
||||
Ссылка с номером (в окне «Перезвоним вам» и в мобильном меню разделов) помимо набора номера отправляет
|
||||
`POST /api/leads/medical-centers-no-physio/call` — маячком `navigator.sendBeacon`, чтобы
|
||||
запрос пережил переход браузера на `tel:`.
|
||||
|
||||
@@ -113,15 +120,19 @@ index.html точка входа Vite (meta, Open Graph, JSON-LD)
|
||||
src/
|
||||
components/ секции лендинга и UI-примитивы
|
||||
data/content.ts весь текстовый контент страницы
|
||||
hooks/ появление секций при скролле, состояние шапки
|
||||
hooks/ появление секций при скролле, состояние шапки, блокировка
|
||||
прокрутки и Escape для модального окна
|
||||
lib/ отправка заявки, маска телефона
|
||||
assets/images/ 12 изображений, извлечённых из исходного HTML
|
||||
index.css дизайн-токены Tailwind v4 (@theme) и базовые стили
|
||||
shared/lead.ts схема заявки (zod), общая для клиента и сервера
|
||||
server/src/ Express API + клиент amoCRM
|
||||
scripts/amo-check.ts диагностика подключения к amoCRM
|
||||
legacy/index.html исходный однофайловый лендинг (визуальный эталон)
|
||||
legacy/index.html исходный однофайловый лендинг (первая версия дизайна)
|
||||
legacy/README.md исходная инструкция к однофайловой версии
|
||||
legacy/new/ макет с калькулятором
|
||||
legacy/v2/ макет v2 — текущий визуальный эталон (legacy/new + окно
|
||||
обратного звонка)
|
||||
```
|
||||
|
||||
### Дизайн-система
|
||||
@@ -191,6 +202,11 @@ honeypot-поля, которой в оригинале нет.
|
||||
скрыта утилитой `honeypot`, а не `display:none`, иначе поле перестанет быть
|
||||
фокусируемым и ловушка не сработает.
|
||||
|
||||
* **Окно «Перезвоним вам»** из макета v2 взято с фитнес-лендинга (светлые поля,
|
||||
согласие отдельным чекбоксом, без надзаголовка «Обратный звонок»), а не
|
||||
вёрстка `.exo-callback` из макета. Тексты окна и маска телефона — из макета:
|
||||
без 11 цифр номера форма не отправляется, как и основная.
|
||||
|
||||
### Что воспроизведено как есть
|
||||
|
||||
* Блок `.system-bottom` в секции «Готовое направление» сохраняет верхнюю
|
||||
|
||||
Reference in New Issue
Block a user