1
0
mirror of https://github.com/amir20/dozzle.git synced 2025-12-26 23:21:41 +01:00
Files
dozzle/assets/components/RelativeTime.vue
Amir Raminfar 25daf6b502 Uses locale date and time depending on locale (#1874)
* Uses locale date and time depending on locale

* Fixes tests
2022-09-12 09:34:24 -07:00

23 lines
701 B
Vue

<template>
<time :datetime="date.toISOString()">{{ format(date) }}</time>
</template>
<script lang="ts" setup>
defineProps<{
date: Date;
}>();
// hourStyle
const dateFormatter = new Intl.DateTimeFormat(undefined, { day: "2-digit", month: "2-digit", year: "numeric" });
const use12Hour = $computed(() => ({ auto: undefined, "12": true, "24": false }[hourStyle.value]));
const timeFormatter = $computed(
() => new Intl.DateTimeFormat(undefined, { hour: "numeric", minute: "2-digit", second: "2-digit", hour12: use12Hour })
);
function format(date: Date) {
const dateStr = dateFormatter.format(date);
const timeStr = timeFormatter.format(date);
return `${dateStr} ${timeStr}`;
}
</script>