@flowselections/logistiek-engine 1.0.34 → 1.0.89

package/dist-lib/components/PlanWachtrijPage.js

@@ -0,0 +1,99 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// ============================================================================
+// src/components/PlanWachtrijPage.tsx — de planwachtrij bekijken en resetten
+// ============================================================================
+// Laat zien welke orders wachten op een karrenindeling, hoe vaak het is
+// geprobeerd en wat er precies misging (in gewone taal). Met knoppen om de
+// wachtrij opnieuw te starten. GEEN <Header /> hier — die levert de shell.
+// ============================================================================
+import { useMemo, useState } from "react";
+import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, Skeleton, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@flowselections/core";
+import { AlertTriangle, RefreshCw, RotateCcw } from "lucide-react";
+import { toast } from "sonner";
+import { usePlanWachtrij } from "../hooks/usePlanWachtrij";
+import { foutTekst } from "../lib/foutTekst";
+const STAND_KLEUR = {
+    wacht: "bg-amber-500/15 text-amber-700 dark:text-amber-300",
+    bezig: "bg-sky-500/15 text-sky-700 dark:text-sky-300",
+    "blijft hangen": "bg-orange-500/20 text-orange-700 dark:text-orange-300",
+    klaar: "bg-emerald-500/15 text-emerald-700 dark:text-emerald-300",
+    mislukt: "bg-destructive/15 text-destructive",
+    geblokkeerd: "bg-destructive/15 text-destructive",
+};
+const FILTERS = [
+    { id: "alles", label: "Alles" },
+    { id: "open", label: "Open" },
+    { id: "mislukt", label: "Mislukt of geblokkeerd" },
+    { id: "blijft hangen", label: "Blijft hangen" },
+    { id: "klaar", label: "Klaar" },
+];
+function tijd(v) {
+    if (!v)
+        return "—";
+    const d = new Date(v);
+    return Number.isNaN(d.getTime()) ? "—" : d.toLocaleString("nl-NL");
+}
+function klok(v) {
+    if (!v)
+        return "—";
+    const d = new Date(v);
+    return Number.isNaN(d.getTime()) ? "—" : d.toLocaleTimeString("nl-NL", { hour: "2-digit", minute: "2-digit" });
+}
+function past(regel, filter, zoek) {
+    const z = zoek.trim().toLowerCase();
+    if (z && !`${regel.orderNumber ?? ""} ${regel.klant ?? ""}`.toLowerCase().includes(z))
+        return false;
+    if (filter === "alles")
+        return true;
+    if (filter === "open")
+        return regel.stand === "wacht" || regel.stand === "bezig";
+    if (filter === "mislukt")
+        return regel.stand === "mislukt" || regel.stand === "geblokkeerd";
+    return regel.stand === filter;
+}
+export function PlanWachtrijPage() {
+    const { regels, loading, busy, error, refresh, reset, opnieuw } = usePlanWachtrij();
+    const [filter, setFilter] = useState("alles");
+    const [zoek, setZoek] = useState("");
+    const [nieuwsteEerst, setNieuwsteEerst] = useState(true);
+    const veilig = Array.isArray(regels) ? regels : [];
+    const zichtbaar = useMemo(() => {
+        const lijst = veilig.filter((r) => past(r, filter, zoek));
+        const stempel = (r) => {
+            // Volgorde volgt de order zelf: wanneer de bestelling is binnengekomen.
+            const d = new Date(r.orderGemaaktOp ?? r.aangemeldOp ?? r.bijgewerktOp ?? 0).getTime();
+            return Number.isNaN(d) ? 0 : d;
+        };
+        return [...lijst].sort((a, b) => (nieuwsteEerst ? stempel(b) - stempel(a) : stempel(a) - stempel(b)));
+    }, [veilig, filter, zoek, nieuwsteEerst]);
+    const tellingen = useMemo(() => {
+        const t = {};
+        for (const r of veilig)
+            t[r.stand] = (t[r.stand] ?? 0) + 1;
+        return t;
+    }, [veilig]);
+    async function doeReset(keuze, vraag) {
+        if (!window.confirm(vraag))
+            return;
+        try {
+            const n = await reset(keuze);
+            toast.success(`${n} order(s) opnieuw aangemeld voor indeling.`);
+        }
+        catch (e) {
+            toast.error(e?.message ? String(e.message) : "Opnieuw starten is niet gelukt.");
+        }
+    }
+    return (_jsx("div", { className: "space-y-4 p-4", children: _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Wachtrij \u2014 orders die op een karrenindeling wachten" }), _jsx(CardDescription, { children: "Per order zie je de stand, hoe vaak het is geprobeerd en wat er misging. Je kunt de wachtrij opnieuw starten: de Engine kijkt dan opnieuw wat er in de order zit en maakt de karrenindeling opnieuw. Al geprinte, gescande of gecontroleerde karren blijven altijd staan." })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [FILTERS.map((f) => (_jsxs(Button, { size: "sm", variant: filter === f.id ? "default" : "outline", onClick: () => setFilter(f.id), children: [f.label, f.id !== "alles" && f.id !== "open" ? (_jsx("span", { className: "ml-1 text-xs opacity-70", children: f.id === "mislukt"
+                                                ? (tellingen["mislukt"] ?? 0) + (tellingen["geblokkeerd"] ?? 0)
+                                                : tellingen[f.id] ?? 0 })) : null] }, f.id))), _jsx(Input, { value: zoek, onChange: (e) => setZoek(e.target.value), placeholder: "Zoek op ordernummer of klant", className: "h-9 w-64" }), _jsxs("div", { className: "ml-auto flex flex-wrap gap-2", children: [_jsx(Button, { size: "sm", variant: "outline", onClick: () => setNieuwsteEerst((v) => !v), children: nieuwsteEerst ? "Nieuwste eerst" : "Oudste eerst" }), _jsxs(Button, { size: "sm", variant: "outline", onClick: () => void refresh(), disabled: busy, children: [_jsx(RefreshCw, { className: "mr-1 h-4 w-4" }), " Verversen"] }), _jsx(Button, { size: "sm", variant: "outline", disabled: busy, onClick: () => void doeReset("stuck", "Regels die al langer dan een kwartier 'bezig' blijven terugzetten op wachtend?"), children: "Blijft hangen losmaken" }), _jsxs(Button, { size: "sm", disabled: busy, onClick: () => void doeReset("failed", "Alle mislukte en geblokkeerde orders opnieuw aanmelden? De Engine bekijkt ze opnieuw en maakt de karrenindeling opnieuw."), children: [_jsx(RotateCcw, { className: "mr-1 h-4 w-4" }), " Wachtrij resetten"] }), _jsx(Button, { size: "sm", variant: "destructive", disabled: busy, onClick: () => void doeReset("all", "De hele wachtrij opnieuw starten, dus ook orders die al klaar waren? Dit kan even duren."), children: "Alles opnieuw" })] })] }), error ? (_jsxs("p", { className: "flex items-center gap-2 text-sm text-destructive", children: [_jsx(AlertTriangle, { className: "h-4 w-4" }), " ", error] })) : null, loading ? (_jsxs("div", { className: "space-y-2", children: [_jsx(Skeleton, { className: "h-8 w-full" }), _jsx(Skeleton, { className: "h-8 w-full" }), _jsx(Skeleton, { className: "h-8 w-full" })] })) : zichtbaar.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen regels in de wachtrij voor deze keuze." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Order" }), _jsx(TableHead, { children: "Stand" }), _jsx(TableHead, { children: "Voortgang" }), _jsx(TableHead, { children: "Pogingen" }), _jsx(TableHead, { children: "Volgende poging" }), _jsx(TableHead, { children: "Aangemeld omdat" }), _jsx(TableHead, { children: "Wat ging er mis" }), _jsx(TableHead, { children: "Bijgewerkt" }), _jsx(TableHead, {})] }) }), _jsx(TableBody, { children: zichtbaar.map((r) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsx("div", { className: "font-medium", children: r.orderNumber ?? "—" }), _jsx("div", { className: "text-xs text-muted-foreground", children: r.klant ?? "" })] }), _jsx(TableCell, { children: _jsx(Badge, { className: STAND_KLEUR[r.stand] ?? "", children: r.stand }) }), _jsx(TableCell, { className: "w-40", children: r.voortgang === null ? (_jsx("span", { className: "text-xs text-muted-foreground", children: "\u2014" })) : (_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "h-2 w-28 overflow-hidden rounded-full bg-muted", children: _jsx("div", { className: "h-full rounded-full bg-primary transition-all", style: { width: `${Math.min(100, Math.max(0, r.voortgang))}%` } }) }), _jsxs("span", { className: "text-xs text-muted-foreground", children: [r.voortgang, "% van de orderregels ingedeeld"] })] })) }), _jsxs(TableCell, { className: "text-sm", children: [r.pogingen, " van ", r.maxPogingen || "—"] }), _jsx(TableCell, { className: "text-sm", children: klok(r.volgendePoging) }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: r.reden ?? "—" }), _jsxs(TableCell, { className: "max-w-md text-sm", children: [r.foutTekst ?? foutTekst(r.foutRuw) ?? "—", r.foutRuw && (r.foutTekst ?? foutTekst(r.foutRuw)) !== r.foutRuw ? (_jsxs("details", { className: "mt-1", children: [_jsx("summary", { className: "cursor-pointer text-xs text-muted-foreground", children: "Technische details" }), _jsx("p", { className: "mt-1 break-words text-xs text-muted-foreground", children: r.foutRuw })] })) : null] }), _jsx(TableCell, { className: "text-xs text-muted-foreground", children: tijd(r.bijgewerktOp) }), _jsx(TableCell, { className: "text-right", children: _jsx(Button, { size: "sm", variant: "outline", disabled: busy || !r.orderId, onClick: async () => {
+                                                        if (!r.orderId)
+                                                            return;
+                                                        try {
+                                                            await opnieuw(r.orderId);
+                                                            toast.success(`${r.orderNumber ?? "Order"} opnieuw aangemeld.`);
+                                                        }
+                                                        catch (e) {
+                                                            toast.error(e?.message ? String(e.message) : "Opnieuw proberen is niet gelukt.");
+                                                        }
+                                                    }, children: "Opnieuw" }) })] }, r.id))) })] }))] })] }) }));
+}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"PlannerDiffCard.d.ts","sourceRoot":"","sources":["../../src/components/PlannerDiffCard.tsx"],"names":[],"mappings":"AAWA,wBAAgB,eAAe,gCA0D9B"}

