blob: a4661169dd19a9d02dbd53090156aa2374910b8f (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
|
<template>
<input :value="formattedDate" @input="onInput" type="date" />
</template>
<script>
const fromISO8601 = (string) => new Date(string);
const toISO8601 = (date) => date.toISOString();
const pad = (what, length = 2) => `00000000${what}`.substr(-length);
export default {
emits: ['update:model-value'],
props: ['model-value'],
data: () => ({
date: new Date(),
}),
computed: {
formattedDate() {
return `${this.date.getFullYear()}-${pad(this.date.getMonth() + 1)}-${pad(this.date.getDate())}`;
},
},
methods: {
onInput({ target }) {
const newValue = toISO8601(target.valueAsDate);
if (newValue !== this.modelValue) {
this.$emit('update:model-value', newValue);
}
},
},
created() {
if (this.modelValue) {
this.date = fromISO8601(this.modelValue);
}
},
};
</script>
|
