REDMINE_ISSUES-12566

V2 : add loaders

src/views/feature_type/Feature_type_detail.vue

@@ -24,6 +24,14 @@
       <div class="ui attached segment">
         <div class="ui basic segment">
           <div class="ui horizontal tiny statistic">
+            <div
+              :class="{ active: featuresLoading }"
+              class="ui inverted dimmer"
+            >
+             <div class="ui text loader">
+                Récupération des signalements en cours...
+              </div>
+            </div>
             <div class="value">
               {{ feature_type_features.length }}
             </div>
@@ -118,6 +126,14 @@
     </div>
     <div class="nine wide column">
       <h3 class="ui header">Derniers signalements</h3>
+        <div
+          :class="{ active: featuresLoading }"
+          class="ui inverted dimmer"
+        >
+          <div class="ui text loader">
+            Récupération des signalements en cours...
+          </div>
+        </div>
       <div
         v-for="(feature, index) in lastFeatures"
         :key="feature.feature_id + index"
@@ -209,6 +225,7 @@ export default {
         size: 0,
       },
       showImport: false,
+      featuresLoading: true,
     };
   },
 
@@ -349,15 +366,33 @@ export default {
         }
       });
     },
+    async setCurrentFeatureTypeSlug(){
+      const response = await 
+        this.$store.dispatch('feature/GET_PROJECT_FEATURES', {
+          project_slug:  this.$route.params.slug
+        })
+      
+      console.log(response)
+      if (response){
+        this.featuresLoading = false;
+      }
+    }
   },
-
+  // watch:{
+  //   'feature_type_features'(newValue){
+  //     console.log(newValue)
+  //     if (newValue){
+  //       this.featuresLoading = false;
+  //     }
+  //   }
+  // },
   created() {
     if (!this.project) {
       this.$store.dispatch("GET_PROJECT_INFO", this.$route.params.slug);
     }
-    this.$store.dispatch('feature/GET_PROJECT_FEATURES', {
-      project_slug:  this.$route.params.slug
-    })
+   this.setCurrentFeatureTypeSlug();
+    // .then(res => resolve(res))
+    // .catch(err => reject(err));
     this.$store.commit(
       "feature_type/SET_CURRENT_FEATURE_TYPE_SLUG",
       this.$route.params.feature_type_slug