package/dist-lib/components/PlannerDiffCard.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { useServerFn } from "@tanstack/react-start";
+import { Badge, Skeleton, Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@flowselections/core";
+import { getPlannerDiffOverview } from "../lib/plannerDiff.functions";
+const MODUS = {
+    off: "Uit (wissen en opnieuw opbouwen)",
+    dry_run: "Proef (oude aanpak leidend, vergelijking ernaast)",
+    apply: "Actief (alleen verschillen aanpassen)",
+};
+export function PlannerDiffCard() {
+    const fetchOverview = useServerFn(getPlannerDiffOverview);
+    const { data, isLoading, error } = useQuery({ queryKey: ["planner-diff"], queryFn: () => fetchOverview() });
+    if (isLoading)
+        return _jsx(Skeleton, { className: "h-24 w-full" });
+    if (error || !data)
+        return _jsx("p", { className: "text-sm text-destructive", children: "Kon de vergelijking niet ophalen." });
+    const afwijkingen = Array.isArray(data.afwijkingen) ? data.afwijkingen : [];
+    return (_jsxs("div", { className: "space-y-3", children: [_jsxs("p", { className: "text-sm", children: ["Modus: ", _jsx("span", { className: "font-medium", children: MODUS[data.modus] ?? MODUS["off"] })] }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsxs(Badge, { variant: "secondary", children: ["Buffers vergeleken: ", data.totaal] }), _jsxs(Badge, { variant: "secondary", children: ["Identiek: ", data.identiek] }), _jsxs(Badge, { variant: data.afwijkend > 0 ? "destructive" : "secondary", children: ["Afwijkend: ", data.afwijkend] }), data.mislukt > 0 && _jsxs(Badge, { variant: "destructive", children: ["Mislukt: ", data.mislukt] }), data.overgeslagen > 0 && _jsxs(Badge, { variant: "outline", children: ["Overgeslagen (indeling geblokkeerd): ", data.overgeslagen] })] }), afwijkingen.length > 0 && (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Order" }), _jsx(TableHead, { children: "Karren oud \u2192 nieuw" }), _jsx(TableHead, { children: "Verschil" }), _jsx(TableHead, { children: "Moment" })] }) }), _jsx(TableBody, { children: afwijkingen.map((r) => {
+                            const diffs = Array.isArray(r.differences) ? r.differences : [];
+                            return (_jsxs(TableRow, { children: [_jsx(TableCell, { children: r.order_ref ?? "—" }), _jsxs(TableCell, { children: [r.carts_before ?? "?", " \u2192 ", r.carts_after ?? "?"] }), _jsxs(TableCell, { className: "max-w-md text-xs", children: [diffs.slice(0, 3).map((d, i) => (_jsx("div", { children: d?.fout
+                                                    ? `Fout: ${d.fout}`
+                                                    : `Kar ${d?.cartNumber ?? "?"}: ${d?.before ?? "leeg"} → ${d?.after ?? "leeg"}` }, i))), diffs.length > 3 && _jsxs("div", { children: ["\u2026 en ", diffs.length - 3, " meer"] })] }), _jsx(TableCell, { className: "text-xs", children: new Date(r.created_at).toLocaleString("nl-NL") })] }, r.id));
+                        }) })] }))] }));
+}

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

@@ -1 +1 @@
-{"version":3,"file":"RegiePage.d.ts","sourceRoot":"","sources":["../../src/components/RegiePage.tsx"],"names":[],"mappings":"AA6EA,wBAAgB,SAAS,gCAmYxB"}
+{"version":3,"file":"RegiePage.d.ts","sourceRoot":"","sources":["../../src/components/RegiePage.tsx"],"names":[],"mappings":"AA+BA,wBAAgB,SAAS,gCA0FxB"}

package/dist-lib/components/RegiePage.js

@@ -1,88 +1,38 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // ============================================================================
 // src/components/RegiePage.tsx — Regieoverzicht van de Logistics Engine
 // ============================================================================
