feat: Eine Kreditkarte ist eine Schuld – der Rahmen ist kein Guthaben
Wer seinen Kreditrahmen festhalten wollte, hatte dafuer nur den
Anfangssaldo. Also standen dort 2.500, und Certain meldete ein Vermoegen,
das es nicht gibt: Das Geld ist nicht da, es darf nur ausgegeben werden.
Jetzt hat der Rahmen ein eigenes Feld – sichtbar nur bei Kreditkarten,
denn an einem Girokonto gaebe es nichts zu begrenzen. Die Kontokarte
zeigt daneben, was noch geht ("noch 1.754,50 von 2.500,00 frei") und
warnt, wenn der Rahmen ueberzogen ist.
Der Saldo selbst bleibt, was er ist: abbezahlt null, jede Ausgabe ins
Minus, die Rechnung holt ihn zurueck. Gerechnet werden musste dafuer
nichts neu – die Saldenrechnung war schon vorzeichenoffen.
Zwei Dinge fielen dabei auf und sind miterledigt:
- Die Summe "Gesamt" auf der Kontenseite zaehlte archivierte Konten mit,
das Backend nicht. Zwei Zahlen fuer dieselbe Sache.
- "Gesamt" wurde ungefaerbt ausgegeben. Solange nur Guthaben
zusammenkamen, fiel das nicht auf; mit einer Kartenschuld stuende ein
negatives Gesamt still und unauffaellig da.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
co-authored by
Claude Opus 5
Claude Opus 5
parent
152483707e
commit
38697f828e
@@ -49,7 +49,9 @@ function AccountBalances() {
|
||||
))}
|
||||
<div className="dash-total">
|
||||
<span className="grow">{t("cards.total")}</span>
|
||||
<strong>{formatMoney(data.total, data.currency)}</strong>
|
||||
{/* Mit einer Kreditkartenschuld kann diese Summe negativ werden.
|
||||
formatMoney allein faerbt nicht – das Minus stuende still da. */}
|
||||
<strong><Money cents={data.total} currency={data.currency} /></strong>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -1164,6 +1164,31 @@ tr.row-dup {
|
||||
.saldo-ok { color: var(--ok); }
|
||||
.saldo-abweichung { color: var(--warn); font-weight: 560; }
|
||||
|
||||
/* ---------- Kreditrahmen ----------
|
||||
Wie viel von der Karte noch uebrig ist. Der Balken faellt bewusst schmal
|
||||
aus: Er begleitet den Saldo, er ersetzt ihn nicht. Neutral gefaerbt, denn
|
||||
einen Rahmen auszunutzen ist nicht falsch – erst ihn zu ueberziehen. */
|
||||
.kreditrahmen {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
margin-top: 3px;
|
||||
}
|
||||
.rahmen-balken {
|
||||
flex: 0 0 64px;
|
||||
height: 5px;
|
||||
background: var(--surface-2);
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.rahmen-fuellung {
|
||||
height: 100%;
|
||||
background: var(--muted);
|
||||
border-radius: 3px;
|
||||
transition: width 0.2s;
|
||||
}
|
||||
.rahmen-balken.ueber .rahmen-fuellung { background: var(--warn); }
|
||||
|
||||
/* ---------- Übertrags-Vorschläge ---------- */
|
||||
.uebertrag-vorschlag {
|
||||
padding: var(--sp-3) 0;
|
||||
|
||||
@@ -180,6 +180,11 @@
|
||||
"empty": "Noch keine Konten. Lege dein erstes Konto an.",
|
||||
"deleteConfirm": "Dieses Konto und alle zugehörigen Buchungen löschen?",
|
||||
"openingDateHint": "Stand am Ende dieses Tages. Buchungen bis dahin zählen nicht zum Kontostand, bleiben aber in Liste und Auswertungen. Ohne Stichtag zählt alles.",
|
||||
"creditLimit": "Kreditrahmen",
|
||||
"creditLimitNone": "kein Rahmen hinterlegt",
|
||||
"creditLimitHint": "Was die Karte ausgeben darf – kein Guthaben. Der Kontostand gehört nicht hierher: Eine abbezahlte Karte steht auf 0, jede Ausgabe drückt sie ins Minus, die Rechnung holt sie zurück.",
|
||||
"creditLimitLeft": "noch {{left}} von {{limit}} frei",
|
||||
"creditLimitExceeded": "{{over}} über dem Rahmen von {{limit}}",
|
||||
"savingsCategory": "Sparen gegen Kategorie",
|
||||
"savingsCategoryNone": "Kein Sparziel",
|
||||
"savingsCategoryHint": "Überweisungen auf dieses Konto zählen im Budget als Sparen gegen diese Kategorie – auch dann, wenn sie über die Bank als zwei verknüpfte Buchungen hereinkommen. Einzelne Buchungen lassen sich davon ausnehmen.",
|
||||
|
||||
@@ -180,6 +180,11 @@
|
||||
"empty": "No accounts yet. Create your first account.",
|
||||
"deleteConfirm": "Delete this account and all its transactions?",
|
||||
"openingDateHint": "Balance at the end of that day. Bookings up to then don't count toward the balance but stay in the list and reports. Without a date, everything counts.",
|
||||
"creditLimit": "Credit limit",
|
||||
"creditLimitNone": "no limit set",
|
||||
"creditLimitHint": "What the card may spend — not money you have. The balance does not belong here: a paid-off card sits at 0, every purchase pushes it negative, and the bill brings it back.",
|
||||
"creditLimitLeft": "{{left}} of {{limit}} left",
|
||||
"creditLimitExceeded": "{{over}} over the {{limit}} limit",
|
||||
"savingsCategory": "Count savings towards",
|
||||
"savingsCategoryNone": "Not a savings account",
|
||||
"savingsCategoryHint": "Transfers into this account count as savings against this category in the budget – including those that arrive from the bank as two linked transactions. Individual transactions can be excluded.",
|
||||
|
||||
@@ -33,6 +33,7 @@ function emptyForm() {
|
||||
color: "#3f51b5",
|
||||
opening_balance: "",
|
||||
opening_date: "",
|
||||
credit_limit: "",
|
||||
savings_category_id: "",
|
||||
identifiers: [],
|
||||
};
|
||||
@@ -257,6 +258,8 @@ export default function Accounts() {
|
||||
color: acc.color,
|
||||
opening_balance: centsToInput(acc.opening_balance_cents),
|
||||
opening_date: acc.opening_date || "",
|
||||
credit_limit: acc.credit_limit_cents != null
|
||||
? centsToInput(acc.credit_limit_cents) : "",
|
||||
savings_category_id: acc.savings_category_id ? String(acc.savings_category_id) : "",
|
||||
identifiers: acc.identifiers.map((i) => ({ kind: i.kind, value: i.value })),
|
||||
});
|
||||
@@ -282,6 +285,10 @@ export default function Accounts() {
|
||||
color: form.color,
|
||||
opening_balance_cents: parseAmountToCents(form.opening_balance) ?? 0,
|
||||
opening_date: form.opening_date || null,
|
||||
// Ausdruecklich null bei jedem anderen Typ: Wer eine Kreditkarte zum
|
||||
// Girokonto macht, soll den Rahmen nicht unsichtbar mitschleppen.
|
||||
credit_limit_cents: form.type === "kreditkarte"
|
||||
? (parseAmountToCents(form.credit_limit) ?? null) : null,
|
||||
savings_category_id: form.savings_category_id ? Number(form.savings_category_id) : null,
|
||||
identifiers: form.identifiers
|
||||
.filter((i) => i.value.trim())
|
||||
@@ -326,7 +333,12 @@ export default function Accounts() {
|
||||
}
|
||||
}
|
||||
|
||||
const total = accounts.reduce((s, a) => s + a.balance_base_cents, 0);
|
||||
// Archivierte bleiben draussen – das Backend rechnet ebenso
|
||||
// (balances.net_worth_cents, dashboard.py). Zwei Zahlen fuer dieselbe Sache
|
||||
// sind eine Zahl zu viel.
|
||||
const total = accounts
|
||||
.filter((a) => !a.is_archived)
|
||||
.reduce((s, a) => s + a.balance_base_cents, 0);
|
||||
|
||||
return (
|
||||
<div>
|
||||
@@ -343,7 +355,7 @@ export default function Accounts() {
|
||||
<div className="card">
|
||||
<div className="account-total">
|
||||
<span className="muted">{t("accounts.total")}</span>
|
||||
<strong>{formatMoney(total, baseCurrency)}</strong>
|
||||
<strong><Money cents={total} currency={baseCurrency} /></strong>
|
||||
</div>
|
||||
<div className="account-list">
|
||||
{accounts.map((a, i) => (
|
||||
@@ -359,6 +371,7 @@ export default function Accounts() {
|
||||
{a.identifiers.length > 0
|
||||
&& ` · ${t("accounts.identShort", { count: a.identifiers.length })}`}
|
||||
</div>
|
||||
<Kreditrahmen account={a} t={t} />
|
||||
{/* Bei angebundenen Konten der Saldo, den die Bank fuehrt.
|
||||
Er ersetzt die eigene Rechnung nicht, er prueft sie: Eine
|
||||
Abweichung heisst, dass eine Buchung fehlt oder doppelt
|
||||
@@ -488,6 +501,20 @@ export default function Accounts() {
|
||||
</div>
|
||||
<p className="muted small">{t("accounts.openingDateHint")}</p>
|
||||
|
||||
{/* Nur bei Kreditkarten: An einem Girokonto gaebe es nichts zu
|
||||
begrenzen, und das Feld waere nur ein weiteres Bedienelement. */}
|
||||
{form.type === "kreditkarte" && (
|
||||
<>
|
||||
<label>
|
||||
<span>{t("accounts.creditLimit")} ({form.currency})</span>
|
||||
<input inputMode="decimal" value={form.credit_limit}
|
||||
onChange={(e) => setForm({ ...form, credit_limit: e.target.value })}
|
||||
placeholder={t("accounts.creditLimitNone")} />
|
||||
</label>
|
||||
<p className="muted small">{t("accounts.creditLimitHint")}</p>
|
||||
</>
|
||||
)}
|
||||
|
||||
<label>
|
||||
<span>{t("accounts.savingsCategory")}</span>
|
||||
<CategorySelect
|
||||
@@ -563,6 +590,44 @@ export default function Accounts() {
|
||||
// Woraus sich ein Kontostand zusammensetzt. Stimmt er nicht, liegt es fast
|
||||
// immer an einer dieser Zahlen oder an einem Übertrag, der zu viel oder zu
|
||||
// wenig verschiebt – dann sieht man hier sofort, welcher Teil nicht passt.
|
||||
// Was von der Karte noch uebrig ist.
|
||||
//
|
||||
// Eine Kreditkarte ist kein Konto mit Geld darauf: Abbezahlt steht sie auf
|
||||
// null, jede Ausgabe drueckt sie ins Minus. Der Saldo allein sagt deshalb
|
||||
// nicht, wie viel noch geht – dafuer braucht es den Rahmen daneben.
|
||||
//
|
||||
// Gerechnet wird in der KONTOWAEHRUNG. Der umgerechnete Saldo
|
||||
// (balance_base_cents) passt nicht zu einem Rahmen, den die Bank in Franken
|
||||
// zugesagt hat.
|
||||
function Kreditrahmen({ account, t }) {
|
||||
const rahmen = account.credit_limit_cents;
|
||||
if (account.type !== "kreditkarte" || !rahmen) return null;
|
||||
|
||||
// Ein positiver Saldo heisst ueberzahlt – dann ist der Rahmen voll da.
|
||||
const genutzt = Math.max(0, -account.balance_cents);
|
||||
const ueberzogen = genutzt > rahmen;
|
||||
const anteil = Math.min(100, Math.round((genutzt / rahmen) * 100));
|
||||
|
||||
return (
|
||||
<div className="named-sub kreditrahmen">
|
||||
<div className={`rahmen-balken${ueberzogen ? " ueber" : ""}`}>
|
||||
<div className="rahmen-fuellung" style={{ width: `${anteil}%` }} />
|
||||
</div>
|
||||
<span className={ueberzogen ? "saldo-abweichung" : "muted"}>
|
||||
{ueberzogen
|
||||
? t("accounts.creditLimitExceeded", {
|
||||
over: formatMoney(genutzt - rahmen, account.currency),
|
||||
limit: formatMoney(rahmen, account.currency),
|
||||
})
|
||||
: t("accounts.creditLimitLeft", {
|
||||
left: formatMoney(rahmen - genutzt, account.currency),
|
||||
limit: formatMoney(rahmen, account.currency),
|
||||
})}
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function Aufschluesselung({ daten, t }) {
|
||||
const { teile, uebertraege, bank, waehrung } = daten;
|
||||
const zeile = (schluessel, vorzeichen) => {
|
||||
|
||||
Reference in New Issue
Block a user