@flowselections/floriday-verkoop-module 1.0.12 → 1.0.14

package/dist-lib/components/verkoop/AutoFulfillmentStatusCard.d.ts

@@ -0,0 +1,4 @@
+export declare function AutoFulfillmentStatusCard({ salesOrderId }: {
+    salesOrderId: string;
+}): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=AutoFulfillmentStatusCard.d.ts.map

package/dist-lib/components/verkoop/AutoFulfillmentStatusCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoFulfillmentStatusCard.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/AutoFulfillmentStatusCard.tsx"],"names":[],"mappings":"AAyDA,wBAAgB,yBAAyB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,kDA6FnF"}

package/dist-lib/components/verkoop/AutoFulfillmentStatusCard.js

@@ -0,0 +1,95 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { useServerFn } from "@tanstack/react-start";
+import { useEffect } from "react";
+import { supabase } from "../../integrations/supabase/client";
+import { getAutoFulfillmentStatus, retryAutoFulfillment, getPreferredWarehouseStatus, } from "../../lib/floriday-auto-fulfillment.functions";
+import { Button } from "@flowselections/core";
+import { toast } from "sonner";
+const REASON_LABELS = {
+    "no-preferred-warehouse": "Er is nog geen voorkeursmagazijn ingesteld op de Floriday-connectie.",
+    "no-warehouse": "Geen despatch-magazijn gevonden (voorkeur, salesorder, én cache leeg).",
+    "no-delivery-order": "Nog geen delivery order (met fulfillment-requests) ontvangen van Floriday voor deze salesorder.",
+    "existing-fulfillment": "Er bestaat al een fulfillment order voor deze salesorder.",
+    "sales-order-deleted": "Salesorder is verwijderd bij Floriday.",
+    "already-created": "Fulfillment order is al automatisch aangemaakt.",
+    "connection-not-found": "Floriday-connectie niet gevonden.",
+    "no-packing-fallback": "Belading ontbreekt; er is een enkele kar als fallback gebruikt.",
+    "warehouse-fallback:order": "Despatch-magazijn overgenomen uit de salesorder (geen voorkeursmagazijn ingesteld).",
+    "warehouse-fallback:cache": "Fallback-magazijn uit cache gebruikt; stel eventueel een voorkeur in bij de Authenticatiemodule.",
+};
+function statusStyle(status) {
+    switch (status) {
+        case "created":
+            return "bg-emerald-50 text-emerald-800 border-emerald-200";
+        case "failed":
+            return "bg-red-50 text-red-800 border-red-200";
+        case "skipped":
+            return "bg-amber-50 text-amber-800 border-amber-200";
+        default:
+            return "bg-slate-50 text-slate-700 border-slate-200";
+    }
+}
+function statusLabel(status) {
+    switch (status) {
+        case "created":
+            return "Fulfillment order automatisch aangemaakt";
+        case "failed":
+            return "Automatische fulfillment mislukt";
+        case "skipped":
+            return "Automatische fulfillment overgeslagen";
+        default:
+            return "Fulfillment nog niet automatisch aangemaakt";
+    }
+}
+export function AutoFulfillmentStatusCard({ salesOrderId }) {
+    const queryClient = useQueryClient();
+    const fetchStatus = useServerFn(getAutoFulfillmentStatus);
+    const retryFn = useServerFn(retryAutoFulfillment);
+    const queryKey = ["auto-fulfillment-status", salesOrderId];
+    const { data, isLoading } = useQuery({
+        queryKey,
+        queryFn: () => fetchStatus({ data: { salesOrderId } }),
+    });
+    const fetchWarehouse = useServerFn(getPreferredWarehouseStatus);
+    const { data: warehouseStatus } = useQuery({
+        queryKey: ["preferred-warehouse-status"],
+        queryFn: () => fetchWarehouse(),
+        staleTime: 60000,
+    });
+    useEffect(() => {
+        const channel = supabase
+            .channel(`auto-fulfillment-${salesOrderId}`)
+            .on("postgres_changes", {
+            event: "*",
+            schema: "public",
+            table: "floriday_auto_fulfillment_log",
+            filter: `sales_order_id=eq.${salesOrderId}`,
+        }, () => queryClient.invalidateQueries({ queryKey }))
+            .subscribe();
+        return () => {
+            supabase.removeChannel(channel);
+        };
+    }, [salesOrderId, queryClient]);
+    const mutation = useMutation({
+        mutationFn: () => retryFn({ data: { salesOrderId } }),
+        onSuccess: (res) => {
+            queryClient.invalidateQueries({ queryKey });
+            if (res.status === "created")
+                toast.success("Fulfillment order aangemaakt");
+            else if (res.status === "failed")
+                toast.error(`Mislukt: ${res.reason ?? "onbekend"}`);
+            else
+                toast.info(`Overgeslagen: ${res.reason ?? ""}`);
+        },
+        onError: (err) => toast.error(err.message),
+    });
+    if (isLoading)
+        return null;
+    const row = data?.row ?? null;
+    const status = row?.status ?? "pending";
+    const canRetry = status === "failed" || status === "skipped" || !row;
+    return (_jsx("div", { className: `mt-4 rounded-md border p-3 text-sm ${statusStyle(status)}`, children: _jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: statusLabel(status) }), row?.fulfillment_order_id ? (_jsxs("div", { className: "mt-1 text-xs opacity-80", children: ["Fulfillment ID: ", _jsx("code", { children: row.fulfillment_order_id })] })) : null, row?.reason ? (_jsx("div", { className: "mt-1 text-xs opacity-80", children: REASON_LABELS[row.reason] ?? row.reason })) : null, row?.error ? (_jsxs("div", { className: "mt-1 text-xs opacity-80", children: ["Fout: ", row.error] })) : null, warehouseStatus &&
+                            !warehouseStatus.hasPreferredWarehouse &&
+                            (row?.reason === "no-preferred-warehouse" || row?.reason === "no-warehouse") ? (_jsx("div", { className: "mt-2 rounded border border-amber-300 bg-amber-50 p-2 text-xs text-amber-900", children: "Er is nog geen voorkeursmagazijn ingesteld. Ga naar de Floriday-authenticatiemodule en kies een voorkeursmagazijn \u2014 daarna worden fulfillment orders automatisch aangemaakt." })) : null] }), canRetry ? (_jsx(Button, { size: "sm", variant: "outline", disabled: mutation.isPending, onClick: () => mutation.mutate(), children: mutation.isPending ? "Bezig..." : "Opnieuw proberen" })) : null] }) }));
+}

