@flowselections/floriday-verkoop-module 1.0.11 → 1.0.13

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

@@ -1,218 +1,256 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo, useState } from "react";
-import { Badge, Button, Input, Label, Popover, PopoverContent, PopoverTrigger, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, toast, } from "@flowselections/core";
+// Handmatig aanmaken van een bestelling — gebruikt exact dezelfde workflow,
+// server-fns en validaties als de Mailbox-module. Beide modules leunen op
+// gedeelde queries (klanten, producten met voorraad, afleverlocaties,
+// afhaallocaties, vervoerders, orderpicktijd) en dezelfde eerstmogelijke-
+// leverdatum-berekening. Zie src/lib/create-order.functions.ts.
+import { useEffect, useMemo, useRef, useState } from "react";
+import { Button, Card, CardContent, CardHeader, CardTitle, Input, Label, Textarea, toast, } from "@flowselections/core";
 import { Link, useNavigate } from "@tanstack/react-router";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { ArrowLeft, ChevronDown, Plus, Search, Trash2, Truck, MapPin, } from "lucide-react";
-import { supabase } from "../../integrations/supabase/client";
+import { ArrowLeft, Plus, Trash2 } from "lucide-react";
 import { useServerFn } from "@tanstack/react-start";
-import { getFlorydayCachedList } from "../../lib/floriday-public.functions";
-const eur = new Intl.NumberFormat("nl-NL", {
-    style: "currency",
-    currency: "EUR",
-});
-function pickStr(v) {
-    if (v == null)
-        return null;
-    if (typeof v === "string")
-        return v;
-    if (typeof v === "number")
-        return String(v);
-    if (Array.isArray(v)) {
-        for (const x of v) {
-            const s = pickStr(x?.text ?? x?.value ?? x);
-            if (s)
-                return s;
-        }
-        return null;
-    }
-    if (typeof v === "object") {
-        return (v.nl ?? v.NL ?? v.en ?? v.EN ?? v.text ?? v.value ??
-            Object.values(v).find((x) => typeof x === "string") ??
-            null);
-    }
-    return null;
+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" }) })] }));
 }
