delete button in Anmeldung, Breite seite

src/routes/admin/anmeldungen/+page.svelte

@@ -6,11 +6,27 @@
       const res = await fetch('/api/admin/anmeldungen');
         anmeldungen = await res.json();
       }
+
+    async function loeschen(id: number) {
+      if (!confirm('Diese Anmeldung wirklich löschen?')) return;
+      try {
+        const res = await fetch(`/api/admin/anmeldungen?id=${id}`, { method: 'DELETE' });
+        if (!res.ok) {
+          const errorText = await res.text();
+          throw new Error(`Fehler beim Löschen (${res.status}): ${errorText}`);
+        }
+        await ladeAnmeldungen();
+      } catch (error) {
+        console.error(error);
+        alert('Fehler beim Löschen der Anmeldung.\n' + error.message);
+      }
+}
+
       onMount(ladeAnmeldungen);
   
-</script> 
-  
-  <div class="p-6 max-w-4xl mx-auto">
+</script> 
+
+  <div class="p-6 max-w-7xl mx-auto">
       <h1 class="text-2xl font-bold mb-4 text-center">Alle Anmeldungen</h1>
       <table class="w-full border text-sm">
         <thead>
@@ -18,6 +34,7 @@
             <th class="p-2 text-left">Name</th>
             <th class="p-2 text-left">E-Mail</th>
             <th class="p-2 text-left">Wunsch 1–3</th>
+            <th class="p-2 text-left">Datum</th>
             <th class="p-2 text-left">Aktionen</th>
           </tr>
         </thead>
@@ -25,18 +42,30 @@
           {#each anmeldungen as a}
             <tr class="border-t">
               <td class="p-2">{a.anrede} {a.vorname} {a.nachname}</td>
-              <td class="p-2">{a.email}</td>
+              <td class="p-2">{a.email}</td>
+              <td class="p-2">
+                {a.wunsch1?.name}<br>
+                {a.wunsch2?.name}<br>
+                {a.wunsch3?.name}
               </td>
+              <td class="p-2">{new Date(a.timestamp).toLocaleDateString()}</td>
+              <td class="p-2 text-right">
+                <button
+                  class="text-red-600 hover:underline"
+                  on:click={() => loeschen(a.id)}>
+                  Löschen
+                </button>
               </td>
             </tr>
           {/each}
         </tbody>
+      </table>
 
       <button
           on:click={async () => {
           await fetch('/api/admin/logout', { method: 'POST' });
           location.reload();
-          }}
+          }}
           class="bg-red-600  text-white px-4 py-3 rounded text-center hover:bg-red-700">
             Logout
       </button>