feat: add yearly overview by account

This commit is contained in:
Herculino Trotta
2024-10-31 23:13:29 -03:00
parent c7174e7b53
commit edf07082e2
9 changed files with 428 additions and 100 deletions

View File

@@ -23,8 +23,9 @@ class User(AbstractUser):
class UserSettings(models.Model):
class StartPage(models.TextChoices):
MONTHLY = "MONTHLY_OVERVIEW", _("Monthly Overview")
YEARLY = "YEARLY_OVERVIEW", _("Yearly Overview")
MONTHLY = "MONTHLY_OVERVIEW", _("Monthly")
YEARLY_CURRENCY = "YEARLY_OVERVIEW_CURRENCY", _("Yearly by currency")
YEARLY_ACCOUNT = "YEARLY_OVERVIEW_ACCOUNT", _("Yearly by account")
NETWORTH = "NETWORTH", _("Net Worth")
ALL_TRANSACTIONS = "ALL_TRANSACTIONS", _("All Transactions")
CALENDAR = "CALENDAR", _("Calendar")

View File

@@ -3,10 +3,16 @@ from django.urls import path
from . import views
urlpatterns = [
path("yearly/", views.index, name="yearly_index"),
path("yearly/currency/", views.index_by_currency, name="yearly_index_currency"),
path("yearly/account/", views.index_by_account, name="yearly_index_account"),
path(
"yearly/<int:year>/",
views.yearly_overview,
name="yearly_overview",
"yearly/currency/<int:year>/",
views.yearly_overview_by_currency,
name="yearly_overview_currency",
),
path(
"yearly/account/<int:year>/",
views.yearly_overview_by_account,
name="yearly_overview_account",
),
]

View File