-// Toont welke taken de Engine heeft uitgedeeld, per order en per module,
-// plus een simulatieveld om te zien wat de Engine met een order zou doen.
+// Toont hoeveel taken er per module openstaan en daaronder alle binnengekomen
+// orders met het volledige logboek per order.
 // GEEN <Header /> hier — die levert de shell.
 // ============================================================================
-import { useMemo, useState } from "react";
-import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, Label, Skeleton, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@flowselections/core";
-import { ArrowUpCircle, Ban, RefreshCw, RotateCcw, Trash2, Workflow } from "lucide-react";
+import { useCallback, useEffect, useState } from "react";
+import { Button, Card, CardContent, CardDescription, CardHeader, CardTitle, supabase, } from "@flowselections/core";
+import { RefreshCw, Workflow } from "lucide-react";
 import { Link } from "@tanstack/react-router";
-import { useLogistiekTaken } from "../hooks/useLogistiekTaken";
-import { BeladingIndelingCard } from "./BeladingIndelingCard";
-import { VoorraadMeldingenCard } from "./VoorraadMeldingenCard";
-import { VertragingMeldingenCard } from "./VertragingMeldingenCard";
-import { CapaciteitMeldingenCard } from "./CapaciteitMeldingenCard";
-import { FloridayPushCard } from "./FloridayPushCard";
-import { PrintjobsCard } from "./PrintjobsCard";
 import { ConsistentieCard } from "./ConsistentieCard";
 import { KarplanStatusCard } from "./KarplanStatusCard";
