0

estoy utilizando hace poco html2canvas, me genera el pdf y todo, pero me esta generando muchas hojas en blanco despues del contenido y la verdad ni idea del por que

este es mi html que estoy almacenando

<div id="zima">
            <div class="table-responsive">
    <table class="table table-borderless table-sm mb-0">
        <thead>
            <tr>
                <th colspan="1" class="border border-custom border-opacity-100 w-25 text-center" style="border-color: rgba(13,110,253, var(--bs-border-opacity))  !important;">
                    <img class="brandInvoice w-50" src="data:image/png;base64,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">
                </th>
                <th colspan="3" class="w-75 bg-custom bg-opacity-100 text-white text-end border border-custom border-opacity-100 pe-3 align-middle" style="background-color: rgba(13,110,253, var(--bs-bg-opacity)); border-color: rgba(13,110,253, var(--bs-border-opacity))  !important;">MEDICAL BILL</th>
            </tr>
        </thead>
        <tbody>
            <tr class="text-center">
                <td class="border-end w-25"><p class="mb-0"><small class="nitInvoice">1234567890</small></p></td>
                <td class="border-end w-25"></td>
                <td class="border-end w-25"><p class="mb-0"><small>OFFICE PHONE: </small><small class="phoneInvoice">949900530</small></p></td>
                <td class="w-25"><p class="mb-0"><small class="emailInvoice">[email protected]</small></p></td>
            </tr>
        </tbody>
    </table>
</div>
<hr>
<div class="table-responsive">
    <table class="table table-borderless table-sm">
        <tbody>
            <tr>
                <td class="text-center">
                    <p class="very-small mb-0">Account Name</p>
                    <p class="namePatientInvoice mb-0">Jhon  Cordoba </p>
                </td>
                <td class="text-center">
                    <p class="very-small mb-0">Statement Date</p>
                    <p class="dateInvoice mb-0">5/1/2023</p>
                </td>
                <td class="text-center">
                    <p class="very-small mb-0">Account Number</p>
                    <p class="mb-0">282540</p>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="table-responsive">
    <table class="table table-borderless">
        <thead>
            <tr class="bg-custom bg-opacity-10 text-custom text-opacity-100" style="background-color: rgba(13,110,253, var(--bs-bg-opacity)); color: rgba(13,110,253,var(--bs-text-opacity))  !important;">
                <th>PAYMENT OPTIONS</th>
                <th>BILL SUMARY</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td class="border-end">
                    <i class="bi bi-pc-display fs-4 align-top me-1"></i>
                    <div class="d-inline-block">
                        <p class="fw-semibold mb-0">Online:</p>
                        <small class="websiteInvoice">Healthit.com</small>
                    </div>
                </td>
                <td class="align-bottom">
                    <div class="border-bottom">
                        <span>Total Charges Submited (See Back for Itemized Charges)</span>
                        <span class="float-lef">$925.00</span>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="border-end">
                    <i class="bi bi-envelope-fill fs-4 align-top me-1"></i>
                    <div class="d-inline-block">
                        <p class="fw-semibold mb-0">Mail:</p>
                        <small>Please use pay stub below</small>
                    </div>
                </td>
                <td class="align-bottom">
                    <div class="border-bottom">
                        <span>Total Payments andAdjustments</span>
                        <span class="float-lef">$-810.00</span>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="border-end">
                    <i class="bi bi-phone-fill fs-4 align-top me-1"></i>
                    <div class="d-inline-block">
                        <p class="fw-semibold mb-0">Phone:</p>
                        <small class="phoneInvoice">949900530</small>
                    </div>
                </td>
                <td class="align-bottom">
                    <div class="border-bottom">
                        <span>Total Insurance Pending</span>
                        <span class="float-lef">$0.00</span>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="border-end"></td>
                <td>
                    <table class="table table-borderless table-sm mb-0">
                        <tbody>
                            <tr>
                                <td class="w-75 text-end p-0"><p class="mb-0"><b>Amount Owed</b></p></td>
                                <td class="w-25 text-end p-0"><p class="mb-0"><b>$</b><b class="totalInvoice">1000</b></p></td>
                            </tr>
                            <tr>
                                <td class="w-75 text-end p-0"><p class="mb-0"><b>Payment Due</b></p></td>
                                <td class="w-25 text-end p-0"><p class="mb-0"><b class="dateInvoice">5/1/2023</b></p></td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="table-responsive">
    <table class="table table-borderless table-sm mb-4">
        <thead>
            <tr>
                <th class="bg-custom bg-opacity-10 text-custom text-opacity-100" style="background-color: rgba(13,110,253, var(--bs-bg-opacity)); color: rgba(13,110,253,var(--bs-text-opacity))  !important;">MESSAGES</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <p>Your account will be considered for collection action if no payment in 10 days.</p>
                    <p>Pay your bill online at www.healthit.me and use Patient ID 10029771.co1. Free, Secure, Easy. GO GREEN-Select EMAIL during account setup for statement email notifications.</p>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<hr class="position-relative cut mb-0" style="border-style: dashed">
