innohub/praktikum
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upload deleted

Browse Source
This commit is contained in:
titver968
2025-05-12 14:16:21 +02:00
parent 171c9feeec
commit 268847efdb
3 changed files with 91 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
src/routes/admin/dienststellen/+page.svelte
View File

@@ -10,25 +10,6 @@
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, plaetze: neuePlaetze }),
headers: { 'Content-Type': 'application/json' }
});
if (res.ok) {
neuerName = '';
await ladeDienststellen();
} else {
const err = await res.json();
fehlermeldung = err.error || 'Fehler beim Hinzufügen';
}
}
*/
function bearbeiten(d: { id: number; name: string; plaetze: number }) {
neuerName = d.name;
@@ -71,46 +52,99 @@
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="Dienststelle" class="input w-full" />
<input type="number" bind:value={neuePlaetze} placeholder="Anzahl Plätze" class="input w-1/4" />
<button on:click={() => { neuerName = ''; neuePlaetze = 0; bearbeiteId = null }} class="text-sm text-gray-500 hover:underline">
Zurücksetzen
</button>
<button on:click={speichern} class="bg-blue-600 text-white px-4 py-2 rounded">
{bearbeiteId !== null ? 'Ändern' : '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>
<span class="text-sm text-gray-500">{d.plaetze} Plätze</span>
<button on:click={() => (neuerName = d.name, neuePlaetze = d.plaetze, bearbeiteId = d.id)} class="text-sm text-blue-600 hover:underline">Bearbeiten</button>
<button on:click={() => loeschen(d.id)} class="text-sm text-red-600 hover:underline">Löschen</button>
</li>
{/each}
<div class="p-6 max-w-6xl mx-auto space-y-8">
<h1 class="text-2xl font-bold text-center">Dienststellen verwalten</h1>
<!-- Eingabefelder -->
<div class="flex flex-wrap gap-4 items-center">
<input
bind:value={neuerName}
placeholder="Dienststelle"
class="input w-full sm:w-[55%] border rounded px-3 py-2"
/>
<input
type="number"
bind:value={neuePlaetze}
placeholder="Anzahl Plätze"
class="input w-full sm:w-[20%] border rounded px-3 py-2"
min="0"
/>
<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 hiver:bg-red-700">
<button
on:click={() => {
neuerName = '';
neuePlaetze = 0;
bearbeiteId = null;
}}
class="text-sm text-gray-500 hover:underline"
>
Zurücksetzen
</button>
<button
on:click={speichern}
class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 text-sm"
>
{bearbeiteId !== null ? 'Ändern' : 'Hinzufügen'}
</button>
</div>
<!-- Fehlermeldung -->
{#if fehlermeldung}
<p class="text-red-600 text-sm">{fehlermeldung}</p>
{/if}
<!-- Tabellenähnliche Anzeige -->
<div class="overflow-x-auto">
<div class="min-w-[600px] divide-y border rounded">
<!-- Kopfzeile -->
<div class="grid grid-cols-3 gap-x-8 font-semibold text-sm bg-gray-100 p-2">
<div>Dienststelle</div>
<div class="text-right">Plätze</div>
<div class="text-right">Aktionen</div>
</div>
<!-- Einträge -->
{#each dienststellen as d}
<div class="grid grid-cols-3 gap-x-8 items-center p-2 text-sm">
<div>{d.name}</div>
<div class="text-right">{d.plaetze}</div>
<div class="flex justify-end gap-3">
<button
on:click={() => {
neuerName = d.name;
neuePlaetze = d.plaetze;
bearbeiteId = d.id;
}}
class="text-blue-600 hover:underline"
>
Bearbeiten
</button>
<button
on:click={() => loeschen(d.id)}
class="text-red-600 hover:underline"
>
Löschen
</button>
</div>
</div>
{/each}
</div>
</div>
<!-- Logout-Button -->
<div class="pt-4 text-center">
<button
on:click={async () => {
await fetch('/api/admin/logout', { method: 'POST' });
location.reload();
}}
class="bg-red-600 hover:bg-red-700 text-white px-6 py-2 rounded"
>
Logout
</button>
</div>
</div>
<style>
.input {
@apply border rounded px-3 py-2;
}
<style>
/* You can add custom styles here if needed, or rely on Tailwind classes in your markup */