Submit success mit own windows

This commit is contained in:
titver968
2025-05-12 15:05:31 +02:00
parent d2a0f8fdc5
commit a87cfe7858
3 changed files with 56 additions and 15 deletions

View File

@@ -25,11 +25,36 @@
let success = false; let success = false;
let dienststellen: any[]; let dienststellen: any[];
let fileInputKey = 0;
let pdfDatein = [];
onMount(async () => { onMount(async () => {
const res = await fetch('/api/dienststellen'); const res = await fetch('/api/dienststellen');
dienststellen = await res.json(); dienststellen = await res.json();
}); });
function resetForm() {
anrede = '';
vorname = '';
nachname = '';
geburtsdatum = '';
strasse = '';
hausnummer = '';
ort = '';
plz = '';
telefon = '';
email = '';
schulart = '';
zeitraum = '';
wunsch1Id = '';
wunsch2Id = '';
wunsch3Id = '';
motivation = '';
pdfDateien = [];
fileInputKey += 1;
success = false;
}
async function anmelden() { async function anmelden() {
const data = new FormData(); const data = new FormData();
@@ -103,21 +128,25 @@
<div class="grid grid-cols-1 gap-4"> <div class="grid grid-cols-1 gap-4">
<select bind:value={wunsch1Id} required> <select bind:value={wunsch1Id} required>
<option value="" disabled selected>1. Wunschdienststelle</option> <option value="" disabled selected>1. Wunschdienststelle</option>
{#each dienststellen as d} {#each (dienststellen ?? []).filter(d => d.plaetze > 0) as d}
<option value={d.id}>{d.name}</option> <option value={d.id}>{d.name}</option>
{/each} {/each}
</select> </select>
<select bind:value={wunsch2Id} required> <select bind:value={wunsch2Id} required>
<option value="" disabled selected>2. Wunschdienststelle</option> <option value="" disabled selected>2. Wunschdienststelle</option>
{#each dienststellen as d} {#each (dienststellen ?? []).filter(d => d.plaetze > 0 && d.id !== wunsch1Id) as d}
<option value={d.id}>{d.name}</option> <option value={d.id}>{d.name}</option>
{/each} {/each}
</select> </select>
<select bind:value={wunsch3Id} required> <select bind:value={wunsch3Id} required>
<option value="" disabled selected>3. Wunschdienststelle</option> <option value="" disabled selected>3. Wunschdienststelle</option>
{#each dienststellen as d} {#each (dienststellen ?? []).filter(d =>
d.plaetze > 0 &&
d.id !== wunsch1Id &&
d.id !== wunsch2Id
) as d}
<option value={d.id}>{d.name}</option> <option value={d.id}>{d.name}</option>
{/each} {/each}
</select> </select>
@@ -129,6 +158,7 @@
</textarea> </textarea>
<!-- Mehrere PDF Upload --> <!-- Mehrere PDF Upload -->
{#key fileInputKey}
<div> <div>
<label for="pdf-upload" class="block text-gray-700 font-medium mb-1">PDFs hochladen (optional):</label> <label for="pdf-upload" class="block text-gray-700 font-medium mb-1">PDFs hochladen (optional):</label>
<input <input
@@ -140,6 +170,7 @@
class="input" class="input"
/> />
</div> </div>
{/key}
<!-- Button --> <!-- Button -->
<button type="submit" <button type="submit"
@@ -148,7 +179,17 @@
</button> </button>
{#if success} {#if success}
<p class="text-green-600 font-semibold text-center">Anmeldung erfolgreich gesendet!</p> <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
<div class="bg-white p-6 rounded shadow-lg text-center space-y-4 max-w-sm w-full">
<p class="text-green-600 font-semibold">Anmeldung erfolgreich gesendet!</p>
<button
class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700"
on:click={resetForm}
>
OK
</button>
</div>
</div>
{/if} {/if}
{#if fehler} {#if fehler}