first praktikum variant
This commit is contained in:
65
src/routes/admin/dienststellen/+page.svelte
Normal file
65
src/routes/admin/dienststellen/+page.svelte
Normal file
@@ -0,0 +1,65 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from 'svelte';
|
||||
let dienststellen: { id: number; name: string }[] = [];
|
||||
let neuerName = '';
|
||||
let fehlermeldung = '';
|
||||
|
||||
async function ladeDienststellen() {
|
||||
const res = await fetch('/api/admin/dienststellen');
|
||||
dienststellen = await res.json();
|
||||
}
|
||||
|
||||
async function hinzufuegen() {
|
||||
fehlermeldung = '';
|
||||
if (!neuerName.trim()) return;
|
||||
const res = await fetch('/api/admin/dienststellen', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ name: neuerName }),
|
||||
headers: { 'Content-Type': 'application/json' }
|
||||
});
|
||||
|
||||
if (res.ok) {
|
||||
neuerName = '';
|
||||
await ladeDienststellen();
|
||||
} else {
|
||||
const err = await res.json();
|
||||
fehlermeldung = err.error || 'Fehler beim Hinzufügen';
|
||||
}
|
||||
}
|
||||
|
||||
async function loeschen(id: number) {
|
||||
if (!confirm('Diese Dienststelle wirklich löschen?')) return;
|
||||
await fetch(`/api/admin/dienststellen?id=${id}`, { method: 'DELETE' });
|
||||
await ladeDienststellen();
|
||||
}
|
||||
|
||||
onMount(ladeDienststellen);
|
||||
|
||||
</script>
|
||||
|
||||
<div class="p-6 max-w-xl mx-auto space-y-6">
|
||||
<h1 class="text-2xl font-bold">Dienststellen verwalten</h1>
|
||||
|
||||
<div class="flex gap-2">
|
||||
<input bind:value={neuerName} placeholder="Neue Dienststelle" class="input w-full" />
|
||||
<button on:click={hinzufuegen} class="bg-blue-600 text-white px-4 py-2 rounded">Hinzufügen</button>
|
||||
</div>
|
||||
|
||||
{#if fehlermeldung}
|
||||
<p class="text-red-600">{fehlermeldung}</p>
|
||||
{/if}
|
||||
|
||||
<ul class="divide-y border rounded">
|
||||
{#each dienststellen as d}
|
||||
<li class="flex justify-between items-center p-2">
|
||||
<span>{d.name}</span>
|
||||
<button on:click={() => loeschen(d.id)} class="text-sm text-red-600 hover:underline">Löschen</button>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.input {
|
||||
@apply border rounded px-3 py-2;
|
||||
}
|
||||
Reference in New Issue
Block a user