# Калькулятор стоимости подключения ## Тип решения Статический сайт (index.html + style.css + script.js) на ванильном JS с Tailwind через CDN. ## Задача Рассчитать итоговую стоимость подключения интернета для клиента на основе выбранных параметров: тарифный план, скорость соединения, опция аренды оборудования. ## Кто пользуется Менеджеры по продажам, сотрудники контакт-центра, клиенты (через ссылку в Telegram). ## Что делает прототип 1. **Экран калькулятора**: Отображает три блока выбора (Тариф, Скорость, Оборудование) и блок «Итого». 2. **Выбор параметров**: Пользователь выбирает один вариант из списка в каждом блоке (radio-buttons или выпадающие списки). 3. **Динамический расчет**: При изменении любого параметра мгновенно пересчитывается сумма в блоке «Итого». 4. **Кнопка «Рассчитать»**: Формирует текстовое резюме выбора и копирует его в буфер обмена для отправки клиенту. 5. **Сохранение состояния**: Выбранные пользователем параметры сохраняются в LocalStorage браузера и восстанавливаются после перезагрузки страницы. 6. **Журнал действий**: В скрытом блоке (или консоли) фиксируется время и параметры последнего расчета (имитация журнала изменений). ## Демо-данные - **Тарифы**: «Базовый» (5000 ₸), «Оптимальный» (7500 ₸), «Премиум» (12000 ₸). - **Скорость**: 100 Мбит/с (0 ₸), 500 Мбит/с (+1000 ₸), 1 Гбит/с (+2000 ₸). - **Оборудование**: «Свой роутер» (0 ₸), «Аренда Wi-Fi 5» (1500 ₸/мес), «Аренда Wi-Fi 6» (2500 ₸/мес). - **Контекст**: Валюта — тенге (₸), названия тарифов адаптированы под рынок РК. ## Допущения - Стоимость аренды оборудования добавляется к ежемесячному платежу (или считается как разовая плата за первый месяц, если не указано иное — принято решение считать как ежемесячный платеж для наглядности). - Скидки за длительность контракта не учитываются. - НДС включен в стоимость. ## Чего пока нет - Интеграции с CRM для создания сделки. - Личного кабинета и авторизации. - Отправки заявки напрямую в биллинг. ## Дизайн — дизайн-система KT AI Весь интерфейс собирай на дизайн-системе KT AI, которая уже лежит в папке проекта `design-system/`. Перед первой строкой вёрстки прочитай `design.md` и `design-system/AGENTS.md` и следуй им. Подключай файлы ДС относительными путями и в этом порядке: `./design-system/kt-ai-fonts.css`, `./design-system/kt-ai-tokens.css`, `./design-system/kt-ai-components.css`, `./design-system/kt-ai-page.css`. Тема по умолчанию — светлая: ``; не ставь `dark` и не ставь `auto` (auto уходит в тёмную по системной теме). Переключатель темы можно оставить, но открываться страница должна светлой. Цвета, отступы и размеры — только токенами `var(--kt-ai-…)`, иконки — из `design-system/icons/kt-ai-lucide-sprite.svg`. Таблицы, списки, журналы, дашборды и формы собирай из готовых классов ДС (`design-system/COMPONENTS.md`), архетип экрана выбирай по `design-system/docs/ARCHETYPES.md`. Каркас страницы — из `design.md`, с обычными ``. Шаблон `design-system/templates/kt-ai-app-shell.html` целиком не копируй: его скрипты-загрузчики (`data-kt-ai-base-resolver`, `data-kt-ai-boot`) тянут CSS с корня сайта по абсолютному пути `/design-system/…`, а сайт публикуется в подпапке — стили не загрузятся. Подключай только файлы, которые реально лежат в `design-system/` (проверь `ls design-system`): файла `kt-ai-components.js` там нет. Свой стиль не выдумывай, Bootstrap/Tailwind/Material/Google Fonts не подключай, сырые hex-цвета не пиши. Папку `design-system/` закоммить вместе с проектом — иначе опубликованная страница останется без стилей.