-import { GeblokkeerdeOrdersCard } from "./GeblokkeerdeOrdersCard";
-import { AfmetingenBronnenCard } from "./AfmetingenBronnenCard";
-import { LOGISTICS_MODULES, TASK_LABEL, TASK_STATUS_LABEL, } from "../lib/logisticsTasks";
-function tijd(value) {
-    if (!value)
-        return "—";
-    const d = new Date(value);
-    if (Number.isNaN(d.getTime()))
-        return "—";
-    return d.toLocaleString("nl-NL", { day: "2-digit", month: "2-digit", hour: "2-digit", minute: "2-digit" });
-}
-function statusVariant(status) {
-    if (status === "done")
-        return "default";
-    if (status === "failed" || status === "cancelled")
-        return "destructive";
-    if (status === "in_progress" || status === "claimed")
-        return "secondary";
-    return "outline";
-}
-const WAARSCHUWING_LABEL = {
-    pick_start_in_past: "Pickstart lag in het verleden",
-    pick_window_too_short: "Pickvenster te kort",
-    pickup_in_past: "Ophaalmoment verstreken",
-    buffer_close_in_past: "Buffer sloot al",
-    rule_version_not_found: "Regelversie niet gevonden",
-    no_rule_config: "Geen regelset gekoppeld",
-};
+import { KardekkingCard } from "./KardekkingCard";
+import { PlannerDiffCard } from "./PlannerDiffCard";
+import { BeladingsafwijkingenCard } from "./BeladingsafwijkingenCard";
+import { OrderLogboek } from "./OrderLogboek";
+import { InklapbaarVenster } from "./InklapbaarVenster";
+import { tellOpenTaken } from "../lib/taskCounts";
+import { LOGISTICS_MODULES } from "../lib/logisticsTasks";
 export function RegiePage() {
-    const { taken, planRuns, meldingen, loading, laden, verwijderOrder, herverwerkMelding, claimTaak, rondTaakAf, meldTaakMislukt, annuleerOrder, zetPrioriteit, } = useLogistiekTaken();
-    const [filter, setFilter] = useState("");
-    const safeTaken = Array.isArray(taken) ? taken : [];
-    const safeRuns = Array.isArray(planRuns) ? planRuns : [];
-    const safeMeldingen = Array.isArray(meldingen) ? meldingen : [];
-    const gefilterd = useMemo(() => {
-        const q = filter.trim().toLowerCase();
-        if (!q)
-            return safeTaken;
-        return safeTaken.filter((t) => t.order_ref.toLowerCase().includes(q) ||
-            t.task_type.toLowerCase().includes(q) ||
-            t.owner_module.toLowerCase().includes(q));
-    }, [safeTaken, filter]);
-    const perOrder = useMemo(() => {
-        const map = new Map();
-        for (const t of gefilterd) {
-            const list = map.get(t.order_ref) ?? [];
-            list.push(t);
-            map.set(t.order_ref, list);
-        }
-        return Array.from(map.entries());
-    }, [gefilterd]);
-    const perModule = useMemo(() => {
-        const counts = {};
-        for (const t of safeTaken) {
-            counts[t.owner_module] = (counts[t.owner_module] ?? 0) + 1;
-        }
-        return counts;
-    }, [safeTaken]);
-    return (_jsxs("div", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsxs("h1", { className: "flex items-center gap-2 text-2xl font-semibold tracking-tight", children: [_jsx(Workflow, { className: "h-6 w-6 text-primary" }), "Overzicht & meldingen"] }), _jsx("p", { className: "text-muted-foreground text-sm", children: "Wat er vandaag klaarstaat en waar aandacht voor nodig is." })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", asChild: true, children: _jsx(Link, { to: "/logistiek-engine", children: "Terug naar overzicht" }) }), _jsxs(Button, { variant: "outline", onClick: () => void laden(), disabled: loading, children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), "Vernieuwen"] })] })] }), _jsx(ConsistentieCard, {}), _jsx(KarplanStatusCard, {}), _jsx(GeblokkeerdeOrdersCard, {}), _jsx(AfmetingenBronnenCard, {}), _jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", children: Object.keys(LOGISTICS_MODULES).map((key) => (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-2", children: [_jsx(CardDescription, { children: LOGISTICS_MODULES[key] }), _jsx(CardTitle, { className: "text-2xl", children: perModule[key] ?? 0 })] }), _jsx(CardContent, { className: "text-muted-foreground text-xs", children: "openstaande en geplande taken" })] }, key))) }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Taken per order" }), _jsx(CardDescription, { children: "Elke order krijgt bij binnenkomst meteen de volledige keten aan taken toegewezen." }), _jsxs("div", { className: "pt-2", children: [_jsx(Label, { htmlFor: "regie-filter", className: "sr-only", children: "Zoeken" }), _jsx(Input, { id: "regie-filter", placeholder: "Zoek op ordernummer, taaktype of module\u2026", value: filter, onChange: (e) => setFilter(e.target.value), className: "max-w-sm" })] })] }), _jsx(CardContent, { className: "space-y-6", children: loading ? (_jsxs("div", { className: "space-y-2", children: [_jsx(Skeleton, { className: "h-10 w-full" }), _jsx(Skeleton, { className: "h-10 w-full" }), _jsx(Skeleton, { className: "h-10 w-full" })] })) : perOrder.length === 0 ? (_jsxs("p", { className: "text-muted-foreground py-8 text-center text-sm", children: ["Nog geen taken. Zodra een module een melding wegschrijft in", " ", _jsx("code", { className: "bg-muted rounded px-1", children: "logistics_events" }), " maakt de database de keten meteen aan."] })) : (perOrder.map(([orderRef, orderTaken]) => {
-                            const spoed = orderTaken.some((t) => (t.priority ?? 0) > 0);
-                            const actief = orderTaken.some((t) => t.status !== "cancelled" && t.status !== "done" && t.status !== "superseded");
-                            return (_jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [_jsxs("h2", { className: "flex items-center gap-2 font-medium", children: ["Order ", orderRef, _jsxs("span", { className: "text-muted-foreground text-xs font-normal", children: [orderTaken.length, " taken"] }), spoed && (_jsx(Badge, { variant: "destructive", className: "text-[10px]", children: "spoed" }))] }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsxs(Button, { variant: "outline", size: "sm", onClick: () => void zetPrioriteit(orderRef, spoed ? 0 : 100), children: [_jsx(ArrowUpCircle, { className: "mr-1 h-4 w-4" }), spoed ? "Normaal" : "Spoed"] }), actief && (_jsxs(Button, { variant: "outline", size: "sm", onClick: () => void annuleerOrder(orderRef), children: [_jsx(Ban, { className: "mr-1 h-4 w-4" }), "Annuleren"] })), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => void verwijderOrder(orderRef), children: _jsx(Trash2, { className: "h-4 w-4" }) })] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { className: "w-12", children: "#" }), _jsx(TableHead, { children: "Taak" }), _jsx(TableHead, { children: "Module" }), _jsx(TableHead, { children: "Start" }), _jsx(TableHead, { children: "Gereed" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { className: "text-right", children: "Actie" })] }) }), _jsx(TableBody, { children: orderTaken.map((t) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "text-muted-foreground", children: t.sequence + 1 }), _jsxs(TableCell, { className: "font-medium", children: [TASK_LABEL[t.task_type] ?? t.task_type, t.shadow && (_jsx(Badge, { variant: "outline", className: "ml-2 text-[10px]", children: "schaduw" }))] }), _jsx(TableCell, { className: "text-sm", children: LOGISTICS_MODULES[t.owner_module] ?? t.owner_module }), _jsxs(TableCell, { className: "text-sm", children: [tijd(t.planned_start), t.payload?.["pickWindowShifted"] === true && (_jsx(Badge, { variant: "outline", className: "ml-2 text-[10px]", title: "Het berekende moment lag in het verleden; deze taak is naar nu verschoven.", children: "te laat aangemeld" }))] }), _jsx(TableCell, { className: "text-sm", children: tijd(t.planned_end) }), _jsxs(TableCell, { children: [_jsx(Badge, { variant: statusVariant(t.status), children: TASK_STATUS_LABEL[t.status] ?? t.status }), t.claimed_by && (t.status === "claimed" || t.status === "in_progress") && (_jsxs("span", { className: "text-muted-foreground ml-2 text-xs", children: ["door ", t.claimed_by] })), t.error && _jsx("span", { className: "text-destructive ml-2 text-xs", children: t.error })] }), _jsxs(TableCell, { className: "space-x-1 text-right", children: [t.status === "planned" && (_jsx(Button, { variant: "outline", size: "sm", onClick: () => void claimTaak(t.id), children: "Claimen" })), (t.status === "claimed" || t.status === "in_progress") && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", size: "sm", onClick: () => void rondTaakAf(t.id), children: "Afronden" }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => void meldTaakMislukt(t.id, "Handmatig gemeld vanuit regieoverzicht"), children: "Mislukt" })] }))] })] }, t.id))) })] })] }, orderRef));
-                        })) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Planrondes" }), _jsx(CardDescription, { children: "Elke keer dat de Engine (her)plande, met welke regelversie." })] }), _jsx(CardContent, { children: safeRuns.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: "Nog geen planrondes." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Moment" }), _jsx(TableHead, { children: "Order" }), _jsx(TableHead, { children: "Aanleiding" }), _jsx(TableHead, { children: "Bron" }), _jsx(TableHead, { children: "Regelversie" }), _jsx(TableHead, { children: "Taken" }), _jsx(TableHead, { children: "Signalen" })] }) }), _jsx(TableBody, { children: safeRuns.map((r) => {
-                                        const warnings = Array.isArray(r.warnings) ? r.warnings : [];
-                                        return (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "text-sm", children: tijd(r.created_at) }), _jsx(TableCell, { className: "font-medium", children: r.order_ref }), _jsx(TableCell, { className: "text-sm", children: r.trigger }), _jsx(TableCell, { className: "text-sm", children: r.source_module ?? "—" }), _jsxs(TableCell, { className: "text-sm", children: [r.rule_version ?? "—", r.settings_hash ? (_jsx("span", { className: "text-muted-foreground ml-1 font-mono text-xs", children: r.settings_hash.slice(0, 6) })) : null] }), _jsxs(TableCell, { className: "text-sm", children: [r.tasks_created, " nieuw / ", r.tasks_revised, " herzien"] }), _jsx(TableCell, { className: "text-sm", children: warnings.length === 0 ? (_jsx("span", { className: "text-muted-foreground", children: "\u2014" })) : (_jsx("div", { className: "flex flex-wrap gap-1", children: warnings.map((w, i) => (_jsx(Badge, { variant: "outline", children: WAARSCHUWING_LABEL[String(w.code)] ?? String(w.code) }, i))) })) })] }, r.id));
-                                    }) })] })) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Binnengekomen orders" }), _jsx(CardDescription, { children: "Elke binnengekomen order wordt automatisch omgezet naar de bijbehorende werkzaamheden." })] }), _jsx(CardContent, { children: safeMeldingen.length === 0 ? (_jsx("p", { className: "text-muted-foreground text-sm", children: "Nog geen meldingen ontvangen." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Moment" }), _jsx(TableHead, { children: "Onderdeel" }), _jsx(TableHead, { children: "Soort" }), _jsx(TableHead, { children: "Order" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { className: "w-24" })] }) }), _jsx(TableBody, { children: safeMeldingen.map((m) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "text-sm", children: tijd(m.created_at) }), _jsx(TableCell, { className: "text-sm", children: LOGISTICS_MODULES[m.source_module] ?? m.source_module }), _jsx(TableCell, { className: "text-sm", children: m.event_type }), _jsx(TableCell, { className: "font-medium", children: m.order_ref }), _jsxs(TableCell, { children: [_jsx(Badge, { variant: m.status === "failed" ? "destructive" : m.status === "processed" ? "default" : "outline", children: m.status === "processed" ? "Verwerkt" : m.status === "failed" ? "Mislukt" : "Wachtend" }), m.error && _jsx("p", { className: "text-destructive mt-1 text-xs", children: m.error })] }), _jsx(TableCell, { className: "text-right", children: m.status !== "processed" && (_jsxs(Button, { variant: "ghost", size: "sm", onClick: () => void herverwerkMelding(m.id), children: [_jsx(RotateCcw, { className: "mr-1 h-4 w-4" }), "Opnieuw"] })) })] }, m.id))) })] })) })] }), _jsx(FloridayPushCard, {}), _jsx(PrintjobsCard, {}), _jsx(VoorraadMeldingenCard, {}), _jsx(VertragingMeldingenCard, {}), _jsx(CapaciteitMeldingenCard, {}), _jsx(BeladingIndelingCard, {})] }));
+    // Alleen open en geplande taken, geteld in de database (geen 500-grens, geen geannuleerde).
+    const [perModule, setPerModule] = useState({});
+    const [loading, setLoading] = useState(true);
+    const [telFout, setTelFout] = useState(null);
+    const laden = useCallback(async () => {
+        setLoading(true);
+        const { data, error } = await supabase.rpc("logistics_task_open_counts");
+        setTelFout(error ? error.message : null);
+        setPerModule(error ? {} : tellOpenTaken(data));
+        setLoading(false);
+    }, []);
+    useEffect(() => {
+        void laden();
+    }, [laden]);
+    return (_jsxs("div", { className: "space-y-6 p-6", children: [_jsxs("div", { className: "flex flex-wrap items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsxs("h1", { className: "flex items-center gap-2 text-2xl font-semibold tracking-tight", children: [_jsx(Workflow, { className: "h-6 w-6 text-primary" }), "Overzicht & meldingen"] }), _jsx("p", { className: "text-muted-foreground text-sm", children: "Wat er vandaag klaarstaat en waar aandacht voor nodig is." })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", asChild: true, children: _jsx(Link, { to: "/logistiek-engine", children: "Terug naar overzicht" }) }), _jsxs(Button, { variant: "outline", onClick: () => void laden(), disabled: loading, children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), "Vernieuwen"] })] })] }), _jsx(InklapbaarVenster, { titel: "Binnengekomen orders", omschrijving: "Klik een order open voor elke stap, beslissing, foutmelding en elk document.", standaardOpen: true, children: _jsx(OrderLogboek, { titel: "Binnengekomen orders" }) }), _jsx(InklapbaarVenster, { titel: "Consistentie", omschrijving: "Controle of alle modules hetzelfde tonen.", children: _jsx(ConsistentieCard, {}) }), _jsx(InklapbaarVenster, { titel: "Beladingsafwijkingen", omschrijving: "Verschillen tussen onze belading en de laatste Floriday-gegevens.", children: _jsx(BeladingsafwijkingenCard, {}) }), _jsx(InklapbaarVenster, { titel: "Karplanstatus", omschrijving: "Stand van de karrenindeling.", children: _jsx(KarplanStatusCard, {}) }), _jsx(InklapbaarVenster, { titel: "Kardekking", omschrijving: "Staat elke bestelregel correct op een kar?", children: _jsx(KardekkingCard, {}) }), _jsx(InklapbaarVenster, { titel: "Vergelijkende planner", omschrijving: "Proefvergelijking: blijft de karindeling gelijk?", children: _jsx(PlannerDiffCard, {}) }), _jsxs(InklapbaarVenster, { titel: "Taken per module", omschrijving: "Openstaande en geplande taken.", children: [telFout && _jsxs("p", { className: "mb-2 text-sm text-destructive", children: ["Telling niet beschikbaar: ", telFout] }), _jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", children: Object.keys(LOGISTICS_MODULES).map((key) => (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "pb-2", children: [_jsx(CardDescription, { children: LOGISTICS_MODULES[key] }), _jsx(CardTitle, { className: "text-2xl", children: perModule[key] ?? 0 })] }), _jsx(CardContent, { className: "text-muted-foreground text-xs", children: "openstaande en geplande taken" })] }, key))) })] })] }));
 }

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"TaakGezondheidCard.d.ts","sourceRoot":"","sources":["../../src/components/TaakGezondheidCard.tsx"],"names":[],"mappings":"AAoBA,wBAAgB,kBAAkB,gCA6DjC"}

package/dist-lib/components/TaakGezondheidCard.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// ============================================================================
+// src/components/TaakGezondheidCard.tsx — draaien de achtergrondtaken nog?
+// ============================================================================
+// Toont per achtergrondtaak van de engine wanneer hij voor het laatst draaide
+// en of hij mislukt. Alleen lezen.
+// ============================================================================
+import { AlertTriangle, CheckCircle2, RefreshCw } from "lucide-react";
+import { useTaakGezondheid } from "../hooks/useTaakGezondheid";
+function geleden(tijd) {
+    if (!tijd)
+        return "nooit gedraaid";
+    const ms = Date.now() - new Date(tijd).getTime();
+    if (!Number.isFinite(ms))
+        return "onbekend";
+    const min = Math.round(ms / 60000);
+    if (min < 1)
+        return "zojuist";
+    if (min < 60)
+        return `${min} min geleden`;
+    return `${Math.round(min / 6) / 10} uur geleden`;
+}
+export function TaakGezondheidCard() {
+    const { taken, laden, fout, herlaad } = useTaakGezondheid();
+    const veilig = Array.isArray(taken) ? taken : [];
+    const problemen = veilig.filter((t) => !t.actief || t.mislukt24u > 0 || t.laatsteStatus === "failed");
+    return (_jsxs("div", { className: "rounded-lg border bg-card p-4 text-card-foreground", children: [_jsxs("div", { className: "mb-3 flex items-center justify-between gap-2", children: [_jsxs("div", { children: [_jsx("h3", { className: "font-semibold", children: "Achtergrondtaken" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Indelen, taken uitvoeren, afronden en opruimen draaien automatisch." })] }), _jsx("button", { type: "button", onClick: () => void herlaad(), className: "rounded-md border px-3 py-1.5 text-sm hover:bg-accent", "aria-label": "Vernieuwen", children: _jsx(RefreshCw, { className: "h-4 w-4" }) })] }), fout ? _jsx("p", { className: "mb-3 text-sm text-destructive", children: fout }) : null, !laden && problemen.length === 0 && veilig.length > 0 ? (_jsxs("p", { className: "mb-3 flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(CheckCircle2, { className: "h-4 w-4" }), " Alle taken draaien zonder fouten."] })) : null, _jsx("ul", { className: "space-y-2", children: veilig.map((t) => {
+                    const slecht = !t.actief || t.mislukt24u > 0 || t.laatsteStatus === "failed";
+                    return (_jsxs("li", { className: "rounded-md border p-3 text-sm", children: [_jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("span", { className: "font-medium", children: t.naam }), _jsx("span", { className: slecht ? "text-destructive" : "text-muted-foreground", children: geleden(t.laatsteStart) })] }), _jsxs("p", { className: "text-muted-foreground", children: [t.actief ? "actief" : "uitgezet", " \u00B7 ", t.schema, t.mislukt24u > 0 ? ` · ${t.mislukt24u} keer mislukt in 24 uur` : ""] }), slecht && t.laatsteBericht ? (_jsxs("p", { className: "mt-1 flex items-start gap-2 text-destructive", children: [_jsx(AlertTriangle, { className: "mt-0.5 h-4 w-4 shrink-0" }), t.laatsteBericht] })) : null] }, t.naam));
+                }) })] }));
+}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"WerktijdenCard.d.ts","sourceRoot":"","sources":["../../src/components/WerktijdenCard.tsx"],"names":[],"mappings":"AA0BA,wBAAgB,cAAc,gCAwN7B"}

package/dist-lib/components/WerktijdenCard.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// ============================================================================
+// src/components/WerktijdenCard.tsx — openingstijden voor het terugrekenen
+// ============================================================================
+// De Engine rekent de benodigde picktijd terug in werkuren. Deze kaart toont en
+// beheert de vensters per weekdag, afwijkende dagen en de tijdzone. Ontbreken
+// die gegevens, dan rekent de Engine niets uit — er wordt niets geraden.
+// GEEN <Header /> hier — die levert de shell.
+// ============================================================================
+import { useState } from "react";
+import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, Skeleton, } from "@flowselections/core";
+import { Clock, Plus, RefreshCw, Trash2 } from "lucide-react";
+import { useWerktijden } from "../hooks/useWerktijden";
+const DAGEN = ["Zondag", "Maandag", "Dinsdag", "Woensdag", "Donderdag", "Vrijdag", "Zaterdag"];
+export function WerktijdenCard() {
+    const { status, loading, error, refresh, zetTijdzone, voegVensterToe, verwijderVenster, voegUitzonderingToe, verwijderUitzondering, } = useWerktijden();
+    const [tz, setTz] = useState("");
+    const [dag, setDag] = useState("1");
+    const [van, setVan] = useState("07:00");
+    const [tot, setTot] = useState("17:00");
+    const [datum, setDatum] = useState("");
+    const [melding, setMelding] = useState(null);
+    const vensters = status?.windows ?? [];
+    const uitzonderingen = status?.exceptions ?? [];
+    const doe = async (fn, ok) => {
+        try {
+            await fn();
+            setMelding(ok);
+        }
+        catch (e) {
+            setMelding(e?.message ? String(e.message) : "Opslaan is niet gelukt.");
+        }
+    };
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsxs(CardTitle, { className: "flex items-center gap-2", children: [_jsx(Clock, { className: "h-4 w-4" }), "Werktijden voor het picken"] }), _jsx(CardDescription, { children: "De starttijd van een pickopdracht wordt teruggerekend in werkuren, niet in klokuren. Alleen tijd binnen deze vensters telt mee." })] }), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => void refresh(), disabled: loading, children: [_jsx(RefreshCw, { className: "h-4 w-4" }), "Verversen"] })] }), _jsx(CardContent, { className: "space-y-4", children: loading ? (_jsx(Skeleton, { className: "h-24 w-full" })) : error ? (_jsx("p", { className: "text-sm text-destructive", children: error })) : (_jsxs(_Fragment, { children: [!status?.usable ? (_jsx("p", { className: "text-sm text-destructive", children: "Er zijn nog geen werktijden ingesteld. Zolang die ontbreken, bepaalt de Engine geen starttijd voor het picken en komt er niets vrij op het pickscherm." })) : null, _jsx("div", { className: "flex flex-wrap items-end gap-2", children: _jsxs("div", { children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "Tijdzone van de vestiging" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { value: tz || status?.timezone || "", placeholder: "bijv. Europe/Amsterdam", onChange: (e) => setTz(e.target.value), className: "w-56" }), _jsx(Button, { size: "sm", onClick: () => void doe(() => zetTijdzone((tz || status?.timezone || "").trim()), "Tijdzone opgeslagen."), children: "Opslaan" })] })] }) }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-sm font-medium", children: "Openingstijden per dag" }), vensters.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen openingstijden ingesteld." })) : (_jsx("ul", { className: "space-y-1", children: vensters.map((v) => (_jsxs("li", { className: "flex items-center gap-2 text-sm", children: [_jsx(Badge, { variant: "outline", children: DAGEN[v.weekday] ?? v.weekday }), _jsxs("span", { children: [String(v.opens).slice(0, 5), " \u2013 ", String(v.closes).slice(0, 5)] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => void doe(() => verwijderVenster(v.id), "Venster verwijderd."), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, v.id))) })), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("select", { value: dag, onChange: (e) => setDag(e.target.value), className: "h-9 rounded-md border bg-background px-2 text-sm", children: DAGEN.map((d, i) => (_jsx("option", { value: String(i), children: d }, d))) }), _jsx(Input, { type: "time", value: van, onChange: (e) => setVan(e.target.value), className: "w-32" }), _jsx(Input, { type: "time", value: tot, onChange: (e) => setTot(e.target.value), className: "w-32" }), _jsxs(Button, { size: "sm", onClick: () => void doe(() => voegVensterToe(Number(dag), van, tot), "Openingstijd toegevoegd."), children: [_jsx(Plus, { className: "h-4 w-4" }), "Toevoegen"] })] }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Meerdere vensters op \u00E9\u00E9n dag mag; zo blijft bijvoorbeeld een pauze buiten de picktijd. Een dag zonder venster is een niet-werkdag." })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-sm font-medium", children: "Afwijkende dagen" }), uitzonderingen.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen afwijkende dagen ingesteld." })) : (_jsx("ul", { className: "space-y-1", children: uitzonderingen.map((u) => (_jsxs("li", { className: "flex items-center gap-2 text-sm", children: [_jsx(Badge, { variant: "outline", children: u.day }), _jsx("span", { children: u.closed
+                                                    ? "gesloten"
+                                                    : `${String(u.opens ?? "").slice(0, 5)} – ${String(u.closes ?? "").slice(0, 5)}` }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => void doe(() => verwijderUitzondering(u.id), "Afwijkende dag verwijderd."), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, u.id))) })), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Input, { type: "date", value: datum, onChange: (e) => setDatum(e.target.value), className: "w-44" }), _jsx(Button, { variant: "outline", size: "sm", disabled: !datum, onClick: () => void doe(() => voegUitzonderingToe(datum, true, null, null, null), "Dag als gesloten gezet."), children: "Gesloten" }), _jsxs(Button, { size: "sm", disabled: !datum, onClick: () => void doe(() => voegUitzonderingToe(datum, false, van, tot, null), "Afwijkende openingstijd toegevoegd."), children: ["Afwijkend ", van, "\u2013", tot] })] }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Een afwijkende dag gaat altijd boven de vaste weekinstelling." })] }), melding ? _jsx("p", { className: "text-sm", children: melding }) : null] })) })] }));
+}

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

