+
+ );
+};
+
+export const AccountingInboxPage: React.FC = () => {
+ const { t } = useTranslation();
+ const qc = useQueryClient();
+ const { format } = useLocalizedDate();
+ const cameraRef = useRef
+
+
+
+
+ + {t('accounting.inbox.triageTitle', 'Categorize document')} +
+ +
+
+
+
+
+
+
+
+ setSupplier(e.target.value)} />
+
+
+
+
+
+
+ setCurrency(e.target.value.toUpperCase())} maxLength={3} />
+
+
+
+
+
+
+
+
+
+ {disposition === 'eigener_aufwand' && (
+
+
+
+
+ )}
+
+ {disposition === 'abgelehnt' && (
+
+
+ setDeclineReason(e.target.value)} />
+
+ )}
+
+ {disposition === 'rebill' && (
+
+
+ )}
+
+
+ setCustomer(next.slice(-1))} />
+
+
+
+ {markupType !== 'none' && (
+
+
+ setEventId(e.target.value.replace(/[^0-9]/g, ''))} inputMode="numeric" />
+
+
+
+
+
+ {t('accounting.inbox.rebillHint', 'Creates an editable scheduled invoice on the client. VAT/tax handling is v1 — verify with your Treuhänder.')}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {isLoading ? (
+ setTriageDoc(null)}
+ onDone={() => {
+ setTriageDoc(null);
+ qc.invalidateQueries({ queryKey: ['accounting-inbound'] });
+ }}
+ />
+ )}
+
+ );
+};
+
+export default AccountingInboxPage;
diff --git a/frontend/src/services/accounting.service.ts b/frontend/src/services/accounting.service.ts
new file mode 100644
index 00000000..c60cb27c
--- /dev/null
+++ b/frontend/src/services/accounting.service.ts
@@ -0,0 +1,148 @@
+import { api } from '../config/api';
+
+// Mirrors backend transformInbound / transformExpense (camelCase).
+export type InboundStatus = 'unsorted' | 'categorized' | 'declined' | 'duplicate';
+export type Disposition = 'rebill' | 'durchlaufend' | 'eigener_aufwand' | 'duplikat' | 'abgelehnt';
+export type TaxTreatment = 'domestic' | 'reverse_charge_service' | 'foreign_vat_non_reclaimable' | 'import_goods';
+export type MarkupType = 'none' | 'percent' | 'flat';
+export type PaymentMethod = 'bank_transfer' | 'cash' | 'twint' | 'paypal' | 'card' | 'other';
+
+export interface InboundDocument {
+ id: number;
+ source: 'upload' | 'camera' | 'email' | 'manual';
+ originalFilename: string | null;
+ mimeType: string | null;
+ status: InboundStatus;
+ parseStatus: 'pending' | 'parsed' | 'failed' | 'manual';
+ parseMethod: string | null;
+ supplierName: string | null;
+ invoiceNumber: string | null;
+ invoiceDate: string | null;
+ dueDate: string | null;
+ currency: string | null;
+ netAmountMinor: number | null;
+ vatAmountMinor: number | null;
+ totalAmountMinor: number | null;
+ qrAmountMinor: number | null;
+ iban: string | null;
+ paymentReference: string | null;
+ duplicateOfId: number | null;
+ createdAt: string;
+ updatedAt: string;
+}
+
+export interface Expense {
+ id: number;
+ inboundDocumentId: number | null;
+ disposition: Disposition;
+ taxTreatment: TaxTreatment;
+ eventId: number | null;
+ customerAccountId: number | null;
+ supplierName: string | null;
+ description: string | null;
+ chfAmountMinor: number | null;
+ grossAmountMinor: number | null;
+ markupType: MarkupType;
+ markupPercent: number | null;
+ markupFlatMinor: number | null;
+ categoryId: number | null;
+ billedInvoiceId: number | null;
+ supplierPaid: boolean;
+ status: 'open' | 'parked' | 'billed' | 'declined';
+ createdAt: string;
+ updatedAt: string;
+}
+
+export interface ExpenseCategory {
+ id: number;
+ name: string;
+ color: string | null;
+ is_seed: boolean;
+ display_order: number;
+}
+
+export interface Paginated
+
+
+
+ {t('accounting.inbox.captureTitle', 'Capture a supplier invoice')}
+{t('accounting.inbox.captureBody', 'Photograph a paper invoice with your device camera, or upload a PDF / image.')}
+
+
+ ) : (
+ {t('accounting.inbox.empty', 'No documents yet — capture one above.')}
+
+ {items.map((doc) => (
+
+ )}
+
+ {triageDoc && (
+
+
+ ))}
+
+
+ {doc.status === 'unsorted' && (
+
+ )}
+
+
+ {t(`accounting.inbox.status.${doc.status}`, doc.status)}
+
+
+ {doc.supplierName || doc.originalFilename || t('accounting.inbox.untitled', 'Untitled document')}
+
+ {doc.source === 'camera' &&
+
+ {doc.totalAmountMinor != null ? formatMoneyMinor(doc.totalAmountMinor, doc.currency || 'CHF') : t('accounting.inbox.noAmount', 'amount not entered')}
+ {' · '}
+ {format(doc.createdAt)}
+
+
-
+
-
{t('accounting.inbox.triageTitle', 'Categorize document')} @@ -112,7 +131,29 @@ const TriageModal: React.FC<{
+
+ {/* Document preview — PDFs open at the last page (QR-bill area). */}
+
+ {previewSrc ? (
+ isPdf ? (
+
+ ) : (
+ 
+ )
+ ) : (
+
+
+ {/* Triage form */}
+
+ {t('accounting.inbox.previewLoading', 'Loading preview…')}
+
+ )}
+ {isPdf && (
+ + {t('accounting.inbox.qrHint', 'Opened at the last page — the Swiss QR-bill usually sits at the bottom.')} +
+ )} +
@@ -198,6 +239,7 @@ const TriageModal: React.FC<{
)}
+ {t('accounting.inbox.rebillHint', 'Creates an editable scheduled invoice on the client. VAT/tax handling is v1 — verify with your Treuhänder.')}
diff --git a/frontend/src/services/accounting.service.ts b/frontend/src/services/accounting.service.ts
index c60cb27c..f868045b 100644
--- a/frontend/src/services/accounting.service.ts
+++ b/frontend/src/services/accounting.service.ts
@@ -15,6 +15,7 @@ export interface InboundDocument {
status: InboundStatus;
parseStatus: 'pending' | 'parsed' | 'failed' | 'manual';
parseMethod: string | null;
+ pageCount: number | null;
supplierName: string | null;
invoiceNumber: string | null;
invoiceDate: string | null;
@@ -114,6 +115,11 @@ export const accountingService = {
return data.document;
},
+ async getInboundFileBlob(id: number): Promise {
+ const { data } = await api.get(`/admin/expenses/inbound/${id}/file`, { responseType: 'blob' });
+ return data;
+ },
+
async updateInbound(id: number, fields: Partial>): Promise {
From 0c35ac43e616e4b49da8089c95239ac06ec402c5 Mon Sep 17 00:00:00 2001
From: Luca <102960244+Luca-Timo@users.noreply.github.com>
Date: Thu, 11 Jun 2026 00:42:46 +0200
Subject: [PATCH 06/76] feat(accounting): expenses ledger + supplier-payment
toggle
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Adds Accounting → Expenses, the view of everything triaged out of the inbox:
- ExpensesLedgerPage: filter by status / disposition; each row shows the
disposition + status badge, CHF amount, created date, and a link to the
client invoice for re-billed items. Supplier-payment toggle ("Mark paid" ->
method + date + reference modal; "Paid" -> click to revert) wired to
/:id/supplier-payment. Payment status is decoupled from categorisation, per
the locked design; declined/duplicate rows skip the toggle.
- AccountingLayout: "Expenses" sub-nav item (gated by incomingInvoices).
- App.tsx: /admin/accounting/expenses route.
- i18n: accounting.subnav.expenses, accounting.ledger/expenseStatus/
paymentMethod (EN + DE, DE authored natively).
Verified: en/de JSON valid; npm run build green.
---
frontend/src/App.tsx | 2 +
.../src/components/admin/AccountingLayout.tsx | 9 +-
frontend/src/i18n/locales/de.json | 31 ++++
frontend/src/i18n/locales/en.json | 31 ++++
.../admin/accounting/ExpensesLedgerPage.tsx | 174 ++++++++++++++++++
5 files changed, 246 insertions(+), 1 deletion(-)
create mode 100644 frontend/src/pages/admin/accounting/ExpensesLedgerPage.tsx
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index aee3c7c9..51330423 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -66,6 +66,7 @@ import { AdminLayout, AdminAuthWrapper } from './components/admin';
import { ClientsLayout } from './components/admin/ClientsLayout';
import { AccountingLayout, AccountingIndex } from './components/admin/AccountingLayout';
import { AccountingInboxPage } from './pages/admin/accounting/AccountingInboxPage';
+import { ExpensesLedgerPage } from './pages/admin/accounting/ExpensesLedgerPage';
import { RequireFeature } from './components/admin/RequireFeature';
import { PageErrorBoundary, OfflineIndicator, SkipLink, DynamicFavicon, RobotsMetaTags, CMSContentBlock, Loading } from './components/common';
import { MaintenanceWrapper } from './components/MaintenanceWrapper';
@@ -271,6 +272,7 @@ function App() {
= {
+ open: 'bg-amber-100 text-amber-800 dark:bg-amber-900/40 dark:text-amber-300',
+ parked: 'bg-blue-100 text-blue-800 dark:bg-blue-900/40 dark:text-blue-300',
+ billed: 'bg-green-100 text-green-800 dark:bg-green-900/40 dark:text-green-300',
+ declined: 'bg-neutral-200 text-neutral-700 dark:bg-neutral-700 dark:text-neutral-300',
+};
+
+const PayModal: React.FC<{ expense: Expense; onClose: () => void; onDone: () => void }> = ({ expense, onClose, onDone }) => {
+ const { t } = useTranslation();
+ const [paidAt, setPaidAt] = useState('');
+ const [method, setMethod] = useState('bank_transfer');
+ const [reference, setReference] = useState('');
+
+ const save = useMutation({
+ mutationFn: () => accountingService.setSupplierPayment(expense.id, {
+ paid: true, paidAt: paidAt || undefined, paymentMethod: method, paymentReference: reference || undefined,
+ }),
+ onSuccess: () => { toast.success(t('accounting.ledger.paidToast', 'Marked as paid.')); onDone(); },
+ onError: (e: any) => toast.error(e?.response?.data?.error || e.message || 'Failed'),
+ });
+
+ return (
+ (null);
+
+ const { data, isLoading } = useQuery({
+ queryKey: ['accounting-expenses', status, disposition],
+ queryFn: () => accountingService.listExpenses({
+ status: status || undefined,
+ disposition: (disposition || undefined) as Disposition | undefined,
+ pageSize: 100,
+ }),
+ });
+
+ const unpay = useMutation({
+ mutationFn: (id: number) => accountingService.setSupplierPayment(id, { paid: false }),
+ onSuccess: () => { toast.success(t('accounting.ledger.unpaidToast', 'Marked as not paid.')); qc.invalidateQueries({ queryKey: ['accounting-expenses'] }); },
+ onError: (e: any) => toast.error(e?.response?.data?.error || e.message || 'Failed'),
+ });
+
+ const selectClass = 'rounded-md border border-neutral-300 dark:border-neutral-600 bg-white dark:bg-neutral-800 px-3 py-2 text-sm';
+ const items = data?.items ?? [];
+
+ return (
+ /.
- GET /inbound/:id/page/:n streams the rasterised PNG (CSP default-src 'none'
+ nosniff). GET /inbound/:id/file now serves PDFs as a DOWNLOAD only
(Content-Disposition: attachment) — never inline; images still inline.
- frontend: triage preview switched from a raw-PDF
+
+ );
+};
+
+export const ExpensesLedgerPage: React.FC = () => {
+ const { t } = useTranslation();
+ const qc = useQueryClient();
+ const { format } = useLocalizedDate();
+ const [status, setStatus] = useState('');
+ const [disposition, setDisposition] = useState('');
+ const [payExpense, setPayExpense] = useState
+
+
+
+ {t('accounting.ledger.markPaidTitle', 'Mark supplier paid')}
+ +
+
+
+
+
+
+
+
+
+
+
+ setReference(e.target.value)} />
+
+
+
+
+
+
+ {t('accounting.ledger.empty', 'No expenses yet — categorize documents in the inbox.')} setPayExpense(null)} onDone={() => { setPayExpense(null); qc.invalidateQueries({ queryKey: ['accounting-expenses'] }); }} />
+ )}
+
+ );
+};
+
+export default ExpensesLedgerPage;
From e111522415c21ca8ef47f0d8be48c95bd8ab8c69 Mon Sep 17 00:00:00 2001
From: Luca <102960244+Luca-Timo@users.noreply.github.com>
Date: Thu, 11 Jun 2026 00:51:10 +0200
Subject: [PATCH 07/76] feat(accounting): rasterise inbound PDFs server-side
(never serve raw to browser)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Security hardening for inbound supplier-invoice previews. The admin UI no
longer renders raw PDFs — a malicious inbound PDF could otherwise run embedded
JS or phone home in the admin's session. Instead PDFs are rasterised to flat
PNGs server-side and only those images are shown.
- backend: new rasterizeService shells out to poppler `pdftoppm` (added to the
Docker image via apk poppler-utils — an OS package, NOT a Node PDF lib, so it
respects the pdfkit+pdf-lib "no third PDF lib" rule). pdftoppm executes no JS
and fetches no remote resources, so it doubles as the SSRF/phone-home guard.
Rendered pages cached under storage/business-docs/inbound/rendered/
+
+
+
+
+ {isLoading ? (
+
+ {items.map((ex) => (
+
+ )}
+
+ {payExpense && (
+
+
+ ))}
+
+
+
+
+ {t(`accounting.expenseStatus.${ex.status}`, ex.status)}
+ {ex.supplierName || ex.description || t('accounting.ledger.untitled', 'Expense')}
+
+
+ {t(`accounting.disposition.${ex.disposition}`, ex.disposition)}
+ {' · '}
+ {format(ex.createdAt)}
+ {ex.billedInvoiceId ? (
+ <>{' · '}{t('accounting.ledger.invoiceLink', 'Invoice')}
+
+ {ex.chfAmountMinor != null ? formatMoneyMinor(ex.chfAmountMinor, 'CHF') : '—'}
+
+
+ {/* Supplier-payment toggle (skip for declined/duplicate). */}
+ {ex.disposition !== 'abgelehnt' && ex.disposition !== 'duplikat' && (
+ ex.supplierPaid ? (
+
+ ) : (
+
+ )
+ )}
+