@flowselections/layout-maker 1.8.3 → 1.13.2

package/README.md

@@ -1,132 +1,139 @@
-# Layout maker (pakbonnen, verzendbrieven, ectra)
-
-blank project start
-
-This project was built with [Lovable](https://lovable.dev).
-
-## Build with Lovable
-
-Continue developing this project in the [Lovable editor](https://lovable.dev/projects/4735fccb-b385-4b48-b4f8-ef135f63f4f7).
-
-- **Ship faster**: describe what you want to build and Lovable handles the code.
-- **Stay in sync**: every change made in Lovable is committed straight to this repository.
-- **Full ownership**: this code is yours. Push to `main` on GitHub and your changes sync back into Lovable, ready for your next prompt.
-
-## Development
-
-Prefer working locally? You need Node.js and npm — [install with nvm](https://github.com/nvm-sh/nvm#installing-and-updating).
-
-```sh
-git clone <this-repository-url>
-cd <repository-name>
-npm i
-npm run dev
-```
-
-## Installeren in een andere shell
-
-1. Draai `sql/print-schema.sql` één keer in de Supabase-database van die shell
-   (SQL editor). Het script is idempotent en zet tabellen, rechten, RLS,
-   functies, de geplande taken én de opslagmap `layout-logos` voor de Logo
-   Bibliotheek klaar. Zorg dat de extensies `pg_cron` en `pg_net` aan staan.
-
-2. Zet in de omgeving van de shell:
-   - `SUPABASE_URL` en `SERVICE_ROLE_KEY` — nodig voor achtergrondprinten
-   - `CENTRAL_AUTH_URL` en `CENTRAL_AUTH_SECRET` — nodig voor de printdienst
-3. Zorg dat de shell het tick-eindpunt host. De setup-CLI doet dit automatisch
-   op basis van `flowselections.serverRoutes` in `package.json`. Handmatig
-   opgezette shells maken zelf dit bestand aan:
-
-   ```ts
-   // src/routes/api/public/print/queue-tick.ts
-   import { createFileRoute } from "@tanstack/react-router";
-   import { behandelQueueTick } from "@flowselections/layout-maker/print";
-
-   export const Route = createFileRoute("/api/public/print/queue-tick")({
-     server: {
-       handlers: {
-         POST: async ({ request }) => {
-           // De shell levert de databaseverbinding; de module maakt er nooit zelf een.
-           const { supabaseAdmin } = await import(
-             "../../../../integrations/supabase/client.server"
-           );
-           return behandelQueueTick(request, supabaseAdmin);
-         },
-       },
-     },
-   });
-   ```
-
-   Het eindpunt accepteert drie toegangsbewijzen: een runner-sleutel uit
-   `print_queue_runners.tick_sleutel`, `SUPABASE_PUBLISHABLE_KEY` (de cron) of
-   het sessietoken van een ingelogde gebruiker (de knop in de Printwachtrij).
-
-
-4. Klaar. Zodra de module in de shell draait meldt hij zichzelf aan als
-   verwerker van de printwachtrij. Een nieuwe printopdracht wordt meteen
-   opgepakt; daarnaast verwerkt de geplande taak `print-queue-tick` elke minuut
-   de wachtende opdrachten. Reageert een shell een uur lang niet, dan wordt hij
-   automatisch op inactief gezet. De taak `print-queue-cleanup` ruimt dagelijks
-   oude opdrachten en bestanden op.
-
-## Printen vanuit een andere module
-
-Andere modules in dezelfde shell gebruiken uitsluitend de print-API van deze
-module; zij hoeven de printtabellen niet te kennen en mogen er ook niet zelf in
-schrijven (dan blijft de opdracht wachten tot de volgende cronronde).
-
-```ts
-import {
-  printDocument, printPdf, printHtml,
-  printerVoorWerkplek, printerVoorDocumenttype, volgJobStatus,
-} from "@flowselections/layout-maker";
-
-// 1. Document dat via een ontwerp uit deze module wordt opgemaakt
-const { jobId } = await printDocument({
-  documenttype: "pakbon",          // moet een bestaande documentsoort zijn
-  documentnaam: "PB-2601284",
-  payload: { order },              // gegevens voor de layout
-});
-
-// 2. Kant-en-klare PDF (Floriday-document, klantsticker, externe factuur)
-//    Zonder printerId wordt de printer bepaald via de gekoppelde layout van
-//    de documentsoort (of de koppeling op papierformaat).
-await printPdf({
-  documenttype: "factuur",
-  documentnaam: "F-2026-00123",
-  pdfBase64,                       // met of zonder data:-voorvoegsel
-});
-
-// Of expliciet per werkplek:
-const printerId = await printerVoorWerkplek("PICKSTATION-1", "A4");
-await printPdf({
-  documenttype: "afleverbrief",
-  documentnaam: "AFL-12345",
-  pdfBase64,
-  printerId: printerId!,
-});
-
-
-// 3. Eigen opmaak afdrukken (geen layout, anders wint de layout)
-await printHtml({
-  documenttype: "controlelijst",
-  documentnaam: "Controlelijst kar 12",
-  html,
-  printerId: printerId!,
-});
-
-// Status live volgen (realtime staat aan op print_jobs)
-const stop = volgJobStatus(jobId, (s) => console.log(s.status, s.foutmelding));
-```
-
-Belangrijk:
-
-- **Documentsoorten** liggen vast in de database: pakbon, factuur, offerte,
-  orderbevestiging, etiket, verzendlabel, productlabel, barcode_label,
-  magazijnlijst, controlelijst, transportdocument, sticker, productiebon,
-  veilingbon, afleverbrief, veilingbrief en vrij.
-- **Beslisvolgorde bij het afdrukken**: kant-en-klare PDF > gekoppelde layout >
-  meegestuurde opmaak > actieve layout van de documentsoort.
-- **Dubbelbeveiliging**: een identieke aanvraag binnen 10 minuten wordt
-  genegeerd; de aanroep werpt dan `DubbeleAanvraagFout`. Geef bij bulkprints per
-  document een eigen `documentnaam` zodat elke opdracht uniek is.
+# Layout maker (pakbonnen, verzendbrieven, ectra)
+
+blank project start
+
+This project was built with [Lovable](https://lovable.dev).
+
+## Build with Lovable
+
+Continue developing this project in the [Lovable editor](https://lovable.dev/projects/4735fccb-b385-4b48-b4f8-ef135f63f4f7).
+
+- **Ship faster**: describe what you want to build and Lovable handles the code.
+- **Stay in sync**: every change made in Lovable is committed straight to this repository.
+- **Full ownership**: this code is yours. Push to `main` on GitHub and your changes sync back into Lovable, ready for your next prompt.
+
+## Development
+
+Prefer working locally? You need Node.js and npm — [install with nvm](https://github.com/nvm-sh/nvm#installing-and-updating).
+
+```sh
+git clone <this-repository-url>
+cd <repository-name>
+npm i
+npm run dev
+```
+
+## Installeren in een andere shell
+
+1. Draai `sql/print-schema.sql` één keer in de Supabase-database van die shell
+   (SQL editor). Het script is idempotent en zet tabellen, rechten, RLS,
+   functies, de geplande taken én de opslagmap `layout-logos` voor de Logo
+   Bibliotheek klaar. Zorg dat de extensies `pg_cron` en `pg_net` aan staan.
+
+2. Zet in de omgeving van de shell:
+   - `SUPABASE_URL` en `SERVICE_ROLE_KEY` — nodig voor achtergrondprinten
+   - `CENTRAL_AUTH_URL` en `CENTRAL_AUTH_SECRET` — nodig voor de printdienst
+3. Zorg dat de shell het tick-eindpunt host. De setup-CLI doet dit automatisch
+   op basis van `flowselections.serverRoutes` in `package.json`. Handmatig
+   opgezette shells maken zelf dit bestand aan:
+
+   ```ts
+   // src/routes/api/public/print/queue-tick.ts
+   import { createFileRoute } from "@tanstack/react-router";
+   import { behandelQueueTick } from "@flowselections/layout-maker/print";
+
+   export const Route = createFileRoute("/api/public/print/queue-tick")({
+     server: {
+       handlers: {
+         POST: async ({ request }) => {
+           // De shell levert de databaseverbinding; de module maakt er nooit zelf een.
+           const { supabaseAdmin } = await import(
+             "../../../../integrations/supabase/client.server"
+           );
+           return behandelQueueTick(request, supabaseAdmin);
+         },
+       },
+     },
+   });
+   ```
+
+   Het eindpunt accepteert drie toegangsbewijzen: een runner-sleutel uit
+   `print_queue_runners.tick_sleutel`, `SUPABASE_PUBLISHABLE_KEY` (de cron) of
+   het sessietoken van een ingelogde gebruiker (de knop in de Printwachtrij).
+
+
+4. Klaar. Zodra de module in de shell draait meldt hij zichzelf aan als
+   verwerker van de printwachtrij. Een nieuwe printopdracht wordt meteen
+   opgepakt; daarnaast verwerkt de geplande taak `print-queue-tick` elke minuut
+   de wachtende opdrachten. Reageert een shell een uur lang niet, dan wordt hij
+   automatisch op inactief gezet. De taak `print-queue-cleanup` ruimt dagelijks
+   oude opdrachten en bestanden op.
+
+## Printen vanuit een andere module
+
+Andere modules in dezelfde shell gebruiken uitsluitend de print-API van deze
+module; zij hoeven de printtabellen niet te kennen en mogen er ook niet zelf in
+schrijven (dan blijft de opdracht wachten tot de volgende cronronde).
+
+```ts
+import {
+  printDocument, printPdf, printHtml,
+  printerVoorWerkplek, printerVoorDocumenttype, volgJobStatus,
+} from "@flowselections/layout-maker";
+
+// 1. Document dat via een ontwerp uit deze module wordt opgemaakt
+const { jobId } = await printDocument({
+  documenttype: "pakbon",          // moet een bestaande documentsoort zijn
+  documentnaam: "PB-2601284",
+  payload: { order, order_id: order.id }, // order_id: verplicht kenmerk
+});
+
+// 2. Kant-en-klare PDF (Floriday-document, klantsticker, externe factuur)
+//    Zonder printerId wordt de printer bepaald via de gekoppelde layout van
+//    de documentsoort (of de koppeling op papierformaat).
+await printPdf({
+  documenttype: "factuur",
+  documentnaam: "F-2026-00123",
+  pdfBase64,                       // met of zonder data:-voorvoegsel
+  payload: { order_id: factuur.id },
+});
+
+// Geef in payload altijd een order-kenmerk mee: queue_item_id, order_id of
+// ordernummer. De wachtrij gebruikt dat om dubbele aanvragen te herkennen;
+// zonder kenmerk kunnen twee orders met dezelfde documentnaam binnen tien
+// minuten als dubbel worden gezien.
+
+
+// Of expliciet per werkplek:
+const printerId = await printerVoorWerkplek("PICKSTATION-1", "A4");
+await printPdf({
+  documenttype: "afleverbrief",
+  documentnaam: "AFL-12345",
+  pdfBase64,
+  printerId: printerId!,
+});
+
+
+// 3. Eigen opmaak afdrukken (geen layout, anders wint de layout)
+await printHtml({
+  documenttype: "controlelijst",
+  documentnaam: "Controlelijst kar 12",
+  html,
+  printerId: printerId!,
+});
+
+// Status live volgen (realtime staat aan op print_jobs)
+const stop = volgJobStatus(jobId, (s) => console.log(s.status, s.foutmelding));
+```
+
+Belangrijk:
+
+- **Documentsoorten** liggen vast in de database: pakbon, factuur, offerte,
+  orderbevestiging, etiket, verzendlabel, productlabel, barcode_label,
+  magazijnlijst, controlelijst, transportdocument, sticker, productiebon,
+  veilingbon, afleverbrief, veilingbrief en vrij.
+- **Beslisvolgorde bij het afdrukken**: kant-en-klare PDF > gekoppelde layout >
+  meegestuurde opmaak > actieve layout van de documentsoort.
+- **Dubbelbeveiliging**: een identieke aanvraag binnen 10 minuten wordt
+  genegeerd; de aanroep werpt dan `DubbeleAanvraagFout`. Geef bij bulkprints per
+  document een eigen `documentnaam` zodat elke opdracht uniek is.

package/dist-lib/components/ComputersLijst.d.ts

@@ -2,7 +2,8 @@ export interface ComputerModel {
     id: string;
     naam: string;
     online: boolean;
-    aantalPrinters: number;
+    /** Printers die het printprogramma op deze computer ziet. */
+    aantalGevonden: number;
 }
 export declare function useComputers(): {
     computers: ComputerModel[];

package/dist-lib/components/ComputersLijst.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComputersLijst.d.ts","sourceRoot":"","sources":["../../src/components/ComputersLijst.tsx"],"names":[],"mappings":"AAoBA,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,YAAY;;;;;EA6C3B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,OAAO,EACP,IAAI,EACJ,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,qBAAqB,EACrB,YAAoB,GACrB,EAAE;IACD,SAAS,EAAE,aAAa,EAAE,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,aAAa,EAAE,OAAO,CAAC;IACvB,qBAAqB,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,+BAuHA"}
+{"version":3,"file":"ComputersLijst.d.ts","sourceRoot":"","sources":["../../src/components/ComputersLijst.tsx"],"names":[],"mappings":"AAoBA,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,6DAA6D;IAC7D,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,YAAY;;;;;EA6C3B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,OAAO,EACP,IAAI,EACJ,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,qBAAqB,EACrB,YAAoB,GACrB,EAAE;IACD,SAAS,EAAE,aAAa,EAAE,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,aAAa,EAAE,OAAO,CAAC;IACvB,qBAAqB,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,+BAuHA"}

package/dist-lib/components/ComputersLijst.js

@@ -29,7 +29,7 @@ export function useComputers() {
                 id: String(comp.id),
                 naam: comp.naam,
                 online: !!comp.online,
-                aantalPrinters: printers.filter((pr) => pr.computer === comp.naam).length,
+                aantalGevonden: printers.filter((pr) => pr.computer === comp.naam).length,
             })));
         }
         catch (e) {
@@ -68,7 +68,7 @@ export function ComputersLijst({ computers, loading, fout, onVernieuw, onPrinter
         if (gevonden)
             setNieuw(gevonden);
     }, [computers, toevoegenOpen, wachtOp, nieuw]);
-    return (_jsxs("div", { className: alleenDialog ? "" : "space-y-3", children: [!alleenDialog && loading && _jsx("p", { className: "text-muted-foreground text-sm", children: "Laden\u2026" }), !alleenDialog && !loading && fout && (_jsx(Card, { children: _jsxs(CardContent, { className: "space-y-3 py-6", children: [_jsx("p", { className: "font-medium", children: "Geen verbinding" }), _jsx("p", { className: "text-muted-foreground text-sm", children: fout }), _jsxs(Button, { variant: "outline", onClick: onVernieuw, children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), " Opnieuw proberen"] })] }) })), !alleenDialog && !loading && !fout && computers.length === 0 && (_jsx(Card, { children: _jsxs(CardContent, { className: "space-y-4 py-8", children: [_jsx(PrintProgrammaUitleg, {}), _jsxs(Button, { onClick: () => onToevoegenOpenChange(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Computer toevoegen"] })] }) })), !alleenDialog && computers.map((c) => (_jsxs("div", { className: "bg-card flex items-center gap-4 rounded-xl border p-4", children: [_jsx("div", { className: "bg-muted rounded-lg p-2.5", children: _jsx(Monitor, { className: "text-muted-foreground h-5 w-5" }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate font-medium", children: c.naam }), _jsxs("p", { className: "text-muted-foreground text-sm", children: [c.aantalPrinters, " ", c.aantalPrinters === 1 ? "printer" : "printers"] })] }), _jsx("span", { className: `rounded-full px-2.5 py-1 text-xs font-medium ${c.online ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"}`, children: c.online ? "Aan" : "Uit" }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => onPrintersToevoegen(c.naam), children: "Printers toevoegen" })] }, c.id))), !alleenDialog && computers.length > 0 && _jsx(WerktHetNiet, {}), _jsx(Dialog, { open: toevoegenOpen, onOpenChange: onToevoegenOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-lg", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Computer toevoegen" }), _jsx(DialogDescription, { children: "Zet het printprogramma klaar op de computer waar de printers aan hangen." })] }), _jsx(PrintProgrammaUitleg, { compact: true }), _jsx("div", { className: "rounded-lg border p-4 text-sm", children: nieuw ? (_jsxs("div", { className: "space-y-3", children: [_jsxs("p", { className: "font-medium", children: ["Computer gevonden: ", nieuw.naam] }), _jsx(Button, { onClick: () => {
+    return (_jsxs("div", { className: alleenDialog ? "" : "space-y-3", children: [!alleenDialog && loading && _jsx("p", { className: "text-muted-foreground text-sm", children: "Laden\u2026" }), !alleenDialog && !loading && fout && (_jsx(Card, { children: _jsxs(CardContent, { className: "space-y-3 py-6", children: [_jsx("p", { className: "font-medium", children: "Geen verbinding" }), _jsx("p", { className: "text-muted-foreground text-sm", children: fout }), _jsxs(Button, { variant: "outline", onClick: onVernieuw, children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), " Opnieuw proberen"] })] }) })), !alleenDialog && !loading && !fout && computers.length === 0 && (_jsx(Card, { children: _jsxs(CardContent, { className: "space-y-4 py-8", children: [_jsx(PrintProgrammaUitleg, {}), _jsxs(Button, { onClick: () => onToevoegenOpenChange(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Computer toevoegen"] })] }) })), !alleenDialog && computers.map((c) => (_jsxs("div", { className: "bg-card flex items-center gap-4 rounded-xl border p-4", children: [_jsx("div", { className: "bg-muted rounded-lg p-2.5", children: _jsx(Monitor, { className: "text-muted-foreground h-5 w-5" }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate font-medium", children: c.naam }), _jsxs("p", { className: "text-muted-foreground text-sm", children: [c.aantalGevonden, " ", c.aantalGevonden === 1 ? "printer gevonden" : "printers gevonden"] })] }), _jsx("span", { className: `rounded-full px-2.5 py-1 text-xs font-medium ${c.online ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"}`, children: c.online ? "Aan" : "Uit" }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => onPrintersToevoegen(c.naam), children: "Printers toevoegen" })] }, c.id))), !alleenDialog && computers.length > 0 && _jsx(WerktHetNiet, {}), _jsx(Dialog, { open: toevoegenOpen, onOpenChange: onToevoegenOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-lg", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Computer toevoegen" }), _jsx(DialogDescription, { children: "Zet het printprogramma klaar op de computer waar de printers aan hangen." })] }), _jsx(PrintProgrammaUitleg, { compact: true }), _jsx("div", { className: "rounded-lg border p-4 text-sm", children: nieuw ? (_jsxs("div", { className: "space-y-3", children: [_jsxs("p", { className: "font-medium", children: ["Computer gevonden: ", nieuw.naam] }), _jsx(Button, { onClick: () => {
                                             onToevoegenOpenChange(false);
                                             onPrintersToevoegen(nieuw.naam);
                                         }, children: "Printers van deze computer toevoegen" })] })) : (_jsxs("p", { className: "text-muted-foreground flex items-center gap-2", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), " We wachten tot de computer zich meldt\u2026"] })) }), _jsx("div", { className: "flex justify-end", children: _jsx(Button, { variant: "outline", onClick: () => onToevoegenOpenChange(false), children: "Sluiten" }) }), _jsx(WerktHetNiet, {})] }) })] }));

