| Region | Product | Revenue | Target | Achievement | Actions |
|---|
Total Revenue: $${data.revenue.toLocaleString()}
Sales Target: $${data.target.toLocaleString()}
Target Achievement: ${data.achievement.toFixed(1)}%
Top Products:
`;
};
pRegApp.renderComparisonChart = function(aggregatedData) {
const id = 'p-reg-comparison-chart'; const ctx = document.getElementById(id); if (!ctx) return;
const labels = Object.keys(aggregatedData);
const revenueData = labels.map(l => aggregatedData[l].revenue);
const targetData = labels.map(l => aggregatedData[l].target);
if (this.charts[id]) this.charts[id].destroy();
this.charts[id] = new Chart(ctx, { type: 'bar', data: { labels, datasets: [ { label: 'Revenue', data: revenueData, backgroundColor: '#007bff' }, { label: 'Target', data: targetData, backgroundColor: '#ced4da' } ] },
options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' }, title: { display: true, text: 'Revenue vs. Target by Region' } }, scales: { y: { beginAtZero: true } } } });
};
pRegApp.renderConfigTable = function() {
const tbody = document.getElementById('p-reg-data-list'); tbody.innerHTML = '';
this.salesData.forEach(d => {
const achievement = d.target > 0 ? ((d.revenue/d.target)*100).toFixed(1) + '%' : 'N/A';
const row = tbody.insertRow(); row.dataset.id = d.id;
row.innerHTML = `
${d.region} | ${d.product} | $${d.revenue.toLocaleString()} | $${d.target.toLocaleString()} | ${achievement} |
| `;
});
};
pRegApp.openTab = function(tabName) { this.currentTab = tabName; document.querySelectorAll('.p-reg-tab-content').forEach(c => c.classList.remove('active')); document.querySelectorAll('.p-reg-tab-button').forEach(b => b.classList.remove('active')); document.getElementById(`p-reg-${tabName}`).classList.add('active'); document.querySelector(`.p-reg-tab-button[data-tab='${tabName}']`).classList.add('active'); this.updateNavButtons(); };
pRegApp.navigateTabs = function(direction) { const tabs = ['Dashboard', 'Config']; const nextIndex = tabs.indexOf(this.currentTab) + direction; if (nextIndex >= 0 && nextIndex < tabs.length) this.openTab(tabs[nextIndex]); };
pRegApp.updateNavButtons = function() { const prevBtn = document.getElementById('p-reg-prevBtn'); const nextBtn = document.getElementById('p-reg-nextBtn'); prevBtn.style.visibility = (this.currentTab === 'Dashboard') ? 'hidden' : 'visible'; nextBtn.style.visibility = (this.currentTab === 'Config') ? 'hidden' : 'visible'; };
pRegApp.generatePDF = function() { html2pdf().from(document.getElementById('p-reg-tool-content-for-pdf')).set({ margin: 0.5, filename: 'Regional_Sales_Dashboard.pdf', image: { type: 'jpeg', quality: 0.98 }, html2canvas: { scale: 2, useCORS: true }, jsPDF: { unit: 'in', format: 'letter', orientation: 'landscape' } }).save(); };
pRegApp.init();
});
