diff --git a/.changes/unreleased/Fixed-20250811-155212.yaml b/.changes/unreleased/Fixed-20250811-155212.yaml new file mode 100644 index 000000000..5d0981f91 --- /dev/null +++ b/.changes/unreleased/Fixed-20250811-155212.yaml @@ -0,0 +1,6 @@ +kind: Fixed +body: fix date formatting in calendar range display +time: 2025-08-11T15:52:12.949078671+02:00 +custom: + Issue: "" + SchemaChange: No schema change diff --git a/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App2.vue b/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App2.vue index f4a85f855..748fc506e 100644 --- a/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App2.vue +++ b/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App2.vue @@ -104,7 +104,7 @@ event.title }} {{ formatDate(event.startStr) }} - + >{{ formatDate(event.startStr) }} - {{ formatDate(event.endStr, 'time') }}: {{ event.extendedProps.locationName }} {{ @@ -296,9 +296,26 @@ const nextWeeks = computed((): Weeks[] => }), ); -const formatDate = (datetime: string) => { - console.log(typeof datetime); - return ISOToDate(datetime); +const formatDate = (datetime: string, format: null | 'time' = null) => { + const date = ISOToDate(datetime); + if (!date) return ''; + + if (format === 'time') { + return date.toLocaleTimeString('fr-FR', { + hour: '2-digit', + minute: '2-digit' + }); + } + + // French date formatting + return date.toLocaleDateString('fr-FR', { + weekday: 'short', + year: 'numeric', + month: 'short', + day: 'numeric', + hour: '2-digit', + minute: '2-digit' + }); }; const baseOptions = ref({ diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/js/date.ts b/src/Bundle/ChillMainBundle/Resources/public/chill/js/date.ts index 8a0d7cce0..d9b37af1c 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/js/date.ts +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/js/date.ts @@ -37,8 +37,13 @@ export const ISOToDate = (str: string | null): Date | null => { return null; } - const [year, month, day] = str.split("-").map((p) => parseInt(p)); + // If the string already contains time info, use it directly + if (str.includes('T') || str.includes(' ')) { + return new Date(str); + } + // Otherwise, parse date only + const [year, month, day] = str.split("-").map((p) => parseInt(p)); return new Date(year, month - 1, day, 0, 0, 0, 0); };