@@ -13,17 +13,27 @@ from apps.transactions.models import Transaction
@login_required
def index(request):
def index_by_currency(request):
now = timezone.localdate(timezone.now())
return redirect(to="yearly_overview", year=now.year)
return redirect(to="yearly_overview_currency", year=now.year)
def yearly_overview(request, year: int):
@login_required
def index_by_account(request):
now = timezone.localdate(timezone.now())
return redirect(to="yearly_overview_account", year=now.year)
@login_required
def yearly_overview_by_currency(request, year: int):
next_year = year + 1
previous_year = year - 1
transactions = Transaction.objects.filter(reference_date__year=year)
transactions = Transaction.objects.filter(
reference_date__year=year, account__is_archived=False
)
monthly_data = (
transactions.annotate(month=TruncMonth("reference_date"))
@@ -165,7 +175,7 @@ def yearly_overview(request, year: int):
return render(
request,
"yearly_overview/pages/overview.html",
"yearly_overview/pages/overview_by_currency.html",
context={
"year": year,
"next_year": next_year,
@@ -173,3 +183,166 @@ def yearly_overview(request, year: int):
"totals": result,
},
)
@login_required
def yearly_overview_by_account(request, year: int):
next_year = year + 1
previous_year = year - 1
transactions = Transaction.objects.filter(
reference_date__year=year, account__is_archived=False
)
monthly_data = (
transactions.annotate(month=TruncMonth("reference_date"))
.values(
"month",
"account__id",
"account__name",
"account__currency__code",
"account__currency__prefix",
"account__currency__suffix",
"account__currency__decimal_places",
)
.annotate(
income_paid=Coalesce(
Sum(
Case(
When(
type=Transaction.Type.INCOME, is_paid=True, then=F("amount")
),
default=Value(Decimal("0")),
output_field=DecimalField(),
)
),
Value(Decimal("0")),
output_field=DecimalField(),
),
expense_paid=Coalesce(
Sum(
Case(
When(
type=Transaction.Type.EXPENSE,
is_paid=True,
then=F("amount"),
),
default=Value(Decimal("0")),
output_field=DecimalField(),
)
),
Value(Decimal("0")),
output_field=DecimalField(),
),
income_unpaid=Coalesce(
Sum(
Case(
When(
type=Transaction.Type.INCOME,
is_paid=False,
then=F("amount"),
),
default=Value(Decimal("0")),
output_field=DecimalField(),
)
),
Value(Decimal("0")),
output_field=DecimalField(),
),
expense_unpaid=Coalesce(
Sum(
Case(
When(
type=Transaction.Type.EXPENSE,
is_paid=False,
then=F("amount"),
),
default=Value(Decimal("0")),
output_field=DecimalField(),
)
),
Value(Decimal("0")),
output_field=DecimalField(),
),
)
.annotate(
balance_unpaid=F("income_unpaid") - F("expense_unpaid"),
balance_paid=F("income_paid") - F("expense_paid"),
balance_total=F("income_paid")
+ F("income_unpaid")
- F("expense_paid")
- F("expense_unpaid"),
)
.order_by("month", "account__name")
)
# Create a list of all months in the year
all_months = [date(year, month, 1) for month in range(1, 13)]
# Get all accounts that had transactions in this year
accounts = (
transactions.values(
"account__id",
"account__name",
"account__group__name",
"account__currency__code",
"account__currency__prefix",
"account__currency__suffix",
"account__currency__decimal_places",
)
.distinct()
.order_by("account__name")
)
# Create a dictionary to store the final result
result = {
month: {
account["account__id"]: {
"name": account["account__name"],
"group": account["account__group__name"],
"currency": {
"code": account["account__currency__code"],
"prefix": account["account__currency__prefix"],
"suffix": account["account__currency__suffix"],
"decimal_places": account["account__currency__decimal_places"],
},
"income_paid": Decimal("0"),
"expense_paid": Decimal("0"),
"income_unpaid": Decimal("0"),
"expense_unpaid": Decimal("0"),
"balance_unpaid": Decimal("0"),
"balance_paid": Decimal("0"),
"balance_total": Decimal("0"),
}
for account in accounts
}
for month in all_months
}
# Fill in the data
for entry in monthly_data:
month = entry["month"]
account_id = entry["account__id"]
for field in [
"income_paid",
"expense_paid",
"income_unpaid",
"expense_unpaid",
"balance_unpaid",
"balance_paid",
"balance_total",
]:
result[month][account_id][field] = entry[field]
return render(
request,
"yearly_overview/pages/overview_by_account.html",
context={
"year": year,
"next_year": next_year,
"previous_year": previous_year,
"totals": result,
"accounts": accounts,
},
)

View File

@@ -16,7 +16,7 @@
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
data-bs-target="#flush-collapse-{{ forloop.counter0 }}" aria-expanded="false"
aria-controls="flush-collapseOne">
{% if form.account_group %}<span class="badge !tw-bg-blue-300 !tw-text-blue-800 me-2">{{ form.account_group.name }}</span>{% endif %}{{ form.account_name }}
{% if form.account_group %}<span class="badge text-bg-primary me-2">{{ form.account_group.name }}</span>{% endif %}{{ form.account_name }}
</button>
</h2>
<div id="flush-collapse-{{ forloop.counter0 }}" class="accordion-collapse collapse">

View File

@@ -1,5 +1,5 @@
<div class="row p-5">
<div class="col p-5">
<div class="row {% if not remove_padding %}p-5{% endif %}">
<div class="col {% if not remove_padding %}p-5{% endif %}">
<div class="text-center">
<i class="fa-solid fa-circle-xmark tw-text-6xl"></i>
<p class="lead mt-4 mb-0">{{ title }}</p>

View File

@@ -13,7 +13,7 @@
<div class="collapse navbar-collapse" id="navbarContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0 nav-underline" hx-push-url="true">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle {% active_link views='monthly_overview||yearly_overview||calendar' %}"
<a class="nav-link dropdown-toggle {% active_link views='monthly_overview||yearly_overview_currency||yearly_overview_account||calendar' %}"
href="#"
role="button"
data-bs-toggle="dropdown"
@@ -23,8 +23,10 @@
<ul class="dropdown-menu">
<li><a class="dropdown-item {% active_link views='monthly_overview' %}"
href="{% url 'monthly_index' %}">{% translate 'Monthly' %}</a></li>
<li><a class="dropdown-item {% active_link views='yearly_overview' %}"
href="{% url 'yearly_index' %}">{% translate 'Yearly' %}</a></li>
<li><a class="dropdown-item {% active_link views='yearly_overview_currency' %}"
href="{% url 'yearly_index_currency' %}">{% translate 'Yearly by currency' %}</a></li>
<li><a class="dropdown-item {% active_link views='yearly_overview_account' %}"
href="{% url 'yearly_index_account' %}">{% translate 'Yearly by account' %}</a></li>
<li><a class="dropdown-item {% active_link views='calendar' %}"
href="{% url 'calendar_index' %}">{% translate 'Calendar' %}</a></li>
</ul>

View File

@@ -50,8 +50,7 @@
{% if group_id %}
<div class="d-flex justify-content-between mt-2">
<div class="d-flex align-items-baseline w-100">
<div class="text-start font-monospace tw-text-gray-300"><span class="badge !tw-bg-blue-300
!tw-text-blue-800">
<div class="text-start font-monospace tw-text-gray-300"><span class="badge text-bg-primary">
{{ group_data.name }}</span></div>
</div>
</div>

View File

@@ -0,0 +1,225 @@
{% extends "layouts/base.html" %}
{% load currency_display %}
{% load crispy_forms_tags %}
{% load i18n %}
{% load month_name %}
{% load static %}
{% load webpack_loader %}
{% block title %}{% translate 'Yearly Overview' %} :: {% translate "By account" %} :: {{ year }}{% endblock %}
{% block body_hyperscript %}
on keyup[code is 'ArrowLeft' and target.nodeName is 'BODY'] from body trigger 'previous_year' end
on keyup[code is 'ArrowRight' and target.nodeName is 'BODY'] from body trigger 'next_year' end
{% endblock %}
{% block content %}
<div class="container px-md-3 py-3 column-gap-5">
<div class="row mb-3 gx-xl-4 gy-3 mb-4">
{# Date picker#}
<div class="col-12 col-xl-2 flex-row align-items-center d-flex">
<div class="tw-text-base h-100 align-items-center d-flex">
<a role="button"
class="pe-4 py-2"
hx-boost="true"
hx-trigger="click, previous_year from:window"
href="{% url 'yearly_overview_account' year=previous_year %}">
<i class="fa-solid fa-chevron-left"></i></a>
</div>
<div class="tw-text-3xl fw-bold font-monospace tw-w-full text-center">
{{ year }}
</div>
<div class="tw-text-base mx-2 h-100 align-items-center d-flex">
<a role="button"
class="ps-3 py-2"
hx-boost="true"
hx-trigger="click, next_year from:window"
href="{% url 'yearly_overview_account' year=next_year %}">
<i class="fa-solid fa-chevron-right"></i>
</a>
</div>
</div>
{# Action buttons#}
<div class="col-12 col-xl-10">
<div class="d-grid gap-2 d-xl-flex justify-content-xl-end">
<button class="btn btn-sm btn-outline-success"
hx-get="{% url 'transaction_add' %}"
hx-target="#generic-offcanvas"
hx-trigger="click, add_income from:window"
hx-vals='{"year": {{ year }}, "type": "IN"}'>
<i class="fa-solid fa-arrow-right-to-bracket me-2"></i>
{% translate "Income" %}
</button>
<button class="btn btn-sm btn-outline-danger"
hx-get="{% url 'transaction_add' %}"
hx-target="#generic-offcanvas"
hx-trigger="click, add_expense from:window"
hx-vals='{"year": {{ year }}, "type": "EX"}'>
<i class="fa-solid fa-arrow-right-from-bracket me-2"></i>
{% translate "Expense" %}
</button>
<button class="btn btn-sm btn-outline-warning"
hx-get="{% url 'installment_plan_add' %}"
hx-trigger="click, installment from:window"
hx-target="#generic-offcanvas">
<i class="fa-solid fa-divide me-2"></i>
{% translate "Installment" %}
</button>
<button class="btn btn-sm btn-outline-warning"
hx-get="{% url 'recurring_transaction_add' %}"
hx-trigger="click, balance from:window"
hx-target="#generic-offcanvas">
<i class="fa-solid fa-repeat me-2"></i>
{% translate "Recurring" %}
</button>
<button class="btn btn-sm btn-outline-info"
hx-get="{% url 'transactions_transfer' %}"
hx-target="#generic-offcanvas"
hx-trigger="click, add_transfer from:window"
hx-vals='{"year": {{ year }}}'>
<i class="fa-solid fa-money-bill-transfer me-2"></i>
{% translate "Transfer" %}
</button>
<button class="btn btn-sm btn-outline-info"
hx-get="{% url 'account_reconciliation' %}"
hx-trigger="click, balance from:window"
hx-target="#generic-offcanvas">
<i class="fa-solid fa-scale-balanced me-2"></i>
{% translate "Balance" %}
</button>
</div>
</div>
</div>
<div class="row row-cols-1 g-4 mb-3">
{% for date, x in totals.items %}
<div class="col">
<div class="card tw-relative h-100 shadow">
<div class="tw-absolute tw-h-8 tw-w-8 tw-right-2 tw-top-2 tw-bg-yellow-300 tw-text-yellow-800 text-center
align-items-center d-flex justify-content-center rounded-2 tw-font-bold">
{{ forloop.counter }}
</div>
<div class="card-body">
<h5 class="tw-text-yellow-400 fw-bold mb-3">{{ date.month|month_name }}</h5>
<div class="accordion accordion-flush" id="a-{{ forloop.counter }}-control">
{% for id, account in x.items %}
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#{{ account.name|slugify }}-{{ forloop.parentloop.counter }}" aria-expanded="false" aria-controls="{{ account.name|slugify }}-{{ forloop.counter }}">
<span class="badge text-bg-primary me-2">{{ account.group }}</span>{{ account.name }}
</button>
</h2>
<div id="{{ account.name|slugify }}-{{ forloop.parentloop.counter }}" class="accordion-collapse collapse">
<div class="accordion-body">
<div class="row">
<div class="col-12 col-lg-6">
<div class="d-flex justify-content-between align-items-baseline mt-2">
<div class="text-end font-monospace">
<div class="tw-text-gray-400">{% translate 'projected income' %}</div>
</div>
<div class="dotted-line flex-grow-1"></div>
<div class="text-end font-monospace tw-text-green-300">
<c-amount.display
:amount="account.income_unpaid"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
</div>
</div>
<div class="d-flex justify-content-between align-items-baseline mt-2">
<div class="text-end font-monospace">
<div class="tw-text-gray-400">{% translate 'projected expenses' %}</div>
</div>
<div class="dotted-line flex-grow-1"></div>
<div class="text-end font-monospace tw-text-red-300">
<c-amount.display
:amount="account.expense_unpaid"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
</div>
</div>
<div class="d-flex justify-content-between align-items-baseline mt-2">
<div class="text-end font-monospace">
<div class="tw-text-gray-400">{% translate 'projected total' %}</div>
</div>
<div class="dotted-line flex-grow-1"></div>
<div class="text-end font-monospace tw-text-yellow-300">
<c-amount.display
:amount="account.balance_unpaid"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
</div>
</div>
</div>
<hr class="my-3 d-block d-lg-none">
<div class="col-12 col-lg-6">
<div class="d-flex justify-content-between align-items-baseline mt-2">
<div class="text-end font-monospace">
<div class="tw-text-gray-400">{% translate 'current income' %}</div>
</div>
<div class="dotted-line flex-grow-1"></div>
<div class="text-end font-monospace tw-text-green-400">
<c-amount.display
:amount="account.income_paid"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
</div>
</div>
<div class="d-flex justify-content-between align-items-baseline mt-2">
<div class="text-end font-monospace">
<div class="tw-text-gray-400">{% translate 'current expenses' %}</div>
</div>
<div class="dotted-line flex-grow-1"></div>
<div class="text-end font-monospace tw-text-red-400">
<c-amount.display
:amount="account.expense_paid"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
</div>
</div>
<div class="d-flex justify-content-between align-items-baseline mt-2">
<div class="text-end font-monospace">
<div class="tw-text-gray-400">{% translate 'current total' %}</div>
</div>
<div class="dotted-line flex-grow-1"></div>
<div class="text-end font-monospace tw-text-yellow-400">
<c-amount.display
:amount="account.balance_paid"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
</div>
</div>
</div>
<hr class="my-3">
<div>
<div class="d-flex justify-content-between align-items-baseline">
<div class="text-end font-monospace">
<div class="tw-text-gray-400">{% translate 'final total' %}</div>
</div>
<div class="dotted-line flex-grow-1"></div>
<div class="text-end font-monospace tw-text-green-300">
<c-amount.display
:amount="account.balance_total"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
{% endblock %}

View File

@@ -6,7 +6,7 @@
{% load static %}
{% load webpack_loader %}
{% block title %}{% translate 'Yearly Overview' %} :: {{ year }}{% endblock %}
{% block title %}{% translate 'Yearly Overview' %} :: {% translate 'By currency' %} :: {{ year }}{% endblock %}
{% block body_hyperscript %}
on keyup[code is 'ArrowLeft' and target.nodeName is 'BODY'] from body trigger 'previous_year' end
@@ -23,7 +23,7 @@
class="pe-4 py-2"
hx-boost="true"
hx-trigger="click, previous_year from:window"
href="{% url 'yearly_overview' year=previous_year %}">
href="{% url 'yearly_overview_currency' year=previous_year %}">
<i class="fa-solid fa-chevron-left"></i></a>
</div>
<div class="tw-text-3xl fw-bold font-monospace tw-w-full text-center">
@@ -34,7 +34,7 @@
class="ps-3 py-2"
hx-boost="true"
hx-trigger="click, next_year from:window"
href="{% url 'yearly_overview' year=next_year %}">
href="{% url 'yearly_overview_currency' year=next_year %}">
<i class="fa-solid fa-chevron-right"></i>
</a>
</div>
@@ -90,84 +90,6 @@
</div>
</div>
</div>
{# <div class="row gx-xl-4 gy-3">#}
{# <div class="col-12">#}
{# <div class="row">#}
{# <div class="no-more-tables">#}
{# <table class="table table-hover text-nowrap">#}
{# <thead>#}
{# <tr>#}
{# <th scope="col">{% translate 'Month' %}</th>#}
{# <td>{% translate 'Projected Income' %}</td>#}
{# <td>{% translate 'Projected Expenses' %}</td>#}
{# <td>{% translate 'Projected Total' %}</td>#}
{# <td>{% translate 'Current Income' %}</td>#}
{# <td>{% translate 'Current Expenses' %}</td>#}
{# <td>{% translate 'Current Total' %}</td>#}
{# <td>{% translate 'Final Total' %}</td>#}
{# </tr>#}
{# </thead>#}
{# <tbody>#}
{# {% for date, x in totals.items %}#}
{# <tr>#}
{# <th scope="row">{{ date.month|month_name }}</th>#}
{# <td class="!tw-text-green-400" data-title="{% translate 'Projected Income' %}">#}
{# {% for data in x.income_unpaid %}#}
{# <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
{# {% empty %}#}
{# <div>-</div>#}
{# {% endfor %}#}
{# </td>#}
{# <td class="!tw-text-red-400" data-title="{% translate 'Projected Expenses' %}">#}
{# {% for data in x.expense_unpaid %}#}
{# <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
{# {% empty %}#}
{# <div>-</div>#}
{# {% endfor %}#}
{# </td>#}
{# <td data-title="{% translate 'Projected Total' %}">#}
{# {% for data in x.balance_unpaid %}#}
{# <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
{# {% empty %}#}
{# <div>-</div>#}
{# {% endfor %}#}
{# </td>#}
{# <td class="!tw-text-green-400" data-title="{% translate 'Current Income' %}">#}
{# {% for data in x.income_paid %}#}
{# <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
{# {% empty %}#}
{# <div>-</div>#}
{# {% endfor %}#}
{# </td>#}
{# <td class="!tw-text-red-400" data-title="{% translate 'Current Expenses' %}">#}
{# {% for data in x.expense_paid %}#}
{# <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
{# {% empty %}#}
{# <div>-</div>#}
{# {% endfor %}#}
{# </td>#}
{# <td data-title="{% translate 'Current Total' %}">#}
{# {% for data in x.balance_paid %}#}
{# <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
{# {% empty %}#}
{# <div>-</div>#}
{# {% endfor %}#}
{# </td>#}
{# <td data-title="{% translate 'Final Total' %}">#}
{# {% for data in x.balance_total %}#}
{# <div class="amount" data-original-value="{% currency_display amount=data.amount prefix=data.prefix suffix=data.suffix decimal_places=data.decimal_places %}"></div>#}
{# {% empty %}#}
{# <div>-</div>#}
{# {% endfor %}#}
{# </td>#}
{# </tr>#}
{# {% endfor %}#}
{# </tbody>#}
{# </table>#}
{# </div>#}
{# </div>#}
{# </div>#}
{# </div>#}
<div class="row row-cols-1 row-cols-xl-3 g-4 mb-3">
{% for date, x in totals.items %}
<div class="col">