${req.product}
${formatCurrency(req.amount)} |
|
|
`;
requestsTableBody.innerHTML += row;
});
};
const addRequest = (e) => {
e.preventDefault();
const newRequest = {
id: nextRequestId++,
customer: e.target.elements['customer-id'].value,
product: e.target.elements['product-name'].value,
amount: parseFloat(e.target.elements['refund-amount'].value),
reason: e.target.elements['refund-reason'].value,
status: 'Pending'
};
state.requests.unshift(newRequest);
e.target.reset();
renderAll();
};
const removeRequest = (id) => {
state.requests = state.requests.filter(r => r.id !== id);
renderAll();
};
window.removeRequest = removeRequest;
const updateStatus = (id, newStatus) => {
const request = state.requests.find(r => r.id === id);
if(request) request.status = newStatus;
renderAll();
};
window.updateStatus = updateStatus;
const handleDownloadPdf = () => {
const pdfContentEl = document.getElementById('pdf-content');
if (!pdfContentEl) return;
// Populate PDF
document.getElementById('pdf-timestamp').textContent = new Date().toLocaleString('en-US');
document.getElementById('pdf-summary-grid').innerHTML = `
Total Refunded:
${summaryAmountEl.textContent}
Pending:
${summaryPendingEl.textContent}
Approved:
${summaryApprovedEl.textContent}
Total Requests:
${summaryTotalEl.textContent}
`;
let tableHTML = `
| Customer |
Product |
Reason |
Amount |
Status |
`;
state.requests.forEach(req => {
tableHTML += `
| ${req.customer} |
${req.product} |
${req.reason} |
${formatCurrency(req.amount)} |
${req.status} |
`;
});
tableHTML += '
';
document.getElementById('pdf-table-container').innerHTML = tableHTML;
pdfContentEl.classList.remove('hidden');
html2canvas(pdfContentEl, { scale: 2 }).then(canvas => {
pdfContentEl.classList.add('hidden');
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF({ orientation: 'portrait', unit: 'pt', format: 'a4' });
const pdfWidth = pdf.internal.pageSize.getWidth();
const margin = 40;
const imgWidth = pdfWidth - (margin * 2);
const imgHeight = (canvas.height * imgWidth) / canvas.width;
pdf.addImage(imgData, 'PNG', margin, margin, imgWidth, imgHeight);
pdf.save('refund-processing-report.pdf');
}).catch(err => { console.error("Error generating PDF:", err); pdfContentEl.classList.add('hidden'); });
};
const formatCurrency = (val) => new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(val);
// --- Event Listeners & Initial Load ---
addRequestForm.addEventListener('submit', addRequest);
pdfBtn.addEventListener('click', handleDownloadPdf);
// Sample Data
const sampleData = [
{ customer: 'Markus Allen', product: 'Leather Wallet', amount: 59.99, reason: 'Changed mind', status: 'Rejected' },
{ customer: 'Jessica Tam', product: 'Smart Watch X1', amount: 249.50, reason: 'Item defective', status: 'Processed' },
{ customer: 'David Chen', product: 'Running Shoes', amount: 120.00, reason: 'Wrong item sent', status: 'Approved' },
{ customer: 'Emily Rodriguez', product: 'Winter Coat', amount: 199.99, reason: 'Item defective', status: 'Pending' },
];
sampleData.forEach(r => state.requests.push({ id: nextRequestId++, ...r }));
renderAll();
});