feat: Kontouebertraege lassen sich im Eingang buchen

Bisher blieb im Eingang nur, eine Umbuchung als Ausgabe oder Einnahme zu
kategorisieren. Sie zaehlte dann als Ausgabe, obwohl kein Geld weg ist – nur
verschoben.

Jetzt gibt es je Vorschlag den Weg 'Als Uebertrag buchen': Zielkonto waehlen,
fertig. Es entsteht EINE Buchung, die beide Salden bewegt und in keiner
Auswertung zaehlt. Die Richtung kommt aus dem Vorzeichen – ein Abgang geht von
hier weg, ein Zugang kommt vom Gegenkonto her; entsprechend fragt der Dialog
'wohin' oder 'woher'. Bei verschiedenen Waehrungen wird die Seite exakt
gesetzt, die wir wirklich kennen, und die andere umgerechnet.

Der teuerste Fehler an dieser Stelle waere ein Zielkonto, das selbst an einer
Bank haengt: Es meldet den Zugang von allein, eine Gegenbuchung hier haette das
Geld zweimal. Der Server lehnt das mit einer Begruendung ab; wer es besser
weiss, bestaetigt und kommt durch. Das Wissen bleibt an einer Stelle – die
Oberflaeche fragt nicht selbst nach, sie zeigt die Antwort des Servers.

Die Betragslogik ist dafuer aus dem Buchungs-Router in einen Dienst gewandert.
Zwei Kopien derselben Umrechnung waeren genau die Stelle, an der Salden
auseinanderlaufen.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

web/src/pages/Eingang.jsx

@@ -5,6 +5,8 @@ import { api } from "../api";
 import CategorySelect from "../components/CategorySelect";
 import Icon from "../components/Icon";
 import IconChip from "../components/IconChip";
+import AccountSelect from "../components/AccountSelect";
+import Modal from "../components/Modal";
 import Money from "../components/Money";
 import Uebertragsvorschlaege from "../components/Uebertragsvorschlaege";
 import { useToast } from "../toast";
@@ -25,6 +27,8 @@ export default function Eingang() {
   const [rows, setRows] = useState(null);
   const [accounts, setAccounts] = useState([]);
   const [groups, setGroups] = useState([]);
+  // Vorschlag, der gerade als Übertrag gebucht wird, samt Zielkonto.
+  const [uebertrag, setUebertrag] = useState(null);
 
   const expenseGroups = useMemo(() => gruppenFuer(groups, "expense"), [groups]);
   const incomeGroups = useMemo(() => gruppenFuer(groups, "income"), [groups]);
@@ -74,6 +78,33 @@ export default function Eingang() {
     }
   }
 
+  async function uebertragBuchen() {
+    const { item, ziel } = uebertrag;
+    if (!ziel) return;
+    try {
+      await api.bookInboxAsTransfer(item.id, Number(ziel));
+    } catch (e) {
+      // 409: Das Zielkonto haengt selbst an einer Bank und meldet den Zugang
+      // von allein. Die Begruendung kommt vom Server – dort steht das Wissen,
+      // ob ein Konto angebunden ist.
+      if (e.status !== 409) { toast(e.message, "error"); return; }
+      if (!(await confirm({
+        title: t("inbox.transferTitle"),
+        message: e.message,
+        confirmLabel: t("inbox.asTransfer"),
+      }))) return;
+      try {
+        await api.bookInboxAsTransfer(item.id, Number(ziel), true);
+      } catch (zweiter) {
+        toast(zweiter.message, "error");
+        return;
+      }
+    }
+    setUebertrag(null);
+    toast(t("inbox.transferBooked"));
+    laden();
+  }
+
   async function verwerfen(item) {
     if (!(await confirm({
       title: t("inbox.discard"),
@@ -107,6 +138,53 @@ export default function Eingang() {
           deshalb steht der Vorschlag hier und nicht in der Buchungsliste. */}
       <Uebertragsvorschlaege baseCurrency={baseCurrency} onChange={laden} />
 
+      {uebertrag && (
+        <Modal
+          title={t("inbox.transferTitle")}
+          onClose={() => setUebertrag(null)}
+          footer={
+            <>
+              <button className="btn" onClick={() => setUebertrag(null)}>
+                {t("common.cancel")}
+              </button>
+              <button className="btn primary" disabled={!uebertrag.ziel}
+                      onClick={uebertragBuchen}>
+                {t("inbox.asTransfer")}
+              </button>
+            </>
+          }
+        >
+          <p className="muted small">{t("inbox.transferIntro")}</p>
+          <div className="account-row" style={{ borderBottom: "none" }}>
+            <div className="named-text grow">
+              <div><strong>{uebertrag.item.payee || t("inbox.noText")}</strong></div>
+              <div className="named-sub">
+                {formatDate(uebertrag.item.date)} ·{" "}
+                {accountById[uebertrag.item.account_id]?.name || "—"}
+              </div>
+            </div>
+            <Money cents={Math.abs(uebertrag.item.amount_cents)}
+                   currency={uebertrag.item.currency}
+                   sign={uebertrag.item.amount_cents < 0 ? "neg" : "pos"}
+                   baseCurrency={baseCurrency} />
+          </div>
+          <label>
+            {/* Die Frage hängt an der Richtung – „wohin" bei einem Abgang,
+                „woher" bei einem Zugang. */}
+            <span>
+              {uebertrag.item.amount_cents < 0
+                ? t("inbox.transferTargetOut")
+                : t("inbox.transferTargetIn")}
+            </span>
+            <AccountSelect
+              accounts={accounts.filter((a) => a.id !== uebertrag.item.account_id)}
+              value={uebertrag.ziel}
+              onChange={(id) => setUebertrag((u) => ({ ...u, ziel: id ?? "" }))}
+            />
+          </label>
+        </Modal>
+      )}
+
       {rows.length === 0 ? (
         <div className="card"><div className="empty-state">{t("inbox.empty")}</div></div>
       ) : (
@@ -141,9 +219,17 @@ export default function Eingang() {
                     onChange={(id) => zuordnen(item, id)}
                   />
                   {item.status !== "booked" && item.account_id && (
-                    <button className="btn sm primary" onClick={() => buchen(item)}>
-                      <Icon name="check" size={14} /> {t("inbox.book")}
-                    </button>
+                    <>
+                      <button className="btn sm primary" onClick={() => buchen(item)}>
+                        <Icon name="check" size={14} /> {t("inbox.book")}
+                      </button>
+                      {/* Eine Umbuchung ist keine Ausgabe. Ohne diesen Weg
+                          bliebe nur, sie als solche zu kategorisieren. */}
+                      <button className="btn sm" title={t("inbox.asTransfer")}
+                              onClick={() => setUebertrag({ item, ziel: "" })}>
+                        <Icon name="arrow-left-right" size={14} />
+                      </button>
+                    </>
                   )}
                   <button className="btn sm ghost" title={t("inbox.discard")}
                           onClick={() => verwerfen(item)}>