feat(checks): print frozen receipts (#27) (#33)

vekexasia · web-flow · commit c8f009824ed4 · 2026-07-06T16:19:54.000+02:00
diff --git a/web/messages/de.json b/web/messages/de.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Betrag",
     "tableDetail.total": "Gesamt",
     "tableDetail.subtotal": "Zwischensumme",
-    "tableDetail.print": "Drucken",
+    "tableDetail.print": "Beleg drucken",
     "tableDetail.paid": "Bezahlt",
     "tableDetail.confirmPaid": "Bezahlt bestätigen",
     "tableDetail.void": "Rechnung stornieren",
     "tableDetail.confirmVoid": "Stornierung bestätigen",
     "tableDetail.history": "Verlauf",
-    "tableDetail.reprint": "Erneut drucken",
+    "tableDetail.reprint": "Beleg erneut drucken",
     "tableDetail.checkStatus.settled": "Bezahlt",
     "tableDetail.checkStatus.voided": "Storniert",
     "orderReview.checkOpen": "Dieser Tisch hat eine offene Rechnung",
diff --git a/web/messages/en.json b/web/messages/en.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Amount",
     "tableDetail.total": "Total",
     "tableDetail.subtotal": "Subtotal",
-    "tableDetail.print": "Print",
+    "tableDetail.print": "Print receipt",
     "tableDetail.paid": "Paid",
     "tableDetail.confirmPaid": "Confirm paid",
     "tableDetail.void": "Void check",
     "tableDetail.confirmVoid": "Confirm void",
     "tableDetail.history": "History",
-    "tableDetail.reprint": "Reprint",
+    "tableDetail.reprint": "Reprint receipt",
     "tableDetail.checkStatus.settled": "Paid",
     "tableDetail.checkStatus.voided": "Voided",
     "orderReview.checkOpen": "This table has an open check",
diff --git a/web/messages/es.json b/web/messages/es.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Importe",
     "tableDetail.total": "Total",
     "tableDetail.subtotal": "Subtotal",
-    "tableDetail.print": "Imprimir",
+    "tableDetail.print": "Imprimir recibo",
     "tableDetail.paid": "Pagado",
     "tableDetail.confirmPaid": "Confirmar pago",
     "tableDetail.void": "Anular cuenta",
     "tableDetail.confirmVoid": "Confirmar anulación",
     "tableDetail.history": "Historial",
-    "tableDetail.reprint": "Reimprimir",
+    "tableDetail.reprint": "Reimprimir recibo",
     "tableDetail.checkStatus.settled": "Pagado",
     "tableDetail.checkStatus.voided": "Anulada",
     "orderReview.checkOpen": "Esta mesa tiene una cuenta abierta",
diff --git a/web/messages/fr.json b/web/messages/fr.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Montant",
     "tableDetail.total": "Total",
     "tableDetail.subtotal": "Sous-total",
-    "tableDetail.print": "Imprimer",
+    "tableDetail.print": "Imprimer le reçu",
     "tableDetail.paid": "Payé",
     "tableDetail.confirmPaid": "Confirmer le paiement",
     "tableDetail.void": "Annuler l'addition",
     "tableDetail.confirmVoid": "Confirmer l'annulation",
     "tableDetail.history": "Historique",
-    "tableDetail.reprint": "Réimprimer",
+    "tableDetail.reprint": "Réimprimer le reçu",
     "tableDetail.checkStatus.settled": "Payé",
     "tableDetail.checkStatus.voided": "Annulé",
     "orderReview.checkOpen": "Cette table a une addition ouverte",
diff --git a/web/messages/hu.json b/web/messages/hu.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Összeg",
     "tableDetail.total": "Összesen",
     "tableDetail.subtotal": "Részösszeg",
-    "tableDetail.print": "Nyomtatás",
+    "tableDetail.print": "Nyugta nyomtatása",
     "tableDetail.paid": "Fizetve",
     "tableDetail.confirmPaid": "Fizetés megerősítése",
     "tableDetail.void": "Számla érvénytelenítése",
     "tableDetail.confirmVoid": "Érvénytelenítés megerősítése",
     "tableDetail.history": "Előzmények",
-    "tableDetail.reprint": "Újranyomtatás",
+    "tableDetail.reprint": "Nyugta újranyomtatása",
     "tableDetail.checkStatus.settled": "Fizetve",
     "tableDetail.checkStatus.voided": "Érvénytelenítve",
     "orderReview.checkOpen": "Ennek az asztalnak nyitott számlája van",
diff --git a/web/messages/it.json b/web/messages/it.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Importo",
     "tableDetail.total": "Totale",
     "tableDetail.subtotal": "Subtotale",
-    "tableDetail.print": "Stampa",
+    "tableDetail.print": "Stampa ricevuta",
     "tableDetail.paid": "Pagato",
     "tableDetail.confirmPaid": "Conferma pagato",
     "tableDetail.void": "Annulla conto",
     "tableDetail.confirmVoid": "Conferma annullamento",
     "tableDetail.history": "Storico",
-    "tableDetail.reprint": "Ristampa",
+    "tableDetail.reprint": "Ristampa ricevuta",
     "tableDetail.checkStatus.settled": "Pagato",
     "tableDetail.checkStatus.voided": "Annullato",
     "orderReview.checkOpen": "Il tavolo ha un conto aperto",
diff --git a/web/messages/nl.json b/web/messages/nl.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Bedrag",
     "tableDetail.total": "Totaal",
     "tableDetail.subtotal": "Subtotaal",
-    "tableDetail.print": "Afdrukken",
+    "tableDetail.print": "Bon afdrukken",
     "tableDetail.paid": "Betaald",
     "tableDetail.confirmPaid": "Betaling bevestigen",
     "tableDetail.void": "Rekening annuleren",
     "tableDetail.confirmVoid": "Annulering bevestigen",
     "tableDetail.history": "Geschiedenis",
-    "tableDetail.reprint": "Opnieuw afdrukken",
+    "tableDetail.reprint": "Bon opnieuw afdrukken",
     "tableDetail.checkStatus.settled": "Betaald",
     "tableDetail.checkStatus.voided": "Geannuleerd",
     "orderReview.checkOpen": "Deze tafel heeft een openstaande rekening",
diff --git a/web/messages/pt.json b/web/messages/pt.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Valor",
     "tableDetail.total": "Total",
     "tableDetail.subtotal": "Subtotal",
-    "tableDetail.print": "Imprimir",
+    "tableDetail.print": "Imprimir recibo",
     "tableDetail.paid": "Pago",
     "tableDetail.confirmPaid": "Confirmar pagamento",
     "tableDetail.void": "Anular conta",
     "tableDetail.confirmVoid": "Confirmar anulação",
     "tableDetail.history": "Histórico",
-    "tableDetail.reprint": "Reimprimir",
+    "tableDetail.reprint": "Reimprimir recibo",
     "tableDetail.checkStatus.settled": "Pago",
     "tableDetail.checkStatus.voided": "Anulada",
     "orderReview.checkOpen": "Esta mesa tem uma conta aberta",
diff --git a/web/messages/ru.json b/web/messages/ru.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Сумма",
     "tableDetail.total": "Итого",
     "tableDetail.subtotal": "Промежуточный итог",
-    "tableDetail.print": "Печать",
+    "tableDetail.print": "Печать чека",
     "tableDetail.paid": "Оплачено",
     "tableDetail.confirmPaid": "Подтвердить оплату",
     "tableDetail.void": "Аннулировать счёт",
     "tableDetail.confirmVoid": "Подтвердить аннулирование",
     "tableDetail.history": "История",
-    "tableDetail.reprint": "Повторная печать",
+    "tableDetail.reprint": "Повторная печать чека",
     "tableDetail.checkStatus.settled": "Оплачено",
     "tableDetail.checkStatus.voided": "Аннулировано",
     "orderReview.checkOpen": "У этого стола открыт счёт",
diff --git a/web/messages/vec.json b/web/messages/vec.json
@@ -644,13 +644,13 @@
     "tableDetail.adjAmount": "Inporto",
     "tableDetail.total": "Total",
     "tableDetail.subtotal": "Subtotal",
-    "tableDetail.print": "Stanpa",
+    "tableDetail.print": "Stampa ricevuta",
     "tableDetail.paid": "Pagà",
     "tableDetail.confirmPaid": "Conferma pagà",
     "tableDetail.void": "Anuła el conto",
     "tableDetail.confirmVoid": "Conferma anułamento",
     "tableDetail.history": "Storico",
-    "tableDetail.reprint": "Ristanpa",
+    "tableDetail.reprint": "Ristampa ricevuta",
     "tableDetail.checkStatus.settled": "Pagà",
     "tableDetail.checkStatus.voided": "Anułà",
     "orderReview.checkOpen": "Sta tòła ła ga un conto verto",
diff --git a/web/src/app/admin/admin.css b/web/src/app/admin/admin.css
@@ -82,10 +82,11 @@
 /* Reset body defaults for admin */
 .adm-root { height: 100vh; overflow: hidden; }
 
-/* Check printing (#15): print only the check card, hide the rest of the admin chrome. */
+/* Receipt printing (#27): print only the selected frozen receipt snapshot. */
+.print-receipt { display: none; }
 @media print {
   body * { visibility: hidden; }
-  .print-check, .print-check * { visibility: visible; }
-  .print-check { position: absolute; inset: 0; margin: 0; border: none; }
+  .print-receipt, .print-receipt * { visibility: visible; }
+  .print-receipt { display: block; position: absolute; inset: 0; margin: 0; }
   .print-hide { display: none !important; }
 }
diff --git a/web/src/components/admin/pages/AdminTableDetailPage.test.tsx b/web/src/components/admin/pages/AdminTableDetailPage.test.tsx
@@ -43,6 +43,7 @@ const openCheck = {
 beforeEach(() => {
   for (const m of Object.values(apiMocks)) if (typeof m === "function" && "mockReset" in m) (m as ReturnType<typeof vi.fn>).mockReset();
   apiMocks.fetchAdminTableDetail.mockResolvedValue(sessionNoCheck);
+  window.print = vi.fn();
 });
 
 describe("AdminTableDetailPage", () => {
@@ -149,4 +150,30 @@ describe("AdminTableDetailPage", () => {
     render(<AdminTableDetailPage tableId="t1" />);
     expect(await screen.findByTestId("history-payment-h1")).toHaveTextContent("tableDetail.paymentMethod.cash");
   });
+
+  it("prints a receipt-only view for the current open check", async () => {
+    apiMocks.fetchAdminTableDetail.mockResolvedValue({ ...sessionNoCheck, currentSession: { ...sessionNoCheck.currentSession, check: openCheck } });
+    render(<AdminTableDetailPage tableId="t1" />);
+    fireEvent.click(await screen.findByTestId("print-receipt-current"));
+    const receipt = await screen.findByTestId("print-receipt");
+    expect(receipt).toHaveTextContent("Sala · 1");
+    expect(receipt).toHaveTextContent("Bruschetta");
+    expect(receipt).toHaveTextContent("€ 15,00");
+    await waitFor(() => expect(window.print).toHaveBeenCalled());
+  });
+
+  it("reprints the selected historical frozen check, not the current check", async () => {
+    apiMocks.fetchAdminTableDetail.mockResolvedValue({
+      ...sessionNoCheck,
+      currentSession: { ...sessionNoCheck.currentSession, check: openCheck },
+      history: [{ sessionId: "h1", openedAt: 1, closedAt: 2, check: { ...openCheck, id: "old", status: "settled", settledAt: 2, lines: [{ name: "Old wine", quantity: 1, unitPrice: 999 }], subtotal: 999, total: 999, paymentMethod: "cash" } }],
+    });
+    render(<AdminTableDetailPage tableId="t1" />);
+    fireEvent.click(await screen.findByTestId("history-h1-toggle"));
+    fireEvent.click(await screen.findByTestId("reprint-receipt-h1"));
+    const receipt = await screen.findByTestId("print-receipt");
+    expect(receipt).toHaveTextContent("Old wine");
+    expect(receipt).toHaveTextContent("€ 9,99");
+    expect(receipt).not.toHaveTextContent("Bruschetta");
+  });
 });
diff --git a/web/src/components/admin/pages/AdminTableDetailPage.tsx b/web/src/components/admin/pages/AdminTableDetailPage.tsx
@@ -35,6 +35,7 @@ export default function AdminTableDetailPage({ tableId }: { tableId: string }) {
   const [confirming, setConfirming] = useState<"close" | "settle" | "void" | null>(null);
   const [expandedHistory, setExpandedHistory] = useState<string | null>(null);
   const [busy, setBusy] = useState(false);
+  const [receiptToPrint, setReceiptToPrint] = useState<{ check: CheckDTO; heading: string } | null>(null);
   const [orderModal, setOrderModal] = useState(false);
 
   const refresh = useCallback(async () => {
@@ -53,6 +54,10 @@ export default function AdminTableDetailPage({ tableId }: { tableId: string }) {
     return () => clearInterval(timer);
   }, [refresh]);
 
+  useEffect(() => {
+    if (receiptToPrint) window.print();
+  }, [receiptToPrint]);
+
   const run = async (fn: () => Promise<unknown>) => {
     setBusy(true);
     setError(null);
@@ -140,6 +145,7 @@ export default function AdminTableDetailPage({ tableId }: { tableId: string }) {
           onUpdate={(patch) => run(() => updateCheck(check.id, patch))}
           onSettle={(body) => run(() => settleCheck(check.id, body))}
           onVoid={() => run(() => voidCheck(check.id))}
+          onPrint={() => setReceiptToPrint({ check, heading })}
         />
       )}
 
@@ -150,6 +156,7 @@ export default function AdminTableDetailPage({ tableId }: { tableId: string }) {
             {history.map((h) => (
               <div key={h.sessionId} className="rounded-xl border border-gray-200 bg-white p-4" data-testid={`history-${h.sessionId}`}>
                 <button
+                  data-testid={`history-${h.sessionId}-toggle`}
                   type="button"
                   onClick={() => setExpandedHistory((prev) => (prev === h.sessionId ? null : h.sessionId))}
                   className="w-full flex items-center justify-between gap-3 text-left"
@@ -173,7 +180,8 @@ export default function AdminTableDetailPage({ tableId }: { tableId: string }) {
                     <ReadOnlyLines check={h.check} t={t} />
                     <button
                       type="button"
-                      onClick={() => window.print()}
+                      onClick={() => setReceiptToPrint({ check: h.check!, heading })}
+                      data-testid={`reprint-receipt-${h.sessionId}`}
                       className="mt-3 px-3 py-1.5 rounded-lg border border-gray-200 text-gray-600 text-xs font-semibold"
                     >
                       {t("tableDetail.reprint")}
@@ -186,6 +194,8 @@ export default function AdminTableDetailPage({ tableId }: { tableId: string }) {
         </section>
       )}
 
+      {receiptToPrint && <ReceiptView check={receiptToPrint.check} heading={receiptToPrint.heading} t={t} />}
+
       {orderModal && currentSession && !check && (
         <AdminAddOrderModal
           t={t}
@@ -358,7 +368,7 @@ function AdminAddOrderModal({ t, onClose, onSubmit }: { t: T; onClose: () => voi
 }
 
 function CheckCard({
-  check, t, busy, confirming, setConfirming, onUpdate, onSettle, onVoid,
+  check, t, busy, confirming, setConfirming, onUpdate, onSettle, onVoid, onPrint,
 }: {
   check: CheckDTO;
   t: T;
@@ -368,6 +378,7 @@ function CheckCard({
   onUpdate: (patch: { discount?: CheckDiscount | null; adjustments?: CheckAdjustment[] }) => void;
   onSettle: (body: { paymentMethod: PaymentMethod; note?: string }) => void;
   onVoid: () => void;
+  onPrint: () => void;
 }) {
   const [discountType, setDiscountType] = useState<"percent" | "amount">(check.discount?.type ?? "percent");
   const [discountValue, setDiscountValue] = useState<string>(
@@ -402,7 +413,7 @@ function CheckCard({
   };
 
   return (
-    <section className="mt-4 rounded-xl border-2 border-primary/30 bg-white p-4 print-check" data-testid="check-card">
+    <section className="mt-4 rounded-xl border-2 border-primary/30 bg-white p-4" data-testid="check-card">
       <h2 className="text-sm font-semibold text-gray-500 uppercase tracking-wide mb-3">{t("tableDetail.check")}</h2>
       <ReadOnlyLines check={check} t={t} />
 
@@ -454,7 +465,7 @@ function CheckCard({
       </div>
 
       <div className="mt-4 flex flex-wrap gap-2 print-hide">
-        <button type="button" onClick={() => window.print()} className="px-3 py-1.5 rounded-lg border border-gray-200 text-gray-600 text-xs font-semibold">{t("tableDetail.print")}</button>
+        <button type="button" onClick={onPrint} data-testid="print-receipt-current" className="px-3 py-1.5 rounded-lg border border-gray-200 text-gray-600 text-xs font-semibold">{t("tableDetail.print")}</button>
         {confirming === "settle" ? (
           <div data-testid="settlement-sheet" className="w-full rounded-xl border border-green-100 bg-green-50 p-3 space-y-3">
             <div className="flex items-center justify-between gap-3">
@@ -503,6 +514,23 @@ function CheckCard({
   );
 }
 
+function ReceiptView({ check, heading, t }: { check: CheckDTO; heading: string; t: T }) {
+  return (
+    <section className="print-receipt bg-white p-6 text-gray-900" data-testid="print-receipt">
+      <h1 className="text-xl font-bold">{heading}</h1>
+      <p className="text-sm text-gray-500">{new Date(check.createdAt).toLocaleString()} · {t(`tableDetail.checkStatus.${check.status}`)}</p>
+      {check.paymentMethod && <p className="text-sm text-gray-500">{t(`tableDetail.paymentMethod.${check.paymentMethod}`)}</p>}
+      <div className="mt-4">
+        <ReadOnlyLines check={check} t={t} />
+      </div>
+      <div className="mt-4 flex items-center justify-between border-t border-gray-200 pt-3">
+        <span className="font-semibold">{t("tableDetail.total")}</span>
+        <span className="text-2xl font-bold">{euros(check.total)}</span>
+      </div>
+    </section>
+  );
+}
+
 function ReadOnlyLines({ check, t }: { check: CheckDTO; t: T }) {
   return (
     <>
