diff --git a/src/components/com_tjcertificate/media/css/tjCertificate.css b/src/components/com_tjcertificate/media/css/tjCertificate.css index 404f145e..88fa8403 100644 --- a/src/components/com_tjcertificate/media/css/tjCertificate.css +++ b/src/components/com_tjcertificate/media/css/tjCertificate.css @@ -214,4 +214,51 @@ } .border-btn{ border:1px solid #b3b3b3; +} +#certificateModalContainer{ + background: #fff; + width: 80%; /* Increased width */ + max-width: 1300px; /* Max width limit */ + margin: 50px auto; + padding: 20px; + border-radius: 10px; + position: relative; + max-height: 80vh; /* Max height of modal */ + overflow-y: auto; /* Scroll content if it overflows */ +} +#closeModalBtn{ + position: absolute; + top: 10px; + right: 10px; + font-size: 18px; + background: none; + border: none; + outline: none; + cursor: pointer; + color: #000; +} +#certificateModalOverlay{ + + display: none; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0,0,0,0.5); + z-index: 1000; + overflow-y: auto; +} +#ziploader { + position: fixed; + top: 0; left: 0; right: 0; bottom: 0; + background: rgba(255,255,255,0.8); + z-index: 9999; + display: flex; + align-items: center; + justify-content: center; +} +.zipspinner { + font-size: 18px; + font-weight: bold; } \ No newline at end of file diff --git a/src/components/com_tjcertificate/media/js/certificate.js b/src/components/com_tjcertificate/media/js/certificate.js index f6e17ef7..743c8019 100644 --- a/src/components/com_tjcertificate/media/js/certificate.js +++ b/src/components/com_tjcertificate/media/js/certificate.js @@ -239,3 +239,144 @@ var certificate = { }); } }; + + +jQuery(document).ready(function ($) { + const config = Joomla.getOptions('tjcertificate.bulkDownload'); + + $('#bulkCertBtn').on('click', function (e) { + e.preventDefault(); + + $('#ziploader').fadeIn(); + + $.ajax({ + url: Joomla.getOptions('system.paths').base + '/index.php?option=com_tjcertificate&task=certificates.fetchCertificatesForBulkDownload', + type: 'POST', + dataType: 'json', + data: { + user_id: config.user_id, + client: config.client, + state: config.state, + [config.token]: 1 + }, + success: function (response) { + if (response.success && response.data.length > 0) { + let html = '