Den Notfallkontakt an Ort und Stelle anlegen statt ueber "Daten aendern"

Bei den Angehoerigen steht ein "+ Hinzufuegen", beim Notfallkontakt stand
nichts: der einzige Weg zu einer Telefonnummer fuehrte ueber ein Formular
ueber saemtliche Stammdaten. Jetzt steht der Knopf an derselben Stelle,
mit einem Fenster fuer Name, Telefonnummer und Verhaeltnis; ist ein
Kontakt hinterlegt, heisst er "Aendern" und daneben laesst er sich
entfernen.

Geschrieben wird ueber dieselbe Funktion wie in "Daten aendern" --
change_employee_data mit nur den drei Feldern. Der Eintrag landet damit
in der Historie und im Protokoll wie jede andere Stammdatenaenderung. Die
Datenbank fasst nur die Felder an, die im Aufruf stehen: sie prueft auf
das Vorhandensein des Schluessels, nicht auf seinen Wert (Migration
20260917120000, Zeilen 209-211). Adresse, E-Mail und der Rest bleiben
unberuehrt.

components/employees/NotfallkontaktModal.tsx

@@ -0,0 +1,108 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { changeEmployeeData } from "@/actions/employees";
+import { Button } from "@/components/ui/Button";
+import { TextField } from "@/components/ui/Field";
+import { Modal } from "@/components/ui/Modal";
+import { useToast } from "@/components/ui/Toast";
+import { todayIso } from "@/lib/format";
+
+// Der Notfallkontakt, ohne den Umweg über „Daten ändern".
+//
+// Geschrieben wird über dieselbe Funktion wie dort: change_employee_data mit
+// **nur** den drei Feldern im Abschnitt `person`. Das ist keine Abkürzung,
+// sondern die Bedingung dafür, dass der Eintrag in der Historie und im
+// Protokoll landet wie jede andere Stammdatenänderung. Die Datenbank fasst
+// ausschliesslich die Felder an, die im Aufruf stehen — sie prüft auf das
+// Vorhandensein des Schlüssels, nicht auf seinen Wert (Migration
+// 20260917120000). Adresse, E-Mail und der Rest bleiben deshalb unberührt.
+
+export type Notfallkontakt = {
+  name: string | null;
+  telefon: string | null;
+  verhaeltnis: string | null;
+};
+
+export function NotfallkontaktModal({
+  open,
+  onClose,
+  employeeId,
+  kontakt,
+}: {
+  open: boolean;
+  onClose: () => void;
+  employeeId: string;
+  kontakt: Notfallkontakt;
+}) {
+  const { showToast } = useToast();
+  const router = useRouter();
+  const [name, setName] = useState(kontakt.name ?? "");
+  const [telefon, setTelefon] = useState(kontakt.telefon ?? "");
+  const [verhaeltnis, setVerhaeltnis] = useState(kontakt.verhaeltnis ?? "");
+  const [effectiveDate, setEffectiveDate] = useState(todayIso());
+  const [pending, setPending] = useState(false);
+
+  const vorhanden = Boolean(kontakt.name);
+
+  async function handleSubmit() {
+    // Name und Telefonnummer gehören zusammen: ein Name ohne Nummer hilft im
+    // Ernstfall niemandem, eine Nummer ohne Namen sagt nicht, wen man dran
+    // hat.
+    if (!name.trim() || !telefon.trim()) {
+      showToast("Name und Telefonnummer sind nötig.", "error");
+      return;
+    }
+    setPending(true);
+    const result = await changeEmployeeData({
+      employee_id: employeeId,
+      effective_date: effectiveDate,
+      person: {
+        emergency_contact_name: name.trim(),
+        emergency_contact_phone: telefon.trim(),
+        emergency_contact_relation: verhaeltnis.trim(),
+      },
+      contract: {},
+      role: {},
+    });
+    setPending(false);
+    if (result.success) {
+      showToast(vorhanden ? "Notfallkontakt geändert." : "Notfallkontakt hinterlegt.");
+      router.refresh();
+      onClose();
+    } else {
+      showToast(result.error ?? "Fehler beim Speichern.", "error");
+    }
+  }
+
+  return (
+    <Modal
+      open={open}
+      onClose={onClose}
+      title={vorhanden ? "Notfallkontakt ändern" : "Notfallkontakt hinterlegen"}
+      footer={
+        <>
+          <Button variant="ghost" onClick={onClose}>
+            Abbrechen
+          </Button>
+          <Button onClick={handleSubmit} pending={pending}>
+            Speichern
+          </Button>
+        </>
+      }
+    >
+      <div className="flex flex-col gap-4">
+        <TextField label="Wirksam ab" required type="date" value={effectiveDate} onChange={setEffectiveDate} />
+        <TextField label="Name" required value={name} onChange={setName} />
+        <TextField label="Telefonnummer" required type="tel" value={telefon} onChange={setTelefon} />
+        <TextField
+          label="Verhältnis"
+          value={verhaeltnis}
+          onChange={setVerhaeltnis}
+          hint="Zum Beispiel Gattin, Bruder, Freundin."
+        />
+      </div>
+    </Modal>
+  );
+}