bot-telegram/app.control-bot/README.md

Управляющее приложение для Telegram бота

Веб-интерфейс для управления тестами Telegram бота.

Возможности

• ✅ Управление тестами (создание, редактирование, удаление)
• ✅ Управление категориями тестов
• ✅ Управление вопросами и вариантами ответов
• ✅ Загрузка изображений к вопросам
• ✅ Фильтрация и поиск
• ✅ Современный адаптивный интерфейс

Структура проекта

app.control-bot/
├── main.py              # Основное приложение с веб-сервером
├── web/                 # Веб-интерфейс
│   ├── index.html       # Главная страница
│   └── static/
│       ├── css/
│       │   └── style.css    # Стили
│       └── js/
│           ├── api.js       # Работа с API
│           └── app.js       # Основная логика приложения
├── pyproject.toml       # Конфигурация проекта
└── README.md           # Документация

Запуск

Предварительные требования

1. Запущенный API сервер на http://localhost:8000

   cd ../api
   python run_api.py
   

2. Python 3.12+ (базовые библиотеки)

Запуск веб-интерфейса

cd app.control-bot
python main.py

Веб-интерфейс будет доступен по адресу: http://localhost:3000

Браузер откроется автоматически через 2 секунды после запуска.

Использование

Управление тестами

1. Создание теста:

   • Нажмите "Добавить тест"
   • Заполните название и описание
   • Выберите категорию (опционально)
   • Установите лимит времени (опционально)
   • Выберите статус (активный/неактивный)

2. Редактирование теста:

   • Нажмите кнопку "Редактировать" в строке теста
   • Измените необходимые поля
   • Сохраните изменения

3. Удаление теста:

   • Нажмите кнопку "Удалить" в строке теста
   • Подтвердите удаление

Управление категориями

1. Перейдите на вкладку "Категории"
2. Используйте кнопку "Добавить категорию" для создания новой
3. Редактируйте или удаляйте существующие категории

Управление вопросами

1. Перейдите на вкладку "Вопросы"
2. Выберите тест из выпадающего списка
3. Добавляйте вопросы с помощью кнопки "Добавать вопрос"

Типы вопросов:

• Один ответ - радиокнопки, один правильный ответ
• Несколько ответов - чекбоксы, может быть несколько правильных
• Текстовый ввод - пользователь вводит ответ текстом

Работа с изображениями:

• Загружайте изображения к вопросам
• Поддерживаются форматы: JPG, PNG, GIF, WebP
• Изображения сохраняются в базе данных

API Integration

Веб-интерфейс работает с API по адресу http://localhost:8000/api/v1

Используемые эндпоинты:

• GET/POST /tests - Управление тестами
• GET/POST /test-categories - Управление категориями
• GET/POST /questions - Управление вопросами
• GET/POST /answer-options - Управление вариантами ответов
• POST /images/upload - Загрузка изображений
• GET /images/{id} - Получение изображений

Технологии

• Backend: Python (http.server для статических файлов)
• Frontend: HTML5, CSS3, JavaScript (ES6+)
• UI Framework: Bootstrap 5.3
• Icons: Bootstrap Icons
• API: RESTful API с JSON

Особенности

• Полностью адаптивный дизайн
• Валидация форм на клиентской стороне
• Уведомления об операциях
• Загрузка с индикаторами прогресса
• Подтверждение удаления
• Автоматическое обновление данных
• Поддержка изображений
• Фильтрация и поиск

Устранение неполадок

API сервер не запущен

❌ Ошибка: Cannot connect to API server

Решение: Запустите API сервер в папке ../api

Порт уже используется

❌ Ошибка: Порт 3000 уже используется

Решение: Остановите процесс на порту 3000 или измените порт в main.py

Проблемы с CORS

Если возникают ошибки CORS, убедитесь, что в конфигурации API разрешены запросы с http://localhost:3000

Разработка

Для изменения порта веб-сервера отредактируйте main.py:

web_interface = WebInterface(port=3001)  # Изменить порт

Для изменения адреса API отредактируйте web/static/js/api.js:

const API_BASE_URL = 'http://localhost:8001/api/v1';  // Изменить адрес