@flowselections/pick-schermen-kwekers 1.0.19 → 1.0.20

package/README.md

@@ -1,24 +1,24 @@
-# pick schermen kwekers
-
-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/f7462658-1d60-42f1-8e22-dbefe36f44ef).
-
-- **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
-```
+# pick schermen kwekers
+
+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/f7462658-1d60-42f1-8e22-dbefe36f44ef).
+
+- **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
+```

package/dist-lib/components/pick/PickScherm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PickScherm.d.ts","sourceRoot":"","sources":["../../../src/components/pick/PickScherm.tsx"],"names":[],"mappings":"AAkCA,OAAO,EAOL,KAAK,WAAW,EACjB,MAAM,qBAAqB,CAAC;AAmB7B,UAAU,KAAK;IACb,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAcD;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,+BAwwCpD"}
+{"version":3,"file":"PickScherm.d.ts","sourceRoot":"","sources":["../../../src/components/pick/PickScherm.tsx"],"names":[],"mappings":"AAqCA,OAAO,EAUL,KAAK,WAAW,EACjB,MAAM,qBAAqB,CAAC;AA0B7B,UAAU,KAAK;IACb,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAeD;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,+BAgrDpD"}

package/dist-lib/components/pick/PickScherm.js

@@ -1,26 +1,30 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useQuery } from "@tanstack/react-query";
 import { Badge, Button, Card, CardContent, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, toast, } from "@flowselections/core";
-import { AlertTriangle, ArrowLeft, CheckCircle2, ChevronLeft, ChevronRight, Globe, Loader2, Printer, RefreshCw, Search, WifiOff, Zap, } from "lucide-react";
+import { AlertTriangle, ArrowLeft, CheckCircle2, ChevronLeft, ChevronRight, FileDown, Globe, Loader2, Printer, RefreshCw, Search, WifiOff, Zap, } from "lucide-react";
 import { LanguageTiles } from "./LanguageTiles";
 import { QueueTable } from "./QueueTable";
 import { PreviewDialog } from "./PreviewDialog";
 import { ShippingNoteScan } from "./ShippingNoteScan";
 import { getSessionId, pickApi } from "../../lib/pickApi";
+import { sendLogisticsEvent } from "../../lib/logisticsApi";
 import { completeLogisticsTaskForItem } from "../../lib/pickPrint";
-import { isPdfOnlyFailure, printedCartIdsOf, pdfSaveWarning, } from "../../lib/pickTypes";
+import { isPdfOnlyFailure, pickReadiness, printedCartIdsOf, pdfSaveWarning, unitRefOf, unitTitleOf, } from "../../lib/pickTypes";
 import { getPickTranslator } from "../../lib/pickI18n";
 import { friendlyPickError, getPickUiTexts } from "../../lib/pickUiText";
 import { getPrintJobTexts, printJobStatusLabel } from "../../lib/pickPrintJobText";
 import { defaultFilters, usePickDays, usePickHeartbeat, usePickQueue, } from "../../hooks/usePickQueue";
 import { usePickDocumentTypes, usePickStatuses, useStationPrintPlek, } from "../../hooks/usePickConfig";
 import { usePrintBatch, usePrintJob } from "../../hooks/usePrintJob";
+import { useShippingNoteStatus } from "../../hooks/useShippingNoteStatus";
+import { isWaitingShippingNote, shippingNoteMessage, shippingNoteSourceLabel, } from "../../lib/shippingNoteStatus";
 const LANG_STORAGE_KEY = "pick.language";
 /** Melding als de planning voor deze order geen karren heeft vastgelegd. */
 /** Papier is geprint, maar de PDF-kopie op de werkplek is niet opgeslagen. */
 const PDF_SAVE_NOTICE = "De pakbon is geprint, maar de PDF is niet op de werkplek opgeslagen. Geef de PDF-map in Layout maker opnieuw vrij.";
-/** Melding als de planning voor deze order geen karren heeft vastgelegd. */
-const NO_CART_PLAN_NOTICE = "De karplanning voor deze order is nog niet klaar — de logistiek is automatisch op de hoogte gebracht. De pakbon is als één document geprint.";
+/** Melding als de regel nog niet compleet is aangeleverd door de bron. */
+const NOT_READY_NOTICE = "Deze pakbon is nog niet printklaar. Klik op \"Pakbon ophalen\" om de ontbrekende gegevens bij de bron op te vragen.";
 /**
  * Pickscherm. De Logistiek Engine bepaalt welke documenten zichtbaar zijn en
  * in welke volgorde; dit scherm toont uitsluitend wat de wachtrij teruggeeft.
@@ -36,6 +40,14 @@ export function PickScherm({ station, onBack }) {
     const [pending, setPending] = useState(null);
     const [cartPlan, setCartPlan] = useState(null);
     const [planReason, setPlanReason] = useState(null);
+    const [planStatus, setPlanStatus] = useState(null);
+    const [fetchingData, setFetchingData] = useState(false);
+    const [readinessById, setReadinessById] = useState({});
+    /** Voortgang van de pakboncontrole: hoeveel van de zichtbare regels zijn gecontroleerd. */
+    const [checkProgress, setCheckProgress] = useState({
+        done: 0,
+        total: 0,
+    });
     const [activeCartId, setActiveCartId] = useState(null);
     const [lastPrinted, setLastPrinted] = useState(null);
     const [previewItem, setPreviewItem] = useState(null);
