update

frontend/src/pages/MitgliedDetail.tsx

@@ -35,6 +35,7 @@ import {
   HighlightOff as HighlightOffIcon,
   MilitaryTech as MilitaryTechIcon,
   LocalHospital as LocalHospitalIcon,
+  School as SchoolIcon,
 } from '@mui/icons-material';
 import { useParams, useNavigate } from 'react-router-dom';
 import DashboardLayout from '../components/dashboard/DashboardLayout';
@@ -58,7 +59,7 @@ import {
   formatPhone,
   UpdateMemberProfileData,
 } from '../types/member.types';
-import type { Befoerderung, Untersuchung, Fahrgenehmigung } from '../types/member.types';
+import type { Befoerderung, Untersuchung, Fahrgenehmigung, Ausbildung } from '../types/member.types';
 import type { AtemschutzUebersicht } from '../types/atemschutz.types';
 import { UntersuchungErgebnisLabel } from '../types/atemschutz.types';
 
@@ -244,6 +245,7 @@ function MitgliedDetail() {
   const [befoerderungen, setBefoerderungen] = useState<Befoerderung[]>([]);
   const [untersuchungen, setUntersuchungen] = useState<Untersuchung[]>([]);
   const [fahrgenehmigungen, setFahrgenehmigungen] = useState<Fahrgenehmigung[]>([]);
+  const [ausbildungen, setAusbildungen] = useState<Ausbildung[]>([]);
 
   // Edit form state — only the fields the user is allowed to change
   const [formData, setFormData] = useState<UpdateMemberProfileData>({});
@@ -285,6 +287,7 @@ function MitgliedDetail() {
     membersService.getBefoerderungen(userId).then(setBefoerderungen).catch(() => setBefoerderungen([]));
     membersService.getUntersuchungen(userId).then(setUntersuchungen).catch(() => setUntersuchungen([]));
     membersService.getFahrgenehmigungen(userId).then(setFahrgenehmigungen).catch(() => setFahrgenehmigungen([]));
+    membersService.getAusbildungen(userId).then(setAusbildungen).catch(() => setAusbildungen([]));
   }, [userId]);
 
   // Populate form from current profile
@@ -1065,6 +1068,54 @@ function MitgliedDetail() {
               </Grid>
             )}
 
+            {/* Ausbildungen */}
+            {ausbildungen.length > 0 && (
+              <Grid item xs={12} md={6}>
+                <Card>
+                  <CardHeader
+                    avatar={<SchoolIcon color="primary" />}
+                    title="Ausbildungen"
+                  />
+                  <CardContent>
+                    {ausbildungen.map((a) => (
+                      <Box key={a.id} sx={{ py: 0.75, borderBottom: '1px solid', borderColor: 'divider' }}>
+                        <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'baseline' }}>
+                          <Typography variant="body2" fontWeight={500}>
+                            {a.kursname}
+                          </Typography>
+                          <Typography variant="caption" color="text.secondary">
+                            {a.kurs_datum ? new Date(a.kurs_datum).toLocaleDateString('de-AT') : '—'}
+                          </Typography>
+                        </Box>
+                        {(a.ort || a.status !== 'abgeschlossen') && (
+                          <Box sx={{ display: 'flex', gap: 1, alignItems: 'center', mt: 0.25 }}>
+                            {a.ort && (
+                              <Typography variant="body2" color="text.secondary">
+                                {a.ort}
+                              </Typography>
+                            )}
+                            {a.status !== 'abgeschlossen' && (
+                              <Chip
+                                label={a.status === 'in_bearbeitung' ? 'In Bearbeitung' : 'Abgelaufen'}
+                                size="small"
+                                color={a.status === 'abgelaufen' ? 'warning' : 'info'}
+                                variant="outlined"
+                              />
+                            )}
+                          </Box>
+                        )}
+                        {a.ablaufdatum && (
+                          <Typography variant="caption" color="text.secondary">
+                            Gültig bis: {new Date(a.ablaufdatum).toLocaleDateString('de-AT')}
+                          </Typography>
+                        )}
+                      </Box>
+                    ))}
+                  </CardContent>
+                </Card>
+              </Grid>
+            )}
+
             {/* Untersuchungen */}
             {untersuchungen.length > 0 && (
               <Grid item xs={12} md={6}>

frontend/src/services/members.ts

@@ -9,6 +9,7 @@ import {
   Befoerderung,
   Untersuchung,
   Fahrgenehmigung,
+  Ausbildung,
 } from '../types/member.types';
 
 // ----------------------------------------------------------------
@@ -143,4 +144,9 @@ export const membersService = {
     const response = await api.get<ApiItemResponse<Fahrgenehmigung[]>>(`/api/members/${userId}/fahrgenehmigungen`);
     return response.data?.data ?? [];
   },
+
+  async getAusbildungen(userId: string): Promise<Ausbildung[]> {
+    const response = await api.get<ApiItemResponse<Ausbildung[]>>(`/api/members/${userId}/ausbildungen`);
+    return response.data?.data ?? [];
+  },
 };

frontend/src/types/member.types.ts

@@ -228,3 +228,14 @@ export interface Fahrgenehmigung {
   klasse: string;
   created_at: string;
 }
+
+export interface Ausbildung {
+  id: string;
+  kursname: string;
+  kurs_datum: string | null;
+  ablaufdatum: string | null;
+  ort: string | null;
+  bemerkung: string | null;
+  status: string;
+  created_at: string;
+}