From cf3bd3cd6d43ffaff774cc329faac01fc3174da7 Mon Sep 17 00:00:00 2001
From: "Torsten Schulz (local)" <tsschulz@gmx.net>
Date: Thu, 13 Nov 2025 12:12:49 +0100
Subject: [PATCH] Enhance member training participation tracking and UI
 feedback

This commit adds functionality to track training participations for members in the backend, updating the MemberService to include a count of training participations. The frontend components, DiaryView and MembersView, have been updated to display warning icons based on the number of training participations, providing visual feedback for members with significant participation. CSS styles for warning icons have also been refined to improve visibility and user experience.
---
 backend/services/memberService.js  | 15 +++++++++++++++
 frontend/src/views/DiaryView.vue   | 29 +++++++++++++++++++++++++++--
 frontend/src/views/MembersView.vue | 21 +++++++++++++++++++--
 3 files changed, 61 insertions(+), 4 deletions(-)

diff --git a/backend/services/memberService.js b/backend/services/memberService.js
index 8f2da14..1010a5d 100644
--- a/backend/services/memberService.js
+++ b/backend/services/memberService.js
@@ -70,6 +70,21 @@ class MemberService {
                     }));
                 }
 
+                // Berechne Trainingsteilnahmen
+                const trainingParticipations = await Participant.count({
+                    include: [{
+                        model: DiaryDate,
+                        as: 'diaryDate',
+                        where: {
+                            clubId: clubId
+                        }
+                    }],
+                    where: {
+                        memberId: member.id
+                    }
+                });
+                memberJson.trainingParticipations = trainingParticipations;
+
                 const imageData = await this._prepareMemberImages(member, { forceReload: true });
                 memberJson.images = imageData.images;
                 memberJson.primaryImageId = imageData.primaryImageId;
diff --git a/frontend/src/views/DiaryView.vue b/frontend/src/views/DiaryView.vue
index f18a90a..2977401 100644
--- a/frontend/src/views/DiaryView.vue
+++ b/frontend/src/views/DiaryView.vue
@@ -389,11 +389,15 @@
                                 <input type="checkbox" :value="member.id" @change="toggleParticipant(member.id)"
                                     :checked="isParticipant(member.id)">
                             </label>
-                            <span class="clickable participant-name" @click.stop="openNotesModal(member)">{{
+                            <span class="clickable participant-name" @click.stop="openNotesModal(member)">
+                                <span v-if="member && member.testMembership && member.trainingParticipations >= 6" class="warning-icon warning-icon-severe" title="6 oder mehr Trainingsteilnahmen">🛑</span>
+                                <span v-else-if="member && member.testMembership && member.trainingParticipations >= 3" class="warning-icon" title="3 oder mehr Trainingsteilnahmen">⚠️</span>
+                                {{
                                     member ? member.firstName : ''
                                 }} {{
                                     member ? member.lastName : ''
-                                }}</span>
+                                }}
+                            </span>
                             <div class="participant-actions">
                                 <!-- Gruppenzuordnung für aktive Teilnehmer -->
                                 <select v-if="isParticipant(member.id) && groups.length > 0"
@@ -2581,6 +2585,27 @@ li.participant-row .participant-actions {
     margin-left: 0.25rem;
 }
 
+.warning-icon {
+    margin-right: 0.25rem;
+    font-size: 0.8rem;
+}
+
+.warning-icon-severe {
+    font-size: 0.8rem;
+    animation: pulse-warning 2s infinite;
+}
+
+@keyframes pulse-warning {
+    0%, 100% {
+        opacity: 1;
+        transform: scale(1);
+    }
+    50% {
+        opacity: 0.7;
+        transform: scale(1.1);
+    }
+}
+
 .multiselect {
     margin-bottom: 10px;
     width: 100%;
diff --git a/frontend/src/views/MembersView.vue b/frontend/src/views/MembersView.vue
index 3d2667f..b3fcc7c 100644
--- a/frontend/src/views/MembersView.vue
+++ b/frontend/src/views/MembersView.vue
@@ -177,7 +177,8 @@
                             <td>
                                 <span class="gender-symbol" :class="['gender-' + (member.gender || 'unknown'), { 'is-inactive': !member.active }]" :title="labelGender(member.gender)">{{ genderSymbol(member.gender) }}</span>
                                 <span class="gender-name" :class="['gender-' + (member.gender || 'unknown'), { 'is-inactive': !member.active }]">
-                                    <span v-if="member.testMembership && member.trainingParticipations >= 5" class="warning-icon" title="5 oder mehr Trainingsteilnahmen">⚠️</span>
+                                    <span v-if="member.testMembership && member.trainingParticipations >= 6" class="warning-icon warning-icon-severe" title="6 oder mehr Trainingsteilnahmen">🛑</span>
+                                    <span v-else-if="member.testMembership && member.trainingParticipations >= 3" class="warning-icon" title="3 oder mehr Trainingsteilnahmen">⚠️</span>
                                     {{ member.lastName }}, {{ member.firstName }}
                                     <span v-if="!member.active && showInactiveMembers" class="inactive-badge">inaktiv</span>
                                 </span>
@@ -1919,7 +1920,23 @@ table td {
 
 .warning-icon {
     margin-right: 0.25rem;
-    font-size: 1.1em;
+    font-size: 0.8rem;
+}
+
+.warning-icon-severe {
+    font-size: 0.8rem;
+    animation: pulse-warning 2s infinite;
+}
+
+@keyframes pulse-warning {
+    0%, 100% {
+        opacity: 1;
+        transform: scale(1);
+    }
+    50% {
+        opacity: 0.7;
+        transform: scale(1.1);
+    }
 }
 
         .member-image-gallery {