@@ -1 +1 @@
-{"version":3,"file":"WerkwijzeHerindelingCard.d.ts","sourceRoot":"","sources":["../../src/components/WerkwijzeHerindelingCard.tsx"],"names":[],"mappings":"AA4BA,wBAAgB,wBAAwB,gCAoGvC"}
+{"version":3,"file":"WerkwijzeHerindelingCard.d.ts","sourceRoot":"","sources":["../../src/components/WerkwijzeHerindelingCard.tsx"],"names":[],"mappings":"AAoCA,wBAAgB,wBAAwB,gCA+RvC"}

package/dist-lib/components/WerkwijzeHerindelingCard.js

@@ -7,30 +7,124 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // Engine-functies; hier wordt niets zelf berekend.
 // GEEN <Header /> hier — die levert de shell.
 // ============================================================================
-import { useState } from "react";
-import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Skeleton, } from "@flowselections/core";
-import { RefreshCw, RotateCcw, Ruler, Boxes } from "lucide-react";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Skeleton, } from "@flowselections/core";
+import { RefreshCw, RotateCcw, Ruler, Boxes, AlertTriangle } from "lucide-react";
 import { useWerkwijzeStatus } from "../hooks/useWerkwijzeStatus";
 const METHODE_LABEL = {
     belading: "Indelen op basis van belading",
     afmetingen: "Indelen op basis van afmetingen",
 };
 export function WerkwijzeHerindelingCard() {
-    const { status, loading, busy, error, refresh, herindelen } = useWerkwijzeStatus();
+    const { status, loading, busy, error, refresh, refreshQuiet, herindelen, alsnogAllesHerindelen, pakbonnenGereedmaken, } = useWerkwijzeStatus();
     const [melding, setMelding] = useState(null);
+    const [totaal, setTotaal] = useState(0);
+    const [bevestigOpen, setBevestigOpen] = useState(false);
+    const [pakbonnen, setPakbonnen] = useState(null);
+    const [pakbonBezig, setPakbonBezig] = useState(false);
+    const quietRef = useRef(refreshQuiet);
+    quietRef.current = refreshQuiet;
+    const pakbonRef = useRef(pakbonnenGereedmaken);
+    pakbonRef.current = pakbonnenGereedmaken;
+    const draaitRef = useRef(false);
     const wachtrij = status?.wachtrij ?? {};
     const pending = Number(wachtrij["pending"] ?? 0);
+    const running = Number(wachtrij["running"] ?? 0);
     const blocked = Number(wachtrij["geblokkeerd"] ?? 0);
+    const openWerk = pending + running;
+    const bezigMetIndelen = totaal > 0 && openWerk > 0;
+    const gereed = totaal > 0 ? Math.max(0, Math.min(totaal, totaal - openWerk)) : 0;
+    const percentage = totaal > 0 ? Math.round((gereed / totaal) * 100) : 0;
+    const pakbonPercentage = pakbonnen && pakbonnen.totaal > 0
+        ? Math.round((pakbonnen.gereed / pakbonnen.totaal) * 100)
+        : 0;
+    // Pakbongegevens klaarzetten; herhaald aanroepen is veilig en idempotent.
+    const pakbonRonde = useCallback(async () => {
+        if (draaitRef.current)
+            return;
+        draaitRef.current = true;
+        setPakbonBezig(true);
+        try {
+            setPakbonnen(await pakbonRef.current());
+        }
+        catch {
+            // Een mislukte ronde blokkeert de herindeling niet; volgende ronde probeert opnieuw.
+        }
+        finally {
+            draaitRef.current = false;
+            setPakbonBezig(false);
+        }
+    }, []);
+    // Zolang er nog orders in de wachtrij staan, de stand stil bijwerken en
+    // ondertussen de pakbonnen van die orders alvast printklaar maken.
+    useEffect(() => {
+        const nogPakbonnenOpen = (pakbonnen?.open ?? 0) > 0;
+        if (!bezigMetIndelen && !nogPakbonnenOpen)
+            return;
+        const t = setInterval(() => {
+            void quietRef.current();
+            void pakbonRonde();
+        }, 3000);
+        return () => clearInterval(t);
+    }, [bezigMetIndelen, pakbonnen?.open, pakbonRonde]);
+    // De balk verdwijnt vanzelf zodra alles klaar is, zodat hij nooit blijft staan.
+    useEffect(() => {
+        if (totaal === 0)
+            return;
+        const nogPakbonnenOpen = (pakbonnen?.open ?? 0) > 0;
+        if (bezigMetIndelen || nogPakbonnenOpen)
+            return;
+        const t = setTimeout(() => {
+            setTotaal(0);
+            setPakbonnen(null);
+            setMelding(null);
+        }, 6000);
+        return () => clearTimeout(t);
+    }, [totaal, bezigMetIndelen, pakbonnen?.open]);
+    // Harde bovengrens: duurt het te lang, dan stopt de balk met een leesbare melding.
+    useEffect(() => {
+        if (totaal === 0)
+            return;
+        const t = setTimeout(() => {
+            setTotaal(0);
+            setPakbonnen(null);
+            setMelding("Het opnieuw indelen duurt langer dan verwacht. De achtergrondverwerking loopt door; klik op Verversen voor de actuele stand.");
+        }, 5 * 60 * 1000);
+        return () => clearTimeout(t);
+    }, [totaal]);
     const opnieuw = async () => {
         try {
             const n = await herindelen();
+            setTotaal(n);
             setMelding(n === 0
                 ? "Er stonden geen orders open om opnieuw in te delen."
-                : `${n} order(s) opnieuw aangemeld. De indeling wordt op de achtergrond bijgewerkt.`);
+                : `${n} order(s) opnieuw aangemeld. De indeling en de pakbonnen worden op de achtergrond klaargezet.`);
+            void pakbonRonde();
         }
         catch (e) {
+            setTotaal(0);
             setMelding(e?.message ? String(e.message) : "Opnieuw indelen is niet gelukt.");
         }
     };
