From 41060a0436533cf37df3f48db603996fc5b75abe Mon Sep 17 00:00:00 2001
From: "Engelbart Kai Sven (PEA4-Fe)" <KaiSven.Engelbart@de.bosch.com>
Date: Mon, 25 Jan 2021 10:09:00 +0100
Subject: [PATCH] Fix export button placement, finalize PDF layout

---
 src/app/prediction/prediction.component.html | 20 +++----
 src/app/prediction/prediction.component.scss |  1 +
 src/app/prediction/prediction.component.ts   | 62 ++++++++++++--------
 3 files changed, 50 insertions(+), 33 deletions(-)

diff --git a/src/app/prediction/prediction.component.html b/src/app/prediction/prediction.component.html
index 93ba947..ff3e00b 100644
--- a/src/app/prediction/prediction.component.html
+++ b/src/app/prediction/prediction.component.html
@@ -60,18 +60,18 @@
     <rb-form-radio name="multiple-samples" label="Multiple samples" [(ngModel)]="multipleSamples" [value]="true">
     </rb-form-radio>
   </div>
-
-  <!-- CSV export -->
-  <rb-icon-button icon="forward-right" mode="primary" (click)="exportCSV()" *ngIf="spectrumNames.length">
-    Export to CSV
-  </rb-icon-button>
-
-  <!-- PDF exprot -->
-  <rb-icon-button icon="forward-right" mode="primary" (click)="exportPDF()" *ngIf="spectrumNames.length">
-    Export to PDF
-  </rb-icon-button>
 </div>
 
+<!-- CSV export -->
+<rb-icon-button icon="forward-right" mode="secondary" (click)="exportCSV()" *ngIf="spectrumNames.length" style="margin-right: 0.5rem">
+  Export to CSV
+</rb-icon-button>
+
+<!-- PDF exprot -->
+<rb-icon-button icon="forward-right" mode="secondary" (click)="exportPDF()" *ngIf="spectrumNames.length">
+  Export to PDF
+</rb-icon-button>
+
 <div class="dpt-chart space-below">
   <canvas baseChart
           class="dpt-chart"
diff --git a/src/app/prediction/prediction.component.scss b/src/app/prediction/prediction.component.scss
index 72ec1e2..c930087 100644
--- a/src/app/prediction/prediction.component.scss
+++ b/src/app/prediction/prediction.component.scss
@@ -2,6 +2,7 @@
   max-width: 800px;
   margin-left: auto;
   margin-right: auto;
+  margin-top: 0.5rem;
 }
 
 .file-input {
diff --git a/src/app/prediction/prediction.component.ts b/src/app/prediction/prediction.component.ts
index 8f724bf..e404892 100644
--- a/src/app/prediction/prediction.component.ts
+++ b/src/app/prediction/prediction.component.ts
@@ -155,6 +155,7 @@ export class PredictionComponent implements OnInit {
         },
         {
           table: {
+            widths: ['auto', '*', 'auto', 'auto', 'auto'],
             body: [
               [
                 {text: new Date().toLocaleDateString(), style: 'tableHeader'},
@@ -206,52 +207,67 @@ export class PredictionComponent implements OnInit {
           width: 500
         },
         {
-          text: '*Disclaimer: This tool is still under development and Testing',
-          style: 'subsubheader'
-        },
-        {
-          text: [
-            'The prediction and classification of material parameters are validated only for certain conditions.',
-            'These results may therefore under no circumstances be used to evaluate quality-relevant issues.',
-            'For more details please contact ',
-            {
-              text: 'CR/APS1-Lingenfelder',
-              link: 'mailto:dominic.lingenfelser@bosch.com'
-            },
-            '.'
-          ]
+          table: {
+            body: [[{
+              stack: [
+                {
+                  text: '*Disclaimer: This tool is still under development and Testing',
+                  style: 'subsubheader'
+                },
+                {
+                  text: [
+                    'The prediction and classification of material parameters are validated only for certain conditions.',
+                    'These results may therefore under no circumstances be used to evaluate quality-relevant issues.',
+                    'For more details please contact ',
+                    {
+                      text: 'CR/APS1-Lingenfelser',
+                      link: 'mailto:dominic.lingenfelser@bosch.com'
+                    },
+                    '.'
+                  ]
+                },
+              ]
+            }]],
+          },
+          margin: [25, 20]
         },
         {
           table: {
+            widths: ['*', '*', 'auto'],
             body: [
               [{text: 'Pr\u00fcfung', style: 'tableHeader'}, {text: 'Freigabe', style: 'tableHeader'}, {text: 'Datum', style: 'tableHeader'}],
               ['CR/APS1-Lotter', 'CR/APS1-Lingenfelser', new Date().toLocaleDateString()]
-            ]
+            ],
           }
-        },
-        {
-          text: '\u00a9 Alle Rechte bei Robert Bosch GmbH, auch f\u00fcr den Fall von Schutzreichtsanmeldungen. Jede Verf\u00fcgungsbefugnis, wie Kopier- und Weitergaberecht, bei uns.',
-          fontSize: 8
         }
       ],
+      footer: {
+        text: '\u00a9 Alle Rechte bei Robert Bosch GmbH, auch f\u00fcr den Fall von Schutzreichtsanmeldungen. Jede Verf\u00fcgungsbefugnis, wie Kopier- und Weitergaberecht, bei uns.',
+        fontSize: 8,
+        alignment: 'center'
+      },
       styles: {
         header: {
           fontSize: 18,
-          bold: true
+          bold: true,
+          margin: [0, 10]
         },
         subheader: {
           fontSize: 15,
-          bold: true
+          bold: true,
+          margin: [0, 8]
         },
         subsubheader: {
-          bold: true
+          bold: true,
+          margin: [0, 5]
         },
         tableHeader: {
           bold: true,
           fontSize: 13,
           color: 'black'
 		    }
-      }
+      },
+      pageMargins: [50, 50, 50, 15]
     };
 
     pdfMake.createPdf(dd).download();