Aggiunge grafico andamento visite in admin Analytics.

Serie giornaliera di pageview/click/movimenti nel periodo filtrato, sopra la tabella pagine. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-08 21:52:29 +02:00
parent bb342ead79
commit 2e67e590d6
11 changed files with 171 additions and 1 deletions
@@ -0,0 +1,81 @@
+(function () {
+  var trend = window.adminAnalyticsTrend || [];
+  var i18n = window.adminAnalyticsI18n || {};
+  var canvas = document.getElementById("chart-analytics-trend");
+  if (!canvas || !trend.length || typeof Chart === "undefined") return;
+
+  function dayLabel(dayStr) {
+    var parts = dayStr.split("-");
+    if (parts.length < 3) return dayStr;
+    var d = new Date(parseInt(parts[0], 10), parseInt(parts[1], 10) - 1, parseInt(parts[2], 10));
+    return d.toLocaleDateString([], { day: "2-digit", month: "short" });
+  }
+
+  var labels = trend.map(function (row) {
+    return dayLabel(row.day);
+  });
+
+  new Chart(canvas, {
+    type: "line",
+    data: {
+      labels: labels,
+      datasets: [
+        {
+          label: i18n.pageviews || "Pageviews",
+          data: trend.map(function (r) { return r.pageviews || 0; }),
+          borderColor: "rgba(229, 57, 53, 0.95)",
+          backgroundColor: "rgba(229, 57, 53, 0.18)",
+          fill: true,
+          tension: 0.25,
+          pointRadius: 3,
+          pointHoverRadius: 5
+        },
+        {
+          label: i18n.clicks || "Clicks",
+          data: trend.map(function (r) { return r.clicks || 0; }),
+          borderColor: "rgba(66, 165, 245, 0.95)",
+          backgroundColor: "transparent",
+          fill: false,
+          tension: 0.25,
+          pointRadius: 2,
+          pointHoverRadius: 4
+        },
+        {
+          label: i18n.moves || "Moves",
+          data: trend.map(function (r) { return r.moves || 0; }),
+          borderColor: "rgba(255, 193, 7, 0.85)",
+          backgroundColor: "transparent",
+          fill: false,
+          tension: 0.25,
+          pointRadius: 2,
+          pointHoverRadius: 4,
+          borderDash: [4, 3]
+        }
+      ]
+    },
+    options: {
+      responsive: true,
+      maintainAspectRatio: false,
+      interaction: { mode: "index", intersect: false },
+      animation: { duration: 280 },
+      scales: {
+        x: {
+          ticks: { maxTicksLimit: 14, color: "#9a9aad", font: { size: 10 } },
+          grid: { color: "rgba(255,255,255,0.06)" }
+        },
+        y: {
+          beginAtZero: true,
+          ticks: {
+            color: "#9a9aad",
+            font: { size: 10 },
+            precision: 0
+          },
+          grid: { color: "rgba(255,255,255,0.06)" }
+        }
+      },
+      plugins: {
+        legend: { labels: { color: "#ccc", boxWidth: 12 } }
+      }
+    }
+  });
+})();
@@ -173,6 +173,15 @@ body.admin-body {
  height: 200px;
 }

+.chart-wrap--analytics {
+  height: 260px;
+  margin-top: 0.75rem;
+}
+
+.admin-analytics-trend__kpi {
+  margin: 0.75rem 0 0;
+}
+
 .admin-panels {
  display: grid;
  grid-template-columns: 1.4fr 1fr;