jsPDF добавить нижний колонтитул на несколько страниц - PullRequest
0 голосов
/ 26 июня 2018

Привет, я новичок, использующий jsPDF. Я могу создать новый PDF-файл с несколькими страницами. Проблема в том, что я хочу разместить нижний колонтитул на каждой странице. Я просмотрел несколько постов, но все еще не уверен, как подойти. Нужно ли создавать страницы в массиве, а затем выпускать страницы? Есть ли более простой способ приблизиться к этому? Любая помощь будет с благодарностью. Заранее спасибо. Вот моя функция на сегодняшний день:

function printEngineeringNotice() {
      alert("In PDF.");
     var hubENNumber = document.getElementById('ennumber').innerText;
     var hubNumber = hubENNumber.substr(12);
     var hubDate = document.getElementById('enendate').getElementsByClassName('date-time-field-style')[0].value;
     var hubCustomer = document.getElementById('encustomer').getElementsByClassName('FormField')[0].value;
     var hubSummary = document.getElementById('summary').getElementsByClassName('FormFieldTextArea')[0].value;
     var hubDescription = document.getElementById('description').getElementsByClassName('FormFieldTextArea')[0].value;
     var lenDescription = hubDescription.length;
     var hubRev = document.getElementById('enrev').getElementsByClassName('FormField')[0].value;
     var hubDistribution = document.getElementById('distribution');
     var Cells = hubDistribution.getElementsByTagName('td');
     hubDist = (Cells[0].innerText);

     var hubAuthor = document.getElementById('enauthor').innerText;
     var hubAuth = hubAuthor.substr(9)

     varBottom = 'This Drawing.'


     var myWindow = window.open('','_blank','width=460px, height=287.5px');
     var a = myWindow.document.createElement("script");
     a.type = "text/javascript";
     a.src = "common/scripts/jquery.min.js";
     var b = myWindow.document.createElement("script");
     b.type = "text/javascript";
     b.src = "common/scripts/jspdf.debug.js";
     var c = myWindow.document.createElement("script");
     c.type = "text/javascript";
     c.src = "common/scripts/html2canvas.js";
     var d = myWindow.document.createElement("script");
     d.type = "text/javascript";


     d.text = "function printThis() { var pdf = new jsPDF('p', 'in', [11,8.5]),"
     + "margins = {top: 10, bottom: 10, left: 10};"
     + "var printArea = document.getElementById('PrintableTag');"

     + "pdf.addHTML(printArea, 0, 0, {pagesplit: true, retina: true, margin: {top: 100, right: 10, bottom: 100, left: 10, useFor: 'page'}},"
     + "function () {pdf.save('Customer.pdf')});"
     + "setTimeout( function() {window.close();}, 10000);} window.onload = printThis";


     var e = myWindow.document.createElement("script");
     e.type = "text/javascript";

     myWindow.document.write("<head id = 'myScript'></head><body id = 'PrintableTag'></body>"
     + "<style>#Container {min-height:100%; position:relative; width:850px; margin-left: auto; margin-right: auto; height: 700px}</style>"      
     + "<div id='Container'>"       

     + "<table width = '1000px' cellspacing = '0' cellpadding = '4' style = 'border: 0px' align='center'>"
     + "<tr><td><table width = '850px' cellspacing = '0' cellpadding = '4' style = 'border: 0px' align='center'>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b><center>GE – Transportation</center></td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b><center>Systems Engineering</center></td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b><center>Engineering Notice</center></td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'>" + hubNumber + "<b></td></tr>"
     + "<tr style:center><td style:center><center><hr border: 3px solid black; width = '850px'></hr></center></td></tr></table>"

     + "<tr><td><table width = '850px' cellspacing = '0' cellpadding = '4' style = 'border: 0px' align='center'>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b>EN Number:</b></td><td style = 'font-size: 20px'>" + hubNumber + "</td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b>Date:</b></td><td style = 'font-size: 20px'>" + lenDescription + "</td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b>Customer:</b></td><td style = 'font-size: 20px'>" + hubCustomer + "</td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b>Summary:</b></td><td style = 'font-size: 20px'>" + hubSummary + "</td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'> <b><u>Distribution:</u></b></td><td></td></tr>"
     + "<tr><td style = 'font-size: 20px' colspan='2'>" + hubDist + "</td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'> <b><u>Description:</u></b></td><td></td></tr>"
     + "<tr><td style = 'font-size: 20px' colspan='2'>" + hubDescription + "</td></tr></table>"
     + "<style>#myFooter {position:absolute; bottom:0; width:850px; height:60px; background:#6cf; vertical-align:bottom;  left: 15%;  margin-left: -50px;></style>"  
     + "<footer id='myFooter'>"
     + "<style>#hubRow {border: 3px solid black;}</style>"
     + "<table border = '1' border-style: 'solid' width = '850px' align='center' id = 'hubRow'>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b>Author:</b></td><td style = 'font-size: 20px'>" + hubAuth + "</td>"
     + "<td width = '150px' style = 'font-size: 20px'><b>Approver:</b></td><td style = 'font-size: 20px'>" + hubAuth + "</td></tr>"
     + "<tr><td width = '150px' style = 'font-size: 20px'><b>Issued:</b></td><td style = 'font-size: 20px'>Get Engineering</td>"
     + "<td width = '150px' style = 'font-size: 20px'><b>Bus. Area:</b></td><td style = 'font-size: 20px'>LO</td></tr></table>"
     + "<table width = '850px' cellspacing = '0' cellpadding = '4' style = 'border: 0px' align='center'>"
     + "<tr><td width = '850px' style = 'font-size: 10px'>" + varBottom + "</td></tr></table>"
     + "</footer></div>"
     + "</td></tr></table></div>")


     myWindow.document.getElementById('myScript').appendChild(a);                                                                                                                                                                                                                                                                                                                                                                                    
     myWindow.document.getElementById('myScript').appendChild(b);
     myWindow.document.getElementById('myScript').appendChild(c);
     myWindow.document.getElementById('myScript').appendChild(d);
     myWindow.document.getElementById('myScript').appendChild(e);
     myWindow.document.close();
  }
...