Files
alpenwerk-hr/components/employees/panels/DatenAendernPanel.tsx
Andrei Laas c3e19606e2
All checks were successful
CI / Lint, Typen, Tests, Build (push) Successful in 11m58s
CI / Migrationen auf leerer Datenbank (push) Successful in 10m24s
Die Cornerstone-ID als eigenes, freiwilliges Feld
Cornerstone fuehrt jede Person unter einer eigenen Kennung. Der Export
dorthin trug in "User ID" und "Username" bisher die Alpenwerk-UUID --
richtig, solange es nichts Besseres gab, aber nicht die Kennung, unter
der Cornerstone die Person kennt. Jetzt steht dort diese Spalte.

Freiwillig, weil die Zuordnungstabelle des Kunden fuer 434 der 784
Personen keine Kennung liefert. Eindeutig, weil eine Kennung genau einer
Person gehoert. Als Text, weil fuehrende Nullen in einer numerischen
Spalte verlorengingen.

Ohne hinterlegte Kennung bleiben User ID und Username **leer**. Ein
Rueckfall auf die UUID braechte zwei Kennungsarten in eine Datei, ohne
dass es auffiele, und legte in Cornerstone eine zweite Person neben der
bestehenden an. Eine fehlende Angabe soll fehlen; dafuer gibt es einen
eigenen Test.

Fuenf Funktionen mussten mit -- dieselbe Liste und derselbe Grund wie bei
der Firmen-E-Mail: hire_employee und rehire_employee teilen sich den
Schritt "Person", change_employee_data macht das Feld aenderbar,
apply_due_pending_changes sorgt dafuer, dass eine datierte Aenderung
nicht verfaellt, app_feld_karte haelt den Eintrag in der Historie
richtigstellbar. Die Migration ist wieder erzeugt, nicht abgeschrieben,
und prueft jede der fuenf einzeln.

Erfasst wird das Feld in der Akte, in "Daten aendern", bei Einstellung
und Wiedereintritt sowie ueber den Massenimport; es steht im
Mitarbeiterexport und fuellt im Cornerstone-Export User ID und Username.
2026-09-28 10:13:52 +02:00

404 lines
18 KiB
TypeScript

