add loader to feature edition

src/store/modules/feature.js

@@ -99,9 +99,12 @@ const feature = {
         });
     },
 
-    SEND_FEATURE({ state, rootState, dispatch }, routeName) {
+    SEND_FEATURE({ state, rootState, commit, dispatch }, routeName) {
+      commit("DISPLAY_LOADER", "Le signalement est en cours de création", { root: true })
       const message = routeName === "editer-signalement" ? "Le signalement a été mis à jour" : "Le signalement a été crée";
+
       function redirect(featureId) {
+        commit("DISCARD_LOADER", null, { root: true })
         router.push({
           name: "details-signalement",
           params: {
@@ -111,12 +114,14 @@ const feature = {
           },
         });
       }
+
       async function handleOtherForms(featureId) {
         await dispatch("SEND_ATTACHMENTS", featureId)
         await dispatch("PUT_LINKED_FEATURES", featureId)
         redirect(featureId);
       }
 
+      //* prepare feature data to send
       let extraFormObject = {}; //* prepare an object to be flatten in properties of geojson
       for (const field of state.extra_form) {
         extraFormObject[field.name] = field.value;
@@ -134,12 +139,13 @@ const feature = {
           ...extraFormObject
         }
       }
+
       if (routeName === "editer-signalement") {
-        axios
+        return axios
           .put(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/${state.form.feature_id}/?` +
-            `feature_type__slug=${rootState.feature_type.current_feature_type_slug}` + 
-            `&project__slug=${rootState.project_slug}` 
-          , geojson)
+            `feature_type__slug=${rootState.feature_type.current_feature_type_slug}` +
+            `&project__slug=${rootState.project_slug}`
+            , geojson)
           .then((response) => {
             if (response.status === 200 && response.data) {
               if (state.attachmentFormset.length > 0 || state.linkedFormset.length > 0) {
@@ -150,10 +156,11 @@ const feature = {
             }
           })
           .catch((error) => {
+            commit("DISCARD_LOADER", null, { root: true })
             throw error;
           });
       } else {
-        axios
+        return axios
           .post(`${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/`, geojson)
           .then((response) => {
             if (response.status === 201 && response.data) {
@@ -165,6 +172,7 @@ const feature = {
             }
           })
           .catch((error) => {
+            commit("DISCARD_LOADER", null, { root: true })
             throw error;
           });
       }
@@ -189,7 +197,7 @@ const feature = {
               console.error(error);
               return error
             });
-            
+
         }
       }
 
@@ -203,7 +211,7 @@ const feature = {
         if (attachment.title)
           data['info'] = attachment.info
         formdataToUpdate.append("data", JSON.stringify(data));
-        let payload ={
+        let payload = {
           'attachmentsId': attachment.id,
           'featureId': featureId,
           'formdataToUpdate': formdataToUpdate
@@ -213,7 +221,7 @@ const feature = {
       }
 
       function deleteAttachement(attachmentsId, featureId) {
-        let payload ={
+        let payload = {
           'attachmentsId': attachmentsId,
           'featureId': featureId
         }
@@ -224,7 +232,7 @@ const feature = {
         ...state.attachmentFormset.map((attachment) => postAttachement(attachment)),
         ...state.attachmentsToPut.map((attachments) => putAttachement(attachments, featureId)),
         ...state.attachmentsToDelete.map((attachmentsId) => deleteAttachement(attachmentsId, featureId))
-        ]
+      ]
       );
       state.attachmentsToDelete = []
       state.attachmentsToPut = []
@@ -280,8 +288,8 @@ const feature = {
     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}/?` +
-      `feature_type__slug=${rootState.feature_type.current_feature_type_slug}` + 
-      `&project__slug=${rootState.project_slug}`;
+        `feature_type__slug=${rootState.feature_type.current_feature_type_slug}` +
+        `&project__slug=${rootState.project_slug}`;
       return axios
         .delete(url)
         .then((response) => response)