add PDF preview

mccs-it/thermal/public/index.html

@@ -71,9 +71,55 @@
         </button>
     </div>
 
+    <div id="pdfContainer" class="max-w-lg mx-auto mt-10 bg-white p-8 rounded-lg shadow-lg text-center">
+        <h1 class="text-2xl font-bold mb-4" style="color: #1F3C70;">Last Generated PDF</h1>
+        
+        <!-- Refresh Button -->
+        <button id="refreshPdf" 
+                class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded mb-4">
+            Refresh PDF
+        </button>
+    
+        <!-- PDF Viewer -->
+        <div id="pdfViewer" class="border border-gray-300 p-4 rounded-md">
+            <!-- PDF content will be loaded here -->
+        </div>
+    </div>
+
     
 
     <script>
+        function loadPDF() {
+            fetch('./output.pdf')
+                .then(response => {
+                    const pdfViewer = document.getElementById('pdfViewer');
+                    pdfViewer.innerHTML = '';  // Clear any previous content
+    
+                    if (response.ok) {
+                        // If the PDF exists, reload the iframe
+                        const iframe = document.createElement('iframe');
+                        iframe.src = './output.pdf?' + new Date().getTime(); // Add timestamp to avoid caching
+                        iframe.width = '100%';
+                        iframe.height = '500px'; // Set the height as needed
+                        iframe.classList.add('rounded-md');
+                        pdfViewer.appendChild(iframe);
+                    } else {
+                        // If the PDF does not exist, display a message
+                        pdfViewer.textContent = 'No PDF available';
+                    }
+                })
+                .catch(() => {
+                    // Handle errors, such as network issues
+                    document.getElementById('pdfViewer').textContent = 'Error loading PDF';
+                });
+        }
+    
+        // Load the PDF when the page loads
+        window.onload = loadPDF;
+    
+        // Add event listener for the "Refresh PDF" button
+        document.getElementById('refreshPdf').addEventListener('click', loadPDF);
+
         document.getElementById('print-mcc').addEventListener('click', (event) => {
             // Send a POST request with the form data to the server
             fetch('/print-mcc', {