# Промты для создания приложения VOLS Registry ## Исходный запрос ``` Создай приложение для учёта объектов корпоративного сегмента ВОЛС Kazakhtelecom Business ``` ## Детализация требований ### 1. Структура данных ``` 18 колонок: 1. Сегмент 2. Подразделение (ДПБО / ДПККК) 3. Область (17 областей Казахстана) 4. Район 5. Населенный пункт 6. Адрес 7. Клиент 8. Вид деятельности 9. Наличие ТВ (да/нет) 10. Статус строительства ВОЛС (Проект, СМР, СМР завершено, Исключено) 11. Начало строительства (дата) 12. Срок строительства (дата) 13. Примечание 14. № устройства 15. Статус подключения (Подключено, Заявка, Отказ, Перспектива) 16. Дата подключения (дата) 17. Тариф 18. ARPU (тенге) ``` ### 2. Ролевая модель ``` - admin: полный доступ ко всем объектам и пользователям - editor: редактирование объектов только своего подразделения (ДПБО или ДПККК) - view: только просмотр всех объектов ``` ### 3. Дизайн-система ``` Брендинг Kazakhtelecom Business: - Основной цвет: #4B1D6B (глубокий фиолетовый) - Акцентный цвет: #8DC63F (лайм) - Фоновый цвет: #F5F3F8 (светло-серый с фиолетовым оттенком) - Шрифты: Manrope (заголовки), Inter (текст) - Скругления: 1rem для карточек, 0.75rem для кнопок - Тени: мягкие, рассеянные ``` ### 4. Функциональные требования ``` Экраны: 1. Start Screen — выбор устройства (ПК/мобильное) и режима (просмотр/редактирование) 2. Auth Screen — выбор демо-пользователя или регистрация нового 3. Main App — таблица/карточки объектов, дашборд, админка пользователей, журнал аудита Таблица объектов: - Сортировка по клику на заголовок колонки - Фильтры: сегмент, область, статус подключения, поиск по всем полям - Подсветка просроченных объектов (красный фон) - Кнопки редактирования и удаления (в зависимости от роли) - Экспорт в Excel Дашборд: - KPI: всего объектов, подключено, в работе, суммарный ARPU - График по областям (bar chart) - График статусов подключения (doughnut chart) - Сводка по подразделениям (ДПБО/ДПККК) Мобильная версия: - Карточки вместо таблицы - Детальный просмотр объекта по клику - Редактирование из детального просмотра Админ-панель: - Список всех пользователей - Редактирование пользователя (ФИО, телефон, роль, регион) - Удаление пользователя - Журнал аудита (последние 300 записей) ``` ### 5. Технические требования ``` - Single Page Application на чистом JavaScript (без фреймворков) - Хранение данных: localStorage (volsRecords, volsUsers, volsAudit) - Seed-данные при первом запуске: 30 объектов + 4 пользователя - Экспорт в Excel через библиотеку XLSX (CDN) - Графики через Chart.js (CDN) - Адаптивная вёрстка (mobile-first подход) - Модальные окна для редактирования/удаления - Audit log всех действий пользователя ``` ### 6. Seed-данные ``` Генерация 30 тестовых объектов: - Равномерное распределение по подразделениям (ДПБО/ДПККК) - Все области Казахстана - Различные сегменты (Корпоративный, Банки, Телеком, Нефтегаз и т.д.) - Случайные статусы строительства и подключения - Даты строительства в прошлом (2025-2026) - ARPU от 30 до 180 тенге для подключенных объектов 4 демо-пользователя: 1. admin: Торегожиев Саяжан Сабырович, +77771112233, регион: all 2. editor: Иванов Петр, +77774445566, регион: ДПБО 3. editor: Смирнов Алексей, +77777778899, регион: ДПККК 4. view: Гость Тестовый, +77770001122, регион: none ``` ### 7. Бизнес-правила ``` - Просроченные объекты: дата окончания строительства < TODAY и статус не "СМР завершено"/"Исключено" - TODAY = "2026-08-22" (фиксированная дата для демонстрации) - Редактор может редактировать только объекты своего подразделения - Админ может редактировать все объекты и пользователей - Журнал аудита хранит последние 300 записей - Все данные сохраняются в localStorage автоматически ``` ### 8. Финальный промт для генерации ``` Создай Single Page Application (один HTML файл + один JS файл) для реестра объектов ВОЛС. Требования: - Весь код в index.html (стили) и app.js (логика) - Использование CDN для Chart.js и XLSX - Ролевая модель: admin, editor, view - 18 полей объекта, 4 экрана (start, auth, main table/cards, dashboard) - Seed-данные: 30 объектов + 4 пользователя - localStorage для персистентности - Audit log всех действий - Экспорт в Excel - Мобильная адаптация (карточки вместо таблицы) - Дизайн в цветах Kazakhtelecom (#4B1D6B, #8DC63F) - Шрифты Manrope и Inter Структура app.js: 1. State object (screen, device, mode, user, users, records, audit, filter, sort) 2. Storage helpers (get/set localStorage) 3. Seed data function (30 records + 4 users) 4. Audit logging function 5. Render functions (start, auth, main) 6. Init functions (event handlers) 7. Helper functions (filter, sort, stats, export) Начни с index.html, затем app.js. ``` ## Итоговые файлы проекта 1. `index.html` — 500+ строк (стили + разметка) 2. `app.js` — 1000+ строк (вся логика приложения) 3. `server.js` — статический сервер для раздачи файлов 4. `package.json` — зависимости (xlsx) 5. `README.md` — документация проекта 6. `PROMPTS.md` — этот файл с историей промтов ## Ключевые решения в процессе разработки 1. **Отказ от React** — изначальный план использовать React был изменён на чистый JS для надёжности и простоты развёртывания 2. **localStorage вместо бэкенда** — все данные хранятся в браузере пользователя 3. **Один файл app.js** — вся логика в одном файле для простоты поддержки 4. **Модальные окна** — вместо отдельных страниц для редактирования/удаления 5. **Адаптивный дизайн** — карточки на мобильных, таблица на ПК 6. **Audit log** — журналирование всех действий для администратора