Convert dynamic HTML content to pdf on front vuejs issue

Question

I have some trouble how to generate dynamic html content to pdf and have these issues through the implementation.

1- Content are not fit the whole page and had bad oranization on the page 2- The page are not added when have to large content on the page

pdf_statscc(){
            var HTML_Width          = $("#document").width();
            var HTML_Height         = $("#document").height();
            var top_left_margin     = 15;
            var PDF_Width           = HTML_Width + (top_left_margin * 2);
            var PDF_Height          = (PDF_Width * 1.5)+(top_left_margin * 2);
            var canvas_image_width  = HTML_Width;
            var canvas_image_height = HTML_Height;
            
            var totalPDFPages = Math.ceil(HTML_Height/PDF_Height)-1;
            html2canvas($("#document")[0],{allowTaint:true}).then(function(canvas) {
            canvas.getContext('2d');
            
            console.log(canvas.height+"  "+canvas.width);
            
            
            var imgData = canvas.toDataURL("image/png");
            var pdf = new jsPDF('p', 'pt',  [PDF_Width, PDF_Height]);
        

            pdf.addImage(imgData, 'PNG', top_left_margin, top_left_margin,canvas_image_width,canvas_image_height);
            
            
            for (var i = 1; i <= totalPDFPages; i++) { 
                pdf.addPage(PDF_Width, PDF_Height);
                pdf.addImage(imgData, 'PNG', top_left_margin, -(PDF_Height*i)+(top_left_margin*4),canvas_image_width,canvas_image_height);
            }
            
            pdf.save("reportingCC.pdf");
         });

Best regard