Merge branch 'ticket/12522' into 'develop'

REDMINE_ISSUE-12522

See merge request geocontrib/geocontrib-frontend!164

src/App.vue

 <template>
   <div v-frag>
+    <script
+      type="application/javascript"
+      :src="
+        baseUrl +
+        'resources/leaflet-control-geocoder-1.13.0/Control.Geocoder.js'
+      "
+    ></script>
     <header class="header-menu">
       <div class="menu container">
         <div class="ui inverted icon menu">
@@ -184,6 +191,7 @@ export default {
     return {
       menuIsOpen: false,
       rightMenuIsOpen: true,
+      baseUrl: this.$store.state.configuration.BASE_URL,
       width: window.innerWidth > 0 ? window.innerWidth : screen.width,
     };
   },

src/assets/js/map-util.js

@@ -199,7 +199,7 @@ const mapUtil = {
   addGeocoders: function (configuration) {
     let geocoder;
     const geocoderLabel = configuration.SELECTED_GEOCODER.PROVIDER;
-    if (geocoderLabel) {
+    if (geocoderLabel && L.Control.Geocoder) {
       const LIMIT_RESULTS = 5;
       if (
         geocoderLabel === configuration.GEOCODER_PROVIDERS.ADDOK

src/store/modules/feature.js

@@ -16,6 +16,7 @@ const feature = {
     checkedFeatures: [],
     extra_form: [],
     features: [],
+    current_feature: [],
     form: null,
     linkedFormset: [],
     linked_features: [],
@@ -42,6 +43,9 @@ const feature = {
     SET_FEATURES(state, features) {
       state.features = features;
     },
+    SET_CURRENT_FEATURE(state, feature) {
+      state.current_feature = feature;
+    },
     UPDATE_FORM(state, payload) {
       state.form = payload;
     },
@@ -133,6 +137,30 @@ const feature = {
           throw error;
         });
     },
+    GET_PROJECT_FEATURE({ commit, rootState }, { project_slug,  feature_id }) {
+      if (rootState.cancellableSearchRequest.length > 0) {
+        const currentRequestCancelToken =
+          rootState.cancellableSearchRequest[rootState.cancellableSearchRequest.length - 1];
+        currentRequestCancelToken.cancel();
+      }
+  
+      const cancelToken = axios.CancelToken.source();
+      commit('SET_CANCELLABLE_SEARCH_REQUEST', cancelToken, { root: true });
+      commit("SET_CURRENT_FEATURE", null);
+      let url = `${rootState.configuration.VUE_APP_DJANGO_API_BASE}projects/${project_slug}/feature/?id=${feature_id}`;
+      return axios
+        .get(url , { cancelToken: cancelToken.token })
+        .then((response) => {
+          if (response.status === 200 && response.data.features) {
+            const feature = response.data.features[0];
+            commit("SET_CURRENT_FEATURE", feature);
+          }
+          return response;
+        })
+        .catch((error) => {
+          throw error;
+        });
+    },
 
     SEND_FEATURE({ state, rootState, commit, dispatch }, routeName) {
       commit("DISPLAY_LOADER", "Le signalement est en cours de création", { root: true })

src/views/feature/Feature_detail.vue

@@ -41,7 +41,7 @@
                 <!-- (permissions && permissions.can_delete_feature) || -->
                 <a
                   v-if="
-                    isFeatureCreator || permissions.is_project_super_contributor
+                    isFeatureCreator || (permissions && permissions.is_project_super_contributor)
                   "
                   @click="isCanceling = true"
                   id="feature-delete"
@@ -403,9 +403,7 @@ export default {
     },
 
     feature() {
-      const result = this.$store.state.feature.features.find(
-        (el) => el.feature_id === this.$route.params.slug_signal
-      );
+      const result = this.$store.state.feature.current_feature;
       return result;
     },
 
@@ -417,7 +415,7 @@ export default {
     },
 
     isModerator() {
-      return this.USER_LEVEL_PROJECTS &&
+      return this.USER_LEVEL_PROJECTS && this.project &&
         this.USER_LEVEL_PROJECTS[this.project.slug] === "Modérateur"
         ? true
         : false;
@@ -689,13 +687,23 @@ export default {
       axios.all([
         this.$store
         .dispatch("GET_PROJECT_INFO", this.$route.params.slug),
-        this.$store.dispatch('feature/GET_PROJECT_FEATURES', {
-          project_slug: this.$route.params.slug
+        this.$store.dispatch('feature/GET_PROJECT_FEATURE', {
+          project_slug: this.$route.params.slug,
+          feature_id: this.$route.params.slug_signal
         })])
         .then(() => {
           this.$store.commit("DISCARD_LOADER");
           this.initMap();
         });
+    } if (!this.feature || this.feature.feature_id != this.$route.params.slug_signal) {
+        this.$store.dispatch('feature/GET_PROJECT_FEATURE', {
+          project_slug: this.$route.params.slug,
+          feature_id: this.$route.params.slug_signal
+        })
+        .then(() => {
+          this.$store.commit("DISCARD_LOADER");
+          this.initMap();
+        });
     } else {
       this.$store.commit("DISCARD_LOADER");
       this.initMap();

src/views/feature/Feature_edit.vue

 <template>
   <div v-frag>
-    <script
-      type="application/javascript"
-      :src="
-        baseUrl +
-        'resources/leaflet-control-geocoder-1.13.0/Control.Geocoder.js'
-      "
-    ></script>
     <div class="fourteen wide column">
       <h1 v-if="feature && currentRouteName === 'editer-signalement'">
         Mise à jour du signalement "{{ feature.title || feature.feature_id }}"
@@ -375,9 +368,8 @@ export default {
     },
 
     feature: function () {
-      return this.$store.state.feature.features.find(
-        (el) => el.feature_id === this.$route.params.slug_signal
-      );
+      const result = this.$store.state.feature.current_feature;
+      return result;
     },
 
     orderedCustomFields() {
@@ -1016,8 +1008,12 @@ export default {
   },
 
   mounted() {
-    this.$store
-      .dispatch("GET_PROJECT_INFO", this.$route.params.slug)
+    axios.all([this.$store
+                .dispatch("GET_PROJECT_INFO", this.$route.params.slug),
+              this.$store.dispatch('feature/GET_PROJECT_FEATURE', {
+                project_slug: this.$route.params.slug,
+                feature_id: this.$route.params.slug_signal
+              })])
         .then(() => {
           this.initForm();
           this.initMap();

src/views/feature/Feature_list.vue

 <template>
   <div class="fourteen wide column">
-    <script
-      type="application/javascript"
-      :src="
-        baseUrl +
-        'resources/leaflet-control-geocoder-1.13.0/Control.Geocoder.js'
-      "
-    ></script>
+    
     <div id="feature-list-container" class="ui grid mobile-column">
       <div class="four wide column mobile-fullwidth">
         <h1>Signalements</h1>
@@ -297,7 +291,7 @@ export default {
     statusChoices() {
       //* if project is not moderate, remove pending status
       return this.form.status.choices.filter((el) =>
-        this.project.moderation ? true : el.value !== "pending"
+        this.project && this.project.moderation ? true : el.value !== "pending"
       );
     },
   },