From 653e85b7815db888f0aefc16dc7ca4da68e8ae5d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20G=C3=BCnther?= <th.guenther@saale-mail.de>
Date: Mon, 6 Apr 2026 20:30:52 +0200
Subject: [PATCH] Show participation details

---
 .../Event/Views/Partials/ParticipantData.vue  | 241 ++++++++++++++++++
 1 file changed, 241 insertions(+)
 create mode 100644 app/Domains/Event/Views/Partials/ParticipantData.vue

diff --git a/app/Domains/Event/Views/Partials/ParticipantData.vue b/app/Domains/Event/Views/Partials/ParticipantData.vue
new file mode 100644
index 0000000..5aeceb0
--- /dev/null
+++ b/app/Domains/Event/Views/Partials/ParticipantData.vue
@@ -0,0 +1,241 @@
+<script setup>
+
+ const props = defineProps({
+     editMode: Boolean,
+     participant: Object,
+ })
+
+ const emit = defineEmits(['closeParticipantDetails', 'markCocExisting','paymentComplete', 'cancelParticipation'])
+
+ function markCocExisting(participant) {
+     emit('markCocExisting', participant)
+     close()
+ }
+
+ function paymentComplete(participant) {
+     emit('paymentComplete', participant)
+     close()
+ }
+
+ function close() {
+     emit('closeParticipantDetails')
+
+ }
+
+ function cancelParticipation(participant) {
+     emit('cancelParticipation', participant)
+     close()
+ }
+</script>
+
+<template>
+    <div>
+        <h2>Anmeldedetails</h2>
+
+        <div class="participationData">
+            <div>
+                <h3>Persönliche Daten</h3>
+                <table>
+                    <tr>
+                        <th>Name</th>
+                        <td>
+                            <span v-if="!props.editMode">
+                                {{props.participant.firstname}} {{props.participant.lastname}}
+                            </span>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <th>Pfadiname</th>
+                        <td>
+                            <span v-if="!props.editMode">{{props.participant.nickname}}</span>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <th>Anschrift</th>
+                        <td>
+                            <span v-if="!props.editMode">
+                                {{props.participant.address_1}}<br />
+                                {{props.participant.address_2}}<br />
+                                {{props.participant.postcode}}
+                                {{props.participant.city}}
+                            </span>
+                        </td>
+                    </tr>
+                    <tr>
+                        <th>Stamm</th>
+                        <td>
+                            <span v-if="!props.editMode">{{props.participant.localgroup}}</span>
+                        </td>
+                    </tr>
+                    <tr>
+                        <th>Geburtsdatum</th>
+                        <td>
+                            <span v-if="!props.editMode">
+                                {{props.participant.birthday}}
+                            </span>
+                        </td>
+                    </tr>
+                </table>
+            </div>
+
+            <div>
+                <h3>Kontaktdaten</h3>
+                <table>
+                    <tr>
+                        <th>E-Mail</th>
+                        <td>
+                            <span v-if="!props.editMode">{{props.participant.email_1}}</span>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <th>Telefon</th>
+                        <td>
+                            <span v-if="!props.editMode">{{props.participant.phone_1}}</span>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <th>Ansprechperson</th>
+                        <td>
+                            <span v-if="!props.editMode">{{props.participant.contact_person}}</span>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <th>Ansprechperson E-Mail</th>
+                        <td>
+                            <span v-if="!props.editMode">{{props.participant.email_2}}</span>
+                        </td>
+                    </tr>
+
+                    <tr>
+                        <th>Ansprechperson Telefon</th>
+                        <td>
+                            <span v-if="!props.editMode">{{props.participant.phone_2}}</span>
+                        </td>
+                    </tr>
+                </table>
+            </div>
+        </div>
+    </div>
+
+    <div class="participationData">
+        <div>
+            <h3>Teilnahmedetails</h3>
+            <table>
+                <tr>
+                    <th>Anreise</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.arrival}}</span>
+                    </td>
+                </tr>
+                <tr>
+                    <th>Abreise</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.departure}}</span>
+                    </td>
+                </tr>
+                <tr>
+                    <th>Teilnahmegruppe</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.participationType}}</span>
+                    </td>
+                </tr>
+
+                <tr>
+                    <th>Ernährung</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.eatingHabit}}</span>
+                    </td>
+                </tr>
+                <tr>
+                    <th>eFZ-Status</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.efzStatusReadable}}</span>
+                    </td>
+                </tr>
+
+                <tr>
+                    <th>Beitrag</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.amountPaid.readable}} / {{props.participant.amountExpected.readable}}</span>
+                    </td>
+                </tr>
+            </table>
+        </div>
+        <div>
+            <h3>Medizinische Informationen</h3>
+            <table>
+                <tr>
+                    <th>Allergien</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.allergies}}</span>
+                    </td>
+                </tr>
+                <tr>
+                    <th>Unverträglichkeiten</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.intolerances}}</span>
+                    </td>
+                </tr>
+
+                <tr>
+                    <th>Medikamente</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.medications}}</span>
+                    </td>
+                </tr>
+
+                <tr>
+                    <th>Erweiterte Erste Hilfe</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.extendedFirstAid}}</span>
+                    </td>
+                </tr>
+
+                <tr>
+                    <th>Badeerlaubnis</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.swimmingPermission}}</span>
+                    </td>
+                </tr>
+                <tr>
+                    <th>Letzte Tetanus-Impfung</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.tetanusVaccination}}</span>
+                    </td>
+                </tr>
+
+                <tr>
+                    <th>Anmerkungen</th>
+                    <td>
+                        <span v-if="!props.editMode">{{props.participant.notes}}</span>
+                    </td>
+                </tr>
+            </table>
+        </div>
+    </div>
+
+    <button class="button">Bearbeiten</button>
+    <button class="button" @click="paymentComplete(props.participant)">Zahlung vollständig</button>
+    <button class="button" @click="markCocExisting(props.participant)">eFZ liegt vor</button>
+    <button class="button" @click="cancelParticipation(props.participant)">Abmelden</button>
+    <button class="button" @click="close">Schließen</button>
+
+</template>
+
+<style scoped>
+.participationData {
+    display: flex;
+    margin-bottom: 20px;
+}
+
+.participationData div {
+    flex: 1;
+    vertical-align: top;
+}
+
+</style>