Как получить шаблон как на изображении, используя jsPDF в angular2 - PullRequest
0 голосов
/ 14 марта 2019

Template To achieve

Я использую jspdf для преобразования данных json в pdf.Но теперь мне нужно спроектировать так же, как шаблон с использованием jsPDF.Это достижимо?Если так, то кто-нибудь может помочь мне достичь этого.

DEMO из того, что я уже сделал.

HTML:

<button class="pull-right" (click)="captureScreen()">PDF</button>
<div class="container" ></div>
<iframe id="convertToPdf" type="application/pdf"  width="100%" height="100%" [ngStyle]="{display: (displayTable ? 'block' : 'none')}"></iframe>

Ts:

captureScreen() {
    this.displayTable = true;
    var doc = new jsPDF();
    var col = ["year", "budget", 'exclude', 'expenses'];
    var rows = [];
    for (var i = 0; i < this.items.budget.length; i++) {
      var temp = []
      for (var key in this.items.budget[i]) {
        temp.push(this.items.budget[i][key])
      }
      rows.push(temp);
    }
    doc.text(100, 10, this.items.title.title);
    doc.text(20, 30, "Company:"+ this.items.owner.company);
    doc.text(20, 40, "Address:"+ this.items.owner.address);
    doc.text(20, 50, "Suite:"+ this.items.owner.suite);
    doc.text(140, 30, "Cap:"+ this.items.owner.cap);
    doc.text(140, 40, "Gross Up%:"+ this.items.owner.gross);
    doc.text(140, 50, "Cap Percent%:"+ this.items.owner.capPercent);

    doc.autoTable(col, rows,{
    startY: 60,
    margin: {
        top: 60
    }});
    document.getElementById("convertToPdf").setAttribute('src', doc.output('datauri'))
  }
...