bug fix for atemschutz

frontend/src/pages/Atemschutz.tsx

@@ -255,16 +255,6 @@ function Atemschutz() {
     setForm((prev) => ({ ...prev, [field]: value }));
   };
 
-  /** Safari workaround: capture date value on blur since onChange may not fire */
-  const handleDateBlur = (field: keyof AtemschutzFormState) => (
-    e: React.FocusEvent<HTMLInputElement>
-  ) => {
-    const val = e.target.value;
-    if (val && val !== form[field]) {
-      setForm((prev) => ({ ...prev, [field]: val }));
-    }
-  };
-
   /** Normalize dates before submit: ensure 4-digit years, drop invalid values */
   const normalizeDate = (val: string | undefined): string | undefined => {
     if (!val) return undefined;
@@ -278,6 +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<HTMLInputElement>(null),
+    untersuchung_datum: React.useRef<HTMLInputElement>(null),
+    untersuchung_gueltig_bis: React.useRef<HTMLInputElement>(null),
+    leistungstest_datum: React.useRef<HTMLInputElement>(null),
+    leistungstest_gueltig_bis: React.useRef<HTMLInputElement>(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);
+  };
+
   const handleSubmit = async () => {
     setDialogError(null);
 
@@ -291,12 +300,12 @@ function Atemschutz() {
       if (editingId) {
         const payload: UpdateAtemschutzPayload = {
           atemschutz_lehrgang: form.atemschutz_lehrgang,
-          lehrgang_datum: normalizeDate(form.lehrgang_datum),
+          lehrgang_datum: getDateValue('lehrgang_datum'),
-          untersuchung_datum: normalizeDate(form.untersuchung_datum),
+          untersuchung_datum: getDateValue('untersuchung_datum'),
-          untersuchung_gueltig_bis: normalizeDate(form.untersuchung_gueltig_bis),
+          untersuchung_gueltig_bis: getDateValue('untersuchung_gueltig_bis'),
           untersuchung_ergebnis: (form.untersuchung_ergebnis as UntersuchungErgebnis) || undefined,
-          leistungstest_datum: normalizeDate(form.leistungstest_datum),
+          leistungstest_datum: getDateValue('leistungstest_datum'),
-          leistungstest_gueltig_bis: normalizeDate(form.leistungstest_gueltig_bis),
+          leistungstest_gueltig_bis: getDateValue('leistungstest_gueltig_bis'),
           leistungstest_bestanden: form.leistungstest_bestanden,
           bemerkung: form.bemerkung || undefined,
         };
@@ -306,12 +315,12 @@ function Atemschutz() {
         const payload: CreateAtemschutzPayload = {
           user_id: form.user_id,
           atemschutz_lehrgang: form.atemschutz_lehrgang,
-          lehrgang_datum: normalizeDate(form.lehrgang_datum),
+          lehrgang_datum: getDateValue('lehrgang_datum'),
-          untersuchung_datum: normalizeDate(form.untersuchung_datum),
+          untersuchung_datum: getDateValue('untersuchung_datum'),
-          untersuchung_gueltig_bis: normalizeDate(form.untersuchung_gueltig_bis),
+          untersuchung_gueltig_bis: getDateValue('untersuchung_gueltig_bis'),
           untersuchung_ergebnis: (form.untersuchung_ergebnis as UntersuchungErgebnis) || undefined,
-          leistungstest_datum: normalizeDate(form.leistungstest_datum),
+          leistungstest_datum: getDateValue('leistungstest_datum'),
-          leistungstest_gueltig_bis: normalizeDate(form.leistungstest_gueltig_bis),
+          leistungstest_gueltig_bis: getDateValue('leistungstest_gueltig_bis'),
           leistungstest_bestanden: form.leistungstest_bestanden,
           bemerkung: form.bemerkung || undefined,
         };
@@ -654,9 +663,8 @@ function Atemschutz() {
                   type="date"
                   size="small"
                   fullWidth
-                  value={form.lehrgang_datum}
+                  defaultValue={form.lehrgang_datum}
-                  onChange={(e) => handleFormChange('lehrgang_datum', e.target.value)}
+                  inputRef={dateRefs.lehrgang_datum}
-                  onBlur={handleDateBlur('lehrgang_datum')}
                   InputLabelProps={{ shrink: true }}
                 />
               </Grid>
@@ -673,9 +681,8 @@ function Atemschutz() {
                   type="date"
                   size="small"
                   fullWidth
-                  value={form.untersuchung_datum}
+                  defaultValue={form.untersuchung_datum}
-                  onChange={(e) => handleFormChange('untersuchung_datum', e.target.value)}
+                  inputRef={dateRefs.untersuchung_datum}
-                  onBlur={handleDateBlur('untersuchung_datum')}
                   InputLabelProps={{ shrink: true }}
                 />
               </Grid>
@@ -685,9 +692,8 @@ function Atemschutz() {
                   type="date"
                   size="small"
                   fullWidth
-                  value={form.untersuchung_gueltig_bis}
+                  defaultValue={form.untersuchung_gueltig_bis}
-                  onChange={(e) => handleFormChange('untersuchung_gueltig_bis', e.target.value)}
+                  inputRef={dateRefs.untersuchung_gueltig_bis}
-                  onBlur={handleDateBlur('untersuchung_gueltig_bis')}
                   InputLabelProps={{ shrink: true }}
                 />
               </Grid>
@@ -723,9 +729,8 @@ function Atemschutz() {
                   type="date"
                   size="small"
                   fullWidth
-                  value={form.leistungstest_datum}
+                  defaultValue={form.leistungstest_datum}
-                  onChange={(e) => handleFormChange('leistungstest_datum', e.target.value)}
+                  inputRef={dateRefs.leistungstest_datum}
-                  onBlur={handleDateBlur('leistungstest_datum')}
                   InputLabelProps={{ shrink: true }}
                 />
               </Grid>
@@ -735,9 +740,8 @@ function Atemschutz() {
                   type="date"
                   size="small"
                   fullWidth
-                  value={form.leistungstest_gueltig_bis}
+                  defaultValue={form.leistungstest_gueltig_bis}
-                  onChange={(e) => handleFormChange('leistungstest_gueltig_bis', e.target.value)}
+                  inputRef={dateRefs.leistungstest_gueltig_bis}
-                  onBlur={handleDateBlur('leistungstest_gueltig_bis')}
                   InputLabelProps={{ shrink: true }}
                 />
               </Grid>