<p class="text-center"><small>TO ENSURE PROPER CREDIT, DETACH AND RETURN THIS PORTION IN THE ENCLOSED ENVELOPE.</small></p>
<div class="table-responsive">
    <table class="table table-borderless table-sm">
        <tbody>
            <tr>
                <td>
                    <h6 id="barcodeInvoice" class="barcodeInvoice"><b>||| || |||||| ||| | ||||| || |||| |||||||| || |||||| ||| | ||||| || |||| ||</b></h6>
                    <h6 id="barcodeInvoice" class="barcodeInvoice"><b></b></h6>
                    <p class="mb-0"><small>ADDRESS SERVICE REQUESTED</small></p>
                    <small class="addressInvoice">23961 Calle de la Magdalena ste 300</small><br>
                    <small class="cityInvoice">Laguna Hills</small>&nbsp;<small class="stateInvoice">CA</small>&nbsp;<small class="zipcodeInvoice">74455</small><br>
                    <div class="d-inline-block border border-custom border-opacity-100 me-3 p-1 float-end" style="border-color: rgba(13,110,253, var(--bs-border-opacity))  !important;">
                        <small>Bill Pay ID <br> 9c0bdfa2</small>
                    </div>
                    <div class="mb-2">
                        <div style="width: 12px;height: 12px; vertical-align: middle;" class="d-inline-block ms-1 p-1 border border-dark"></div>
                        <span class="very-small fw-semibold">Please check box if address is incorrect or insurance. Information has changed, and indicate change(s) on reverse side.</span>
                    </div>
                    <p class="namePatientInvoice mb-0">Jhon  Cordoba </p>
                    <p class="addressPatientInvoice mb-0">Carrera 20 sur 9-50</p>
                    <span class="cityPatientInvoice mb-0"></span>&nbsp;<span class="statePatientInvoice mb-0">Valle del Cauca</span>&nbsp;<span class="zipcodePatientInvoice mb-0">76000</span>
                    <p id="phonePatientInvoice" class="mb-0">1-866-227-2939</p>
                    <div id="cntLaboratory" style="display: none;">
                        <p class="nameLabInvoice small fw-semibold mt-3 mb-0">HARVARD EYE ASSOCIATES</p>
                        <p class="addressLabInvoice small mb-0">181 W. OLYMPIC BLVD</p>
                        <small class="cityLabInvoice">PASADENA</small>&nbsp;<small class="stateLabInvoice">CA</small>&nbsp;<small class="zipcodeLabInvoice">91199</small><br>
                        <p class="phoneLabInvoice small mb-0">900503015</p>
                    </div>
                </td>
                <td>
                    <div>
                        <small>PAY BY CREDIT CARD:</small>
                        <img class="me-1" style="width: 40px;" src="../img/payment/mastercard.png">
                        <img class="me-1" style="width: 40px;" src="../img/payment/discover.png">
                        <img class="me-1" style="width: 40px;" src="../img/payment/visa.png">
                        <img style="width: 40px;" src="../img/payment/amex.png">
                    </div>
                    <div>
                        <small>Card# </small>
                        <div class="d-inline-block border-bottom" style="width: 40%;"></div>
                        <small>Verification# </small>
                        <div class="d-inline-block border-bottom" style="width: 20%;"></div>
                    </div>
                    <div>
                        <small>Cardholder Name </small>
                        <div class="d-inline-block w-50 border-bottom"></div>
                    </div>
                    <div>
                        <small>Exp Date </small>
                        <div class="d-inline-block w-25 border-bottom"></div>
                        <small>Signature </small>
                        <div class="d-inline-block border-bottom" style="width: 40%;"></div>
                    </div>
                    <div class="bg-custom bg-opacity-10 text-custom text-opacity-100 mb-2 p-1" style="background-color: rgba(13,110,253, var(--bs-bg-opacity)); color: rgba(13,110,253,var(--bs-text-opacity))  !important;"><small>Or pay online </small><small class="websiteInvoice">Healthit.com</small></div>
                    <div class="bg-custom bg-opacity-100 mb-2 p-2" style="background-color: rgba(13,110,253, var(--bs-bg-opacity));">
                        <table class="table table-borderless table-sm small mb-0">
                            <thead>
                                <tr class="text-white">
                                    <th>Due Date</th>
                                    <th>Account Number</th>
                                    <th>Amount Due</th>
                                    <th>Amount Paid</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr class="text-white">
                                    <td class="dateInvoice">5/1/2023</td>
                                    <td>282540</td>
                                    <td class="totalInvoice">1000</td>
                                    <td><div class="p-2 bg-light"></div></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="page-break-after"></div>
