Refactor date handling in CalendarView: Update date formatting to use local timezone instead of UTC, enhancing accuracy in date representation. Introduce a new helper method for consistent date formatting across the component. This change improves the overall user experience by ensuring dates are displayed correctly.

This commit is contained in:
Torsten Schulz (local)
2026-01-30 14:35:08 +01:00
parent cff0ce1e1a
commit 786420d1d2

View File

@@ -351,7 +351,12 @@ export default {
return this.currentDate.toLocaleDateString(this.$i18n.locale, options);
},
currentDateStr() {
return this.currentDate.toISOString().split('T')[0];
// Local timezone formatting to avoid UTC conversion issues
const d = this.currentDate;
const year = d.getFullYear();
const month = String(d.getMonth() + 1).padStart(2, '0');
const day = String(d.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
},
monthDays() {
const year = this.currentDate.getFullYear();
@@ -372,8 +377,10 @@ export default {
date.setDate(startDate.getDate() + i);
const dayOfWeekNum = date.getDay();
// Local timezone formatting
const dateStr = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
days.push({
date: date.toISOString().split('T')[0],
date: dateStr,
dayNumber: date.getDate(),
currentMonth: date.getMonth() === month,
isToday: date.getTime() === today.getTime(),
@@ -395,8 +402,10 @@ export default {
date.setDate(monday.getDate() + i);
const dayOfWeek = date.getDay();
// Local timezone formatting
const dateStr = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
days.push({
date: date.toISOString().split('T')[0],
date: dateStr,
dayNumber: date.getDate(),
weekday: this.weekDays[i],
isToday: date.getTime() === today.getTime(),
@@ -414,8 +423,10 @@ export default {
const dayIndex = date.getDay();
const weekdayIndex = dayIndex === 0 ? 6 : dayIndex - 1;
// Local timezone formatting
const dateStr = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
return {
date: date.toISOString().split('T')[0],
date: dateStr,
dayNumber: date.getDate(),
month: this.getMonthKey(date.getMonth()),
year: date.getFullYear(),
@@ -445,6 +456,13 @@ export default {
const months = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];
return months[monthIndex];
},
// Helper: Format date as YYYY-MM-DD in local timezone (not UTC!)
formatDateLocal(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
},
navigatePrev() {
const newDate = new Date(this.currentDate);
switch (this.currentView) {
@@ -540,7 +558,7 @@ export default {
this.selectedDates = [];
const current = new Date(start);
while (current <= end) {
this.selectedDates.push(current.toISOString().split('T')[0]);
this.selectedDates.push(this.formatDateLocal(current));
current.setDate(current.getDate() + 1);
}
},
@@ -601,7 +619,7 @@ export default {
// Dialog methods
openNewEventDialog(dateStr = null, hour = null, endDateStr = null) {
this.editingEvent = null;
const today = new Date().toISOString().split('T')[0];
const today = this.formatDateLocal(new Date());
this.eventForm = {
title: '',