Skip to content

Commit 012f748

Browse files
authored
Update index.html
1 parent 9d40beb commit 012f748

File tree

1 file changed

+137
-18
lines changed

1 file changed

+137
-18
lines changed

index.html

Lines changed: 137 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,28 @@
1818
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
1919
<script src="https://cdnjs.cloudflare.com/ajax/libs/docx/7.8.2/docx.js"></script>
2020

21+
<!-- Additional script to verify library loading -->
22+
<script>
23+
// Check if libraries are loaded correctly
24+
window.addEventListener('load', function() {
25+
// Check docx.js
26+
if (typeof docx === 'undefined') {
27+
console.error('docx.js library failed to load');
28+
// Attempt to reload it
29+
var script = document.createElement('script');
30+
script.src = 'https://unpkg.com/[email protected]/build/index.js';
31+
script.onload = function() {
32+
console.log('docx.js loaded from fallback source');
33+
window.docxLoaded = true;
34+
};
35+
document.head.appendChild(script);
36+
} else {
37+
console.log('docx.js loaded successfully');
38+
window.docxLoaded = true;
39+
}
40+
});
41+
</script>
42+
2143
<!-- Font Awesome for icons -->
2244
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
2345

@@ -703,25 +725,122 @@ <h2 class="font-bold mb-2">TO</h2>
703725
previewContent.innerHTML = '';
704726
previewContent.appendChild(template);
705727
}
728+
729+
// Generate PDF
730+
document.getElementById('generatePDFBtn').addEventListener('click', function() {
731+
try {
732+
// Update preview content first
733+
updatePreview();
734+
735+
// Get the element with preview content
736+
const element = document.getElementById('previewContent').firstChild;
737+
738+
// Make sure the element is visible and has content
739+
if (!element) {
740+
console.error("Preview content is empty");
741+
alert("Unable to generate PDF: Preview content is empty. Please try again.");
742+
return;
743+
}
744+
745+
// Create a clone of the element to prevent modifications to the original
746+
const clonedElement = element.cloneNode(true);
747+
748+
// Make sure all images are fully loaded before generating PDF
749+
const images = clonedElement.querySelectorAll('img');
750+
let imagesLoaded = true;
751+
752+
images.forEach(img => {
753+
if (!img.complete) {
754+
imagesLoaded = false;
755+
}
756+
});
757+
758+
if (!imagesLoaded) {
759+
console.log("Waiting for images to load...");
760+
setTimeout(() => {
761+
document.getElementById('generatePDFBtn').click();
762+
}, 500);
763+
return;
764+
}
765+
766+
// Set PO number for filename
767+
const poNumber = document.getElementById('poNumber').value || 'purchase-order';
768+
769+
// Configure PDF options for better rendering
770+
const opt = {
771+
margin: [10, 10, 10, 10],
772+
filename: poNumber + '.pdf',
773+
image: { type: 'jpeg', quality: 0.98 },
774+
html2canvas: {
775+
scale: 2, // Higher scale for better quality
776+
useCORS: true, // Allow loading of images from other domains
777+
logging: true, // Enable logging for debugging
778+
letterRendering: true, // Improve rendering of text
779+
allowTaint: true, // Allow processing of tainted canvas
780+
foreignObjectRendering: true // Use ForeignObject when possible
781+
},
782+
jsPDF: {
783+
unit: 'mm',
784+
format: 'a4',
785+
orientation: 'portrait',
786+
compress: true
787+
}
788+
};
789+
790+
// Create a wrapper div to ensure proper rendering
791+
const wrapper = document.createElement('div');
792+
wrapper.appendChild(clonedElement);
793+
document.body.appendChild(wrapper);
794+
wrapper.style.position = 'absolute';
795+
wrapper.style.left = '-9999px';
796+
wrapper.style.top = '0';
797+
wrapper.style.width = '210mm'; // A4 width
798+
799+
// Add a message to show processing status
800+
const loadingMsg = document.createElement('div');
801+
loadingMsg.innerText = 'Generating PDF...';
802+
loadingMsg.style.position = 'fixed';
803+
loadingMsg.style.top = '50%';
804+
loadingMsg.style.left = '50%';
805+
loadingMsg.style.transform = 'translate(-50%, -50%)';
806+
loadingMsg.style.padding = '20px';
807+
loadingMsg.style.backgroundColor = 'rgba(0,0,0,0.7)';
808+
loadingMsg.style.color = 'white';
809+
loadingMsg.style.borderRadius = '5px';
810+
loadingMsg.style.zIndex = '9999';
811+
document.body.appendChild(loadingMsg);
812+
813+
// Generate PDF with error handling
814+
html2pdf()
815+
.set(opt)
816+
.from(wrapper)
817+
.save()
818+
.then(() => {
819+
console.log('PDF generated successfully');
820+
document.body.removeChild(wrapper);
821+
document.body.removeChild(loadingMsg);
822+
})
823+
.catch(error => {
824+
console.error('Error generating PDF:', error);
825+
alert('There was an error generating the PDF. Please check the console for details.');
826+
document.body.removeChild(wrapper);
827+
document.body.removeChild(loadingMsg);
828+
});
829+
830+
} catch (error) {
831+
console.error('Error in PDF generation:', error);
832+
alert('There was an error generating the PDF. Please try again.');
833+
}
834+
});
706835

707-
// Generate PDF
708-
document.getElementById('generatePDFBtn').addEventListener('click', function() {
709-
updatePreview();
710-
const element = document.getElementById('previewContent').firstChild;
711-
712-
const opt = {
713-
margin: 10,
714-
filename: document.getElementById('poNumber').value + '.pdf' || 'purchase-order.pdf',
715-
image: { type: 'jpeg', quality: 0.98 },
716-
html2canvas: { scale: 2 },
717-
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
718-
};
719-
720-
html2pdf().set(opt).from(element).save();
721-
});
722-
723-
// Generate Word Document
836+
// Generate Word Document
724837
document.getElementById('generateWordBtn').addEventListener('click', function() {
838+
// Check if library is loaded before proceeding
839+
if (typeof docx === 'undefined') {
840+
alert('Word export library is not loaded. Please check your internet connection and try again.');
841+
return;
842+
}
843+
725844
// Update preview first to ensure data is current
726845
updatePreview();
727846

@@ -1189,7 +1308,7 @@ <h2 class="font-bold mb-2">TO</h2>
11891308
}
11901309
});
11911310

1192-
// Generate Excel
1311+
// Generate Excel
11931312
document.getElementById('generateExcelBtn').addEventListener('click', function() {
11941313
const poNumber = document.getElementById('poNumber').value || 'purchase-order';
11951314
const companyName = document.getElementById('companyName').value || 'Your Company';

0 commit comments

Comments
 (0)