Personalakte als Aktenblatt, Status als Etiketten, Verknüpfen von beiden Seiten

Das Formular der Personalabteilung ist übernommen, nicht durch eine
Bildschirmansicht ersetzt: schwarzer Rahmen, Kopf mit Kennung und
Klassifizierungsbalken, Raster aus fünf Spalten, Unterschriftenzeilen,
Fußzeile. Es steht bewusst außerhalb des Design-Systems — es wird gedruckt und
muss auf Papier aussehen wie das Blatt daneben.

Datengetrieben bleibt es trotzdem. Kein Feld steht im Programm: sheetTitle und
sheetSubtitle an der Vorlage, span für die Zellbreite, rows für das Lichtbild,
dateKey für das Datum unter einer Unterschrift, slot für den
Klassifizierungsbalken. Eine weitere Dokumentart mit layout = DOSSIER braucht
keine Zeile Code.

Der Balken zeigt die Foundation-Stufe aus der neuen Tabelle
FoundationClearance. Sie ist Inhalt, kein Zugriff — was jemand sehen darf,
entscheidet weiterhin allein die interne Stufe. Ohne Auswahl bleibt der Balken
neutral, statt eine Einstufung zu behaupten.

Die Dienstnummer ist entfallen, es gibt sie nicht. Der Status ist zu mehreren
Etiketten geworden: "Gekündigt" und "Verhaftet" schließen einander nicht aus.
Unbekannte Schlüssel werden verworfen und die Reihenfolge kommt aus der
Konfiguration, nicht aus der Eingabe.

PersonnelAssignment hängt AfiS-Mitglieder an eine Person — Aktenführung,
Ermittler, Ansprechpartner — und ist zugleich der ausnahmsweise Zugang, wie
CaseParticipant bei der Fallakte. Betroffen zu sein gibt weiterhin keinen
Zugang: das ist eine Eigenschaft der Person, die Zuordnung eine Entscheidung
der Abteilung.

Fall und Person lassen sich von beiden Seiten verknüpfen und schon beim
Anlegen einer Fallakte. Alle drei Wege laufen in addParticipant zusammen.

Noch offen: das Lichtbild. Feldtyp und Platz stehen, hochladen kommt mit der
Prüfkette in Phase 5 — ein Bild als Data-URL im Abschnittswert verstiesse
gegen harte Regel 4.

102 Tests im Web-Paket, davon sechs auf dem gerenderten Blatt selbst.

web/app/(app)/personalakten/page.tsx

@@ -2,9 +2,10 @@ import type { Metadata } from 'next'
 import Link from 'next/link'
 import { db } from '@/lib/db'
 import { requirePermission } from '@/lib/auth/current'
-import { listPersonnelFiles } from '@/lib/personnel/service'
+import { listPersonnelFiles, listStatusTags } from '@/lib/personnel/service'
 import { de } from '@/lib/i18n/de'
 import { StampMark, classificationEdgeStyle } from '@/components/StampMark'
+import { StatusTags } from '@/components/StatusTags'
 
 export const metadata: Metadata = { title: de.personnel.listHeading }
 export const dynamic = 'force-dynamic'
@@ -19,15 +20,16 @@ export const dynamic = 'force-dynamic'
 export default async function PersonnelListPage({
   searchParams,
 }: {
-  searchParams: Promise<{ q?: string }>
+  searchParams: Promise<{ q?: string; status?: string }>
 }) {
   // Ohne das Recht gibt es die Seite nicht — 404, nicht 403.
   const user = await requirePermission('personnel.read')
-  const { q } = await searchParams
+  const { q, status } = await searchParams
 
-  const [{ files, total }, levels] = await Promise.all([
-    listPersonnelFiles(user.permissions, { query: q }),
+  const [{ files, total }, levels, statusTags] = await Promise.all([
+    listPersonnelFiles(user.permissions, { query: q, statusTag: status }),
     db.clearanceLevelConfig.findMany({ orderBy: { level: 'asc' } }),
+    listStatusTags(),
   ])
   const levelName = new Map(levels.map((l) => [l.level, l.name]))
   const darfAnlegen =
@@ -49,6 +51,7 @@ export default async function PersonnelListPage({
           aria-label={de.personnel.search}
           className="w-full max-w-sm border border-line bg-raised px-3 py-2 text-sm"
         />
+        {status ? <input type="hidden" name="status" value={status} /> : null}
         {darfAnlegen ? (
           <Link href="/personalakten/neu" className="ml-auto font-condensed text-xs">
             {de.personnel.create}
@@ -56,6 +59,21 @@ export default async function PersonnelListPage({
         ) : null}
       </form>
 
+      <nav className="mt-4 flex flex-wrap gap-3 font-condensed text-xs">
+        <Link href={q ? `/personalakten?q=${encodeURIComponent(q)}` : '/personalakten'}>
+          {de.personnel.filterAll}
+        </Link>
+        {statusTags.map((tag) => (
+          <Link
+            key={tag.key}
+            href={`/personalakten?${new URLSearchParams({ ...(q ? { q } : {}), status: tag.key })}`}
+            className={tag.key === status ? 'text-accent' : undefined}
+          >
+            {tag.name}
+          </Link>
+        ))}
+      </nav>
+
       {files.length === 0 ? (
         <p className="mt-10 text-text-dim">
           {q ? de.personnel.emptySearch : de.personnel.empty}
@@ -71,12 +89,10 @@ export default async function PersonnelListPage({
                 style={classificationEdgeStyle(akte.classification)}
               >
                 <span className="grow">{akte.displayName}</span>
-                {akte.serviceNumber ? (
-                  <span className="font-mono text-xs text-text-dim">{akte.serviceNumber}</span>
-                ) : null}
                 {akte.rank ? (
                   <span className="font-condensed text-2xs text-text-dim">{akte.rank}</span>
                 ) : null}
+                <StatusTags tags={akte.statusTags} known={statusTags} />
                 <StampMark
                   level={akte.classification}
                   name={levelName.get(akte.classification) ?? de.common.unknown}