Dashboard for meta pages ai agents

pxy_dashboard/apps/views.py

@@ -10,6 +10,8 @@ from django.utils import timezone
 from datetime import timedelta
 import json
 from pxy_whatsapp.models import Message, WhatsAppBot
+from datetime import timedelta
+from django.db.models import Count
 
 logger = logging.getLogger(__name__)
 
@@ -407,3 +409,63 @@ def apps_telegram_bot(request):
         'bots_info': bots_info,
         'weekly_data_json': json.dumps(weekly_data),
     })
+
+
+
+
+from pxy_meta_pages.models import FacebookPageAssistant, FacebookEvent
+
+@login_required
+def apps_facebook_pages_bot(request):
+    """
+    Dashboard de Facebook Pages Bots:
+      - KPIs de páginas y eventos (comentarios/compartidos).
+      - Tabla de bots configurados.
+      - Scatter semanal de eventos por página.
+    """
+    # — KPIs básicos —
+    total_pages    = FacebookPageAssistant.objects.count()
+    total_events   = FacebookEvent.objects.count()
+    total_comments = FacebookEvent.objects.filter(event_type__code="comment").count()
+    total_shares   = FacebookEvent.objects.filter(event_type__code="share").count()
+
+    stats = {
+        "total_pages": total_pages,
+        "total_events": total_events,
+        "comments": total_comments,
+        "shares": total_shares,
+    }
+
+    # — Información de cada bot —
+    bots_info = []
+    for bot in FacebookPageAssistant.objects.all():
+        bots_info.append({
+            "page_name":        bot.page_name,
+            "page_id":          bot.page_id,
+            "assistant":        bot.assistant.name,
+            "is_subscribed":    bot.is_subscribed,
+            "created_at":       bot.created_at.strftime("%Y-%m-%d"),
+        })
+
+    # — Datos semanales: contar eventos por día y por página —
+    today = timezone.now().date()
+    start_date = today - timedelta(days=6)
+    weekly_data = {}
+    for bot in FacebookPageAssistant.objects.all():
+        series = []
+        for i in range(7):
+            day = start_date + timedelta(days=i)
+            cnt = FacebookEvent.objects.filter(
+                page=bot,
+                timestamp__date=day
+            ).count()
+            series.append({"x": day.strftime("%Y-%m-%d"), "y": cnt})
+        weekly_data[bot.page_name] = series
+
+    return render(request,
+                  "pxy_dashboard/apps/apps-facebook-pages-bot.html",
+                  {
+                    "stats": stats,
+                    "bots_info": bots_info,
+                    "weekly_data_json": json.dumps(weekly_data),
+                  })

pxy_dashboard/templates/pxy_dashboard/apps/apps-facebook-pages-bot.html

@@ -1,5 +1,113 @@
 {% extends "pxy_dashboard/partials/base.html" %}
+{% load static %}
+
 {% block content %}
-<h2>Facebook Pages Bot</h2>
+  {% include "pxy_dashboard/partials/dashboard/kpi_row.html" %}
-<p>This is a placeholder page for <code>apps-facebook-pages-bot.html</code></p>
+
+  <!-- KPIs -->
+  <div class="row mb-4">
+    <div class="col">
+      <div class="card text-center">
+        <div class="card-body">
+          <h3>{{ stats.total_pages|default:"–" }}</h3>
+          <p>Páginas registradas</p>
+        </div>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card text-center">
+        <div class="card-body">
+          <h3>{{ stats.total_events|default:"–" }}</h3>
+          <p>Eventos totales</p>
+        </div>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card text-center">
+        <div class="card-body">
+          <h3>{{ stats.comments|default:"–" }}</h3>
+          <p>Comentarios</p>
+        </div>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card text-center">
+        <div class="card-body">
+          <h3>{{ stats.shares|default:"–" }}</h3>
+          <p>Compartidos</p>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Tabla de bots de Facebook Pages -->
+  <div class="card mb-4">
+    <div class="card-header"><h5>Bots de Facebook Pages</h5></div>
+    <div class="card-body">
+      <div class="table-responsive">
+        <table class="table table-hover mb-0">
+          <thead class="table-light">
+            <tr>
+              <th>Página</th>
+              <th>ID de Página</th>
+              <th>Asistente AI</th>
+              <th>Suscrito</th>
+              <th>Creado</th>
+            </tr>
+          </thead>
+          <tbody>
+            {% for bot in bots_info %}
+              <tr>
+                <td>{{ bot.page_name }}</td>
+                <td>{{ bot.page_id }}</td>
+                <td>{{ bot.assistant }}</td>
+                <td>
+                  {% if bot.is_subscribed %}
+                    <span class="badge bg-success">Sí</span>
+                  {% else %}
+                    <span class="badge bg-secondary">No</span>
+                  {% endif %}
+                </td>
+                <td>{{ bot.created_at }}</td>
+              </tr>
+            {% empty %}
+              <tr>
+                <td colspan="5" class="text-center text-muted">
+                  No hay bots configurados
+                </td>
+              </tr>
+            {% endfor %}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+
+  <!-- Scatter semanal de eventos por página -->
+  <div class="card mb-4">
+    <div class="card-header"><h5>Eventos Semanales por Página</h5></div>
+    <div class="card-body">
+      <div id="chart-facebook-weekly" class="apex-charts"
+           data-colors="#727cf5,#0acf97,#fa5c7c"></div>
+    </div>
+  </div>
+{% endblock %}
+
+{% block extra_js %}
+  <script src="{% static 'dashboard/vendor/apexcharts/apexcharts.min.js' %}"></script>
+  <script>
+    const weeklyFB = {{ weekly_data_json|safe }};
+    const seriesFB = Object.entries(weeklyFB).map(([name, data]) => ({ name, data }));
+
+    new ApexCharts(document.querySelector("#chart-facebook-weekly"), {
+      chart: { type: 'scatter', height: 350, zoom: { enabled: true } },
+      series: seriesFB,
+      xaxis: { type: 'category', title: { text: 'Fecha' } },
+      yaxis: { title: { text: 'Eventos (#)' } },
+      tooltip: {
+        x: { formatter: val => val }
+      },
+      title: { text: 'Eventos de Facebook Pages (últimos 7 días)' }
+    }).render();
+  </script>
 {% endblock %}