diff --git a/src/views/project/Project_detail.vue b/src/views/project/Project_detail.vue index 2e3e65b4bff831149148bcb9f430bc465d33a74b..1efc2288a4dba7c83ec75172ca668f023dbb5e68 100644 --- a/src/views/project/Project_detail.vue +++ b/src/views/project/Project_detail.vue @@ -68,7 +68,7 @@ user && permissions && permissions.can_view_project && - isOffline() != true + isOffline() !== true " id="subscribe-button" class="ui button button-hover-green" @@ -83,7 +83,7 @@ v-if=" permissions && permissions.can_update_project && - isOffline() != true + isOffline() !== true " :to="{ name: 'project_edit', params: { slug: project.slug } }" class="ui button button-hover-orange" @@ -107,6 +107,14 @@ <div class="seven wide column"> <h3 class="ui header">Types de signalements</h3> <div class="ui middle aligned divided list"> + <div + :class="{ active: featureTypeLoading }" + class="ui inverted dimmer" + > + <div class="ui text loader"> + Récupération des types de signalements en cours... + </div> + </div> <div v-for="(type, index) in feature_types" :key="type.title + '-' + index" @@ -176,7 +184,7 @@ project && permissions && permissions.can_create_feature_type && - isOffline() != true + isOffline() !== true " class=" ui @@ -203,7 +211,7 @@ type.is_editable && permissions && permissions.can_create_feature_type && - isOffline() != true + isOffline() !== true " class=" ui @@ -232,7 +240,7 @@ v-if=" permissions && permissions.can_update_project && - isOffline() != true + isOffline() !== true " :to="{ name: 'ajouter-type-signalement', @@ -248,7 +256,7 @@ v-if=" permissions && permissions.can_update_project && - isOffline() != true + isOffline() !== true " class=" ui @@ -508,9 +516,9 @@ export default { }, filters: { - setDate: function (value) { - let date = new Date(value); - let d = date.toLocaleDateString("fr", { + setDate(value) { + const date = new Date(value); + const d = date.toLocaleDateString("fr", { year: "2-digit", month: "numeric", day: "numeric", @@ -529,6 +537,7 @@ export default { isModalOpen: false, is_suscriber: false, tempMessage: null, + featureTypeLoading: true, }; }, @@ -537,10 +546,10 @@ export default { ...mapState("feature_type", ["feature_types"]), ...mapState("feature", ["features"]), ...mapState(["last_comments", "user"]), - DJANGO_BASE_URL: function () { + DJANGO_BASE_URL() { return this.$store.state.configuration.VUE_APP_DJANGO_BASE; }, - last_features: function () { + last_features() { // * limit to last five element of array (looks sorted chronologically, but not sure...) return this.$store.state.feature.features.slice(-5); }, @@ -551,7 +560,7 @@ export default { return "?ver=" + Math.random(); }, isOffline() { - return navigator.onLine == false; + return navigator.onLine === false; }, checkForOfflineFeature() { let arraysOffline = []; @@ -559,7 +568,7 @@ export default { if (localStorageArray) { arraysOffline = JSON.parse(localStorageArray); this.arraysOffline = arraysOffline.filter( - (x) => x.project == this.project.slug + (x) => x.project === this.project.slug ); } }, @@ -567,7 +576,7 @@ export default { var promises = []; this.arraysOffline.forEach((feature, index, object) => { console.log(feature); - if (feature.type == "post") { + if (feature.type === "post") { promises.push( axios .post( @@ -584,7 +593,7 @@ export default { console.log(error); }) ); - } else if (feature.type == "put") { + } else if (feature.type === "put") { promises.push( axios .put( @@ -615,7 +624,7 @@ export default { arraysOffline = JSON.parse(localStorageArray); } let arraysOfflineOtherProject = arraysOffline.filter( - (x) => x.project != this.project.slug + (x) => x.project !== this.project.slug ); arraysOffline = arraysOfflineOtherProject.concat(this.arraysOffline); localStorage.setItem("geocontrib_offline", JSON.stringify(arraysOffline)); @@ -720,13 +729,14 @@ export default { .getProjectSubscription({ projectSlug: this.$route.params.slug }) .then((data) => (this.is_suscriber = data.is_suscriber)); } + this.$store.commit("feature_type/SET_FEATURE_TYPES", []); //* empty feature_types remaining from previous project }, mounted() { - let self = this; - this.$store - .dispatch("GET_PROJECT_INFO", this.slug) - .then(setTimeout(self.initMap, 1000)); + this.$store.dispatch("GET_PROJECT_INFO", this.slug).then(() => { + this.featureTypeLoading = false; + setTimeout(() => this.initMap, 1000); + }); if (this.message) { this.tempMessage = this.message; document