package/dist-lib/components/DocumentRouteringPage.d.ts

@@ -0,0 +1,2 @@
+export declare function DocumentRouteringPage(): import("react").JSX.Element;
+//# sourceMappingURL=DocumentRouteringPage.d.ts.map

package/dist-lib/components/DocumentRouteringPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocumentRouteringPage.d.ts","sourceRoot":"","sources":["../../src/components/DocumentRouteringPage.tsx"],"names":[],"mappings":"AA2CA,wBAAgB,qBAAqB,gCAiTpC"}

package/dist-lib/components/DocumentRouteringPage.js

@@ -0,0 +1,115 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// ============================================================================
+// src/components/DocumentRouteringPage.tsx — overzicht: welke documentsoort
+// gaat via welke werkplek naar welke printer.
+// ============================================================================
+import { useMemo, useState } from "react";
+import { Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, toast, } from "@flowselections/core";
+import { Link } from "@tanstack/react-router";
+import { AlertTriangle, Monitor, Plus, Printer, Trash2 } from "lucide-react";
+import { DOCUMENT_TYPES, documentTypeLabel, isFloridayLayout } from "../lib/documentTypes.js";
+import { documentProfiel } from "../lib/documentProfiles.js";
+import { usePrinters } from "../lib/useDocumentData.js";
+import { useAlleFormaatPrinters, zetFormaatPrinter } from "../lib/formaatPrinters.js";
+import { BRONNEN, HERKOMSTEN, useBronregels, zetBronregel, } from "../lib/documentBron.js";
+import { useLayouts } from "../lib/useDocumentData.js";
+import { useWerkplekPrinters, verwijderWerkplekPrinter, zetWerkplekPrinter, } from "../lib/documentRoutering.js";
+import { useComputers } from "./ComputersLijst.js";
+const GEEN = "geen";
+export function DocumentRouteringPage() {
+    const { printers } = usePrinters();
+    const { computers } = useComputers();
+    const { koppelingen: standaard, reload: herlaadStandaard } = useAlleFormaatPrinters();
+    const { koppelingen: werkplekken, reload: herlaadWerkplekken } = useWerkplekPrinters();
+    const { regels, reload: herlaadRegels } = useBronregels();
+    const { layouts } = useLayouts();
+    const [zoek, setZoek] = useState("");
+    const [nieuw, setNieuw] = useState(null);
+    const [nieuweWerkplek, setNieuweWerkplek] = useState("");
+    const [nieuwePrinter, setNieuwePrinter] = useState(GEEN);
+    const printerNaam = (id) => printers.find((p) => p.id === id)?.naam ?? "Onbekende printer";
+    const standaardFormaat = (type) => documentProfiel(type).formaten[0]?.code ?? "A4";
+    /** Formaat zoals de gebruiker het ziet: dat van de actieve layouts zelf. */
+    const weergaveFormaat = (type) => {
+        const eigen = Array.from(new Set(layouts
+            .filter((l) => l.documenttype === type && l.actief)
+            .map((l) => l.papierformaat)
+            .filter((f) => !!f)));
+        if (eigen.length === 1)
+            return eigen[0];
+        if (eigen.length > 1)
+            return `${eigen.length} formaten`;
+        return standaardFormaat(type);
+    };
+    const standaardVoor = (type) => standaard.find((k) => k.documenttype === type && k.formaat_code === standaardFormaat(type))
+        ?.printer_id ?? null;
+    const werkplekkenVoor = (type) => werkplekken.filter((w) => w.documenttype === type);
+    const rijen = useMemo(() => {
+        const term = zoek.trim().toLowerCase();
+        return DOCUMENT_TYPES.filter((d) => (term ? d.label.toLowerCase().includes(term) : true));
+    }, [zoek]);
+    const kiesStandaard = async (type, printerId) => {
+        try {
+            await zetFormaatPrinter(type, standaardFormaat(type), printerId === GEEN ? null : printerId);
+            await herlaadStandaard();
+            toast.success("Standaardprinter bijgewerkt");
+        }
+        catch {
+            toast.error("Opslaan mislukt");
+        }
+    };
+    const voegWerkplekToe = async (type) => {
+        if (!nieuweWerkplek.trim()) {
+            toast.error("Kies eerst een werkplek");
+            return;
+        }
+        try {
+            await zetWerkplekPrinter(type, nieuweWerkplek, nieuwePrinter === GEEN ? null : nieuwePrinter, standaardFormaat(type));
+            await herlaadWerkplekken();
+            setNieuw(null);
+            setNieuweWerkplek("");
+            setNieuwePrinter(GEEN);
+            toast.success("Werkplek gekoppeld");
+        }
+        catch {
+            toast.error("Opslaan mislukt");
+        }
+    };
+    const bronVan = (type, herkomst) => regels.find((r) => r.documenttype === type && r.herkomst === herkomst);
+    const kiesBron = async (type, herkomst, bron, layoutId) => {
+        try {
+            await zetBronregel(type, herkomst, bron, layoutId ?? null);
+            await herlaadRegels();
+            toast.success("Documentbron bijgewerkt");
+        }
+        catch {
+            toast.error("Opslaan mislukt");
+        }
+    };
+    const verwijder = async (id) => {
+        try {
+            await verwijderWerkplekPrinter(id);
+            await herlaadWerkplekken();
+            toast.success("Uitzondering verwijderd");
+        }
+        catch {
+            toast.error("Verwijderen mislukt");
+        }
+    };
+    return (_jsxs("main", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Documentroutering" }), _jsx("p", { className: "text-muted-foreground text-sm", children: "Bepaal per documentsoort welke printer wordt gebruikt, en welke printer geldt op een specifieke werkplek." })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { className: "w-56", placeholder: "Zoek documentsoort", value: zoek, onChange: (e) => setZoek(e.target.value) }), _jsx(Button, { variant: "outline", asChild: true, children: _jsxs(Link, { to: "/layouts-printers/printers", children: [_jsx(Printer, { className: "mr-2 h-4 w-4" }), " Printers"] }) })] })] }), _jsx(Card, { children: _jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Keuzevolgorde" }), _jsx(CardDescription, { children: "1. printer die de module meestuurt \u00B7 2. uitzondering voor de werkplek \u00B7 3. printer gekoppeld aan het ontwerp \u00B7 4. standaardprinter hieronder \u00B7 5. is er maar \u00E9\u00E9n actieve printer, dan die \u00B7 6. anders blijft de opdracht wachten in de printwachtrij." })] }) }), _jsx("div", { className: "space-y-3", children: rijen.map((d) => {
+                    const uitzonderingen = werkplekkenVoor(d.value);
+                    const std = standaardVoor(d.value);
+                    const zonderPrinter = !std && uitzonderingen.length === 0;
+                    return (_jsxs(Card, { children: [_jsxs(CardContent, { className: "grid gap-4 py-4 lg:grid-cols-[220px_260px_1fr]", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "font-medium", children: documentTypeLabel(d.value) }), _jsx("p", { className: "text-muted-foreground text-xs", children: weergaveFormaat(d.value) }), zonderPrinter && (_jsxs("p", { className: "text-destructive mt-1 flex items-center gap-1 text-xs", children: [_jsx(AlertTriangle, { className: "h-3.5 w-3.5" }), " Geen printer ingesteld"] }))] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-muted-foreground text-xs uppercase", children: "Standaardprinter" }), _jsxs(Select, { value: std ?? GEEN, onValueChange: (v) => void kiesStandaard(d.value, v), children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Geen printer" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Geen printer" }), printers.map((p) => (_jsx(SelectItem, { value: p.id, children: p.naam }, p.id)))] })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-muted-foreground text-xs uppercase", children: "Per werkplek" }), uitzonderingen.map((w) => (_jsxs("div", { className: "flex items-center gap-2 text-sm", children: [_jsx(Monitor, { className: "text-muted-foreground h-4 w-4 shrink-0" }), _jsxs("span", { className: "min-w-0 flex-1 truncate", children: [w.werkplek, " \u2192 ", printerNaam(w.printer_id)] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => void verwijder(w.id), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, w.id))), nieuw === d.value ? (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsxs(Select, { value: nieuweWerkplek, onValueChange: setNieuweWerkplek, children: [_jsx(SelectTrigger, { className: "w-48", children: _jsx(SelectValue, { placeholder: "Kies werkplek" }) }), _jsx(SelectContent, { children: computers.map((c) => (_jsx(SelectItem, { value: c.naam, children: c.naam }, c.id))) })] }), _jsxs(Select, { value: nieuwePrinter, onValueChange: setNieuwePrinter, children: [_jsx(SelectTrigger, { className: "w-48", children: _jsx(SelectValue, { placeholder: "Kies printer" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Geen printer" }), printers.map((p) => (_jsx(SelectItem, { value: p.id, children: p.naam }, p.id)))] })] }), _jsx(Button, { size: "sm", onClick: () => void voegWerkplekToe(d.value), children: "Opslaan" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => setNieuw(null), children: "Annuleren" })] })) : (_jsxs(Button, { size: "sm", variant: "outline", onClick: () => {
+                                                    setNieuw(d.value);
+                                                    setNieuweWerkplek("");
+                                                    setNieuwePrinter(GEEN);
+                                                }, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Werkplek toevoegen"] }))] })] }), _jsxs(CardContent, { className: "border-t pt-4", children: [_jsx("p", { className: "text-muted-foreground mb-2 text-xs uppercase", children: "Bron per herkomst" }), _jsx("div", { className: "grid gap-2 sm:grid-cols-2", children: HERKOMSTEN.map((h) => {
+                                            const regel = bronVan(d.value, h.value);
+                                            const huidig = regel?.bron ?? "auto";
+                                            return (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: "w-32 shrink-0 text-sm", children: h.label }), _jsxs(Select, { value: huidig, onValueChange: (v) => void kiesBron(d.value, h.value, v, regel?.layout_id ?? null), children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: BRONNEN.map((b) => (_jsx(SelectItem, { value: b.value, children: b.label }, b.value))) })] }), huidig === "eigen_layout" && (_jsxs(Select, { value: regel?.layout_id ?? GEEN, onValueChange: (v) => void kiesBron(d.value, h.value, "eigen_layout", v === GEEN ? null : v), children: [_jsx(SelectTrigger, { className: "w-52", children: _jsx(SelectValue, { placeholder: "Standaardontwerp" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: GEEN, children: "Standaardontwerp" }), layouts
+                                                                        .filter((l) => l.documenttype === d.value)
+                                                                        .map((l) => (_jsxs(SelectItem, { value: l.id, children: [l.naam, isFloridayLayout(l) ? " (uit Floriday)" : ""] }, l.id)))] })] }))] }, h.value));
+                                        }) })] })] }, d.value));
+                }) })] }));
+}

