a1167df4f1
Backend: - User-Modell (sqlmodel) mit bcrypt-Passwort-Hash und is_admin-Flag - Job.owner_id (FK auf user.id), per Migration nachgerüstet (SQLite ALTER) - Starlette SessionMiddleware mit signiertem Cookie (SESSION_SECRET) - /api/auth: login / logout / me / needs-setup / setup (Initial-Admin) - /api/admin: User-CRUD + Passwort-Reset (Admin-only); letzter Admin / eigener Account vor Löschung geschützt - /api/jobs: Owner-Filter (Admin sieht alle inkl. owner_username), 404 statt 403 bei fremden Jobs (kein Existenz-Leak) Frontend: - Auth-Overlay mit Login bzw. Erst-Setup-Modus (auto-Detection) - Header zeigt User + Logout, Admin-Badge bei Admin-Konten - Admin-Karte: User anlegen, Passwort zurücksetzen, Löschen (mit Confirm) - 401 → Login-Overlay (auch bei XHR-Upload) Deploy: - install.sh generiert SESSION_SECRET einmalig per python-secrets - .env wird auf chmod 600 gesetzt - Erstaufruf zeigt automatisch das Setup-Formular; bestehende Jobs werden dem ersten Admin zugeordnet
129 lines
4.1 KiB
HTML
129 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Voice-Agent — Transkription</title>
|
|
<link rel="stylesheet" href="/static/style.css" />
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="header-row">
|
|
<div class="header-left">
|
|
<h1>Voice-Agent</h1>
|
|
<p class="sub">Sitzungsaufnahmen automatisch transkribieren und protokollieren</p>
|
|
</div>
|
|
<div class="header-right">
|
|
<div id="mac-status" class="badge">Mac-Backend: prüfe …</div>
|
|
<div id="user-bar" class="user-bar hidden">
|
|
<span class="muted">Angemeldet als</span>
|
|
<strong id="user-name"></strong>
|
|
<span id="user-admin-badge" class="badge admin-badge hidden">Admin</span>
|
|
<button type="button" id="logout-btn" class="btn-link">Abmelden</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Auth-Overlay (Login oder Erst-Setup) -->
|
|
<div id="auth-overlay" class="overlay hidden">
|
|
<div class="auth-card">
|
|
<h2 id="auth-title">Anmelden</h2>
|
|
<p id="auth-info" class="muted hidden"></p>
|
|
<form id="auth-form">
|
|
<label>
|
|
Benutzername
|
|
<input type="text" id="auth-username" autocomplete="username" required />
|
|
</label>
|
|
<label>
|
|
Passwort
|
|
<input type="password" id="auth-password" autocomplete="current-password" required />
|
|
</label>
|
|
<button type="submit" id="auth-submit">Anmelden</button>
|
|
</form>
|
|
<p id="auth-msg" class="msg"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<main id="app" class="hidden">
|
|
<section class="card">
|
|
<h2>Neue Aufnahme hochladen</h2>
|
|
<form id="upload-form">
|
|
<label>
|
|
Sitzungstitel (optional)
|
|
<input type="text" name="title" id="title" placeholder="z. B. Monatsbesprechung" />
|
|
</label>
|
|
<label>
|
|
Audiodatei (MP3, WAV, M4A, MP4, OGG, FLAC)
|
|
<input type="file" name="audio" id="audio" accept=".mp3,.wav,.m4a,.mp4,.ogg,.flac" required />
|
|
</label>
|
|
<button type="submit" id="submit-btn">Hochladen & verarbeiten</button>
|
|
</form>
|
|
<div id="upload-progress" class="hidden">
|
|
<div class="bar"><div class="bar-fill"></div></div>
|
|
<small class="muted">Upload läuft …</small>
|
|
</div>
|
|
<p id="upload-msg" class="msg"></p>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<h2>Jobs</h2>
|
|
<table id="jobs-table">
|
|
<thead>
|
|
<tr>
|
|
<th class="col-id">#</th>
|
|
<th class="col-title">Titel / Datei</th>
|
|
<th class="col-status">Status</th>
|
|
<th class="col-progress">Fortschritt</th>
|
|
<th class="col-updated">Aktualisiert</th>
|
|
<th class="col-dl">Downloads</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="jobs-body">
|
|
<tr><td colspan="6" class="muted">Noch keine Jobs.</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</section>
|
|
|
|
<!-- Nur sichtbar für Admins -->
|
|
<section id="admin-card" class="card hidden">
|
|
<h2>Benutzer verwalten</h2>
|
|
<form id="user-form" class="user-form">
|
|
<label>
|
|
Benutzername
|
|
<input type="text" id="new-username" autocomplete="off" required pattern="[A-Za-z0-9._@\-]+" />
|
|
</label>
|
|
<label>
|
|
Passwort (min. 8 Zeichen)
|
|
<input type="password" id="new-password" autocomplete="new-password" required minlength="8" />
|
|
</label>
|
|
<label class="inline-check">
|
|
<input type="checkbox" id="new-is-admin" />
|
|
Admin-Rechte
|
|
</label>
|
|
<button type="submit">Anlegen</button>
|
|
</form>
|
|
<p id="user-msg" class="msg"></p>
|
|
<table id="users-table">
|
|
<thead>
|
|
<tr>
|
|
<th>#</th>
|
|
<th>Benutzer</th>
|
|
<th>Rolle</th>
|
|
<th>Angelegt</th>
|
|
<th>Aktionen</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="users-body"></tbody>
|
|
</table>
|
|
</section>
|
|
</main>
|
|
|
|
<footer>
|
|
<small class="muted">DSGVO-konform, alles lokal verarbeitet.</small>
|
|
</footer>
|
|
|
|
<script src="/static/app.js"></script>
|
|
</body>
|
|
</html>
|