fix: input date format not updating

Signed-off-by: Corentin Thomasset <corentin.thomasset74@gmail.com>
This commit is contained in:
Corentin Thomasset 2020-06-07 10:22:12 +02:00
parent cab52baa66
commit 95df202ea1

View file

@ -7,21 +7,19 @@
<div class="text-center"> <div class="text-center">
<v-switch v-model="useCurrentDate" label="Use current date"/> <v-switch v-model="useCurrentDate" label="Use current date"/>
</div> </div>
<v-divider></v-divider> <v-divider></v-divider>
<br> <br>
<v-row> <v-row>
<v-col md="4" sm="12" class="pt-0 pb-0"> <v-col md="4" sm="12" class="pt-0 pb-0">
<v-select <v-select
:items="formats.filter(f => !f.title.toLowerCase().includes('locale'))" :items="formats.filter(f => !f.title.toLowerCase().includes('locale')).map(v => v.title)"
item-value="dateFromFormat"
item-text="title"
outlined outlined
label="Your date format" label="Your date format"
placeholder="Input format" placeholder="Input format"
v-model="inputFormater" v-model="inputFormatterTitle"
@input="userInputChanged()" @input="userInputChanged()"
:disabled="useCurrentDate"
/> />
</v-col> </v-col>
<v-col md="8" sm="12" class="pt-0 pb-0"> <v-col md="8" sm="12" class="pt-0 pb-0">
@ -31,6 +29,7 @@
label="Your date string" label="Your date string"
@input="userInputChanged()" @input="userInputChanged()"
:error="invalidInput" :error="invalidInput"
:disabled="useCurrentDate"
/> />
</v-col> </v-col>
</v-row> </v-row>
@ -67,14 +66,14 @@
name: "DateConverter", name: "DateConverter",
created() { created() {
setInterval(this.refreshCurrentDate.bind(this), 1000); setInterval(this.refreshCurrentDate.bind(this), 1000);
this.inputFormater = this.formats[1].dateFromFormat; this.inputFormatterTitle = this.formats[1].title;
}, },
data() { data() {
const vm = this; const vm = this;
return { return {
inputString: '', inputString: '',
inputFormater: undefined, inputFormatterTitle: undefined,
useCurrentDate: true, useCurrentDate: true,
displayedDate: new Date(), displayedDate: new Date(),
invalidInput: false, invalidInput: false,
@ -137,7 +136,7 @@
userInputChanged() { userInputChanged() {
try { try {
this.invalidInput = false; this.invalidInput = false;
const newDate = this.inputFormater(this.inputString); const newDate = this.formats.find(f => f.title === this.inputFormatterTitle)?.dateFromFormat(this.inputString);
if (newDate && !isNaN(newDate.getTime())) { if (newDate && !isNaN(newDate.getTime())) {
this.useCurrentDate = false; this.useCurrentDate = false;