Mercurial > gemma
changeset 5667:57af2b37a37e clickable-links
Make reference gauge clickable
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Tue, 05 Dec 2023 17:29:07 +0100 |
parents | 37c2354a6024 |
children | 296569ad839b |
files | client/src/components/identify/Identify.vue client/src/components/importoverview/LogItem.vue |
diffstat | 2 files changed, 31 insertions(+), 2 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/identify/Identify.vue Tue Dec 05 15:34:31 2023 +0100 +++ b/client/src/components/identify/Identify.vue Tue Dec 05 17:29:07 2023 +0100 @@ -162,13 +162,13 @@ v-if="prop.val" class="d-flex justify-content-between px-2" > - <template v-if="prop.key != 'gauge_objname'"> + <template v-if="prop.key != 'gauge objname'"> <b>{{ prop.key }}</b> <span>{{ prop.val }}</span> </template> <template v-else> <b><translate>Reference Gauge</translate></b> - <a>{{ prop.val }}</a> + <a @click="selectGauge(prop.val)" href="#">{{ prop.val }}</a> </template> </small> </div> @@ -324,9 +324,18 @@ ...mapState("application", ["showIdentify", "userManualUrl", "config"]), ...mapGetters("map", ["filteredIdentifiedFeatures"]), ...mapState("map", ["currentMeasurement"]), + ...mapGetters("map", ["openLayersMap"]), ...mapState("gauges", ["gauges"]), ...mapGetters("user", ["isWaterwayAdmin", "isSysAdmin"]), ...mapState("importschedule", ["availableReports"]), + gaugesLookUp: { + get() { + return this.gauges.reduce((o, gauge) => { + o[gauge.properties.objname] = gauge; + return o; + }, {}); + } + }, DQLDownloadAllowed() { if (this.loadingDQL) return false; return this.isWaterwayAdmin || this.isSysAdmin; @@ -439,6 +448,22 @@ } }, methods: { + selectGauge(gauge_name) { + const gauge = this.gaugesLookUp[gauge_name]; + const zoom = 16; + this.openLayersMap() + .getLayer("GAUGES") + .setVisible(true); + this.$store.dispatch( + "gauges/setSelectedGaugeISRS", + gauge.properties.isrs_code + ); + this.$store.dispatch("map/moveMap", { + coordinates: gauge.geometry.coordinates, + zoom, + preventZoomOut: true + }); + }, downloadDataQualityReport(reportName) { this.loadingDQL = true; HTTP.get(`/data/report/${reportName}`, {
--- a/client/src/components/importoverview/LogItem.vue Tue Dec 05 15:34:31 2023 +0100 +++ b/client/src/components/importoverview/LogItem.vue Tue Dec 05 17:29:07 2023 +0100 @@ -66,6 +66,7 @@ props: ["height", "line", "index"], computed: { ...mapGetters("bottlenecks", ["bottlenecksForDisplay"]), + ...mapGetters("map", ["openLayersMap"]), bottlenecksLookup: { get() { return this.bottlenecksForDisplay.reduce((o, bn) => { @@ -84,6 +85,9 @@ methods: { showBottleneck(bottleneck_id) { const bottleneck = this.bottlenecksLookup[bottleneck_id]; + this.openLayersMap() + .getLayer("BOTTLENECKS") + .setVisible(true); this.$store .dispatch( "bottlenecks/setSelectedBottleneck",