Версия: 2.0
Дата: 2025-12-25
Статус: Planning
Текущая версия (v1.0):
- OAuth авторизация
- Воркспейсы и проекты
- Чат с Claude (WebSocket)
- Просмотр файлов
- Терминал (xterm.js)
Новая версия (v2.0):
Профессиональный веб-интерфейс для работы с проектами, сессиями и задачами.
┌────────────────────────────────────────────────────────────────┐
│ ШАПКА: Вкладки сессий (цвет = активность/простой) │
│ [Все сессии] [Пиротехника:OZON⚡] [Lider:Main⏸] [Platform🟢] │
├─────────┬───────────────────────────────────────────┬──────────┤
│ ЛЕВАЯ │ ЦЕНТРАЛЬНАЯ ОБЛАСТЬ │ ПРАВАЯ │
│ КОЛОНКА │ │ КОЛОНКА │
│ │ │ │
│ 📁 Созд.│ ┌─────────────────────────────────────┐ │ 📋 ЗАДАЧИ│
│ доки │ │ │ │ │
│ • doc1 │ │ ЧАТ / ТЕРМИНАЛ │ │ ⏳ Pending│
│ • doc2 │ │ │ │ • Task1 │
│ │ │ (полный размер) │ │ • Task2 │
│ 📥 Загр.│ │ │ │ │
│ доки │ │ ИЛИ при клике на документ: │ │ ⚙️ Progress│
│ • file1 │ │ │ │ • Task3 │
│ │ │ ┌────────────────────────────────┐ │ │ │
│ ⬆️ Upload│ │ │ ДОКУМЕНТ (читаемый) │ │ ✅ Done │
│ [Browse]│ │ │ (scrollable) │ │ • Task4 │
│ [Drop] │ │ └────────────────────────────────┘ │ │ │
│ │ │ ┌────────────────────────────────┐ │ │ │
│ │ │ │ Чат (сжат до 10 строк) │ │ │ │
│ │ │ │ [🔼 Развернуть] │ │ │ │
│ │ │ └────────────────────────────────┘ │ │ │
│ │ └─────────────────────────────────────┘ │ │
└─────────┴───────────────────────────────────────────┴──────────┘
Вкладки сессий с индикацией активности
{
id: "piro-ozon-abc123",
project: "pirotehnika",
subproject: "ozon",
status: "active" | "idle" | "error",
lastActivity: "2025-12-25T10:30:00",
color: "green" | "yellow" | "red"
}
Особенности:
- Цвет вкладки зависит от статуса:
- 🟢 Green = активная работа (< 5 мин назад)
- 🟡 Yellow = простой (5-30 мин)
- 🔴 Red = давно не активна (> 30 мин)
- ⚡ Иконка молнии = сейчас идёт запрос к AI
Первая вкладка "Все сессии":
- Показывает список всех текущих сессий
- История (сессии < 1 мин не показываются)
- Для каждой: первое и последнее сообщение пользователя
Три секции:
📁 СОЗДАННЫЕ В ПРОЕКТЕ
• PROJECT.md
• ARCHITECTURE.md
• deploy.sh
• README.md
При клике:
- Документ открывается в центре
- Чат/терминал сжимается до 10 строк внизу
📥 ПОДГРУЖЕННЫЕ
• price_list.xlsx
• catalog_2025.csv
• images_pack.zip
⬆️ ЗАГРУЗИТЬ ФАЙЛ
[📎 Обзор...]
или перетащите сюда
─────────────────────
│ Drag & Drop │
│ Zone │
─────────────────────
API:
POST /api/projects/{id}/upload
FormData: file
Задачи проекта (из .queue/)
📋 ЗАДАЧИ ПРОЕКТА
⏳ ОЖИДАЮТ (3)
• Синхронизация FBS заказов
• Обновить прайсы
• Оптимизировать изображения
⚙️ В РАБОТЕ (1)
• Настройка автоотмены O2
✅ ВЫПОЛНЕНО (15)
Показать больше...
API:
GET /api/projects/{id}/tasks
→ {
pending: [...],
in_progress: [...],
done: [...]
}
Просмотр документа с одновременным чатом
Режим 1: Только чат (default)
┌─────────────────────────────────────┐
│ │
│ ЧАТ / ТЕРМИНАЛ │
│ (весь экран) │
│ │
└─────────────────────────────────────┘
Режим 2: Документ + сжатый чат
┌─────────────────────────────────────┐
│ ДОКУМЕНТ PROJECT.md │
│ ↕ scrollable, читаемый │
│ │
│ │
├─────────────────────────────────────┤
│ Чат (10 строк) │
│ > user: покажи этот файл │
│ < claude: [показан выше] │
│ [🔼 Развернуть чат на весь экран] │
└─────────────────────────────────────┘
Кнопка "Развернуть":
- Возвращает в режим 1 (весь экран = чат)
- Документ закрывается
Первая вкладка: обзор всех сессий
╔═══════════════════════════════════════════════╗
║ ВСЕ СЕССИИ ║
╠═══════════════════════════════════════════════╣
║ ║
║ 🟢 АКТИВНЫЕ ║
║ ──────────────────────────────────────── ║
║ piro-ozon | Пиротехника: OZON ║
║ ⏱ 2 мин назад ║
║ 👤 Последнее: "синхронизируй заказы FBS" ║
║ ║
║ platform-arch | Платформа: Architect ║
║ ⏱ 15 мин назад ║
║ 👤 Последнее: "создай стандарт модели..." ║
║ ║
║ 🟡 ИСТОРИЯ ║
║ ──────────────────────────────────────── ║
║ (сессии < 1 мин не показываются) ║
║ ║
║ #3 | pirotehnika | 12-25 05:52 ║
║ 👤 Первое: "Восстановление не работает" ║
║ 👤 Последнее: "продолжи с PIM" ║
║ [📖 Детали] [▶️ Продолжить] ║
║ ║
║ #5 | pirotehnika | 12-25 05:51 ║
║ 👤 Первое: "Продолжи работу с пим и 1с" ║
║ 👤 Последнее: "найди последнюю сессию..." ║
║ [📖 Детали] [▶️ Продолжить] ║
║ ║
╚═══════════════════════════════════════════════╝
# Сессии
GET /api/sessions → Список активных и история
GET /api/sessions/{id} → Детали сессии
POST /api/sessions/{id}/resume → Продолжить сессию
PUT /api/sessions/{id}/status → Обновить статус (active/idle)
# Задачи
GET /api/projects/{id}/tasks → Задачи из .queue/
POST /api/projects/{id}/tasks → Создать задачу
PUT /api/projects/{id}/tasks/{task_id}/status → Изменить статус
# Файлы
POST /api/projects/{id}/upload → Загрузить файл
GET /api/projects/{id}/documents → Список созданных/загруженных
class Session(Base):
id: str # session UUID
project_id: str # FK Project
status: str # active, idle, error
last_activity: datetime
first_message: str # первое сообщение user
last_message: str # последнее сообщение user
created_at: datetime
updated_at: datetime
class Task(Base):
id: str
project_id: str # FK Project
title: str
description: str
status: str # pending, in_progress, done, failed
created_at: datetime
completed_at: datetime?
class Document(Base):
id: str
project_id: str # FK Project
filename: str
path: str
type: str # created | uploaded
size: int
created_at: datetime
// Отправка статуса активности
ws.send({
type: 'activity',
timestamp: new Date().toISOString()
})
// Получение обновлений других сессий
ws.on('message', (msg) => {
if (msg.type === 'session_update') {
// Обновить цвет вкладки другой сессии
updateSessionTab(msg.session_id, msg.status)
}
})
/* Вкладки сессий */
.session-active {
background: linear-gradient(135deg, #00d084, #00b574);
border: 2px solid #00ff9d;
}
.session-idle {
background: linear-gradient(135deg, #ffd93d, #ffb800);
border: 2px solid #ffe066;
}
.session-error {
background: linear-gradient(135deg, #ff6b6b, #ee5a52);
border: 2px solid #ff8787;
}
.session-working {
/* Мигающая иконка молнии */
animation: pulse 1.5s infinite;
}
/* Задачи */
.task-pending { color: #868e96; }
.task-in-progress { color: #4dabf7; }
.task-done { color: #69db7c; }
.task-failed { color: #ff6b6b; }
.layout {
display: grid;
grid-template-areas:
"header header header"
"left center right";
grid-template-rows: 60px 1fr;
grid-template-columns: 250px 1fr 300px;
height: 100vh;
}
.header { grid-area: header; }
.left-sidebar { grid-area: left; overflow-y: auto; }
.center { grid-area: center; }
.right-sidebar { grid-area: right; overflow-y: auto; }
/* Режим "документ раскрыт" */
.center.document-mode {
display: grid;
grid-template-rows: 1fr 150px; /* документ + чат (10 строк) */
}
{
"dependencies": {
"@dnd-kit/core": "^6.1.0", // Drag & Drop
"@dnd-kit/sortable": "^8.0.0",
"markdown-it": "^14.0.0", // Рендер .md файлов
"highlight.js": "^11.9.0", // Подсветка кода
"date-fns": "^3.0.0" // Форматирование дат
}
}
# requirements.txt
python-multipart==0.0.6 # Для upload файлов
aiofiles==23.2.1 # Асинхронная работа с файлами
watchdog==4.0.0 # Мониторинг изменений файлов
Текущее состояние:
- ✅ OAuth, воркспейсы, проекты
- ✅ Чат WebSocket
- ✅ Терминал (xterm.js)
- ✅ Просмотр файлов
V2.0 добавит:
- ✨ Вкладки сессий с цветовой индикацией
- ✨ Боковые панели (документы + задачи)
- ✨ Drag & Drop загрузка
- ✨ Режим чтения документов
- ✨ История всех сессий
- ✨ Управление задачами проекта
Превращает в:
Полноценный профессиональный инструмент для работы с проектами через веб-браузер.
Версия: 2.0.0-planning
Дата: 2025-12-25