Mercurial > gemma
changeset 2714:4dd38840d74b
client:pdf-gen:imporve some template elements
* add property to define the border color of the elements
* fix rounding of boxes to handle case that box is not rounded
* check text for small version of date
| author | Fadi Abbud <fadi.abbud@intevation.de> |
|---|---|
| date | Mon, 18 Mar 2019 17:52:04 +0100 |
| parents | b79f5c5404c2 |
| children | 8d96b9254465 |
| files | client/src/components/Pdftool.vue |
| diffstat | 1 files changed, 47 insertions(+), 19 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/Pdftool.vue Mon Mar 18 17:47:16 2019 +0100 +++ b/client/src/components/Pdftool.vue Mon Mar 18 17:52:04 2019 +0100 @@ -307,7 +307,8 @@ defaultTextColor = "black", defaultBgColor = "white", defaultPadding = 3, - defaultOffset = { x: 0, y: 0 }; + defaultOffset = { x: 0, y: 0 }, + defaultBorderColor = "white"; this.templateData.elements.forEach(e => { switch (e.type) { case "text": { @@ -329,7 +330,8 @@ e.height, // handling the case when the rectangle not rounded (rounding = 0) e.rounding === 0 || e.rounding ? e.rounding : defaultRounding, - e.color || defaultBgColor + e.color || defaultBgColor, + e.brcolor || defaultBorderColor ); break; } @@ -344,7 +346,8 @@ e.fontSize || defaultFontSize, e.color || defaultTextColor, e.background || defaultBgColor, - e.text + e.text, + e.brcolor || defaultBorderColor ); break; } @@ -363,8 +366,9 @@ this.addBottleneckInfo( e.position, e.offset || defaultOffset, - e.rounding || defaultRounding, - e.color || defaultTextColor + e.rounding === 0 || e.rounding ? e.rounding : defaultRounding, + e.color || defaultTextColor, + e.brcolor || defaultBorderColor ); break; } @@ -372,7 +376,8 @@ this.addLegend( e.position, e.offset || defaultOffset, - e.rounding || defaultRounding + e.rounding === 0 || e.rounding ? e.rounding : defaultRounding, + e.brcolor || defaultBorderColor ); break; } @@ -381,7 +386,8 @@ scaleNominator, e.position, e.offset || defaultOffset, - e.rounding || defaultRounding + e.rounding === 0 || e.rounding ? e.rounding : defaultRounding, + e.brcolor || defaultBorderColor ); break; } @@ -425,10 +431,10 @@ this.openLayersMap.getView().fit(this.mapExtent, { size: this.mapSize }); this.readyToGenerate = true; }, - addRoundedBox(x, y, w, h, color, rounding) { + addRoundedBox(x, y, w, h, color, rounding, brcolor) { // draws a rounded background box at (x,y) width x height // using jsPDF units - this.pdf.doc.setDrawColor(color); + this.pdf.doc.setDrawColor(brcolor); this.pdf.doc.setFillColor(color); this.pdf.doc.roundedRect(x, y, w, h, rounding, rounding, "FD"); }, @@ -457,7 +463,7 @@ this.pdf.doc.text(textLines, x, y, { baseline: "hanging" }); }, - addBox(position, offset, width, height, rounding, color) { + addBox(position, offset, width, height, rounding, color, brcolor) { // x/y defaults to offset for topleft corner (normal x/y coordinates) let x = offset.x; let y = offset.y; @@ -471,7 +477,7 @@ y = this.pdf.height - offset.y - height; } - this.addRoundedBox(x, y, width, height, color, rounding); + this.addRoundedBox(x, y, width, height, color, rounding, brcolor); }, // add some text at specific coordinates with a background box addTextBox( @@ -484,7 +490,8 @@ fontSize, color, background, - text + text, + brcolor ) { this.pdf.doc.setFontSize(fontSize); text = this.replacePlaceholders(text); @@ -498,7 +505,15 @@ height = this.getTextHeight(textLines.length) + 2 * padding; } - this.addBox(position, offset, width, height, rounding, background); + this.addBox( + position, + offset, + width, + height, + rounding, + background, + brcolor + ); this.addText( position, { x: offset.x + padding, y: offset.y + padding }, @@ -535,7 +550,7 @@ this.pdf.doc.addImage(image, x, y, width, height); }, - addScaleBar(scaleNominator, position, offset, rounding) { + addScaleBar(scaleNominator, position, offset, rounding, brcolor) { // scaleNominator is the x in 1:x of the map scale // hardcode maximal width for now @@ -613,7 +628,7 @@ let scaleBarY = y + 5; // 5 because above the scalebar will be the numbers // draw outer white box - this.addRoundedBox(x, y, fullSize + 8, 10, "white", rounding); + this.addRoundedBox(x, y, fullSize + 8, 10, "white", rounding, brcolor); // draw first part of scalebar this.pdf.doc.setDrawColor(0, 0, 0); @@ -707,7 +722,7 @@ this.pdf.doc.setFontStyle("normal"); this.pdf.doc.text(size < 3 ? x1 - 0.5 : x1 - 1.3, y3 + 1, "N"); }, - addLegend(position, offset, rounding) { + addLegend(position, offset, rounding, brcolor) { if ( this.selectedBottleneck && this.selectedSurvey && @@ -736,7 +751,7 @@ y = this.pdf.height - offset.y - height; } - this.addRoundedBox(x, y, width, height, "white", rounding); + this.addRoundedBox(x, y, width, height, "white", rounding, brcolor); this.pdf.doc.addImage( legendImage, x + padding, @@ -746,7 +761,7 @@ ); } }, - addBottleneckInfo(position, offset, rounding, color) { + addBottleneckInfo(position, offset, rounding, color, brcolor) { if ( this.selectedBottleneck && this.selectedSurvey && @@ -811,7 +826,7 @@ } // white background box - this.addRoundedBox(x, y, width, height, "white", rounding); + this.addRoundedBox(x, y, width, height, "white", rounding, brcolor); // bottleneck this.pdf.doc.setFontStyle("italic"); @@ -857,6 +872,19 @@ if (text.includes("{date}")) { text = text.replace("{date}", new Date().toLocaleString(locale2)); } + //get only day,month and year from the Date object + if (text.includes("{date-minor}")) { + var date = new Date(); + var dt = + (date.getDate() < 10 ? "0" : "") + + date.getDate() + + "." + + (date.getMonth() + 1 < 10 ? "0" : "") + + (date.getMonth() + 1) + + "." + + date.getFullYear(); + text = text.replace("{date-minor}", dt.toLocaleString(locale2)); + } if (text.includes("{user}")) { text = text.replace("{user}", this.user); }