Mercurial > gemma
diff client/src/components/fairway/AvailableFairwayDepth.vue @ 3191:c0cd5dfec153
statistics: persist fields to vuex
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Wed, 08 May 2019 11:25:11 +0200 |
parents | 505414dfe3e7 |
children | cd076b7a2227 |
line wrap: on
line diff
--- a/client/src/components/fairway/AvailableFairwayDepth.vue Wed May 08 10:50:14 2019 +0200 +++ b/client/src/components/fairway/AvailableFairwayDepth.vue Wed May 08 11:25:11 2019 +0200 @@ -27,10 +27,10 @@ */ import * as d3 from "d3"; import app from "@/main"; -import { displayError } from "@/lib/errors"; import debounce from "debounce"; import { diagram } from "@/lib/mixins"; import { mapState } from "vuex"; +import filters from "@/lib/filters.js"; export default { mixins: [diagram], @@ -56,15 +56,31 @@ window.addEventListener("resize", debounce(this.drawDiagram), 100); }, mounted() { - this.loadData(); + this.drawDiagram(); }, computed: { - ...mapState("diagram", ["selectedFairwayAvailabilityFeature", "fwData"]), + ...mapState("diagram", [ + "selectedFairwayAvailabilityFeature", + "fwData", + "from", + "to", + "frequency" + ]), + fromDate() { + return this.from; + }, + toDate() { + return this.to; + }, availability() { return this.plainAvailability; }, title() { - return `Available Fairway Depth: ${this.featureName}`; + return `Available Fairway Depth: ${ + this.featureName + } (${filters.surveyDate(this.fromDate)} - ${filters.surveyDate( + this.toDate + )}) ${this.frequency}`; }, featureName() { return this.selectedFairwayAvailabilityFeature.properties.name; @@ -74,23 +90,6 @@ close() { this.$store.commit("application/paneSetup", "DEFAULT"); }, - loadData() { - this.$store - .dispatch("diagram/loadAvailableFairwayDepth", { - featureName: this.featureName - }) - .then(() => { - this.drawDiagram(); - }) - .catch(error => { - console.log(error); - const { status, data } = error.response; - displayError({ - title: this.$gettext("Backend Error"), - message: `${status}: ${data.message || data}` - }); - }); - }, drawDiagram() { this.dimensions = this.getDimensions(); this.yScale = d3