changeset 4368:e9d2573329da

import_overview: make layer for review togglable (currently only for development visible)
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 10 Sep 2019 16:37:50 +0200
parents 6a985796f401
children 7c91cb922352
files client/src/components/importoverview/FairwayDimensionDetail.vue client/src/components/importoverview/LogEntry.vue client/src/components/layers/Layers.vue client/src/components/map/layers.js client/src/store/map.js
diffstat 5 files changed, 51 insertions(+), 15 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/importoverview/FairwayDimensionDetail.vue	Mon Sep 09 21:59:51 2019 +0200
+++ b/client/src/components/importoverview/FairwayDimensionDetail.vue	Tue Sep 10 16:37:50 2019 +0200
@@ -1,5 +1,15 @@
 <template>
-  <div>Fairwaydimension</div>
+  <div class="d-flex flex-column">
+    <div>
+      Fairwaydimensions
+    </div>
+    <template v-if="LOS">
+      <span class="ml-2 mt-1">LOS: {{ LOS }}</span>
+      <span class="ml-2 mb-3"
+        ><translate>Source</translate>: {{ organization }}</span
+      >
+    </template>
+  </div>
 </template>
 
 <script>
@@ -23,6 +33,7 @@
 import { mapGetters } from "vuex";
 import Feature from "ol/Feature";
 import Polygon from "ol/geom/Polygon";
+import { transform } from "ol/proj";
 
 const getFromWFS = (type, filter) => {
   return new Promise((resolve, reject) => {
@@ -55,24 +66,43 @@
 
 export default {
   props: ["summary"],
+  data() {
+    return {
+      organization: "",
+      LOS: ""
+    };
+  },
   mounted() {
     const ids = this.fairWayDimensionIDs.map(id => {
       return equalToFilter("id", id);
     });
     getFromWFS("fairway_dimensions", orFilter(...ids)).then(response => {
       let { features } = response.data;
-      const fairwaydimensionLayer = this.openLayersMap().getLayer(
-        "FDREVIEWLAYER"
-      );
-      features = features.map(f => {
-        let result = new Feature({
-          geometry: new Polygon(f.geometry.coordinates)
+      if (features.length < 0) {
+        const {
+          level_of_service,
+          source_organization
+        } = features[0].properties;
+        this.LOS = level_of_service;
+        this.organization = source_organization;
+        const fairwaydimensionLayer = this.openLayersMap().getLayer(
+          "FDREVIEWLAYER"
+        );
+        features = features.map(f => {
+          let result = new Feature({
+            geometry: new Polygon([
+              f.geometry.coordinates[0].map(c =>
+                transform(c, "EPSG:4326", "EPSG:3857")
+              )
+            ])
+          });
+          result.setId(f.id);
+          return result;
         });
-        result.setId(f.id);
-        return result;
-      });
-      fairwaydimensionLayer.setVisible(true);
-      fairwaydimensionLayer.getSource().addFeatures(features);
+        this.$store.commit("map/reviewActive", true);
+        fairwaydimensionLayer.setVisible(true);
+        fairwaydimensionLayer.getSource().addFeatures(features);
+      }
     });
   },
   computed: {
--- a/client/src/components/importoverview/LogEntry.vue	Mon Sep 09 21:59:51 2019 +0200
+++ b/client/src/components/importoverview/LogEntry.vue	Tue Sep 10 16:37:50 2019 +0200
@@ -145,6 +145,7 @@
         this.$store.commit("imports/hideDetails");
         this.$store.commit("imports/hideAdditionalInfo");
         this.$store.commit("imports/hideAdditionalLogs");
+        this.$store.commit("map/reviewActive", false);
       } else {
         this.loading = true;
         HTTP.get("/imports/" + this.entry.id, {
--- a/client/src/components/layers/Layers.vue	Mon Sep 09 21:59:51 2019 +0200
+++ b/client/src/components/layers/Layers.vue	Tue Sep 10 16:37:50 2019 +0200
@@ -37,6 +37,7 @@
         <Layerselect layerId="DISTANCEMARKS" />
         <Layerselect layerId="DISTANCEMARKSAXIS" />
         <Layerselect layerId="GAUGES" />
+        <Layerselect v-if="reviewActive" layerId="FDREVIEWLAYER" />
       </div>
       <UISpinnerOverlay v-else style="top: 34px;" />
     </div>
@@ -66,7 +67,7 @@
   },
   computed: {
     ...mapState("application", ["showLayers"]),
-    ...mapState("map", ["openLayersMaps"]),
+    ...mapState("map", ["openLayersMaps", "reviewActive"]),
     label() {
       return this.$gettext("Map Layers");
     },
--- a/client/src/components/map/layers.js	Mon Sep 09 21:59:51 2019 +0200
+++ b/client/src/components/map/layers.js	Tue Sep 10 16:37:50 2019 +0200
@@ -184,7 +184,7 @@
     id: "FDREVIEWLAYER",
     label: "Review",
     visible: true,
-    source: new VectorSource(),
+    source: new VectorSource({ wrapX: false }),
     style: styles.sections
   });
   const bottlenecksSource = new VectorSource({ strategy: bboxStrategy });
--- a/client/src/store/map.js	Mon Sep 09 21:59:51 2019 +0200
+++ b/client/src/store/map.js	Tue Sep 10 16:37:50 2019 +0200
@@ -49,7 +49,8 @@
     cutToolEnabled: false,
     isolinesLegendImgDataURL: "",
     differencesLegendImgDataURL: "",
-    ongoingRefresh: false
+    ongoingRefresh: false,
+    reviewActive: false
   };
 };
 
@@ -68,6 +69,9 @@
     }
   },
   mutations: {
+    reviewActive: (state, active) => {
+      state.reviewActive = active;
+    },
     startRefreshLayers: state => {
       state.ongoingRefresh = true;
     },