feat(akte): Ablaufdatum in der Beladung-Tabelle

Bevorstehende Ablaufdaten waren nur im Dashboard und als
Einsatzbereitschafts-Grund sichtbar, nicht direkt an der jeweiligen
Beladungsposition in der Akte. Neue Spalte "Ablauf", rot bei
überfälligem, gelb bei <30 Tagen verbleibender Zeit.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01CVgbozhYmuEhiEJHffRXCV

frontend/src/api/types.ts

@@ -319,6 +319,7 @@ export interface BeladungsPosition {
   fach: string | null;
   sollmenge: string;
   istmenge: string;
+  ablaufdatum: string | null;
 }
 
 export interface Akte {

frontend/src/pages/AktePage.tsx

@@ -10,6 +10,13 @@ import { ReadinessBadge } from "../components/status/ReadinessBadge";
 import { GRUND_TEXT } from "../components/status/gruendeText";
 import { EREIGNIS_LABEL } from "../components/status/ereignisText";
 
+function ablaufFarbe(ablaufdatum: string): string | undefined {
+  const tage = (new Date(ablaufdatum).getTime() - Date.now()) / (1000 * 60 * 60 * 24);
+  if (tage < 0) return "var(--color-danger)";
+  if (tage < 30) return "var(--color-warning)";
+  return undefined;
+}
+
 const MANGEL_PRIORITAET_LABEL: Record<string, string> = {
   niedrig: "Niedrig",
   normal: "Normal",
@@ -120,6 +127,7 @@ export function AktePage() {
                   <th>Fach</th>
                   <th>Soll</th>
                   <th>Ist</th>
+                  <th>Ablauf</th>
                 </tr>
               </thead>
               <tbody>
@@ -133,6 +141,9 @@ export function AktePage() {
                     <td className={Number(b.istmenge) < Number(b.sollmenge) ? "text-danger" : undefined}>
                       {b.istmenge} {b.einheit}
                     </td>
+                    <td style={{ color: b.ablaufdatum ? ablaufFarbe(b.ablaufdatum) : undefined }}>
+                      {b.ablaufdatum ? new Date(b.ablaufdatum).toLocaleDateString("de-DE") : "–"}
+                    </td>
                   </tr>
                 ))}
               </tbody>