flaschengeist-frontend/src/plugins/schedule/store/schedule.ts

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<FG.Service>;
  required_services: number;
}

const mutations: MutationTree<ScheduleInterface> = {
  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<ScheduleInterface, StateInterface> = {
  getJobTypes({ commit }) {
    axios
      .get('/schedule/job-types')
      .then((response: AxiosResponse<JobType[]>) => {
        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<JobType>) => {
        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<EventType[]>) => {
        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<EventType>) => {
        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<Event>) => {
        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<FG.Event>) => {
        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<Event[]>) => {
        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<ScheduleInterface, StateInterface> = {
  jobTypes(state) {
    return state.jobTypes;
  },
  events(state) {
    return state.events;
  },
};

const schedule: Module<ScheduleInterface, StateInterface> = {
  namespaced: true,
  state,
  mutations,
  actions,
  getters,
};

export default schedule;