Phase 4 abgeschlossen: Personalakten, Dokumente, Beteiligte, Verknüpfungen
Die Dokumentebene aus docs/13 ist gebaut, additiv: Document, DocumentSection und DocumentSectionVersion neben Case, CaseSection und CaseEntry. Ein Dokument hängt an einer Fallakte, an einer Personalakte oder an nichts, höchstens an einem — gesichert durch eine CHECK-Bedingung. Es gibt kein DELETE; eine Zurücknahme lässt einen Grabstein stehen, der auch für den Admin zu ist. Eine neue Dokumentart ist damit ein Datensatz, kein Deployment. Im Seed stehen vier: vermerk, vorfallsbericht, sonderarbeitsvertrag (mehrseitiger Vertragstext mit Platzhaltern und Unterschriftenzeilen) und bussgeld. Zwei Umbenennungen, beide von Hand migriert, damit die vorhandenen Zeilen und Zählerstände stehen bleiben: - CaseTemplate -> DocumentTemplate, plus uses[] und layout - CaseCounter -> NumberSeries, ein Nummernkreis je Präfix für Aktenzeichen und Dokumentnummern Die Regeln für Abschnitte stehen jetzt einmal in lib/sections/render.ts und gelten für Fallakten und Dokumente gleichermaßen. Die Frage aus docs/13, ob CaseSection langfristig in die Dokumentebene wandert, ist damit verneint und begründet. Rückverweise auf der Personalakte laufen durch visibleCaseWhere, die Zahl daneben entsteht aus dem gefilterten Ergebnis. Auch die Rollengruppe verschwindet mit, sonst verriete "Betroffener" ohne Eintrag die Ermittlung. Die eigene Personalakte ist keine Ausnahme von der Freigabestufe. Vier neue Rechte: document.create, .edit, .finalize, .retract. Das letzte steht bei den zurückgehaltenen, es greift in Geschriebenes ein. 91 Tests im Web-Paket, 15 in der Datenbank, 28 e2e. Größte Route 118 kB gegen das Budget von 120 kB — die Luft wird knapp. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
f5769ca58a
commit
d65cc95eb2
@@ -0,0 +1,266 @@
|
||||
'use client'
|
||||
|
||||
import { useActionState, useState, useTransition } from 'react'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import {
|
||||
reclassifyPersonnelAction,
|
||||
updatePersonnelAction,
|
||||
type ActionResult,
|
||||
} from '../actions'
|
||||
|
||||
type File = {
|
||||
id: string
|
||||
displayName: string
|
||||
serviceNumber: string | null
|
||||
rank: string | null
|
||||
department: string | null
|
||||
status: string | null
|
||||
note: string | null
|
||||
classification: number
|
||||
userId: string | null
|
||||
}
|
||||
|
||||
/**
|
||||
* Kopfdaten einer Personalakte: lesen und ändern in derselben Ansicht.
|
||||
*
|
||||
* Die Klassifizierung steht bewusst getrennt. Sie ändert, wer die Akte
|
||||
* überhaupt sieht, und eine Herabstufung braucht eine Begründung — das gehört
|
||||
* nicht in dasselbe Formular wie eine Korrektur der Dienstnummer.
|
||||
*/
|
||||
export function PersonnelHead({
|
||||
file,
|
||||
canEdit,
|
||||
levels,
|
||||
}: {
|
||||
file: File
|
||||
canEdit: boolean
|
||||
levels: { level: number; name: string }[]
|
||||
}) {
|
||||
const [editing, setEditing] = useState(false)
|
||||
const [state, action, pending] = useActionState<ActionResult | null, FormData>(
|
||||
updatePersonnelAction,
|
||||
null,
|
||||
)
|
||||
|
||||
if (!editing) {
|
||||
return (
|
||||
<div>
|
||||
<dl className="grid gap-x-8 gap-y-2 text-sm sm:grid-cols-2">
|
||||
<Zeile label={de.personnel.serviceNumber} value={file.serviceNumber} mono />
|
||||
<Zeile label={de.personnel.rank} value={file.rank} />
|
||||
<Zeile label={de.personnel.department} value={file.department} />
|
||||
<Zeile label={de.personnel.status} value={file.status} />
|
||||
<Zeile
|
||||
label={de.personnel.linkedAccount}
|
||||
value={file.userId ? file.userId : de.personnel.noAccount}
|
||||
mono={Boolean(file.userId)}
|
||||
/>
|
||||
</dl>
|
||||
|
||||
{file.note ? (
|
||||
<p className="mt-4 max-w-(--container-measure) border-l-(length:--spacing-edge) border-line pl-3 text-sm whitespace-pre-wrap">
|
||||
{file.note}
|
||||
</p>
|
||||
) : null}
|
||||
|
||||
{canEdit ? (
|
||||
<div className="mt-4 flex flex-wrap items-center gap-4">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setEditing(true)}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent"
|
||||
>
|
||||
{de.personnel.edit}
|
||||
</button>
|
||||
<Reclassify id={file.id} current={file.classification} levels={levels} />
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<form
|
||||
action={action}
|
||||
onSubmit={() => setEditing(false)}
|
||||
className="max-w-(--container-measure) space-y-4"
|
||||
>
|
||||
<input type="hidden" name="id" value={file.id} />
|
||||
<Feld id="displayName" label={de.personnel.name} defaultValue={file.displayName} required />
|
||||
<div className="grid gap-4 sm:grid-cols-2">
|
||||
<Feld
|
||||
id="serviceNumber"
|
||||
label={de.personnel.serviceNumber}
|
||||
defaultValue={file.serviceNumber}
|
||||
/>
|
||||
<Feld id="rank" label={de.personnel.rank} defaultValue={file.rank} />
|
||||
<Feld id="department" label={de.personnel.department} defaultValue={file.department} />
|
||||
<Feld id="status" label={de.personnel.status} defaultValue={file.status} />
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="note" className="font-condensed text-2xs text-text-dim">
|
||||
{de.personnel.note}
|
||||
</label>
|
||||
<textarea
|
||||
id="note"
|
||||
name="note"
|
||||
rows={3}
|
||||
defaultValue={file.note ?? ''}
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{state && !state.ok ? (
|
||||
<p className="font-condensed text-2xs text-stamp-4">{state.error}</p>
|
||||
) : null}
|
||||
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={pending}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent disabled:text-text-dim"
|
||||
>
|
||||
{pending ? de.common.loading : de.common.save}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setEditing(false)}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
>
|
||||
{de.common.cancel}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
)
|
||||
}
|
||||
|
||||
function Reclassify({
|
||||
id,
|
||||
current,
|
||||
levels,
|
||||
}: {
|
||||
id: string
|
||||
current: number
|
||||
levels: { level: number; name: string }[]
|
||||
}) {
|
||||
const [open, setOpen] = useState(false)
|
||||
const [to, setTo] = useState(current)
|
||||
const [reason, setReason] = useState('')
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [pending, startTransition] = useTransition()
|
||||
|
||||
const lowering = to < current
|
||||
|
||||
if (!open) {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOpen(true)}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
>
|
||||
{de.personnel.reclassify}
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="w-full border border-line p-3">
|
||||
<div className="flex flex-wrap items-center gap-3">
|
||||
<select
|
||||
value={to}
|
||||
onChange={(event) => setTo(Number(event.target.value))}
|
||||
aria-label={de.clearance.classification}
|
||||
className="border border-line bg-raised px-2 py-1 text-2xs"
|
||||
>
|
||||
{levels.map((level) => (
|
||||
<option key={level.level} value={level.level}>
|
||||
{level.level} · {level.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
<button
|
||||
type="button"
|
||||
disabled={pending || to === current}
|
||||
onClick={() =>
|
||||
startTransition(async () => {
|
||||
const result = await reclassifyPersonnelAction({ id, to, reason })
|
||||
if (result.ok) setOpen(false)
|
||||
else setError(result.error)
|
||||
})
|
||||
}
|
||||
className="border border-line bg-raised px-3 py-1 font-condensed text-2xs text-accent disabled:text-text-dim"
|
||||
>
|
||||
{de.common.save}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOpen(false)}
|
||||
className="font-condensed text-2xs text-text-dim"
|
||||
>
|
||||
{de.common.cancel}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Nur die Herabstufung braucht eine Begründung: sie macht die Akte für
|
||||
Leute sichtbar, die sie vorher nicht sehen durften. */}
|
||||
{lowering ? (
|
||||
<textarea
|
||||
value={reason}
|
||||
onChange={(event) => setReason(event.target.value)}
|
||||
rows={2}
|
||||
placeholder={de.case.reclassifyReason}
|
||||
aria-label={de.case.reclassifyReason}
|
||||
className="mt-2 block w-full border border-line bg-raised px-3 py-2 text-2xs"
|
||||
/>
|
||||
) : null}
|
||||
|
||||
{error ? <p className="mt-2 font-condensed text-2xs text-stamp-4">{error}</p> : null}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function Zeile({
|
||||
label,
|
||||
value,
|
||||
mono,
|
||||
}: {
|
||||
label: string
|
||||
value: string | null
|
||||
mono?: boolean
|
||||
}) {
|
||||
return (
|
||||
<div className="flex gap-3">
|
||||
<dt className="font-condensed text-xs text-text-dim">{label}</dt>
|
||||
<dd className={mono ? 'font-mono text-xs' : ''}>{value || '—'}</dd>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function Feld({
|
||||
id,
|
||||
label,
|
||||
defaultValue,
|
||||
required,
|
||||
}: {
|
||||
id: string
|
||||
label: string
|
||||
defaultValue?: string | null
|
||||
required?: boolean
|
||||
}) {
|
||||
return (
|
||||
<div>
|
||||
<label htmlFor={id} className="font-condensed text-2xs text-text-dim">
|
||||
{label}
|
||||
</label>
|
||||
<input
|
||||
id={id}
|
||||
name={id}
|
||||
required={required}
|
||||
minLength={required ? 2 : undefined}
|
||||
maxLength={120}
|
||||
defaultValue={defaultValue ?? ''}
|
||||
className="mt-1 block w-full border border-line bg-raised px-3 py-2 text-sm"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
import { Skeleton, SkeletonLine } from '@/components/Skeleton'
|
||||
|
||||
export default function Loading() {
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<div className="pl-3">
|
||||
<Skeleton className="h-[0.9rem]" width="8rem" />
|
||||
<div className="mt-2">
|
||||
<Skeleton className="h-[1.6rem]" width="18rem" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-8 space-y-3">
|
||||
<Skeleton className="h-[1.1rem]" width="7rem" />
|
||||
<SkeletonLine width="60%" />
|
||||
<SkeletonLine width="45%" />
|
||||
</div>
|
||||
<div className="mt-10 space-y-3">
|
||||
<Skeleton className="h-[1.1rem]" width="9rem" />
|
||||
<SkeletonLine width="70%" />
|
||||
</div>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,188 @@
|
||||
import type { Metadata } from 'next'
|
||||
import { Suspense } from 'react'
|
||||
import Link from 'next/link'
|
||||
import { notFound } from 'next/navigation'
|
||||
import { db } from '@/lib/db'
|
||||
import { requirePermission } from '@/lib/auth/current'
|
||||
import { recordRead, READ_AUDIT_FROM_LEVEL } from '@/lib/audit'
|
||||
import { loadBacklinks, loadVisiblePersonnelFile } from '@/lib/personnel/service'
|
||||
import { listDocuments, listTemplatesFor } from '@/lib/documents/service'
|
||||
import { canWritePersonnel } from '@/lib/access/documentWrite'
|
||||
import { de } from '@/lib/i18n/de'
|
||||
import { StampMark, classificationEdgeStyle } from '@/components/StampMark'
|
||||
import { SkeletonLine } from '@/components/Skeleton'
|
||||
import { DocumentList } from '@/components/documents/DocumentList'
|
||||
import { NewDocument } from '@/components/documents/NewDocument'
|
||||
import { PersonnelHead } from './PersonnelHead'
|
||||
import type { EffectivePermissions } from '@/lib/auth/permissions'
|
||||
|
||||
export const dynamic = 'force-dynamic'
|
||||
|
||||
export async function generateMetadata({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ id: string }>
|
||||
}): Promise<Metadata> {
|
||||
const user = await requirePermission('personnel.read')
|
||||
const { id } = await params
|
||||
const akte = await loadVisiblePersonnelFile(user.permissions, id)
|
||||
return { title: akte?.displayName ?? de.personnel.one }
|
||||
}
|
||||
|
||||
/**
|
||||
* Rückverweise: die Fälle, in denen diese Person vorkommt.
|
||||
*
|
||||
* Streamt in einer eigenen Suspense-Grenze nach, weil die Abfrage über die
|
||||
* Sichtbarkeitsprüfung der Fallakten läuft und damit die teuerste auf dieser
|
||||
* Seite ist. Die Kopfdaten stehen währenddessen schon.
|
||||
*/
|
||||
async function Backlinks({
|
||||
file,
|
||||
permissions,
|
||||
}: {
|
||||
file: { id: string; userId: string | null }
|
||||
permissions: EffectivePermissions
|
||||
}) {
|
||||
const { total, byRole } = await loadBacklinks(permissions, file)
|
||||
|
||||
if (total === 0) {
|
||||
return <p className="text-text-dim">{de.personnel.backlinksEmpty}</p>
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{byRole.map(({ role, eintraege }) => (
|
||||
<div key={role}>
|
||||
<h3 className="font-condensed text-xs text-text-dim">
|
||||
{de.participant.roles[role] ?? role}
|
||||
</h3>
|
||||
<ul className="mt-2 border-t border-line">
|
||||
{eintraege.map(({ case: akte }) => (
|
||||
<li key={`${role}:${akte.id}`} className="border-b border-line">
|
||||
<Link
|
||||
href={`/faelle/${akte.caseNumber}`}
|
||||
prefetch
|
||||
className="flex flex-wrap items-baseline gap-x-4 gap-y-1 py-2 pl-3 text-text no-underline"
|
||||
style={classificationEdgeStyle(akte.classification)}
|
||||
>
|
||||
<span className="font-mono text-xs text-text-dim">{akte.caseNumber}</span>
|
||||
<span className="grow">{akte.title}</span>
|
||||
<span className="font-condensed text-2xs text-text-dim">
|
||||
{de.case.statusNames[akte.status]}
|
||||
</span>
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
async function Documents({
|
||||
file,
|
||||
permissions,
|
||||
canEdit,
|
||||
}: {
|
||||
file: { id: string; classification: number }
|
||||
permissions: EffectivePermissions
|
||||
canEdit: boolean
|
||||
}) {
|
||||
const [documents, templates, levels] = await Promise.all([
|
||||
listDocuments(permissions, { personnelFileId: file.id }),
|
||||
canEdit ? listTemplatesFor('PERSON_DOCUMENT') : Promise.resolve([]),
|
||||
db.clearanceLevelConfig.findMany({ orderBy: { level: 'asc' } }),
|
||||
])
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<DocumentList
|
||||
documents={documents}
|
||||
levelName={new Map(levels.map((l) => [l.level, l.name]))}
|
||||
/>
|
||||
{canEdit ? (
|
||||
<NewDocument
|
||||
templates={templates}
|
||||
levels={levels.filter((l) => l.level <= permissions.clearanceLevel)}
|
||||
defaultLevel={Math.min(file.classification, permissions.clearanceLevel)}
|
||||
personnelFileId={file.id}
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default async function PersonnelPage({ params }: { params: Promise<{ id: string }> }) {
|
||||
const user = await requirePermission('personnel.read')
|
||||
const { id } = await params
|
||||
|
||||
const akte = await loadVisiblePersonnelFile(user.permissions, id)
|
||||
// Kein Zugriff heisst 404, nicht 403: die Existenz ist selbst eine Information.
|
||||
if (!akte) notFound()
|
||||
|
||||
// Harte Regel 3: jeder Lesezugriff ab Stufe 3 wird protokolliert.
|
||||
if (akte.classification >= READ_AUDIT_FROM_LEVEL) {
|
||||
recordRead({
|
||||
actorId: user.id,
|
||||
action: 'personnel.read',
|
||||
targetType: 'PersonnelFile',
|
||||
targetId: akte.id,
|
||||
clearanceAtTime: user.permissions.clearanceLevel,
|
||||
meta: { displayName: akte.displayName, classification: akte.classification },
|
||||
})
|
||||
}
|
||||
|
||||
const levels = await db.clearanceLevelConfig.findMany({ orderBy: { level: 'asc' } })
|
||||
const level = levels.find((l) => l.level === akte.classification)
|
||||
const canEdit = canWritePersonnel(user.permissions, akte.classification).ok
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-5xl px-6 py-10">
|
||||
<header className="pl-3" style={classificationEdgeStyle(akte.classification)}>
|
||||
<div className="flex flex-wrap items-baseline gap-x-4 gap-y-2">
|
||||
<span className="font-condensed text-xs text-text-dim">{de.personnel.one}</span>
|
||||
<StampMark level={akte.classification} name={level?.name ?? de.common.unknown} />
|
||||
</div>
|
||||
<h1 className="mt-2 font-condensed">{akte.displayName}</h1>
|
||||
</header>
|
||||
|
||||
<section className="mt-8">
|
||||
<h2 className="font-condensed">{de.personnel.headData}</h2>
|
||||
<div className="mt-4">
|
||||
<PersonnelHead
|
||||
file={akte}
|
||||
canEdit={canEdit}
|
||||
levels={levels.filter((l) => l.level <= user.permissions.clearanceLevel)}
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="mt-10">
|
||||
<h2 className="font-condensed">{de.document.heading}</h2>
|
||||
<div className="mt-4">
|
||||
<Suspense fallback={<SkeletonLine width="60%" />}>
|
||||
<Documents file={akte} permissions={user.permissions} canEdit={canEdit} />
|
||||
</Suspense>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="mt-10">
|
||||
<h2 className="font-condensed">{de.personnel.backlinks}</h2>
|
||||
<div className="mt-4">
|
||||
<Suspense
|
||||
fallback={
|
||||
<div className="space-y-3">
|
||||
<SkeletonLine width="8rem" />
|
||||
<SkeletonLine width="70%" />
|
||||
<SkeletonLine width="55%" />
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<Backlinks file={akte} permissions={user.permissions} />
|
||||
</Suspense>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user