chill-bundles/src/Bundle/ChillCalendarBundle/Resources/public/vuejs/Calendar/store.js

import 'es6-promise/auto';
import { createStore } from 'vuex';

const debug = process.env.NODE_ENV !== 'production';

const addIdToValue = (string, id) => {
   let array = string ? string.split(',') : [];
   array.push(id.toString());
   let str = array.join();
   return str;
};

const removeIdFromValue = (string, id) => {
   let array = string.split(',');
   array = array.filter(el => el !== id.toString());
   let str = array.join();
   return str;
};

/*
* Assign missing keys for the ConcernedGroups component
*/
const mapEntity = (entity) => {
   Object.assign(entity, {thirdParties: entity.professionals, users: entity.invites});
   return entity;
};

const store = createStore({
   strict: debug,
   state: {
     activity: mapEntity(window.entity),
     currentEvent: null
   },
   mutations: {
      
      // ConcernedGroups
      addPersonsInvolved(state, payload) {
         //console.log('### mutation addPersonsInvolved', payload.result.type);
         switch (payload.result.type) {
            case 'person':
               state.activity.persons.push(payload.result);
               break;
            case 'thirdparty':
               state.activity.thirdParties.push(payload.result);
               break;
            case 'user':
               state.activity.users.push(payload.result); 
               break;
         };
      },
      removePersonInvolved(state, payload) {
         //console.log('### mutation removePersonInvolved', payload.type);
         switch (payload.type) {
            case 'person':
               state.activity.persons = state.activity.persons.filter(person => person !== payload);
               break;
            case 'thirdparty':
               state.activity.thirdParties = state.activity.thirdParties.filter(thirdparty => thirdparty !== payload);
               break;
            case 'user':
               state.activity.users = state.activity.users.filter(user => user !== payload); 
               break;
         };
      },
      // Calendar
      setEvents(state, payload) {
         console.log(payload)
         state.currentEvent = {start: payload.start, end: payload.end}
      }
   },
   actions: {
      addPersonsInvolved({ commit }, payload) {
         console.log('### action addPersonsInvolved', payload.result.type);
         switch (payload.result.type) {
            case 'person':
               let aPersons = document.getElementById("chill_calendarbundle_calendar_persons");
               aPersons.value = addIdToValue(aPersons.value, payload.result.id);
               break;
            case 'thirdparty':
               let aThirdParties = document.getElementById("chill_calendarbundle_calendar_professionals");
               aThirdParties.value = addIdToValue(aThirdParties.value, payload.result.id);
               break;
            case 'user':
               let aUsers = document.getElementById("chill_calendarbundle_calendar_invites");
               aUsers.value = addIdToValue(aUsers.value, payload.result.id);
               break;
         };
         commit('addPersonsInvolved', payload);
      },
      removePersonInvolved({ commit }, payload) {
         //console.log('### action removePersonInvolved', payload);
         switch (payload.type) {
            case 'person':
               let aPersons = document.getElementById("chill_calendarbundle_calendar_persons");
               aPersons.value = removeIdFromValue(aPersons.value, payload.id);
               break;
            case 'thirdparty':
               let aThirdParties = document.getElementById("chill_calendarbundle_calendar_professionals");
               aThirdParties.value = removeIdFromValue(aThirdParties.value, payload.id);
               break;
            case 'user':
               let aUsers = document.getElementById("chill_calendarbundle_calendar_invites");
               aUsers.value = removeIdFromValue(aUsers.value, payload.id);
               break;
         };
         commit('removePersonInvolved', payload);
      },

      // Calendar
      createEvent({ commit }, payload) {
         console.log('### action createEvent', payload);
         let startDateInput = document.getElementById("chill_calendarbundle_calendar_startDate");
         startDateInput.value = payload.startStr;
         let endDateInput = document.getElementById("chill_calendarbundle_calendar_endDate");
         endDateInput.value = payload.endStr;
         let mainUserInput = document.getElementById("chill_calendarbundle_calendar_mainUser");
         mainUserInput.value = payload.users.logged.id;
         commit('setEvents', payload);
      },
      updateEvent({ commit }, payload) {
         console.log('### action updateEvent', payload);
         let startDateInput = document.getElementById("chill_calendarbundle_calendar_startDate");
         startDateInput.value = payload.event.start.toISOString();
         let endDateInput = document.getElementById("chill_calendarbundle_calendar_endDate");
         endDateInput.value = payload.event.end.toISOString();
         let calendarRangeInput = document.getElementById("chill_calendarbundle_calendar_calendarRange");
         calendarRangeInput.value = Number(payload.event.extendedProps.calendarRangeId);
         let mainUserInput = document.getElementById("chill_calendarbundle_calendar_mainUser");
         mainUserInput.value = Number(payload.event.source.id);
         commit('setEvents', payload);
      },

  }
});

export default store;