8df14e3102
JWT login, org-scoped storage and RAG, admin/director/user roles, user-owned projects, login UI, and legacy data migration. Co-authored-by: Cursor <cursoragent@cursor.com>
150 lines
7.9 KiB
HTML
150 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Транскрибация совещаний</title>
|
||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🎙️</text></svg>">
|
||
<link rel="stylesheet" href="/static/styles.css">
|
||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/dompurify@3.2.4/dist/purify.min.js"></script>
|
||
<script src="/static/auth.js"></script>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<div class="header-top">
|
||
<div>
|
||
<h1>🎙️ Транскрибация совещаний</h1>
|
||
<p class="subtitle">Загрузите аудио или видео файл для получения протокола</p>
|
||
</div>
|
||
<div class="user-bar" id="userBar">
|
||
<span id="userInfo"></span>
|
||
<button type="button" id="logoutBtn" class="btn-secondary">Выйти</button>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
<section class="workspace-section" id="workspaceSection">
|
||
<div class="workspace-header">
|
||
<h2>📂 Мои проекты</h2>
|
||
<p class="workspace-hint">Создайте личный проект и работайте в нём: загрузка, протоколы, RAG-поиск.</p>
|
||
</div>
|
||
<div class="projects-panel">
|
||
<div id="myProjectsList" class="projects-list"></div>
|
||
<form id="createMyProjectForm" class="project-create-form">
|
||
<input type="text" id="myProjectSlug" placeholder="slug (например: gp-2026)" required>
|
||
<input type="text" id="myProjectName" placeholder="Название проекта" required>
|
||
<button type="submit">Создать проект</button>
|
||
</form>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="upload-section" id="uploadSection">
|
||
<div class="upload-controls">
|
||
<label>
|
||
Проект
|
||
<select id="uploadProjectSelect" required></select>
|
||
</label>
|
||
</div>
|
||
<div class="drop-zone" id="dropZone">
|
||
<div class="drop-zone-content">
|
||
<svg class="upload-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/>
|
||
<polyline points="17 8 12 3 7 8"/>
|
||
<line x1="12" y1="3" x2="12" y2="15"/>
|
||
</svg>
|
||
<p>Перетащите файлы сюда или <span class="browse-link">выберите</span></p>
|
||
<p class="hint">Поддерживаются: MP4, WEBM, AVI, MKV, MOV, WAV, MP3, M4A, OGG, FLAC</p>
|
||
</div>
|
||
<input type="file" id="fileInput" multiple accept=".mp4,.webm,.avi,.mkv,.mov,.wav,.mp3,.m4a,.ogg,.flac" hidden>
|
||
</div>
|
||
|
||
<div class="queue-status" id="queueStatus">
|
||
<div class="queue-status-header">
|
||
<h3>Очередь обработки</h3>
|
||
<span class="queue-summary" id="queueSummary">очередь пуста</span>
|
||
</div>
|
||
<div class="tasks-list" id="tasksList">
|
||
<p class="empty-state">Нет активных задач</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="results-section">
|
||
<div class="panel-left">
|
||
<h2>📁 Файлы</h2>
|
||
<div class="file-tree" id="fileTree">
|
||
<p class="empty-state">Нет обработанных файлов</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="panel-right">
|
||
<h2>📝 Просмотр</h2>
|
||
<div class="viewer" id="viewer">
|
||
<div class="empty-viewer">
|
||
<p>Выберите файл для просмотра</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="chat-section" id="chatSection">
|
||
<div class="chat-header">
|
||
<h2>🤖 Чат с базой знаний</h2>
|
||
<div class="chat-controls">
|
||
<select id="chatProjectSelect"></select>
|
||
<button id="chatClearBtn" title="Очистить историю">🗑️</button>
|
||
</div>
|
||
</div>
|
||
<div class="chat-messages" id="chatMessages">
|
||
<div class="chat-welcome">
|
||
<p>Здравствуйте! Я помогу найти информацию в протоколах совещаний.</p>
|
||
<p class="chat-hint" id="chatHint">Выберите проект для поиска.</p>
|
||
</div>
|
||
</div>
|
||
<div class="chat-input-row">
|
||
<input type="text" id="chatInput" placeholder="Задайте вопрос по протоколам совещаний..." autocomplete="off">
|
||
<button id="chatSendBtn">Отправить</button>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="admin-section" id="adminSection" hidden>
|
||
<h2>⚙️ Администрирование</h2>
|
||
<div class="admin-grid">
|
||
<div class="admin-card">
|
||
<h3>Пользователи</h3>
|
||
<div id="adminUsersList" class="admin-list"></div>
|
||
<form id="createUserForm" class="admin-form">
|
||
<input type="text" id="newUsername" placeholder="Логин" required>
|
||
<input type="password" id="newPassword" placeholder="Пароль" required>
|
||
<select id="newUserRole">
|
||
<option value="user">user — выбранные проекты</option>
|
||
<option value="director">director — все проекты и поиск</option>
|
||
<option value="admin">admin — полный доступ</option>
|
||
</select>
|
||
<input type="text" id="newUserProjects" placeholder="Общие org-проекты через запятую">
|
||
<p class="admin-hint" id="newUserProjectsHint"></p>
|
||
<button type="submit">Создать</button>
|
||
</form>
|
||
</div>
|
||
<div class="admin-card">
|
||
<h3>Проекты организации</h3>
|
||
<div id="adminProjectsList" class="admin-list"></div>
|
||
<form id="createProjectForm" class="admin-form">
|
||
<input type="text" id="newProjectSlug" placeholder="slug (2026)" required>
|
||
<input type="text" id="newProjectName" placeholder="Название" required>
|
||
<button type="submit">Добавить проект</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
</div>
|
||
|
||
<div class="toast-container" id="toastContainer"></div>
|
||
<script src="/static/app.js"></script>
|
||
</body>
|
||
</html>
|