WIP

src/views/feature/Feature_list.vue

@@ -234,10 +234,11 @@ export default {
         },
         title: null,
       },
-/*       filters: {
+      filters: {
         type: "",
         value: "",
-      }, */
+      },
+      filtersBis: {},
       paginatedFeatures: [],
       baseUrl: this.$store.state.configuration.BASE_URL,
       map: null,
@@ -247,13 +248,15 @@ export default {
       featuresCount: 0,
       next: null,
       previous: null,
+      paginateUrl: null,
       pagination: {
         currentPage: 1,
         pagesize: 15,
         start: 0,
         end: 15,
       },
-      showMap: true,
+      //showMap: true,
+      showMap: false,
       showAddFeature: false,
     };
   },
@@ -393,10 +396,11 @@ export default {
       return featureType ? featureType.slug : null;
     },
 
-    buildFilterParams() {
-      const { filterType, filterValue } = this.filters;
-      let params = "";
+    buildFilterParams(params) {
+      const { filterType, filterValue } = params;
+      let urlParams = "";
       let typeFilter, statusFilter;
+      console.log(filterType, filterValue);
       //*** feature type ***//
       if (filterType === "featureType") {
         if (filterValue === "" && !this.form.type.selected) {
@@ -408,6 +412,62 @@ export default {
         } //* sinon il n'y a pas de param ajouté, ce qui supprime la query
 
         //*** status ***//
+      } else if (filterType === "status") {
+        if (filterValue === "" && !this.form.status.selected.value) {
+          return "abort";
+        } else if (filterValue !== undefined && filterValue !== null) {
+          statusFilter = filterValue;
+          //statusFilter = filterValue.value;
+        }
+      }
+
+      //* after possibilities of aborting features fetch, empty geojson to make sure even no result would update
+
+      if (
+        (filterType === undefined || filterType === "status") &&
+        this.form.type.selected
+      ) {
+        //* s'il y a déjà un filtre sélectionné, maintenir le params
+        typeFilter = this.getFeatureTypeSlug(this.form.type.selected);
+      }
+      if (
+        (filterType === undefined || filterType === "featureType") &&
+        this.form.status.selected.value
+      ) {
+        statusFilter = this.form.status.selected.value;
+      }
+
+      if (typeFilter) {
+        let typeParams = `&feature_type_slug=${typeFilter}`;
+        urlParams += typeParams;
+      }
+      if (statusFilter) {
+        let statusParams = `&status__value=${statusFilter}`;
+        urlParams += statusParams;
+      }
+
+      //*** title ***//
+      if (this.form.title) {
+        urlParams += `&title=${this.form.title}`;
+      }
+      this.getBbox2FIt(urlParams);
+      return urlParams;
+    },
+
+    /*     buildFilterParamsBis() {
+      let params = "";
+      let typeFilter, statusFilter;
+
+      if ("featureType") {
+        if (filterValue === "" && !this.form.type.selected) {
+          //* s'il y n'avait pas de filtre et qu'il a été supprimé --> ne pas mettre à jour les features
+          return "abort";
+        } else if (filterValue !== undefined && filterValue !== null) {
+          //* s'il y a un nouveau filtre --> ajouter une params
+          typeFilter = this.getFeatureTypeSlug(filterValue);
+        } //* sinon il n'y a pas de param ajouté, ce qui supprime la query
+
+
       } else if (filterType === "status") {
         if (filterValue === "" && !this.form.status.selected.value) {
           return "abort";
@@ -441,40 +501,48 @@ export default {
         params += statusParams;
       }
 
-      //*** title ***//
+
       if (this.form.title) {
         params += `&title=${this.form.title}`;
       }
       this.getBbox2FIt(params);
       return params;
-    },
+    }, */
 
-    updateTypeFeatures(value) {
+    updateTypeFeatures(filterValue) {
       //* only update:selection custom event can trigger the filter update,
       //* but it happens before the value is updated, thus using selected value from event to update query
-      //this.fetchPagedFeatures({ filterType: "featureType", filterValue });
-      this.filters = { type: "featureType", value };
-      this.fetchPagedFeatures();
+      this.fetchPagedFeatures({ filterType: "featureType", filterValue });
+      //this.filters = { type: "featureType", value };
+      //this.filtersBis["featureType"] = value;
+      //this.fetchPagedFeatures();
     },
 
-    updateStatusFeatures(value) {
-      //this.fetchPagedFeatures({ filterType: "status", filterValue });
-      this.filters = { type: "status", value };
-      this.fetchPagedFeatures();
+    updateStatusFeatures(filterValue) {
+      this.fetchPagedFeatures({
+        filterType: "status",
+        filterValue: filterValue.value,
+      });
+      //this.filtersBis["status"] = value;
+      //this.filters = { type: "status", value };
+      //this.fetchPagedFeatures();
     },
 
     fetchPagedFeatures(params) {
       this.onFilterChange(); //* temporary, use paginated event to watch change in filters, to modify geojson on map
       let url = `${this.API_BASE_URL}projects/${this.$route.params.slug}/feature-paginated/?output=geojson&limit=${this.pagination.pagesize}&offset=${this.pagination.start}`;
-
-      const filterParams = this.buildFilterParams(params);
-      if (filterParams === "abort") return; // ? to adapt ???
-      url += filterParams;
-      if (params) {
+        //console.log(this.buildFilterParamsBis(params))
+      if (typeof params === "string") { //* for receiving next & previous url
         //console.error("ONLY FOR DEV !!!!!!!!!!!!!");
         //params = params.replace("8000", "8010"); //* for dev uncomment to use proxy link
         url = params;
+      } else if (typeof params === "object") {
+        const filterParams = this.buildFilterParams(params);
+        if (filterParams === "abort") return; // ? to adapt ???
+        url += filterParams;
+        console.log("filterParams", filterParams);
       }
+     // this.paginateUrl = url; //* store to reuse with sorting
 
       this.$store.commit(
         "DISPLAY_LOADER",
@@ -506,6 +574,7 @@ export default {
 
     handleSortChange(ordering) {
       console.log("ORDERING", ordering);
+      this.fetchPagedFeatures({filterType: undefined, filterValue: undefined})
     },
 
     toPage(pageNumber) {