64 lines
2.5 KiB
Markdown
64 lines
2.5 KiB
Markdown
# DEV-TASK: Веб-интерфейс для Snowbike RAG
|
||
|
||
## Контекст
|
||
|
||
API для семантического поиска работает (Flask :5557). Нужен красивый веб-интерфейс.
|
||
|
||
**Документация:**
|
||
- Бизнес-требования: `tasks/snowbike-rag/docs/BRD-UI.md`
|
||
- Техническое задание: `tasks/snowbike-rag/docs/TZ-UI.md`
|
||
- Существующий API: `tasks/snowbike-rag/server.py`
|
||
|
||
---
|
||
|
||
## Задача
|
||
|
||
Реализовать одностраничное веб-приложение для поиска по базе знаний сноубайков.
|
||
|
||
### Шаг 1: Создать index.html
|
||
|
||
1. Создать `templates/index.html` — единственная страница
|
||
2. Подключить CDN: Tailwind CSS, Marked.js, Google Fonts (Inter)
|
||
3. Реализовать UI:
|
||
- Заголовок: «🏔️ Snowbike Поиск»
|
||
- Поле ввода (textarea) по центру
|
||
- Кнопка отправки (🔍)
|
||
- Блок результатов: ответ (Markdown → HTML) + источники (карточки)
|
||
- Спиннер при загрузке
|
||
- Тёмная тема (#0F172A фон)
|
||
4. Адаптивность: мобилка, планшет, десктоп
|
||
|
||
### Шаг 2: Обновить server.py
|
||
|
||
5. Добавить роут `/` → `render_template('index.html')`
|
||
6. Оставить `/search` для обратной совместимости
|
||
7. Добавить `/api/search` — алиас к `/search`
|
||
|
||
### Шаг 3: Проверить
|
||
|
||
8. Открыть `http://localhost:5557/` — должна быть страница поиска
|
||
9. Ввести запрос → ответ с источниками
|
||
10. Проверить на мобильном (responsive)
|
||
|
||
---
|
||
|
||
## Критерии приёмки
|
||
|
||
- [ ] `http://localhost:5557/` — страница поиска (не JSON, не 404)
|
||
- [ ] Ввод «масло для Polaris» → ответ + источники
|
||
- [ ] Тёмная тема, красивый шрифт Inter
|
||
- [ ] Адаптивно на мобильном
|
||
- [ ] Markdown рендерится в HTML
|
||
- [ ] Источники — карточки с датой и топиком
|
||
- [ ] Спиннер при загрузке
|
||
- [ ] Существующие API-роуты работают
|
||
|
||
---
|
||
|
||
## Важно
|
||
|
||
• Всё в `tasks/snowbike-rag/`
|
||
• HTML — один файл (inline CSS + JS)
|
||
• Не ломать существующий API
|
||
• Tailwind через CDN (без npm/сборки)
|