feat: Enhance booking flow with form data handling and validation

This commit is contained in:
2026-05-23 00:03:40 +02:00
parent beb9cb34f4
commit 0a11d366a5
3 changed files with 123 additions and 5 deletions
+1 -1
View File
@@ -524,7 +524,7 @@
<p style="font-size: 0.95rem;">In beiden Fällen werden Ihre Angaben noch einmal geprüft, bevor die Buchung per POST an /booking/payment gesendet wird.</p>
<div class="custom-modal-actions">
<button class="btn secondary" type="button" onclick="closeBookingModal()">Abbrechen</button>
<button class="btn secondary" type="button" onclick="goToBookingReview('consultation')">Gesprächstermin vereinbaren</button>
<button class="btn" type="button" onclick="goToBookingReview('consultation')">Gesprächstermin vereinbaren</button>
<button class="btn" type="button" onclick="goToBookingReview('payment')">Buchen</button>
</div>
</div>
+82 -3
View File
@@ -75,6 +75,43 @@
line-height: 1.65;
}
.booking-review__form-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.9rem;
margin-top: 1.25rem;
}
.booking-review__field {
display: flex;
flex-direction: column;
gap: 0.35rem;
}
.booking-review__field--full {
grid-column: 1 / -1;
}
.booking-review__field label {
font-weight: 700;
color: #2b4f58;
font-size: 0.93rem;
}
.booking-review__field input,
.booking-review__field textarea {
border: 1px solid #cedbdd;
border-radius: 12px;
background: #ffffff;
color: #173a42;
padding: 0.75rem 0.82rem;
}
.booking-review__field textarea {
min-height: 110px;
resize: vertical;
}
.booking-review__actions {
display: flex;
flex-wrap: wrap;
@@ -93,6 +130,10 @@
grid-template-columns: 1fr;
}
.booking-review__form-grid {
grid-template-columns: 1fr;
}
.booking-review__actions .btn,
.booking-review__actions a {
width: 100%;
@@ -124,11 +165,49 @@
Bitte prüfen Sie die Angaben noch einmal. Wenn alles passt, senden Sie die Buchung mit dem folgenden Button per POST an /booking/payment.
</div>
<form method="POST" action="{{ url_for('booking_payment') }}" class="booking-review__actions">
<form method="POST" action="{{ url_for('booking_payment') }}">
<input type="hidden" name="package" value="{{ package_key }}">
<input type="hidden" name="flow" value="{{ flow }}">
<button class="btn" type="submit">{{ confirm_label }}</button>
<a class="btn secondary" href="{{ url_for('preise') }}">Zurück zu den Preisen</a>
<div class="booking-review__form-grid" aria-label="Pflichtdaten für Buchung">
<div class="booking-review__field">
<label for="contact_person">Ansprechpartner *</label>
<input id="contact_person" name="contact_person" type="text" required maxlength="120" value="{{ form_data.contact_person }}">
</div>
<div class="booking-review__field">
<label for="school_name">Schule/Einrichtung *</label>
<input id="school_name" name="school_name" type="text" required maxlength="160" value="{{ form_data.school_name }}">
</div>
<div class="booking-review__field">
<label for="contact_email">E-Mail *</label>
<input id="contact_email" name="contact_email" type="email" required maxlength="160" value="{{ form_data.contact_email }}">
</div>
<div class="booking-review__field">
<label for="contact_phone">Telefon</label>
<input id="contact_phone" name="contact_phone" type="text" maxlength="60" value="{{ form_data.contact_phone }}">
</div>
<div class="booking-review__field booking-review__field--full">
<label for="billing_street">Straße *</label>
<input id="billing_street" name="billing_street" type="text" required maxlength="160" value="{{ form_data.billing_street }}">
</div>
<div class="booking-review__field">
<label for="billing_zip">PLZ *</label>
<input id="billing_zip" name="billing_zip" type="text" required maxlength="20" value="{{ form_data.billing_zip }}">
</div>
<div class="booking-review__field">
<label for="billing_city">Ort *</label>
<input id="billing_city" name="billing_city" type="text" required maxlength="120" value="{{ form_data.billing_city }}">
</div>
<div class="booking-review__field booking-review__field--full">
<label for="notes">Zusatzinformationen</label>
<textarea id="notes" name="notes" maxlength="600" placeholder="Optional: gewünschter Starttermin, besondere Anforderungen, Rückrufzeiten">{{ form_data.notes }}</textarea>
</div>
</div>
<div class="booking-review__actions">
<button class="btn" type="submit">{{ confirm_label }}</button>
<a class="btn secondary" href="{{ url_for('preise') }}">Zurück zu den Preisen</a>
</div>
</form>
</div>
</section>