starred/WYGIWYH
1
0
Fork 0
mirror of https://github.com/eitchtee/WYGIWYH.git synced 2026-06-11 17:12:51 +02:00
Code Issues 14 Packages Projects Releases 10 Wiki Activity

feat: add yearly overview by account

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/accounts/fragments/account_reconciliation.html
+1 -1
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">
app/templates/cotton/msg/empty.html
+2 -2
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>
app/templates/includes/navbar.html
+5 -3
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>
app/templates/net_worth/net_worth.html
+1 -2
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>
app/templates/yearly_overview/pages/overview_by_account.html
+225
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 %}
app/templates/yearly_overview/pages/overview.html → app/templates/yearly_overview/pages/overview_by_currency.html
+3 -81
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">