Fix HTML for index page

This commit is contained in:
Edgar P. Burkhart 2023-12-29 09:50:08 +01:00
parent 8652eb0b57
commit 4bb682fc88
Signed by: edpibu
GPG key ID: 9833D3C5A25BD227
6 changed files with 64 additions and 48 deletions

View file

@ -41,7 +41,9 @@
</th> </th>
<td class="value">{{ date.sum_m|pmrvalue }}</td> <td class="value">{{ date.sum_m|pmrvalue }}</td>
<td class="bar m"> <td class="bar m">
{% if date.sum_m %}
<div style="width: {% widthratio date.sum_m history.max -100 %}%"></div> <div style="width: {% widthratio date.sum_m history.max -100 %}%"></div>
{% endif %}
{% if date.sum < 0 %} {% if date.sum < 0 %}
<div class="tot" style="width:{% widthratio date.sum history.max -100 %}%"> <div class="tot" style="width:{% widthratio date.sum history.max -100 %}%">
<span>{{ date.sum|pmrvalue }}</span> <span>{{ date.sum|pmrvalue }}</span>
@ -49,7 +51,9 @@
{% endif %} {% endif %}
</td> </td>
<td class="bar p"> <td class="bar p">
{% if date.sum_p %}
<div style="width: {% widthratio date.sum_p history.max 100 %}%"></div> <div style="width: {% widthratio date.sum_p history.max 100 %}%"></div>
{% endif %}
{% if date.sum > 0 %} {% if date.sum > 0 %}
<div class="tot" style="width:{% widthratio date.sum history.max 100 %}%"> <div class="tot" style="width:{% widthratio date.sum history.max 100 %}%">
<span>{{ date.sum|pmrvalue }}</span> <span>{{ date.sum|pmrvalue }}</span>
@ -60,7 +64,7 @@
</tr> </tr>
{% else %} {% else %}
<tr class="empty"> <tr class="empty">
<td colspan="5" class="empty"></td> <td colspan="6" class="empty"></td>
</tr> </tr>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
@ -94,6 +98,9 @@
<tr> <tr>
<th>{{ year.y }}</th> <th>{{ year.y }}</th>
{% for m in year.d %} {% for m in year.d %}
{% if forloop.parentloop.last and forloop.first %}
{% for _ in history.offset.0 %}<td></td>{% endfor %}
{% endif %}
{% if m %} {% if m %}
<td class="{% if m.sum > 0 %}p{% else %}m{% endif %}" <td class="{% if m.sum > 0 %}p{% else %}m{% endif %}"
style="opacity: calc( sin( abs({% widthratio m.sum history.years_max 100 %}) / 400 * 1turn ) )"> style="opacity: calc( sin( abs({% widthratio m.sum history.years_max 100 %}) / 400 * 1turn ) )">
@ -101,6 +108,9 @@
{% else %} {% else %}
<td></td> <td></td>
{% endif %} {% endif %}
{% if forloop.parentloop.first and forloop.last %}
{% for _ in history.offset.1 %}<td></td>{% endfor %}
{% endif %}
{% endfor %} {% endfor %}
</tr> </tr>
{% endfor %} {% endfor %}
@ -108,4 +118,3 @@
</tbody> </tbody>
</table> </table>
</div> </div>
{{ history.years|json_script }}

View file

