Mercurial > gemma
changeset 3049:7e6ecb6d0796
client: add headline info for the waterlevel generated diagram
author | Fadi Abbud <fadi.abbud@intevation.de> |
---|---|
date | Mon, 15 Apr 2019 16:37:20 +0200 |
parents | b8b95292d45f |
children | c739b81b8f41 |
files | client/src/components/gauge/Waterlevel.vue |
diffstat | 1 files changed, 30 insertions(+), 2 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/gauge/Waterlevel.vue Mon Apr 15 15:16:23 2019 +0200 +++ b/client/src/components/gauge/Waterlevel.vue Mon Apr 15 16:37:20 2019 +0200 @@ -176,11 +176,33 @@ }, computed: { ...mapState("gauges", ["dateFrom", "waterlevels", "nashSutcliffe"]), - ...mapGetters("gauges", ["selectedGauge"]) + ...mapGetters("gauges", ["selectedGauge"]), + dateFrom: { + get() { + return this.$store.state.gauges.dateFrom; + } + }, + dateTo: { + get() { + return this.$store.state.gauges.dateTo; + } + } }, methods: { downloadPDF() { var svg = this.$refs.diagramContainer.innerHTML; + var gaugeInfo = + this.selectedGauge.properties.objname + + " (" + + this.selectedGauge.id + .split(".")[1] + .replace(/[()]/g, "") + .split(",")[3] + + "):" + + " Waterlevel " + + this.dateFrom.toLocaleDateString() + + " - " + + this.dateTo.toLocaleDateString(); if (svg) { svg = svg.replace(/\r?\n|\r/g, "").trim(); } @@ -195,7 +217,13 @@ }); var imgData = canvas.toDataURL("image/png"); pdf.addImage(imgData, "PNG", 40, 60, 380, 130); - pdf.save("waterlevel-Diagram.pdf"); + pdf.setTextColor("steelblue"); + pdf.setFontSize(22); + pdf.setFontStyle("bold"); + pdf.text(gaugeInfo, 108, 30); + pdf.save( + this.selectedGauge.properties.objname + " Waterlevel-Diagram.pdf" + ); }, drawDiagram() { // remove old diagram and exit if necessary data is missing