75 lines
2.6 KiB
HTML
75 lines
2.6 KiB
HTML
{% extends "base.html" %}
|
||
{% block title %}Import – Finanzberatung{% endblock %}
|
||
{% block content %}
|
||
<h1>Import</h1>
|
||
|
||
<div id="dropzone">
|
||
Kontoumsatz-CSV oder Kontoauszug-PDF hier ablegen oder klicken zum Hochladen
|
||
<input type="file" id="file-input" accept=".csv,.pdf,application/pdf,text/csv" style="display:none">
|
||
</div>
|
||
<button type="button" hx-post="/api/imports/scan-inbox" hx-swap="none"
|
||
hx-on::after-request="if(event.detail.successful){htmx.trigger(document.getElementById('imports'), 'refresh')}">
|
||
Inbox scannen
|
||
</button>
|
||
<p class="muted">Durchsucht <code>~/.local/share/finance_pod/data/inbox/</code> nach neuen CSV- oder PDF-Kontoauszügen.</p>
|
||
<p id="upload-message"></p>
|
||
|
||
<h2>Importe</h2>
|
||
<div id="imports" hx-get="/import/list" hx-trigger="every 5s, refresh" hx-swap="innerHTML">
|
||
{% include "_import_list.html" %}
|
||
</div>
|
||
|
||
<script>
|
||
(function () {
|
||
var dropzone = document.getElementById('dropzone');
|
||
var fileInput = document.getElementById('file-input');
|
||
var message = document.getElementById('upload-message');
|
||
|
||
function refreshImports() {
|
||
htmx.trigger(document.getElementById('imports'), 'refresh');
|
||
}
|
||
|
||
function uploadFile(file) {
|
||
if (!file) return;
|
||
var fd = new FormData();
|
||
fd.append('file', file);
|
||
message.textContent = 'Lade hoch: ' + file.name + ' …';
|
||
fetch('/api/imports/upload', { method: 'POST', body: fd })
|
||
.then(function (resp) {
|
||
return resp.json().then(function (data) { return { ok: resp.ok, data: data }; });
|
||
})
|
||
.then(function (result) {
|
||
if (result.ok) {
|
||
message.textContent = 'Hochgeladen: ' + file.name + ' – Status: ' + result.data.status;
|
||
} else {
|
||
message.textContent = 'Fehler beim Hochladen: ' + (result.data.detail || 'unbekannter Fehler');
|
||
}
|
||
refreshImports();
|
||
})
|
||
.catch(function (err) {
|
||
message.textContent = 'Fehler beim Hochladen: ' + err;
|
||
});
|
||
}
|
||
|
||
dropzone.addEventListener('click', function () { fileInput.click(); });
|
||
fileInput.addEventListener('change', function () {
|
||
uploadFile(fileInput.files[0]);
|
||
fileInput.value = '';
|
||
});
|
||
dropzone.addEventListener('dragover', function (e) {
|
||
e.preventDefault();
|
||
dropzone.classList.add('dragover');
|
||
});
|
||
dropzone.addEventListener('dragleave', function () {
|
||
dropzone.classList.remove('dragover');
|
||
});
|
||
dropzone.addEventListener('drop', function (e) {
|
||
e.preventDefault();
|
||
dropzone.classList.remove('dragover');
|
||
var file = e.dataTransfer.files && e.dataTransfer.files[0];
|
||
uploadFile(file);
|
||
});
|
||
})();
|
||
</script>
|
||
{% endblock %}
|