`; const nonCompliantList = document.getElementById('non-compliant-list'); const nonCompliantItems = state.checklist.filter(i => i.status === 'Non-Compliant'); if (nonCompliantItems.length > 0) { nonCompliantList.innerHTML = nonCompliantItems.map(item => ` `).join(''); } else { nonCompliantList.innerHTML = `

No issues found. Great job!

`; } } // --- NAVIGATION & TAB LOGIC --- function switchTab(tabName) { if (tabName === 'dashboard') { renderDashboard(); // Always refresh dashboard } tabNavigation.querySelectorAll('.tab-button').forEach(btn => btn.classList.toggle('active', btn.dataset.tab === tabName)); tabContents.querySelectorAll('.tab-content').forEach(content => content.classList.toggle('active', content.id === `${tabName}-tab`)); updateNavButtons(); } function navigateTabs(direction) { currentTabIndex = Math.max(0, Math.min(tabs.length - 1, currentTabIndex + direction)); switchTab(tabs[currentTabIndex]); } function updateNavButtons() { prevBtn.style.visibility = currentTabIndex === 0 ? 'hidden' : 'visible'; nextBtn.style.visibility = currentTabIndex === tabs.length - 1 ? 'hidden' : 'visible'; } // --- PDF GENERATION --- function generatePDF() { const { jsPDF } = window.jspdf; const doc = new jsPDF(); const stats = calculateCompliance(); doc.setFontSize(20); doc.setFont("helvetica", "bold"); doc.text("Consumer Credit Compliance Report", 105, 20, { align: 'center' }); doc.setFontSize(12); doc.text(`Project/Product: ${state.projectName || 'N/A'}`, 14, 30); doc.setFontSize(10); doc.text(`Report Generated: ${new Date().toLocaleString('en-US')}`, 105, 26, {align: 'center'}); doc.autoTable({ startY: 35, head: [['Compliance Score', 'Compliant Items', 'Non-Compliant', 'Not Applicable']], body: [[`${stats.score}%`, stats.compliant, stats.nonCompliant, stats.notApplicable]], theme: 'grid', headStyles: { fillColor: [147, 51, 234] }, // Purple-600 }); const grouped = state.checklist.reduce((acc, item) => { (acc[item.regulation] = acc[item.regulation] || []).push(item); return acc; }, {}); let finalY = doc.autoTable.previous.finalY; for (const regKey in grouped) { const items = grouped[regKey]; const body = items.map(item => [item.question, item.status, item.notes || 'N/A']); doc.autoTable({ startY: finalY + 10, head: [[{ content: regulations[regKey], colSpan: 3, styles: { halign: 'center', fillColor: [233, 213, 255] } }]], // Purple-200 body: [['Question', 'Status', 'Notes']], theme: 'grid', headStyles: { fillColor: [92, 35, 148] }, // Darker Purple for sub-headers }); doc.autoTable({ startY: doc.autoTable.previous.finalY, body: body, theme: 'striped', columnStyles: { 0: { cellWidth: 80 }, 2: { cellWidth: 'auto' } } }); finalY = doc.autoTable.previous.finalY; } doc.save('Consumer_Credit_Compliance_Report.pdf'); } // --- START THE APP --- init(); });