Added navigation to account view

This commit is contained in:
Manuel Forcén Muñoz 2024-03-20 20:26:28 +01:00
parent d1e736d7a7
commit cf7fc2ec87
4 changed files with 76 additions and 26 deletions

View file

@ -9,22 +9,57 @@
</div>
<div>
<table>
<tr>
<th>Description</th>
<th>Date</th>
<th>Amount</th>
<th>Category</th>
</tr>
{% for tx in transactions %}
<tr>
<td>{{tx.description}}</td>
<td>{{tx.transaction_timestamp}}</td>
<td>{{tx.amount/100}}</td>
<td>{{tx.category}}</td>
</tr>
{% endfor %}
<thead>
<tr>
<th>Description</th>
<th>Date</th>
<th>Amount</th>
<th>Category</th>
</tr>
</thead>
<tbody>
{% for tx in transactions %}
<tr>
<td>{{tx.description}}</td>
<td>{{tx.transaction_timestamp}}</td>
<td>{{tx.amount/100}}</td>
<td>{{tx.category}}</td>
</tr>
{% endfor %}
</tbody>
</table>
<p>Loaded {{n_txs}} transactions</p>
<div class="flex">
<div class="flex grow flex-row justify-evenly">
<div>
<a href="/accounts/id/{{account.account_id}}?entries={{n_entries}}&page={{prev_page}}">&lt;</a>
</div>
<div>{{curr_page}}</div>
<div>
<a href="/accounts/id/{{account.account_id}}?entries={{n_entries}}&page={{next_page}}">&gt;</a>
</div>
</div>
<div>
<select onchange="onSelect(event)">
<option {% if n_entries == 10 %}selected="selected"{% endif %}>10</option>
<option {% if n_entries == 20 %}selected="selected"{% endif %}>20</option>
<option {% if n_entries == 50 %}selected="selected"{% endif %}>50</option>
<option {% if n_entries == 100 %}selected="selected"{% endif %}>100</option>
<option {% if n_entries == 200 %}selected="selected"{% endif %}>200</option>
</select>
</div>
</div>
</div>
<style>
table {
border-spacing: 0.2rem;
}
</style>
<script>
function onSelect(e) {
let params = new URLSearchParams();
params.set("entries", e.target.value);
window.location.search = params.toString();
}
</script>
{% endblock body %}

View file

@ -28,19 +28,19 @@
['None', null],
['Date dd/mm/yyyy', el => {
let split = el.split('/');
return new Date(
return new Date(Date.UTC(
parseInt(split[2], 10),
parseInt(split[1], 10),
parseInt(split[1], 10)-1,
parseInt(split[0], 10),
);
));
}],
['Date yyyy/mm/dd', el => {
let split = el.split('/');
return new Date(
return new Date(Date.UTC(
parseInt(split[0], 10),
parseInt(split[1], 10),
parseInt(split[1], 10)-1,
parseInt(split[2], 10),
);
));
}],
['Description', el => el],
['Amount', el => parseFloat(el)]