marcel/familienarchiv
1
0
Fork 0
Code Issues 119 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

style(admin/ocr): center content with max-w-4xl, wrap history tables in cards
Some checks failed
CI / OCR Service Tests (push) Successful in 39s
Details
CI / Unit & Component Tests (push) Failing after 2m34s
Details
CI / Backend Unit Tests (push) Failing after 2m45s
Details
CI / Unit & Component Tests (pull_request) Failing after 2m33s
Details
CI / OCR Service Tests (pull_request) Successful in 40s
Details
CI / Backend Unit Tests (pull_request) Failing after 2m51s
Details

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-18 10:33:39 +02:00
parent 16bcd0f73c
commit 8128769feb
3 changed files with 88 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
frontend/src/routes/admin/ocr/+page.svelte
View File

@@ -9,39 +9,41 @@ let { data }: { data: PageData } = $props();
const { trainingInfo } = $derived(data);
</script>
<div class="flex flex-col gap-6 p-6">
<!-- Page title + health bar -->
<div class="flex items-center justify-between">
<h1 class="font-sans text-lg font-bold tracking-widest text-brand-navy uppercase">
{m.admin_tab_ocr()}
</h1>
<OcrHealthBar ocrServiceAvailable={trainingInfo.ocrServiceAvailable ?? false} />
</div>
<!-- Stats -->
<OcrStatCards
availableBlocks={trainingInfo.availableBlocks ?? 0}
totalOcrBlocks={trainingInfo.totalOcrBlocks ?? 0}
availableDocuments={trainingInfo.availableDocuments ?? 0}
availableSegBlocks={trainingInfo.availableSegBlocks ?? 0}
/>
<!-- Sender models -->
<div>
<div class="mb-3 flex items-center justify-between">
<h2 class="text-xs font-bold tracking-widest text-gray-400 uppercase">
{m.ocr_sender_models_heading()}
</h2>
<a
href="/admin/ocr/global"
class="text-xs font-medium text-brand-navy/60 transition-colors hover:text-brand-navy focus-visible:rounded-sm focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
{m.ocr_global_history_link()}
</a>
<div class="flex-1 overflow-y-auto p-6">
<div class="mx-auto flex max-w-4xl flex-col gap-6">
<!-- Page title + health bar -->
<div class="flex items-center justify-between">
<h1 class="font-sans text-lg font-bold tracking-widest text-brand-navy uppercase">
{m.admin_tab_ocr()}
</h1>
<OcrHealthBar ocrServiceAvailable={trainingInfo.ocrServiceAvailable ?? false} />
</div>
<OcrModelsTable
senderModels={trainingInfo.senderModels ?? []}
personNames={trainingInfo.personNames ?? {}}
<!-- Stats -->
<OcrStatCards
availableBlocks={trainingInfo.availableBlocks ?? 0}
totalOcrBlocks={trainingInfo.totalOcrBlocks ?? 0}
availableDocuments={trainingInfo.availableDocuments ?? 0}
availableSegBlocks={trainingInfo.availableSegBlocks ?? 0}
/>
<!-- Sender models -->
<div>
<div class="mb-3 flex items-center justify-between">
<h2 class="text-xs font-bold tracking-widest text-gray-400 uppercase">
{m.ocr_sender_models_heading()}
</h2>
<a
href="/admin/ocr/global"
class="text-xs font-medium text-brand-navy/60 transition-colors hover:text-brand-navy focus-visible:rounded-sm focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
{m.ocr_global_history_link()}
</a>
</div>
<OcrModelsTable
senderModels={trainingInfo.senderModels ?? []}
personNames={trainingInfo.personNames ?? {}}
/>
</div>
</div>
</div>

47
frontend/src/routes/admin/ocr/[personId]/+page.svelte
View File

@@ -7,26 +7,33 @@ let { data }: { data: PageData } = $props();
const personName = $derived(data.history.personNames?.[data.personId] ?? 'Unknown');
</script>
<div class="flex flex-col gap-6 p-6">
<div class="flex items-center gap-4">
<a
href="/admin/ocr"
class="group inline-flex items-center text-xs font-bold tracking-widest text-gray-500 uppercase transition-colors hover:text-brand-navy focus-visible:rounded-sm focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
<svg
class="mr-2 h-4 w-4 transform transition-transform group-hover:-translate-x-1"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
stroke-width="2"
><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" /></svg
<div class="flex-1 overflow-y-auto p-6">
<div class="mx-auto flex max-w-4xl flex-col gap-6">
<div class="flex items-center gap-4">
<a
href="/admin/ocr"
class="group inline-flex items-center text-xs font-bold tracking-widest text-gray-500 uppercase transition-colors hover:text-brand-navy focus-visible:rounded-sm focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
{m.admin_tab_ocr()}
</a>
<h1 class="font-sans text-lg font-bold tracking-widest text-brand-navy uppercase">
{personName}
</h1>
</div>
<svg
class="mr-2 h-4 w-4 transform transition-transform group-hover:-translate-x-1"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
stroke-width="2"
><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" /></svg
>
{m.admin_tab_ocr()}
</a>
<h1 class="font-sans text-lg font-bold tracking-widest text-brand-navy uppercase">
{personName}
</h1>
</div>
<TrainingHistory runs={data.history.runs ?? []} personNames={data.history.personNames ?? {}} />
<div class="border-brand-sand rounded-sm border bg-white p-6 shadow-sm">
<TrainingHistory
runs={data.history.runs ?? []}
personNames={data.history.personNames ?? {}}
/>
</div>
</div>
</div>

47
frontend/src/routes/admin/ocr/global/+page.svelte
View File

@@ -6,26 +6,33 @@ import * as m from '$lib/paraglide/messages.js';
let { data }: { data: PageData } = $props();
</script>
<div class="flex flex-col gap-6 p-6">
<div class="flex items-center gap-4">
<a
href="/admin/ocr"
class="group inline-flex items-center text-xs font-bold tracking-widest text-gray-500 uppercase transition-colors hover:text-brand-navy focus-visible:rounded-sm focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
<svg
class="mr-2 h-4 w-4 transform transition-transform group-hover:-translate-x-1"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
stroke-width="2"
><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" /></svg
<div class="flex-1 overflow-y-auto p-6">
<div class="mx-auto flex max-w-4xl flex-col gap-6">
<div class="flex items-center gap-4">
<a
href="/admin/ocr"
class="group inline-flex items-center text-xs font-bold tracking-widest text-gray-500 uppercase transition-colors hover:text-brand-navy focus-visible:rounded-sm focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
{m.admin_tab_ocr()}
</a>
<h1 class="font-sans text-lg font-bold tracking-widest text-brand-navy uppercase">
{m.ocr_global_history_heading()}
</h1>
</div>
<svg
class="mr-2 h-4 w-4 transform transition-transform group-hover:-translate-x-1"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
stroke-width="2"
><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" /></svg
>
{m.admin_tab_ocr()}
</a>
<h1 class="font-sans text-lg font-bold tracking-widest text-brand-navy uppercase">
{m.ocr_global_history_heading()}
</h1>
</div>
<TrainingHistory runs={data.history.runs ?? []} personNames={data.history.personNames ?? {}} />
<div class="border-brand-sand rounded-sm border bg-white p-6 shadow-sm">
<TrainingHistory
runs={data.history.runs ?? []}
personNames={data.history.personNames ?? {}}
/>
</div>
</div>
</div>