diff --git a/src/services/feature-api.js b/src/services/feature-api.js index e9a02215c3a9f855c376e8ccf357d722fd63355d..27357305b6eebfa1a93ca53609b7cfe5bf257ed9 100644 --- a/src/services/feature-api.js +++ b/src/services/feature-api.js @@ -4,6 +4,20 @@ import store from '../store' const baseUrl = store.state.configuration.VUE_APP_DJANGO_API_BASE; const featureAPI = { + async getFeaturesBbox(project_slug) { + const response = await axios.get( + `${baseUrl}projects/${project_slug}/feature-bbox/` + ); + if ( + response.status === 200 && + response.data + ) { + return response.data; + } else { + return null; + } + }, + async getFeatureEvents(featureId) { const response = await axios.get( `${baseUrl}features/${featureId}/events/` diff --git a/src/views/feature/Feature_list.vue b/src/views/feature/Feature_list.vue index 1bb24d0fbc731c81422a92f8ed244ce03e499798..93d3392555079e7e7dee1ddc9484e4a6007fba3f 100644 --- a/src/views/feature/Feature_list.vue +++ b/src/views/feature/Feature_list.vue @@ -1,6 +1,5 @@ <template> <div class="fourteen wide column"> - <div id="feature-list-container" class="ui grid mobile-column"> <div class="four wide column mobile-fullwidth"> <h1>Signalements</h1> @@ -185,6 +184,7 @@ <script> import { mapGetters, mapState } from "vuex"; import { mapUtil } from "@/assets/js/map-util.js"; +import featureAPI from "@/services/feature-api"; import SidebarLayers from "@/components/map-layers/SidebarLayers"; import FeatureListTable from "@/components/feature/FeatureListTable"; import Dropdown from "@/components/Dropdown.vue"; @@ -373,7 +373,7 @@ export default { }, onFilterChange() { - if (this.featureGroup) { + /* if (this.featureGroup) { const features = this.filteredFeatures; this.featureGroup.clearLayers(); this.featureGroup = mapUtil.addFeatures( @@ -381,21 +381,21 @@ export default { {}, true, this.feature_types - ); - mapUtil.getMap().invalidateSize(); - mapUtil.getMap()._onResize(); // force refresh for vector tiles - if(window.layerMVT) { - window.layerMVT.redraw(); - } - - if (this.featureGroup.getLayers().length > 0) { + ); */ + mapUtil.getMap().invalidateSize(); + mapUtil.getMap()._onResize(); // force refresh for vector tiles + if (window.layerMVT) { + window.layerMVT.redraw(); + } + + /* if (this.featureGroup.getLayers().length > 0) { mapUtil .getMap() .fitBounds(this.featureGroup.getBounds(), { padding: [25, 25] }); } else { mapUtil.getMap().zoomOut(1); - } - } + } */ + //} }, initMap() { @@ -416,6 +416,8 @@ export default { mapDefaultViewZoom, }); + this.getBbox2FIt(); + document.addEventListener("change-layers-order", (event) => { // Reverse is done because the first layer in order has to be added in the map in last. // Slice is done because reverse() changes the original array, so we make a copy first @@ -424,7 +426,7 @@ export default { // --------- End sidebar events ---------- //this.fetchPagedFeatures(); - this.getNloadGeojsonFeatures(); + //this.getNloadGeojsonFeatures(); setTimeout(() => { const project_id = this.$route.params.slug.split("-")[0]; @@ -439,7 +441,20 @@ export default { }, 1000); }, - getNloadGeojsonFeatures() { + getBbox2FIt() { + featureAPI.getFeaturesBbox(this.project.slug).then((bbox) => { + console.log(bbox); + if (bbox) { + const bounds = [ + [bbox[2], bbox[3]], + [bbox[0], bbox[1]], + ]; + mapUtil.getMap().fitBounds(bounds, { padding: [25, 25] }); + } + }); + }, + + /* getNloadGeojsonFeatures() { const url = `${this.$store.state.configuration.VUE_APP_DJANGO_API_BASE}projects/${this.$route.params.slug}/feature/?output=geojson`; this.$store.commit( "DISPLAY_LOADER", @@ -490,7 +505,7 @@ export default { this.geojsonFeatures.map((el) => el.properties.feature_type.title) ), //* use Set to eliminate duplicate values ]; - }, + }, */ //* Paginated Features for table *// getFeatureTypeSlug(title) { @@ -575,8 +590,7 @@ export default { url += filterParams; } else { //console.error("ONLY FOR DEV !!!!!!!!!!!!!"); - //params = params.replace("8000", "8010"); - //console.log(url); + //params = params.replace("8000", "8010"); //* for dev uncomment to use proxy link url = params; } } @@ -656,9 +670,7 @@ export default { // Chargements des features et infos projet en cas d'arrivée directe sur la page ou de refresh this.$store .dispatch("GET_PROJECT_INFO", this.$route.params.slug) - .then(() => { - this.initMap(); - }); + .then(() => this.initMap()); } else { this.initMap(); }