Basic signup for events

app/Domains/Event/Views/Partials/SignUpForm/steps/StepSummary.vue

@@ -0,0 +1,63 @@
+<script setup>
+import {format, parseISO} from "date-fns";
+
+const props = defineProps({
+    formData: Object,
+    event: Object,
+    summaryAmount: String,
+    summaryLoading: Boolean,
+    submitting: Boolean,
+})
+const emit = defineEmits(['back', 'submit'])
+
+function formatDate(dateString) {
+    if (!dateString) return ''
+    return format(parseISO(dateString), 'dd.MM.yyyy')
+}
+</script>
+
+<template>
+    <div>
+        <h3>Zusammenfassung</h3>
+
+        <div v-if="summaryLoading" style="color: #6b7280; padding: 20px 0;">Wird geladen…</div>
+        <div v-else>
+            <table class="form-table" style="margin-bottom: 20px;">
+                <tr><td>Veranstaltung:</td><td><strong>{{ event.name }}</strong></td></tr>
+                <tr><td>Anreise:</td><td>{{ formatDate(formData.arrival) }}</td></tr>
+                <tr><td>Abreise:</td><td>{{ formatDate(formData.departure) }}</td></tr>
+            </table>
+
+            <div style="display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px;">
+                <label style="display: flex; gap: 10px; cursor: pointer;">
+                    <input type="checkbox" v-model="formData.summary_information_correct" />
+                    Ich bestätige, dass alle Angaben korrekt sind.
+                </label>
+                <label style="display: flex; gap: 10px; cursor: pointer;">
+                    <input type="checkbox" v-model="formData.summary_accept_terms" />
+                    Ich akzeptiere die Teilnahmebedingungen.
+                </label>
+                <label style="display: flex; gap: 10px; cursor: pointer;">
+                    <input type="checkbox" v-model="formData.legal_accepted" />
+                    Ich stimme der Datenschutzerklärung zu.
+                </label>
+                <label style="display: flex; gap: 10px; cursor: pointer;">
+                    <input type="checkbox" v-model="formData.payment" />
+                    Ich bestätige, den Betrag von <strong>{{ summaryAmount }}</strong> zu überweisen.
+                </label>
+            </div>
+
+            <div class="btn-row">
+                <button type="button" class="btn-secondary" @click="emit('back', 8)">← Zurück</button>
+                <button
+                    type="submit"
+                    class="btn-primary"
+                    :disabled="!formData.summary_information_correct || !formData.summary_accept_terms || !formData.legal_accepted || !formData.payment || submitting"
+                    style="background: #059669;"
+                >
+                    {{ submitting ? 'Wird gesendet…' : 'Jetzt anmelden ✓' }}
+                </button>
+            </div>
+        </div>
+    </div>
+</template>