admin Berreich mit Passwort

src/routes/admin/+page.svelte

@@ -1,65 +1,60 @@
 <script lang="ts">
-    let passwort = '';
-    let eingeloggt = false;
-    let fehler = false;
-    let anmeldungen = [];
-  
-    async function login() {
-      const res = await fetch('/api/admin/login', {
-        method: 'POST',
-        body: JSON.stringify({ passwort }),
-        headers: { 'Content-Type': 'application/json' }
-      });
-  
-      if (res.ok) {
-        eingeloggt = true;
-        fehler = false;
-        const result = await fetch('/api/admin/anmeldungen');
-        anmeldungen = await result.json();
-      } else {
-        fehler = true;
-      }
+  let passwort = '';
+  let eingeloggt = false;
+  let fehler = false;
+
+  async function login() {
+    const res = await fetch('/api/admin/login', {
+      method: 'POST',
+      body: JSON.stringify({ passwort }),
+      headers: { 'Content-Type': 'application/json' }
+    });
+
+    if (res.ok) {
+      eingeloggt = true;
+      fehler = false;
+    } else {
+      fehler = true;
     }
-  
-</script>
-  
-  <div class="p-6 max-w-4xl mx-auto">
-    {#if !eingeloggt}
-      <div class="space-y-4">
-        <h1 class="text-2xl font-bold">Admin Login</h1>
-        <input type="password" bind:value={passwort} placeholder="Passwort" class="input w-full" />
-        <button on:click={login} class="bg-blue-600 text-white px-4 py-2 rounded">Login</button>
-        {#if fehler}
-          <p class="text-red-600">Falsches Passwort</p>
+  }
+</script>
+
+<div class="p-6 max-w-lg mx-auto">
+  {#if !eingeloggt}
+    <div class="space-y-4">
+      <h1 class="text-2xl font-bold">Admin Login</h1>
+      <input type="password" bind:value={passwort} placeholder="Passwort" class="input w-full" />
+      <button on:click={login} class="bg-blue-600 text-white px-4 py-2 rounded">Login</button>
+      {#if fehler}
+        <p class="text-red-600">Falsches Passwort</p>
+      {/if}
+    </div>
+  {:else}
+    <div class="space-y-4">
+      <h1 class="text-2xl font-bold mb-4">Admin-Bereich</h1>
+      <div class="flex flex-col gap-4">
+        <a href="/admin/anmeldungen" class="bg-blue-600 text-white px-4 py-3 rounded text-center hover:bg-blue-700">
+          📝 Anmeldungen anzeigen
+        </a>
+        <a href="/admin/dienststellen" class="bg-green-600 text-white px-4 py-3 rounded text-center hover:bg-green-700">
+          🏢 Dienststellen verwalten
+        </a>
       </div>
-      </div>
-    {:else}
-    <p><a href="/admin/dienststellen" class="text-blue-600 underline">Dienststellen verwalten</a></p>
-      <h1 class="text-2xl font-bold mb-4">Alle Anmeldungen</h1>
-      <table class="w-full border text-sm">
-        <thead>
-          <tr class="bg-gray-200">
-            <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>
-          </tr>
-        </thead>
-        <tbody>
-          {#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.wunsch1}, {a.wunsch2}, {a.wunsch3}</td>
-              <td class="p-2">{new Date(a.timestamp).toLocaleDateString()}</td>
-            </tr>
-          {/each}
-        </tbody>
-      </table>
-    {/if}
-  </div>
-  
-  <style>
-    .input {
-      @apply border rounded px-3 py-2 w-full;
-    }
+      <button
+  on:click={async () => {
+    await fetch('/api/admin/logout', { method: 'POST' });
+    location.reload();
+  }}
+  class="text-sm text-red-600 underline"
+>
+  Logout
+</button>
+    </div>
+  {/if}
+</div>
+
+<style>
+  .input {
+    @apply border rounded px-3 py-2 w-full;
+  }
+</style>