remove save button datepicker parcours. set timeout

This commit is contained in:
Julie Lenaerts 2022-04-21 13:59:45 +02:00
parent 92d394b669
commit c6be7955fd

View File

@ -6,8 +6,7 @@
<div> <div>
<div class="mb-3 row"> <div class="mb-3 row">
<div class="col-sm-12 date-update"> <div class="col-sm-12 date-update">
<input class="form-control" type="date" id="startDate" v-model="startDate"> <input class="form-control" type="date" id="startDate" v-model="startDateInput">
<button class="btn btn-save date-update-btn" type="submit" @click="updateStartDate"></button>
</div> </div>
</div> </div>
</div> </div>
@ -17,31 +16,64 @@
<script> <script>
import { datetimeToISO, dateToISO, ISOToDate, ISOToDatetime} from 'ChillMainAssets/chill/js/date.js'; import { dateToISO, ISOToDatetime} from 'ChillMainAssets/chill/js/date.js';
import { mapState, mapGetters } from 'vuex'; import { mapState } from 'vuex';
export default { export default {
name: 'startDate', name: 'startDate',
data() {
return {
lastRecordedDate: null
}
},
methods: { methods: {
updateStartDate(e) { updateStartDate(e) {
e.preventDefault(); this.lastRecordedDate = e.target.value;
const date = e.target.previousSibling.value;
this.$store.dispatch('updateStartDate', date) setTimeout(() => {
// .then(this.$toast.open({type: 'success', message: this.$t('startdate.update')})) console.log('timeout finished')
.catch(({name, violations}) => { const date = e.target.value
if (name === 'ValidationException' || name === 'AccessException') { if (this.lastRecordedDate === date) {
violations.forEach((violation) => this.$toast.open({message: violation})); console.log('last recorded', this.lastRecordedDate, 'value', e.target.value)
} else { this.$store.dispatch('updateStartDate', date)
this.$toast.open({message: 'An error occurred'}) .catch(({name, violations}) => {
} if (name === 'ValidationException' || name === 'AccessException') {
}) violations.forEach((violation) => this.$toast.open({message: violation}));
} else {
this.$toast.open({message: 'An error occurred'})
}
})
}
}, 3000)
}, },
}, },
computed: { computed: {
...mapState({ ...mapState({
startDate: state => dateToISO(ISOToDatetime(state.accompanyingCourse.openingDate.datetime)) startDate: state => dateToISO(ISOToDatetime(state.accompanyingCourse.openingDate.datetime))
}) }),
startDateInput: {
get() {
return this.startDate;
},
set(value) {
this.lastRecordedDate = value;
setTimeout(() => {
console.log('timeout finished')
if (this.lastRecordedDate === value) {
console.log('last recorded', this.lastRecordedDate, 'value', value)
this.$store.dispatch('updateStartDate', value)
.catch(({name, violations}) => {
if (name === 'ValidationException' || name === 'AccessException') {
violations.forEach((violation) => this.$toast.open({message: violation}));
} else {
this.$toast.open({message: 'An error occurred'})
}
})
}
}, 3000)
}
}
} }
} }