edpibu
/
nummi
1
Fork 0
Code Issues 4 Releases Activity

Improve history plot with empty segments

This commit is contained in:
Edgar P. Burkhart 2023-12-30 10:10:53 +01:00
parent 55923e7709
commit ee4e6b7ceb
Signed by: edpibu
GPG Key ID: 9833D3C5A25BD227
3 changed files with 50 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
nummi/history/templates/history/plot.html
View File

@ -21,52 +21,54 @@
{% spaceless %} {% spaceless %}
{% for y in history.years reversed %} {% for y in history.years reversed %}
{% for date in y.d reversed %} {% for date in y.d reversed %}
{% if date %} {% ifchanged %}
<tr> {% if date %}
<td class="icon"> <tr {% if not date.month.month|divisibleby:"2" %}class="even"{% endif %}>
<span class="ri-{% if date.sum > 0 %}arrow-up-s-line green{% elif date.sum < 0 %}arrow-down-s-line red{% endif %}"></span> <td class="icon">
</td> <span class="ri-{% if date.sum > 0 %}arrow-up-s-line green{% elif date.sum < 0 %}arrow-down-s-line red{% endif %}"></span>
<th class="date" scope="row"> </td>
{% if date.has_transactions %} <th class="date" scope="row">
{% if account %} {% if date.has_transactions %}
<a href="{% url "account_transaction_month" account=account.pk year=date.month.year month=date.month.month %}">{{ date.month|date:"Y-m" }}</a> {% if account %}
{% elif category %} <a href="{% url "account_transaction_month" account=account.pk year=date.month.year month=date.month.month %}">{{ date.month|date:"Y-m" }}</a>
<a href="{% url "category_transaction_month" category=category.pk year=date.month.year month=date.month.month %}">{{ date.month|date:"Y-m" }}</a> {% elif category %}
<a href="{% url "category_transaction_month" category=category.pk year=date.month.year month=date.month.month %}">{{ date.month|date:"Y-m" }}</a>
{% else %}
<a href="{% url "transaction_month" year=date.month.year month=date.month.month %}">{{ date.month|date:"Y-m" }}</a>
{% endif %}
{% else %} {% else %}
<a href="{% url "transaction_month" year=date.month.year month=date.month.month %}">{{ date.month|date:"Y-m" }}</a> {{ date.month|date:"Y-m" }}
{% endif %} {% endif %}
{% else %} </th>
{{ date.month|date:"Y-m" }} <td class="value">{{ date.sum_m|pmrvalue }}</td>
{% endif %} <td class="bar m">
</th> {% if date.sum_m %}
<td class="value">{{ date.sum_m|pmrvalue }}</td> <div style="width: {% widthratio date.sum_m history.max -100 %}%"></div>
<td class="bar m"> {% endif %}
{% if date.sum_m %} {% if date.sum < 0 %}
<div style="width: {% widthratio date.sum_m history.max -100 %}%"></div> <div class="tot" style="width:{% widthratio date.sum history.max -100 %}%">
{% endif %} <span>{{ date.sum|pmrvalue }}</span>
{% if date.sum < 0 %} </div>
<div class="tot" style="width:{% widthratio date.sum history.max -100 %}%"> {% endif %}
<span>{{ date.sum|pmrvalue }}</span> </td>
</div> <td class="bar p">
{% endif %} {% if date.sum_p %}
</td> <div style="width: {% widthratio date.sum_p history.max 100 %}%"></div>
<td class="bar p"> {% endif %}
{% if date.sum_p %} {% if date.sum > 0 %}
<div style="width: {% widthratio date.sum_p history.max 100 %}%"></div> <div class="tot" style="width:{% widthratio date.sum history.max 100 %}%">
{% endif %} <span>{{ date.sum|pmrvalue }}</span>
{% if date.sum > 0 %} </div>
<div class="tot" style="width:{% widthratio date.sum history.max 100 %}%"> {% endif %}
<span>{{ date.sum|pmrvalue }}</span> </td>
</div> <td class="value">{{ date.sum_p|pmrvalue }}</td>
{% endif %} </tr>
</td> {% else %}
<td class="value">{{ date.sum_p|pmrvalue }}</td> <tr class="empty">
</tr> <td colspan="6" class="empty"></td>
{% else %} </tr>
<tr class="empty"> {% endif %}
<td colspan="6" class="empty"></td> {% endifchanged %}
</tr>
{% endif %}
{% endfor %} {% endfor %}
{% endfor %} {% endfor %}
{% endspaceless %} {% endspaceless %}

3
nummi/main/static/main/css/plot.css
View File

@ -66,6 +66,9 @@ table.full-width col.bar {
.plot tr.empty { .plot tr.empty {
height: 0.5rem; height: 0.5rem;
} }
.plot tr.even {
background: #eeeeff;
}
@media (width < 720px) { @media (width < 720px) {
.plot .bar { .plot .bar {

2
nummi/main/static/main/css/table.css
View File

@ -25,7 +25,7 @@ tr {
height: 2rem; height: 2rem;
line-height: 2rem; line-height: 2rem;
} }
tbody tr:nth-of-type(even) { .table tbody tr:nth-of-type(even) {
background: #eeeeff; background: #eeeeff;
} }
td, td,