From 3cd96436a541a5d56dbd4d50b1183f88e224451a Mon Sep 17 00:00:00 2001
From: Celestino Rey <creylopez@yahoo.es>
Date: Fri, 6 Sep 2024 11:28:40 +0200
Subject: [PATCH] =?UTF-8?q?Gr=C3=A1fico=20mejorado?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Finanzas/finanzas/apuntes/urls.py             |   3 +-
 Finanzas/finanzas/apuntes/views.py            |  49 ++++++++++----
 Finanzas/finanzas/db.sqlite3                  | Bin 176128 -> 176128 bytes
 Finanzas/finanzas/templates/_cabecera.html    |   2 +-
 Finanzas/finanzas/templates/_head.html        |  15 -----
 .../templates/apuntes/grafico_bancos.html     |  60 ------------------
 .../templates/apuntes/nuevo_grafico.html      |  46 ++++++++++++++
 Finanzas/finanzas/templates/base.html         |  11 +++-
 8 files changed, 93 insertions(+), 93 deletions(-)
 delete mode 100644 Finanzas/finanzas/templates/apuntes/grafico_bancos.html
 create mode 100644 Finanzas/finanzas/templates/apuntes/nuevo_grafico.html

diff --git a/Finanzas/finanzas/apuntes/urls.py b/Finanzas/finanzas/apuntes/urls.py
index fbd0e3f..b478a43 100644
--- a/Finanzas/finanzas/apuntes/urls.py
+++ b/Finanzas/finanzas/apuntes/urls.py
@@ -15,7 +15,6 @@ urlpatterns = [
     path('apuntes/<int:apunte_id>/editar/', views.editar_apunte, name='editar_apunte'),
     path('apuntes/<int:apunte_id>/eliminar/', views.eliminar_apunte, name='eliminar_apunte'),
 
-    path('apuntes/datos_grafico_bancos/', views.datos_grafico_bancos, name='datos_grafico_bancos'),
-    path('apuntes/grafico_bancos/', views.grafico_bancos_view, name='grafico_bancos_view'),
+    path('apuntes/grafico_tipo_cuenta/', views.datos_por_tipo_cuenta, name='datos_por_tipo_cuenta'),
 
 ]
diff --git a/Finanzas/finanzas/apuntes/views.py b/Finanzas/finanzas/apuntes/views.py
index d77c795..e151717 100644
--- a/Finanzas/finanzas/apuntes/views.py
+++ b/Finanzas/finanzas/apuntes/views.py
@@ -5,6 +5,7 @@ from django.http import JsonResponse
 # Create your views here.
 from .models import Cuenta, Apunte, Tipo
 from .forms import CuentaForm, ApunteForm
+import json
 
 
 @login_required
@@ -130,23 +131,43 @@ def eliminar_apunte(request, apunte_id):
     return redirect('lista_apuntes')
 
 @login_required
-def datos_grafico_bancos(request):
-    datos = Cuenta.objects.filter(tipo=Tipo.objects.get(tipo="Banco")) | Cuenta.objects.filter(tipo=Tipo.objects.get(tipo="Ahorro"))
+def datos_por_tipo_cuenta(request):
+    debancos = Cuenta.objects.filter(tipo=Tipo.objects.get(tipo="Banco"))
 
-    etiquetas = [item.nombre for item in datos]
-    valores = [item.saldo_actual for item in datos]
+    etiquetas = []
+    bancos = []
+    ahorro = []
 
-    print(etiquetas)
+    for cuenta in debancos:
+        etiqueta = f"{cuenta.nombre}"
+        if etiqueta not in etiquetas:
+            etiquetas.append(etiqueta)
 
-    datos_grafico_bancos = {
-        'label': 'Bancos',
-        'labels': etiquetas,
-        'values': valores,
+        bancos.append(float(cuenta.saldo_actual))
+        ahorro.append(0)
 
-        'chart_type': 'bar' # any chart type line, bar, ects
-        }
+        print("Etiqueta: ", etiquetas, " --- ", bancos)
 
-    return JsonResponse(datos_grafico_bancos)
 
