From 459dd3168a38da9f9c0fdf5f1b730293a2c4a0bf Mon Sep 17 00:00:00 2001 From: "Torsten Schulz (local)" Date: Tue, 7 Oct 2025 17:20:17 +0200 Subject: [PATCH] =?UTF-8?q?Verbessere=20die=20Auswahl=20von=20liturgischen?= =?UTF-8?q?=20Tagen=20im=20Worship=20Management:=20Filtere=20nur=20zuk?= =?UTF-8?q?=C3=BCnftige=20Tage,=20formatiere=20die=20Anzeige=20mit=20Datum?= =?UTF-8?q?=20und=20Namen=20und=20aktualisiere=20die=20Logik=20zur=20Auswa?= =?UTF-8?q?hl=20und=20Speicherung=20des=20liturgischen=20Tages.=20Optimier?= =?UTF-8?q?e=20die=20Handhabung=20von=20Tags=20und=20deren=20Zuordnung=20i?= =?UTF-8?q?m=20Formular.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/content/admin/WorshipManagement.vue | 99 ++++++++++++++----------- 1 file changed, 54 insertions(+), 45 deletions(-) diff --git a/src/content/admin/WorshipManagement.vue b/src/content/admin/WorshipManagement.vue index f247e64..1dc6016 100644 --- a/src/content/admin/WorshipManagement.vue +++ b/src/content/admin/WorshipManagement.vue @@ -244,9 +244,33 @@ export default { const response = await axios.get('/liturgical-days'); this.liturgicalDays = response.data; - // Erstelle Optionen für Multiselect - const uniqueNames = [...new Set(response.data.map(day => day.dayName))]; - this.dayNameOptions = uniqueNames.sort().map(name => ({ name })); + // Nur zukünftige Tage anzeigen + const today = new Date(); + today.setHours(0, 0, 0, 0); + + const futureDays = response.data.filter(day => { + const dayDate = new Date(day.date); + dayDate.setHours(0, 0, 0, 0); + return dayDate >= today; + }); + + // Sortiere nach Datum + futureDays.sort((a, b) => new Date(a.date) - new Date(b.date)); + + // Erstelle Optionen mit Datum und Name: "30.11.2025 - 1. Advent" + this.dayNameOptions = futureDays.map(day => { + const date = new Date(day.date); + const formattedDate = date.toLocaleDateString('de-DE', { + day: '2-digit', + month: '2-digit', + year: 'numeric' + }); + return { + name: `${formattedDate} - ${day.dayName}`, + dayName: day.dayName, + date: day.date + }; + }); } catch (error) { console.error('Fehler beim Abrufen der liturgischen Tage:', error); } @@ -294,7 +318,11 @@ export default { }); if (liturgicalDay) { - this.selectedDayName = { name: liturgicalDay.dayName }; + // Finde die passende Option mit formatiertem Datum + const option = this.dayNameOptions.find(opt => opt.date === selectedDate); + if (option) { + this.selectedDayName = option; + } this.worshipData.dayName = liturgicalDay.dayName; console.log('Liturgischer Tag gefunden:', liturgicalDay.dayName); } else { @@ -307,46 +335,14 @@ export default { }); }, updateDateFromDayName() { - if (!this.selectedDayName || !this.selectedDayName.name) { + if (!this.selectedDayName || !this.selectedDayName.date) { return; } - // Finde liturgischen Tag mit diesem Namen - // Wenn es mehrere gibt (z.B. mehrere Sonntage), nimm den nächsten in der Zukunft - const today = new Date(); - today.setHours(0, 0, 0, 0); - - const matchingDays = this.liturgicalDays.filter(day => - day.dayName === this.selectedDayName.name - ); - - if (matchingDays.length > 0) { - // Sortiere nach Datum - matchingDays.sort((a, b) => new Date(a.date) - new Date(b.date)); - - // Finde den nächsten Tag in der Zukunft oder heute - let selectedDay = matchingDays.find(day => { - const dayDate = new Date(day.date); - dayDate.setHours(0, 0, 0, 0); - return dayDate >= today; - }); - - // Wenn keiner in der Zukunft, nimm den letzten vergangenen - if (!selectedDay) { - selectedDay = matchingDays[matchingDays.length - 1]; - } - - // Setze das Datum - const dayDate = typeof selectedDay.date === 'string' - ? selectedDay.date - : selectedDay.date.split('T')[0]; - - this.worshipData.date = dayDate; - this.worshipData.dayName = selectedDay.dayName; - console.log('Datum gesetzt auf:', dayDate, 'für', selectedDay.dayName); - } else { - console.log('Kein Datum gefunden für Tag:', this.selectedDayName.name); - } + // Das Datum ist bereits in der Option enthalten + this.worshipData.date = this.selectedDayName.date; + this.worshipData.dayName = this.selectedDayName.dayName; + console.log('Datum gesetzt auf:', this.selectedDayName.date, 'für', this.selectedDayName.dayName); }, async saveWorship() { try { @@ -355,7 +351,7 @@ export default { eventPlaceId: this.selectedEventPlace ? this.selectedEventPlace.id : null, organizer: this.selectedOrganizers.map(org => org.name).join(', '), sacristanService: this.selectedSacristans.map(sac => sac.name).join(', '), - dayName: this.selectedDayName ? this.selectedDayName.name : '' + dayName: this.selectedDayName ? this.selectedDayName.dayName : '' }; if (this.editMode) { @@ -386,8 +382,15 @@ export default { ? worship.sacristanService.split(',').map(sac => ({ name: sac.trim() })) : []; - // Setze dayName - this.selectedDayName = worship.dayName ? { name: worship.dayName } : null; + // Setze dayName - finde die passende Option + if (worship.dayName) { + const option = this.dayNameOptions.find(opt => + opt.dayName === worship.dayName && opt.date === this.worshipData.date + ); + this.selectedDayName = option || null; + } else { + this.selectedDayName = null; + } this.editMode = true; this.editId = worship.id; @@ -445,9 +448,15 @@ export default { this.selectedSacristans.push(tag); }, addDayNameTag(newTag) { - const tag = { name: newTag }; + // Wenn manuell ein Tag eingegeben wird, ohne Datum + const tag = { + name: newTag, + dayName: newTag, + date: this.worshipData.date || null + }; this.dayNameOptions.push(tag); this.selectedDayName = tag; + this.worshipData.dayName = newTag; } } };