import { Module, MutationTree, ActionTree, GetterTree } from 'vuex'; import { StateInterface } from 'src/store'; import { axios } from 'src/boot/axios'; import { AxiosResponse } from 'axios'; export interface JobType { id: number; name: string; } export interface EventType { id: number; name: string; } export interface ScheduleInterface { jobTypes: JobType[]; eventTypes: EventType[]; events: FG.Event[]; } const state: ScheduleInterface = { jobTypes: [], eventTypes: [], events: [] }; interface Event { start: Date; end?: Date; description: string; type: EventType; jobs: Job[]; } interface Job { id: number; start: Date | null; end?: Date | null; comment: string; type: FG.JobType | null; services: Array; required_services: number; } const mutations: MutationTree = { setJobTypes(state, jobTypes: JobType[]) { state.jobTypes = jobTypes; }, addJobType(state, jobType: JobType) { state.jobTypes.unshift(jobType); }, removeJobType(state, id: number) { const index = state.jobTypes.findIndex(item => item.id == id); state.jobTypes.splice(index, 1); }, setJobType(state, jobType: JobType) { const _jobtype = state.jobTypes.find(item => item.id == jobType.id); if (_jobtype) { _jobtype.name = jobType.name; } }, setEventTypes(state, eventTypes: EventType[]) { state.eventTypes = eventTypes; }, addEventType(state, eventType: EventType) { state.eventTypes.unshift(eventType); }, removeEventType(state, id: number) { const index = state.eventTypes.findIndex(item => item.id == id); state.eventTypes.splice(index, 1); }, setEventType(state, eventType: EventType) { const _eventtype = state.eventTypes.find(item => item.id == eventType.id); if (_eventtype) { _eventtype.name = eventType.name; } }, addEvent(state, event: FG.Event) { state.events.unshift(event); }, setEvents(state, events: FG.Event[]) { state.events = events; }, updateEvent(state, event: FG.Event) { /*let eventToChange = state.events.find(ev => ev.id == event.id); eventToChange = event; */ const index = state.events.findIndex(ev => ev.id == event.id); if (index > -1) { state.events[index] = event; } } }; const actions: ActionTree = { getJobTypes({ commit }) { axios .get('/schedule/job-types') .then((response: AxiosResponse) => { console.log('action:', response.data); commit('setJobTypes', response.data); }) .catch(err => { console.warn(err); }); }, addJobType({ commit }, data) { axios .post('/schedule/job-types', data) .then((response: AxiosResponse) => { commit('addJobType', response.data); }) .catch(err => { console.warn(err); }); }, removeJobType({ commit }, data: number) { axios .delete(`/schedule/job-types/${data}`) .then(() => { commit('removeJobType', data); }) .catch(err => { console.warn(err); }); }, changeJobTypeName({ commit }, jobtype: JobType) { axios .put(`/schedule/job-types/${jobtype.id}`, jobtype) .then(() => { commit('setJobType', jobtype); }) .catch(err => { console.warn(err); }); }, getEventTypes({ commit }) { axios .get('/schedule/event-types') .then((response: AxiosResponse) => { console.log('action:', response.data); commit('setEventTypes', response.data); }) .catch(err => { console.warn(err); }); }, addEventType({ commit }, data) { console.log(data); axios .post('/schedule/event-types', data) .then((response: AxiosResponse) => { commit('addEventType', response.data); }) .catch(err => { console.warn(err); }); }, removeEventType({ commit }, data: number) { axios .delete(`/schedule/event-types/${data}`) .then(() => { commit('removeEventType', data); }) .catch(err => { console.warn(err); }); }, changeEventTypeName({ commit }, eventtype: { id: number; name: string; oldname: string }) { axios .put(`/schedule/event-types/${eventtype.id}`, eventtype) .then(() => { commit('setEventType', eventtype); }) .catch(err => { console.warn(err); }); }, addEvent({ commit }, event: Event) { axios .post('/schedule/events', event) .then((response: AxiosResponse) => { commit('addEvent', response.data); }) .catch(err => { console.warn(err); }); console.log('Events: ', state.events); }, updateEvent( { commit }, updateInformation: { eventId: number; JobId: number; service: FG.Service } ) { axios .put( `/schedule/events/${updateInformation.eventId}/jobs/${updateInformation.JobId}`, updateInformation.service ) .then((response: AxiosResponse) => { response.data.start = new Date(response.data.start); commit('updateEvent', response.data); }) .catch(err => { console.warn(err); }); }, getEvents({ commit }) { axios .get('/schedule/events') .then((response: AxiosResponse) => { console.log('action:', response.data); response.data.forEach(event => { event.start = new Date(event.start); }); commit('setEvents', response.data); }) .catch(err => { console.warn(err); }); } }; const getters: GetterTree = { jobTypes(state) { return state.jobTypes; }, events(state) { return state.events; } }; const schedule: Module = { namespaced: true, state, mutations, actions, getters }; export default schedule;