tore/kalkulyator-stoimosti-podkly
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
pages
kalkulyator-stoimosti-podkly/brief.md

5.6 KiB
Raw Permalink Blame History

Калькулятор стоимости подключения

Тип решения

Статический сайт (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. Тема по умолчанию — светлая: <html lang="ru" data-theme="light">; не ставь 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, с обычными <link>. Шаблон 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/ закоммить вместе с проектом — иначе опубликованная страница останется без стилей.