-    return (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsxs(CardTitle, { className: "flex items-center gap-2", children: [status?.methode === "afmetingen" ? (_jsx(Ruler, { className: "h-4 w-4" })) : (_jsx(Boxes, { className: "h-4 w-4" })), "Werkwijze en herindeling"] }), _jsx(CardDescription, { children: "Zo worden karren op dit moment samengesteld. Verandert de methode, dan worden alle openstaande orders automatisch opnieuw ingedeeld." })] }), _jsxs("div", { className: "flex gap-2", children: [_jsxs(Button, { variant: "outline", size: "sm", onClick: () => void refresh(), disabled: loading, children: [_jsx(RefreshCw, { className: "h-4 w-4" }), "Verversen"] }), _jsxs(Button, { size: "sm", onClick: () => void opnieuw(), disabled: busy, children: [_jsx(RotateCcw, { className: "h-4 w-4" }), "Alles opnieuw indelen"] })] })] }), _jsx(CardContent, { className: "space-y-3", children: loading ? (_jsx(Skeleton, { className: "h-16 w-full" })) : error ? (_jsx("p", { className: "text-sm text-destructive", children: error })) : status ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Badge, { children: METHODE_LABEL[status.methode] ?? status.methode }), status.actieveWerkwijze ? (_jsxs("span", { className: "text-sm text-muted-foreground", children: ["volgens werkwijze \u201C", status.actieveWerkwijze, "\u201D"] })) : (_jsx("span", { className: "text-sm text-muted-foreground", children: "Er staat geen werkwijze aan; er wordt op belading ingedeeld." }))] }), _jsxs("div", { className: "grid gap-3 sm:grid-cols-3", children: [_jsxs("div", { className: "rounded-md border p-3", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "Karren volgens deze methode" }), _jsx("p", { className: "text-lg font-semibold", children: status.karrenVolgensMethode })] }), _jsxs("div", { className: "rounded-md border p-3", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "Karren van een oudere methode" }), _jsx("p", { className: "text-lg font-semibold", children: status.karrenOudeMethode })] }), _jsxs("div", { className: "rounded-md border p-3", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "Wacht op indelen" }), _jsx("p", { className: "text-lg font-semibold", children: pending }), blocked > 0 ? (_jsxs("p", { className: "text-xs text-destructive", children: [blocked, " geblokkeerd"] })) : null] })] }), status.karrenOudeMethode > 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Deze karren zijn nog met een eerdere methode berekend. Ze worden vervangen zodra de order opnieuw is ingedeeld; al geprinte of gecontroleerde karren blijven staan." })) : null, melding ? _jsx("p", { className: "text-sm", children: melding }) : null] })) : null })] }));
+    // Noodknop: alles opnieuw indelen, ook orders die al gepickt of geprint zijn.
+    const allesOpnieuwInclusiefGepickt = async () => {
+        setBevestigOpen(false);
+        try {
+            const r = await alsnogAllesHerindelen();
+            setTotaal(r.aangemeld);
+            setMelding(r.aangemeld === 0
+                ? "Er stonden geen orders open om opnieuw in te delen."
+                : `${r.aangemeld} order(s) lopen de flow opnieuw af, vanaf "Order komt binnen". ${r.karrenVerwijderd} kar(ren) en ${r.pakbonnenVervallen} oude pakbon(nen) zijn vervallen; overal worden nieuwe pakbonnen met nieuwe barcodes klaargezet.`);
+            void pakbonRonde();
+        }
+        catch (e) {
+            setTotaal(0);
+            setMelding(e?.message ? String(e.message) : "Volledig opnieuw indelen is niet gelukt.");
+        }
+    };
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsxs(CardTitle, { className: "flex items-center gap-2", children: [status?.methode === "afmetingen" ? (_jsx(Ruler, { className: "h-4 w-4" })) : (_jsx(Boxes, { className: "h-4 w-4" })), "Werkwijze en herindeling"] }), _jsx(CardDescription, { children: "Zo worden karren op dit moment samengesteld. Verandert de methode, dan worden alle openstaande orders automatisch opnieuw ingedeeld." })] }), _jsxs("div", { className: "flex flex-wrap justify-end gap-2", children: [_jsxs(Button, { variant: "outline", size: "sm", onClick: () => void refresh(), disabled: loading, children: [_jsx(RefreshCw, { className: "h-4 w-4" }), "Verversen"] }), _jsxs(Button, { size: "sm", onClick: () => void opnieuw(), disabled: busy, children: [_jsx(RotateCcw, { className: "h-4 w-4" }), "Alles opnieuw indelen"] }), _jsxs(Button, { size: "sm", variant: "destructive", onClick: () => setBevestigOpen(true), disabled: busy, children: [_jsx(AlertTriangle, { className: "h-4 w-4" }), "Alle orders opnieuw indelen, ook gepickte orders"] })] })] }), _jsx(CardContent, { className: "space-y-3", children: loading ? (_jsx(Skeleton, { className: "h-16 w-full" })) : error ? (_jsx("p", { className: "text-sm text-destructive", children: error })) : status ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Badge, { children: METHODE_LABEL[status.methode] ?? status.methode }), status.actieveWerkwijze ? (_jsxs("span", { className: "text-sm text-muted-foreground", children: ["volgens werkwijze \u201C", status.actieveWerkwijze, "\u201D"] })) : (_jsx("span", { className: "text-sm text-muted-foreground", children: "Er staat geen werkwijze aan; er wordt op belading ingedeeld." }))] }), _jsxs("div", { className: "grid gap-3 sm:grid-cols-3", children: [_jsxs("div", { className: "rounded-md border p-3", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "Karren volgens deze methode" }), _jsx("p", { className: "text-lg font-semibold", children: status.karrenVolgensMethode })] }), _jsxs("div", { className: "rounded-md border p-3", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "Karren van een oudere methode" }), _jsx("p", { className: "text-lg font-semibold", children: status.karrenOudeMethode })] }), _jsxs("div", { className: "rounded-md border p-3", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "Wacht op indelen" }), _jsx("p", { className: "text-lg font-semibold", children: openWerk }), running > 0 ? (_jsxs("p", { className: "text-xs text-muted-foreground", children: ["waarvan ", running, " nu bezig"] })) : null, blocked > 0 ? (_jsxs("p", { className: "text-xs text-destructive", children: [blocked, " geblokkeerd"] })) : null] })] }), status.karrenOudeMethode > 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Deze karren zijn nog met een eerdere methode berekend. Ze worden vervangen zodra de order opnieuw is ingedeeld; al geprinte of gecontroleerde karren blijven staan." })) : null, melding ? _jsx("p", { className: "text-sm", children: melding }) : null, totaal > 0 ? (_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "h-2 w-full overflow-hidden rounded-full bg-muted", role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": percentage, "aria-label": "Voortgang opnieuw indelen", children: _jsx("div", { className: "h-full rounded-full bg-primary transition-all duration-500", style: { width: `${percentage}%` } }) }), _jsx("p", { className: "text-xs text-muted-foreground", children: bezigMetIndelen
+                                        ? `${gereed} van ${totaal} order(s) ingedeeld — ${percentage}%`
+                                        : `Klaar: ${totaal} order(s) opnieuw ingedeeld.` })] })) : null, pakbonnen && pakbonnen.totaal > 0 ? (_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "h-2 w-full overflow-hidden rounded-full bg-muted", role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": pakbonPercentage, "aria-label": "Voortgang pakbonnen klaarzetten", children: _jsx("div", { className: "h-full rounded-full bg-primary/70 transition-all duration-500", style: { width: `${pakbonPercentage}%` } }) }), _jsx("p", { className: "text-xs text-muted-foreground", children: pakbonnen.open > 0 || pakbonBezig
+                                        ? `Pakbonnen klaarzetten: ${pakbonnen.gereed} van ${pakbonnen.totaal} printklaar — ${pakbonPercentage}%`
+                                        : `Alle ${pakbonnen.totaal} pakbon(nen) staan printklaar.` })] })) : null] })) : null }), _jsx(AlertDialog, { open: bevestigOpen, onOpenChange: setBevestigOpen, children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Weet je het zeker?" }), _jsx(AlertDialogDescription, { children: "Alle openstaande orders worden opnieuw ingedeeld, ook orders die al gepickt of geprint zijn. Alle oude pakbonnen en barcodes vervallen en er worden overal nieuwe aangemaakt. Reeds geprinte pakbonnen kunnen daarna niet meer worden gescand. Dit kan niet ongedaan worden gemaakt." })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Annuleren" }), _jsx(AlertDialogAction, { onClick: () => void allesOpnieuwInclusiefGepickt(), children: "Ja, alles opnieuw indelen" })] })] }) })] }));
 }

