如何为模板中动态生成的jspdf自动表格内容赋予边界

Question

我正在使用jspdf autotable生成pdf，但是我没有像模板中那样放置边框。 谁能帮我解决这个问题。 我需要将pdf视为与模板相同。

标题的边框必须有2条边界线，如模板中所示。

要显示的总计的最后几行。

TS：

captureScreen() {
    this.displayTable = true;
    var doc = new jsPDF();
    var col = ["2006", "Budgeted Operating Expenses ", '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, 20, "Insert Property Name Here");
    doc.setFont("Times New Roman");
    doc.setFontSize(12);
    doc.text(20, 30, "Tenant:");
    doc.text(40, 30,  this.items.owner.company);

    doc.text(20, 40, "Address:");
    doc.text(40, 40,this.items.owner.address);

    doc.text(20, 50, "Suite:");
    doc.text(40, 50,this.items.owner.suite);


    doc.autoTable(col, rows,{
      tableLineColor: [189, 195, 199],
      tableLineWidth: 0.75,
    theme:"plain",  
    startY: 60,
    margin: {
        top: 60
    },
   headerStyles: {
        //Not getting what to be done here
    },
    });
    document.getElementById("convertToPdf").setAttribute('src', doc.output('datauri'))
  }

DEMO 预先感谢。

Answer 1

jsPdf-autotable 没有“开箱即用”的工具，可以在（顶部||右||底部||左）或双布尔德中创建单元格边界。 br />
您可以使用 jspdf 方法来手动绘制必要的元素（线）：

  const int N = 10;
  var array = Enumerable.Range(0, N)
    .Select((x, i) => i * 5)
    .ToArray();

  foreach (var element in array) {
    Console.WriteLine($"Value: {element}");
  }

在这里您可能会在pdf中找到其他用于绘制它们的元素。 jsPdf docs
StackBlitz