feat: Uebertraege lassen sich endlich bedienen

Der Uebertrags-Dienst und seine fuenf Endpunkte gab es seit Wochen – ohne
einen einzigen Aufrufer in der Oberflaeche. Man konnte also nirgends sagen,
dass zwei Buchungen derselbe Uebertrag sind, und eine gefundene Verknuepfung
auch nicht wieder loesen.

Jetzt: eine Karte "Moegliche Uebertraege" im Eingang mit beiden Seiten
nebeneinander, Verbinden und Ignorieren; in der Buchungsliste eine Marke mit
dem Gegenkonto und ein Knopf zum Loesen. Das Gegenkonto kommt vom Server mit –
die andere Buchung steht oft gar nicht in der gefilterten Liste, und
"Uebertrag" ohne Angabe wohin sagt nichts.

Ausserdem wird nach dem Buchen aus dem Eingang nach Uebertraegen gesucht, so
wie bisher nur nach einem Import. Seit die Bankanbindung ihre Umsaetze in den
Eingang legt, entsteht die Gegenseite naemlich erst dort; ohne diesen Aufruf
wuerde sie nie gefunden. Ein Fehler dabei kippt das Buchen nicht.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Guido
2026-08-26 23:13:40 +02:00
co-authored by Claude Opus 5
parent 63de8368f0
commit 2379cf4973
9 changed files with 297 additions and 9 deletions
+26 -1
View File
@@ -5,6 +5,8 @@ Einträge bleiben nach dem Buchen bestehen: Der spätere CSV-Import gleicht
gegen sie ab, damit dieselbe Zahlung nicht ein zweites Mal verbucht wird.
"""
import logging
from fastapi import APIRouter, Depends, HTTPException, status
from sqlalchemy.orm import Session
@@ -23,6 +25,8 @@ from ..schemas import ApiTokenCreate, ApiTokenCreated, ApiTokenOut, InboxItemOut
from ..security import generate_session_token, hash_session_token
from ..services import currency
log = logging.getLogger(__name__)
router = APIRouter(prefix="/inbox", tags=["inbox"])
@@ -115,6 +119,26 @@ def _buche(db: Session, user: User, eintrag: InboxItem) -> Transaction | None:
return txn
def _suche_uebertraege(db: Session, user: User) -> int:
"""Nach dem Buchen nach Uebertraegen sehen – so wie nach einem Import.
Seit die Bankanbindung ihre Umsaetze hierher legt, entsteht die Gegenseite
eines Uebertrags erst beim Buchen. Ohne diesen Aufruf wuerde sie nie
gefunden, und die beiden Seiten zaehlten dauerhaft in der Auswertung mit.
Ein Fehler hier darf das Buchen nicht kippen: Die Buchung ist schon
festgeschrieben, die Verknuepfung ist nur eine Schicht darueber.
"""
from ..services import uebertraege
try:
return uebertraege.finde(db, user).get("verknuepft", 0)
except Exception: # pragma: no cover - Sicherheitsnetz
log.exception("Uebertragssuche nach dem Buchen fehlgeschlagen")
db.rollback()
return 0
@router.post("/{item_id}/book", response_model=InboxItemOut)
def book_item(item_id: int, db: Session = Depends(get_db), user: User = Depends(get_current_user)):
eintrag = get_owned(db, InboxItem, item_id, user)
@@ -125,6 +149,7 @@ def book_item(item_id: int, db: Session = Depends(get_db), user: User = Depends(
raise HTTPException(status_code=status.HTTP_400_BAD_REQUEST,
detail="Lässt sich nicht buchen")
db.commit()
_suche_uebertraege(db, user)
db.refresh(eintrag)
return eintrag
@@ -145,7 +170,7 @@ def book_all(db: Session = Depends(get_db), user: User = Depends(get_current_use
)
gebucht = sum(1 for e in offen if _buche(db, user, e) is not None)
db.commit()
return {"gebucht": gebucht}
return {"gebucht": gebucht, "uebertraege": _suche_uebertraege(db, user)}
@router.delete("/{item_id}", status_code=status.HTTP_204_NO_CONTENT)
+24 -6
View File
@@ -297,13 +297,31 @@ def verbinde(db: Session, user: User, a: Transaction, b: Transaction,
def linkliste(db: Session, user: User) -> dict[int, dict]:
"""Je Buchungs-ID die Gegenseite – für die Anzeige in der Buchungsliste."""
"""Je Buchungs-ID die Gegenseite – für die Anzeige in der Buchungsliste.
Das Gegenkonto kommt mit: Die andere Buchung steht oft gar nicht in der
gerade gefilterten Liste, und „Übertrag" ohne Angabe wohin sagt nichts.
"""
links = db.query(TransferLink).filter(TransferLink.owner_id == user.id).all()
beteiligt = {i for l in links for i in (l.from_txn_id, l.to_txn_id)}
# Einmal nachschlagen statt je Verknüpfung – die Liste kann lang werden.
konto_von = dict(
db.query(Transaction.id, Transaction.account_id)
.filter(Transaction.id.in_(beteiligt or [0]))
.all()
)
ergebnis: dict[int, dict] = {}
for link in db.query(TransferLink).filter(TransferLink.owner_id == user.id):
ergebnis[link.from_txn_id] = {"link_id": link.id, "other_id": link.to_txn_id,
"richtung": "raus", "automatisch": link.automatisch}
ergebnis[link.to_txn_id] = {"link_id": link.id, "other_id": link.from_txn_id,
"richtung": "rein", "automatisch": link.automatisch}
for link in links:
for eigen, gegen, richtung in (
(link.from_txn_id, link.to_txn_id, "raus"),
(link.to_txn_id, link.from_txn_id, "rein"),
):
ergebnis[eigen] = {
"link_id": link.id, "other_id": gegen, "richtung": richtung,
"other_account_id": konto_von.get(gegen),
"automatisch": link.automatisch,
}
return ergebnis
+12
View File
@@ -204,6 +204,18 @@ export const api = {
bankCallback: (state, code) =>
request(`/bank/callback?state=${encodeURIComponent(state)}&code=${encodeURIComponent(code)}`,
{ method: "POST" }),
// --- Überträge zwischen eigenen Konten -----------------------------------
// Ändern ausschliesslich die Verknüpfungs-Schicht. Keine Buchung wird
// angefasst – deshalb ist auch eine falsche Verknüpfung folgenlos.
transactionLinks: () => request("/transactions/links"),
searchTransfers: () => request("/uebertraege/suchen", { method: "POST" }),
connectTransfer: (a_id, b_id) =>
request("/uebertraege/verbinden", { method: "POST", body: { a_id, b_id } }),
releaseTransfer: (linkId) =>
request(`/uebertraege/${linkId}`, { method: "DELETE" }),
ignoreTransfer: (a_id, b_id) =>
request("/uebertraege/ignorieren", { method: "POST", body: { a_id, b_id } }),
listBankConnections: () => request("/bank/connections"),
syncBankConnection: (id) => request(`/bank/connections/${id}/sync`, { method: "POST" }),
refreshBankBalances: (id) =>
@@ -0,0 +1,123 @@
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { api } from "../api";
import Icon from "../components/Icon";
import Money from "../components/Money";
import { useToast } from "../toast";
import { formatDate } from "../format";
// Paare, die zusammengehören könnten: ein Abgang auf dem einen Konto, ein
// Zugang auf dem anderen. Verbinden ändert KEINE Buchung – es setzt nur einen
// Vermerk, dass die beiden dasselbe Geld sind. Beide bleiben mit Betrag,
// Kategorie und Import-Schlüssel stehen; sie fallen nur aus der Auswertung.
// Deshalb ist auch eine falsche Verknüpfung folgenlos: Lösen stellt alles her.
export default function Uebertragsvorschlaege({ baseCurrency, onChange }) {
const { t } = useTranslation();
const { toast } = useToast();
const [stand, setStand] = useState(null); // { verknuepft, vorschlaege }
const [busy, setBusy] = useState(false);
async function suchen(melden = false) {
setBusy(true);
try {
const r = await api.searchTransfers();
setStand(r);
if (melden) {
toast(t("transfers.searched", {
verknuepft: r.verknuepft, offen: r.vorschlaege.length,
}));
}
if (r.verknuepft > 0) onChange?.();
} catch (e) {
toast(e.message, "error");
} finally {
setBusy(false);
}
}
useEffect(() => { suchen(false); }, []);
async function verbinden(paar) {
try {
await api.connectTransfer(paar.a.id, paar.b.id);
onChange?.();
suchen(false);
} catch (e) {
toast(e.message, "error");
}
}
async function ignorieren(paar) {
try {
await api.ignoreTransfer(paar.a.id, paar.b.id);
suchen(false);
} catch (e) {
toast(e.message, "error");
}
}
// Vor dem ersten Ergebnis keine leere Karte zeigen.
if (stand === null) return null;
if (stand.vorschlaege.length === 0) return null;
return (
<div className="card">
<div className="card-head">
<Icon name="arrow-left-right" size={18} />
<h2>{t("transfers.title")}</h2>
<button className="btn sm" disabled={busy} onClick={() => suchen(true)}>
{t("transfers.search")}
</button>
</div>
<p className="muted small">{t("transfers.intro")}</p>
<div className="account-list">
{stand.vorschlaege.map((paar) => {
const mitKategorie = paar.a.category_id != null || paar.b.category_id != null;
return (
<div className="uebertrag-vorschlag" key={`${paar.a.id}-${paar.b.id}`}>
<div className="uebertrag-seiten">
<Seite seite={paar.a} baseCurrency={baseCurrency} />
<Icon name="arrow-left-right" size={16} className="uebertrag-pfeil" />
<Seite seite={paar.b} baseCurrency={baseCurrency} />
</div>
{/* Eine zugeordnete Buchung faellt durchs Verbinden aus dem
Budget. Das soll niemanden ueberraschen. */}
{mitKategorie && (
<p className="muted small" style={{ margin: "4px 0 0" }}>
{t("transfers.hasCategory")}
</p>
)}
<div className="btn-pair" style={{ marginTop: "var(--sp-2)" }}>
<button className="btn sm primary" onClick={() => verbinden(paar)}>
<Icon name="arrow-left-right" size={14} /> {t("transfers.connect")}
</button>
<button className="btn sm ghost" onClick={() => ignorieren(paar)}>
{t("transfers.ignore")}
</button>
</div>
</div>
);
})}
</div>
</div>
);
}
function Seite({ seite, baseCurrency }) {
return (
<div className="uebertrag-seite selectable">
<div className="named-sub">
<span className="nowrap">{formatDate(seite.date)}</span>
{" · "}
<span className="nowrap">{seite.account_name}</span>
</div>
<div><strong>{seite.payee || seite.description || "—"}</strong></div>
<Money cents={seite.amount_cents} currency={seite.currency}
sign={seite.type === "expense" ? "neg" : "pos"}
baseCurrency={baseCurrency} />
</div>
);
}
+41
View File
@@ -1153,3 +1153,44 @@ tr.row-dup {
fehlende oder doppelte Buchung – deshalb warnend, nicht rot. */
.saldo-ok { color: var(--ok); }
.saldo-abweichung { color: var(--warn); font-weight: 560; }
/* ---------- Übertrags-Vorschläge ---------- */
.uebertrag-vorschlag {
padding: var(--sp-3) 0;
border-bottom: 1px solid var(--border);
}
.uebertrag-vorschlag:last-child {
border-bottom: none;
}
/* Die beiden Seiten nebeneinander, damit man sie vergleicht statt sie zu
lesen. Auf schmalen Schirmen untereinander – gestapelt bleibt der Vergleich
möglich, gequetscht nicht. */
.uebertrag-seiten {
display: flex;
align-items: center;
gap: var(--sp-3);
}
.uebertrag-seite {
flex: 1 1 0;
min-width: 0;
}
.uebertrag-pfeil {
flex: 0 0 auto;
color: var(--muted);
}
@media (max-width: 820px) {
.uebertrag-seiten {
flex-direction: column;
align-items: stretch;
gap: var(--sp-2);
}
}
/* Übertrags-Marke in der Buchungsliste: gedämpft, nicht warnend – die Buchung
ist in Ordnung, sie zählt nur nicht als Ausgabe oder Einnahme. */
.uebertrag-marke {
display: flex;
align-items: center;
gap: 4px;
color: var(--accent);
}
+12
View File
@@ -633,5 +633,17 @@
"noAccounts": "Verbunden, aber die Bank hat kein Konto übermittelt",
"noAccountsHint": "Im eingeschränkten Betrieb gibt die Bank nur Konten heraus, die du bei Enable Banking selbst verknüpft hast. Öffne dort deine Anwendung, drück „Activate by linking accounts“ und wähle diese Bank – danach hier noch einmal verbinden.",
"noAccountsDropped": "Die Bank hat {{n}} Einträge geschickt, aber ohne Kennung – damit lässt sich nichts abrufen. Das ist ein Fall für den Support von Enable Banking; schick mir die Meldung, dann formuliere ich die Anfrage."
},
"transfers": {
"title": "Mögliche Überträge",
"intro": "Ein Abgang hier, ein Zugang dort – vermutlich dasselbe Geld. Verbinden ändert keine Buchung: Beide bleiben stehen und zählen nur nicht mehr als Ausgabe und Einnahme. Lösen stellt alles wieder her.",
"search": "Neu suchen",
"searched": "{{verknuepft}} verbunden, {{offen}} zum Ansehen.",
"connect": "Verbinden",
"ignore": "Ignorieren",
"hasCategory": "Eine der beiden hat eine Kategorie – sie fällt durchs Verbinden aus der Auswertung.",
"linked": "Übertrag",
"release": "Verknüpfung lösen",
"releaseConfirm": "Die beiden Buchungen bleiben unverändert stehen und zählen danach wieder als Ausgabe und Einnahme."
}
}
+12
View File
@@ -633,5 +633,17 @@
"noAccounts": "Connected, but the bank returned no account",
"noAccountsHint": "In restricted mode the bank only releases accounts you linked at Enable Banking yourself. Open your application there, press “Activate by linking accounts” and pick this bank – then connect again here.",
"noAccountsDropped": "The bank sent {{n}} entries but without an identifier, so nothing can be fetched. That is one for Enable Banking support; send me the message and I will draft the question."
},
"transfers": {
"title": "Possible transfers",
"intro": "Money out here, money in there – probably the same money. Connecting changes no transaction: both stay put and simply stop counting as expense and income. Releasing restores everything.",
"search": "Search again",
"searched": "{{verknuepft}} connected, {{offen}} to review.",
"connect": "Connect",
"ignore": "Ignore",
"hasCategory": "One of them has a category – connecting takes it out of the evaluation.",
"linked": "Transfer",
"release": "Release link",
"releaseConfirm": "Both transactions stay exactly as they are and count as expense and income again afterwards."
}
}
+5
View File
@@ -6,6 +6,7 @@ import CategorySelect from "../components/CategorySelect";
import Icon from "../components/Icon";
import IconChip from "../components/IconChip";
import Money from "../components/Money";
import Uebertragsvorschlaege from "../components/Uebertragsvorschlaege";
import { useToast } from "../toast";
import { useConfirm } from "../confirm";
import { useSettings } from "../settings";
@@ -102,6 +103,10 @@ export default function Eingang() {
)}
</div>
{/* Nach dem Buchen entsteht die Gegenseite eines Übertrags erst –
deshalb steht der Vorschlag hier und nicht in der Buchungsliste. */}
<Uebertragsvorschlaege baseCurrency={baseCurrency} onChange={laden} />
{rows.length === 0 ? (
<div className="card"><div className="empty-state">{t("inbox.empty")}</div></div>
) : (
+42 -2
View File
@@ -41,6 +41,8 @@ export default function Transactions() {
const toast = useToast();
const [txns, setTxns] = useState([]);
// Je Buchungs-ID die Gegenseite, falls sie Teil eines Übertrags ist.
const [links, setLinks] = useState({});
const [accounts, setAccounts] = useState([]);
const [groups, setGroups] = useState([]);
const [filter, setFilter] = useState({ account_id: "", type: "" });
@@ -66,7 +68,30 @@ export default function Transactions() {
}
async function ladenBuchungen() {
try {
setTxns(await api.listTransactions({ account_id: filter.account_id, type: filter.type }));
// Verknüpfungen getrennt: Sie sind eine Schicht über den Buchungen,
// kein Feld an ihnen – deshalb auch ein eigener Abruf.
const [liste, verkn] = await Promise.all([
api.listTransactions({ account_id: filter.account_id, type: filter.type }),
api.transactionLinks().catch(() => ({})),
]);
setTxns(liste);
setLinks(verkn);
} catch (err) {
toast(err.message, "error");
}
}
async function loesen(tx) {
const link = links[String(tx.id)];
if (!link) return;
if (!(await confirm({
title: t("transfers.release"),
message: t("transfers.releaseConfirm"),
confirmLabel: t("transfers.release"),
}))) return;
try {
await api.releaseTransfer(link.link_id);
ladenBuchungen();
} catch (err) {
toast(err.message, "error");
}
@@ -218,6 +243,15 @@ export default function Transactions() {
<div className="named-text">
<div className="ellipsis">{l.title}</div>
{l.sub && <div className="named-sub ellipsis">{l.sub}</div>}
{/* Verknüpft heisst: zählt nicht als Ausgabe oder Einnahme.
Ohne das Gegenkonto sagt „Übertrag" nichts. */}
{links[String(tx.id)] && (
<div className="named-sub ellipsis uebertrag-marke">
<Icon name="arrow-left-right" size={12} />{" "}
{accountById[links[String(tx.id)].other_account_id]?.name
|| t("transfers.linked")}
</div>
)}
</div>
</div>
);
@@ -247,6 +281,12 @@ export default function Transactions() {
<button className="btn sm ghost" title={t("common.edit")} onClick={() => openEdit(tx)}>
<Icon name="edit" size={14} />
</button>
{links[String(tx.id)] && (
<button className="btn sm ghost" title={t("transfers.release")}
onClick={() => loesen(tx)}>
<Icon name="arrow-left-right" size={14} />
</button>
)}
<button className="btn sm danger" title={t("common.delete")} onClick={() => loeschen(tx)}>
<Icon name="trash" size={14} />
</button>
@@ -254,7 +294,7 @@ export default function Transactions() {
),
},
// eslint-disable-next-line react-hooks/exhaustive-deps
], [accountById, categoryById, baseCurrency, formatDate, t]);
], [accountById, categoryById, baseCurrency, formatDate, links, t]);
return (
<div>