diff --git a/resources/js/filters/components/filters/DateRangeFilter.vue b/resources/js/filters/components/filters/DateRangeFilter.vue index e6b5f2409..689ec2454 100644 --- a/resources/js/filters/components/filters/DateRangeFilter.vue +++ b/resources/js/filters/components/filters/DateRangeFilter.vue @@ -13,6 +13,7 @@ import DateRangeFilterValue from "@/filters/components/filters/DateRangeFilterValue.vue"; import { cn } from "@/utils/cn"; import { FilterEmits, FilterProps } from "@/filters/types"; + import { getDefaultDateLocale, getWeekStartsOn } from "@/utils/dates"; const props = defineProps>(); const emit = defineEmits>(); @@ -158,8 +159,8 @@ :class="!inline ? 'hidden' : 'hidden md:block'" v-model="localValue" :number-of-months="2" - :locale="window.navigator.language" - :week-starts-on="props.filter.mondayFirst ? 1 : 0" + :locale="getDefaultDateLocale()" + :week-starts-on="getWeekStartsOn(props.filter.mondayFirst)" @update:start-value="(startDate) => localValue.start = startDate as CalendarDate" @update:model-value="onCalendarChange" :key="renderKey" diff --git a/resources/js/form/components/fields/Date.vue b/resources/js/form/components/fields/Date.vue index d19babcbd..9eca99bcc 100644 --- a/resources/js/form/components/fields/Date.vue +++ b/resources/js/form/components/fields/Date.vue @@ -34,11 +34,12 @@ import { createYear, createYearRange, toDate } from 'reka-ui/date' import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { Button } from "@/components/ui/button"; import { __ } from "@/utils/i18n"; +import { getDefaultDateLocale, getWeekStartsOn } from "@/utils/dates"; const props = defineProps>(); const emit = defineEmits>(); -const dateLocale = Intl.DateTimeFormat().resolvedOptions().locale; +const dateLocale = getDefaultDateLocale(); const open = ref(false); const isTouch = ref(false); @@ -219,7 +220,7 @@ function onMinuteChange(minute: string) { :model-value="calendarDateValue" v-model:placeholder="calendarViewingDate" :locale="dateLocale" - :week-starts-on="props.field.mondayFirst ? 0 : 6" + :week-starts-on="getWeekStartsOn(props.field.mondayFirst)" @update:model-value="onCalendarDateChange" class="p-3" > diff --git a/resources/js/utils/dates.ts b/resources/js/utils/dates.ts new file mode 100644 index 000000000..90db14db2 --- /dev/null +++ b/resources/js/utils/dates.ts @@ -0,0 +1,9 @@ + + +export function getWeekStartsOn(mondayFirst: boolean) { + return mondayFirst ? 0 : 6; +} + +export function getDefaultDateLocale() { + return Intl.DateTimeFormat().resolvedOptions().locale; +}