Brummel
3bb2d23adb
This commit separates the case detail page into two distinct routes:
`/web/cases/{case_id}` for the main case information and document, and
`/web/cases/{case_id}/recordings` for a dedicated view of audio files
and their transcripts.
This change improves the organization and clarity of the case viewing
experience by segmenting the related but distinct information into their
own UI sections.
66 lines
2.3 KiB
HTML
66 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Doctate — Aufnahmen Fall {{ case_id_short }}</title>
|
|
<style>
|
|
body { font-family: sans-serif; max-width: 900px; margin: 2em auto; padding: 0 1em; }
|
|
header { display: flex; justify-content: space-between; align-items: center; }
|
|
header form { margin: 0; }
|
|
.back { color: #4a90e2; text-decoration: none; }
|
|
.oneliner { font-size: 1.1em; color: #222; margin: 0.6em 0 1em; }
|
|
.meta { color: #666; font-family: monospace; font-size: 0.9em; }
|
|
.recording { margin: 1em 0; padding: 0.7em; border: 1px solid #ddd; border-radius: 4px; }
|
|
.recording.failed-row { background: #fff7f7; border-left: 3px solid #e24a4a; }
|
|
.recording-head { display: flex; align-items: center; gap: 1em; flex-wrap: wrap; }
|
|
.recording-head span { font-family: monospace; font-size: 0.9em; min-width: 20em; }
|
|
.transcript { margin: 0.6em 0 0; padding: 0.6em; background: #f6f6f6; border-radius: 4px; white-space: pre-wrap; font-family: serif; }
|
|
.pending { color: #888; font-style: italic; margin-top: 0.5em; }
|
|
.failed { color: #b00; font-weight: bold; margin-top: 0.5em; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div><a class="back" href="/web/cases/{{ case_id }}">← Fall {{ case_id_short }}</a></div>
|
|
<form method="post" action="/web/logout"><button type="submit">Logout</button></form>
|
|
</header>
|
|
<h1>Aufnahmen</h1>
|
|
{% match oneliner %}
|
|
{% when Some with (t) %}
|
|
<div class="oneliner">{{ t }}</div>
|
|
{% when None %}
|
|
{% endmatch %}
|
|
<div class="meta">{{ case_id }}</div>
|
|
|
|
<h2>Aufnahmen ({{ recordings.len() }})</h2>
|
|
{% for rec in recordings %}
|
|
<div class="recording{% if rec.failed %} failed-row{% endif %}">
|
|
<div class="recording-head">
|
|
<span>{{ rec.filename }}</span>
|
|
<audio controls preload="none">
|
|
<source src="/web/audio/{{ slug }}/{{ case_id }}/{{ rec.filename }}" type="audio/mp4">
|
|
</audio>
|
|
</div>
|
|
{% if rec.failed %}
|
|
<div class="failed">Transkription fehlgeschlagen — .failed-Suffix entfernen zum Erneut-Versuchen.</div>
|
|
{% else %}
|
|
{% match rec.transcript %}
|
|
{% when Some with (t) %}
|
|
{% if t.is_empty() %}
|
|
<div class="pending">(stille Aufnahme)</div>
|
|
{% else %}
|
|
<div class="transcript">{{ t }}</div>
|
|
{% endif %}
|
|
{% when None %}
|
|
{% if transcribe_busy %}
|
|
<div class="pending">Transkription läuft…</div>
|
|
{% else %}
|
|
<div class="pending">Transkription ausstehend.</div>
|
|
{% endif %}
|
|
{% endmatch %}
|
|
{% endif %}
|
|
</div>
|
|
{% endfor %}
|
|
</body>
|
|
</html>
|