-def grafico_bancos_view(request):
-    return render(request, 'apuntes/grafico_bancos.html')
+    deahorro = Cuenta.objects.filter(tipo=Tipo.objects.get(tipo="Ahorro"))
+
+    for cuenta in deahorro:
+        etiqueta = f"{cuenta.nombre}"
+        if etiqueta not in etiquetas:
+            etiquetas.append(etiqueta)
+
+        ahorro.append(float(cuenta.saldo_actual))
+        bancos.append(0)
+
+        print("Etiqueta: ", etiquetas, " --- ", ahorro)
+
+    context = {
+        'bancos': bancos,
+        'etiquetas_json': json.dumps(etiquetas),
+        'bancos_datos_json': json.dumps(bancos),
+        'ahorro_datos_json': json.dumps(ahorro),
+    }
+
+    print("Context: ", context['etiquetas_json'])
+
+    return render(request, 'apuntes/nuevo_grafico.html', context)
diff --git a/Finanzas/finanzas/db.sqlite3 b/Finanzas/finanzas/db.sqlite3
index 2e3ae7fd243639d58df3e61f02d180f9103f57ba..ec40523b99fb49cda2327bbb8677f23f1f6a0768 100644
GIT binary patch
delta 325
zcmZp8z}4`8Yl1Xm<U|=~#>kBcVflh)3I>)|hL%<a#(HKZ#wMnQ&BycGkLNQ^Kc3HI
z%frH*#lUxqcMDHHch<(nC~l1=B^FlS=3vJH153;DqTI?Nvr_Za!kqjP<5Gk4Wb@*D
zgRH#VoV3j8+iRG%c!rq=SedzJq??rb`vt^%ms=VeB$=6}yIGh9#uu802NWgw`sbS)
z$A_9_xTi&C8yOgx=o(n+8W|uQWo~S2ZfUW-zlN!lnTLfxmw|sf|0Mo9{J9$&WBD~z
zn0*-uIfVtJX!`UTCWYzS`kDNIhO{#9KjJ^kzl6VaV`C}5vK+G`BW|l%K+@A^)iOzK
KKQy1oP5=OBEnyY_

delta 133
zcmZp8z}4`8Yl1Xm*hCp;#;}bEVflil3I^s@rlwXVhI*FfmL_Hv&BycGkLNQ^Kc3HI
z%f-yo&%k$!cMDJd#>PgT?fo@OrOaH+{F4~?xARZpzq47epoO1Bh1r*J`t%wmh3VV+
lnf!p#OBnbc@gL@20+gP{&mza{$T)pgEtAytL-U#J1ON)vDaQZ+

diff --git a/Finanzas/finanzas/templates/_cabecera.html b/Finanzas/finanzas/templates/_cabecera.html
index b2679d2..459247f 100644
--- a/Finanzas/finanzas/templates/_cabecera.html
+++ b/Finanzas/finanzas/templates/_cabecera.html
@@ -109,7 +109,7 @@
 
                     <li class="nav-item">
                         <!--//Bootstrap Icons: https://icons.getbootstrap.com/ -->
-                        <a class="nav-link" href="{% url 'grafico_bancos_view' %}">
+                        <a class="nav-link" href="{% url 'datos_por_tipo_cuenta' %}">
                             <span class="nav-icon">
                             <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-card-list" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" d="M14.5 3h-13a.5.5 0 0 0-.5.5v9a.5.5 0 0 0 .5.5h13a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13z"/>
diff --git a/Finanzas/finanzas/templates/_head.html b/Finanzas/finanzas/templates/_head.html
index 3a14af8..b311396 100644
--- a/Finanzas/finanzas/templates/_head.html
+++ b/Finanzas/finanzas/templates/_head.html
@@ -20,21 +20,6 @@
     <!-- App CSS -->  
     <link id="theme-style" rel="stylesheet" href="{% static 'css/portal.css' %}">
 
-    <!-- Include Chart.js via CDN
-    <script src="{% static 'js/chart.js' %}"></script>-->
-
-         <!-- Javascript -->
-    <script src="{%  static 'plugins/popper.min.js' %}"></script>
-    <script src="{%  static 'plugins/bootstrap/js/bootstrap.min.js' %}"></script>
-
     <!-- Charts JS -->
     <script src="{%  static 'plugins/chart.js/chart.min.js' %}"></script>
-    <script src="{%  static 'js/index-charts.js' %}"></script>
-
-    <!-- La línea siguiente es para la demo de los charts en charts.html -->
-    <script src="{%  static 'js/charts-demo.js' %}"></script>
-
-
-    <!-- Page Specific JS -->
-    <script src="{%  static 'js/app.js' %}"></script>
 </head> 
diff --git a/Finanzas/finanzas/templates/apuntes/grafico_bancos.html b/Finanzas/finanzas/templates/apuntes/grafico_bancos.html
deleted file mode 100644
index 9c43c6d..0000000
--- a/Finanzas/finanzas/templates/apuntes/grafico_bancos.html
+++ /dev/null
@@ -1,60 +0,0 @@
-{% extends 'base.html' %}
-
-{% block content %}
-
-<div class="container-xl">
-
-    <h1 class="app-page-title">Saldos de bancos</h1>
-
-    <div class="app-card app-card-notification shadow-sm mb-4">
-        <div style="width: 50%; margin: 0 auto;">
-            <canvas id="graficoBancos"></canvas>
-        </div>
-
-        <script>
-            document.addEventListener('DOMContentLoaded', function () {
-                fetch('/apuntes/apuntes/datos_grafico_bancos/')
-                    .then(response => response.json())
-                    .then(data => {
-                        const ctx = document.getElementById('graficoBancos').getContext('2d');
-
-                        new Chart(ctx, {
-                            type: data.chart_type,
-                            data: {
-                                labels: data.labels,
-                                datasets: [{
-                                    label: data.label,
-                                    data: data.values,
-                                    backgroundColor: [
-                                                'rgba(255, 99, 132, 0.2)',
-                                                'rgba(54, 162, 235, 0.2)',
-                                                'rgba(255, 206, 86, 0.2)',
-                                                'rgba(75, 192, 192, 0.2)',
-                                                'rgba(153, 102, 255, 0.2)',
-                                                'rgba(255, 159, 64, 0.2)'
-                                                ],
-                                    borderColor: [
-                                                'rgba(255, 99, 132, 1)',
-                                                'rgba(54, 162, 235, 1)',
-                                                'rgba(255, 206, 86, 1)',
-                                                'rgba(75, 192, 192, 1)',
-                                                'rgba(153, 102, 255, 1)',
-                                                'rgba(255, 159, 64, 1)'
-                                                ],
-                                }]
-                            },
-                            options: {
-                                scales: {
-                                    y: {
-                                        beginAtZero: true
-                                    }
-                                }
-                            }
-                        });
-                    });
-            });
-        </script>
-    </div>
-</div>
-
-{% endblock %}
diff --git a/Finanzas/finanzas/templates/apuntes/nuevo_grafico.html b/Finanzas/finanzas/templates/apuntes/nuevo_grafico.html
new file mode 100644
index 0000000..db5085e
--- /dev/null
+++ b/Finanzas/finanzas/templates/apuntes/nuevo_grafico.html
@@ -0,0 +1,46 @@
+{% extends 'base.html' %}
+
+{% block content %}
+
+<div class="container-xl">
+
+    <h1 class="app-page-title">Saldos de bancos</h1>
+
+    <div class="app-card app-card-notification shadow-sm mb-4">
+        <div style="width: 50%; margin: 0 auto;">
+            <canvas id="bancovsahorroGrafico"></canvas>
+        </div>
+
+        <script>
+
+            const etiquetas = JSON.parse('{{ etiquetas_json|escapejs }}');
+            const datosBancos = JSON.parse('{{ bancos_datos_json|escapejs }}');
+            const datosAhorro = JSON.parse('{{ ahorro_datos_json|escapejs }}');
+
+            const ctx = document.getElementById('bancovsahorroGrafico').getContext('2d');
+
+            const bancovsahorroGrafico = new Chart(ctx, {
+                type: 'bar',
+                data: {
+                    labels: etiquetas,
+                    datasets: [{
+                        label: 'Bancos',
+                        data: datosBancos,
+                    }, {
+                        label: 'Ahorro',
+                        data: datosAhorro
+                    }]
+                },
+                options: {
+                    scales: {
+                        y: {
+                            beginAtZero: true
+                        }
+                    }
+                }
+            });
+        </script>
+    </div>
+</div>
+
+{% endblock %}
diff --git a/Finanzas/finanzas/templates/base.html b/Finanzas/finanzas/templates/base.html
index 2d10ad6..2c9e08e 100644
--- a/Finanzas/finanzas/templates/base.html
+++ b/Finanzas/finanzas/templates/base.html
@@ -13,7 +13,16 @@
 
       {% include "_footer.html"  %}
 
-    </div><!--//app-wrapper-->    					
+    </div><!--//app-wrapper-->
+
+
+         <!-- Javascript -->
+    <script src="{%  static 'plugins/popper.min.js' %}"></script>
+    <script src="{%  static 'plugins/bootstrap/js/bootstrap.min.js' %}"></script>
+
+    <!-- Page Specific JS -->
+    <script src="{%  static 'js/app.js' %}"></script>
+
     </body>
 </html>