package/dist-lib/components/verkoop/CartAssignmentWizard.d.ts

@@ -0,0 +1,6 @@
+export declare function CartAssignmentWizard({ orderId, open, onClose, }: {
+    orderId: string | null;
+    open: boolean;
+    onClose: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CartAssignmentWizard.d.ts.map

package/dist-lib/components/verkoop/CartAssignmentWizard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CartAssignmentWizard.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/CartAssignmentWizard.tsx"],"names":[],"mappings":"AA8CA,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EAAE,IAAI,EAAE,OAAO,GACvB,EAAE;IAAE,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,EAAE,OAAO,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,2CA4ThE"}

package/dist-lib/components/verkoop/CartAssignmentWizard.js

@@ -0,0 +1,194 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Karindeling-wizard — identiek aan de Mailbox-module.
+// Gebruikt planAndSaveAutoCarts + saveManualCarts uit create-order.functions,
+// zodat handmatige orders exact dezelfde logica en schermen krijgen als mailbox-orders.
+import { useEffect, useMemo, useState } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { useServerFn } from "@tanstack/react-start";
+import { Button, Badge, Card, CardContent, CardHeader, CardTitle, Input, Label, Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, toast, } from "@flowselections/core";
+import { Plus, Trash2, AlertTriangle, CheckCircle2 } from "lucide-react";
+import { planAndSaveAutoCarts, saveManualCarts } from "../../lib/create-order.functions";
+export function CartAssignmentWizard({ orderId, open, onClose, }) {
+    const fetchPlan = useServerFn(planAndSaveAutoCarts);
+    const fetchSave = useServerFn(saveManualCarts);
+    const { data, isLoading } = useQuery({
+        queryKey: ["cart-plan", orderId],
+        enabled: !!orderId && open,
+        queryFn: async () => {
+            try {
+                return await fetchPlan({ data: { orderId: orderId } });
+            }
+            catch (e) {
+                toast.error(e?.message ?? "Indelen mislukt");
+                return { autoCarts: [], remainders: [], existingManualCarts: [], nextCartNumber: 1 };
+            }
+        },
+    });
+    const autoCarts = Array.isArray(data?.autoCarts) ? data.autoCarts : [];
+    const remainders = Array.isArray(data?.remainders) ? data.remainders : [];
+    const existingManualCarts = Array.isArray(data?.existingManualCarts) ? data.existingManualCarts : [];
+    const [pool, setPool] = useState({});
+    const [manual, setManual] = useState([]);
+    useEffect(() => {
+        const p = {};
+        remainders.forEach((r) => { p[r.order_item_id] = r.crates_remaining; });
+        setPool(p);
+        const remMeta = {};
+        remainders.forEach((r) => { remMeta[r.order_item_id] = r; });
+        setManual(existingManualCarts.map((c) => ({
+            id: crypto.randomUUID(),
+            items: c.items.map((i) => {
+                const meta = i.order_item_id ? remMeta[i.order_item_id] : null;
+                return {
+                    ...i,
+                    crates_per_layer: meta?.crates_per_layer ?? i.crates_per_layer ?? 1,
+                    layers_per_cart: meta?.layers_per_cart ?? i.layers_per_cart ?? 1,
+                };
+            }),
+        })));
+    }, [data]);
+    const remByItem = useMemo(() => {
+        const m = {};
+        remainders.forEach((r) => { m[r.order_item_id] = r; });
+        return m;
+    }, [remainders]);
+    const addCart = () => setManual((m) => [...m, { id: crypto.randomUUID(), items: [] }]);
+    const addItemToCart = (cartId, orderItemId, crates) => {
+        const rem = remByItem[orderItemId];
+        if (!rem)
+            return;
+        const available = pool[orderItemId] ?? 0;
+        const take = Math.max(0, Math.min(crates, available));
+        if (take === 0)
+            return;
+        setPool((p) => ({ ...p, [orderItemId]: available - take }));
+        setManual((carts) => carts.map((c) => {
+            if (c.id !== cartId)
+                return c;
+            const existingIdx = c.items.findIndex((i) => i.order_item_id === orderItemId);
+            if (existingIdx >= 0) {
+                const next = [...c.items];
+                next[existingIdx] = { ...next[existingIdx], crates: next[existingIdx].crates + take };
+                return { ...c, items: next };
+            }
+            return {
+                ...c,
+                items: [...c.items, {
+                        order_item_id: orderItemId,
+                        product_id: rem.product_id,
+                        product_name: rem.product_name,
+                        crates: take,
+                        plants_per_crate: rem.plants_per_crate,
+                        crates_per_layer: rem.crates_per_layer,
+                        layers_per_cart: rem.layers_per_cart,
+                    }],
+            };
+        }));
+    };
+    const removeItem = (cartId, orderItemId) => {
+        setManual((carts) => carts.map((c) => {
+            if (c.id !== cartId)
+                return c;
+            const item = c.items.find((i) => i.order_item_id === orderItemId);
+            if (!item)
+                return c;
+            setPool((p) => ({ ...p, [orderItemId]: (p[orderItemId] ?? 0) + item.crates }));
+            return { ...c, items: c.items.filter((i) => i.order_item_id !== orderItemId) };
+        }));
+    };
+    const removeCart = (cartId) => {
+        setManual((carts) => {
+            const c = carts.find((x) => x.id === cartId);
+            if (c) {
+                setPool((p) => {
+                    const np = { ...p };
+                    c.items.forEach((i) => {
+                        if (!i.order_item_id)
+                            return;
+                        np[i.order_item_id] = (np[i.order_item_id] ?? 0) + i.crates;
+                    });
+                    return np;
+                });
+            }
+            return carts.filter((x) => x.id !== cartId);
+        });
+    };
+    const cartCapacity = (cart) => cart.items.length === 0
+        ? 0
+        : Math.max(...cart.items.map((i) => i.crates_per_layer * i.layers_per_cart));
+    const cartUsed = (cart) => cart.items.reduce((s, i) => s + i.crates, 0);
+    const totalRemainingInPool = Object.values(pool).reduce((s, n) => s + n, 0);
+    const handleSave = async () => {
+        if (totalRemainingInPool > 0) {
+            toast.error(`Nog ${totalRemainingInPool} fust niet ingedeeld — verdeel alles over een kar voordat je opslaat`);
+            return;
+        }
+        if (manual.some((c) => c.items.length === 0)) {
+            toast.error("Lege karren niet toegestaan");
+            return;
+        }
+        const overfull = manual.find((c) => cartUsed(c) > cartCapacity(c));
+        if (overfull) {
+            toast.error("Een kar overschrijdt de capaciteit");
+            return;
+        }
+        try {
+            await fetchSave({
+                data: {
+                    orderId: orderId,
+                    carts: manual.map((c) => ({
+                        is_complete: cartUsed(c) >= cartCapacity(c),
+                        items: c.items.map((i) => ({
+                            order_item_id: i.order_item_id,
+                            product_id: i.product_id,
+                            product_name: i.product_name,
+                            crates: Math.max(1, Math.trunc(i.crates)),
+                            plants_per_crate: Math.max(1, Math.trunc(i.plants_per_crate || 1)),
+                            crates_per_layer: Math.max(1, Math.trunc(i.crates_per_layer || 1)),
+                        })),
+                    })),
+                },
+            });
+            toast.success("Karindeling opgeslagen");
+            onClose();
+        }
+        catch (e) {
+            let msg = "Opslaan mislukt";
+            if (e instanceof Response) {
+                try {
+                    msg = (await e.text()) || `HTTP ${e.status}`;
+                }
+                catch {
+                    msg = `HTTP ${e.status}`;
+                }
+                if (e.status === 401)
+                    msg = "Sessie verlopen — log opnieuw in";
+            }
+            else if (e?.message) {
+                msg = e.message;
+            }
+            toast.error(msg);
+            console.error("saveManualCarts failed:", e);
+        }
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: (o) => { if (!o)
+            onClose(); }, children: _jsxs(DialogContent, { className: "max-w-[95vw] w-[95vw] h-[92vh] max-h-[92vh] overflow-y-auto p-6", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Karindeling" }) }), isLoading ? (_jsx("div", { className: "text-muted-foreground", children: "Karren worden berekend..." })) : (_jsxs("div", { className: "space-y-6", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: "Automatisch ingedeelde karren" }), _jsxs(Badge, { variant: "secondary", children: [autoCarts.length, " kar(ren)"] })] }), _jsx(CardContent, { children: autoCarts.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen volledige karren mogelijk." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Kar #" }), _jsx(TableHead, { children: "Artikel" }), _jsx(TableHead, { className: "text-right", children: "Fusten" }), _jsx(TableHead, { className: "text-right", children: "Planten" }), _jsx(TableHead, { className: "text-right", children: "Bezetting" }), _jsx(TableHead, { children: "Status" })] }) }), _jsx(TableBody, { children: autoCarts.map((c) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-mono", children: c.cart_number }), _jsx(TableCell, { children: c.product_name }), _jsx(TableCell, { className: "text-right", children: c.crates }), _jsx(TableCell, { className: "text-right", children: c.plants }), _jsx(TableCell, { className: "text-right", children: "100%" }), _jsx(TableCell, { children: _jsxs(Badge, { className: "gap-1", children: [_jsx(CheckCircle2, { className: "h-3 w-3" }), " Volledig"] }) })] }, c.cart_number))) })] })) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Handmatig in te delen fusten" }) }), _jsx(CardContent, { className: "space-y-3", children: remainders.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen restant \u2014 alles past volledig op karren." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Artikel" }), _jsx(TableHead, { className: "text-right", children: "Beschikbaar (fusten)" }), _jsx(TableHead, { className: "text-right", children: "Planten/fust" }), _jsx(TableHead, { className: "text-right", children: "Capaciteit/kar" })] }) }), _jsx(TableBody, { children: remainders.map((r) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: r.product_name }), _jsxs(TableCell, { className: "text-right font-mono", children: [pool[r.order_item_id] ?? 0, " / ", r.crates_remaining] }), _jsx(TableCell, { className: "text-right", children: r.plants_per_crate }), _jsx(TableCell, { className: "text-right", children: r.crates_per_layer * r.layers_per_cart })] }, r.order_item_id))) })] })) })] }), remainders.length > 0 && (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: "Restant-karren samenstellen" }), _jsxs(Button, { size: "sm", onClick: addCart, children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Kar toevoegen"] })] }), _jsxs(CardContent, { className: "space-y-3", children: [manual.length === 0 && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Voeg een kar toe om restant-fusten in te delen." })), manual.map((cart, idx) => {
+                                            const used = cartUsed(cart);
+                                            const cap = cartCapacity(cart);
+                                            const pct = cap > 0 ? Math.round((used / cap) * 100) : 0;
+                                            const over = cap > 0 && used > cap;
+                                            return (_jsxs(Card, { className: over ? "border-destructive" : "", children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between py-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("span", { className: "font-medium", children: ["Restant-kar ", idx + 1] }), _jsxs(Badge, { variant: over ? "destructive" : "secondary", children: [used, " / ", cap || "?", " fusten (", pct, "%)"] }), over && (_jsxs("span", { className: "text-xs text-destructive flex items-center gap-1", children: [_jsx(AlertTriangle, { className: "h-3 w-3" }), " Capaciteit overschreden"] }))] }), _jsx(Button, { variant: "ghost", size: "icon", onClick: () => removeCart(cart.id), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }), _jsxs(CardContent, { className: "space-y-2", children: [cart.items.map((i) => (_jsxs("div", { className: "flex items-center justify-between text-sm", children: [_jsxs("div", { children: [_jsx("span", { className: "font-medium", children: i.product_name }), _jsxs("span", { className: "text-muted-foreground", children: [" \u00B7 ", i.crates, " fust (", i.crates * i.plants_per_crate, " planten)"] })] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => removeItem(cart.id, i.order_item_id), children: _jsx(Trash2, { className: "h-3 w-3" }) })] }, i.order_item_id))), _jsx(AddItemRow, { remainders: remainders, pool: pool, onAdd: (itemId, crates) => addItemToCart(cart.id, itemId, crates) })] })] }, cart.id));
+                                        })] })] }))] })), _jsxs(DialogFooter, { className: "gap-2", children: [_jsx(Button, { variant: "outline", onClick: onClose, children: "Annuleren" }), _jsxs(Button, { onClick: handleSave, disabled: isLoading || totalRemainingInPool > 0, children: ["Karindeling opslaan", totalRemainingInPool > 0 && (_jsxs(Badge, { variant: "destructive", className: "ml-2", children: ["Nog ", totalRemainingInPool, " fust in te delen"] }))] })] })] }) }));
+}
+function AddItemRow({ remainders, pool, onAdd, }) {
+    const available = remainders.filter((r) => (pool[r.order_item_id] ?? 0) > 0);
+    const [sel, setSel] = useState("");
+    const [qty, setQty] = useState(1);
+    if (available.length === 0)
+        return null;
+    return (_jsxs("div", { className: "flex items-end gap-2 pt-2 border-t", children: [_jsxs("div", { className: "flex-1", children: [_jsx(Label, { className: "text-xs", children: "Artikel" }), _jsxs(Select, { value: sel, onValueChange: setSel, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies restant-artikel..." }) }), _jsx(SelectContent, { children: available.map((r) => (_jsxs(SelectItem, { value: r.order_item_id, children: [r.product_name, " (", pool[r.order_item_id], " fust beschikbaar)"] }, r.order_item_id))) })] })] }), _jsxs("div", { className: "w-24", children: [_jsx(Label, { className: "text-xs", children: "Fusten" }), _jsx(Input, { type: "number", min: 1, value: qty, onChange: (e) => setQty(Math.max(1, Number(e.target.value) || 1)) })] }), _jsxs(Button, { size: "sm", disabled: !sel, onClick: () => { if (sel) {
+                    onAdd(sel, qty);
+                    setSel("");
+                    setQty(1);
+                } }, children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Toevoegen"] })] }));
+}

package/dist-lib/components/verkoop/CreateOrderPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CreateOrderPage.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/CreateOrderPage.tsx"],"names":[],"mappings":"AA4CA,wBAAgB,eAAe,4CAib9B"}
+{"version":3,"file":"CreateOrderPage.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/CreateOrderPage.tsx"],"names":[],"mappings":"AA6CA,wBAAgB,eAAe,4CA+b9B"}

package/dist-lib/components/verkoop/CreateOrderPage.js

@@ -11,6 +11,7 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { ArrowLeft, Plus, Trash2 } from "lucide-react";
 import { useServerFn } from "@tanstack/react-start";
 import { SearchableSelect } from "./SearchableSelect";
+import { CartAssignmentWizard } from "./CartAssignmentWizard";
 import { listCustomersForCreateOrder, listProductsForCreateOrder, listDeliveryLocationsForCustomerCO, listPickupLocationsCO, listCarriersForCreateOrder, getOrderPickDaysCO, createManualOrder, } from "../../lib/create-order.functions";
 function ReadOnlyField({ label, value }) {
     return (_jsxs("div", { className: "space-y-0.5", children: [_jsx("div", { className: "text-[11px] uppercase tracking-wide text-muted-foreground", children: label }), _jsx("div", { className: "text-sm", children: value && String(value).trim() !== "" ? value : _jsx("span", { className: "text-muted-foreground", children: "\u2014" }) })] }));
@@ -60,6 +61,7 @@ export function CreateOrderPage() {
     const [lines, setLines] = useState([
         { product_id: null, product_name: "", quantity: null, unit: "stuks", unit_price: null },
     ]);
+    const [cartOrderId, setCartOrderId] = useState(null);
     // Afleverlocaties van gekozen klant
     const deliveryLocQ = useQuery({
         queryKey: ["co-delivery-locations", customerId],
@@ -167,10 +169,15 @@ export function CreateOrderPage() {
             };
             return await fetchCreate({ data: payload });
         },
-        onSuccess: () => {
-            toast.success("Bestelling aangemaakt");
+        onSuccess: (res) => {
+            toast.success("Bestelling aangemaakt — deel nu de karren in");
             qc.invalidateQueries({ queryKey: ["floriday", "salesorders-cache"] });
-            navigate({ to: "/floriday-verkoop/verkooporders" });
+            if (res?.orderId) {
+                setCartOrderId(res.orderId);
+            }
+            else {
+                navigate({ to: "/floriday-verkoop/verkooporders" });
+            }
         },
         onError: (e) => toast.error(e?.message ?? "Aanmaken mislukt"),
     });
@@ -242,5 +249,8 @@ export function CreateOrderPage() {
                                                         next[idx] = { ...next[idx], unit_price: v };
                                                         setLines(next);
                                                     }, placeholder: "\u20AC prijs" }), _jsx(Button, { variant: "ghost", size: "icon", className: "col-span-1", onClick: () => setLines(lines.filter((_, i) => i !== idx)), "aria-label": "Regel verwijderen", children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, idx));
-                                    }), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => setLines([...lines, { product_id: null, product_name: "", quantity: null, unit: "stuks", unit_price: null }]), children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Regel toevoegen"] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { children: "Opmerkingen" }), _jsx(Textarea, { value: notes, onChange: (e) => setNotes(e.target.value), placeholder: "Optionele notities bij deze bestelling", rows: 3 })] }), _jsxs("div", { className: "flex items-center justify-end gap-2 pt-2", children: [_jsx(Button, { variant: "outline", onClick: () => navigate({ to: "/floriday-verkoop/verkooporders" }), disabled: createMut.isPending, children: "Annuleren" }), _jsx(Button, { onClick: () => createMut.mutate(), disabled: createMut.isPending, children: createMut.isPending ? "Bezig..." : "Bestelling Aanmaken" })] })] })] })] }));
+                                    }), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => setLines([...lines, { product_id: null, product_name: "", quantity: null, unit: "stuks", unit_price: null }]), children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Regel toevoegen"] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { children: "Opmerkingen" }), _jsx(Textarea, { value: notes, onChange: (e) => setNotes(e.target.value), placeholder: "Optionele notities bij deze bestelling", rows: 3 })] }), _jsxs("div", { className: "flex items-center justify-end gap-2 pt-2", children: [_jsx(Button, { variant: "outline", onClick: () => navigate({ to: "/floriday-verkoop/verkooporders" }), disabled: createMut.isPending, children: "Annuleren" }), _jsx(Button, { onClick: () => createMut.mutate(), disabled: createMut.isPending, children: createMut.isPending ? "Bezig..." : "Bestelling Aanmaken" })] })] })] }), _jsx(CartAssignmentWizard, { orderId: cartOrderId, open: !!cartOrderId, onClose: () => {
+                    setCartOrderId(null);
+                    navigate({ to: "/floriday-verkoop/verkooporders" });
+                } })] }));
 }

