starred/WYGIWYH
1
0
Fork 0
mirror of https://github.com/eitchtee/WYGIWYH.git synced 2026-05-20 06:37:24 +02:00
Code Issues 14 Packages Projects Releases 10 Wiki Activity

feat(insights:category-overview): display tags breakdown alongside categories

Browse Source
This commit is contained in:
Herculino Trotta
2025-04-19 02:36:38 -03:00
parent a25c992d5c
commit 55ad2be08b
3 changed files with 248 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/insights/fragments/category_overview/index.html
+77 -5
View File
@@ -1,9 +1,9 @@
{% load i18n %}
<div hx-get="{% url 'category_overview' %}" hx-trigger="updated from:window" class="show-loading" hx-swap="outerHTML"
hx-include="#picker-form, #picker-type, #view-type">
hx-include="#picker-form, #picker-type, #view-type, #show-tags">
<div class="h-100 text-center mb-4">
<div class="btn-group btn-group-sm gap-3" role="group" aria-label="Basic radio toggle button group" id="view-type">
<div class="btn-group gap-3" role="group" id="view-type">
<input type="radio" class="btn-check"
name="view_type"
id="table-view"
@@ -28,8 +28,23 @@
</div>
{% if total_table %}
{% if view_type == "table" %}
<div class="mt-3">
<div class="form-check form-switch" id="show-tags">
<input type="hidden" name="show_tags" value="off">
<input class="form-check-input" type="checkbox" role="switch" id="show-tags-switch" name="show_tags"
_="on change trigger updated" {% if show_tags %}checked{% endif %}>
{% spaceless %}
<label class="form-check-label" for="show-tags-switch">
{% trans 'Show tags' %}
</label>
<c-ui.help-icon
content="{% trans 'Transaction amounts associated with multiple tags will be counted once for each tag' %}"
icon="fa-solid fa-circle-exclamation"></c-ui.help-icon>
{% endspaceless %}
</div>
</div>
<div class="table-responsive">
<table class="table table-striped table-hover table-bordered">
<table class="table table-striped table-hover table-bordered align-middle">
<thead>
<tr>
<th scope="col">{% trans 'Category' %}</th>
@@ -38,9 +53,10 @@
<th scope="col">{% trans 'Total' %}</th>
</tr>
</thead>
<tbody>
<tbody class="table-group-divider">
{% for category in total_table.values %}
<tr>
<!-- Category row -->
<tr class="table-group-header">
<th>{% if category.name %}{{ category.name }}{% else %}{% trans 'Uncategorized' %}{% endif %}</th>
<td>
{% for currency in category.currencies.values %}
@@ -85,11 +101,67 @@
{% endfor %}
</td>
</tr>
<!-- Tag rows -->
{% if show_tags %}
{% for tag_id, tag in category.tags.items %}
{% if tag.name or not tag.name and category.tags.values|length > 1 %}
<tr class="table-row-nested">
<td class="ps-4">
<i class="fa-solid fa-hashtag fa-fw me-2 text-muted"></i>{% if tag.name %}{{ tag.name }}{% else %}{% trans 'Untagged' %}{% endif %}
</td>
<td>
{% for currency in tag.currencies.values %}
{% if currency.total_income != 0 %}
<c-amount.display
:amount="currency.total_income"
:prefix="currency.currency.prefix"
:suffix="currency.currency.suffix"
:decimal_places="currency.currency.decimal_places"
color="green"></c-amount.display>
{% else %}
<div>-</div>
{% endif %}
{% endfor %}
</td>
<td>
{% for currency in tag.currencies.values %}
{% if currency.total_expense != 0 %}
<c-amount.display
:amount="currency.total_expense"
:prefix="currency.currency.prefix"
:suffix="currency.currency.suffix"
:decimal_places="currency.currency.decimal_places"
color="red"></c-amount.display>
{% else %}
<div>-</div>
{% endif %}
{% endfor %}
</td>
<td>
{% for currency in tag.currencies.values %}
{% if currency.total_final != 0 %}
<c-amount.display
:amount="currency.total_final"
:prefix="currency.currency.prefix"
:suffix="currency.currency.suffix"
:decimal_places="currency.currency.decimal_places"
color="{% if currency.total_final < 0 %}red{% else %}green{% endif %}"></c-amount.display>
{% else %}
<div>-</div>
{% endif %}
{% endfor %}
</td>
</tr>
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
</tbody>
</table>
</div>
{% elif view_type == "bars" %}
<div>
<div class="chart-container" _="init call setupChart() end" style="position: relative; height:80vh; width:100%">