"use client";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { changeEmployeeData } from "@/actions/employees";
import { AngehoerigeSection } from "@/components/employees/AngehoerigeSection";
import { RoleEmploymentFields, type RoleEmploymentValue } from "@/components/employees/RoleEmploymentFields";
import { SvNummerField } from "@/components/employees/SvNummerField";
import { TitleFields, type TitleValue } from "@/components/employees/TitleFields";
import { Button } from "@/components/ui/Button";
import { CountryPicker } from "@/components/ui/CountryPicker";
import { Field, SelectField, TextField } from "@/components/ui/Field";
import { SlideOver } from "@/components/ui/SlideOver";
import { useToast } from "@/components/ui/Toast";
import { brauchtAufenthaltstitel, UN_COUNTRIES } from "@/lib/countries";
import { STUNDEN_GRUENDE } from "@/lib/absence";
import { GRUND_BEGUENSTIGT_BEHINDERT } from "@/lib/kuendigungsschutz";
import { MITARBEITERART_STANDARD } from "@/lib/mitarbeiterart";
import { fmtFullName, todayIso } from "@/lib/format";
import { isValidSvnr, requiresAustrianSvnr } from "@/lib/svnr";
import { NotfallkontaktSection } from "@/components/employees/NotfallkontaktSection";
import type { ContractType, Database, EmploymentType, GenderType } from "@/lib/types";
type EmployeeRow = Database["public"]["Tables"]["employees"]["Row"];
type Dependent = Database["public"]["Tables"]["employee_dependents"]["Row"];
export function DatenAendernPanel({
open,
onClose,
employee,
dependents,
locationCountry,
}: {
open: boolean;
onClose: () => void;
employee: EmployeeRow;
dependents: Dependent[];
locationCountry: string | null | undefined;
}) {
const { showToast } = useToast();
const router = useRouter();
const [pending, setPending] = useState(false);
// The DB trigger would reject a bad number anyway; catching it here keeps
// the whole effective-dated change from being thrown away on submit.
const [effectiveDate, setEffectiveDate] = useState(todayIso);
const [firstName, setFirstName] = useState(employee.first_name);
const [lastName, setLastName] = useState(employee.last_name);
const [titles, setTitles] = useState<TitleValue>({ titlePrefix: employee.title_prefix ?? [], titleSuffix: employee.title_suffix ?? [] });
function updateTitles(patch: Partial<TitleValue>) {
setTitles((prev) => ({ ...prev, ...patch }));
}
const [gender, setGender] = useState<GenderType>(employee.gender);
const [birthDate, setBirthDate] = useState(employee.birth_date);
const [svNummer, setSvNummer] = useState(employee.sv_nummer ?? "");
const svNummerOk =
!svNummer.trim() || !requiresAustrianSvnr(locationCountry) || isValidSvnr(svNummer, birthDate || null);
const [nationality, setNationality] = useState(employee.nationality);
const [hatTitel, setHatTitel] = useState(employee.hat_aufenthaltstitel ?? false);
const [titelBis, setTitelBis] = useState(employee.aufenthaltstitel_bis ?? "");
// Die Staatsbürgerschaft entscheidet, ob die Frage überhaupt gestellt wird.
const titelNoetig = brauchtAufenthaltstitel(nationality);
const [address, setAddress] = useState(employee.address ?? "");
const [postalCode, setPostalCode] = useState(employee.postal_code ?? "");
const [city, setCity] = useState(employee.city ?? "");
const [addressCountry, setAddressCountry] = useState(employee.address_country ?? "Österreich");
const [email, setEmail] = useState(employee.email ?? "");
const [companyEmail, setCompanyEmail] = useState(employee.company_email ?? "");
const [cornerstoneId, setCornerstoneId] = useState(employee.cornerstone_id ?? "");
const [phone, setPhone] = useState(employee.phone ?? "");
const [employmentType, setEmploymentType] = useState<EmploymentType>(employee.employment_type);
const [weeklyHours, setWeeklyHours] = useState(String(employee.weekly_hours));
// Der Grund wird erst gefragt, wenn sich die Stunden tatsächlich ändern —
// sonst stünde bei jeder Adressänderung eine Frage im Weg, die niemand
// gestellt hat.
const [stundenGrund, setStundenGrund] = useState<string>(STUNDEN_GRUENDE[0]);
const stundenGeaendert = Number(weeklyHours) !== Number(employee.weekly_hours);
const [teilzeitBis, setTeilzeitBis] = useState(employee.teilzeit_bis ?? "");
const [contractType, setContractType] = useState<ContractType>(employee.contract_type);
const [contractEndDate, setContractEndDate] = useState(employee.contract_end_date ?? "");
const [role, setRole] = useState<RoleEmploymentValue>({
workerType: employee.worker_type ?? "Angestellte:r",
mitarbeiterart: employee.mitarbeiterart ?? MITARBEITERART_STANDARD,
// Hier gesetzt und im Assistenten nicht: dort steht die Besetzungsart im
// Schritt „Position". Ihr Wechsel von extern auf intern ist eine
// Übernahme und wird als eigenes Ereignis protokolliert.
source: employee.source ?? "Extern",
collectiveAgreement: employee.collective_agreement ?? "Handel",
workDays: employee.work_days ?? ["Mo", "Di", "Mi", "Do", "Fr"],
isBetriebsrat: employee.is_betriebsrat ?? false,
hasDienstwagen: employee.has_dienstwagen ?? false,
hasKuendigungsschutz: employee.has_kuendigungsschutz ?? false,
kuendigungsschutzBis: employee.kuendigungsschutz_bis ?? "",
kuendigungsschutzGrund: employee.kuendigungsschutz_grund ?? "",
kuendigungsschutzAb: employee.kuendigungsschutz_ab ?? "",
istBeguenstigtBehindert: employee.ist_beguenstigt_behindert ?? false,
// Als Text und nicht als Zahl: ein leeres Zahlenfeld wäre 0, und 0
// bedeutet hier „kein Bescheid", nicht „Grad null".
behinderungGrad: employee.behinderung_grad === null ? "" : String(employee.behinderung_grad),
behinderungAb: employee.behinderung_ab ?? "",
behinderungBis: employee.behinderung_bis ?? "",
dienstwagenArt: employee.dienstwagen_art ?? "Verbrenner",
isLateraleFuehrung: employee.is_laterale_fuehrung ?? false,
isCLevel: employee.is_c_level ?? false,
});
function updateRole(patch: Partial<RoleEmploymentValue>) {
setRole((prev) => ({ ...prev, ...patch }));
}
// Dieselbe Regel wie in RoleEmploymentFields: der Personenkreis zieht das
// Kennzeichen mit. Hier noch einmal, weil nicht das Formular speichert,
// sondern diese Seite — und was gezeigt wird, muss auch abgeschickt werden.
const istBehindert = role.istBeguenstigtBehindert || role.kuendigungsschutzGrund === GRUND_BEGUENSTIGT_BEHINDERT;
function handleEmploymentTypeChange(value: EmploymentType) {
setEmploymentType(value);
if (value === "Vollzeit") setWeeklyHours("38.5");
}
async function handleSubmit() {
if (employmentType === "Teilzeit" && (Number(weeklyHours) <= 0 || Number(weeklyHours) >= 38.5)) {
showToast("Wochenstunden bei Teilzeit müssen zwischen 0 und 38,5 liegen.", "error");
return;
}
if (contractType === "befristet" && !contractEndDate) {
showToast("Bei befristetem Vertrag ist ein Enddatum erforderlich.", "error");
return;
}
if (role.workDays.length === 0) {
showToast("Mindestens ein Arbeitstag muss ausgewählt sein.", "error");
return;
}
if (!effectiveDate) {
showToast("Bitte ein Wirksam-ab-Datum angeben.", "error");
return;
}
setPending(true);
const result = await changeEmployeeData({
employee_id: employee.id,
effective_date: effectiveDate,
person: {
first_name: firstName,
last_name: lastName,
title_prefix: titles.titlePrefix,
title_suffix: titles.titleSuffix,
gender,
birth_date: birthDate,
sv_nummer: svNummer,
nationality,
// Wechselt die Staatsbürgerschaft in den Freizügigkeitsraum, fällt
// der Titel weg — sonst bliebe er als Rest an einer Person hängen,
// die ihn nicht mehr braucht. Die Datenbank prüft diese Kopplung
// bewusst nicht (siehe Migration), also gehört sie hierher.
hat_aufenthaltstitel: titelNoetig ? hatTitel : false,
aufenthaltstitel_bis: titelNoetig && hatTitel ? titelBis : "",
address,
postal_code: postalCode,
city,
address_country: addressCountry,
// Getrimmt und als leere Zeichenkette durchgereicht: die Datenbank
// macht daraus null (nullif), damit sich eine Angabe auch wieder
// entfernen lässt. Ungetrimmt käme ein Feld, in dem nur ein
// Leerzeichen stehen geblieben ist, als Inhalt in der Spalte an.
email: email.trim(),
company_email: companyEmail.trim(),
cornerstone_id: cornerstoneId.trim(),
phone: phone.trim(),
// Der Notfallkontakt läuft über seinen eigenen Abschnitt weiter unten
// — wie die Angehörigen. Stünde er zusätzlich hier, schrieben zwei
// Stellen dasselbe Feld, und welche gewinnt, hinge an der
// Reihenfolge.
},
contract: {
employment_type: employmentType,
weekly_hours: Number(weeklyHours),
contract_type: contractType,
contract_end_date: contractType === "befristet" ? contractEndDate : "",
},
role: {
worker_type: role.workerType,
mitarbeiterart: role.mitarbeiterart,
source: role.source,
collective_agreement: role.collectiveAgreement,
work_days: role.workDays,
is_betriebsrat: role.isBetriebsrat,
has_dienstwagen: role.hasDienstwagen,
dienstwagen_art: role.hasDienstwagen ? role.dienstwagenArt : "",
has_kuendigungsschutz: role.hasKuendigungsschutz,
// Leer statt des Wertes, wenn das Kennzeichen weg ist: die Bedingung
// in der Datenbank duldet keinen Rest ohne Bezug, und die Funktion
// räumt ihn auf demselben Weg weg wie beim Dienstwagen.
kuendigungsschutz_bis: role.hasKuendigungsschutz ? role.kuendigungsschutzBis : "",
kuendigungsschutz_grund: role.hasKuendigungsschutz ? role.kuendigungsschutzGrund : "",
kuendigungsschutz_ab: role.hasKuendigungsschutz ? role.kuendigungsschutzAb : "",
ist_beguenstigt_behindert: istBehindert,
behinderung_grad: istBehindert ? role.behinderungGrad : "",
behinderung_ab: istBehindert ? role.behinderungAb : "",
behinderung_bis: istBehindert ? role.behinderungBis : "",
// Die Teilzeitvariante wird nur mitgeschickt, wenn sich die Stunden
// tatsächlich ändern. Sonst schriebe jede Adressänderung den Wert
// erneut — und setzte ihn bei „Vertragliche Stundenänderung" sogar
// zurück, obwohl niemand die Stunden angefasst hat.
...(stundenGeaendert
? {
teilzeit_art: stundenGrund === "Vertragliche Stundenänderung" ? "" : stundenGrund,
teilzeit_bis: stundenGrund === "Vertragliche Stundenänderung" ? "" : teilzeitBis,
}
: {}),
is_laterale_fuehrung: role.isLateraleFuehrung,
is_c_level: role.isCLevel,
},
});
setPending(false);
if (result.success) {
showToast("Daten aktualisiert.");
router.refresh();
onClose();
} else {
showToast(result.error ?? "Fehler beim Speichern.", "error");
}
}
return (
<SlideOver
open={open}
onClose={onClose}
title="Daten ändern"
subtitle={`${fmtFullName(employee.first_name, employee.last_name, employee.title_prefix, employee.title_suffix)} · ${employee.job_title}`}
footer={
<>
<Button variant="ghost" onClick={onClose}>
Abbrechen
</Button>
<Button
onClick={handleSubmit}
pending={pending}
disabled={!svNummerOk}
title={svNummerOk ? undefined : "Die SV-Nummer ist ungültig."}
>
Speichern
</Button>
</>
}
>
<div className="flex flex-col gap-6">
<TextField label="Wirksam ab" required type="date" value={effectiveDate} onChange={setEffectiveDate} />
<div>
<h3 className="mb-3 text-sm font-bold text-ink">Person</h3>
<div className="flex flex-col gap-3">
<div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
<TextField label="Vorname" dense value={firstName} onChange={setFirstName} />
<TextField label="Nachname" dense value={lastName} onChange={setLastName} />
</div>
<TitleFields value={titles} onChange={updateTitles} />
<div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
<SelectField
label="Geschlecht"
dense
value={gender}
onChange={(v) => setGender(v as GenderType)}
options={[
{ value: "m", label: "männlich" },
{ value: "w", label: "weiblich" },
]}
/>
<TextField label="Geburtsdatum" dense type="date" value={birthDate} onChange={setBirthDate} />
</div>
<SvNummerField value={svNummer} onChange={setSvNummer} locationCountry={locationCountry} birthDate={birthDate || null} dense />
<Field label="Staatsbürgerschaft" dense>
{(p) => (
<CountryPicker {...p} value={nationality} onChange={setNationality} countries={UN_COUNTRIES} placeholder="Staatsbürgerschaft suchen…" />
)}
</Field>
{/* Nur wo er verlangt ist. Bei Freizügigkeit — EU, EWR, Schweiz —
wäre die Frage gegenstandslos, und ein „Nein" im Formular
sähe aus wie eine Auskunft. */}
{titelNoetig && (
<>
<SelectField
label="Aufenthaltstitel"
dense
value={hatTitel ? "ja" : "nein"}
onChange={(v) => setHatTitel(v === "ja")}
options={[
{ value: "nein", label: "Nein" },
{ value: "ja", label: "Ja" },
]}
hint="Bei Staatsbürgerschaften ausserhalb von EU, EWR und Schweiz."
/>
{hatTitel && (
<TextField
label="Aufenthaltstitel gültig bis"
dense
type="date"
value={titelBis}
onChange={setTitelBis}
hint="Optional. Leer lassen, wenn unbefristet."
/>
)}
</>
)}
<TextField label="Adresse (Straße und Hausnummer)" dense value={address} onChange={setAddress} />
<div className="grid grid-cols-[minmax(0,1fr)_minmax(0,2fr)] gap-3">
<TextField label="Postleitzahl" dense inputMode="numeric" value={postalCode} onChange={setPostalCode} />
<TextField label="Ort" dense value={city} onChange={setCity} />
</div>
<Field label="Land" dense>
{(p) => <CountryPicker {...p} value={addressCountry} onChange={setAddressCountry} countries={UN_COUNTRIES} placeholder="Land suchen…" />}
</Field>
<TextField label="E-Mail (privat)" dense type="email" value={email} onChange={setEmail} />
<TextField label="Firmen-E-Mail" dense type="email" value={companyEmail} onChange={setCompanyEmail} />
<TextField label="Cornerstone-ID" dense value={cornerstoneId} onChange={setCornerstoneId} />
<TextField label="Telefon" dense type="tel" value={phone} onChange={setPhone} />
</div>
</div>
<div>
<h3 className="mb-3 text-sm font-bold text-ink">Vertrag</h3>
<div className="flex flex-col gap-3">
<SelectField
label="Beschäftigungsausmaß"
dense
value={employmentType}
onChange={(v) => handleEmploymentTypeChange(v as EmploymentType)}
options={[
{ value: "Vollzeit", label: "Vollzeit" },
{ value: "Teilzeit", label: "Teilzeit" },
]}
/>
<TextField
label="Wochenstunden"
dense
type="number"
step="0.5"
value={weeklyHours}
disabled={employmentType === "Vollzeit"}
onChange={setWeeklyHours}
/>
{stundenGeaendert && (
<SelectField
label="Grund der Stundenänderung"
dense
value={stundenGrund}
onChange={setStundenGrund}
options={STUNDEN_GRUENDE.map((g) => ({ value: g, label: g }))}
hint="Steht danach am Profil und lässt sich auswerten."
/>
)}
{stundenGeaendert && stundenGrund !== "Vertragliche Stundenänderung" && (
<TextField
label="Teilzeit bis"
dense
type="date"
value={teilzeitBis}
onChange={setTeilzeitBis}
hint="Optional. Leer lassen, solange das Ende nicht feststeht."
/>
)}
<SelectField
label="Vertragsart"
dense
value={contractType}
onChange={(v) => setContractType(v as ContractType)}
options={[
{ value: "unbefristet", label: "unbefristet" },
{ value: "befristet", label: "befristet" },
]}
/>
{contractType === "befristet" && (
<TextField label="Befristet bis" required dense type="date" value={contractEndDate} onChange={setContractEndDate} />
)}
</div>
</div>
<div>
<h3 className="mb-3 text-sm font-bold text-ink">Rolle & Anstellung</h3>
<RoleEmploymentFields value={role} onChange={updateRole} />
</div>
<AngehoerigeSection employeeId={employee.id} dependents={dependents} effectiveDate={effectiveDate} />
{/* Derselbe Abschnitt wie im Reiter „Stammdaten", unmittelbar unter den
Angehörigen — beides Personen im Umfeld, beides dieselbe Tabelle
mit denselben Knöpfen. Hier standen drei Eingabefelder: fachlich
dasselbe, aber daneben eine zweite Bauform für denselben Zweck.
Beide Abschnitte laufen jetzt über das „Wirksam ab" dieses
Formulars. */}
<NotfallkontaktSection
employeeId={employee.id}
effectiveDate={effectiveDate}
kontakt={{
name: employee.emergency_contact_name,
telefon: employee.emergency_contact_phone,
verhaeltnis: employee.emergency_contact_relation,
}}
/>
</div>
</SlideOver>
);
}