package/dist-lib/hooks/useAfrondWachtrij.d.ts

@@ -0,0 +1,28 @@
+export interface AfrondStand {
+    wachtend: number;
+    bezig: number;
+    mislukt: number;
+    oudsteWachttijdSeconden: number;
+    laatsteFout: string | null;
+    laatstAfgerond: string | null;
+}
+export interface AfrondRegel {
+    orderId: string;
+    status: string;
+    pogingen: number;
+    maxPogingen: number;
+    reden: string | null;
+    fout: string | null;
+    aangemeldOp: string | null;
+    volgendePoging: string | null;
+}
+export declare function useAfrondWachtrij(intervalMs?: number): {
+    stand: AfrondStand;
+    regels: AfrondRegel[];
+    laden: boolean;
+    fout: string | null;
+    herlaad: () => Promise<void>;
+    opnieuw: (orderId: string) => Promise<boolean>;
+    naloop: () => Promise<boolean>;
+};
+//# sourceMappingURL=useAfrondWachtrij.d.ts.map

package/dist-lib/hooks/useAfrondWachtrij.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAfrondWachtrij.d.ts","sourceRoot":"","sources":["../../src/hooks/useAfrondWachtrij.ts"],"names":[],"mappings":"AAUA,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,uBAAuB,EAAE,MAAM,CAAC;IAChC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B;AAED,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B;AAWD,wBAAgB,iBAAiB,CAAC,UAAU,SAAQ;;;;;;uBA4DhC,MAAM;;EAuBzB"}