adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-17 04:32:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix time zone issue in daterangepicker

Browse Source
This commit is contained in:
Gregor Vostrak
2025-05-21 12:34:02 -07:00
parent 15411ec0c8
commit f1dce88dab
1 changed files with 26 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
resources/js/packages/ui/src/Input/DateRangePicker.vue
View File

@@ -5,10 +5,7 @@ import {
PopoverTrigger, PopoverTrigger,
} from '@/Components/ui/popover'; } from '@/Components/ui/popover';
import { RangeCalendar } from '@/Components/ui/range-calendar'; import { RangeCalendar } from '@/Components/ui/range-calendar';
import { import { CalendarDate } from '@internationalized/date';
CalendarDate,
getLocalTimeZone,
} from '@internationalized/date';
import { CalendarIcon } from 'lucide-vue-next'; import { CalendarIcon } from 'lucide-vue-next';
import { computed, ref, inject, type ComputedRef, watch } from 'vue'; import { computed, ref, inject, type ComputedRef, watch } from 'vue';
import { twMerge } from 'tailwind-merge'; import { twMerge } from 'tailwind-merge';
@@ -16,8 +13,9 @@ import {
getDayJsInstance, getDayJsInstance,
getLocalizedDayJs, getLocalizedDayJs,
} from '@/packages/ui/src/utils/time'; } from '@/packages/ui/src/utils/time';
import { formatDateLocalized } from '@/packages/ui/src/utils/time';
import { type Organization } from '@/packages/api/src'; import { type Organization } from '@/packages/api/src';
import { getUserTimezone } from '@/packages/ui/src/utils/settings';
import { formatDate } from '@/packages/ui/src/utils/time';
const props = defineProps<{ const props = defineProps<{
start: string; start: string;
@@ -59,12 +57,13 @@ const modelValue = computed<CalendarDateRange>({
}), }),
set: (newValue) => { set: (newValue) => {
if (newValue.start) { if (newValue.start) {
const date = newValue.start.toDate(getLocalTimeZone()); console.log(newValue.start);
emit('update:start', getDayJsInstance()(date).format('YYYY-MM-DD')); const date = newValue.start.toDate(getUserTimezone());
emit('update:start', getLocalizedDayJs(date.toString()).format());
} }
if (newValue.end) { if (newValue.end) {
const date = newValue.end.toDate(getLocalTimeZone()); const date = newValue.end.toDate(getUserTimezone());
emit('update:end', getDayJsInstance()(date).format('YYYY-MM-DD')); emit('update:end', getLocalizedDayJs(date.toString()).format());
} }
}, },
}); });
@@ -219,12 +218,27 @@ watch(open, (value) => {
<CalendarIcon class="mr-2 h-4 w-4" /> <CalendarIcon class="mr-2 h-4 w-4" />
<template v-if="modelValue.start"> <template v-if="modelValue.start">
<template v-if="modelValue.end"> <template v-if="modelValue.end">
{{ formatDateLocalized(modelValue.start.toString(), organization?.date_format) }} {{
formatDate(
modelValue.start.toString(),
organization?.date_format
)
}}
- -
{{ formatDateLocalized(modelValue.end.toString(), organization?.date_format) }} {{
formatDate(
modelValue.end.toString(),
organization?.date_format
)
}}
</template> </template>
<template v-else> <template v-else>
{{ formatDateLocalized(modelValue.start.toString(), organization?.date_format) }} {{
formatDate(
modelValue.start.toString(),
organization?.date_format
)
}}
</template> </template>
</template> </template>
<template v-else> Pick a date </template> <template v-else> Pick a date </template>