ranges are immediately deleted as well as saved (needs refactoring)

This commit is contained in:
Julie Lenaerts 2022-05-06 16:25:03 +02:00
parent 28c0b8994b
commit 5a1a33b6a4

View File

@ -26,7 +26,7 @@
</FullCalendar>
<div>
<ul class="record_actions">
<li>
<!-- <li>
<button class="btn btn-save" :disabled="!dirty"
@click.prevent="onClickSave">
{{ $t('action.save')}}
@ -35,7 +35,7 @@
<i class="fa fa-circle-o-notch fa-spin fa-fw"></i>
<span class="sr-only">{{ $t('loading') }}</span>
</span>
</li>
</li> -->
<li>
<button v-if="disableCopyDayButton" class="btn btn-action" disabled>
{{ $t('copy_range_to_next_day')}}
@ -203,6 +203,7 @@ export default {
},
methods: {
init() {
console.log('init')
this.fetchData();
},
openModal() {
@ -228,6 +229,7 @@ export default {
fetchData() {
this.flag.loading = true;
fetchCalendarRangesByUser(this.userId).then(calendarRanges => new Promise((resolve, reject) => {
// console.log('calendar ranges', calendarRanges.results)
let events = calendarRanges.results.map(i =>
({
start: i.startDate.datetime,
@ -291,20 +293,20 @@ export default {
onDateSelect(payload) {
// console.log('payload', payload);
let events = this.calendarEvents.new.events;
events.push({
start: payload.startStr,
end: payload.endStr
});
this.calendarEvents.new = {
events: events,
borderColor: "#3788d8",
backgroundColor: '#fffadf',
textColor: '#444444',
};
// events.push({
// start: payload.startStr,
// end: payload.endStr
// });
// this.calendarEvents.new = {
// events: events,
// borderColor: "#3788d8",
// backgroundColor: '#fffadf',
// textColor: '#444444',
// };
this.disableCopyDayButton = false;
this.lastNewDate = new Date(payload.startStr);
this.updateEventsSource();
this.$store.dispatch('createRange', payload);
// this.$store.dispatch('createRange', payload);
postCalendarRange({
user: {
type: 'user',
@ -316,6 +318,8 @@ export default {
endDate: {
datetime: `${payload.end.toISOString().split('.')[0]}+0000`, // TODO check if OK with time zone
},
}).then(() => {
this.init();
})
},
onEventChange(payload) {
@ -342,62 +346,65 @@ export default {
this.openModal();
}
},
onClickSave(payload) {
this.flag.loading = true;
if (this.$store.state.newCalendarRanges.length > 0){
Promise.all(this.$store.state.newCalendarRanges.map(cr => {
postCalendarRange({
user: {
type: 'user',
id: window.userId,
},
startDate: {
datetime: `${cr.start.toISOString().split('.')[0]}+0000`, //should be like "2021-08-20T15:00:00+0200",
},
endDate: {
datetime: `${cr.end.toISOString().split('.')[0]}+0000`, // TODO check if OK with time zone
},
})
})
).then((_r) => this.resetCalendar());
// onClickSave(payload) {
// this.flag.loading = true;
// if (this.$store.state.newCalendarRanges.length > 0){
// Promise.all(this.$store.state.newCalendarRanges.map(cr => {
// postCalendarRange({
// user: {
// type: 'user',
// id: window.userId,
// },
// startDate: {
// datetime: `${cr.start.toISOString().split('.')[0]}+0000`, //should be like "2021-08-20T15:00:00+0200",
// },
// endDate: {
// datetime: `${cr.end.toISOString().split('.')[0]}+0000`, // TODO check if OK with time zone
// },
// })
// })
// ).then((_r) => this.resetCalendar());
this.$store.dispatch('clearNewCalendarRanges', payload);
}
if (this.$store.state.updateCalendarRanges.length > 0){
Promise.all(this.$store.state.updateCalendarRanges.map(cr => {
patchCalendarRange(cr.id,
{
startDate: {
datetime: `${cr.start.toISOString().split('.')[0]}+0000`, //should be like "2021-08-20T15:00:00+0200",
},
endDate: {
datetime: `${cr.end.toISOString().split('.')[0]}+0000`, // TODO check if OK with time zone
},
})
})
).then((_r) => this.resetCalendar());
this.$store.dispatch('clearUpdateCalendarRanges', payload);
}
if (this.$store.state.deleteCalendarRanges.length > 0){
Promise.all(this.$store.state.deleteCalendarRanges.map(cr => {
deleteCalendarRange(cr.id)
})
).then((_r) => this.resetCalendar());
this.$store.dispatch('clearDeleteCalendarRanges', payload);
}
// this.$store.dispatch('clearNewCalendarRanges', payload);
// }
// if (this.$store.state.updateCalendarRanges.length > 0){
// Promise.all(this.$store.state.updateCalendarRanges.map(cr => {
// patchCalendarRange(cr.id,
// {
// startDate: {
// datetime: `${cr.start.toISOString().split('.')[0]}+0000`, //should be like "2021-08-20T15:00:00+0200",
// },
// endDate: {
// datetime: `${cr.end.toISOString().split('.')[0]}+0000`, // TODO check if OK with time zone
// },
// })
// })
// ).then((_r) => this.resetCalendar());
// this.$store.dispatch('clearUpdateCalendarRanges', payload);
// }
// if (this.$store.state.deleteCalendarRanges.length > 0){
// Promise.all(this.$store.state.deleteCalendarRanges.map(cr => {
// deleteCalendarRange(cr.id)
// })
// ).then((_r) => this.resetCalendar());
// this.$store.dispatch('clearDeleteCalendarRanges', payload);
// }
},
// },
onClickDelete(payload) {
if (payload.extendedProps.hasOwnProperty("calendarRangeId")) {
if (payload.extendedProps.toDelete) {
payload.setExtendedProp('toDelete', false)
payload.setProp('borderColor', '#79bafc');
this.$store.dispatch('removeFromDeleteRange', payload);
} else {
payload.setExtendedProp('toDelete', true)
payload.setProp('borderColor', '#dddddd');
this.$store.dispatch('deleteRange', payload);
}
deleteCalendarRange(payload.extendedProps.calendarRangeId).then(() => {
this.init();
})
// if (payload.extendedProps.toDelete) {
// payload.setExtendedProp('toDelete', false)
// payload.setProp('borderColor', '#79bafc');
// this.$store.dispatch('removeFromDeleteRange', payload);
// } else {
// payload.setExtendedProp('toDelete', true)
// payload.setProp('borderColor', '#dddddd');
// this.$store.dispatch('deleteRange', payload);
// }
} else {
let newEvents = this.calendarEvents.new.events;
let filterEvents = newEvents.filter((e) =>