No financial goals defined yet.

'; } else { roadmapData.goals.sort((a,b) => { // Sort by priority then target date const priorities = {"High":1, "Medium":2, "Low":3}; if(priorities[a.priority] !== priorities[b.priority]) return priorities[a.priority] - priorities[b.priority]; return new Date(a.targetDate) - new Date(b.targetDate); }); roadmapData.goals.forEach(g => { const progress = g.targetAmount > 0 ? (g.currentAmount / g.targetAmount) * 100 : 0; const clampedProgress = Math.min(100, Math.max(0, progress)); const remaining = g.targetAmount - g.currentAmount; const today = new Date().toISOString().split('T')[0]; const monthsToTarget = getMonthsDifference(today, g.targetDate); const reqMonthlySaving = monthsToTarget > 0 ? remaining / monthsToTarget : (remaining > 0 ? Infinity : 0); const goalCard = document.createElement('div'); goalCard.classList.add('pwrt-goal-card'); goalCard.innerHTML = `

${g.name} (${g.priority} Priority)

Target: ${formatC(g.targetAmount)} by ${formatDate(g.targetDate)}

Saved: ${formatC(g.currentAmount)} (${clampedProgress.toFixed(1)}%)

Remaining: ${formatC(Math.max(0,remaining))}

Required Monthly: ${reqMonthlySaving === Infinity ? "Past Due" : (reqMonthlySaving > 0 ? formatC(reqMonthlySaving) : "Achieved")}

`; goalsProgressDiv.appendChild(goalCard); }); } } // Actions Overview if(actionsOverviewDiv){ actionsOverviewDiv.innerHTML = ''; if (roadmapData.actions.length === 0) { actionsOverviewDiv.innerHTML = '

No action steps defined yet.

'; } else { const sortedActions = [...roadmapData.actions].sort((a,b) => { const statusOrder = {"To Do":1, "In Progress":2, "Completed":3}; if(statusOrder[a.status] !== statusOrder[b.status]) return statusOrder[a.status] - statusOrder[b.status]; return (new Date(a.targetDate) || Infinity) - (new Date(b.targetDate) || Infinity); }); sortedActions.forEach(a => { const actionCard = document.createElement('div'); actionCard.classList.add('pwrt-action-card', `status-${a.status.replace(/\s+/g, '')}`); actionCard.innerHTML = `

${a.description}

Category: ${a.category}

Target Date: ${a.targetDate ? formatDate(a.targetDate) : 'N/A'}

Status: ${a.status}

${a.notes ? `

Notes: ${a.notes}

` : ''} `; actionsOverviewDiv.appendChild(actionCard); }); } } } // --- PDF Download --- const pdfBtnEl = document.getElementById('pwrt-download-pdf-btn'); if(pdfBtnEl){ pdfBtnEl.addEventListener('click', () => { if (!roadmapData.snapshot && roadmapData.goals.length === 0 && roadmapData.actions.length === 0) { alert("No data to download."); return; } const { jsPDF } = window.jspdf; const doc = new jsPDF(); let y = 15; const pageMargin = 14; const pageWidth = doc.internal.pageSize.getWidth(); const addPageIfNeeded = () => { if (y > 270) { doc.addPage(); y = 20; } }; const primaryColor = getComputedStyle(document.documentElement).getPropertyValue('--primary-color').trim(); const textColor = getComputedStyle(document.documentElement).getPropertyValue('--text-color').trim(); doc.setFontSize(18); doc.setTextColor(primaryColor); doc.text("Personal Wealth Building Roadmap", pageWidth / 2, y, { align: 'center' }); y += 8; doc.setFontSize(10); doc.setTextColor(textColor); doc.text(`Report Date: ${new Date().toLocaleDateString()}`, pageWidth / 2, y, { align: 'center' }); y += 10; // Snapshot if (roadmapData.snapshot) { doc.setFontSize(14); doc.setTextColor(primaryColor); doc.text("Financial Snapshot", pageMargin, y); y += 7; doc.setFontSize(10); doc.setTextColor(textColor); const snap = roadmapData.snapshot; const surplus = (snap.income || 0) - (snap.expenses || 0); const snapshotData = [ ["Monthly Income (After Tax):", formatC(snap.income || 0)], ["Total Monthly Expenses:", formatC(snap.expenses || 0)], ["Monthly Surplus/Deficit:", formatC(surplus)], ["Current Liquid Savings/Investments:", formatC(snap.currentSavings || 0)] ]; doc.autoTable({ startY: y, body: snapshotData, theme: 'plain', styles:{fontSize:10, cellPadding:1.5}, columnStyles: {0:{fontStyle:'bold'}}}); y = doc.lastAutoTable.finalY + 10; } addPageIfNeeded(); // Goals if (roadmapData.goals.length > 0) { doc.setFontSize(14); doc.setTextColor(primaryColor); doc.text("Financial Goals", pageMargin, y); y += 7; const goalHead = [['Goal', 'Target', 'Current', 'Remaining', 'Target Date', 'Req. Monthly', 'Priority']]; const goalBody = roadmapData.goals.map(g => { const remaining = g.targetAmount - g.currentAmount; const today = new Date().toISOString().split('T')[0]; const monthsToTarget = getMonthsDifference(today, g.targetDate); const reqMonthlySaving = monthsToTarget > 0 ? remaining / monthsToTarget : (remaining > 0 ? Infinity : 0); return [ g.name, formatC(g.targetAmount), formatC(g.currentAmount), formatC(Math.max(0, remaining)), formatDate(g.targetDate), reqMonthlySaving === Infinity ? "Past Due" : (reqMonthlySaving > 0 ? formatC(reqMonthlySaving) : "Achieved"), g.priority ]; }); doc.autoTable({ startY: y, head: goalHead, body: goalBody, theme: 'grid', headStyles:{fillColor: primaryColor, textColor:'#fff'}, styles:{fontSize:9, cellPadding:1.5} }); y = doc.lastAutoTable.finalY + 10; } addPageIfNeeded(); // Actions if (roadmapData.actions.length > 0) { doc.setFontSize(14); doc.setTextColor(primaryColor); doc.text("Action Plan", pageMargin, y); y += 7; const actionHead = [['Action', 'Category', 'Target Date', 'Status', 'Notes']]; const actionBody = roadmapData.actions.map(a => [ a.description, a.category, a.targetDate ? formatDate(a.targetDate) : 'N/A', a.status, a.notes || '-' ]); doc.autoTable({ startY: y, head: actionHead, body: actionBody, theme: 'grid', headStyles:{fillColor: primaryColor, textColor:'#fff'}, styles:{fontSize:9, cellPadding:1.5} }); y = doc.lastAutoTable.finalY + 10; } doc.save(`Personal_Wealth_Roadmap_${new Date().toISOString().split('T')[0]}.pdf`); }); } // --- Initial Load & Display --- loadData(); updateTabDisplay(); // Initial call } catch (e) { console.error("Error initializing Personal Wealth Roadmap Tool:", e); const mainDiv = document.getElementById('personalWealthRoadmapTool'); if (mainDiv) mainDiv.innerHTML = "

An error occurred loading the tool. Please check the browser console for more details.

"; } });