# HG changeset patch # User Markus Kottlaender # Date 1540895818 -3600 # Node ID 4489e96fb2b494ad23d414081f66d7de2e49f176 # Parent dbf0221b1cf14e21fba3b6206075f7f240df4c85# Parent 1ce42139ea0ac98aebf44f97efae81a11ad7daec merge diff -r 1ce42139ea0a -r 4489e96fb2b4 client/src/bottlenecks/Bottlenecks.vue --- a/client/src/bottlenecks/Bottlenecks.vue Mon Oct 29 18:00:45 2018 +0100 +++ b/client/src/bottlenecks/Bottlenecks.vue Tue Oct 30 11:36:58 2018 +0100 @@ -7,38 +7,36 @@

Bottlenecks


-
-
-
- Name - -
- -
+
+
+ Name + +
+ -
- +
+
+ +
+ {{ displayCurrentSurvey(bottleneck) }} +
+
+ +
+
@@ -49,14 +47,14 @@ /* * This is Free Software under GNU Affero General Public License v >= 3.0 * without warranty, see README.md and license for details. - * + * * SPDX-License-Identifier: AGPL-3.0-or-later * License-Filename: LICENSES/AGPL-3.0.txt - * - * Copyright (C) 2018 by via donau + * + * Copyright (C) 2018 by via donau * – Österreichische Wasserstraßen-Gesellschaft mbH * Software engineering by Intevation GmbH - * + * * Author(s): * Markus Kottländer */ @@ -91,24 +89,6 @@ shadow: true }; }, - filteredAndSortedBottlenecks() { - return this.bottlenecks - .filter(bn => { - return bn.name.toLowerCase().includes(this.search.toLowerCase()); - }) - .sort((bnA, bnB) => { - switch (this.sortColumn) { - case "name": - if (bnA.name.toLowerCase() < bnB.name.toLowerCase()) - return this.sortDirection === "ASC" ? -1 : 1; - if (bnA.name.toLowerCase() > bnB.name.toLowerCase()) - return this.sortDirection === "ASC" ? 1 : -1; - return 0; - default: - return 0; - } - }); - }, sortClass() { return { fa: true, @@ -119,52 +99,98 @@ } }, methods: { - selectSurvey(survey) { + filteredAndSortedBottlenecks() { + return this.bottlenecks.filter(bn => { + const foundInName = bn.properties.name + .toLowerCase() + .includes(this.search.toLowerCase()); + const latestMeasurement = (bn.properties.current || ''); + const foundInLatestMeasurement = latestMeasurement + .substr(0, latestMeasurement.length - 1) + .includes(this.search.toLowerCase()); + return foundInName || foundInLatestMeasurement; + }).sort((bnA, bnB) => { + switch (this.sortColumn) { + case "name": + if ( + bnA.properties.name.toLowerCase() < + bnB.properties.name.toLowerCase() + ) + return this.sortDirection === "ASC" ? -1 : 1; + if ( + bnA.properties.name.toLowerCase() > + bnB.properties.name.toLowerCase() + ) + return this.sortDirection === "ASC" ? 1 : -1; + return 0; + + case "latestMeasurement": + const currentA = bnA.properties.current || ''; + const currentB = bnB.properties.current || ''; + if (currentA < currentB) + return this.sortDirection === "ASC" ? -1 : 1; + if (currentA > currentB) + return this.sortDirection === "ASC" ? 1 : -1; + return 0; + + default: + return 0; + } + }); + }, + selectSurvey(survey, bottleneck) { this.$store.commit("fairwayprofile/setSelectedMorph", survey); - this.$store.commit("fairwayprofile/setAvailableSurveys", {surveys: this.surveys[this.selectedBottleneck.name] }); - this.moveToBottleneck(this.selectedBottleneck); + this.$store.commit("fairwayprofile/setAvailableSurveys", { + surveys: this.surveys[bottleneck.properties.name] + }); + this.moveToBottleneck(bottleneck); }, moveToBottleneck(bottleneck) { // TODO: make this central, duplicates code from application/Topbar.vue - if (bottleneck.geom.type == "Point") { - let view = this.openLayersMap.getView(); - const currentZoom = view.getZoom(); - const newZoom = Math.max(17, currentZoom); - view.animate( - { - zoom: newZoom, - center: fromLonLat( - bottleneck.geom.coordinates, - view.getProjection() - ) - }, - 700 - ); - } + let view = this.openLayersMap.getView(); + const currentZoom = view.getZoom(); + const newZoom = Math.max(17, currentZoom); + view.animate( + { + zoom: newZoom, + center: fromLonLat( + bottleneck.geometry.coordinates, + view.getProjection() + ) + }, + 700 + ); }, sortBy(column) { this.sortColumn = column; this.sortDirection = this.sortDirection === "ASC" ? "DESC" : "ASC"; }, - queryBottleneck(bottleneck) { - HTTP.get("/surveys/" + bottleneck.name, { - headers: { - "X-Gemma-Auth": localStorage.getItem("token"), - "Content-type": "text/xml; charset=UTF-8" - } - }) - .then(response => { - this.surveys[bottleneck.name] = response.data.surveys; - this.selectedBottleneck = - this.selectedBottleneck === bottleneck ? null : bottleneck; + toggleBottleneck(bottleneck) { + if (bottleneck === this.selectedBottleneck) { + this.selectedBottleneck = null; + } else { + HTTP.get("/surveys/" + bottleneck.properties.name, { + headers: { + "X-Gemma-Auth": localStorage.getItem("token"), + "Content-type": "text/xml; charset=UTF-8" + } }) - .catch(error => { - const { status, data } = error.response; - displayError({ - title: "Backend Error", - message: `${status}: ${data.message || data}` + .then(response => { + this.surveys[bottleneck.properties.name] = response.data.surveys; + this.selectedBottleneck = bottleneck; + }) + .catch(error => { + const { status, data } = error.response; + displayError({ + title: "Backend Error", + message: `${status}: ${data.message || data}` + }); }); - }); + } + }, + displayCurrentSurvey(bottleneck) { + const current = bottleneck.properties.current; + return current ? current.substr(0, current.length - 1) : ""; } }, mounted() { @@ -182,7 +208,7 @@ padding-top: $offset; opacity: $slight-transparent; border-radius: $border-radius; - transition: left .3s ease; + transition: left 0.3s ease; overflow: hidden; background: #fff; } @@ -194,7 +220,7 @@ } .bottlenecksextended { - width: 500px; + width: 600px; } .close-bottlenecks { diff -r 1ce42139ea0a -r 4489e96fb2b4 client/src/bottlenecks/store.js --- a/client/src/bottlenecks/store.js Mon Oct 29 18:00:45 2018 +0100 +++ b/client/src/bottlenecks/store.js Tue Oct 30 11:36:58 2018 +0100 @@ -1,18 +1,19 @@ /* * This is Free Software under GNU Affero General Public License v >= 3.0 * without warranty, see README.md and license for details. - * + * * SPDX-License-Identifier: AGPL-3.0-or-later * License-Filename: LICENSES/AGPL-3.0.txt - * - * Copyright (C) 2018 by via donau + * + * Copyright (C) 2018 by via donau * – Österreichische Wasserstraßen-Gesellschaft mbH * Software engineering by Intevation GmbH - * + * * Author(s): * Markus Kottländer */ import { HTTP } from "../application/lib/http"; +import { WFS } from "ol/format.js"; const Bottlenecks = { namespaced: true, @@ -26,17 +27,27 @@ }, actions: { loadBottlenecks({ commit }) { - return new Promise((resolve, reject) => { - HTTP.get("/bottlenecks", { - headers: { "X-Gemma-Auth": localStorage.getItem("token") } - }) - .then(response => { - commit("setBottlenecks", response.data); - resolve(response); - }) - .catch(error => { - reject(error); - }); + var bottleneckFeatureCollectionRequest = new WFS().writeGetFeature({ + srsName: "EPSG:4326", + featureNS: "gemma", + featurePrefix: "gemma", + featureTypes: ["bottleneck_overview"], + outputFormat: "application/json" + }); + + HTTP.post( + "/internal/wfs", + new XMLSerializer().serializeToString( + bottleneckFeatureCollectionRequest + ), + { + headers: { + "X-Gemma-Auth": localStorage.getItem("token"), + "Content-type": "text/xml; charset=UTF-8" + } + } + ).then(response => { + commit("setBottlenecks", response.data.features); }); } }