package/dist-lib/components/LayoutsPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutsPage.d.ts","sourceRoot":"","sources":["../../src/components/LayoutsPage.tsx"],"names":[],"mappings":"AA0DA,wBAAgB,WAAW,gCAkjB1B"}
+{"version":3,"file":"LayoutsPage.d.ts","sourceRoot":"","sources":["../../src/components/LayoutsPage.tsx"],"names":[],"mappings":"AAgEA,wBAAgB,WAAW,gCA4kB1B"}

package/dist-lib/components/LayoutsPage.js

@@ -3,9 +3,9 @@ import { useMemo, useState } from "react";
 import { useAutoRefresh } from "../lib/useAutoRefresh.js";
 import { useNavigate } from "@tanstack/react-router";
 import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Separator, Switch, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Textarea, toast, } from "@flowselections/core";
-import { Copy, FileText, Images, Pencil, Plus, Search, Settings2, Trash2 } from "lucide-react";
+import { Copy, FileText, Pencil, Plus, Search, Settings2, Trash2 } from "lucide-react";
 import { dupliceerLayout, maakLayout, updateLayout, useLayouts, verwijderLayout, } from "../lib/useDocumentData.js";
-import { DOCUMENT_TYPES, PAPIERFORMATEN, documentTypeLabel } from "../lib/documentTypes.js";
+import { DOCUMENT_TYPES, FLORIDAY_LAYOUT_TOELICHTING, PAPIERFORMATEN, documentTypeLabel, isFloridayLayout, } from "../lib/documentTypes.js";
 import { DOCUMENT_PROFIELEN, documentProfiel, primaireProfielen, standaardConfig, } from "../lib/documentProfiles.js";
 function klantOntwerpLayout(l) {
     if (l.documenttype !== "sticker")
@@ -20,6 +20,7 @@ export function LayoutsPage() {
     const [zoek, setZoek] = useState("");
     const [typeFilter, setTypeFilter] = useState("alle");
     const [statusFilter, setStatusFilter] = useState("alle");
+    const [bronFilter, setBronFilter] = useState("alle");
     const [wizardOpen, setWizardOpen] = useState(false);
     const [stap, setStap] = useState(1);
     const [naam, setNaam] = useState("");
@@ -89,8 +90,12 @@ export function LayoutsPage() {
             return false;
         if (statusFilter === "inactief" && l.actief)
             return false;
+        if (bronFilter === "floriday" && !isFloridayLayout(l))
+            return false;
+        if (bronFilter === "eigen" && isFloridayLayout(l))
+            return false;
         return true;
-    }), [layouts, zoek, typeFilter, statusFilter]);
+    }), [layouts, zoek, typeFilter, statusFilter, bronFilter]);
     const aanmaken = async () => {
         if (!naam.trim()) {
             toast.error("Geef de layout een naam");
@@ -139,15 +144,15 @@ export function LayoutsPage() {
             setBezig(false);
         }
     };
-    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Documentlayouts" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Ontwerp pakbonnen, facturen, etiketten en alle andere documenten." })] }), _jsxs("div", { className: "flex gap-2", children: [_jsxs(Button, { variant: "outline", onClick: () => navigate({ to: "/layouts-printers/logos" }), children: [_jsx(Images, { className: "mr-2 h-4 w-4" }), " Logo's"] }), _jsxs(Button, { onClick: () => setWizardOpen(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Nieuwe layout"] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Overzicht" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} van ${layouts.length} layouts` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-4", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op naam of omschrijving", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: typeFilter, onValueChange: setTypeFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Documenttype" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle documenttypes" }), DOCUMENT_TYPES.map((d) => (_jsx(SelectItem, { value: d.value, children: d.label }, d.value)))] })] }), _jsxs(Select, { value: statusFilter, onValueChange: setStatusFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Status" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), _jsx(SelectItem, { value: "actief", children: "Actief" }), _jsx(SelectItem, { value: "inactief", children: "Inactief" })] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Naam" }), _jsx(TableHead, { children: "Documenttype" }), _jsx(TableHead, { children: "Formaat" }), _jsx(TableHead, { children: "Versie" }), _jsx(TableHead, { children: "Actief" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen layouts gevonden." }) })), gefilterd.map((l) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsxs("div", { className: "flex items-center gap-2 font-medium", children: [_jsx(FileText, { className: "h-4 w-4 text-muted-foreground" }), l.naam, l.is_standaard && _jsx(Badge, { variant: "secondary", children: "Standaard" })] }), l.omschrijving && (_jsx("span", { className: "text-xs text-muted-foreground", children: l.omschrijving }))] }), _jsx(TableCell, { children: documentTypeLabel(l.documenttype) }), _jsxs(TableCell, { className: "text-sm text-muted-foreground", children: [l.papierformaat, " \u00B7 ", Number(l.breedte_mm), " \u00D7 ", Number(l.hoogte_mm), " mm"] }), _jsxs(TableCell, { children: ["v", l.huidige_versie] }), _jsx(TableCell, { children: _jsx(Switch, { checked: l.actief, onCheckedChange: async (v) => {
+    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Documentlayouts" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Ontwerp pakbonnen, facturen, etiketten en alle andere documenten." })] }), _jsx("div", { className: "flex gap-2", children: _jsxs(Button, { onClick: () => setWizardOpen(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), " Nieuwe layout"] }) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Overzicht" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} van ${layouts.length} layouts` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-5", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op naam of omschrijving", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: typeFilter, onValueChange: setTypeFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Documenttype" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle documenttypes" }), DOCUMENT_TYPES.map((d) => (_jsx(SelectItem, { value: d.value, children: d.label }, d.value)))] })] }), _jsxs(Select, { value: statusFilter, onValueChange: setStatusFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Status" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), _jsx(SelectItem, { value: "actief", children: "Actief" }), _jsx(SelectItem, { value: "inactief", children: "Inactief" })] })] }), _jsxs(Select, { value: bronFilter, onValueChange: setBronFilter, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Herkomst" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle herkomsten" }), _jsx(SelectItem, { value: "eigen", children: "Eigen ontwerp" }), _jsx(SelectItem, { value: "floriday", children: "Uit Floriday" })] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Naam" }), _jsx(TableHead, { children: "Documenttype" }), _jsx(TableHead, { children: "Formaat" }), _jsx(TableHead, { children: "Versie" }), _jsx(TableHead, { children: "Actief" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen layouts gevonden." }) })), gefilterd.map((l) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsxs("div", { className: "flex items-center gap-2 font-medium", children: [_jsx(FileText, { className: "h-4 w-4 text-muted-foreground" }), l.naam, l.is_standaard && _jsx(Badge, { variant: "secondary", children: "Standaard" }), isFloridayLayout(l) && _jsx(Badge, { variant: "outline", children: "Uit Floriday" })] }), (l.omschrijving || isFloridayLayout(l)) && (_jsx("span", { className: "text-xs text-muted-foreground", children: isFloridayLayout(l) ? FLORIDAY_LAYOUT_TOELICHTING : l.omschrijving }))] }), _jsx(TableCell, { children: documentTypeLabel(l.documenttype) }), _jsxs(TableCell, { className: "text-sm text-muted-foreground", children: [l.papierformaat, " \u00B7 ", Number(l.breedte_mm), " \u00D7 ", Number(l.hoogte_mm), " mm"] }), _jsxs(TableCell, { children: ["v", l.huidige_versie] }), _jsx(TableCell, { children: _jsx(Switch, { checked: l.actief, onCheckedChange: async (v) => {
                                                                 await updateLayout(l.id, { actief: v });
                                                                 void reload();
-                                                            } }) }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [klantOntwerpLayout(l) ? (_jsx(Badge, { variant: "outline", children: "Ontwerp van klant" })) : (_jsxs(Button, { variant: "ghost", size: "sm", onClick: () => navigate(l.documenttype === "productiebon"
+                                                            } }) }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [isFloridayLayout(l) ? (_jsx("span", { className: "text-xs text-muted-foreground", children: "Niet aanpasbaar \u2014 komt uit Floriday" })) : klantOntwerpLayout(l) ? (_jsx(Badge, { variant: "outline", children: "Ontwerp van klant" })) : (_jsxs(Button, { variant: "ghost", size: "sm", onClick: () => navigate(l.documenttype === "productiebon"
                                                                         ? {
                                                                             to: "/layouts-printers/productiebon/$layoutId",
                                                                             params: { layoutId: l.id },
                                                                         }
-                                                                        : { to: "/layouts-printers/pakbon/$layoutId", params: { layoutId: l.id } }), children: [_jsx(Pencil, { className: "mr-2 h-4 w-4" }), " Ontwerpen"] })), _jsx(Button, { variant: "ghost", size: "sm", title: "Naam, documenttype en formaat wijzigen", onClick: () => openBewerken(l), children: _jsx(Settings2, { className: "h-4 w-4" }) }), _jsx(Button, { variant: "ghost", size: "sm", onClick: async () => {
+                                                                        : { to: "/layouts-printers/pakbon/$layoutId", params: { layoutId: l.id } }), children: [_jsx(Pencil, { className: "mr-2 h-4 w-4" }), " Ontwerpen"] })), !isFloridayLayout(l) && (_jsx(Button, { variant: "ghost", size: "sm", title: "Naam, documenttype en formaat wijzigen", onClick: () => openBewerken(l), children: _jsx(Settings2, { className: "h-4 w-4" }) })), !isFloridayLayout(l) && (_jsx(Button, { variant: "ghost", size: "sm", title: "Kopie maken", onClick: async () => {
                                                                         try {
                                                                             await dupliceerLayout(l.id);
                                                                             toast.success("Layout gedupliceerd");
@@ -156,7 +161,7 @@ export function LayoutsPage() {
                                                                         catch {
                                                                             toast.error("Dupliceren mislukt");
                                                                         }
-                                                                    }, children: _jsx(Copy, { className: "h-4 w-4" }) }), _jsx(Button, { variant: "ghost", size: "sm", onClick: async () => {
+                                                                    }, children: _jsx(Copy, { className: "h-4 w-4" }) })), !isFloridayLayout(l) && (_jsx(Button, { variant: "ghost", size: "sm", title: "Layout verwijderen", onClick: async () => {
                                                                         try {
                                                                             await verwijderLayout(l.id);
                                                                             toast.success("Layout verwijderd");
@@ -165,7 +170,7 @@ export function LayoutsPage() {
                                                                         catch {
                                                                             toast.error("Verwijderen mislukt");
                                                                         }
-                                                                    }, children: _jsx(Trash2, { className: "h-4 w-4" }) })] }) })] }, l.id)))] })] })] })] }), _jsx(Dialog, { open: wizardOpen, onOpenChange: (v) => {
+                                                                    }, children: _jsx(Trash2, { className: "h-4 w-4" }) }))] }) })] }, l.id)))] })] })] })] }), _jsx(Dialog, { open: wizardOpen, onOpenChange: (v) => {
                     setWizardOpen(v);
                     if (!v)
                         setStap(1);

package/dist-lib/components/PrintQueuePage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrintQueuePage.d.ts","sourceRoot":"","sources":["../../src/components/PrintQueuePage.tsx"],"names":[],"mappings":"AAuCA,wBAAgB,cAAc,gCAoN7B"}
+{"version":3,"file":"PrintQueuePage.d.ts","sourceRoot":"","sources":["../../src/components/PrintQueuePage.tsx"],"names":[],"mappings":"AAuDA,wBAAgB,cAAc,gCAqN7B"}

package/dist-lib/components/PrintQueuePage.js

@@ -3,6 +3,7 @@ import { useMemo, useRef, useState } from "react";
 import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, toast, } from "@flowselections/core";
 import { RotateCcw, Search, XCircle } from "lucide-react";
 import { bijgewerktTekst, useAutoRefresh } from "../lib/useAutoRefresh.js";
+import { PrintStatusBanner } from "./PrintStatusBanner.js";
 import { maakPrintJob, updateJobStatus, useLayouts, usePrinters, usePrintJobs } from "../lib/useDocumentData.js";
 import { printStatus } from "../lib/printService.functions.js";
 import { vraagWachtrijRonde } from "../lib/queueTickClient.js";
@@ -14,6 +15,20 @@ const STATUS_VARIANT = {
     mislukt: "destructive",
     geannuleerd: "outline",
 };
+/**
+ * Heeft deze opdracht een kenmerk waarmee hij van andere orders te
+ * onderscheiden is? Zo niet, dan valt de dubbelbescherming terug op het
+ * document zelf en kan de aanleverende module dit beter aanvullen.
+ */
+function heeftOrderKenmerk(job) {
+    const p = (job.payload ?? {});
+    if (typeof p !== "object" || p === null)
+        return false;
+    return ["queue_item_id", "order_id", "ordernummer", "order_number", "orderId"].some((k) => {
+        const w = p[k];
+        return (typeof w === "string" && w.trim() !== "") || typeof w === "number";
+    });
+}
 export function PrintQueuePage() {
     const { jobs, loading, reload } = usePrintJobs();
     const { printers } = usePrinters();
@@ -68,7 +83,7 @@ export function PrintQueuePage() {
         await reload(true);
     };
     const bijgewerkt = useAutoRefresh(ronde, lopende ? 5000 : 20000);
-    return (_jsxs("main", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Printwachtrij" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Volg printopdrachten, herstart mislukte prints en print documenten opnieuw." })] }), _jsx("span", { className: "text-muted-foreground text-xs", children: bijgewerktTekst(bijgewerkt) })] }), tickFout && (_jsx("div", { className: "rounded-md border border-destructive/40 bg-destructive/10 p-3 text-sm text-destructive", children: tickFout })), _jsx("div", { className: "grid gap-4 md:grid-cols-4", children: ["wachtend", "bezig", "voltooid", "mislukt"].map((s) => (_jsx(Card, { children: _jsxs(CardHeader, { className: "pb-2", children: [_jsx(CardDescription, { className: "capitalize", children: s }), _jsx(CardTitle, { className: "text-2xl", children: tellingen[s] ?? 0 })] }) }, s))) }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Opdrachten" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} opdrachten` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-4", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op document of gebruiker", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: status, onValueChange: setStatus, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), ["wachtend", "bezig", "voltooid", "mislukt", "geannuleerd"].map((s) => (_jsx(SelectItem, { value: s, children: s }, s)))] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Document" }), _jsx(TableHead, { children: "Layout" }), _jsx(TableHead, { children: "Printer" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { children: "Tijdstip" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen printopdrachten." }) })), gefilterd.map((j) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsx("span", { className: "font-medium", children: j.documentnaam ?? documentTypeLabel(j.documenttype) }), j.is_herprint && (_jsx(Badge, { variant: "outline", className: "ml-2", children: "herprint" })), j.foutmelding && (_jsx("span", { className: "block text-xs text-destructive", children: j.foutmelding }))] }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.layout_id ? layoutNaam.get(j.layout_id) ?? "—" : "—" }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.printer_id ? printerNaam.get(j.printer_id) ?? "—" : "—" }), _jsx(TableCell, { children: _jsx(Badge, { variant: STATUS_VARIANT[j.status] ?? "outline", children: j.status }) }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: new Date(j.created_at).toLocaleString("nl-NL") }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsxs(Button, { variant: "ghost", size: "sm", onClick: async () => {
+    return (_jsxs("main", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Printwachtrij" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Volg printopdrachten, herstart mislukte prints en print documenten opnieuw." })] }), _jsx("span", { className: "text-muted-foreground text-xs", children: bijgewerktTekst(bijgewerkt) })] }), _jsx(PrintStatusBanner, { fout: tickFout }), _jsx("div", { className: "grid gap-4 md:grid-cols-4", children: ["wachtend", "bezig", "voltooid", "mislukt"].map((s) => (_jsx(Card, { children: _jsxs(CardHeader, { className: "pb-2", children: [_jsx(CardDescription, { className: "capitalize", children: s }), _jsx(CardTitle, { className: "text-2xl", children: tellingen[s] ?? 0 })] }) }, s))) }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-3", children: [_jsx(CardTitle, { className: "text-base", children: "Opdrachten" }), _jsx(CardDescription, { children: loading ? "Laden…" : `${gefilterd.length} opdrachten` })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-4", children: [_jsxs("div", { className: "relative md:col-span-2", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: "Zoek op document of gebruiker", value: zoek, onChange: (e) => setZoek(e.target.value) })] }), _jsxs(Select, { value: status, onValueChange: setStatus, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "alle", children: "Alle statussen" }), ["wachtend", "bezig", "voltooid", "mislukt", "geannuleerd"].map((s) => (_jsx(SelectItem, { value: s, children: s }, s)))] })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Document" }), _jsx(TableHead, { children: "Layout" }), _jsx(TableHead, { children: "Printer" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { children: "Tijdstip" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsxs(TableBody, { children: [gefilterd.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 6, className: "py-10 text-center text-sm text-muted-foreground", children: "Geen printopdrachten." }) })), gefilterd.map((j) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsx("span", { className: "font-medium", children: j.documentnaam ?? documentTypeLabel(j.documenttype) }), j.is_herprint && (_jsx(Badge, { variant: "outline", className: "ml-2", children: "herprint" })), !heeftOrderKenmerk(j) && (_jsx(Badge, { variant: "outline", className: "ml-2 text-amber-600", children: "geen orderkenmerk" })), j.foutmelding && (_jsx("span", { className: "block text-xs text-destructive", children: j.foutmelding }))] }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.layout_id ? layoutNaam.get(j.layout_id) ?? "—" : "—" }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: j.printer_id ? printerNaam.get(j.printer_id) ?? "—" : "—" }), _jsx(TableCell, { children: _jsx(Badge, { variant: STATUS_VARIANT[j.status] ?? "outline", children: j.status }) }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: new Date(j.created_at).toLocaleString("nl-NL") }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsxs(Button, { variant: "ghost", size: "sm", onClick: async () => {
                                                                         if (!j.layout_id)
                                                                             return;
                                                                         try {

package/dist-lib/components/PrintStatusBanner.d.ts

@@ -0,0 +1,8 @@
+export declare function PrintStatusBanner({ fout, offlineWerkplekken, toonWerkplekLink, }: {
+    /** Foutmelding van de printdienst, als die er is. */
+    fout?: string | null;
+    /** Namen van werkplekken die nu uit staan. */
+    offlineWerkplekken?: string[];
+    toonWerkplekLink?: boolean;
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=PrintStatusBanner.d.ts.map