feat: add PDF download functionality with loading state and improve print layout styling

This commit is contained in:
Ümit Tunç
2026-06-02 21:26:50 +03:00
parent f68bc87031
commit fb1224f7c9
@@ -492,6 +492,8 @@
padding: 0 !important;
width: 210mm !important;
height: 297mm !important;
max-height: 297mm !important;
overflow: hidden !important;
}
#letterheadPrintArea, #letterheadPrintArea * {
visibility: visible !important;
@@ -507,6 +509,7 @@
border-radius: 0 !important;
margin: 0 !important;
background: #ffffff !important;
box-sizing: border-box !important;
}
@page {
size: A4 portrait;
@@ -680,7 +683,7 @@
<i class="uil uil-print me-2" style="font-size: 1.2rem; vertical-align: middle;"></i>
<strong>{!! t('Yazdır / Print') !!}</strong>
</button>
<button type="button" class="btn btn-primary rounded-pill px-4 shadow-sm" onclick="window.print()">
<button type="button" class="btn btn-primary rounded-pill px-4 shadow-sm text-white" style="background-color: #e31e24 !important; border-color: #e31e24 !important; color: #ffffff !important;" onclick="downloadPDF(this)">
<i class="uil uil-file-download-alt me-2" style="font-size: 1.2rem; vertical-align: middle;"></i>
<strong>{!! t('PDF İndir / Download PDF') !!}</strong>
</button>
@@ -781,6 +784,46 @@ document.querySelectorAll('.btn-copy-inline').forEach(function (btn) {
}
});
});
function downloadPDF(btn) {
var originalHTML = btn.innerHTML;
btn.disabled = true;
btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true" style="width: 1rem; height: 1rem; vertical-align: middle;"></span> <strong>' + (document.documentElement.lang === 'tr' ? 'Lütfen bekleyin...' : 'Please wait...') + '</strong>';
function run() {
var element = document.getElementById('letterheadPrintArea');
var opt = {
margin: 0,
filename: 'truncgil-bank-accounts.pdf',
image: { type: 'jpeg', quality: 0.98 },
html2canvas: { scale: 2, useCORS: true, letterRendering: true, scrollY: 0 },
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
};
html2pdf().set(opt).from(element).save().then(function() {
btn.disabled = false;
btn.innerHTML = originalHTML;
}).catch(function(err) {
console.error(err);
btn.disabled = false;
btn.innerHTML = originalHTML;
});
}
if (typeof html2pdf === 'undefined') {
var script = document.createElement('script');
script.src = 'https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js';
script.onload = run;
script.onerror = function() {
alert('PDF library could not be loaded. Please try again.');
btn.disabled = false;
btn.innerHTML = originalHTML;
};
document.head.appendChild(script);
} else {
run();
}
}
</script>
@endpush