Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Julie Lenaerts 2022-05-06 16:25:03 +02:00
parent 28c0b8994b
commit 5a1a33b6a4
1 changed files with 72 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

137
src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App.vue
View File

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