57 lines
2.8 KiB
JavaScript
57 lines
2.8 KiB
JavaScript
// Add modal section to the end of the template, before closing </template>
|
|
const modalHTML = `
|
|
<!-- PDF Download Modal -->
|
|
<template if:true={showDownloadModal}>
|
|
<div class="pdf-download-modal-overlay" onclick={closeDownloadModal}>
|
|
<div class="pdf-download-modal" onclick={stopPropagation}>
|
|
<div class="modal-header">
|
|
<h2>🎉 PDF Ready for Download!</h2>
|
|
<button class="close-btn" onclick={closeDownloadModal}>×</button>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
<div class="download-info">
|
|
<h3>📄 Download Information</h3>
|
|
|
|
<div class="file-details">
|
|
<div class="file-detail">
|
|
<div class="label">File Name</div>
|
|
<div class="value">{downloadInfo.filename}</div>
|
|
</div>
|
|
<div class="file-detail">
|
|
<div class="label">File Size</div>
|
|
<div class="value">{downloadInfo.fileSize}</div>
|
|
</div>
|
|
<div class="file-detail">
|
|
<div class="label">Generated</div>
|
|
<div class="value">{downloadInfo.generatedAt}</div>
|
|
</div>
|
|
<div class="file-detail">
|
|
<div class="label">Expires</div>
|
|
<div class="value">{downloadInfo.expiresAt}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="download-link-section">
|
|
<label>🔗 Download Link:</label>
|
|
<div class="download-link">{downloadInfo.downloadUrl}</div>
|
|
<button class="copy-btn" onclick={copyDownloadLink}>📋 Copy Link</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-actions">
|
|
<a href={downloadInfo.downloadUrl} target="_blank" class="download-btn">
|
|
📥 Download PDF
|
|
</a>
|
|
<button class="open-tab-btn" onclick={openInNewTab}>
|
|
🔗 Open in New Tab
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
`;
|
|
|
|
console.log("Modal HTML to add:", modalHTML);
|