-function useCustomersForOrder() {
-    return useQuery({
-        queryKey: ["create-order", "customers"],
-        queryFn: async () => {
-            const { data, error } = await supabase
-                .from("customers")
-                .select("id, company_name, city, is_active")
-                .or("is_active.is.null,is_active.eq.true")
-                .order("company_name", { ascending: true })
-                .limit(2000);
-            if (error)
-                throw error;
-            return (data ?? []);
-        },
-        staleTime: 60000,
+export function CreateOrderPage() {
+    const navigate = useNavigate();
+    const qc = useQueryClient();
+    const fetchCustomers = useServerFn(listCustomersForCreateOrder);
+    const fetchProducts = useServerFn(listProductsForCreateOrder);
+    const fetchDeliveryLocations = useServerFn(listDeliveryLocationsForCustomerCO);
+    const fetchPickupLocations = useServerFn(listPickupLocationsCO);
+    const fetchCarriers = useServerFn(listCarriersForCreateOrder);
+    const fetchPickDays = useServerFn(getOrderPickDaysCO);
+    const fetchCreate = useServerFn(createManualOrder);
+    const safe = async (fn) => {
+        try {
+            return await fn();
+        }
+        catch {
+            return { items: [] };
+        }
+    };
+    const customersQ = useQuery({ queryKey: ["co-customers"], queryFn: () => safe(() => fetchCustomers()) });
+    const productsQ = useQuery({ queryKey: ["co-products"], queryFn: () => safe(() => fetchProducts()) });
+    const pickupQ = useQuery({ queryKey: ["co-pickup"], queryFn: () => safe(() => fetchPickupLocations()) });
+    const carriersQ = useQuery({ queryKey: ["co-carriers"], queryFn: () => safe(() => fetchCarriers()) });
+    const pickDaysQ = useQuery({
+        queryKey: ["co-pickdays"],
+        queryFn: async () => { try {
+            return await fetchPickDays();
+        }
+        catch {
+            return { pickDays: 0 };
+        } },
     });
-}
-function useProductsForOrder() {
-    const fetchCachedList = useServerFn(getFlorydayCachedList);
-    return useQuery({
-        queryKey: ["create-order", "products"],
+    const customers = customersQ.data?.items ?? [];
+    const products = productsQ.data?.items ?? [];
+    const pickupLocations = pickupQ.data?.items ?? [];
+    const carriers = carriersQ.data?.items ?? [];
+    const pickDays = Math.max(0, Number(pickDaysQ.data?.pickDays ?? 0));
+    const [customerId, setCustomerId] = useState(null);
+    const [deliveryLocationId, setDeliveryLocationId] = useState(null);
+    const [pickupLocationId, setPickupLocationId] = useState(null);
+    const [carrierId, setCarrierId] = useState(null);
+    const [deliveryDate, setDeliveryDate] = useState("");
+    const [notes, setNotes] = useState("");
+    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],
+        enabled: !!customerId,
         queryFn: async () => {
-            const [localRes, floridayList] = await Promise.all([
-                supabase
-                    .from("products")
-                    .select("id, product, sale_price, unit")
-                    .order("product", { ascending: true })
-                    .limit(2000),
-                fetchCachedList({ data: { environment: "staging", entity: "trade-items", limit: 5000 } }),
-            ]);
-            if (localRes.error)
-                throw localRes.error;
-            const out = [];
-            for (const r of localRes.data ?? []) {
-                out.push({
-                    id: `local:${r.id}`,
-                    name: r.product ?? "Onbekend product",
-                    source: "local",
-                    price: r.sale_price != null ? Number(r.sale_price) : null,
-                    unit: r.unit ?? null,
-                });
+            try {
+                return await fetchDeliveryLocations({ data: { customerId: customerId } });
             }
-            for (const r of floridayList.rows ?? []) {
-                const d = r.data ?? {};
-                const name = pickStr(d.name) ??
-                    pickStr(d.productName) ??
-                    pickStr(d.tradeItemName) ??
-                    pickStr(d.tradeItemTexts) ??
-                    "Onbekend artikel";
-                out.push({
-                    id: `floriday:${r.floriday_id}`,
-                    name,
-                    source: "floriday",
-                    price: null,
-                });
+            catch {
+                return { items: [] };
             }
-            return out;
         },
-        staleTime: 60000,
     });
-}
-export function CreateOrderPage() {
-    const navigate = useNavigate();
-    const queryClient = useQueryClient();
-    const customersQ = useCustomersForOrder();
-    const productsQ = useProductsForOrder();
-    const [customerId, setCustomerId] = useState("");
-    const [deliveryDate, setDeliveryDate] = useState("");
-    const [carrier, setCarrier] = useState("");
-    const [country, setCountry] = useState("");
-    const [productPickerOpen, setProductPickerOpen] = useState(false);
-    const [productQuery, setProductQuery] = useState("");
-    const [selectedProduct, setSelectedProduct] = useState(null);
-    const [quantity, setQuantity] = useState("");
-    const [unitPrice, setUnitPrice] = useState("");
-    const [lines, setLines] = useState([]);
-    const filteredProducts = useMemo(() => {
-        const list = productsQ.data ?? [];
-        const q = productQuery.trim().toLowerCase();
-        const base = q
-            ? list.filter((p) => p.name.toLowerCase().includes(q))
-            : list;
-        return base.slice(0, 100);
-    }, [productsQ.data, productQuery]);
-    const total = lines.reduce((s, l) => s + l.quantity * l.unitPrice, 0);
-    const addLine = () => {
-        if (!selectedProduct)
-            return;
-        const qty = Number(quantity);
-        const price = Number(unitPrice);
-        if (!Number.isFinite(qty) || qty <= 0) {
-            toast.error("Vul een geldig aantal in");
-            return;
+    const deliveryLocations = deliveryLocQ.data?.items ?? [];
+    const selectedLocation = deliveryLocations.find((l) => l.id === deliveryLocationId) ?? null;
+    // Reset delivery_location bij klantwissel
+    useEffect(() => {
+        if (deliveryLocationId && !deliveryLocations.some((l) => l.id === deliveryLocationId)) {
+            setDeliveryLocationId(null);
         }
-        if (!Number.isFinite(price) || price < 0) {
-            toast.error("Vul een geldige prijs in");
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [customerId, deliveryLocQ.data]);
+    // Auto-fill vervoerder op basis van gekozen afleverlocatie (één keer per wissel)
+    const lastLocRef = useRef(null);
+    useEffect(() => {
+        if (deliveryLocationId !== lastLocRef.current) {
+            lastLocRef.current = deliveryLocationId;
+            const loc = deliveryLocations.find((l) => l.id === deliveryLocationId);
+            if (loc?.carrier_id)
+                setCarrierId(loc.carrier_id);
+            else if (deliveryLocationId === null)
+                setCarrierId(null);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [deliveryLocationId, deliveryLocations.length]);
+    // Eerst mogelijke leverdatum
+    const selectedCarrier = carriers.find((c) => c.id === carrierId) ?? null;
+    const carrierDeliveryDays = Math.max(0, Number(selectedCarrier?.delivery_days ?? 0));
+    const canPickDate = !!customerId && !!deliveryLocationId && !!pickupLocationId && !!carrierId;
+    const fmtISO = (d) => `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
+    const earliestDate = useMemo(() => {
+        const base = new Date();
+        base.setHours(0, 0, 0, 0);
+        base.setDate(base.getDate() + pickDays + carrierDeliveryDays);
+        return base;
+    }, [pickDays, carrierDeliveryDays]);
+    const earliestISO = fmtISO(earliestDate);
+    const earliestLabel = earliestDate.toLocaleDateString("nl-NL", {
+        day: "numeric", month: "long", year: "numeric",
+    });
+    useEffect(() => {
+        if (!canPickDate)
             return;
+        if (!deliveryDate || deliveryDate < earliestISO) {
+            setDeliveryDate(earliestISO);
         }
-        setLines((prev) => [
-            ...prev,
-            {
-                key: `${selectedProduct.id}-${Date.now()}`,
-                product: selectedProduct,
-                quantity: qty,
-                unitPrice: price,
-            },
-        ]);
-        setSelectedProduct(null);
-        setQuantity("");
-        setUnitPrice("");
-        setProductQuery("");
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [canPickDate, earliestISO]);
+    const blockDecimal = (e) => {
+        if ([".", ",", "e", "E", "+", "-"].includes(e.key))
+            e.preventDefault();
     };
-    const removeLine = (key) => setLines((prev) => prev.filter((l) => l.key !== key));
-    const createMutation = useMutation({
+    const createMut = useMutation({
         mutationFn: async () => {
             if (!customerId)
                 throw new Error("Selecteer een klant");
+            if (!deliveryLocationId)
+                throw new Error("Selecteer een afleverlocatie");
+            if (!pickupLocationId)
+                throw new Error("Selecteer een afhaallocatie (tuin)");
+            if (!carrierId)
+                throw new Error("Selecteer een vervoerder");
             if (!deliveryDate)
                 throw new Error("Selecteer een leverdatum");
-            if (lines.length === 0)
+            const validLines = lines.filter((l) => l.product_id && (l.quantity ?? 0) > 0);
+            if (validLines.length === 0)
                 throw new Error("Voeg minimaal één product toe");
-            const customer = customersQ.data?.find((c) => c.id === customerId);
-            const orderNumber = `LOC-${new Date()
-                .toISOString()
-                .slice(0, 10)
-                .replace(/-/g, "")}-${Math.floor(Math.random() * 9000 + 1000)}`;
-            const { data: orderRow, error: orderErr } = await supabase
-                .from("orders")
-                .insert({
-                order_number: orderNumber,
-                customer_id: customerId,
-                customer_name: customer?.company_name ?? "Onbekende klant",
-                order_date: new Date().toISOString(),
-                delivery_date: deliveryDate,
-                status: "open",
-                total: String(total.toFixed(2)),
-                custom_fields: {
-                    source: "local",
-                    transporteur: carrier || null,
-                    land: country || null,
-                },
-            })
-                .select("id")
-                .single();
-            if (orderErr)
-                throw orderErr;
-            const itemsPayload = lines.map((l) => ({
-                order_id: orderRow.id,
-                product_id: l.product.source === "local"
-                    ? l.product.id.replace(/^local:/, "")
-                    : undefined,
-                product_name: l.product.name,
-                quantity: Math.round(l.quantity),
-                unit: l.product.unit ?? undefined,
-                unit_price: l.unitPrice,
-            }));
-            const { error: itemsErr } = await supabase
-                .from("order_items")
-                .insert(itemsPayload);
-            if (itemsErr)
-                throw itemsErr;
+            for (const l of validLines) {
+                const p = products.find((x) => x.id === l.product_id);
+                const ppc = Math.max(1, Number(p?.plants_per_crate ?? 1));
+                const q = l.quantity ?? 0;
+                if (q < ppc || q % ppc !== 0) {
+                    throw new Error(`"${p?.product ?? l.product_name}" moet per hele fust besteld worden (min. 1 fust = ${ppc} planten).`);
+                }
+            }
+            const customer = customers.find((c) => c.id === customerId);
+            const payload = {
+                customerId,
+                customerName: customer?.company_name ?? "Onbekende klant",
+                deliveryLocationId,
+                pickupLocationId,
+                carrierId,
+                deliveryDate,
+                notes: notes.trim() ? notes.trim() : null,
+                lines: validLines.map((l) => {
+                    const p = products.find((x) => x.id === l.product_id);
+                    return {
+                        product_id: l.product_id,
+                        product_name: p?.product ?? l.product_name ?? "Onbekend product",
+                        quantity: l.quantity,
+                        unit: l.unit ?? p?.unit ?? "stuks",
+                        unit_price: l.unit_price ?? undefined,
+                    };
+                }),
+            };
+            return await fetchCreate({ data: payload });
         },
-        onSuccess: () => {
-            toast.success("Bestelling aangemaakt");
-            queryClient.invalidateQueries({ queryKey: ["floriday", "salesorders-cache"] });
-            navigate({ to: "/floriday-verkoop/verkooporders" });
+        onSuccess: (res) => {
+            toast.success("Bestelling aangemaakt — deel nu de karren in");
+            qc.invalidateQueries({ queryKey: ["floriday", "salesorders-cache"] });
+            if (res?.orderId) {
+                setCartOrderId(res.orderId);
+            }
+            else {
+                navigate({ to: "/floriday-verkoop/verkooporders" });
+            }
         },
         onError: (e) => toast.error(e?.message ?? "Aanmaken mislukt"),
     });
-    return (_jsxs("main", { className: "space-y-5 p-6", children: [_jsx("div", { children: _jsx(Button, { asChild: true, variant: "ghost", size: "sm", children: _jsxs(Link, { to: "/floriday-verkoop/verkooporders", children: [_jsx(ArrowLeft, { className: "mr-2 h-4 w-4" }), "Terug naar verkooporders"] }) }) }), _jsxs("div", { className: "rounded-lg border border-border bg-card p-6", children: [_jsx("h1", { className: "text-xl font-semibold text-foreground", children: "Nieuwe Bestelling" }), _jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: "Maak een nieuwe bestelling aan door producten te zoeken en toe te voegen." }), _jsxs("div", { className: "mt-6 grid gap-5 md:grid-cols-2", children: [_jsxs("div", { className: "grid gap-1.5", children: [_jsxs(Label, { children: ["Klant ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsxs(Select, { value: customerId, onValueChange: setCustomerId, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Selecteer klant" }) }), _jsxs(SelectContent, { children: [(customersQ.data ?? []).map((c) => (_jsxs(SelectItem, { value: c.id, children: [c.company_name ?? "Onbekend", c.city ? ` — ${c.city}` : ""] }, c.id))), customersQ.data?.length === 0 && (_jsx("div", { className: "px-3 py-2 text-sm text-muted-foreground", children: "Geen klanten gevonden" }))] })] })] }), _jsxs("div", { className: "grid gap-1.5", children: [_jsxs(Label, { htmlFor: "delivery", children: ["Leverdatum ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(Input, { id: "delivery", type: "date", value: deliveryDate, onChange: (e) => setDeliveryDate(e.target.value) })] }), _jsxs("div", { className: "grid gap-1.5", children: [_jsx(Label, { htmlFor: "carrier", children: "Transporteur" }), _jsxs("div", { className: "relative", children: [_jsx(Truck, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { id: "carrier", className: "pl-9", placeholder: "Bv. DHL, PostNL", value: carrier, onChange: (e) => setCarrier(e.target.value) })] })] }), _jsxs("div", { className: "grid gap-1.5", children: [_jsx(Label, { htmlFor: "country", children: "Land" }), _jsxs("div", { className: "relative", children: [_jsx(MapPin, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { id: "country", className: "pl-9", placeholder: "Bv. Nederland", value: country, onChange: (e) => setCountry(e.target.value) })] })] })] }), _jsxs("div", { className: "mt-8", children: [_jsx(Label, { children: "Producten toevoegen" }), _jsxs("div", { className: "mt-2 flex flex-wrap items-stretch gap-2", children: [_jsx("div", { className: "min-w-[260px] flex-1", children: _jsxs(Popover, { open: productPickerOpen, onOpenChange: setProductPickerOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { type: "button", variant: "outline", className: "w-full justify-between font-normal", children: [_jsx("span", { className: selectedProduct ? "" : "text-muted-foreground", children: selectedProduct ? selectedProduct.name : "Zoek product..." }), _jsx(ChevronDown, { className: "h-4 w-4 opacity-50" })] }) }), _jsxs(PopoverContent, { align: "start", className: "w-[--radix-popover-trigger-width] p-0", children: [_jsxs("div", { className: "flex items-center gap-2 border-b border-border px-3 py-2", children: [_jsx(Search, { className: "h-4 w-4 text-muted-foreground" }), _jsx("input", { autoFocus: true, placeholder: "Zoek product...", value: productQuery, onChange: (e) => setProductQuery(e.target.value), className: "h-8 w-full bg-transparent text-sm outline-none placeholder:text-muted-foreground" })] }), _jsxs("div", { className: "max-h-72 overflow-y-auto py-1", children: [productsQ.isLoading && (_jsx("div", { className: "px-3 py-6 text-center text-sm text-muted-foreground", children: "Laden\u2026" })), !productsQ.isLoading && filteredProducts.length === 0 && (_jsx("div", { className: "px-3 py-6 text-center text-sm text-muted-foreground", children: "Geen producten gevonden." })), filteredProducts.map((p) => (_jsxs("button", { type: "button", onClick: () => {
-                                                                        setSelectedProduct(p);
-                                                                        if (p.price != null && unitPrice === "")
-                                                                            setUnitPrice(p.price);
-                                                                        if (quantity === "")
-                                                                            setQuantity(1);
-                                                                        setProductPickerOpen(false);
-                                                                    }, className: "flex w-full items-center justify-between gap-2 px-3 py-2 text-left text-sm hover:bg-accent", children: [_jsx("span", { className: "truncate", children: p.name }), _jsx(Badge, { variant: "outline", className: p.source === "local"
-                                                                                ? "border-primary/30 text-primary"
-                                                                                : "border-emerald-500/30 text-emerald-600", children: p.source === "local" ? "Lokaal" : "Floriday" })] }, p.id)))] })] })] }) }), _jsx(Input, { type: "number", min: 1, placeholder: "Aantal", className: "w-28", value: quantity, onChange: (e) => setQuantity(e.target.value === "" ? "" : Number(e.target.value)) }), _jsx(Input, { type: "number", min: 0, step: "0.01", placeholder: "\u20AC Prijs", className: "w-32", value: unitPrice, onChange: (e) => setUnitPrice(e.target.value === "" ? "" : Number(e.target.value)) }), _jsx(Button, { type: "button", onClick: addLine, disabled: !selectedProduct, "aria-label": "Toevoegen", children: _jsx(Plus, { className: "h-4 w-4" }) })] }), _jsx("div", { className: "mt-3 rounded-lg border border-dashed border-border bg-muted/30", children: lines.length === 0 ? (_jsx("div", { className: "px-4 py-10 text-center text-sm text-muted-foreground", children: "Voeg producten toe aan de bestelling" })) : (_jsxs("div", { className: "divide-y divide-border", children: [lines.map((l) => (_jsxs("div", { className: "flex items-center gap-3 px-4 py-3 text-sm", children: [_jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("div", { className: "truncate font-medium text-foreground", children: l.product.name }), _jsx("div", { className: "text-xs text-muted-foreground", children: l.product.source === "local" ? "Lokaal" : "Floriday" })] }), _jsxs("div", { className: "w-20 text-right", children: [l.quantity, " st."] }), _jsx("div", { className: "w-24 text-right", children: eur.format(l.unitPrice) }), _jsx("div", { className: "w-28 text-right font-medium", children: eur.format(l.quantity * l.unitPrice) }), _jsx(Button, { type: "button", variant: "ghost", size: "icon", onClick: () => removeLine(l.key), "aria-label": "Regel verwijderen", children: _jsx(Trash2, { className: "h-4 w-4 text-muted-foreground" }) })] }, l.key))), _jsxs("div", { className: "flex items-center justify-end gap-3 px-4 py-3 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Totaal" }), _jsx("span", { className: "text-base font-semibold text-foreground", children: eur.format(total) })] })] })) })] }), _jsxs("div", { className: "mt-8 flex items-center justify-end gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => navigate({ to: "/floriday-verkoop/verkooporders" }), disabled: createMutation.isPending, children: "Annuleren" }), _jsx(Button, { onClick: () => createMutation.mutate(), disabled: createMutation.isPending ||
-                                    !customerId ||
-                                    !deliveryDate ||
-                                    lines.length === 0, children: createMutation.isPending ? "Aanmaken…" : "Bestelling Aanmaken" })] })] })] }));
+    return (_jsxs("main", { className: "space-y-5 p-6", children: [_jsx("div", { children: _jsx(Button, { asChild: true, variant: "ghost", size: "sm", children: _jsxs(Link, { to: "/floriday-verkoop/verkooporders", children: [_jsx(ArrowLeft, { className: "mr-2 h-4 w-4" }), "Terug naar verkooporders"] }) }) }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Nieuwe Bestelling" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Doorloop de stappen: klant \u2192 afleverlocatie \u2192 afhaallocatie \u2192 vervoerder \u2192 leverdatum \u2192 producten." })] }), _jsxs(CardContent, { className: "space-y-5", children: [_jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { className: "flex items-center gap-2", children: ["Klant ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(SearchableSelect, { value: customerId, placeholder: customersQ.isLoading ? "Laden..." : "Kies klant...", options: customers.map((c) => ({ value: c.id, label: c.company_name ?? "Onbekend", hint: c.email ?? undefined })), onChange: (v) => { setCustomerId(v); setDeliveryLocationId(null); }, allowClear: false })] }), _jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { className: "flex items-center gap-2", children: ["Afleverlocatie ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(SearchableSelect, { value: deliveryLocationId, placeholder: !customerId ? "Selecteer eerst een klant"
+                                            : deliveryLocations.length ? "Kies locatie..."
+                                                : "Geen locaties bekend voor deze klant", disabled: !customerId || deliveryLocations.length === 0, allowClear: false, options: deliveryLocations.map((l) => {
+                                            const addr = [
+                                                l.address_line || [l.street, l.house_number].filter(Boolean).join(" "),
+                                                l.postal_code, l.city,
+                                            ].filter(Boolean).join(", ");
+                                            return {
+                                                value: l.id,
+                                                label: (l.name || addr || "Locatie") + (l.is_primary ? " ★" : ""),
+                                                hint: l.name && addr ? addr : undefined,
+                                            };
+                                        }), onChange: setDeliveryLocationId })] }), selectedLocation && (_jsxs("div", { className: "rounded-md border bg-muted/30 p-3 space-y-2", children: [_jsx("div", { className: "text-xs font-medium text-muted-foreground", children: "Adresgegevens" }), _jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsx(ReadOnlyField, { label: "Straat", value: selectedLocation.street }), _jsx(ReadOnlyField, { label: "Huisnummer", value: selectedLocation.house_number }), _jsx(ReadOnlyField, { label: "Postcode", value: selectedLocation.postal_code }), _jsx(ReadOnlyField, { label: "Plaats", value: selectedLocation.city }), _jsx(ReadOnlyField, { label: "Provincie", value: selectedLocation.province }), _jsx(ReadOnlyField, { label: "Land", value: selectedLocation.country })] })] })), _jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { className: "flex items-center gap-2", children: ["Afhaallocatie / Tuin ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(SearchableSelect, { value: pickupLocationId, placeholder: pickupLocations.length ? "Kies eigen locatie..." : "Geen eigen locaties bekend", disabled: pickupLocations.length === 0, allowClear: false, options: pickupLocations.map((l) => ({ value: l.id, label: l.name })), onChange: setPickupLocationId }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Eigen locatie (tuin) van waaruit de bestelling wordt geleverd of opgehaald." })] }), _jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { children: ["Vervoerder ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(SearchableSelect, { value: carrierId, placeholder: !customerId ? "Selecteer eerst een klant"
+                                            : !deliveryLocationId ? "Selecteer eerst een afleverlocatie"
+                                                : "Kies vervoerder...", disabled: !deliveryLocationId, allowClear: false, options: carriers.map((c) => ({
+                                            value: c.id,
+                                            label: c.name + (c.is_default ? " (standaard)" : ""),
+                                        })), onChange: setCarrierId }), selectedLocation?.carrier_id && carrierId && carrierId !== selectedLocation.carrier_id && (_jsx("div", { className: "text-xs text-muted-foreground", children: "Wijkt af van standaard vervoerder van deze locatie \u2014 geldt alleen voor deze bestelling." }))] }), _jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { className: "flex items-center gap-2", children: ["Leverdatum ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(Input, { type: "date", value: canPickDate ? deliveryDate : "", min: canPickDate ? earliestISO : undefined, disabled: !canPickDate, onChange: (e) => {
+                                            const v = e.target.value || "";
+                                            if (v && v < earliestISO) {
+                                                toast.error(`Eerst mogelijke leverdatum is ${earliestLabel}.`);
+                                                setDeliveryDate(earliestISO);
+                                                return;
+                                            }
+                                            setDeliveryDate(v);
+                                        } }), !canPickDate ? (_jsx("div", { className: "text-xs text-muted-foreground", children: "Selecteer eerst klant, afleverlocatie, afhaallocatie en vervoerder." })) : (_jsxs("div", { className: "text-xs text-muted-foreground", children: ["Eerst beschikbare leverdatum is ", earliestLabel, ", o.b.v. orderpicktijd (", pickDays, "d) en levertijd vervoerder (", carrierDeliveryDays, "d)."] }))] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Bestelregels" }), _jsxs("div", { className: "grid grid-cols-12 gap-2 text-xs text-muted-foreground px-1", children: [_jsx("div", { className: "col-span-5", children: "Product" }), _jsx("div", { className: "col-span-2", children: "Planten" }), _jsx("div", { className: "col-span-2", children: "Fusten" }), _jsx("div", { className: "col-span-2", children: "Prijs" }), _jsx("div", { className: "col-span-1" })] }), lines.map((line, idx) => {
+                                        const product = line.product_id ? products.find((p) => p.id === line.product_id) : null;
+                                        const ppc = Math.max(1, Number(product?.plants_per_crate ?? 1));
+                                        const plants = line.quantity ?? null;
+                                        const cratesDisplay = plants === null ? "" : String(Math.ceil(plants / ppc));
+                                        return (_jsxs("div", { className: "grid grid-cols-12 gap-2 items-start", children: [_jsx("div", { className: "col-span-5", children: _jsx(SearchableSelect, { value: line.product_id, placeholder: "Kies product...", clearLabel: "\u2014 Handmatig \u2014", options: products.map((p) => ({ value: p.id, label: p.product, hint: p.unit })), onChange: (v) => {
+                                                            const next = [...lines];
+                                                            if (v === null)
+                                                                next[idx] = { ...next[idx], product_id: null };
+                                                            else {
+                                                                const p = products.find((x) => x.id === v);
+                                                                const newPpc = Math.max(1, Number(p?.plants_per_crate ?? 1));
+                                                                const currentQ = Number(next[idx].quantity ?? 0);
+                                                                const normalizedQ = currentQ > 0 ? Math.ceil(currentQ / newPpc) * newPpc : newPpc;
+                                                                next[idx] = {
+                                                                    ...next[idx],
+                                                                    product_id: v,
+                                                                    product_name: p?.product ?? "",
+                                                                    unit: next[idx].unit ?? p?.unit ?? "stuks",
+                                                                    quantity: normalizedQ,
+                                                                    unit_price: next[idx].unit_price ?? (p?.sale_price != null ? Number(p.sale_price) : null),
+                                                                };
+                                                            }
+                                                            setLines(next);
+                                                        } }) }), _jsx(Input, { className: "col-span-2", type: "number", min: ppc, step: ppc, inputMode: "numeric", onKeyDown: blockDecimal, value: plants ?? "", onChange: (e) => {
+                                                        const next = [...lines];
+                                                        const raw = e.target.value.replace(/[.,]/g, "");
+                                                        const v = raw ? Number(raw) : null;
+                                                        const rounded = v === null ? null : Math.max(1, Math.ceil(v / ppc)) * ppc;
+                                                        next[idx] = { ...next[idx], quantity: rounded };
+                                                        setLines(next);
+                                                    }, placeholder: "Planten", title: `Verkoop per hele fust van ${ppc} planten` }), _jsx(Input, { className: "col-span-2", type: "number", min: 1, step: 1, inputMode: "numeric", onKeyDown: blockDecimal, value: cratesDisplay, onChange: (e) => {
+                                                        const next = [...lines];
+                                                        const raw = e.target.value.replace(/[.,]/g, "");
+                                                        const cr = raw ? Math.max(1, Math.floor(Number(raw))) : null;
+                                                        next[idx] = { ...next[idx], quantity: cr === null ? null : cr * ppc };
+                                                        setLines(next);
+                                                    }, placeholder: "Fusten", title: `${ppc} planten per fust` }), _jsx(Input, { className: "col-span-2", type: "number", min: 0, step: "0.01", value: line.unit_price ?? "", onChange: (e) => {
+                                                        const next = [...lines];
+                                                        const v = e.target.value === "" ? null : Number(e.target.value);
+                                                        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" })] })] })] }), _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"}