diff --git a/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App.vue b/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App.vue index 9923001e9..e06fb50b1 100644 --- a/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App.vue +++ b/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App.vue @@ -186,6 +186,7 @@ export default { }, computed: { ...mapState({ + currentCalendarRanges: state => state.currentCalendarRanges, newCalendarRanges: state => state.newCalendarRanges, updateCalendarRanges: state => state.updateCalendarRanges, deleteCalendarRanges: state => state.deleteCalendarRanges, @@ -204,6 +205,7 @@ export default { methods: { init() { this.fetchData(); + console.log('calendar', this.$refs.fullCalendar.getApi().view.getCurrentData()) }, openModal() { this.modal.showModal = true; @@ -228,7 +230,6 @@ 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, @@ -281,7 +282,6 @@ export default { if (this.showMyCalendar) { this.calendarOptions.eventSources.push(this.calendarEvents.userCalendar); } - console.log('eventSources', this.calendarOptions.eventSources); }, toggleMyCalendar(value) { this.showMyCalendar = value; @@ -290,7 +290,6 @@ export default { this.calendarOptions.weekends = !this.calendarOptions.weekends; }, onDateSelect(payload) { - // console.log('payload', payload); let events = this.calendarEvents.new.events; // events.push({ // start: payload.startStr, @@ -305,7 +304,6 @@ export default { this.disableCopyDayButton = false; this.lastNewDate = new Date(payload.startStr); this.updateEventsSource(); - // this.$store.dispatch('createRange', payload); postCalendarRange({ user: { type: 'user', @@ -317,17 +315,24 @@ export default { endDate: { datetime: `${payload.end.toISOString().split('.')[0]}+0000`, // TODO check if OK with time zone }, - }).then(() => { - this.init(); + }).then((_r) => { + this.resetCalendar(); }) }, - onEventChange(payload) { - }, onEventDropOrResize(payload) { payload.event.setProp('borderColor', '#3788d8'); payload.event.setProp('backgroundColor', '#fffadf'); payload.event.setProp('textColor', '#444444'); - this.$store.dispatch('updateRange', payload); + + patchCalendarRange(payload.event.extendedProps.calendarRangeId, + { + startDate: { + datetime: `${payload.event.start.toISOString().split('.')[0]}+0000`, //should be like "2021-08-20T15:00:00+0200", + }, + endDate: { + datetime: `${payload.event.end.toISOString().split('.')[0]}+0000`, // TODO check if OK with time zone + }, + }).then((_r) => this.resetCalendar()); }, onEventClick(payload) { if (payload.event.extendedProps.myCalendar) { @@ -341,7 +346,6 @@ export default { professionals: payload.event.extendedProps.professionals, comment: payload.event.extendedProps.comment }; - // console.log(this.myCalendarClickedEvent) this.openModal(); } }, @@ -393,7 +397,7 @@ export default { onClickDelete(payload) { if (payload.extendedProps.hasOwnProperty("calendarRangeId")) { deleteCalendarRange(payload.extendedProps.calendarRangeId).then(() => { - this.init(); + this.resetCalendar(); }) // if (payload.extendedProps.toDelete) { // payload.setExtendedProp('toDelete', false) @@ -406,7 +410,7 @@ export default { // } } else { let newEvents = this.calendarEvents.new.events; - let filterEvents = newEvents.filter((e) => + let filterEvents = newEvents.filter((e) => e.start !== payload.startStr && e.end !== payload.endStr ); this.calendarEvents.new = { diff --git a/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/store.js b/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/store.js index a2a385f39..48a5d3ea9 100644 --- a/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/store.js +++ b/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/store.js @@ -10,11 +10,11 @@ const store = createStore({ newCalendarRanges: [], updateCalendarRanges: [], deleteCalendarRanges: [], - userRanges: [], + currentCalendarRanges: [], }, mutations: { - setUserRanges(state, payload) { - state.userRanges = payload + setCurrentCalendarRanges(state, payload) { + state.currentCalendarRanges = payload }, updateRange(state, payload) { state.updateCalendarRanges.push({ @@ -57,19 +57,22 @@ const store = createStore({ ) state.deleteCalendarRanges = filteredCollection; }, - addUserRange(state, payload) { - state.userRanges.push(payload); + addCalendarRange(state, payload) { + state.currentCalendarRanges.push(payload); } }, actions: { - setUserRanges({ commit }) { - console.log('userId', window.userId); + setCurrentCalendarRanges({ commit }) { + // console.log('userId', window.userId); fetchCalendarRangesByUser(window.userId) .then((ranges) => { - console.log('ranges', ranges.results); - commit('setUserRanges', ranges.results); + // console.log('ranges', ranges.results); + commit('setCurrentCalendarRanges', ranges.results); }) }, + addCalendarRange({ commit }, payload) { + commit('addCalendarRange', payload) + }, createRange({ commit }, payload) { // console.log('### action createRange', payload); commit('addRange', payload); @@ -97,10 +100,10 @@ const store = createStore({ removeFromDeleteRange({ commit }, payload) { commit('removeFromDeleteRange', payload); }, - } + } }); -store.dispatch('setUserRanges'); +store.dispatch('setCurrentCalendarRanges'); export default store;