Mercurial > gemma
changeset 2848:b6886706b325
profiles: display sounding_differences
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Thu, 28 Mar 2019 16:38:15 +0100 |
parents | 4da07a11e6e1 |
children | b8972e4671fa |
files | client/src/components/fairway/Profiles.vue client/src/store/map.js |
diffstat | 2 files changed, 79 insertions(+), 2 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/fairway/Profiles.vue Thu Mar 28 15:43:32 2019 +0100 +++ b/client/src/components/fairway/Profiles.vue Thu Mar 28 16:38:15 2019 +0100 @@ -92,6 +92,15 @@ </select> </div> </div> + <div class="mt-3"> + <button + :disabled="!additionalSurvey" + class="btn btn-info btn-sm w-100" + @click="showSurveyDiffences" + > + <translate>Show differences</translate> + </button> + </div> <hr class="w-100 mb-0" /> <small class="text-muted d-block mt-2"> <translate>Saved cross profiles</translate>: @@ -241,6 +250,7 @@ import LineString from "ol/geom/LineString"; import { displayError, displayInfo } from "@/lib/errors.js"; import { LAYERS } from "@/store/map.js"; +import { HTTP } from "@/lib/http"; export default { name: "profiles", @@ -252,7 +262,7 @@ }; }, computed: { - ...mapGetters("map", ["getVSourceByName"]), + ...mapGetters("map", ["getVSourceByName", "getLayerByName"]), ...mapState("application", ["showProfiles"]), ...mapState("map", ["lineTool", "polygonTool", "cutTool"]), ...mapState("bottlenecks", [ @@ -382,6 +392,44 @@ } }, methods: { + showSurveyDiffences() { + HTTP.post( + "/diff", + { + bottleneck: this.selectedSurvey.bottleneck_id, + minuend: this.selectedSurvey.date_info, + subtrahend: this.additionalSurvey.date_info + }, + { + headers: { + "X-Gemma-Auth": localStorage.getItem("token") + } + } + ) + .then(() => { + const layer = this.getLayerByName(LAYERS.DIFFERENCES); + const wmsSrc = layer.data.getSource(); + wmsSrc.updateParams({ + cql_filter: + "objnam='" + + this.selectedBottleneck + + "' AND " + + "minuend='" + + this.selectedSurvey.date_info + + "' AND subtrahend='" + + this.additionalSurvey.date_info + + "'" + }); + this.$store.commit("map/setLayerVisible", LAYERS.DIFFERENCES); + }) + .catch(error => { + const { status, data } = error.response; + displayError({ + title: this.$gettext("Backend Error"), + message: `${status}: ${data.message || data}` + }); + }); + }, close() { this.$store.commit("application/showProfiles", false); },
--- a/client/src/store/map.js Thu Mar 28 15:43:32 2019 +0100 +++ b/client/src/store/map.js Thu Mar 28 16:38:15 2019 +0100 @@ -50,7 +50,8 @@ DISTANCEMARKSAXIS: "Distance marks, Axis", GAUGES: "Gauges", DRAWTOOL: "Draw Tool", - CUTTOOL: "Cut Tool" + CUTTOOL: "Cut Tool", + DIFFERENCES: "Differences" }; const moveMap = ({ view, extent, zoom, preventZoomOut }) => { @@ -550,6 +551,34 @@ }), isVisible: true, showInLegend: false + }, + { + name: LAYERS.DIFFERENCES, + data: new TileLayer({ + source: new TileWMS({ + preload: 0, + projection: "EPSG:4326", + url: window.location.origin + "/api/internal/wms", + params: { + LAYERS: "sounding_differences", + VERSION: "1.1.1", + TILED: true + }, + tileLoadFunction: function(tile, src) { + // console.log("calling for", tile, src); + HTTP.get(src, { + headers: { + "X-Gemma-Auth": localStorage.getItem("token") + }, + responseType: "blob" + }).then(response => { + tile.getImage().src = URL.createObjectURL(response.data); + }); + } // TODO tile.setState(TileState.ERROR); + }) + }), + isVisible: false, + showInLegend: true } ] };