diff --git a/frontend/src/pages/Atemschutz.tsx b/frontend/src/pages/Atemschutz.tsx index 99f336f..1c19199 100644 --- a/frontend/src/pages/Atemschutz.tsx +++ b/frontend/src/pages/Atemschutz.tsx @@ -268,23 +268,25 @@ function Atemschutz() { return `${year}-${m[2]}-${m[3]}`; }; - // Refs for date inputs — reads DOM value directly on submit (Safari workaround) - const dateRefs = { - lehrgang_datum: React.useRef(null), - untersuchung_datum: React.useRef(null), - untersuchung_gueltig_bis: React.useRef(null), - leistungstest_datum: React.useRef(null), - leistungstest_gueltig_bis: React.useRef(null), - }; + // Ref to the dialog content — used to read date inputs directly from DOM on submit + const dialogContentRef = React.useRef(null); - /** Read date directly from DOM input element — bypasses React event issues in Safari */ - const getDateValue = (field: keyof typeof dateRefs): string | undefined => { - const el = dateRefs[field].current; - if (!el) return normalizeDate(form[field] || undefined); - // Try the native input inside MUI's TextField - const input = el.querySelector?.('input') as HTMLInputElement | null; - const rawVal = input?.value || el.value || ''; - return normalizeDate(rawVal || undefined); + /** Read all date inputs from DOM at submit time — bulletproof Safari workaround */ + const readDatesFromDOM = (): Record => { + const result: Record = {}; + const dateFieldNames = [ + 'lehrgang_datum', + 'untersuchung_datum', + 'untersuchung_gueltig_bis', + 'leistungstest_datum', + 'leistungstest_gueltig_bis', + ]; + if (!dialogContentRef.current) return result; + for (const name of dateFieldNames) { + const input = dialogContentRef.current.querySelector(`input[name="${name}"]`) as HTMLInputElement | null; + result[name] = normalizeDate(input?.value || undefined); + } + return result; }; const handleSubmit = async () => { @@ -297,15 +299,21 @@ function Atemschutz() { setDialogLoading(true); try { + // Read date values directly from DOM (Safari workaround) + const dates = readDatesFromDOM(); + + // DEBUG: remove after confirming it works + alert('DOM dates:\n' + JSON.stringify(dates, null, 2)); + if (editingId) { const payload: UpdateAtemschutzPayload = { atemschutz_lehrgang: form.atemschutz_lehrgang, - lehrgang_datum: getDateValue('lehrgang_datum'), - untersuchung_datum: getDateValue('untersuchung_datum'), - untersuchung_gueltig_bis: getDateValue('untersuchung_gueltig_bis'), + lehrgang_datum: dates.lehrgang_datum, + untersuchung_datum: dates.untersuchung_datum, + untersuchung_gueltig_bis: dates.untersuchung_gueltig_bis, untersuchung_ergebnis: (form.untersuchung_ergebnis as UntersuchungErgebnis) || undefined, - leistungstest_datum: getDateValue('leistungstest_datum'), - leistungstest_gueltig_bis: getDateValue('leistungstest_gueltig_bis'), + leistungstest_datum: dates.leistungstest_datum, + leistungstest_gueltig_bis: dates.leistungstest_gueltig_bis, leistungstest_bestanden: form.leistungstest_bestanden, bemerkung: form.bemerkung || undefined, }; @@ -315,12 +323,12 @@ function Atemschutz() { const payload: CreateAtemschutzPayload = { user_id: form.user_id, atemschutz_lehrgang: form.atemschutz_lehrgang, - lehrgang_datum: getDateValue('lehrgang_datum'), - untersuchung_datum: getDateValue('untersuchung_datum'), - untersuchung_gueltig_bis: getDateValue('untersuchung_gueltig_bis'), + lehrgang_datum: dates.lehrgang_datum, + untersuchung_datum: dates.untersuchung_datum, + untersuchung_gueltig_bis: dates.untersuchung_gueltig_bis, untersuchung_ergebnis: (form.untersuchung_ergebnis as UntersuchungErgebnis) || undefined, - leistungstest_datum: getDateValue('leistungstest_datum'), - leistungstest_gueltig_bis: getDateValue('leistungstest_gueltig_bis'), + leistungstest_datum: dates.leistungstest_datum, + leistungstest_gueltig_bis: dates.leistungstest_gueltig_bis, leistungstest_bestanden: form.leistungstest_bestanden, bemerkung: form.bemerkung || undefined, }; @@ -601,7 +609,7 @@ function Atemschutz() { {editingId ? 'Atemschutzträger bearbeiten' : 'Neuen Atemschutzträger anlegen'} - + {dialogError && ( {dialogError} @@ -664,7 +672,7 @@ function Atemschutz() { size="small" fullWidth defaultValue={form.lehrgang_datum} - inputRef={dateRefs.lehrgang_datum} + inputProps={{ name: 'lehrgang_datum' }} InputLabelProps={{ shrink: true }} /> @@ -682,7 +690,7 @@ function Atemschutz() { size="small" fullWidth defaultValue={form.untersuchung_datum} - inputRef={dateRefs.untersuchung_datum} + inputProps={{ name: 'untersuchung_datum' }} InputLabelProps={{ shrink: true }} /> @@ -693,7 +701,7 @@ function Atemschutz() { size="small" fullWidth defaultValue={form.untersuchung_gueltig_bis} - inputRef={dateRefs.untersuchung_gueltig_bis} + inputProps={{ name: 'untersuchung_gueltig_bis' }} InputLabelProps={{ shrink: true }} /> @@ -730,7 +738,7 @@ function Atemschutz() { size="small" fullWidth defaultValue={form.leistungstest_datum} - inputRef={dateRefs.leistungstest_datum} + inputProps={{ name: 'leistungstest_datum' }} InputLabelProps={{ shrink: true }} /> @@ -741,7 +749,7 @@ function Atemschutz() { size="small" fullWidth defaultValue={form.leistungstest_gueltig_bis} - inputRef={dateRefs.leistungstest_gueltig_bis} + inputProps={{ name: 'leistungstest_gueltig_bis' }} InputLabelProps={{ shrink: true }} />