Mercurial > gemma
diff client/src/components/gauge/Gauges.vue @ 2830:0632d543a427
client: spuc7/8: show time periods in diagram titles
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Wed, 27 Mar 2019 15:08:25 +0100 |
parents | 4a1211727d5f |
children | 3430369d2310 |
line wrap: on
line diff
--- a/client/src/components/gauge/Gauges.vue Wed Mar 27 14:30:09 2019 +0100 +++ b/client/src/components/gauge/Gauges.vue Wed Mar 27 15:08:25 2019 +0100 @@ -118,7 +118,7 @@ }, computed: { ...mapState("application", ["showGauges", "activeSplitscreenId"]), - ...mapState("gauges", ["gauges"]), + ...mapState("gauges", ["gauges", "longtermInterval"]), ...mapGetters("gauges", ["selectedGauge"]), gaugesLabel() { return this.$gettext("Gauges"); @@ -200,10 +200,9 @@ let splitscreenConf = { id: "gauge-waterlevel", component: "waterlevel", - title: - this.$gettext("Waterlevel") + - ": " + - this.gaugeLabel(this.selectedGauge), + title: `${this.gaugeLabel(this.selectedGauge)}: ${this.$gettext( + "Waterlevel" + )} ${this.dateFrom.toLocaleDateString()} - ${this.dateTo.toLocaleDateString()}`, icon: "ruler-vertical", closeCallback: () => { this.$store.commit("gauges/selectedGaugeISRS", null); @@ -249,10 +248,9 @@ let splitscreenConf = { id: "gauge-hydrological-conditions", component: "hydrological-conditions", - title: - this.$gettext("Hydrological Conditions") + - ": " + - this.gaugeLabel(this.selectedGauge), + title: `${this.gaugeLabel(this.selectedGauge)}: ${this.$gettext( + "Hydrological Conditions" + )}`, icon: "ruler-vertical", closeCallback: () => { this.$store.commit("gauges/selectedGaugeISRS", null); @@ -277,6 +275,12 @@ this.$store.dispatch("gauges/loadLongtermWaterlevels"), this.$store.dispatch("gauges/loadYearWaterlevels") ]) + .then(() => { + splitscreenConf.title = `${ + splitscreenConf.title + } ${this.longtermInterval.join(" - ")}`; + this.$store.commit("application/addSplitscreen", splitscreenConf); + }) .catch(error => { const { status, data } = error.response; displayError({