anaylitics dashboard

2025-07-30 09:04:21 -06:00
parent 2312d87b2d
commit 9689767d6c
9 changed files with 393 additions and 0 deletions
--- a/map/app/public/js/dashboard.js
+++ b/map/app/public/js/dashboard.js
@@ -0,0 +1,150 @@
+// Dashboard functionality
+let supportChart = null;
+let entriesChart = null;
+
+// Load dashboard data
+async function loadDashboardData() {
+    try {
+        const response = await fetch('/api/admin/dashboard/stats');
+        const result = await response.json();
+        
+        if (result.success) {
+            updateDashboardCards(result.data);
+            createSupportLevelChart(result.data.supportLevels);
+            createEntriesChart(result.data.dailyEntries);
+        } else {
+            showStatus('Failed to load dashboard data', 'error');
+        }
+    } catch (error) {
+        console.error('Dashboard loading error:', error);
+        showStatus('Error loading dashboard', 'error');
+    }
+}
+
+// Update summary cards
+function updateDashboardCards(data) {
+    document.getElementById('total-locations').textContent = data.totalLocations.toLocaleString();
+    document.getElementById('overall-score').textContent = data.overallScore;
+    document.getElementById('sign-requests').textContent = data.signRequests.toLocaleString();
+    document.getElementById('total-users').textContent = data.totalUsers.toLocaleString();
+}
+
+// Create support level distribution chart
+function createSupportLevelChart(supportLevels) {
+    const ctx = document.getElementById('support-chart');
+    if (!ctx) return;
+    
+    if (supportChart) {
+        supportChart.destroy();
+    }
+    
+    supportChart = new Chart(ctx, {
+        type: 'doughnut',
+        data: {
+            labels: ['Strong Support (1)', 'Support (2)', 'Neutral (3)', 'Opposed (4)'],
+            datasets: [{
+                data: [
+                    supportLevels['1'] || 0,
+                    supportLevels['2'] || 0,
+                    supportLevels['3'] || 0,
+                    supportLevels['4'] || 0
+                ],
+                backgroundColor: [
+                    '#4CAF50',
+                    '#FFC107',
+                    '#FF9800',
+                    '#F44336'
+                ]
+            }]
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            plugins: {
+                legend: {
+                    position: 'bottom'
+                }
+            }
+        }
+    });
+}
+
+// Create daily entries chart
+function createEntriesChart(dailyEntries) {
+    const ctx = document.getElementById('entries-chart');
+    if (!ctx) return;
+    
+    if (entriesChart) {
+        entriesChart.destroy();
+    }
+    
+    // Generate last 30 days
+    const labels = [];
+    const data = [];
+    const today = new Date();
+    
+    for (let i = 29; i >= 0; i--) {
+        const date = new Date(today);
+        date.setDate(date.getDate() - i);
+        const dateKey = date.toISOString().split('T')[0];
+        labels.push(date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' }));
+        data.push(dailyEntries[dateKey] || 0);
+    }
+    
+    entriesChart = new Chart(ctx, {
+        type: 'line',
+        data: {
+            labels: labels,
+            datasets: [{
+                label: 'New Entries',
+                data: data,
+                borderColor: 'rgb(75, 192, 192)',
+                backgroundColor: 'rgba(75, 192, 192, 0.2)',
+                tension: 0.1
+            }]
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            scales: {
+                y: {
+                    beginAtZero: true,
+                    ticks: {
+                        stepSize: 1
+                    }
+                }
+            }
+        }
+    });
+}
+
+// Add event listener for dashboard navigation
+document.addEventListener('DOMContentLoaded', () => {
+    // Update navigation to load dashboard when clicked
+    const dashboardLink = document.querySelector('.admin-nav a[href="#dashboard"]');
+    if (dashboardLink) {
+        dashboardLink.addEventListener('click', (e) => {
+            e.preventDefault();
+            
+            // Hide all sections
+            document.querySelectorAll('.admin-section').forEach(section => {
+                section.style.display = 'none';
+            });
+            
+            // Show dashboard
+            const dashboardSection = document.getElementById('dashboard');
+            if (dashboardSection) {
+                dashboardSection.style.display = 'block';
+            }
+            
+            // Update active nav
+            document.querySelectorAll('.admin-nav a').forEach(link => {
+                link.classList.remove('active');
+            });
+            dashboardLink.classList.add('active');
+            
+            // Load dashboard data
+            loadDashboardData();
+        });
+    }
+});