@ -26,14 +26,13 @@ def history(transaction_set):
has_transactions=Value(1), has_transactions=Value(1),
).order_by("-month") ).order_by("-month")
return { _data = [
"years": [
{ {
"y": y, "y": y,
"d": [ "d": [
_history.filter(month=datetime.date(y, m + 1, 1)).first() _history.filter(month=datetime.date(y, m + 1, 1)).first()
for m in range( for m in range(
0, _first_month.month if _first_month.year == y else 0,
_last_month.month if _last_month.year == y else 12, _last_month.month if _last_month.year == y else 12,
) )
], ],
@ -42,7 +41,11 @@ def history(transaction_set):
_first_month.year, _first_month.year,
_last_month.year + 1, _last_month.year + 1,
) )
], ]
return {
"years": _data,
"offset": [range(_first_month.month), range(12 - _last_month.month)],
"max": max( "max": max(
_history.aggregate( _history.aggregate(
max=Max("sum_p", default=0), max=Max("sum_p", default=0),

View file

@ -3,15 +3,15 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1" /> <meta name="viewport" content="width=device-width,initial-scale=1">
<title> <title>
{% block title %}Nummi{% endblock %} {% block title %}Nummi{% endblock %}
</title> </title>
{% block link %} {% block link %}
<link rel="icon" href="{% static "main/svg/logo.svg" %}" type="image/svg+xml" /> <link rel="icon" href="{% static "main/svg/logo.svg" %}" type="image/svg+xml">
<link rel="stylesheet" href="{% static "main/css/main.css" %}" type="text/css" /> <link rel="stylesheet" href="{% static "main/css/main.css" %}" type="text/css">
<link rel="stylesheet" href="{% static "main/remixicon/remixicon.css" %}" type="text/css" /> <link rel="stylesheet" href="{% static "main/remixicon/remixicon.css" %}" type="text/css">
{% endblock %} {% endblock %}
</head> </head>
<body> <body>
@ -19,7 +19,7 @@
{% spaceless %} {% spaceless %}
<nav> <nav>
<h1> <h1>
<img src="{% static "main/svg/logo.svg" %}" alt="" /> <img src="{% static "main/svg/logo.svg" %}" alt="">
Nummi Nummi
</h1> </h1>
<ul> <ul>

View file

@ -6,10 +6,10 @@
{{ block.super }} {{ block.super }}
<link rel="stylesheet" <link rel="stylesheet"
href="{% static 'main/css/table.css' %}" href="{% static 'main/css/table.css' %}"
type="text/css" /> type="text/css">
<link rel="stylesheet" <link rel="stylesheet"
href="{% static 'main/css/plot.css' %}" href="{% static 'main/css/plot.css' %}"
type="text/css" /> type="text/css">
{% endblock %} {% endblock %}
{% block body %} {% block body %}
<h2>{% translate "Accounts" %}</h2> <h2>{% translate "Accounts" %}</h2>

View file

@ -17,6 +17,7 @@
<col class="value" span="3"> <col class="value" span="3">
</colgroup> </colgroup>
<thead> <thead>
<tr>
<th>{{ "check"|remix }}</th> <th>{{ "check"|remix }}</th>
<th>{{ "attachment"|remix }}</th> <th>{{ "attachment"|remix }}</th>
<th>{% translate "Date" %}</th> <th>{% translate "Date" %}</th>
@ -26,6 +27,7 @@
<th>{% translate "Value" %}</th> <th>{% translate "Value" %}</th>
<th>{% translate "Difference" %}</th> <th>{% translate "Difference" %}</th>
<th>{% translate "Transactions" %}</th> <th>{% translate "Transactions" %}</th>
</tr>
</thead> </thead>
<tbody> <tbody>
{% for snap in statements %} {% for snap in statements %}

View file

@ -23,6 +23,7 @@
{% endif %} {% endif %}
</colgroup> </colgroup>
<thead> <thead>
<tr>
<th>{{ "attachment"|remix }}</th> <th>{{ "attachment"|remix }}</th>
<th>{% translate "Date" %}</th> <th>{% translate "Date" %}</th>
<th>{% translate "Name" %}</th> <th>{% translate "Name" %}</th>
@ -34,6 +35,7 @@
{% if not account %} {% if not account %}
<th colspan="2">{% translate "Account" %}</th> <th colspan="2">{% translate "Account" %}</th>
{% endif %} {% endif %}
</tr>
</thead> </thead>
<tbody> <tbody>
{% for trans in transactions %} {% for trans in transactions %}