aa41da8a68
Memperbarui tampilan modal untuk menyertakan tombol download PDF dan menutupi modal ketika tombol Escape ditekan. Penyesuaian elemen dalam modal untuk mengatur tata letak yang lebih baik dan menambah event listener untuk menangani penutupan modal saat klik di luar isi modal.
57 lines
2.1 KiB
PHP
57 lines
2.1 KiB
PHP
<!-- Modal for PDF viewing -->
|
|
<div id="pdfModal" class="fixed inset-0 bg-gray-800 bg-opacity-75 flex items-center justify-center hidden w-full z-50">
|
|
<div class="bg-white rounded-lg overflow-hidden shadow-xl transform transition-all min-w-3xl w-[1500px] h-[1200px]">
|
|
<div class="p-4 h-full flex flex-col">
|
|
<div class="flex justify-between items-center mb-4">
|
|
<button id="downloadPdfBtn" class="btn btn-primary btn-sm">
|
|
<i class="ki-duotone ki-cloud-download me-1"><span class="path1"></span><span class="path2"></span></i>
|
|
Download PDF
|
|
</button>
|
|
<button onclick="closePDFModal()" class="text-2xl">
|
|
<i class="ki-filled ki-cross-square text-red-600"></i>
|
|
</button>
|
|
</div>
|
|
<div id="pdfViewer" class="flex-grow"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@push('scripts')
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfobject/2.3.0/pdfobject.min.js"></script>
|
|
<script>
|
|
let currentPdfUrl = '';
|
|
|
|
function viewPDF(url) {
|
|
currentPdfUrl = url;
|
|
PDFObject.embed(url, "#pdfViewer");
|
|
document.getElementById('pdfModal').classList.remove('hidden');
|
|
document.addEventListener('keydown', handleEscKey);
|
|
}
|
|
|
|
function closePDFModal() {
|
|
document.getElementById('pdfModal').classList.add('hidden');
|
|
document.removeEventListener('keydown', handleEscKey);
|
|
}
|
|
|
|
function handleEscKey(event) {
|
|
if (event.key === 'Escape') {
|
|
closePDFModal();
|
|
}
|
|
}
|
|
|
|
// Close modal when clicking outside the content
|
|
document.getElementById('pdfModal').addEventListener('click', function(event) {
|
|
if (event.target === this) {
|
|
closePDFModal();
|
|
}
|
|
});
|
|
|
|
// Download PDF functionality
|
|
document.getElementById('downloadPdfBtn').addEventListener('click', function() {
|
|
if (currentPdfUrl) {
|
|
window.open(currentPdfUrl, '_blank');
|
|
}
|
|
});
|
|
</script>
|
|
@endpush
|