package/dist-lib/components/verkoop/OrderAfleverbrievenCard.d.ts

@@ -0,0 +1,4 @@
+export declare function OrderAfleverbrievenCard({ salesOrderId }: {
+    salesOrderId: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OrderAfleverbrievenCard.d.ts.map

package/dist-lib/components/verkoop/OrderAfleverbrievenCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderAfleverbrievenCard.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/OrderAfleverbrievenCard.tsx"],"names":[],"mappings":"AA+BA,wBAAgB,uBAAuB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,2CA4FjF"}

package/dist-lib/components/verkoop/OrderAfleverbrievenCard.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { useServerFn } from "@tanstack/react-start";
+import { Badge, Button, Card, CardContent, CardHeader, CardTitle } from "@flowselections/core";
+import { FileText, Printer, ExternalLink, RefreshCw } from "lucide-react";
+import { listLogisticLabelsForOrder } from "../../lib/floriday-logistic-labels.functions";
+const LC_SHORT = {
+    DANISH_TROLLEY: "DC",
+    DANISH_CONTAINER: "DC",
+    CC_CONTAINER: "CC",
+    CC_TROLLEY: "CC",
+    EURO_PALLET: "EP",
+    BLOCK_PALLET: "BP",
+    BOX: "BX",
+};
+function printPdf(url) {
+    const w = window.open(url, "_blank");
+    if (!w)
+        return;
+    // Kick off print dialog once loaded (browsers may block cross-origin, then user prints from tab)
+    const timer = setTimeout(() => {
+        try {
+            w.focus();
+            w.print();
+        }
+        catch {
+            /* ignore */
+        }
+    }, 1200);
+    w.addEventListener?.("beforeunload", () => clearTimeout(timer));
+}
+export function OrderAfleverbrievenCard({ salesOrderId }) {
+    const fetchLabels = useServerFn(listLogisticLabelsForOrder);
+    const { data, isLoading, error, refetch, isFetching } = useQuery({
+        queryKey: ["floriday-logistic-labels", salesOrderId],
+        queryFn: () => fetchLabels({ data: { salesOrderId } }),
+        staleTime: 60000,
+    });
+    const labels = data?.labels ?? [];
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: "Afleverbrieven" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Badge, { variant: "secondary", children: [labels.length, " brief(en)"] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => refetch(), disabled: isFetching, title: "Opnieuw ophalen bij Floriday", children: _jsx(RefreshCw, { className: `h-4 w-4 ${isFetching ? "animate-spin" : ""}` }) })] })] }), _jsxs(CardContent, { children: [isLoading && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Afleverbrieven ophalen\u2026" })), error && (_jsx("p", { className: "text-sm text-destructive", children: error.message })), !isLoading && !error && labels.length === 0 && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen afleverbrief beschikbaar (order nog niet vrijgegeven door Floriday)." })), labels.length > 0 && (_jsx("div", { className: "divide-y divide-border rounded-md border border-border", children: labels.map((l) => {
+                            const lcShort = l.loadCarrierType ? LC_SHORT[l.loadCarrierType] ?? l.loadCarrierType.slice(0, 2) : "";
+                            return (_jsxs("div", { className: "flex items-center justify-between gap-4 px-3 py-2 text-sm", children: [_jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [_jsx(FileText, { className: "h-4 w-4 shrink-0 text-muted-foreground" }), _jsxs("div", { className: "min-w-0", children: [_jsxs("div", { className: "font-mono font-medium", children: [l.code, l.letter ? _jsxs("span", { className: "ml-1 text-primary", children: ["\u00B7", l.letter] }) : null] }), _jsxs("div", { className: "text-xs text-muted-foreground", children: ["Kar ", l.loadCarrierIndex, lcShort ? ` · ${lcShort}` : "", l.packages ? ` · ${l.packages} fusten` : ""] })] })] }), _jsx("div", { className: "flex items-center gap-2", children: l.hasPdf && l.signedUrl ? (_jsxs(_Fragment, { children: [_jsx(Button, { asChild: true, variant: "outline", size: "sm", children: _jsxs("a", { href: l.signedUrl, target: "_blank", rel: "noreferrer", children: [_jsx(ExternalLink, { className: "mr-1 h-3.5 w-3.5" }), "Openen"] }) }), _jsxs(Button, { variant: "default", size: "sm", onClick: () => printPdf(l.signedUrl), children: [_jsx(Printer, { className: "mr-1 h-3.5 w-3.5" }), "Printen"] })] })) : (_jsx("span", { className: "text-xs text-muted-foreground", children: "PDF nog niet vrijgegeven" })) })] }, `${l.fulfillmentOrderId}-${l.code}-${l.letter ?? ""}`));
+                        }) }))] })] }));
+}

