Visual improvement to dashboard template
This commit is contained in:
parent
fb6e0f379e
commit
52d9e6488c
@ -15,7 +15,7 @@
|
||||
<!-- Filters -->
|
||||
<!-- ========================= -->
|
||||
|
||||
<form method="get">
|
||||
<form method="get" class="filters">
|
||||
<label>
|
||||
Año:
|
||||
<select name="year">
|
||||
@ -43,23 +43,98 @@
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<button type="submit">Filtrar</button>
|
||||
<label>
|
||||
<input type="checkbox" name="compare" value="1"
|
||||
{% if compare_enabled %}checked{% endif %}>
|
||||
Comparar con periodo anterior
|
||||
</label>
|
||||
|
||||
<button type="submit">Aplicar</button>
|
||||
</form>
|
||||
|
||||
<p>
|
||||
Mostrando:
|
||||
<strong>{{ selected_year }}</strong>
|
||||
{% if selected_month %}/<strong>{{ selected_month }}</strong>{% endif %}
|
||||
</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<!-- ========================= -->
|
||||
<!-- KPIs -->
|
||||
<!-- ========================= -->
|
||||
|
||||
|
||||
<div class="kpis">
|
||||
|
||||
<div class="kpi">
|
||||
<h3>Total</h3>
|
||||
<p>{{ kpi_total }}</p>
|
||||
</div>
|
||||
|
||||
<div class="kpi">
|
||||
<h3>Nº de gastos</h3>
|
||||
<p>{{ kpi_count }}</p>
|
||||
</div>
|
||||
|
||||
<div class="kpi">
|
||||
<h3>Categorías</h3>
|
||||
<p>{{ kpi_categories }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if compare_enabled %}
|
||||
<section class="kpi compare">
|
||||
<h3>Comparación con periodo anterior</h3>
|
||||
|
||||
<p>
|
||||
Total anterior: <strong>{{ kpi_previous_total|floatformat:2 }}</strong>
|
||||
</p>
|
||||
<p>
|
||||
Diferencia:
|
||||
{% if kpi_difference > 0 %}
|
||||
<span>▲</span>
|
||||
{% elif kpi_difference < 0 %}
|
||||
<span>▼</span>
|
||||
{% endif %}
|
||||
<strong>{{ kpi_difference|floatformat:2 }}</strong>
|
||||
</p>
|
||||
<p>
|
||||
Variación:
|
||||
{% if kpi_percentage is not None %}
|
||||
{{ kpi_percentage|floatformat:2 }}%
|
||||
{% else %}
|
||||
Variación: N/D
|
||||
{% endif %}
|
||||
</p>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
<!-- ========================= -->
|
||||
<!-- Expenses by category -->
|
||||
<!-- ========================= -->
|
||||
<h2>Gastos por categoría</h2>
|
||||
|
||||
<ul>
|
||||
{% for row in by_category %}
|
||||
<li>{{ row.category__name }} → {{ row.total }}</li>
|
||||
{% empty %}
|
||||
<li>No hay datos</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Categoría</th>
|
||||
<th>Total</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for row in by_category %}
|
||||
<tr>
|
||||
<td>{{ row.category__name }}</td>
|
||||
<td>{{ row.total }}</td>
|
||||
</tr>
|
||||
{% empty %}
|
||||
<tr>
|
||||
<td colspan="2">Sin datos</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<hr>
|
||||
|
||||
@ -70,22 +145,16 @@
|
||||
<h2>Gastos por mes</h2>
|
||||
|
||||
<ul>
|
||||
{% for row in by_months %}
|
||||
<li>Mes {{ row.mont }} → {{ row.total }}</li>
|
||||
{% for row in by_month %}
|
||||
<li>Mes {{ row.month }} → {{ row.total }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
<hr>
|
||||
|
||||
<!-- ========================= -->
|
||||
<!-- Chart -->
|
||||
<!-- ========================= -->
|
||||
|
||||
<label>
|
||||
<input type="checkbox" name="compare" value="1"
|
||||
{% if compare %}checked{% endif %}>
|
||||
Comparar con periodo anterior
|
||||
</label>
|
||||
<h3>Distribución mensual (año completo)</h3>
|
||||
|
||||
<canvas id="expensesChart"></canvas>
|
||||
|
||||
|
||||
@ -32,6 +32,10 @@ def _get_int(value):
|
||||
except (TypeError, ValueError):
|
||||
return None
|
||||
|
||||
@login_required
|
||||
def home(request):
|
||||
return render(request, 'expenses/home.html')
|
||||
|
||||
@login_required
|
||||
def expense_list(request):
|
||||
expenses = Expense.objects.filter(owner=request.user)
|
||||
@ -117,7 +121,7 @@ def dashboard(request):
|
||||
selected_year = year or current_year
|
||||
selected_month = month
|
||||
|
||||
compare = request.GET.get("compare") == "1"
|
||||
compare_enabled = request.GET.get("compare") == "1"
|
||||
|
||||
# ------------------
|
||||
# Queryset base
|
||||
@ -129,7 +133,7 @@ def dashboard(request):
|
||||
if selected_month:
|
||||
expenses_filtered = expenses_filtered.filter(date__month=selected_month)
|
||||
|
||||
total_amount = expenses.aggregate(
|
||||
total_amount = expenses_filtered.aggregate(
|
||||
total=Sum('amount')
|
||||
)['total'] or 0
|
||||
|
||||
@ -200,49 +204,41 @@ def dashboard(request):
|
||||
# Compare period
|
||||
# -----------------
|
||||
|
||||
previous_expenses = expenses
|
||||
previous_total = None
|
||||
difference = None
|
||||
percentage = None
|
||||
|
||||
if month and year:
|
||||
if month == 1:
|
||||
prev_year = year - 1
|
||||
prev_month = 12
|
||||
if compare_enabled:
|
||||
previous_expenses = Expense.objects.filter(owner=request.user)
|
||||
|
||||
if selected_month:
|
||||
# Monthly compare
|
||||
if selected_month == 1:
|
||||
prev_year = selected_year - 1
|
||||
prev_month = 12
|
||||
else:
|
||||
prev_year = selected_year
|
||||
prev_month = selected_month - 1
|
||||
|
||||
previous_expenses = previous_expenses.filter(
|
||||
date__year=prev_year,
|
||||
date__month=prev_month
|
||||
)
|
||||
else:
|
||||
prev_year = year
|
||||
prev_month = month - 1
|
||||
previous_expenses = previous_expenses.filter(
|
||||
date__year=prev_year,
|
||||
date__month=prev_month
|
||||
)
|
||||
elif year and month is None:
|
||||
prev_year = year - 1
|
||||
previous_expenses = previous_expenses.filter(
|
||||
date__year=prev_year
|
||||
)
|
||||
else:
|
||||
today = date.today()
|
||||
year = today.year
|
||||
month = today.month
|
||||
# Anual compare
|
||||
prev_year = selected_year - 1
|
||||
previous_expenses = previous_expenses.filter(
|
||||
date__year=prev_year
|
||||
)
|
||||
|
||||
if month == 1:
|
||||
prev_year = year - 1
|
||||
prev_month = 12
|
||||
else:
|
||||
prev_year = year
|
||||
prev_month = month - 1
|
||||
|
||||
previous_expenses = previous_expenses.filter(
|
||||
date__year=prev_year,
|
||||
date__month=prev_month
|
||||
previous_total = (
|
||||
previous_expenses.aggregate(total=Sum('amount'))['total'] or 0
|
||||
)
|
||||
|
||||
previous_total = (
|
||||
previous_expenses.aggregate(total=Sum('amount'))['total'] or 0
|
||||
)
|
||||
difference = total_amount - previous_total
|
||||
|
||||
difference = total_amount - previous_total
|
||||
precentage = (
|
||||
(difference / previous_total) * 100 if previous_total else None
|
||||
)
|
||||
if previous_total:
|
||||
percentage = (difference / previous_total) * 100
|
||||
|
||||
|
||||
# Send the data to the dashboard
|
||||
@ -258,4 +254,8 @@ def dashboard(request):
|
||||
'kpi_total': total_amount,
|
||||
'kpi_count': expense_count,
|
||||
'kpi_categories': category_count,
|
||||
'compare_enabled': compare_enabled,
|
||||
'kpi_previous_total': previous_total,
|
||||
'kpi_difference': difference,
|
||||
'kpi_percentage': percentage,
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user