DrCr/drcr/templates/statements/statement_lines.html

{#  DrCr: Web-based double-entry bookkeeping framework
    Copyright (C) 2022–2023  Lee Yingtong Li (RunasSudo)

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU Affero General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU Affero General Public License for more details.

    You should have received a copy of the GNU Affero General Public License
    along with this program.  If not, see <https://www.gnu.org/licenses/>.
#}

{% extends 'base.html' %}
{% block title %}Statement lines{% endblock %}

{% block content %}
	<h1 class="h2 my-4">Statement lines</h1>
	
	<form method="POST">
		<div class="mb-2 d-flex">
			{#<button type="submit" class="btn btn-outline-secondary" formaction="/statement-lines/reconcile-transfer">Reconcile selected as transfer</button>#}
			<div class="flex-grow-1">
				<a href="/statement-lines/import" class="btn btn-outline-secondary">Import statement</a>
			</div>
			<nav class="flex-end">
				<ul class="pagination">
					{% if page.prev_num %}<li class="page-item"><a class="page-link" href="?page={{ page.prev_num }}">&lsaquo;</a></li>{% endif %}
					{% for pageno in page.iter_pages() %}
						{% if pageno %}
							<li class="page-item{% if pageno == page.page %} active{% endif %}"><a class="page-link" href="?page={{ pageno }}">{{ pageno }}</a></li>
						{% else %}
							<li class="page-item disabled"><a class="page-link">…</a></li>
						{% endif %}
					{% endfor %}
					{% if page.next_num %}<li class="page-item"><a class="page-link" href="?page={{ page.next_num }}">&rsaquo;</a></li>{% endif %}
				</ul>
			</nav>
		</div>
		
		<table class="table">
			<thead>
				<tr>
					<th></th>
					<th>Source account</th>
					<th>Date</th>
					<th>Description</th>
					<th>Charged to</th>
					<th class="text-end">Dr</th>
					<th class="text-end">Cr</th>
					<th class="text-end">Balance</th>
				</tr>
			</thead>
			<tbody>
				{% for line in page.items %}
					<tr data-line-id="{{ line.id }}">
						<td><input type="checkbox" name="sel-line-id" value="{{ line.id }}"></td>
						<td>{{ line.source_account }}</td>
						<td>{{ line.dt.strftime('%Y-%m-%d') }}</td>
						<td>{{ line.description }}</td>
						<td class="charge-account">
							{% if not line.reconciliation %}
								<a href="#" class="text-danger" onclick="classifyLine({{ line.id }});return false;">Unclassified</a>
								{# TODO #}
							{% elif line.is_complex() %}
								<i>(Complex)</i>
								<a href="/journal/edit-transaction?id={{ line.reconciliation.posting.transaction.id }}" class="text-muted"><i class="bi bi-pencil"></i></a>
							{% else %}
								{% for posting in line.reconciliation.posting.transaction.postings if posting.account != line.source_account %}
									<a href="#" class="text-body" onclick="classifyLine({{ line.id }});return false;">{{ posting.account }}</a>
								{% endfor %}
								<a href="/journal/edit-transaction?id={{ line.reconciliation.posting.transaction.id }}" class="text-muted"><i class="bi bi-pencil"></i></a>
							{% endif %}
						</td>
						<td class="text-end">{{ line.amount().format() if line.quantity >= 0 else '' }}</td>
						<td class="text-end">{{ (line.amount()|abs).format() if line.quantity < 0 else '' }}</td>
						<td class="text-end">{{ line.balance or '' }}</td>
					</tr>
				{% endfor %}
			</tbody>
		</table>
	</form>
{% endblock %}

{% block scripts %}
	<script>
		function classifyLine(lineId) {
			let chargeAccount = prompt('Charge to:');
			if (!chargeAccount) {
				return;
			}
			
			const xhr = new XMLHttpRequest();
			xhr.addEventListener('load', function() {
				if (xhr.status === 200) {
					document.querySelector('[data-line-id="' + lineId + '"] .charge-account a').innerText = chargeAccount;
					document.querySelector('[data-line-id="' + lineId + '"] .charge-account a').className = 'text-body';
				} else {
					alert('Error when charging statement line');
				}
			});
			xhr.open('POST', '/statement-lines/charge');
			xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
			xhr.send('line-id=' + lineId + '&charge-account=' + chargeAccount);
		}
	</script>
{% endblock %}