Mercurial > gemma
changeset 2212:733cfc3db48a pdf-export
started pdf template administration
moved templates to vuex store, to have them available in pdf box and systen configuration.
| author | Markus Kottlaender <markus@intevation.de> |
|---|---|
| date | Wed, 06 Feb 2019 16:19:16 +0100 |
| parents | e901f509bfcd |
| children | 9bf8562df42f |
| files | client/src/components/Pdftool.vue client/src/main.js client/src/router.js client/src/store/application.js |
| diffstat | 4 files changed, 123 insertions(+), 101 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/Pdftool.vue Wed Feb 06 15:53:24 2019 +0100 +++ b/client/src/components/Pdftool.vue Wed Feb 06 16:19:16 2019 +0100 @@ -21,9 +21,8 @@ v-model="form.template" class="form-control d-block mb-2 w-100 font-weight-bold" > - <option :value="null"><translate>Chose preset</translate></option> <option - v-for="template in templates" + v-for="template in pdfTemplates" :value="template.name" :key="template.name" > @@ -139,106 +138,12 @@ downloadType: "download", resolution: "120" }, - templates: [ - { - name: "Template 1", - properties: { - format: "landscape", - resolution: "80", - paperSize: "a4" - }, - elements: [ - { - type: "docinfo", - x_coordinate: 0, - y_coordinate: 0, - elementWidth: 118, - elementHeight: 8, - textSize: 9 - }, - { - type: "image", - imageType: "PNG", - imageUrl: "", - x_coordinate: 30, - y_coordinate: 297, - imageWidth: 50, - imageHeight: 23 - }, - { - type: "scalebar", - x_coordinate: 226.5, - y_coordinate: 204 - //elementsize: 50 - }, - { - type: "textbox", - x_coordinate: 50, - y_coordinate: 190, - elementSize: 8, - text: "textfrom template", - color: "black" - }, - { - type: "aboutbox" - //x_coordinate: 0, - //y_coordinate: 210 - 20 - } - ] - }, - { - name: "Template 2", - properties: { - format: "portrait", - resolution: "120", - paperSize: "a3" - }, - elements: [ - { - type: "docinfo", - x_coordinate: 0, - y_coordinate: 0, - elementWidth: 118, - elementHeight: 8, - textSize: 9 - }, - { - type: "image", - imageType: "PNG", - imageUrl: "", - x_coordinate: 30, - y_coordinate: 297, - imageWidth: 50, - imageHeight: 23 - }, - { - type: "scalebar", - x_coordinate: 247.3, - y_coordinate: 414 - //elementsize: 50 - }, - { - type: "textbox", - x_coordinate: 50, - y_coordinate: 50, - elementSize: 22, - text: "from template", - color: "black" - }, - { - type: "aboutbox" - //x_coordinate: 0, - //y_coordinate: 210 - 20 - } - ] - } - ], logoImageForPDF: null, // a HTMLImageElement instance readyToGenerate: true // if the user is allowed to press the button }; }, computed: { - ...mapState("application", ["showPdfTool", "logoForPDF"]), + ...mapState("application", ["showPdfTool", "logoForPDF", "pdfTemplates"]), ...mapState("bottlenecks", ["selectedSurvey"]), ...mapState("map", ["openLayersMap", "isolinesLegendImgDataURL"]), ...mapGetters("map", ["getLayerByName"]), @@ -248,7 +153,7 @@ // When a template is chosen from the dropdown, its propoerties are // applied to the rest of the form. applyTemplateToForm() { - let template = this.templates.find(t => t.name === this.form.template); + let template = this.pdfTemplates.find(t => t.name === this.form.template); if (template) { this.form.format = template.properties.format; this.form.paperSize = template.properties.paperSize; @@ -259,7 +164,7 @@ // will be set in the dropdown. compareFormWithTemplates() { this.form.template = null; - this.templates.forEach(t => { + this.pdfTemplates.forEach(t => { if ( this.form.format === t.properties.format && this.form.paperSize === t.properties.paperSize && @@ -270,7 +175,7 @@ }); }, download() { - let template = this.templates.find(t => t.name === this.form.template); + let template = this.pdfTemplates.find(t => t.name === this.form.template); // disable button while working on it this.readyToGenerate = false; @@ -625,6 +530,11 @@ this.addRoundedBox(doc, docWidth - 54, 0, 54, 50 / aspectRatio + 4); doc.addImage(legendImage, docWidth - 52, 2, 50, 50 / aspectRatio); } + }, + mounted() { + this.$store.dispatch("application/loadPdfTemplates").then(() => { + this.form.template = this.pdfTemplates[0].name; + }); } }; </script>
--- a/client/src/main.js Wed Feb 06 15:53:24 2019 +0100 +++ b/client/src/main.js Wed Feb 06 16:19:16 2019 +0100 @@ -43,6 +43,7 @@ faClock, faCloudUploadAlt, faCopy, + faDownload, faDrawPolygon, faExclamationTriangle, faEye, @@ -95,6 +96,7 @@ faClock, faCloudUploadAlt, faCopy, + faDownload, faDrawPolygon, faExclamationTriangle, faEye,
--- a/client/src/router.js Wed Feb 06 15:53:24 2019 +0100 +++ b/client/src/router.js Wed Feb 06 16:19:16 2019 +0100 @@ -65,7 +65,8 @@ { path: "/systemconfiguration", name: "systemconfiguration", - component: () => import("./components/Systemconfiguration.vue"), + component: () => + import("./components/systemconfiguration/Systemconfiguration.vue"), meta: { requiresAuth: true },
--- a/client/src/store/application.js Wed Feb 06 15:53:24 2019 +0100 +++ b/client/src/store/application.js Wed Feb 06 16:19:16 2019 +0100 @@ -15,6 +15,7 @@ */ import { version } from "../../package.json"; +// import { HTTP } from "../lib/http"; // initial state const init = () => { @@ -22,6 +23,7 @@ appTitle: process.env.VUE_APP_TITLE, secondaryLogo: process.env.VUE_APP_SECONDARY_LOGO_URL, logoForPDF: process.env.VUE_APP_LOGO_FOR_PDF_URL, + pdfTemplates: [], showSidebar: false, showUsermenu: false, showSplitscreen: false, @@ -103,6 +105,113 @@ }, searchQuery: (state, searchQuery) => { state.searchQuery = searchQuery; + }, + pdfTemplates: (state, pdfTemplates) => { + state.pdfTemplates = pdfTemplates; + } + }, + actions: { + loadPdfTemplates({ commit }) { + return new Promise(resolve => { + // pretend we do something async + setTimeout(function() { + commit("pdfTemplates", [ + { + name: "Default", + properties: { + format: "landscape", + resolution: "80", + paperSize: "a4" + }, + elements: [ + { + type: "docinfo", + x_coordinate: 0, + y_coordinate: 0, + elementWidth: 118, + elementHeight: 8, + textSize: 9 + }, + { + type: "image", + imageType: "PNG", + imageUrl: "", + x_coordinate: 30, + y_coordinate: 297, + imageWidth: 50, + imageHeight: 23 + }, + { + type: "scalebar", + x_coordinate: 226.5, + y_coordinate: 204 + //elementsize: 50 + }, + { + type: "textbox", + x_coordinate: 50, + y_coordinate: 190, + elementSize: 8, + text: "textfrom template", + color: "black" + }, + { + type: "aboutbox" + //x_coordinate: 0, + //y_coordinate: 210 - 20 + } + ] + }, + { + name: "DE Querformat, groß", + properties: { + format: "landscape", + resolution: "120", + paperSize: "a3" + }, + elements: [ + { + type: "docinfo", + x_coordinate: 0, + y_coordinate: 0, + elementWidth: 118, + elementHeight: 8, + textSize: 9 + }, + { + type: "image", + imageType: "PNG", + imageUrl: "", + x_coordinate: 30, + y_coordinate: 297, + imageWidth: 50, + imageHeight: 23 + }, + { + type: "scalebar", + x_coordinate: 247.3, + y_coordinate: 414 + //elementsize: 50 + }, + { + type: "textbox", + x_coordinate: 50, + y_coordinate: 50, + elementSize: 22, + text: "from template", + color: "black" + }, + { + type: "aboutbox" + //x_coordinate: 0, + //y_coordinate: 210 - 20 + } + ] + } + ]); + resolve(); + }, 500); + }); } } };