fix calendar header timezone issue

This commit is contained in:
Gregor Vostrak
2025-10-06 19:30:58 +02:00
parent 8aabffd1e7
commit 4a50145329
2 changed files with 13 additions and 5 deletions

View File

@@ -2,9 +2,10 @@
import { computed, inject, type ComputedRef } from 'vue'; import { computed, inject, type ComputedRef } from 'vue';
import { formatDate, formatHumanReadableDuration } from '../utils/time'; import { formatDate, formatHumanReadableDuration } from '../utils/time';
import type { Organization } from '@/packages/api/src'; import type { Organization } from '@/packages/api/src';
import type { Dayjs } from 'dayjs';
const props = defineProps<{ const props = defineProps<{
date: Date; date: Dayjs;
totalMinutes?: number; totalMinutes?: number;
}>(); }>();
@@ -20,7 +21,7 @@ const dateFormat = computed(() => organization?.value?.date_format);
<template> <template>
<div class="fc-day-header-custom"> <div class="fc-day-header-custom">
<div class="text-xs text-muted-foreground font-medium"> <div class="text-xs text-muted-foreground font-medium">
{{ date.toLocaleDateString('en-US', { weekday: 'short' }) }} {{ date.format('ddd') }}
</div> </div>
<span>{{ formatDate(date.toISOString(), dateFormat) }}</span> <span>{{ formatDate(date.toISOString(), dateFormat) }}</span>
<span class="block text-xs text-muted-foreground font-medium mt-1"> <span class="block text-xs text-muted-foreground font-medium mt-1">

View File

@@ -250,7 +250,7 @@ const calendarOptions = computed(() => ({
editable: true, editable: true,
eventResizableFromStart: true, eventResizableFromStart: true,
eventDurationEditable: true, eventDurationEditable: true,
timeZone: 'America/Adak', timeZone: getUserTimezone(),
eventStartEditable: true, eventStartEditable: true,
select: handleDateSelect, select: handleDateSelect,
eventClick: handleEventClick, eventClick: handleEventClick,
@@ -332,9 +332,16 @@ watch(showEditTimeEntryModal, (value) => {
</template> </template>
<template #dayHeaderContent="arg"> <template #dayHeaderContent="arg">
<FullCalendarDayHeader <FullCalendarDayHeader
:date="arg.date" :date="
getDayJsInstance()(arg.date.toISOString()).utc().tz(getUserTimezone(), true)
"
:total-minutes=" :total-minutes="
dailyTotals[getDayJsInstance()(arg.date).format('YYYY-MM-DD')] || 0 dailyTotals[
getDayJsInstance()(arg.date)
.utc()
.tz(getUserTimezone(), true)
.format('YYYY-MM-DD')
] || 0
" /> " />
</template> </template>
</FullCalendar> </FullCalendar>