Customer Feedback Analysis Dashboard

Customer Feedback Analysis Dashboard

Overall Feedback Summary

Total Feedback Records

0

Average Rating

0

Positive Feedback

0

Negative Feedback

0

Feedback Type Distribution

Sentiment Distribution

Rating Distribution

Detailed Feedback Records

ID Customer Name Date Rating Type Sentiment Comment

${positiveFeedbackCountElem.textContent}

Negative Feedback

${negativeFeedbackCountElem.textContent}

`; pdfContentWrapper.appendChild(summarySection); // Add distribution charts const chartsSection = document.createElement('div'); chartsSection.classList.add('grid', 'grid-cols-2', 'gap-6', 'mb-6'); chartsSection.innerHTML = `

Feedback Type Distribution

Sentiment Distribution

Rating Distribution

`; pdfContentWrapper.appendChild(chartsSection); // Populate PDF charts (re-use logic but target PDF elements) const totalRecords = feedbackRecords.length; const feedbackTypeCounts = feedbackRecords.reduce((acc, record) => { acc[record.feedbackType] = (acc[record.feedbackType] || 0) + 1; return acc; }, {}); renderBarChart(chartsSection.querySelector('#pdfFeedbackTypeChart'), feedbackTypeCounts, 'general'); const sentimentCounts = feedbackRecords.reduce((acc, record) => { acc[record.sentiment] = (acc[record.sentiment] || 0) + 1; return acc; }, {}); renderBarChart(chartsSection.querySelector('#pdfSentimentDistributionChart'), sentimentCounts, 'sentiment'); const ratingCounts = {}; for (let i = 1; i <= 5; i++) { ratingCounts[i + ' Stars'] = 0; } feedbackRecords.forEach(record => { ratingCounts[record.rating + ' Stars']++; }); renderBarChart(chartsSection.querySelector('#pdfRatingDistributionChart'), ratingCounts, 'general'); // Add detailed feedback list table const feedbackListSection = document.createElement('div'); feedbackListSection.innerHTML = `

Detailed Feedback Records

${dashboardFeedbackTableBody.innerHTML}
ID Customer Name Date Rating Type Sentiment Comment
`; pdfContentWrapper.appendChild(feedbackListSection); // Options for html2pdf const options = { margin: 10, filename: 'Customer_Feedback_Dashboard.pdf', image: { type: 'jpeg', quality: 0.98 }, html2canvas: { scale: 2, logging: true, dpi: 192, letterRendering: true }, jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }, pagebreak: { mode: ['avoid-all', 'css', 'legacy'] } }; // Generate PDF from the temporary content wrapper html2pdf().from(pdfContentWrapper).set(options).save(); // Clean up the temporary div (optional, as it's not appended to the DOM) pdfContentWrapper.remove(); } /** * Loads initial sample data for the dashboard. * Relevant to USA context. */ function loadSampleData() { feedbackRecords = [ { id: 'FB001', customerName: 'John Doe', feedbackDate: '2024-07-01', rating: 5, feedbackType: 'Product', sentiment: 'Positive', comment: 'Excellent product, very satisfied!' }, { id: 'FB002', customerName: 'Jane Smith', feedbackDate: '2024-07-02', rating: 3, feedbackType: 'Service', sentiment: 'Neutral', comment: 'Service was okay, nothing special.' }, { id: 'FB003', customerName: 'Peter Jones', feedbackDate: '2024-07-03', rating: 2, feedbackType: 'Support', sentiment: 'Negative', comment: 'Long wait times for support, unresolved issue.' }, { id: 'FB004', customerName: 'Alice Brown', feedbackDate: '2024-07-05', rating: 5, feedbackType: 'Website', sentiment: 'Positive', comment: 'Website is very user-friendly and intuitive.' }, { id: 'FB005', customerName: 'Bob White', feedbackDate: '2024-07-06', rating: 4, feedbackType: 'Product', sentiment: 'Positive', comment: 'Good features, minor bug encountered.' }, { id: 'FB006', customerName: 'Charlie Green', feedbackDate: '2024-07-08', rating: 1, feedbackType: 'Service', sentiment: 'Negative', comment: 'Very disappointed with the recent service update.' }, { id: 'FB007', customerName: 'Diana Prince', feedbackDate: '2024-07-09', rating: 3, feedbackType: 'Other', sentiment: 'Neutral', comment: 'General feedback, room for improvement.' } ]; }
Scroll to Top