From 7fd990f0239ef8475127fa9e4edacddfa0efe5ed Mon Sep 17 00:00:00 2001
From: DESPRES Damien <ddespres@neogeo.fr>
Date: Fri, 24 Sep 2021 12:25:00 +0200
Subject: [PATCH] =?UTF-8?q?int=C3=A9gration=20requetage=20des=20couches?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/js/map-util.js                   | 11 +++----
 src/components/Dropdown.vue                 |  4 +--
 src/components/map-layers/SidebarLayers.vue | 33 +++++++++++++++++++++
 src/main.js                                 |  3 +-
 4 files changed, 42 insertions(+), 9 deletions(-)

diff --git a/src/assets/js/map-util.js b/src/assets/js/map-util.js
index 2bb0f78e..f673e00c 100644
--- a/src/assets/js/map-util.js
+++ b/src/assets/js/map-util.js
@@ -32,18 +32,19 @@ L.TileLayer.BetterWMS = L.TileLayer.WMS.extend({
   getFeatureInfo: function (evt) {
     if (this.wmsParams.basemapId != undefined) {
       const queryableLayerSelected = document.getElementById(`queryable-layers-selector-${this.wmsParams.basemapId}`).getElementsByClassName('selected')[0].innerHTML;
-      if (queryableLayerSelected === this.wmsParams.title) {
+      if (queryableLayerSelected.trim() === this.wmsParams.title.trim()) {
         // Make an AJAX request to the server and hope for the best
         var params = this.getFeatureInfoUrl(evt.latlng);
         var showResults = L.Util.bind(this.showGetFeatureInfo, this);
 
-        axios.post(
+        axios.get(
           window.proxy_url,
           {
-            data: params,
+            params: params,
             //dataType: "json",
           }
-            .then(data => {
+            ).then(response => {
+              let data=response.data;
               var err = typeof data === 'object' ? null : data;
               if (data.features || err) {
                 showResults(err, evt.latlng, data);
@@ -55,7 +56,7 @@ L.TileLayer.BetterWMS = L.TileLayer.WMS.extend({
               //xhr.responseText;
               //console.log(status)
             }
-            ))
+            )
 
       }
     }
diff --git a/src/components/Dropdown.vue b/src/components/Dropdown.vue
index 0ca8e093..d55ed84c 100644
--- a/src/components/Dropdown.vue
+++ b/src/components/Dropdown.vue
@@ -33,9 +33,7 @@
           processedOptions ? 'item' : 'message',
           { 'active selected': option === selected },
         ]"
-      >
-        {{ option }}
-      </div>
+      >{{ option }}</div>
     </div>
   </div>
 </template>
diff --git a/src/components/map-layers/SidebarLayers.vue b/src/components/map-layers/SidebarLayers.vue
index 9df2338d..6e177a67 100644
--- a/src/components/map-layers/SidebarLayers.vue
+++ b/src/components/map-layers/SidebarLayers.vue
@@ -58,6 +58,16 @@
       >
         {{ basemap.title }}
       </div>
+      <div :id="`queryable-layers-selector-${basemap.id}`" v-if="isQueryable(basemap)">
+        <b>Couche requêtable</b>
+        <Dropdown 
+          @update:selection="onQueryLayerChange($event)"
+          :options="getQueryableLayers(basemap)"
+          :selected="selectedQueryLayer"
+          :search="true"
+        />
+
+      </div>
       <div
         :class="{ active: isActive(basemap) }"
         class="content"
@@ -94,11 +104,16 @@
 
 <script>
 import { mapUtil } from "@/assets/js/map-util.js";
+import Dropdown from "@/components/Dropdown.vue";
 
 export default {
   name: "SidebarLayers",
+  components: {
+    Dropdown,
+  },
   data() {
     return {
+      selectedQueryLayer:null,
       baseMaps: [],
       layers: [],
       expanded: false,
@@ -122,7 +137,25 @@ export default {
     getOpacity(opacity) {
       return Math.round(parseFloat(opacity) * 100);
     },
+    onQueryLayerChange(layer){
+      console.log(layer);
+      this.selectedQueryLayer=layer.name;
+    },
+    isQueryable(baseMap){
+      let queryableLayer=baseMap.layers.filter(l => l.queryable === true);
+      return queryableLayer.length>0;
+    },
+    getQueryableLayers(baseMap){
+      let queryableLayer=baseMap.layers.filter(l => l.queryable === true);
+      return queryableLayer.map(x=>{
+        return {
+          name:x.title,
+          value:x
+        }
+      });
+    },
     addLayers(baseMap) {
+     
       baseMap.layers.forEach((layer) => {
         var layerOptions = this.layers.find((l) => l.id == layer.id);
         console.log(layerOptions);
diff --git a/src/main.js b/src/main.js
index 0dc0f54a..22fdd2b3 100644
--- a/src/main.js
+++ b/src/main.js
@@ -14,7 +14,8 @@ Vue.config.productionTip = false
 axios.get("/config/config.json")
   .then((response) => {
     if (response && response.status === 200) {
-            store.commit("SET_CONFIG", response.data)
+            store.commit("SET_CONFIG", response.data);
+            window.proxy_url=response.data.VUE_APP_DJANGO_API_BASE+"proxy/"
             axios.all([store.dispatch("USER_INFO"),
               store.dispatch("GET_ALL_PROJECTS"),
               store.dispatch("GET_STATIC_PAGES"),
-- 
GitLab