@@ -48,9 +60,62 @@ export function PickScherm({ station, onBack }) {
     const { data: documentTypes } = usePickDocumentTypes();
     const { online } = usePickHeartbeat(station.id, null, sessionId);
     const { data: printPlek, isLoading: plekLoading } = useStationPrintPlek(station.id);
-    const { tracked, track, clear: clearJob } = usePrintJob();
-    const { batch, trackBatch, clearBatch } = usePrintBatch();
+    const { tracked, track: trackJobRaw, clear: clearJob } = usePrintJob();
+    const { batch, trackBatch: trackBatchRaw, clearBatch } = usePrintBatch();
+    const { shippingNotes, watchShippingNotes, clearShippingNotes, refreshShippingNotesNow, } = useShippingNoteStatus();
     const finalizedBatch = useRef(null);
+    const [fetchingNotes, setFetchingNotes] = useState(false);
+    /**
+     * Handmatig alle openstaande verzendbrieven laten ophalen. Eén aanroep per
+     * klik; idempotent en alleen-lezen richting Floriday.
+     */
+    const fetchShippingNotes = useCallback(async () => {
+        if (fetchingNotes)
+            return;
+        setFetchingNotes(true);
+        try {
+            const result = await refreshShippingNotesNow();
+            if (result.ok) {
+                toast.success(result.message ?? "Verzendbrieven worden opgehaald.");
+            }
+            else {
+                toast.info("Ophalen kon nu niet gestart worden — de verwerking gaat zelf verder.");
+            }
+        }
+        finally {
+            setFetchingNotes(false);
+        }
+    }, [fetchingNotes, refreshShippingNotesNow]);
+    /**
+     * Elke geslaagde pakbonprint start ook de statuscontrole van de verzendbrief
+     * bij dezelfde kar. Het teruggegeven print_job-id is de sleutel; opvragen is
+     * alleen-lezen en maakt nooit een nieuwe aanvraag of printopdracht.
+     */
+    const track = useCallback((args) => {
+        trackJobRaw(args);
+        watchShippingNotes([
+            { jobId: args.jobId, cartId: args.cartId ?? null, cartLabel: args.cartLabel ?? null },
+        ]);
+    }, [trackJobRaw, watchShippingNotes]);
+    const trackBatch = useCallback((args) => {
+        trackBatchRaw(args);
+        watchShippingNotes(args.jobs);
+    }, [trackBatchRaw, watchShippingNotes]);
+    /**
+     * Ingestelde werkwijze van de Logistiek Engine. cartsPerPrint bepaalt hoeveel
+     * karren de batchknop in één klik print. Is er geen actieve werkwijze (null),
+     * dan komt er geen knop; dit scherm valt nooit terug op een eigen aantal.
+     */
+    const { data: pickModeInfo } = useQuery({
+        queryKey: ["logistics-pick-mode"],
+        queryFn: () => pickApi.pickMode(),
+        refetchInterval: 30000,
+        staleTime: 15000,
+    });
+    const cartsPerPrint = pickModeInfo?.cartsPerPrint && pickModeInfo.cartsPerPrint > 1
+        ? pickModeInfo.cartsPerPrint
+        : null;
+    const [batchPrinting, setBatchPrinting] = useState(false);
     const t = useMemo(() => getPickTranslator(lang ?? "nl"), [lang]);
     const jobTexts = useMemo(() => getPrintJobTexts(t.lang), [t]);
     const ui = useMemo(() => getPickUiTexts(t.lang), [t]);
@@ -150,44 +215,149 @@ export function PickScherm({ station, onBack }) {
         void chooseDay(iso === todayIso || (pickDay && iso === pickDay) ? "current" : iso);
     }, [chosenDay, pickDay, chooseDay]);
     /**
-     * Haalt het vastgelegde karplan uit de Engine. Heeft de order geen karren
-     * vastgelegd, dan is het antwoord null: het scherm valt dan terug op één
-     * document. De module verzint zelf nooit een karnummer of aantal.
+     * Haalt het vastgelegde karplan én de toestand van de planning uit de bron.
+     * Er wordt niets verzonnen: is het plan er niet, of is het nog niet
+     * vrijgegeven, dan blijft de regel "wacht op gegevens".
      */
     const loadCartPlan = useCallback(async (item) => {
-        let plan = await pickApi.queueCartPlan(item.id);
+        const plan = await pickApi.queueCartPlan(item.id);
+        const ref = unitRefOf(item);
+        let status = null;
+        try {
+            status = ref ? await pickApi.cartPlanStatus(ref) : null;
+        }
+        catch {
+            status = null;
+        }
+        setPlanStatus(status);
+        const readiness = pickReadiness(plan, status, item);
+        setPlanReason(readiness.ready ? null : readiness.reason);
         if (!plan || plan.carts.length === 0) {
-            // Geen karplan: de Engine krijgt direct een seintje en er volgt één
-            // hercontrole. De module verzint zelf nog steeds geen karren.
+            setCartPlan(null);
+            setActiveCartId(null);
+            return { plan: null, readiness };
+        }
+        setCartPlan(plan);
+        const printed = new Set(printedCartIdsOf(item));
+        setActiveCartId(plan.carts.find((cart) => !printed.has(cart.cartId))?.cartId ?? plan.carts[0].cartId);
+        return { plan, readiness };
+    }, []);
+    /** Printklaar volgens de bron: plan aanwezig, vrijgegeven en met barcodes. */
+    const readiness = useMemo(() => pickReadiness(cartPlan, planStatus, pending), [cartPlan, planStatus, pending]);
+    /**
+     * Controleert iedere zichtbare regel rechtstreeks bij de Engine. Tijdens de
+     * controle blijft printen dicht; alleen een actuele ready+released-status en
+     * een volledig karplan met barcodes geven de printknop vrij.
+     */
+    const visibleIdsKey = useMemo(() => (Array.isArray(items) ? items.map((item) => item.id).join(",") : ""), [items]);
+    const itemsRef = useRef([]);
+    itemsRef.current = Array.isArray(items) ? items : [];
+    useEffect(() => {
+        let cancelled = false;
+        const verifyVisibleRows = async () => {
+            const visibleItems = itemsRef.current;
+            setCheckProgress({ done: 0, total: visibleItems.length });
+            if (visibleItems.length === 0)
+                return;
+            let done = 0;
+            await Promise.all(visibleItems.map(async (item) => {
+                let entry = {
+                    checking: false,
+                    ready: false,
+                    reason: "De bron kon de pakbon nog niet bevestigen.",
+                };
+                try {
+                    const [plan, status] = await Promise.all([
+                        pickApi.queueCartPlan(item.id),
+                        pickApi.cartPlanStatus(unitRefOf(item)),
+                    ]);
+                    const state = pickReadiness(plan, status, item);
+                    entry = { checking: false, ready: state.ready, reason: state.reason };
+                }
+                catch {
+                    // fail closed: de regel blijft "Pakbon ophalen"
+                }
+                if (cancelled)
+                    return;
+                done += 1;
+                setReadinessById((prev) => ({ ...prev, [item.id]: entry }));
+                setCheckProgress({ done, total: visibleItems.length });
+            }));
+        };
+        void verifyVisibleRows();
+        const timer = window.setInterval(() => void verifyVisibleRows(), 15000);
+        return () => {
+            cancelled = true;
+            window.clearInterval(timer);
+        };
+    }, [visibleIdsKey]);
+    /**
+     * Vraagt de ontbrekende gegevens op bij de module die ze moet leveren en
+     * blijft daarna kijken tot de regel printklaar is. Deze module maakt of
+     * wijzigt zelf nooit karren, nummers of barcodes.
+     */
+    const requestData = useCallback(async (item) => {
+        setFetchingData(true);
+        const ref = unitRefOf(item);
+        try {
             try {
                 await pickApi.reportMissingCartPlans();
-                await new Promise((resolve) => setTimeout(resolve, 1500));
-                plan = await pickApi.queueCartPlan(item.id);
             }
             catch {
                 /* bewaking is aanvullend, nooit blokkerend */
             }
-        }
-        if (!plan || plan.carts.length === 0) {
-            setCartPlan(null);
-            setActiveCartId(null);
-            // De reden komt letterlijk uit de Engine; deze module bedenkt niets.
-            try {
-                const ref = item.order_number ?? item.document_number;
-                const status = ref ? await pickApi.cartPlanStatus(ref) : null;
-                setPlanReason(status && (!status.ready || !status.released) ? status.reason ?? null : null);
+            if (ref) {
+                try {
+                    await sendLogisticsEvent({
+                        event_type: "order.changed",
+                        order_ref: ref,
+                        shadow: false,
+                        payload: {
+                            reason: "pick.data_incomplete",
+                            missing: pickReadiness(cartPlan, planStatus, item).missing,
+                            queue_item_id: item.id,
+                        },
+                    });
+                }
+                catch {
+                    /* het seintje is aanvullend op de bewaking */
+                }
             }
-            catch {
-                setPlanReason(null);
+            for (let attempt = 0; attempt < 20; attempt += 1) {
+                await new Promise((resolve) => setTimeout(resolve, 3000));
+                const plan = await pickApi.queueCartPlan(item.id);
+                let status = null;
+                try {
+                    status = ref ? await pickApi.cartPlanStatus(ref) : null;
+                }
+                catch {
+                    status = null;
+                }
+                const next = pickReadiness(plan, status, item);
+                setPlanStatus(status);
+                setPlanReason(next.ready ? null : next.reason);
+                if (plan && plan.carts.length > 0) {
+                    setCartPlan(plan);
+                    const printed = new Set(printedCartIdsOf(item));
+                    setActiveCartId(plan.carts.find((cart) => !printed.has(cart.cartId))?.cartId ?? plan.carts[0].cartId);
+                }
+                else {
+                    setCartPlan(null);
+                    setActiveCartId(null);
+                }
+                if (next.ready) {
+                    toast.success("De pakbon is opgehaald — je kunt nu printen.");
+                    refresh();
+                    return true;
+                }
             }
-            return null;
+            toast.warning(planReason ?? "De pakbon is nog niet compleet. De bron is op de hoogte gebracht.");
+            return false;
         }
-        setPlanReason(null);
-        setCartPlan(plan);
-        const printed = new Set(printedCartIdsOf(item));
-        setActiveCartId(plan.carts.find((cart) => !printed.has(cart.cartId))?.cartId ?? plan.carts[0].cartId);
-        return plan;
-    }, []);
+        finally {
+            setFetchingData(false);
+        }
+    }, [cartPlan, planStatus, planReason, refresh]);
     /**
      * Mislukte printopdracht: alleen de betreffende kar terugzetten. Ging alleen
      * het opslaan van de PDF-kopie mis, dan is het papier wél geprint: de kar
@@ -328,18 +498,19 @@ export function PickScherm({ station, onBack }) {
      * Printknop in de wachtrij: print in één keer alle pakbonnen (karren) van
      * deze order. Nog niet geprint: claimen en alle karren in één batch.
      * Al geprint: bewuste herdruk van alle karren.
-     * Zonder vastgelegd karplan wordt de pakbon als één document geprint.
+     * Is de regel nog niet printklaar, dan wordt er niet geprint maar worden de
+     * ontbrekende gegevens bij de bron opgevraagd.
      */
     const printAllForItem = useCallback(async (item) => {
         setBusyId(item.id);
         try {
             if (item.printed_at) {
-                const plan = await loadCartPlan(item);
+                const { plan, readiness: state } = await loadCartPlan(item);
                 setPending(item);
-                if (!plan) {
-                    toast.warning(NO_CART_PLAN_NOTICE);
-                    await handleReprint(item);
-                    refresh();
+                if (!plan || !state.ready) {
+                    setBusyId(null);
+                    toast.warning(state.reason ?? NOT_READY_NOTICE);
+                    await requestData(item);
                     return;
                 }
                 const jobs = [];
@@ -361,6 +532,17 @@ export function PickScherm({ station, onBack }) {
                 refresh();
                 return;
             }
+            // Ook bij een rij die zojuist als klaar is getoond, direct vóór het
+            // claimen opnieuw bij de Engine controleren. Een verouderde rij kan zo
+            // nooit alsnog een printopdracht starten.
+            const preflight = await loadCartPlan(item);
+            setPending(item);
+            if (!preflight.plan || !preflight.readiness.ready) {
+                setBusyId(null);
+                toast.warning(preflight.readiness.reason ?? NOT_READY_NOTICE);
+                await requestData(item);
+                return;
+            }
             const claimed = await pickApi.claim({
                 itemId: item.id,
                 stationId: station.id,
@@ -369,14 +551,12 @@ export function PickScherm({ station, onBack }) {
                 timeout: station.lock_timeout_seconds ?? 120,
             });
             const target = claimed ?? item;
-            const plan = await loadCartPlan(target);
+            const { plan, readiness: state } = await loadCartPlan(target);
             setPending(target);
-            if (!plan) {
-                toast.warning(NO_CART_PLAN_NOTICE);
-                const printed = await pickApi.completePrint(target.id, sessionId);
-                setLastPrinted(printed);
-                setPending(printed);
-                refresh();
+            if (!plan || !state.ready) {
+                setBusyId(null);
+                toast.warning(state.reason ?? NOT_READY_NOTICE);
+                await requestData(target);
                 return;
             }
             const already = new Set(printedCartIdsOf(target));
@@ -416,11 +596,69 @@ export function PickScherm({ station, onBack }) {
         station.lock_timeout_seconds,
         sessionId,
         loadCartPlan,
+        requestData,
         trackBatch,
         refresh,
         t,
         showPrintError,
     ]);
+    /**
+     * Batchknop: print de bovenste n printklare regels in de bestaande volgorde
+     * (volle karren voor deelkarren, zoals de lijst sorteert). Per regel draait
+     * exact dezelfde printactie als de knop op die regel; karren van een eenheid
+     * die in deze klik al geprint zijn, worden overgeslagen zodat elke kar
+     * precies één printactie krijgt. Niet-printklare karren worden overgeslagen
+     * met een leesbare melding per kar.
+     */
+    const printNextCarts = useCallback(async () => {
+        if (!cartsPerPrint || batchPrinting)
+            return;
+        setBatchPrinting(true);
+        try {
+            const visible = (Array.isArray(items) ? items : []).filter((item) => !item.printed_at);
+            const targets = [];
+            const skipped = [];
+            for (const item of visible) {
+                if (targets.length >= cartsPerPrint)
+                    break;
+                const state = readinessById[item.id];
+                if (!state || state.checking) {
+                    skipped.push({ title: unitTitleOf(item), reason: "de pakbon wordt nog gecontroleerd" });
+                    continue;
+                }
+                if (!state.ready) {
+                    skipped.push({ title: unitTitleOf(item), reason: state.reason ?? "nog niet printklaar" });
+                    continue;
+                }
+                targets.push(item);
+            }
+            if (targets.length === 0) {
+                toast.warning("Er is geen enkele kar printklaar.");
+                for (const s of skipped.slice(0, 5))
+                    toast.warning(`${s.title}: ${s.reason}`);
+                return;
+            }
+            if (targets.length < cartsPerPrint) {
+                toast.info(`Er zijn maar ${targets.length} van de ${cartsPerPrint} karren printklaar; alleen die worden geprint.`);
+            }
+            for (const s of skipped.slice(0, 5))
+                toast.warning(`${s.title}: ${s.reason}`);
+            const doneUnits = new Set();
+            for (const item of targets) {
+                const unitKey = `${item.document_type_id ?? "-"}|${item.order_number ?? unitRefOf(item)}`;
+                if (doneUnits.has(unitKey))
+                    continue;
+                await printAllForItem(item);
+                doneUnits.add(unitKey);
+            }
+        }
+        catch (e) {
+            showPrintError(e);
+        }
+        finally {
+            setBatchPrinting(false);
+        }
+    }, [cartsPerPrint, batchPrinting, items, readinessById, printAllForItem, showPrintError]);
     const fetchNext = useCallback(async (silent = false) => {
         const requestedDayVersion = daySelectionVersion.current;
         setBusyId("next");
@@ -485,25 +723,10 @@ export function PickScherm({ station, onBack }) {
         const plan = cartPlan;
         if (!item)
             return;
-        if (!plan) {
-            toast.warning(NO_CART_PLAN_NOTICE);
-            if (item.printed_at) {
-                await handleReprint(item);
-                return;
-            }
-            setBusyId("confirm");
-            try {
-                const printed = await pickApi.completePrint(item.id, sessionId);
-                setLastPrinted(printed);
-                setPending(printed);
-                refresh();
-            }
-            catch (e) {
-                showPrintError(e);
-            }
-            finally {
-                setBusyId(null);
-            }
+        if (!plan || !readiness.ready) {
+            // Niet printklaar: nooit printen, altijd eerst de gegevens opvragen.
+            toast.warning(readiness.reason ?? NOT_READY_NOTICE);
+            await requestData(item);
             return;
         }
         const alreadyPrinted = new Set(printedCartIdsOf(item));
@@ -571,7 +794,7 @@ export function PickScherm({ station, onBack }) {
                 }
             }
         }
-    }, [pending, cartPlan, handleReprint, sessionId, trackBatch, t, fetchNext, refresh, showPrintError]);
+    }, [pending, cartPlan, readiness, requestData, handleReprint, sessionId, trackBatch, t, fetchNext, refresh, showPrintError]);
     /** Rond de order pas af wanneer alle batchopdrachten een eindstatus hebben. */
     useEffect(() => {
         if (!batch || batch.jobs.some((entry) => !entry.job || !["voltooid", "mislukt", "geannuleerd"].includes(entry.job.status)))
@@ -763,9 +986,26 @@ export function PickScherm({ station, onBack }) {
     const jobFailed = jobStatus === "mislukt" || jobStatus === "geannuleerd";
     const batchCompleted = batch?.jobs.filter((entry) => entry.job?.status === "voltooid").length ?? 0;
     const batchFailed = batch?.jobs.filter((entry) => entry.job?.status === "mislukt" || entry.job?.status === "geannuleerd").length ?? 0;
-    return (_jsxs("div", { className: "space-y-4 pb-24 md:pb-0", children: [_jsxs("div", { className: "flex flex-col gap-3 md:flex-row md:flex-wrap md:items-center md:justify-between", children: [_jsxs("div", { className: "grid grid-cols-[auto_minmax(0,1fr)] items-center gap-3", children: [_jsxs(Button, { variant: "outline", size: "lg", className: "h-12 shrink-0 px-3 sm:px-4", onClick: () => setLang(null), "aria-label": t("changeLanguage"), children: [_jsx(Globe, { className: "h-5 w-5 sm:mr-2" }), _jsx("span", { className: "hidden sm:inline", children: t("changeLanguage") })] }), _jsxs("div", { className: "min-w-0", children: [_jsx("h2", { className: "truncate text-lg font-bold text-foreground sm:text-xl", children: station.name }), _jsxs("p", { className: "truncate text-sm text-muted-foreground", children: [pendingCount, " ", t("statusToPrint"), " \u00B7 ", printedCount, " ", t("statusPrinted")] })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { variant: "outline", size: "lg", className: "h-12 px-3", onClick: () => shiftDay(-1), disabled: loadingDay || !(chosenDay ?? pickDay), "aria-label": ui.pickDayPrev, children: [_jsx(ChevronLeft, { className: "h-5 w-5 sm:mr-1" }), _jsx("span", { className: "hidden sm:inline", children: ui.pickDayPrev })] }), _jsx("div", { className: "flex h-12 items-center rounded-md border bg-muted px-4 text-sm font-semibold text-foreground", children: chosenDay ? dayLabel(chosenDay) : ui.pickDayToday }), _jsxs(Button, { variant: "outline", size: "lg", className: "h-12 px-3", onClick: () => shiftDay(1), disabled: loadingDay || !(chosenDay ?? pickDay), "aria-label": ui.pickDayNext, children: [_jsx("span", { className: "hidden sm:inline", children: ui.pickDayNext }), _jsx(ChevronRight, { className: "h-5 w-5 sm:ml-1" })] }), chosenDay && (_jsx(Button, { variant: "secondary", size: "lg", className: "h-12 px-4", onClick: () => void chooseDay("current"), disabled: loadingDay, children: ui.pickDayBackToToday }))] }), _jsxs("div", { className: "flex items-center gap-2", children: [!online && (_jsxs(Badge, { className: "bg-destructive text-destructive-foreground", children: [_jsx(WifiOff, { className: "mr-1 h-3.5 w-3.5" }), " ", t("offline")] })), _jsx(Button, { variant: "outline", size: "icon", className: "h-12 w-12 shrink-0", onClick: refresh, "aria-label": t("refresh"), children: _jsx(RefreshCw, { className: "h-4 w-4" }) }), _jsxs(Button, { size: "lg", className: "hidden h-14 px-8 text-lg md:inline-flex", onClick: () => (pending ? confirmPending() : fetchNext()), disabled: busyId !== null, children: [busyId !== null ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), t("printNext"), pending?.document_number ? ` · ${pending.document_number}` : ""] })] })] }), !plekLoading && !printPlek && (_jsxs("div", { className: "flex items-start gap-2 rounded-md border-2 border-destructive/50 bg-destructive/5 p-3 text-sm text-destructive", children: [_jsx(AlertTriangle, { className: "mt-0.5 h-4 w-4 shrink-0" }), _jsx("span", { children: "Nog geen printplek gekoppeld \u2014 de opdracht blijft in de wachtrij staan." })] })), _jsx(ShippingNoteScan, { stationId: station.id }), !pending && emptyNotice && (_jsx("p", { className: "text-sm text-muted-foreground", children: emptyNotice })), pending && (_jsxs(Card, { className: "border-2 border-primary", children: [_jsxs(CardContent, { className: "flex flex-col gap-4 p-4 sm:flex-row sm:flex-wrap sm:items-center sm:justify-between sm:p-5", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-sm font-medium text-muted-foreground", children: t("confirmPrintTitle") }), _jsx("p", { className: "truncate text-xl font-bold text-foreground sm:text-2xl", children: pending.document_number ?? t("document") }), _jsx("p", { className: "truncate text-sm text-muted-foreground", children: [pending.order_number, pending.customer_name].filter(Boolean).join(" · ") })] }), _jsxs("div", { className: "flex flex-col gap-2 sm:flex-row", children: [_jsx(Button, { variant: "outline", size: "lg", className: "h-12 w-full sm:w-auto", onClick: cancelPending, disabled: busyId !== null, children: t("cancel") }), _jsxs(Button, { size: "lg", className: "h-14 w-full px-8 text-lg sm:w-auto", onClick: confirmPending, disabled: busyId !== null, children: [busyId === "confirm" ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), t("print")] })] })] }), !cartPlan && (_jsx(CardContent, { className: "border-t p-4 sm:p-5", children: _jsxs("div", { className: "flex items-start gap-2 rounded-md border bg-muted/30 p-3 text-sm text-muted-foreground", children: [_jsx(AlertTriangle, { className: "mt-0.5 h-4 w-4 shrink-0" }), _jsx("span", { children: planReason
-                                        ? `${planReason} De logistiek is automatisch op de hoogte gebracht.`
-                                        : "De karplanning voor deze order is nog niet klaar — de logistiek is automatisch op de hoogte gebracht. Zolang die ontbreekt, wordt de pakbon als één document geprint." })] }) })), cartPlan && (_jsx(CardContent, { className: "border-t p-4 sm:p-5", children: _jsxs("div", { className: "grid gap-3 lg:grid-cols-[minmax(0,0.8fr)_minmax(0,1.2fr)]", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-sm font-semibold text-foreground", children: "Karren van deze order" }), _jsx("div", { className: "max-h-72 space-y-2 overflow-y-auto rounded-md border p-2", children: cartPlan.carts.map((cart) => {
+    /**
+     * Laadbalk: zolang de wachtrij laadt of de bron de pakbonnen nog bevestigt,
+     * ziet de picker hoe ver het klaarzetten is. De teksten in de regels blijven
+     * daardoor niet onverwacht "springen" zonder uitleg.
+     */
+    const checkTotal = checkProgress.total;
+    const checkDone = Math.min(checkProgress.done, checkTotal);
+    const busyLoading = loading || loadingDay || (checkTotal > 0 && checkDone < checkTotal);
+    const loadPercent = loading || loadingDay
+        ? 15
+        : checkTotal === 0
+            ? 100
+            : Math.round((checkDone / checkTotal) * 100);
+    return (_jsxs("div", { className: "space-y-4 pb-24 md:pb-0", children: [busyLoading && (_jsxs("div", { className: "space-y-1", role: "status", "aria-live": "polite", "aria-label": "Gegevens worden geladen", children: [_jsxs("div", { className: "flex items-center justify-between text-xs text-muted-foreground", children: [_jsx("span", { children: loading || loadingDay
+                                    ? "Wachtrij wordt geladen…"
+                                    : `Pakbonnen controleren bij de bron (${checkDone} van ${checkTotal})` }), _jsxs("span", { className: "tabular-nums", children: [loadPercent, "%"] })] }), _jsx("div", { className: "h-1.5 w-full overflow-hidden rounded-full bg-muted", children: _jsx("div", { className: "h-full rounded-full bg-primary transition-all duration-300", style: { width: `${Math.max(5, loadPercent)}%` } }) })] })), _jsxs("div", { className: "flex flex-col gap-3 md:flex-row md:flex-wrap md:items-center md:justify-between", children: [_jsxs("div", { className: "grid grid-cols-[auto_minmax(0,1fr)] items-center gap-3", children: [_jsxs(Button, { variant: "outline", size: "lg", className: "h-12 shrink-0 px-3 sm:px-4", onClick: () => setLang(null), "aria-label": t("changeLanguage"), children: [_jsx(Globe, { className: "h-5 w-5 sm:mr-2" }), _jsx("span", { className: "hidden sm:inline", children: t("changeLanguage") })] }), _jsxs("div", { className: "min-w-0", children: [_jsx("h2", { className: "truncate text-lg font-bold text-foreground sm:text-xl", children: station.name }), _jsxs("p", { className: "truncate text-sm text-muted-foreground", children: [pendingCount, " ", t("statusToPrint"), " \u00B7 ", printedCount, " ", t("statusPrinted")] })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { variant: "outline", size: "lg", className: "h-12 px-3", onClick: () => shiftDay(-1), disabled: loadingDay || !(chosenDay ?? pickDay), "aria-label": ui.pickDayPrev, children: [_jsx(ChevronLeft, { className: "h-5 w-5 sm:mr-1" }), _jsx("span", { className: "hidden sm:inline", children: ui.pickDayPrev })] }), _jsx("div", { className: "flex h-12 items-center rounded-md border bg-muted px-4 text-sm font-semibold text-foreground", children: chosenDay ? dayLabel(chosenDay) : ui.pickDayToday }), _jsxs(Button, { variant: "outline", size: "lg", className: "h-12 px-3", onClick: () => shiftDay(1), disabled: loadingDay || !(chosenDay ?? pickDay), "aria-label": ui.pickDayNext, children: [_jsx("span", { className: "hidden sm:inline", children: ui.pickDayNext }), _jsx(ChevronRight, { className: "h-5 w-5 sm:ml-1" })] }), chosenDay && (_jsx(Button, { variant: "secondary", size: "lg", className: "h-12 px-4", onClick: () => void chooseDay("current"), disabled: loadingDay, children: ui.pickDayBackToToday }))] }), _jsxs("div", { className: "flex items-center gap-2", children: [!online && (_jsxs(Badge, { className: "bg-destructive text-destructive-foreground", children: [_jsx(WifiOff, { className: "mr-1 h-3.5 w-3.5" }), " ", t("offline")] })), _jsx(Button, { variant: "outline", size: "icon", className: "h-12 w-12 shrink-0", onClick: refresh, "aria-label": t("refresh"), children: _jsx(RefreshCw, { className: "h-4 w-4" }) }), _jsxs(Button, { variant: "outline", size: "lg", className: "hidden h-14 px-5 md:inline-flex", disabled: fetchingNotes, onClick: () => void fetchShippingNotes(), children: [fetchingNotes ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(FileDown, { className: "mr-2 h-5 w-5" })), fetchingNotes ? "Ophalen…" : "Verzendbrieven ophalen"] }), cartsPerPrint != null && (_jsxs(Button, { size: "lg", className: "hidden h-14 px-6 text-lg md:inline-flex", disabled: loading || batchPrinting || busyId != null, onClick: () => void printNextCarts(), children: [batchPrinting ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), "Print eerstvolgende ", cartsPerPrint, " karren"] })), _jsxs(Button, { size: "lg", className: "hidden h-14 px-8 text-lg md:inline-flex", onClick: () => (pending ? confirmPending() : fetchNext()), disabled: busyId !== null || fetchingData, children: [busyId !== null || fetchingData ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : pending && !readiness.ready ? (_jsx(RefreshCw, { className: "mr-2 h-5 w-5" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), pending && !readiness.ready ? "Pakbon ophalen" : t("printNext"), pending?.document_number ? ` · ${pending.document_number}` : ""] })] })] }), !plekLoading && !printPlek && (_jsxs("div", { className: "flex items-start gap-2 rounded-md border-2 border-destructive/50 bg-destructive/5 p-3 text-sm text-destructive", children: [_jsx(AlertTriangle, { className: "mt-0.5 h-4 w-4 shrink-0" }), _jsx("span", { children: "Nog geen printplek gekoppeld \u2014 de opdracht blijft in de wachtrij staan." })] })), _jsx(ShippingNoteScan, { stationId: station.id }), !pending && emptyNotice && (_jsx("p", { className: "text-sm text-muted-foreground", children: emptyNotice })), pending && (_jsxs(Card, { className: "border-2 border-primary", children: [_jsxs(CardContent, { className: "flex flex-col gap-4 p-4 sm:flex-row sm:flex-wrap sm:items-center sm:justify-between sm:p-5", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-sm font-medium text-muted-foreground", children: t("confirmPrintTitle") }), _jsx("p", { className: "truncate text-xl font-bold text-foreground sm:text-2xl", children: pending.document_number ?? t("document") }), _jsx("p", { className: "truncate text-sm text-muted-foreground", children: [pending.order_number, pending.customer_name].filter(Boolean).join(" · ") })] }), _jsxs("div", { className: "flex flex-col gap-2 sm:flex-row", children: [_jsx(Button, { variant: "outline", size: "lg", className: "h-12 w-full sm:w-auto", onClick: cancelPending, disabled: busyId !== null, children: t("cancel") }), _jsxs(Button, { size: "lg", className: "h-14 w-full px-8 text-lg sm:w-auto", onClick: confirmPending, disabled: busyId !== null || fetchingData, variant: readiness.ready ? "default" : "secondary", children: [busyId === "confirm" || fetchingData ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : readiness.ready ? (_jsx(Printer, { className: "mr-2 h-5 w-5" })) : (_jsx(RefreshCw, { className: "mr-2 h-5 w-5" })), readiness.ready ? t("print") : "Pakbon ophalen"] })] })] }), !readiness.ready && (_jsx(CardContent, { className: "border-t p-4 sm:p-5", children: _jsxs("div", { className: "flex items-start gap-2 rounded-md border bg-muted/30 p-3 text-sm text-muted-foreground", children: [_jsx(AlertTriangle, { className: "mt-0.5 h-4 w-4 shrink-0" }), _jsx("span", { children: fetchingData
+                                        ? "De pakbon wordt bij de bron opgevraagd. Zodra alles compleet is, verschijnt de printknop weer."
+                                        : planReason
+                                            ? `${planReason} Klik op "Pakbon ophalen" om hem bij de bron op te vragen.`
+                                            : NOT_READY_NOTICE })] }) })), cartPlan && (_jsx(CardContent, { className: "border-t p-4 sm:p-5", children: _jsxs("div", { className: "grid gap-3 lg:grid-cols-[minmax(0,0.8fr)_minmax(0,1.2fr)]", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-sm font-semibold text-foreground", children: "Karren van deze order" }), _jsx("div", { className: "max-h-72 space-y-2 overflow-y-auto rounded-md border p-2", children: cartPlan.carts.map((cart) => {
                                                 const done = printedCartIdsOf(pending).includes(cart.cartId);
                                                 const active = cart.cartId === activeCartId;
                                                 return (_jsxs("div", { role: "button", tabIndex: 0, onClick: () => setActiveCartId(cart.cartId), onKeyDown: (event) => {
@@ -787,5 +1027,18 @@ export function PickScherm({ station, onBack }) {
                                 })()] }) }))] })), batch && (_jsx(Card, { className: batchFailed > 0 ? "border-2 border-destructive" : "border-2 border-primary/40", children: _jsxs(CardContent, { className: "flex items-center gap-3 p-4", children: [batchCompleted + batchFailed === batch.jobs.length ? (batchFailed > 0 ? _jsx(AlertTriangle, { className: "h-6 w-6 shrink-0 text-destructive" }) : _jsx(CheckCircle2, { className: "h-6 w-6 shrink-0 text-primary" })) : (_jsx(Loader2, { className: "h-6 w-6 shrink-0 animate-spin text-muted-foreground" })), _jsxs("div", { className: "min-w-0", children: [_jsxs("p", { className: "truncate text-sm text-muted-foreground", children: [jobTexts.jobTitle, batch.documentNumber ? ` · ${batch.documentNumber}` : ""] }), _jsxs("p", { className: "font-semibold text-foreground", children: [batchCompleted, " van ", batch.jobs.length, " pakbonnen voltooid", batchFailed > 0 ? ` · ${batchFailed} mislukt` : ""] })] })] }) })), tracked && (_jsx(Card, { className: jobFailed ? "border-2 border-destructive" : "border-2 border-primary/40", children: _jsxs(CardContent, { className: "flex flex-col gap-4 p-4 sm:flex-row sm:flex-wrap sm:items-center sm:justify-between", children: [_jsxs("div", { className: "flex min-w-0 items-start gap-3", children: [jobFailed ? (_jsx(AlertTriangle, { className: "h-6 w-6 shrink-0 text-destructive" })) : jobStatus === "voltooid" ? (_jsx(CheckCircle2, { className: "h-6 w-6 shrink-0 text-primary" })) : (_jsx(Loader2, { className: "h-6 w-6 shrink-0 animate-spin text-muted-foreground" })), _jsxs("div", { className: "min-w-0", children: [_jsxs("p", { className: "truncate text-sm font-medium text-muted-foreground", children: [jobTexts.jobTitle, " ", tracked.documentNumber ? `· ${tracked.documentNumber}` : "", tracked.cartLabel ? ` · ${tracked.cartLabel}` : ""] }), _jsx("p", { className: "text-lg font-semibold text-foreground", children: printJobStatusLabel(jobStatus, t.lang) }), tracked.job?.printer_naam && (_jsxs("p", { className: "truncate text-sm text-muted-foreground", children: [jobTexts.printerLabel, ": ", tracked.job.printer_naam] })), jobFailed && (_jsxs("p", { className: "text-sm text-destructive", children: [tracked.job?.foutmelding ?? jobTexts.unknown, " \u00B7 ", jobTexts.requeued] })), !jobFailed && pdfSaveWarning(tracked.job) && (_jsx("p", { className: "text-sm font-medium text-destructive", children: pdfSaveWarning(tracked.job) }))] })] }), _jsxs("div", { className: "flex flex-col gap-2 sm:flex-row", children: [jobFailed && lastPrinted && (_jsxs(Button, { size: "lg", className: "h-12 w-full sm:w-auto", onClick: () => {
                                         clearJob();
                                         void confirmPending();
-                                    }, disabled: busyId !== null || !pending, children: [_jsx(Printer, { className: "mr-2 h-5 w-5" }), " ", jobTexts.retry] })), _jsx(Button, { variant: "outline", size: "lg", className: "h-12 w-full sm:w-auto", onClick: clearJob, children: jobTexts.close })] })] }) })), _jsx(Card, { children: _jsxs(CardContent, { className: "flex flex-wrap items-center gap-3 p-3 sm:p-4", children: [_jsxs("div", { className: "relative w-full min-w-0 flex-1 sm:min-w-64", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "h-12 pl-9 text-base", placeholder: t("search"), value: searchInput, onChange: (e) => setSearchInput(e.target.value) })] }), _jsxs(Select, { value: chosenDay ?? "current", onValueChange: (v) => void chooseDay(v), children: [_jsx(SelectTrigger, { className: "h-12 w-full sm:w-56", disabled: loadingDay, children: _jsx(SelectValue, { placeholder: ui.pickDay }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "current", children: ui.pickDayToday }), safePickDays.map((d) => (_jsxs(SelectItem, { value: d.day, children: [dayLabel(d.day), d.orders > 0 ? ` (${d.orders})` : ""] }, d.day)))] })] }), _jsxs(Select, { value: filters.documentTypeId ?? "all", onValueChange: (v) => setFilters((f) => ({ ...f, documentTypeId: v === "all" ? null : v, page: 0 })), children: [_jsx(SelectTrigger, { className: "h-12 w-full sm:w-52", children: _jsx(SelectValue, { placeholder: ui.allDocumentTypes }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: ui.allDocumentTypes }), (Array.isArray(documentTypes) ? documentTypes : []).map((dt) => (_jsx(SelectItem, { value: dt.id, children: dt.name }, dt.id)))] })] }), _jsx(Button, { variant: filters.onlyPending ? "default" : "outline", className: "h-12", onClick: () => setFilters((f) => ({ ...f, onlyPending: !f.onlyPending, page: 0 })), children: ui.onlyPending }), _jsxs(Button, { variant: filters.urgentOnly ? "default" : "outline", className: "h-12", onClick: () => setFilters((f) => ({ ...f, urgentOnly: !f.urgentOnly, page: 0 })), children: [_jsx(Zap, { className: "mr-2 h-4 w-4" }), ui.onlyUrgent, urgentCount > 0 ? ` (${urgentCount})` : ""] })] }) }), !realtimeOk && (_jsx("p", { className: "text-sm text-muted-foreground", children: ui.connectionLost })), loading ? (_jsxs("div", { className: "flex items-center justify-center py-16 text-muted-foreground", children: [_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" }), " ", t("loadingQueue")] })) : (_jsx(QueueTable, { items: items, lockedIds: lockedIds, statuses: Array.isArray(statuses) ? statuses : [], documentTypes: Array.isArray(documentTypes) ? documentTypes : [], busyId: busyId, onPick: handlePick, onReprint: handleReprint, onPrintAll: printAllForItem, onSelectPrinted: selectPrintedForReprint, onMarkPrinted: markPrinted, onPreview: setPreviewItem, t: t })), _jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("span", { className: "text-center text-sm text-muted-foreground sm:text-left", children: [t("page"), " ", filters.page + 1, " ", t("of"), " ", totalPages] }), _jsxs("div", { className: "grid grid-cols-2 gap-2 sm:flex", children: [_jsx(Button, { variant: "outline", className: "h-12 w-full sm:w-auto", disabled: filters.page === 0, onClick: () => setFilters((f) => ({ ...f, page: Math.max(0, f.page - 1) })), children: t("previous") }), _jsx(Button, { variant: "outline", className: "h-12 w-full sm:w-auto", disabled: filters.page + 1 >= totalPages, onClick: () => setFilters((f) => ({ ...f, page: f.page + 1 })), children: t("next") })] })] }), _jsx("div", { className: "fixed inset-x-0 bottom-0 z-40 border-t bg-background/95 p-3 pb-[max(0.75rem,env(safe-area-inset-bottom))] backdrop-blur md:hidden", children: _jsxs(Button, { size: "lg", className: "h-14 w-full text-lg", onClick: () => (pending ? confirmPending() : fetchNext()), disabled: busyId !== null, children: [busyId !== null ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), _jsxs("span", { className: "truncate", children: [t("printNext"), pending?.document_number ? ` · ${pending.document_number}` : ""] })] }) }), _jsx(PreviewDialog, { item: previewItem, stationSlug: station.slug, onClose: () => setPreviewItem(null) })] }));
+                                    }, disabled: busyId !== null || !pending, children: [_jsx(Printer, { className: "mr-2 h-5 w-5" }), " ", jobTexts.retry] })), _jsx(Button, { variant: "outline", size: "lg", className: "h-12 w-full sm:w-auto", onClick: () => {
+                                        clearJob();
+                                        clearShippingNotes();
+                                    }, children: jobTexts.close })] })] }) })), shippingNotes.length > 0 && (_jsx(Card, { className: "border-2 border-primary/20", children: _jsxs(CardContent, { className: "flex flex-col gap-2 p-4", children: [_jsx("p", { className: "text-sm font-semibold text-foreground", children: shippingNotes.every((note) => note.state.status === "geprint")
+                                ? "Printactie volledig geslaagd — pakbon en verzendbrief zijn geprint."
+                                : "Printactie nog niet volledig: de verzendbrief is nog niet geprint." }), shippingNotes.map((note) => {
+                            const message = shippingNoteMessage(note.state);
+                            const failed = note.state.status === "mislukt" || note.state.status === "geblokkeerd";
+                            const waiting = isWaitingShippingNote(note.state.status);
+                            const typeLabel = shippingNoteSourceLabel(note.state);
+                            return (_jsxs("div", { className: "flex items-start gap-3", children: [failed ? (_jsx(AlertTriangle, { className: "mt-0.5 h-5 w-5 shrink-0 text-destructive" })) : note.state.status === "geprint" ? (_jsx(CheckCircle2, { className: "mt-0.5 h-5 w-5 shrink-0 text-primary" })) : (_jsx(Loader2, { className: "mt-0.5 h-5 w-5 shrink-0 animate-spin text-muted-foreground" })), _jsxs("div", { className: "min-w-0", children: [(note.cartLabel || typeLabel) && (_jsx("p", { className: "truncate text-sm text-muted-foreground", children: [note.cartLabel, typeLabel].filter(Boolean).join(" · ") })), _jsx("p", { className: failed ? "text-sm font-medium text-destructive" : "text-sm text-foreground", children: message ?? "Verzendbriefstatus wordt opgehaald." }), waiting && (note.state.attempts !== null || note.state.nextAttemptAt) && (_jsxs("p", { className: "text-xs text-muted-foreground", children: [note.state.attempts !== null ? `Pogingen: ${note.state.attempts}` : "", note.state.attempts !== null && note.state.nextAttemptAt ? " · " : "", note.state.nextAttemptAt
+                                                        ? `Volgende poging: ${new Date(note.state.nextAttemptAt).toLocaleTimeString("nl-NL", { hour: "2-digit", minute: "2-digit" })}`
+                                                        : ""] }))] })] }, note.jobId));
+                        })] }) })), _jsx(Card, { children: _jsxs(CardContent, { className: "flex flex-wrap items-center gap-3 p-3 sm:p-4", children: [_jsxs("div", { className: "relative w-full min-w-0 flex-1 sm:min-w-64", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "h-12 pl-9 text-base", placeholder: t("search"), value: searchInput, onChange: (e) => setSearchInput(e.target.value) })] }), _jsxs(Select, { value: chosenDay ?? "current", onValueChange: (v) => void chooseDay(v), children: [_jsx(SelectTrigger, { className: "h-12 w-full sm:w-56", disabled: loadingDay, children: _jsx(SelectValue, { placeholder: ui.pickDay }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "current", children: ui.pickDayToday }), safePickDays.map((d) => (_jsxs(SelectItem, { value: d.day, children: [dayLabel(d.day), d.orders > 0 ? ` (${d.orders})` : ""] }, d.day)))] })] }), _jsxs(Select, { value: filters.documentTypeId ?? "all", onValueChange: (v) => setFilters((f) => ({ ...f, documentTypeId: v === "all" ? null : v, page: 0 })), children: [_jsx(SelectTrigger, { className: "h-12 w-full sm:w-52", children: _jsx(SelectValue, { placeholder: ui.allDocumentTypes }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: ui.allDocumentTypes }), (Array.isArray(documentTypes) ? documentTypes : []).map((dt) => (_jsx(SelectItem, { value: dt.id, children: dt.name }, dt.id)))] })] }), _jsx(Button, { variant: filters.onlyPending ? "default" : "outline", className: "h-12", onClick: () => setFilters((f) => ({ ...f, onlyPending: !f.onlyPending, page: 0 })), children: ui.onlyPending }), _jsxs(Button, { variant: filters.urgentOnly ? "default" : "outline", className: "h-12", onClick: () => setFilters((f) => ({ ...f, urgentOnly: !f.urgentOnly, page: 0 })), children: [_jsx(Zap, { className: "mr-2 h-4 w-4" }), ui.onlyUrgent, urgentCount > 0 ? ` (${urgentCount})` : ""] })] }) }), !realtimeOk && (_jsx("p", { className: "text-sm text-muted-foreground", children: ui.connectionLost })), cartsPerPrint != null && (_jsx("div", { className: "flex justify-end md:hidden", children: _jsxs(Button, { className: "h-12", disabled: loading || batchPrinting || busyId != null, onClick: () => void printNextCarts(), children: [batchPrinting ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-4 w-4" })), "Print eerstvolgende ", cartsPerPrint, " karren"] }) })), _jsx("div", { className: "md:hidden", children: _jsxs(Button, { variant: "outline", className: "h-12 w-full", disabled: fetchingNotes, onClick: () => void fetchShippingNotes(), children: [fetchingNotes ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(FileDown, { className: "mr-2 h-4 w-4" })), fetchingNotes ? "Ophalen…" : "Verzendbrieven ophalen"] }) }), loading ? (_jsxs("div", { className: "flex items-center justify-center py-16 text-muted-foreground", children: [_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" }), " ", t("loadingQueue")] })) : (_jsx(QueueTable, { items: items, lockedIds: lockedIds, statuses: Array.isArray(statuses) ? statuses : [], documentTypes: Array.isArray(documentTypes) ? documentTypes : [], busyId: busyId, readinessById: readinessById, onPick: handlePick, onReprint: handleReprint, onPrintAll: printAllForItem, onSelectPrinted: selectPrintedForReprint, onMarkPrinted: markPrinted, onPreview: setPreviewItem, t: t })), _jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("span", { className: "text-center text-sm text-muted-foreground sm:text-left", children: [t("page"), " ", filters.page + 1, " ", t("of"), " ", totalPages] }), _jsxs("div", { className: "grid grid-cols-2 gap-2 sm:flex", children: [_jsx(Button, { variant: "outline", className: "h-12 w-full sm:w-auto", disabled: filters.page === 0, onClick: () => setFilters((f) => ({ ...f, page: Math.max(0, f.page - 1) })), children: t("previous") }), _jsx(Button, { variant: "outline", className: "h-12 w-full sm:w-auto", disabled: filters.page + 1 >= totalPages, onClick: () => setFilters((f) => ({ ...f, page: f.page + 1 })), children: t("next") })] })] }), _jsx("div", { className: "fixed inset-x-0 bottom-0 z-40 border-t bg-background/95 p-3 pb-[max(0.75rem,env(safe-area-inset-bottom))] backdrop-blur md:hidden", children: _jsxs(Button, { size: "lg", className: "h-14 w-full text-lg", onClick: () => (pending ? confirmPending() : fetchNext()), disabled: busyId !== null || fetchingData, children: [busyId !== null || fetchingData ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : pending && !readiness.ready ? (_jsx(RefreshCw, { className: "mr-2 h-5 w-5" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), _jsxs("span", { className: "truncate", children: [pending && !readiness.ready ? "Pakbon ophalen" : t("printNext"), pending?.document_number ? ` · ${pending.document_number}` : ""] })] }) }), _jsx(PreviewDialog, { item: previewItem, stationSlug: station.slug, onClose: () => setPreviewItem(null) })] }));
 }