feature.js

const axios = require("axios");
import router from '../../router'

axios.defaults.headers.common['X-CSRFToken'] = (name => {
  var re = new RegExp(name + "=([^;]+)");
  var value = re.exec(document.cookie);
  return (value != null) ? unescape(value[1]) : null;
})('csrftoken');


const feature = {
  namespaced: true,
  state: {
    attachmentFormset: [],
    linkedFormset: [],
    features: [],
    form: null,
    extra_form: [],
    linked_features: [],
  },
  mutations: {
    SET_FEATURES(state, features) {
      state.features = features;
    },
    UPDATE_FORM(state, payload) {
      state.form = payload;
    },
    UPDATE_EXTRA_FORM(state, extra_form) {
      const index = state.extra_form.findIndex(el => el.label === extra_form.label);
      if (index !== -1) {
        state.extra_form[index] = extra_form;
      }
    },
    SET_EXTRA_FORM(state, extra_form) {
      state.extra_form = extra_form;
    },
    ADD_ATTACHMENT_FORM(state, attachmentFormset) {
      state.attachmentFormset = [...state.attachmentFormset, attachmentFormset];
    },
    UPDATE_ATTACHMENT_FORM(state, payload) {
      const index = state.attachmentFormset.findIndex((el) => el.dataKey === payload.dataKey);
      if (index !== -1) state.attachmentFormset[index] = payload
    },
    REMOVE_ATTACHMENT_FORM(state, payload) {
      state.attachmentFormset = state.attachmentFormset.filter(form => form.dataKey !== payload);
    },
    CLEAR_ATTACHMENT_FORM(state) {
      state.attachmentFormset = [];
    },
    ADD_LINKED_FORM(state, linkedFormset) {
      state.linkedFormset = [...state.linkedFormset, linkedFormset];
    },
    UPDATE_LINKED_FORM(state, payload) {
      const index = state.linkedFormset.findIndex((el) => el.dataKey === payload.dataKey);
      if (index !== -1) state.linkedFormset[index] = payload
    },
    REMOVE_LINKED_FORM(state, payload) {
      state.linkedFormset = state.linkedFormset.filter(form => form.dataKey !== payload);
    },
    SET_LINKED_FEATURES(state, payload) {
      state.linked_features = payload;
    },
    CLEAR_LINKED_FORM(state) {
      state.linkedFormset = [];
    },
  },
  getters: {
  },
  actions: {
    GET_PROJECT_FEATURES({ commit, rootState }, project_slug) {
      return axios
        .get(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}projects/${project_slug}/feature/`)
        .then((response) => {
          if (response.status === 200 && response.data) {
            const features = response.data.features;
            commit("SET_FEATURES", features);
            //dispatch("map/ADD_FEATURES", null, { root: true }); //todo: should check if map was initiated
          }
        })
        .catch((error) => {
          throw error;
        });
    },

    SEND_FEATURE({ state, rootState, dispatch }, routeName) {
      let extraFormObject = {}; //* prepare an object to be flatten in properties of geojson
      for (const field of state.extra_form) {
        extraFormObject[field.name] = field.value;
      }
      const geojson = {
        "id": state.form.feature_id,
        "type": "Feature",
        "geometry": state.form.geometry,
        "properties": {
          "title": state.form.title,
          "description": state.form.description.value,
          "status": state.form.status.value,
          "project": rootState.project_slug,
          "feature_type": rootState.feature_type.current_feature_type_slug,
          ...extraFormObject
        }
      }

      if (routeName === "editer-signalement") {
        axios
          .put(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/${state.form.feature_id}/`, geojson)
          .then((response) => {
            if (response.status === 200 && response.data) {
              dispatch("SEND_ATTACHMENTS", response.data.id)
              dispatch("PUT_LINKED_FEATURES", response.data.id)
              router.push({
                name: "details-signalement",
                params: {
                  slug_type_signal: rootState.feature_type.current_feature_type_slug,
                  slug_signal: state.form.feature_id,
                  //message: "Le signalement a été mis à jour",
                },
              });
            }
          })
          .catch((error) => {
            throw error;
          });
        } else {
          axios
          .post(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/`, geojson)
          .then((response) => {
            if (response.status === 201 && response.data) {
              dispatch("SEND_ATTACHMENTS", response.data.id)
              dispatch("PUT_LINKED_FEATURES", response.data.id)
              router.push({
                name: "details-signalement",
                params: {
                  slug_type_signal: rootState.feature_type.current_feature_type_slug,
                  slug_signal: response.data.id,
                  //message: "Le signalement a été crée",
                },
              });
            }
          })
          .catch((error) => {
            throw error;
          });
      }
    },

    SEND_ATTACHMENTS({ state, rootState }, featureId) {
      for (let attacht of state.attachmentFormset) {
        if (!attacht.fileToImport) return; //* if no new file imported abort, until beeing able to do PUT
        let formdata = new FormData();
        formdata.append("file", attacht.fileToImport, attacht.fileToImport.name);
        const data = {
          title: attacht.title,
          info: attacht.info,
        }
        formdata.append("data", JSON.stringify(data));
        axios
          .post(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/${featureId}/attachments/`, formdata)
          .then((response) => {
            if (response.status === 200 && response.data) {
              console.log(response, response.data)
              return "La pièce jointe a bien été ajouté"
            }
          })
          .catch((error) => {
            throw error;
          });
      }
    },

    PUT_LINKED_FEATURES({ state, rootState }, featureId) {
      axios
        .put(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/${featureId}/feature-links/`, state.linkedFormset)
        .then((response) => {
          if (response.status === 200 && response.data) {
            console.log(response, response.data)
            return "La relation a bien été ajouté"
          }
        })
        .catch((error) => {
          throw error;
        });
    },

    /*     GET_FEATURE_LINK({ commit }, featureId) {
          featureAPI
            .getlinked_features(featureId)
            .then((data) => commit("SET_FEATURE_LINKS", data));
        } */
    DELETE_FEATURE({ state, rootState }, feature_id) {
      console.log("Deleting feature:", feature_id, state)
      const url = `${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/${feature_id}`;
      axios
        .delete(url, {
        })
        .then()
        .catch(() => {
          return false;
        });
    },

    // POST_COMMENT({ state }, data) {
    //console.log("post comment", data, state)

    /* axios
      .post(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}feature_type/`, data)
      .then((response) => {
        const routerHistory = router.options.routerHistory 
        commit("SET_USER", response.data.user);
        router.push(routerHistory[routerHistory.length - 1] || "/")
        dispatch("GET_USER_LEVEL_PROJECTS");
      })
      .catch(() => {
        commit("SET_USER", false)
      }); */
    // },
    // EXPORT_FEATURES({ /* state */ }) {
    //console.log("Export features", state.features)
    // }
  },

}

export default feature