Merge pull request #87 from openearth/BLR-108-enable-choice-for-resolution

Adds a dropdown menu for output resolution for abstraction config.

Author: IoannaMi

src/components/marker-configuration/marker-configuration.vue

@@ -23,6 +23,16 @@
           />
         </v-col>
       </v-row>
+      <v-row no-gutters>
+        <v-col>
+          <v-select
+              label="Horizontale rekenresolutie"
+              v-model="selectedOutres"
+              :items="outres.map((res) => ({ text: `${res}m`, value: res }))"
+              :rules="[rules.required]"
+          />
+        </v-col>
+      </v-row>
       <v-row no-gutters>
         <v-col>
           <v-select
@@ -68,6 +78,8 @@
         area: 0,
         areaValid: true,
         layers: [ 1, 2, 3, 4, 5, 6, 7 ],
+        outres: [ 25, 50, 125, 250 ],
+        selectedOutres: 250,
         selectedLayer: null,
         subtraction: 500,
         subtractionValid: true,
@@ -131,6 +143,7 @@
         const properties = {
           area: parseInt(this.area, 10),
           coordinates: [ lng, lat ],
+          outres: parseInt(this.selectedOutres, 10),
           layer: parseInt(this.selectedLayer, 10),
           abstraction: parseInt(this.subtraction, 10),
         };

src/lib/get-abstraction-data.js

@@ -1,6 +1,6 @@
 import geoServerUrl from './geoserver-url';
 
-const DATA_TEMPLATE = ({ area, coordinates, layer, abstraction }) =>
+const DATA_TEMPLATE = ({ area, coordinates, layer, outres, abstraction }) =>
   JSON.stringify({
     type: 'FeatureCollection',
     name: 'point',
@@ -13,6 +13,7 @@ const DATA_TEMPLATE = ({ area, coordinates, layer, abstraction }) =>
         type: 'Feature',
         properties: {
           fid: 1,
+          outres,
           layer,
           area,
           abstraction,
@@ -25,10 +26,11 @@ const DATA_TEMPLATE = ({ area, coordinates, layer, abstraction }) =>
     ],
   }, 0, false);
 
-export default async function getAbstractionData ({ area, coordinates, layer, abstraction }) {
-  const data = DATA_TEMPLATE({ area, coordinates, layer, abstraction });
+export default async function getAbstractionData ({ area, coordinates, layer, outres, abstraction }) {
+  const data = DATA_TEMPLATE({ area, coordinates, layer, outres, abstraction });
   const url = await geoServerUrl({
-    url: process.env.VUE_APP_GEO_SERVER + '/wps',
+    // url: process.env.VUE_APP_GEO_SERVER + '/wps',
+    url: 'https://basisrivierbodemligging-test.avi.deltares.nl/wps',
     request: 'Execute',
     service: 'WPS',
     identifier: 'brl_wps_abstraction',
@@ -37,7 +39,7 @@ export default async function getAbstractionData ({ area, coordinates, layer, ab
     DataInputs: 'geojson_point=' + data,
   });
 
-  return fetch(url)
+  return fetch(url, { mode: 'no-cors' })
     .then(response => response.text())
     .then(string => {
       const document = new window.DOMParser().parseFromString(string, 'text/xml');

src/store/modules/abstraction/index.js

@@ -42,10 +42,10 @@ export default {
       commit('ADD_PROFILE', { profile });
       commit('ADD_CHART_DATA', { data });
     },
-    async calculateResult({ dispatch }, { area, coordinates, layer, abstraction }) {
+    async calculateResult({ dispatch }, { area, coordinates, layer, outres, abstraction }) {
       dispatch('mapbox/setWmsLayersLoading', { isLoading: true }, { root: true });
 
-      const layersGrouped = await getAbstractionData({ area, coordinates, layer, abstraction });
+      const layersGrouped = await getAbstractionData({ area, coordinates, layer, outres, abstraction });
       dispatch('mapbox/setLayers', layersGrouped, { root: true });
 
       dispatch('mapbox/setWmsLayersLoading', { isLoading: false }, { root: true });