From c4b9a7d782759413b6aaed362cb13a0c67af44a6 Mon Sep 17 00:00:00 2001 From: "Torsten Schulz (local)" Date: Mon, 1 Sep 2025 11:23:02 +0200 Subject: [PATCH] =?UTF-8?q?Verbessert=20die=20Benutzeroberfl=C3=A4che=20in?= =?UTF-8?q?=20DiaryView.vue,=20indem=20die=20Struktur=20des=20Unfallformul?= =?UTF-8?q?ars=20optimiert=20und=20die=20Audioinitialisierung=20an=20die?= =?UTF-8?q?=20Benutzerinteraktion=20angepasst=20wird.=20F=C3=BCgt=20Logik?= =?UTF-8?q?=20zur=20=C3=9Cberpr=C3=BCfung=20von=20Aktivit=C3=A4tszeiten=20?= =?UTF-8?q?hinzu=20und=20stellt=20sicher,=20dass=20Audio=20nur=20bei=20akt?= =?UTF-8?q?ivierter=20Funktion=20abgespielt=20wird.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/views/DiaryView.vue | 140 +++++++++++++++++++++---------- 1 file changed, 97 insertions(+), 43 deletions(-) diff --git a/frontend/src/views/DiaryView.vue b/frontend/src/views/DiaryView.vue index d89f086..9d36492 100644 --- a/frontend/src/views/DiaryView.vue +++ b/frontend/src/views/DiaryView.vue @@ -311,30 +311,30 @@
- -
-
-
- - -
-
- - -
- - -
    -
  • {{ accident.firstName + ' ' + accident.lastName + - ': ' - + accident.accident}}
    • -
-
+
+
+
+ + +
+
+ + +
+ + +
    +
  • {{ accident.firstName + ' ' + accident.lastName + + ': ' + + accident.accident}}
    • +
+
+
@@ -398,9 +398,12 @@ export default { tagHistoryMember: null, tagHistory: null, intermediateTimes: [], - bellSound: new Audio('/sound/bell-123742.mp3'), - thumbSound: new Audio('/sound/thump-105302.mp3'), + bellSound: null, + thumbSound: null, + soundEnabled: true, + debugSound: true, timeChecker: null, + playedActivityMarks: [], showAccidentForm: false, accident: { memberId: '', @@ -465,6 +468,8 @@ export default { } }, + + async refreshDates(selectId) { const response = await apiClient.get(`/diary/${this.currentClub}`); this.dates = response.data.map(entry => ({ id: entry.id, date: entry.date })); @@ -592,7 +597,7 @@ export default { const response = await apiClient.get(`/group/${this.currentClub}/${this.date.id}`); this.groups = response.data; } catch (error) { - console.log(error); + // ignore } }, @@ -1168,6 +1173,7 @@ export default { if (this.timeChecker) clearInterval(this.timeChecker); this.timeChecker = setInterval(() => { const currentTime = new Date().toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', second: '2-digit' }); + // Zeit-Check Tick if (!this.trainingStart || !this.trainingEnd) { return; } @@ -1183,40 +1189,80 @@ export default { } if (startCheckTime && currentTime === startCheckTime) { this.playBellSound(); - } - if (endCheckTime && currentTime === endCheckTime) { + } else if (endCheckTime && currentTime === endCheckTime) { this.playBellSound(); + } else { + // Nach letzter Aktivität (Ende) nochmal Glocke + try { this.calculateAllItemTimes(); } catch (e) {} + const items = Array.isArray(this.trainingPlan) ? this.trainingPlan : []; + const lastItem = items.length ? items[items.length - 1] : null; + const lastEnd = lastItem && lastItem.endTime ? lastItem.endTime : null; + const lastEndSS = lastEnd ? (lastEnd.length === 5 ? lastEnd + ':00' : lastEnd) : null; + const lastEndMM = lastEndSS ? lastEndSS.slice(0, 5) : null; + const currentHHMM = currentTime.slice(0, 5); + if (lastEndSS && (currentTime === lastEndSS || (currentTime.endsWith(':00') && currentHHMM === lastEndMM))) { + this.playBellSound(); + } } - if (this.intermediateTimes.includes(currentTime)) { + // Aktivitätszeiten (Startzeiten) aus Trainingsplan prüfen + try { this.calculateAllItemTimes(); } catch (e) {} + const items = Array.isArray(this.trainingPlan) ? this.trainingPlan : []; + const startTimesSS = items + .map(it => (it && it.startTime ? (it.startTime.length === 5 ? it.startTime + ':00' : it.startTime) : null)) + .filter(Boolean); + const startTimesMM = startTimesSS.map(t => t.slice(0, 5)); + const currentHHMM = currentTime.slice(0, 5); + const isMatch = startTimesSS.includes(currentTime) || (currentTime.endsWith(':00') && startTimesMM.includes(currentHHMM)); + if (isMatch) { this.playThumbSound(); } }, 1000); }, playBellSound() { - this.bellSound.play(); + if (!this.soundEnabled) return; + try { + this.bellSound && this.bellSound.play(); + } catch (e) { + // ignore + } }, playThumbSound() { - this.thumbSound.play(); + if (!this.soundEnabled) return; + try { + this.thumbSound && this.thumbSound.play(); + } catch (e) { + // ignore + } }, calculateIntermediateTimes() { + // Stelle sicher, dass alle startTime-Werte aktuell sind + try { this.calculateAllItemTimes(); } catch(e) {} if (!this.trainingPlan || this.trainingPlan.length === 0) { this.intermediateTimes = []; return; } - let times = []; - let currentTime = new Date("2025-01-01 " + this.trainingStart); - this.trainingPlan.forEach(item => { - const rawItem = JSON.parse(JSON.stringify(item)); - currentTime.setMinutes(currentTime.getMinutes() + item.duration); - times.push(currentTime.toTimeString({ hours: '2-digit', minutes: '2-digit', seconds: '2-digit' }).slice(0, 8)); - }); - times = [...new Set(times)].sort(); - this.intermediateTimes = times.filter(time => - time !== this.trainingStart && time !== this.trainingEnd - ); + function withSeconds(hhmm) { + if (!hhmm) return null; + const parts = hhmm.split(':'); + if (parts.length < 3) return hhmm + ':00'; + return hhmm; + } + const times = []; + for (const item of this.trainingPlan) { + if (item && item.startTime) { + const t = withSeconds(item.startTime); + if (t) times.push(t); + } + } + const normalizedStart = withSeconds(this.trainingStart); + const unique = Array.from(new Set(times)); + const filtered = unique.filter(t => t !== normalizedStart); + filtered.sort(); + this.intermediateTimes = filtered; + }, async addAccident() { @@ -1402,6 +1448,14 @@ export default { }, async mounted() { await this.init(); + // Versuche, Audio erst bei Nutzerinteraktion zu initialisieren (Autoplay-Policy) + const tryInit = () => { + if (!this.bellSound) this.bellSound = new Audio('/sound/bell-123742.mp3'); + if (!this.thumbSound) this.thumbSound = new Audio('/sound/thump-105302.mp3'); + this.soundEnabled = true; + window.removeEventListener('click', tryInit, { once: true }); + }; + window.addEventListener('click', tryInit, { once: true }); }, beforeUnmount() { if (this.timeChecker) {