diff client/src/components/Pdftool.vue @ 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 da902f0dac88
children 5a4b0c85e7a8
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>