<div class="table-responsive">
    <table class="table table-borderless table-sm">
        <thead>
            <tr>
                <th colspan="1" class="border border-custom border-opacity-100 w-25 text-center" style="border-color: rgba(13,110,253, var(--bs-border-opacity))  !important;">
                    <img class="brandInvoice w-50" src="data:image/png;base64,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">
                </th>
                <th colspan="3" class="w-75 bg-custom bg-opacity-100 text-white text-end border border-custom border-opacity-100 pe-3 align-middle" style="background-color: rgba(13,110,253, var(--bs-bg-opacity)); border-color: rgba(13,110,253, var(--bs-border-opacity))  !important;">MEDICAL BILL</th>
            </tr>
        </thead>
        <tbody>
            <tr class="text-center">
                <td class="border-end w-25"><p class="mb-0"><small class="nitInvoice">1234567890</small></p></td>
                <td class="border-end w-25"></td>
                <td class="border-end w-25"><p class="mb-0"><small>OFFICE PHONE: </small><small class="phoneInvoice">949900530</small></p></td>
                <td class="w-25"><p class="mb-0"><small class="emailInvoice">[email protected]</small></p></td>
            </tr>
        </tbody>
    </table>
</div>
<div class="bg-custom bg-opacity-10 text-custom text-opacity-100 mb-3 p-2" style="background-color: rgba(13,110,253, var(--bs-bg-opacity)); color: rgba(13,110,253,var(--bs-text-opacity))  !important;">
    <span class="small">PATIENT:</span>&nbsp;<span class="namePatientInvoice small me-3">Jhon  Cordoba </span>
    <span class="small">PROVIDER:</span>&nbsp;<span class="nameDoctorInvoice small me-3">Test Doe</span>
    <span class="small me-3">VOUCHER: 29655840</span>
</div>
<div class="table-responsive">
    <table class="table table-sm">
        <thead>
            <tr>
                <th><center>Service Details</center></th>
                <th><center>Date</center></th>
                <th><center>Patient</center></th>
                <th class="text-end"><center>Charge</center></th>
            </tr>
        </thead>
        <tbody id="tbodyInvoice"><tr><td align="center">Odontology appointment</td><td align="center">2023-01-18</td><td align="center">Jhon Cordoba</td><td align="center">$1000</td></tr></tbody>
        <tfoot>
            <tr>
                <td colspan="2"><small>Your Co-Pay is due at time of service. Please remit payment.</small></td>
                <td class="text-end"><small><b>Visit Total</b></small></td>
                <td class="text-end">$<span class="totalInvoice">1000</span></td>
            </tr>
            <tr>
                <td colspan="3" class="text-end"><b>Total</b></td>
                <td class="text-custom text-opacity-100 text-end" style="color: rgba(13,110,253,var(--bs-text-opacity))  !important;"><b>$</b><b class="totalInvoice">1000</b></td>
            </tr>
        </tfoot>
    </table>
</div>      </div>

y este es mi js con el que estoy haciendo el pdf

function imprimirjs(arrTemplate){
    window.jsPDF = window.jspdf.jsPDF;
    var doc = new jsPDF('p','pt','a4');
    var margin = 20;
    var scale = ((doc.internal.pageSize.width - margin * 2) / document.getElementById('zima').scrollWidth);
    
        doc.html(document.getElementById('zima'),{
        x: margin,
        y: margin,
        html2canvas: {
            scale: scale,
        },
        callback: function(doc){
            doc.output('dataurlnewwindow',{finelane: 'ensayo.pdf'});
        }
    });
};

de antemano muchas gracias por cualquier ayuda, he estado consultando y pues indican que uno debe colocar una funcion en algun lado porque si no eso sigue, pero no entendi nada

otra cosa que vi fue que los saltos de linea, pero no tengo saltos de linea y sobre todo al final

0

1 respuesta 1

0

ya resolvi el problema, las hojas en blancos es debido a que internamente no se como se comporte la libreria html2canvas, pero no acepta bootstrap, me toco eliminar los class que pertenecen a los bootstrap y hacerlo html puro sin bootstrap para que no me salieran hojas en blanco

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.