Expense Breakdown
${breakdownHtml}
`;
downloadBtn.classList.remove('hidden');
const ctx = document.getElementById('refundChart')?.getContext('2d');
if (ctx) {
if (refundChart) refundChart.destroy();
refundChart = new Chart(ctx, {
type: 'doughnut',
data: {
labels: ['Transportation', 'Lodging', 'Meals', 'Miscellaneous'],
datasets: [{
data: Object.values(totals),
backgroundColor: ['#0284c7', '#059669', '#f59e0b', '#6b7280'],
borderColor: '#ffffff',
borderWidth: 3
}]
},
options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' } } }
});
}
}
function downloadPDF() {
const { jsPDF } = window.jspdf;
const pdf = new jsPDF({ orientation: 'p', unit: 'mm', format: 'a4' });
const contentToPrint = document.getElementById('dashboard-content');
if (!contentToPrint) return;
html2canvas(contentToPrint, { scale: 2, useCORS: true, onclone: (doc) => {
const chartCanvas = doc.getElementById('refundChart');
if (chartCanvas && refundChart) {
const img = new Image();
img.src = refundChart.toBase64Image();
img.style.maxWidth = '100%';
img.style.height = 'auto';
chartCanvas.parentNode.replaceChild(img, chartCanvas);
}
}}).then(canvas => {
const imgData = canvas.toDataURL('image/png');
const pdfWidth = pdf.internal.pageSize.getWidth();
const pdfHeight = (canvas.height * pdfWidth) / canvas.width;
pdf.addImage(imgData, 'PNG', 10, 10, pdfWidth - 20, pdfHeight > 277 ? 277 : pdfHeight - 20);
pdf.save('Travel-Expense-Report.pdf');
});
}