package/dist-lib/components/verkoop/OrderKarindelingCard.d.ts

@@ -0,0 +1,5 @@
+import type { SalesOrderDTO } from "../../lib/salesorders-mapping";
+export declare function OrderKarindelingCard({ order }: {
+    order: SalesOrderDTO;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OrderKarindelingCard.d.ts.map

package/dist-lib/components/verkoop/OrderKarindelingCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderKarindelingCard.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/OrderKarindelingCard.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AA6F/D,wBAAgB,oBAAoB,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,aAAa,CAAA;CAAE,2CA+KvE"}

package/dist-lib/components/verkoop/OrderKarindelingCard.js

@@ -0,0 +1,160 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Toont karindeling per order. De belading (planten×fusten×lagen) komt
+// ALTIJD uit de producten in Voorraad (tabel `products`) — nooit uit de
+// Floriday-packingConfiguration — zodat verkoop en voorraad synchroon zijn.
+// Alleen wanneer de order geen `product_id`-koppeling heeft, valt de kaart
+// terug op de Floriday packingConfiguration.
+import { useEffect, useMemo, useState } from "react";
+import { Badge, Card, CardContent, CardHeader, CardTitle, Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@flowselections/core";
+import { CheckCircle2, Lock } from "lucide-react";
+import { supabase } from "../../integrations/supabase/client";
+import { planCarts } from "../../lib/cart-planner";
+function deriveCartsFromFloriday(order) {
+    const o = order.raw.order ?? {};
+    const pack = o?.packingConfiguration ?? {};
+    const ppc = Math.max(1, Number(pack.piecesPerPackage ?? order.quantity.count ?? 1));
+    const cpl = Math.max(1, Number(pack.packagesPerLayer ?? 1));
+    const lpc = Math.max(1, Number(pack.layersPerLoadCarrier ?? 1));
+    const totalPieces = Math.max(0, Number(o.numberOfPieces ?? order.totalPieces ?? 0));
+    if (totalPieces <= 0)
+        return [];
+    const totalCrates = Math.ceil(totalPieces / ppc);
+    const cratesPerCart = cpl * lpc;
+    const fullCarts = Math.floor(totalCrates / cratesPerCart);
+    const remainderCrates = totalCrates - fullCarts * cratesPerCart;
+    const carts = [];
+    let n = 1;
+    for (let i = 0; i < fullCarts; i++) {
+        carts.push({
+            cart_number: n++,
+            is_complete: true,
+            occupancy_pct: 100,
+            total_layers_used: lpc,
+            items: [{
+                    product_name: order.productName,
+                    crates: cratesPerCart,
+                    plants: cratesPerCart * ppc,
+                    plants_per_crate: ppc,
+                    crates_per_layer: cpl,
+                    layers_per_cart: lpc,
+                    layer_share_pct: 100,
+                }],
+        });
+    }
+    if (remainderCrates > 0) {
+        const layersUsed = Math.ceil(remainderCrates / cpl);
+        const occ = Math.round(((layersUsed / lpc) * 100) * 100) / 100;
+        carts.push({
+            cart_number: n,
+            is_complete: false,
+            occupancy_pct: occ,
+            total_layers_used: layersUsed,
+            items: [{
+                    product_name: order.productName,
+                    crates: remainderCrates,
+                    plants: remainderCrates * ppc,
+                    plants_per_crate: ppc,
+                    crates_per_layer: cpl,
+                    layers_per_cart: lpc,
+                    layer_share_pct: occ,
+                }],
+        });
+    }
+    return carts;
+}
+function belading(i) {
+    return `${i.plants_per_crate}×${i.crates_per_layer}×${i.layers_per_cart}`;
+}
+export function OrderKarindelingCard({ order }) {
+    // Lokale/mailbox-orders hebben een prefix (`local:`, `mailbox-proposal:`) in
+    // hun DTO-id. De DB-tabellen (`orders`, `order_items`) gebruiken de kale UUID,
+    // dus die prefix moet eraf voor de query — anders faalt de UUID-cast en valt
+    // de kaart terug op de Floriday-modus met slechts één artikel.
+    const rawId = order?.id ?? order.raw?.order?.id ?? null;
+    const orderId = typeof rawId === "string" ? rawId.replace(/^(local:|mailbox-proposal:)/, "") : rawId;
+    const [lockedAt, setLockedAt] = useState(null);
+    const [dbItems, setDbItems] = useState(null);
+    // Laadt order_items + gekoppelde products (voorraad-belading) en
+    // ververst live bij mutaties op order_items, orders of products.
+    useEffect(() => {
+        if (!orderId)
+            return;
+        let active = true;
+        const load = async () => {
+            const [{ data: itemRows }, { data: orderRow }] = await Promise.all([
+                supabase
+                    .from("order_items")
+                    .select("id, product_id, product_name, quantity, products(plants_per_crate, crates_per_layer, layers_per_cart)")
+                    .eq("order_id", orderId),
+                supabase.from("orders").select("plan_locked_at").eq("id", orderId).maybeSingle(),
+            ]);
+            if (!active)
+                return;
+            setDbItems(itemRows ?? []);
+            setLockedAt(orderRow?.plan_locked_at ?? null);
+        };
+        void load();
+        const channel = supabase
+            .channel(`order-karindeling-${orderId}`)
+            .on("postgres_changes", { event: "UPDATE", schema: "public", table: "orders", filter: `id=eq.${orderId}` }, (payload) => setLockedAt(payload.new?.plan_locked_at ?? null))
+            .on("postgres_changes", { event: "*", schema: "public", table: "order_items", filter: `order_id=eq.${orderId}` }, () => void load())
+            .on("postgres_changes", { event: "UPDATE", schema: "public", table: "products" }, () => void load())
+            .subscribe();
+        return () => {
+            active = false;
+            void supabase.removeChannel(channel);
+        };
+    }, [orderId]);
+    // Bouw plannerinput uit voorraad-belading. Alleen items met een gekoppeld
+    // product (product_id + belading in products-tabel) worden meegenomen.
+    const plannerCarts = useMemo(() => {
+        if (!dbItems || dbItems.length === 0)
+            return null;
+        const inputs = [];
+        for (const it of dbItems) {
+            const p = it.products;
+            if (!it.product_id || !p)
+                continue;
+            const ppc = Math.max(1, Number(p.plants_per_crate ?? 0));
+            const cpl = Math.max(1, Number(p.crates_per_layer ?? 0));
+            const lpc = Math.max(1, Number(p.layers_per_cart ?? 0));
+            const plants = Math.max(0, Number(it.quantity ?? 0));
+            if (plants <= 0)
+                continue;
+            inputs.push({
+                order_item_id: it.id,
+                product_id: it.product_id,
+                product_name: it.product_name,
+                plants,
+                plants_per_crate: ppc,
+                crates_per_layer: cpl,
+                layers_per_cart: lpc,
+            });
+        }
+        if (inputs.length === 0)
+            return null;
+        return planCarts(inputs).carts;
+    }, [dbItems]);
+    const floridayCarts = useMemo(() => deriveCartsFromFloriday(order), [order]);
+    const usingVoorraad = plannerCarts !== null;
+    const carts = usingVoorraad
+        ? plannerCarts.map((c) => ({
+            cart_number: c.cart_number,
+            is_complete: c.is_complete,
+            occupancy_pct: c.occupancy_pct,
+            total_layers_used: c.total_layers_used,
+            items: c.items.map((i) => ({
+                product_name: i.product_name,
+                crates: i.crates,
+                plants: i.plants,
+                plants_per_crate: i.plants_per_crate,
+                crates_per_layer: i.crates_per_layer,
+                layers_per_cart: i.layers_per_cart,
+                layer_share_pct: i.layer_share_pct,
+            })),
+        }))
+        : floridayCarts;
+    const source = usingVoorraad ? "voorraad" : "floriday";
+    const lockedDate = lockedAt ? new Date(lockedAt).toLocaleString("nl-NL") : null;
+    return (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: "Karindeling" }), _jsxs("div", { className: "flex items-center gap-2", children: [lockedAt && (_jsxs(Badge, { variant: "outline", className: "gap-1", children: [_jsx(Lock, { className: "h-3 w-3" }), "Vergrendeld \u2014 pakbon geprint ", lockedDate] })), _jsxs(Badge, { variant: "secondary", children: [carts.length, " kar(ren) \u00B7 bron: ", source === "voorraad" ? "Voorraad" : "Floriday"] })] })] }), _jsx(CardContent, { children: carts.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen karindeling beschikbaar voor deze order." })) : (_jsx("div", { className: "space-y-4", children: carts.map((c) => (_jsxs("div", { className: "rounded-md border border-border", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-border bg-muted/30 px-3 py-2 text-sm", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("span", { className: "font-mono font-medium", children: ["Kar ", c.cart_number] }), _jsxs(Badge, { variant: c.is_complete ? "default" : "secondary", className: "gap-1", children: [c.is_complete && _jsx(CheckCircle2, { className: "h-3 w-3" }), c.is_complete ? "Volledig" : "Deels"] })] }), _jsxs("div", { className: "text-muted-foreground", children: [c.total_layers_used, " lagen \u00B7 benutting ", c.occupancy_pct, "%"] })] }), _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Artikel" }), _jsx(TableHead, { className: "text-right", children: "Planten" }), _jsx(TableHead, { className: "text-right", children: "Fusten" }), _jsx(TableHead, { children: "Belading" }), _jsx(TableHead, { className: "text-right", children: "Laag-aandeel" })] }) }), _jsx(TableBody, { children: c.items.map((i, idx) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: i.product_name }), _jsx(TableCell, { className: "text-right", children: i.plants }), _jsx(TableCell, { className: "text-right", children: i.crates }), _jsx(TableCell, { className: "font-mono text-xs", children: belading(i) }), _jsxs(TableCell, { className: "text-right", children: [Math.round(i.layer_share_pct * 10) / 10, "%"] })] }, idx))) })] })] }, c.cart_number))) })) })] }));
+}

package/dist-lib/components/verkoop/SalesOrderDetailView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SalesOrderDetailView.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/SalesOrderDetailView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AA4HnE,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,cAAc,GACf,EAAE;IACD,KAAK,EAAE,aAAa,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAChC,2CAoRA"}
+{"version":3,"file":"SalesOrderDetailView.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/SalesOrderDetailView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AA+HnE,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,cAAc,GACf,EAAE;IACD,KAAK,EAAE,aAAa,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAChC,2CA8RA"}