Refactor in the dashboard template

This commit is contained in:
JKuijperM 2026-01-21 15:34:02 +01:00
parent 2b643367e7
commit 182fb01d3c

View File

@ -9,9 +9,50 @@
<body> <body>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<h1>Dashboard</h1> <h1>Dashboard</h1>
<!-- ========================= -->
<!-- Filters -->
<!-- ========================= -->
<form method="get">
<label>
Año:
<select name="year">
{% for y in year_list %}
<option value="{{ y }}"
{% if y == selected_year %}selected{% endif %}
>
{{y}}
</option>
{% endfor %}
</select>
</label>
<label>
Mes:
<select name="month">
<option value="">Todos</option>
{% for m in months %}
<option value="{{ m }}"
{% if m == selected_month %}selected{% endif %}
>
{{ m }}
</option>
{% endfor %}
</select>
</label>
<button type="submit">Filtrar</button>
</form>
<hr>
<!-- ========================= -->
<!-- Expenses by category -->
<!-- ========================= -->
<h2>Gastos por categoría</h2> <h2>Gastos por categoría</h2>
<ul> <ul>
{% for row in by_category %} {% for row in by_category %}
<li>{{ row.category__name }} → {{ row.total }}</li> <li>{{ row.category__name }} → {{ row.total }}</li>
@ -20,41 +61,28 @@
{% endfor %} {% endfor %}
</ul> </ul>
<hr>
<!-- ========================= -->
<!-- Expenses by month -->
<!-- ========================= -->
<h2>Gastos por mes</h2>
<ul> <ul>
<form method="get"> {% for row in by_months %}
<label for="year">Año:</label> <li>Mes {{ row.mont }} → {{ row.total }}</li>
<select name="year" id="year">
<option value="">Todos</option>
{% for y in year_list %}
<option value="{{ y.year }}"
{% if selected_year == y.year|stringformat:"s" %}selected{% endif %}
>
{{ y.year }}
</option>
{% endfor %} {% endfor %}
</select> </ul>
<label for="month">Mes:</label> <hr>
<select name="month" id="month">
<option value="">Todos</option>
{% for m in months %}
<option value="{{ m }}"
{% if selected_month == m|stringformat:"s" %}selected{% endif %}
>
{{ m }}
</option>
{% endfor %}
</select>
<button type="submit">Filtrar</button> <!-- ========================= -->
</form> <!-- Chart -->
<!-- ========================= -->
{% for row in by_month %}
<li>{{ row.month }} → {{ row.total }}</li>
{% endfor %}
<canvas id="expensesChart"></canvas> <canvas id="expensesChart"></canvas>
<script> <script>
const labels = {{ chart_labels|safe }}; const labels = {{ chart_labels|safe }};
const data = {{ chart_data|safe }}; const data = {{ chart_data|safe }};
@ -72,6 +100,6 @@
} }
}); });
</script> </script>
</ul>
</body> </body>
</html> </html>