npm - @flowselections/floriday-afhandeling-module - Versions diffs - 1.0.9 → 1.0.10 - Mend

@flowselections/floriday-afhandeling-module 1.0.9 → 1.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (72) hide show

package/dist-lib/components/afhandeling/DagDetailDialog.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import type { PlannedOrder } from "../../hooks/useOrderPlanning";
+export interface DagDetailDialogProps {
+    open: boolean;
+    date: Date | null;
+    planned: PlannedOrder[];
+    onOpenChange: (open: boolean) => void;
+}
+export declare function DagDetailDialog({ open, date, planned, onOpenChange }: DagDetailDialogProps): import("react").JSX.Element | null;
+//# sourceMappingURL=DagDetailDialog.d.ts.map

package/dist-lib/components/afhandeling/DagDetailDialog.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DagDetailDialog.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/DagDetailDialog.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAyBjE,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC;AAID,wBAAgB,eAAe,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,EAAE,oBAAoB,sCAyE1F"}

package/dist-lib/components/afhandeling/DagDetailDialog.js ADDED Viewed

@@ -0,0 +1,145 @@
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import { useServerFn } from "@tanstack/react-start";
+import { Badge, Button, Dialog, DialogContent, DialogHeader, DialogTitle, Input, Tabs, TabsContent, TabsList, TabsTrigger, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, toast, } from "@flowselections/core";
+import { ChevronDown, ChevronRight, MoveRight, Truck } from "lucide-react";
+import { isSameDay } from "../../lib/pickDate";
+import { getOrderLines, moveCart as moveCartFn, } from "../../lib/cartAssignments.functions";
+import { evaluateCartMove } from "../../lib/cartMoveImpact";
+const NL_DATE = new Intl.DateTimeFormat("nl-NL", { dateStyle: "full" });
+export function DagDetailDialog({ open, date, planned, onOpenChange }) {
+    if (!date)
+        return null;
+    const ordersOnDay = planned.filter((p) => {
+        if (!p.planning)
+            return false;
+        const assigns = p.planning.pickAssignments ?? [];
+        return assigns.some((a) => isSameDay(a.date, date));
+    });
+    // Synthetiseer karren — één rij per kar die op deze dag valt
+    const cartRows = [];
+    for (const p of ordersOnDay) {
+        const assigns = p.planning.pickAssignments ?? [];
+        const totalCarts = p.order.cartCount ?? 0;
+        if (totalCarts <= 0)
+            continue;
+        let runningIdx = 0;
+        for (const a of assigns) {
+            const onThisDay = isSameDay(a.date, date);
+            const cartIndexes = a.cartIndexes && a.cartIndexes.length > 0
+                ? a.cartIndexes
+                : Array.from({ length: a.cartCount }, (_, i) => runningIdx + i);
+            for (const idx of cartIndexes) {
+                if (onThisDay) {
+                    const plantsPerCart = totalCarts > 0 ? Math.round((p.order.plantCount ?? 0) / totalCarts) : 0;
+                    cartRows.push({
+                        key: `${p.order.id}-${idx}`,
+                        orderId: p.order.id,
+                        orderSource: p.order.source,
+                        cartIndex: idx,
+                        cartNumber: `${p.order.orderNumber}-${String(idx + 1).padStart(2, "0")}`,
+                        order: p,
+                        layers: 4,
+                        crates: 0,
+                        plants: plantsPerCart,
+                        occupancy: 100,
+                    });
+                }
+            }
+            runningIdx += a.cartCount;
+        }
+    }
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "max-w-5xl max-h-[90vh] overflow-y-auto", children: [_jsx(DialogHeader, { children: _jsxs(DialogTitle, { children: ["Dagdetails \u2014 ", NL_DATE.format(date)] }) }), _jsxs("div", { className: "flex flex-wrap gap-3 text-sm text-muted-foreground", children: [_jsxs("span", { children: [ordersOnDay.length, " bestellingen"] }), _jsx("span", { children: "\u00B7" }), _jsxs("span", { children: [cartRows.length, " karren"] })] }), _jsxs(Tabs, { defaultValue: "bestellingen", className: "mt-4", children: [_jsxs(TabsList, { children: [_jsxs(TabsTrigger, { value: "bestellingen", children: ["Bestellingen (", ordersOnDay.length, ")"] }), _jsxs(TabsTrigger, { value: "karren", children: ["Karren (", cartRows.length, ")"] })] }), _jsx(TabsContent, { value: "bestellingen", className: "mt-4", children: _jsx(BestellingenTab, { orders: ordersOnDay, date: date }) }), _jsx(TabsContent, { value: "karren", className: "mt-4", children: _jsx(KarrenTab, { carts: cartRows, currentDate: date }) })] })] }) }));
+}
+function BestellingenTab({ orders, date }) {
+    if (orders.length === 0) {
+        return _jsx("p", { className: "text-sm text-muted-foreground", children: "Geen bestellingen op deze dag." });
+    }
+    return (_jsx("div", { className: "space-y-3", children: orders.map((p) => {
+            const cartsToday = (p.planning?.pickAssignments ?? []).find((a) => isSameDay(a.date, date))?.cartCount ?? 0;
+            return (_jsx(OrderRow, { planned: p, cartsToday: cartsToday }, p.order.id));
+        }) }));
+}
+function OrderRow({ planned: p, cartsToday }) {
+    const [open, setOpen] = useState(false);
+    const source = p.order.source;
+    const fetchLines = useServerFn(getOrderLines);
+    const linesQuery = useQuery({
+        queryKey: ["order-lines", source, p.order.id],
+        queryFn: () => fetchLines({ data: { orderId: p.order.id, orderSource: source } }),
+        enabled: open,
+    });
+    return (_jsxs("div", { className: "rounded-lg border bg-card", children: [_jsxs("button", { type: "button", onClick: () => setOpen((o) => !o), className: "flex w-full items-center gap-3 px-4 py-3 text-left hover:bg-muted/50", children: [open ? _jsx(ChevronDown, { className: "h-4 w-4" }) : _jsx(ChevronRight, { className: "h-4 w-4" }), _jsxs("div", { className: "flex-1 grid grid-cols-2 md:grid-cols-4 gap-3 text-sm", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: p.order.orderNumber }), _jsx("div", { className: "text-xs text-muted-foreground", children: p.order.customerName })] }), _jsxs("div", { children: [_jsx("div", { className: "text-xs text-muted-foreground", children: "Type" }), _jsx("div", { children: p.order.deliveryType })] }), _jsxs("div", { children: [_jsx("div", { className: "text-xs text-muted-foreground", children: "Leverdatum" }), _jsx("div", { children: p.order.deliveryDate
+                                            ? new Date(p.order.deliveryDate).toLocaleDateString("nl-NL")
+                                            : "—" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Badge, { variant: "secondary", children: [cartsToday, " karren vandaag"] }), _jsx(Badge, { variant: "outline", children: p.order.status })] })] })] }), open && (_jsxs("div", { className: "border-t px-4 py-3 space-y-3", children: [_jsxs("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-3 text-sm", children: [_jsx(Field, { label: "Afleverlocatie", value: "\u2014" }), _jsx(Field, { label: "Ophaallocatie (tuin)", value: "\u2014" }), _jsx(Field, { label: "Vervoerder", value: "\u2014" })] }), _jsxs("div", { children: [_jsx("div", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Orderregels" }), linesQuery.isLoading && _jsx("p", { className: "text-xs", children: "Regels laden\u2026" }), linesQuery.data && _jsx(OrderLinesTable, { lines: linesQuery.data.lines }), linesQuery.error && _jsx("p", { className: "text-xs text-destructive", children: "Kon regels niet laden" })] })] }))] }));
+}
+function Field({ label, value }) {
+    return (_jsxs("div", { children: [_jsx("div", { className: "text-xs text-muted-foreground", children: label }), _jsx("div", { children: value })] }));
+}
+function OrderLinesTable({ lines }) {
+    if (lines.length === 0) {
+        return _jsx("p", { className: "text-xs text-muted-foreground", children: "Geen orderregels gevonden." });
+    }
+    return (_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, { className: "text-right", children: "Overig" })] }) }), _jsx(TableBody, { children: lines.map((l) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: l.article }), _jsx(TableCell, { className: "text-right", children: l.plants }), _jsx(TableCell, { className: "text-right", children: l.crates ?? "—" }), _jsx(TableCell, { className: "text-right", children: l.otherUnits ?? "—" })] }, l.id))) })] }));
+}
+function KarrenTab({ carts, currentDate }) {
+    const [moveCartRow, setMoveCartRow] = useState(null);
+    if (carts.length === 0) {
+        return _jsx("p", { className: "text-sm text-muted-foreground", children: "Geen karren ingepland op deze dag." });
+    }
+    return (_jsxs(_Fragment, { children: [_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Karnummer" }), _jsx(TableHead, { children: "Klant" }), _jsx(TableHead, { children: "Bestelling" }), _jsx(TableHead, { children: "Tuin" }), _jsx(TableHead, { children: "Vervoerder" }), _jsx(TableHead, { className: "text-right", children: "Bezetting" }), _jsx(TableHead, { className: "text-right", children: "Lagen" }), _jsx(TableHead, { className: "text-right", children: "Planten" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { className: "text-right", children: "Actie" })] }) }), _jsx(TableBody, { children: carts.map((c) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: c.cartNumber }), _jsx(TableCell, { children: c.order.order.customerName }), _jsx(TableCell, { children: c.order.order.orderNumber }), _jsx(TableCell, { children: "\u2014" }), _jsx(TableCell, { children: "\u2014" }), _jsxs(TableCell, { className: "text-right", children: [c.occupancy, "%"] }), _jsx(TableCell, { className: "text-right", children: c.layers }), _jsx(TableCell, { className: "text-right", children: c.plants }), _jsx(TableCell, { children: _jsx(Badge, { variant: "secondary", children: "Nog te picken" }) }), _jsx(TableCell, { className: "text-right", children: _jsxs(Button, { size: "sm", variant: "outline", onClick: () => setMoveCartRow(c), children: [_jsx(MoveRight, { className: "mr-1 h-3.5 w-3.5" }), " Verplaatsen"] }) })] }, c.key))) })] }), _jsx(VerplaatsKarDialog, { cart: moveCartRow, currentDate: currentDate, onClose: () => setMoveCartRow(null) })] }));
+}
+function VerplaatsKarDialog({ cart, currentDate, onClose, }) {
+    const [newDate, setNewDate] = useState("");
+    const move = useServerFn(moveCartFn);
+    const qc = useQueryClient();
+    const mutation = useMutation({
+        mutationFn: async () => {
+            if (!cart)
+                throw new Error("Geen kar geselecteerd");
+            if (!newDate)
+                throw new Error("Kies eerst een nieuwe pickdatum");
+            return move({
+                data: {
+                    orderId: cart.orderId,
+                    orderSource: cart.orderSource,
+                    cartIndex: cart.cartIndex,
+                    newDate,
+                    fromDate: currentDate,
+                },
+            });
+        },
+        onSuccess: async (res) => {
+            const target = new Date(newDate).toLocaleDateString("nl-NL", {
+                weekday: "long", day: "numeric", month: "long",
+            });
+            toast.success(`Kar ${cart?.cartNumber ?? ""} verplaatst naar ${target}`);
+            qc.setQueryData(["cart-overrides"], (current) => {
+                const overrides = current?.overrides ?? [];
+                const next = overrides.filter((o) => !(o.order_id === res.override.order_id &&
+                    o.order_source === res.override.order_source &&
+                    o.cart_index === res.override.cart_index));
+                return { overrides: [...next, res.override] };
+            });
+            await Promise.all([
+                qc.invalidateQueries({ queryKey: ["floriday", "orders"] }),
+                qc.invalidateQueries({ queryKey: ["cart-overrides"] }),
+            ]);
+            await qc.refetchQueries({ queryKey: ["cart-overrides"], type: "active" });
+            setNewDate("");
+            onClose();
+            return res;
+        },
+        onError: (e) => {
+            const msg = e instanceof Error ? e.message : "Verplaatsen mislukt";
+            toast.error(msg);
+            console.error("[moveCart]", e);
+        },
+    });
+    if (!cart)
+        return null;
+    const parsed = newDate ? new Date(newDate) : null;
+    const impact = parsed ? evaluateCartMove(parsed, currentDate, cart.order.planning) : null;
+    return (_jsx(Dialog, { open: !!cart, onOpenChange: (o) => !o && onClose(), children: _jsxs(DialogContent, { className: "max-w-md", children: [_jsx(DialogHeader, { children: _jsxs(DialogTitle, { className: "flex items-center gap-2", children: [_jsx(Truck, { className: "h-4 w-4" }), " Kar verplaatsen"] }) }), _jsxs("div", { className: "space-y-3 text-sm", children: [_jsxs("div", { className: "rounded-md border bg-muted/40 p-3", children: [_jsx("div", { className: "font-medium", children: cart.cartNumber }), _jsxs("div", { className: "text-xs text-muted-foreground", children: [cart.order.order.customerName, " \u00B7 ", cart.order.order.orderNumber] })] }), _jsxs("div", { children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Nieuwe pickdatum" }), _jsx(Input, { type: "date", value: newDate, onChange: (e) => setNewDate(e.target.value) })] }), impact && (_jsxs("div", { className: "space-y-1", children: [impact.blockers.map((b, i) => (_jsxs("p", { className: "text-xs text-destructive", children: ["\u26A0 ", b] }, `b${i}`))), impact.warnings.map((w, i) => (_jsxs("p", { className: "text-xs text-amber-600", children: ["! ", w] }, `w${i}`))), impact.ok && impact.warnings.length === 0 && (_jsx("p", { className: "text-xs text-green-600", children: "\u2713 Verplaatsing is logistiek haalbaar." }))] })), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { variant: "ghost", onClick: onClose, children: "Annuleren" }), _jsx(Button, { onClick: () => mutation.mutate(), disabled: !newDate || (impact ? !impact.ok : false) || mutation.isPending, children: mutation.isPending ? "Bezig…" : "Bevestig verplaatsing" })] })] })] }) }));
+}

package/dist-lib/components/afhandeling/LeveringenPage.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LeveringenPage.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/LeveringenPage.tsx"],"names":[],"mappings":"~~AAqBA~~,wBAAgB,cAAc,~~gCA+F7B~~"}
1	+ {"version":3,"file":"LeveringenPage.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/LeveringenPage.tsx"],"names":[],"mappings":"AAwBA,wBAAgB,cAAc,gCA2G7B"}

package/dist-lib/components/afhandeling/LeveringenPage.js CHANGED Viewed

@@ -1,13 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Link } from "@tanstack/react-router";
 import { useMemo, useState } from "react";
-import { Button, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Tabs, TabsContent, TabsList, TabsTrigger, } from "@flowselections/core";
-import { Plus } from "lucide-react";
+import { useQueryClient } from "@tanstack/react-query";
+import { Button, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Tabs, TabsContent, TabsList, TabsTrigger, toast, } from "@flowselections/core";
+import { RefreshCw } from "lucide-react";
 import { WeekAgendaView } from "./WeekAgendaView";
 import { useOrderPlanning } from "../../hooks/useOrderPlanning";
+import { invalidatePlanning } from "../../lib/invalidatePlanning";
 const ALL = "__all__";
 export function LeveringenPage() {
-    const { planned, isLoading, error, refetch } = useOrderPlanning();
+    const { planned, isLoading, error, warning, refetch } = useOrderPlanning();
+    const qc = useQueryClient();
+    const handleRecalc = async () => {
+        await invalidatePlanning(qc);
+        toast.success("Planning herberekend met actuele instellingen");
+    };
     const [customer, setCustomer] = useState(ALL);
     const [deliveryType, setDeliveryType] = useState(ALL);
     const [dateFrom, setDateFrom] = useState("");
@@ -27,5 +33,5 @@ export function LeveringenPage() {
             return true;
         });
     }, [planned, customer, deliveryType, dateFrom, dateTo]);
-    return (_jsx("main", { className: "p-6 space-y-6", children: _jsxs(Tabs, { defaultValue: "overzicht", className: "space-y-6", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "overzicht", children: "Overzicht" }), _jsx(TabsTrigger, { value: "veilbrieven", children: "Veilbrieven" })] }), _jsxs("div", { className: "flex flex-wrap items-end justify-between gap-3", children: [_jsxs("div", { className: "flex flex-wrap items-end gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum vanaf" }), _jsx(Input, { type: "date", value: dateFrom, onChange: (e) => setDateFrom(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum t/m" }), _jsx(Input, { type: "date", value: dateTo, onChange: (e) => setDateTo(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Klant" }), _jsxs(Select, { value: customer, onValueChange: setCustomer, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle klanten" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle klanten" }), customers.map((c) => _jsx(SelectItem, { value: c, children: c }, c))] })] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Type levering" }), _jsxs(Select, { value: deliveryType, onValueChange: setDeliveryType, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle types" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle types" }), deliveryTypes.map((t) => _jsx(SelectItem, { value: t, children: t }, t))] })] })] })] }), _jsx(Button, { asChild: true, children: _jsxs(Link, { to: "/afhandeling/leveringen/nieuw", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "Levering aanmaken"] }) })] }), _jsx(TabsContent, { value: "overzicht", className: "space-y-3", children: error ? (_jsxs("div", { className: "rounded-md border border-destructive/30 bg-destructive/5 p-4 text-sm text-destructive", children: [error, _jsx(Button, { size: "sm", variant: "outline", className: "ml-3", onClick: () => refetch(), children: "Opnieuw proberen" })] })) : (_jsx(WeekAgendaView, { planned: filtered, mode: "delivery", isLoading: isLoading })) }), _jsx(TabsContent, { value: "veilbrieven", children: _jsx("div", { className: "rounded-md border border-dashed p-10 text-center text-sm text-muted-foreground", children: "Veilbrieven volgen in een volgende iteratie." }) })] }) }));
+    return (_jsx("main", { className: "p-6 space-y-6", children: _jsxs(Tabs, { defaultValue: "overzicht", className: "space-y-6", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "overzicht", children: "Overzicht" }), _jsx(TabsTrigger, { value: "veilbrieven", children: "Veilbrieven" })] }), _jsxs("div", { className: "flex flex-wrap items-end justify-between gap-3", children: [_jsxs("div", { className: "flex flex-wrap items-end gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum vanaf" }), _jsx(Input, { type: "date", value: dateFrom, onChange: (e) => setDateFrom(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum t/m" }), _jsx(Input, { type: "date", value: dateTo, onChange: (e) => setDateTo(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Klant" }), _jsxs(Select, { value: customer, onValueChange: setCustomer, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle klanten" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle klanten" }), customers.map((c) => _jsx(SelectItem, { value: c, children: c }, c))] })] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Type levering" }), _jsxs(Select, { value: deliveryType, onValueChange: setDeliveryType, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle types" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle types" }), deliveryTypes.map((t) => _jsx(SelectItem, { value: t, children: t }, t))] })] })] })] }), _jsx("div", { className: "flex items-end gap-2", children: _jsxs(Button, { variant: "outline", onClick: handleRecalc, children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), "Herbereken planning"] }) })] }), _jsxs(TabsContent, { value: "overzicht", className: "space-y-3", children: [warning && !error && (_jsxs("div", { className: "rounded-md border border-amber-300 bg-amber-50 p-4 text-sm text-amber-900", children: [warning, " De beschikbare orders blijven zichtbaar."] })), error ? (_jsxs("div", { className: "rounded-md border border-destructive/30 bg-destructive/5 p-4 text-sm text-destructive", children: [error, _jsx(Button, { size: "sm", variant: "outline", className: "ml-3", onClick: () => refetch(), children: "Opnieuw proberen" })] })) : (_jsx(WeekAgendaView, { planned: filtered, mode: "delivery", isLoading: isLoading }))] }), _jsx(TabsContent, { value: "veilbrieven", children: _jsx("div", { className: "rounded-md border border-dashed p-10 text-center text-sm text-muted-foreground", children: "Veilbrieven volgen in een volgende iteratie." }) })] }) }));
 }

package/dist-lib/components/afhandeling/PickAgendaView.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PickAgendaView.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/PickAgendaView.tsx"],"names":[],"mappings":"~~AAkBA~~,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAIlE,MAAM,WAAW,mBAAmB;IAClC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC/C;AAED,wBAAgB,cAAc,CAAC,EAAE,YAAY,EAAE,EAAE,mBAAmB,+~~BA6FnE~~"}
1	+ {"version":3,"file":"PickAgendaView.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/PickAgendaView.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAIlE,MAAM,WAAW,mBAAmB;IAClC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC/C;AAED,wBAAgB,cAAc,CAAC,EAAE,YAAY,EAAE,EAAE,mBAAmB,+BAkHnE"}

package/dist-lib/components/afhandeling/PickAgendaView.js CHANGED Viewed

@@ -1,13 +1,22 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Link } from "@tanstack/react-router";
 import { useMemo, useState } from "react";
+import { useQueryClient } from "@tanstack/react-query";
 import { Button, Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Tabs, TabsContent, TabsList, TabsTrigger, } from "@flowselections/core";
-import { Plus } from "lucide-react";
+import { RefreshCw } from "lucide-react";
+import { toast } from "@flowselections/core";
 import { WeekAgendaView } from "./WeekAgendaView";
+import { DagDetailDialog } from "./DagDetailDialog";
 import { useOrderPlanning } from "../../hooks/useOrderPlanning";
+import { invalidatePlanning } from "../../lib/invalidatePlanning";
 const ALL = "__all__";
 export function PickAgendaView({ onOrderClick }) {
-    const { planned, isLoading, error, refetch } = useOrderPlanning();
+    const { planned, isLoading, error, warning, refetch } = useOrderPlanning();
+    const qc = useQueryClient();
+    const [dayDetailDate, setDayDetailDate] = useState(null);
+    const handleRecalc = async () => {
+        await invalidatePlanning(qc);
+        toast.success("Planning herberekend met actuele instellingen");
+    };
     const [customer, setCustomer] = useState(ALL);
     const [deliveryType, setDeliveryType] = useState(ALL);
     const [dateFrom, setDateFrom] = useState("");
@@ -27,5 +36,5 @@ export function PickAgendaView({ onOrderClick }) {
             return true;
         });
     }, [planned, customer, deliveryType, dateFrom, dateTo]);
-    return (_jsxs(Tabs, { defaultValue: "overzicht", className: "space-y-6", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "overzicht", children: "Overzicht" }), _jsx(TabsTrigger, { value: "veilbrieven", children: "Veilbrieven" })] }), _jsxs("div", { className: "flex flex-wrap items-end justify-between gap-3", children: [_jsxs("div", { className: "flex flex-wrap items-end gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum vanaf" }), _jsx(Input, { type: "date", value: dateFrom, onChange: (e) => setDateFrom(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum t/m" }), _jsx(Input, { type: "date", value: dateTo, onChange: (e) => setDateTo(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Klant" }), _jsxs(Select, { value: customer, onValueChange: setCustomer, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle klanten" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle klanten" }), customers.map((c) => _jsx(SelectItem, { value: c, children: c }, c))] })] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Type levering" }), _jsxs(Select, { value: deliveryType, onValueChange: setDeliveryType, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle types" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle types" }), deliveryTypes.map((t) => _jsx(SelectItem, { value: t, children: t }, t))] })] })] })] }), _jsx(Button, { asChild: true, children: _jsxs(Link, { to: "/afhandeling/leveringen/nieuw", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "Levering aanmaken"] }) })] }), _jsx(TabsContent, { value: "overzicht", className: "space-y-3", children: error ? (_jsxs("div", { className: "rounded-md border border-destructive/30 bg-destructive/5 p-4 text-sm text-destructive", children: [error, _jsx(Button, { size: "sm", variant: "outline", className: "ml-3", onClick: () => refetch(), children: "Opnieuw proberen" })] })) : (_jsx(WeekAgendaView, { planned: filtered, mode: "pick", isLoading: isLoading, onOrderClick: onOrderClick })) }), _jsx(TabsContent, { value: "veilbrieven", children: _jsx("div", { className: "rounded-md border border-dashed p-10 text-center text-sm text-muted-foreground", children: "Veilbrieven volgen in een volgende iteratie." }) })] }));
+    return (_jsxs(Tabs, { defaultValue: "overzicht", className: "space-y-6", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "overzicht", children: "Overzicht" }), _jsx(TabsTrigger, { value: "veilbrieven", children: "Veilbrieven" })] }), _jsxs("div", { className: "flex flex-wrap items-end justify-between gap-3", children: [_jsxs("div", { className: "flex flex-wrap items-end gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum vanaf" }), _jsx(Input, { type: "date", value: dateFrom, onChange: (e) => setDateFrom(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Datum t/m" }), _jsx(Input, { type: "date", value: dateTo, onChange: (e) => setDateTo(e.target.value), className: "w-40" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Klant" }), _jsxs(Select, { value: customer, onValueChange: setCustomer, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle klanten" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle klanten" }), customers.map((c) => _jsx(SelectItem, { value: c, children: c }, c))] })] })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { className: "text-xs text-muted-foreground", children: "Type levering" }), _jsxs(Select, { value: deliveryType, onValueChange: setDeliveryType, children: [_jsx(SelectTrigger, { className: "w-56", children: _jsx(SelectValue, { placeholder: "Alle types" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: ALL, children: "Alle types" }), deliveryTypes.map((t) => _jsx(SelectItem, { value: t, children: t }, t))] })] })] })] }), _jsx("div", { className: "flex items-end gap-2", children: _jsxs(Button, { variant: "outline", onClick: handleRecalc, children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4" }), "Herbereken planning"] }) })] }), _jsxs(TabsContent, { value: "overzicht", className: "space-y-3", children: [warning && !error && (_jsxs("div", { className: "rounded-md border border-amber-300 bg-amber-50 p-4 text-sm text-amber-900", children: [warning, " De beschikbare orders blijven zichtbaar."] })), error ? (_jsxs("div", { className: "rounded-md border border-destructive/30 bg-destructive/5 p-4 text-sm text-destructive", children: [error, _jsx(Button, { size: "sm", variant: "outline", className: "ml-3", onClick: () => refetch(), children: "Opnieuw proberen" })] })) : (_jsx(WeekAgendaView, { planned: filtered, mode: "pick", isLoading: isLoading, onOrderClick: onOrderClick, onDayClick: setDayDetailDate }))] }), _jsx(TabsContent, { value: "veilbrieven", children: _jsx("div", { className: "rounded-md border border-dashed p-10 text-center text-sm text-muted-foreground", children: "Veilbrieven volgen in een volgende iteratie." }) }), _jsx(DagDetailDialog, { open: !!dayDetailDate, date: dayDetailDate, planned: filtered, onOpenChange: (o) => !o && setDayDetailDate(null) })] }));
 }

package/dist-lib/components/afhandeling/PlanningAgendaPage.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlanningAgendaPage.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/PlanningAgendaPage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGvE,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,cAAc,CAAC;CACtB;AAED,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,KAAK,+~~BAgBrE~~"}
1	+ {"version":3,"file":"PlanningAgendaPage.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/PlanningAgendaPage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGvE,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,cAAc,CAAC;CACtB;AAED,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,KAAK,+BAqBrE"}

package/dist-lib/components/afhandeling/PlanningAgendaPage.js CHANGED Viewed

@@ -2,6 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { WeekAgendaView } from "./WeekAgendaView";
 import { useOrderPlanning } from "../../hooks/useOrderPlanning";
 export function PlanningAgendaPage({ title, description, mode }) {
-    const { planned, isLoading, error } = useOrderPlanning();
-    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold", children: title }), _jsx("p", { className: "text-sm text-muted-foreground", children: description })] }), error && (_jsx("div", { className: "rounded-md border border-destructive/30 bg-destructive/5 p-3 text-sm text-destructive", children: error })), _jsx(WeekAgendaView, { planned: planned, mode: mode, isLoading: isLoading })] }));
+    const { planned, isLoading, error, warning } = useOrderPlanning();
+    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold", children: title }), _jsx("p", { className: "text-sm text-muted-foreground", children: description })] }), error && (_jsx("div", { className: "rounded-md border border-destructive/30 bg-destructive/5 p-3 text-sm text-destructive", children: error })), warning && !error && (_jsxs("div", { className: "rounded-md border border-amber-300 bg-amber-50 p-3 text-sm text-amber-900", children: [warning, " De beschikbare orders blijven zichtbaar."] })), _jsx(WeekAgendaView, { planned: planned, mode: mode, isLoading: isLoading })] }));
 }

package/dist-lib/components/afhandeling/ServiceAreaSelect.d.ts ADDED Viewed

@@ -0,0 +1,12 @@
+export interface ServiceAreaValue {
+    countries: string[];
+    provinces: string[];
+    cities: string[];
+}
+interface Props {
+    value: ServiceAreaValue;
+    onChange: (next: ServiceAreaValue) => void;
+}
+export declare function ServiceAreaSelect({ value, onChange }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=ServiceAreaSelect.d.ts.map

package/dist-lib/components/afhandeling/ServiceAreaSelect.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ServiceAreaSelect.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/ServiceAreaSelect.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB;AAED,UAAU,KAAK;IACb,KAAK,EAAE,gBAAgB,CAAC;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAC5C;AAiCD,wBAAgB,iBAAiB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,KAAK,+BAwH3D"}

package/dist-lib/components/afhandeling/ServiceAreaSelect.js ADDED Viewed

@@ -0,0 +1,79 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Popover, PopoverContent, PopoverTrigger, Badge, cn } from "@flowselections/core";
+import { ChevronDown, Search, X, Check, Globe, MapPin, Building2 } from "lucide-react";
+import { GEO_ITEMS, getGeoItem } from "../../lib/geo/euServiceAreas";
+const LEVEL_META = {
+    country: { label: "Land", icon: Globe, tone: "bg-blue-100 text-blue-700" },
+    province: { label: "Provincie", icon: MapPin, tone: "bg-emerald-100 text-emerald-700" },
+    city: { label: "Plaats", icon: Building2, tone: "bg-amber-100 text-amber-700" },
+};
+function isSelected(value, item) {
+    if (item.level === "country")
+        return value.countries.includes(item.code);
+    if (item.level === "province")
+        return value.provinces.includes(item.code);
+    return value.cities.includes(item.code);
+}
+function toggle(value, item) {
+    const has = isSelected(value, item);
+    if (item.level === "country") {
+        return { ...value, countries: has ? value.countries.filter((c) => c !== item.code) : [...value.countries, item.code] };
+    }
+    if (item.level === "province") {
+        return { ...value, provinces: has ? value.provinces.filter((c) => c !== item.code) : [...value.provinces, item.code] };
+    }
+    return { ...value, cities: has ? value.cities.filter((c) => c !== item.code) : [...value.cities, item.code] };
+}
+function removeCode(value, code) {
+    return {
+        countries: value.countries.filter((c) => c !== code),
+        provinces: value.provinces.filter((c) => c !== code),
+        cities: value.cities.filter((c) => c !== code),
+    };
+}
+export function ServiceAreaSelect({ value, onChange }) {
+    const [open, setOpen] = useState(false);
+    const [query, setQuery] = useState("");
+    const filtered = useMemo(() => {
+        const q = query.trim().toLowerCase();
+        const items = q
+            ? GEO_ITEMS.filter((i) => i.label.toLowerCase().includes(q) || i.code.toLowerCase().includes(q))
+            : GEO_ITEMS;
+        const byLevel = { country: [], province: [], city: [] };
+        for (const i of items)
+            byLevel[i.level].push(i);
+        for (const k of Object.keys(byLevel)) {
+            byLevel[k].sort((a, b) => a.label.localeCompare(b.label, "nl"));
+        }
+        // cap city list to keep the popover snappy when no query
+        if (!q)
+            byLevel.city = byLevel.city.slice(0, 60);
+        return byLevel;
+    }, [query]);
+    const selectedItems = useMemo(() => {
+        const all = [...value.countries, ...value.provinces, ...value.cities];
+        return all
+            .map((c) => getGeoItem(c) ?? { code: c, label: c, level: "country", country: c })
+            .sort((a, b) => {
+            const order = { country: 0, province: 1, city: 2 };
+            return order[a.level] - order[b.level] || a.label.localeCompare(b.label, "nl");
+        });
+    }, [value]);
+    const total = selectedItems.length;
+    return (_jsxs("div", { className: "space-y-2", children: [_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { type: "button", className: "flex items-center justify-between w-full min-h-10 px-3 py-2 rounded-md border bg-background text-sm", children: [_jsx("span", { className: total === 0 ? "text-muted-foreground" : "", children: total === 0 ? "Selecteer landen, provincies of plaatsen…" : `${total} gebied${total === 1 ? "" : "en"} geselecteerd` }), _jsx(ChevronDown, { className: "w-4 h-4 text-muted-foreground" })] }) }), _jsxs(PopoverContent, { className: "p-0 w-[360px]", align: "start", children: [_jsxs("div", { className: "flex items-center gap-2 px-3 py-2 border-b", children: [_jsx(Search, { className: "w-4 h-4 text-muted-foreground" }), _jsx("input", { autoFocus: true, value: query, onChange: (e) => setQuery(e.target.value), placeholder: "Zoek land, provincie of plaats\u2026", className: "flex-1 bg-transparent text-sm outline-none" })] }), _jsxs("div", { className: "max-h-[340px] overflow-y-auto py-1", children: [Object.keys(filtered).map((level) => {
+                                        const items = filtered[level];
+                                        if (items.length === 0)
+                                            return null;
+                                        const Meta = LEVEL_META[level];
+                                        return (_jsxs("div", { children: [_jsxs("div", { className: "px-3 pt-2 pb-1 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground", children: [Meta.label, "en"] }), items.map((item) => {
+                                                    const sel = isSelected(value, item);
+                                                    const Icon = LEVEL_META[item.level].icon;
+                                                    return (_jsxs("button", { type: "button", onClick: () => onChange(toggle(value, item)), className: cn("flex w-full items-center gap-2 px-3 py-1.5 text-left text-sm hover:bg-muted", sel && "bg-muted/60"), children: [_jsx(Icon, { className: "h-3.5 w-3.5 text-muted-foreground shrink-0" }), _jsx("span", { className: "flex-1 truncate", children: item.label }), _jsx("span", { className: "text-[10px] text-muted-foreground", children: item.code }), sel ? _jsx(Check, { className: "h-4 w-4 text-primary" }) : null] }, item.code));
+                                                })] }, level));
+                                    }), filtered.country.length === 0 && filtered.province.length === 0 && filtered.city.length === 0 && (_jsx("div", { className: "px-3 py-6 text-center text-sm text-muted-foreground", children: "Geen resultaten" }))] })] })] }), selectedItems.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-1.5", children: selectedItems.map((item) => {
+                    const meta = LEVEL_META[item.level];
+                    const Icon = meta.icon;
+                    return (_jsxs(Badge, { variant: "secondary", className: cn("gap-1 pr-1", meta.tone), children: [_jsx(Icon, { className: "h-3 w-3" }), _jsx("span", { children: item.label }), _jsx("button", { type: "button", onClick: () => onChange(removeCode(value, item.code)), className: "ml-1 rounded-sm hover:bg-black/10 p-0.5", "aria-label": `Verwijder ${item.label}`, children: _jsx(X, { className: "h-3 w-3" }) })] }, item.code));
+                }) }))] }));
+}

package/dist-lib/components/afhandeling/VervoerderForm.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VervoerderForm.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/VervoerderForm.tsx"],"names":[],"mappings":"~~AA6CA~~,UAAU,KAAK;IACb,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B;~~AAiND~~,wBAAgB,cAAc,CAAC,EAAE,SAAS,EAAE,EAAE,KAAK,+~~BA0VlD~~"}
1	+ {"version":3,"file":"VervoerderForm.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/VervoerderForm.tsx"],"names":[],"mappings":"AA8CA,UAAU,KAAK;IACb,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B;AAyPD,wBAAgB,cAAc,CAAC,EAAE,SAAS,EAAE,EAAE,KAAK,+BA4XlD"}

package/dist-lib/components/afhandeling/VervoerderForm.js CHANGED Viewed

@@ -8,6 +8,7 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { getCarrier, upsertCarrier, } from "../../lib/carriers.functions";
 import { DEFAULT_PICKUP_MOMENT } from "../../lib/planning";
 import { COUNTRIES, countryName } from "../../lib/countries";
+import { ServiceAreaSelect } from "./ServiceAreaSelect";
 const EMPTY = {
     name: "",
     contact_person: "",
@@ -17,6 +18,9 @@ const EMPTY = {
     notes: "",
     is_default: false,
     pickup_moments: [DEFAULT_PICKUP_MOMENT],
+    service_countries: [],
+    service_provinces: [],
+    service_cities: [],
 };
 function FieldIcon({ icon: Icon }) {
     return (_jsx("div", { className: "flex items-center justify-center w-10 h-10 rounded-md bg-primary/10 text-primary shrink-0", children: _jsx(Icon, { className: "w-4 h-4" }) }));
@@ -38,11 +42,41 @@ function CountryPicker({ value, onChange, excluded, }) {
                                 setQuery("");
                             }, className: "flex items-center justify-between w-full px-3 py-2 text-sm text-left hover:bg-muted", children: [_jsx("span", { children: c.name }), _jsx("span", { className: "text-xs text-muted-foreground", children: c.code })] }, c.code)))) })] })] }));
 }
-function PickupMomentRow({ label, days, time, onDaysChange, onTimeChange, }) {
-    return (_jsxs("div", { className: "grid grid-cols-[110px,1fr,1fr] items-center gap-3", children: [_jsx("div", { className: "text-sm font-medium", children: label }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: "Werkdagen v\u00F3\u00F3r levering" }), _jsx(IconInput, { icon: Calendar, type: "number", min: 0, value: days, onChange: (e) => onDaysChange(Number(e.target.value) || 0) })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: "Tijdstip" }), _jsx(IconInput, { icon: Clock, type: "time", value: time, onChange: (e) => onTimeChange(e.target.value) })] })] }));
+function PickupMomentRow({ label, days, time, maxDays, onDaysChange, onTimeChange, }) {
+    return (_jsxs("div", { className: "grid grid-cols-[110px,1fr,1fr] items-center gap-3", children: [_jsx("div", { className: "text-sm font-medium", children: label }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: "Werkdagen v\u00F3\u00F3r levering" }), _jsx(IconInput, { icon: Calendar, type: "number", min: 0, max: maxDays, value: days, onChange: (e) => onDaysChange(Number(e.target.value) || 0) })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: "Tijdstip" }), _jsx(IconInput, { icon: Clock, type: "time", value: time, onChange: (e) => onTimeChange(e.target.value) })] })] }));
+}
+// Normaliseer een ophaalmoment: aanmelden moet altijd vóór (of op) ophalen
+// liggen, ophalen vóór (of op) bezorgen. Werkdagen-waardes zijn afstanden tot
+// de bezorgdag, dus geldt: signup_days >= pickup_days >= delivery_days.
+function normalizeMoment(next, prev) {
+    const m = { ...next };
+    if (next.signup_days !== prev.signup_days) {
+        // Aanmelden verlaagd → ophalen mag niet eerder zijn dan aanmelden
+        if (m.pickup_days > m.signup_days)
+            m.pickup_days = m.signup_days;
+        if (m.delivery_days > m.pickup_days)
+            m.delivery_days = m.pickup_days;
+    }
+    if (next.pickup_days !== prev.pickup_days) {
+        // Ophalen mag nooit vóór aanmelden plaatsvinden
+        if (m.pickup_days > m.signup_days)
+            m.pickup_days = m.signup_days;
+        if (m.delivery_days > m.pickup_days)
+            m.delivery_days = m.pickup_days;
+    }
+    if (next.delivery_days !== prev.delivery_days) {
+        if (m.delivery_days > m.pickup_days)
+            m.delivery_days = m.pickup_days;
+    }
+    return m;
 }
 function PickupMomentEditor({ index, value, canDelete, onChange, onDelete, }) {
-    return (_jsxs("div", { className: "rounded-md border bg-background p-4 space-y-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "text-sm font-semibold", children: ["Ophaalmoment ", index + 1] }), canDelete ? (_jsxs("button", { type: "button", onClick: onDelete, className: "text-xs text-muted-foreground hover:text-destructive inline-flex items-center gap-1", "aria-label": "Ophaalmoment verwijderen", children: [_jsx(Trash2, { className: "w-3.5 h-3.5" }), "Verwijderen"] })) : null] }), _jsxs("div", { className: "space-y-3", children: [_jsx(PickupMomentRow, { label: "Aanmelden", days: value.signup_days, time: value.signup_time, onDaysChange: (n) => onChange({ ...value, signup_days: n }), onTimeChange: (v) => onChange({ ...value, signup_time: v }) }), _jsx(PickupMomentRow, { label: "Ophalen", days: value.pickup_days, time: value.pickup_time, onDaysChange: (n) => onChange({ ...value, pickup_days: n }), onTimeChange: (v) => onChange({ ...value, pickup_time: v }) }), _jsx(PickupMomentRow, { label: "Bezorgen", days: value.delivery_days, time: value.delivery_time, onDaysChange: (n) => onChange({ ...value, delivery_days: n }), onTimeChange: (v) => onChange({ ...value, delivery_time: v }) })] })] }));
+    const update = (patch) => {
+        const next = { ...value, ...patch };
+        onChange(normalizeMoment(next, value));
+    };
+    const pickupInvalid = value.pickup_days > value.signup_days;
+    return (_jsxs("div", { className: "rounded-md border bg-background p-4 space-y-3", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "text-sm font-semibold", children: ["Ophaalmoment ", index + 1] }), canDelete ? (_jsxs("button", { type: "button", onClick: onDelete, className: "text-xs text-muted-foreground hover:text-destructive inline-flex items-center gap-1", "aria-label": "Ophaalmoment verwijderen", children: [_jsx(Trash2, { className: "w-3.5 h-3.5" }), "Verwijderen"] })) : null] }), _jsxs("div", { className: "space-y-3", children: [_jsx(PickupMomentRow, { label: "Aanmelden", days: value.signup_days, time: value.signup_time, onDaysChange: (n) => update({ signup_days: n }), onTimeChange: (v) => update({ signup_time: v }) }), _jsx(PickupMomentRow, { label: "Ophalen", days: value.pickup_days, time: value.pickup_time, maxDays: value.signup_days, onDaysChange: (n) => update({ pickup_days: Math.min(n, value.signup_days) }), onTimeChange: (v) => update({ pickup_time: v }) }), pickupInvalid ? (_jsx("p", { className: "text-xs text-destructive -mt-1 pl-[122px]", children: "Ophalen kan niet v\u00F3\u00F3r aanmelden plaatsvinden." })) : null, _jsx(PickupMomentRow, { label: "Bezorgen", days: value.delivery_days, time: value.delivery_time, maxDays: value.pickup_days, onDaysChange: (n) => update({ delivery_days: Math.min(n, value.pickup_days) }), onTimeChange: (v) => update({ delivery_time: v }) })] })] }));
 }
 export function VervoerderForm({ carrierId }) {
     const isEdit = !!carrierId;
@@ -74,6 +108,9 @@ export function VervoerderForm({ carrierId }) {
                 pickup_moments: c.pickup_moments && c.pickup_moments.length > 0
                     ? c.pickup_moments
                     : [DEFAULT_PICKUP_MOMENT],
+                service_countries: c.service_countries ?? [],
+                service_provinces: c.service_provinces ?? [],
+                service_cities: c.service_cities ?? [],
             });
             setRates(c.rates);
         }
@@ -92,9 +129,10 @@ export function VervoerderForm({ carrierId }) {
                 throw e;
             }
         },
-        onSuccess: () => {
+        onSuccess: async () => {
             toast.success(isEdit ? "Vervoerder bijgewerkt" : "Vervoerder aangemaakt");
-            queryClient.invalidateQueries({ queryKey: ["carriers"] });
+            const { invalidatePlanning } = await import("../../lib/invalidatePlanning");
+            await invalidatePlanning(queryClient);
             if (carrierId)
                 queryClient.invalidateQueries({ queryKey: ["carrier", carrierId] });
             goBack();
@@ -143,7 +181,16 @@ export function VervoerderForm({ carrierId }) {
                                                     } }, idx))) }), _jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setForm({
                                                     ...form,
                                                     pickup_moments: [...form.pickup_moments, { ...DEFAULT_PICKUP_MOMENT }],
-                                                }), children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Ophaalmoment toevoegen"] })] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { type: "checkbox", checked: form.is_default ?? false, onChange: (e) => setForm({ ...form, is_default: e.target.checked }), className: "h-4 w-4 rounded border" }), _jsxs("span", { children: ["Gebruik als ", _jsx("strong", { children: "standaard vervoerder" }), " voor de automatische planning (voor orders zonder eigen vervoerder)."] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Opmerkingen" }), _jsxs("div", { className: "flex gap-2", children: [_jsx(FieldIcon, { icon: FileText }), _jsx(Textarea, { value: form.notes ?? "", onChange: (e) => setForm({ ...form, notes: e.target.value }), placeholder: "Extra informatie over deze vervoerder...", rows: 3, className: "flex-1" })] })] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { className: "text-base", children: "Verzendtarieven" }), _jsxs("p", { className: "text-sm text-muted-foreground", children: ["Stel de verzendkosten ", _jsx("strong", { children: "per kwekerskar" }), " in voor elk land waar deze vervoerder naartoe verzendt."] })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-[1fr,160px,auto] gap-3", children: [_jsx(CountryPicker, { value: pendingCountry, onChange: setPendingCountry, excluded: rates.map((r) => r.country_code) }), _jsxs("div", { className: "flex items-stretch gap-2 rounded-md border bg-background h-10", children: [_jsx("div", { className: "flex items-center justify-center w-10 bg-primary/10 text-primary rounded-l-md text-sm font-medium", children: "\u20AC" }), _jsx("input", { type: "number", step: "0.01", min: 0, value: pendingPrice, onChange: (e) => setPendingPrice(e.target.value), placeholder: "Prijs", className: "flex-1 bg-transparent text-sm outline-none pr-3" })] }), _jsxs(Button, { type: "button", onClick: addRate, children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Toevoegen"] })] }), rates.length === 0 ? (_jsxs("div", { className: "border rounded-md py-10 text-center space-y-2", children: [_jsx(Globe, { className: "w-8 h-8 mx-auto text-muted-foreground" }), _jsx("div", { className: "font-medium", children: "Nog geen landen toegevoegd" }), _jsx("div", { className: "text-sm text-muted-foreground", children: "Voeg een land toe om verzendtarieven in te stellen." })] })) : (_jsx("div", { className: "border rounded-md divide-y", children: rates
+                                                }), children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Ophaalmoment toevoegen"] })] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { type: "checkbox", checked: form.is_default ?? false, onChange: (e) => setForm({ ...form, is_default: e.target.checked }), className: "h-4 w-4 rounded border" }), _jsxs("span", { children: ["Gebruik als ", _jsx("strong", { children: "standaard vervoerder" }), " voor de automatische planning (voor orders zonder eigen vervoerder)."] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Opmerkingen" }), _jsxs("div", { className: "flex gap-2", children: [_jsx(FieldIcon, { icon: FileText }), _jsx(Textarea, { value: form.notes ?? "", onChange: (e) => setForm({ ...form, notes: e.target.value }), placeholder: "Extra informatie over deze vervoerder...", rows: 3, className: "flex-1" })] })] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { className: "text-base", children: "Bedieningsgebied" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Selecteer de landen, provincies en/of plaatsen waar deze vervoerder actief is. Een land dekt automatisch al zijn provincies en plaatsen." })] }), _jsx(CardContent, { children: _jsx(ServiceAreaSelect, { value: {
+                                        countries: form.service_countries ?? [],
+                                        provinces: form.service_provinces ?? [],
+                                        cities: form.service_cities ?? [],
+                                    }, onChange: (next) => setForm({
+                                        ...form,
+                                        service_countries: next.countries,
+                                        service_provinces: next.provinces,
+                                        service_cities: next.cities,
+                                    }) }) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { className: "text-base", children: "Verzendtarieven" }), _jsxs("p", { className: "text-sm text-muted-foreground", children: ["Stel de verzendkosten ", _jsx("strong", { children: "per kwekerskar" }), " in voor elk land waar deze vervoerder naartoe verzendt."] })] }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-[1fr,160px,auto] gap-3", children: [_jsx(CountryPicker, { value: pendingCountry, onChange: setPendingCountry, excluded: rates.map((r) => r.country_code) }), _jsxs("div", { className: "flex items-stretch gap-2 rounded-md border bg-background h-10", children: [_jsx("div", { className: "flex items-center justify-center w-10 bg-primary/10 text-primary rounded-l-md text-sm font-medium", children: "\u20AC" }), _jsx("input", { type: "number", step: "0.01", min: 0, value: pendingPrice, onChange: (e) => setPendingPrice(e.target.value), placeholder: "Prijs", className: "flex-1 bg-transparent text-sm outline-none pr-3" })] }), _jsxs(Button, { type: "button", onClick: addRate, children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Toevoegen"] })] }), rates.length === 0 ? (_jsxs("div", { className: "border rounded-md py-10 text-center space-y-2", children: [_jsx(Globe, { className: "w-8 h-8 mx-auto text-muted-foreground" }), _jsx("div", { className: "font-medium", children: "Nog geen landen toegevoegd" }), _jsx("div", { className: "text-sm text-muted-foreground", children: "Voeg een land toe om verzendtarieven in te stellen." })] })) : (_jsx("div", { className: "border rounded-md divide-y", children: rates
                                             .slice()
                                             .sort((a, b) => countryName(a.country_code).localeCompare(countryName(b.country_code), "nl"))
                                             .map((r) => (_jsxs("div", { className: "flex items-center gap-3 px-3 py-2", children: [_jsx(Globe, { className: "w-4 h-4 text-muted-foreground" }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "text-sm font-medium", children: countryName(r.country_code) }), _jsx("div", { className: "text-xs text-muted-foreground", children: r.country_code })] }), _jsxs("div", { className: "text-sm font-medium", children: ["\u20AC ", r.price_per_trolley.toFixed(2), " ", _jsx("span", { className: "text-muted-foreground font-normal", children: "/ kar" })] }), _jsx("button", { type: "button", onClick: () => removeRate(r.country_code), className: "text-muted-foreground hover:text-destructive", "aria-label": "Verwijderen", children: _jsx(Trash2, { className: "w-4 h-4" }) })] }, r.country_code))) })), _jsxs("p", { className: "text-sm text-muted-foreground", children: ["De prijs per kwekerskar wordt automatisch berekend", " ", _jsx("strong", { children: "bij het aanmaken van een bestelling" }), "."] })] })] }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsxs(Button, { type: "button", variant: "outline", onClick: goBack, children: [_jsx(X, { className: "w-4 h-4 mr-1" }), "Annuleren"] }), _jsx(Button, { type: "submit", disabled: mutation.isPending, children: mutation.isPending ? "Opslaan..." : "Opslaan" })] })] })] }));

package/dist-lib/components/afhandeling/VervoerdersPage.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VervoerdersPage.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/VervoerdersPage.tsx"],"names":[],"mappings":"AAyBA,wBAAgB,eAAe,~~gCAgJ9B~~"}
1	+ {"version":3,"file":"VervoerdersPage.d.ts","sourceRoot":"","sources":["../../../src/components/afhandeling/VervoerdersPage.tsx"],"names":[],"mappings":"AAyBA,wBAAgB,eAAe,gCA6L9B"}

package/dist-lib/components/afhandeling/VervoerdersPage.js CHANGED Viewed

@@ -1,15 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Button, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, toast, } from "@flowselections/core";
-import { Plus, Pencil, Trash2, Truck } from "lucide-react";
+import { Plus, Pencil, Trash2, Truck, ArrowUp, ArrowDown } from "lucide-react";
 import { Link } from "@tanstack/react-router";
 import { useServerFn } from "@tanstack/react-start";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { listCarriers, deleteCarrier } from "../../lib/carriers.functions";
+import { listCarriers, deleteCarrier, reorderCarriers } from "../../lib/carriers.functions";
 export function VervoerdersPage() {
     const queryClient = useQueryClient();
     const fetchList = useServerFn(listCarriers);
     const removeCarrier = useServerFn(deleteCarrier);
+    const reorder = useServerFn(reorderCarriers);
     const [deletingId, setDeletingId] = useState(null);
     const { data, isLoading, error, refetch } = useQuery({
         queryKey: ["carriers"],
@@ -29,13 +30,30 @@ export function VervoerdersPage() {
     });
     const deleteMutation = useMutation({
         mutationFn: (id) => removeCarrier({ data: { id } }),
-        onSuccess: () => {
+        onSuccess: async () => {
             toast.success("Vervoerder verwijderd");
-            queryClient.invalidateQueries({ queryKey: ["carriers"] });
+            const { invalidatePlanning } = await import("../../lib/invalidatePlanning");
+            await invalidatePlanning(queryClient);
             setDeletingId(null);
         },
         onError: (err) => toast.error(err.message),
     });
+    const reorderMutation = useMutation({
+        mutationFn: (orderedIds) => reorder({ data: { orderedIds } }),
+        onSuccess: async () => {
+            const { invalidatePlanning } = await import("../../lib/invalidatePlanning");
+            await invalidatePlanning(queryClient);
+        },
+        onError: (err) => toast.error(err.message),
+    });
     const carriers = data?.carriers ?? [];
-    return (_jsxs("div", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold", children: "Vervoerders" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Beheer vervoerders en hun verzendtarieven per land." })] }), _jsx(Button, { asChild: true, children: _jsxs(Link, { to: "/afhandeling/vervoerders/nieuw", children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Vervoerder toevoegen"] }) })] }), _jsx("div", { className: "border rounded-md bg-card", children: isLoading ? (_jsx("div", { className: "p-12 text-center text-muted-foreground", children: "Laden..." })) : error ? (_jsxs("div", { className: "p-12 text-center space-y-3", children: [_jsxs("div", { className: "text-destructive", children: ["Fout bij laden: ", error.message] }), _jsx(Button, { variant: "outline", onClick: () => refetch(), children: "Opnieuw proberen" })] })) : carriers.length === 0 ? (_jsxs("div", { className: "p-12 text-center space-y-3", children: [_jsx(Truck, { className: "w-10 h-10 mx-auto text-muted-foreground" }), _jsx("div", { className: "font-medium", children: "Nog geen vervoerders" }), _jsx("div", { className: "text-sm text-muted-foreground", children: "Voeg een vervoerder toe om verzendtarieven in te stellen." }), _jsx(Button, { asChild: true, children: _jsxs(Link, { to: "/afhandeling/vervoerders/nieuw", children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Vervoerder toevoegen"] }) })] })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Bedrijfsnaam" }), _jsx(TableHead, { children: "Contactpersoon" }), _jsx(TableHead, { children: "E-mail" }), _jsx(TableHead, { children: "Telefoon" }), _jsx(TableHead, { children: "Levertijd" }), _jsx(TableHead, { children: "Landen" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsx(TableBody, { children: carriers.map((c) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: c.name }), _jsx(TableCell, { children: c.contact_person ?? "—" }), _jsx(TableCell, { children: c.email ?? "—" }), _jsx(TableCell, { children: c.phone ?? "—" }), _jsx(TableCell, { children: c.delivery_days != null ? `${c.delivery_days} dagen` : "—" }), _jsx(TableCell, { children: c.rate_count }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsx(Button, { asChild: true, variant: "ghost", size: "sm", children: _jsx(Link, { to: "/afhandeling/vervoerders/$id/bewerken", params: { id: c.id }, children: _jsx(Pencil, { className: "w-4 h-4" }) }) }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => setDeletingId(c.id), className: "text-destructive hover:text-destructive", children: _jsx(Trash2, { className: "w-4 h-4" }) })] }) })] }, c.id))) })] })) }), _jsx(AlertDialog, { open: !!deletingId, onOpenChange: (o) => !o && setDeletingId(null), children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Vervoerder verwijderen?" }), _jsx(AlertDialogDescription, { children: "Deze actie kan niet ongedaan gemaakt worden. Alle verzendtarieven worden ook verwijderd." })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Annuleren" }), _jsx(AlertDialogAction, { onClick: () => deletingId && deleteMutation.mutate(deletingId), className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: "Verwijderen" })] })] }) })] }));
+    const move = (index, direction) => {
+        const target = index + direction;
+        if (target < 0 || target >= carriers.length)
+            return;
+        const ids = carriers.map((c) => c.id);
+        [ids[index], ids[target]] = [ids[target], ids[index]];
+        reorderMutation.mutate(ids);
+    };
+    return (_jsxs("div", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold", children: "Vervoerders" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Beheer vervoerders en hun verzendtarieven per land." })] }), _jsx(Button, { asChild: true, children: _jsxs(Link, { to: "/afhandeling/vervoerders/nieuw", children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Vervoerder toevoegen"] }) })] }), _jsx("div", { className: "border rounded-md bg-card", children: isLoading ? (_jsx("div", { className: "p-12 text-center text-muted-foreground", children: "Laden..." })) : error ? (_jsxs("div", { className: "p-12 text-center space-y-3", children: [_jsxs("div", { className: "text-destructive", children: ["Fout bij laden: ", error.message] }), _jsx(Button, { variant: "outline", onClick: () => refetch(), children: "Opnieuw proberen" })] })) : carriers.length === 0 ? (_jsxs("div", { className: "p-12 text-center space-y-3", children: [_jsx(Truck, { className: "w-10 h-10 mx-auto text-muted-foreground" }), _jsx("div", { className: "font-medium", children: "Nog geen vervoerders" }), _jsx("div", { className: "text-sm text-muted-foreground", children: "Voeg een vervoerder toe om verzendtarieven in te stellen." }), _jsx(Button, { asChild: true, children: _jsxs(Link, { to: "/afhandeling/vervoerders/nieuw", children: [_jsx(Plus, { className: "w-4 h-4 mr-1" }), "Vervoerder toevoegen"] }) })] })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { className: "w-32", children: "Prioriteit" }), _jsx(TableHead, { children: "Bedrijfsnaam" }), _jsx(TableHead, { children: "Contactpersoon" }), _jsx(TableHead, { children: "E-mail" }), _jsx(TableHead, { children: "Telefoon" }), _jsx(TableHead, { children: "Levertijd" }), _jsx(TableHead, { children: "Landen" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsx(TableBody, { children: carriers.map((c, index) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { className: "w-6 text-sm font-medium tabular-nums text-muted-foreground", children: index + 1 }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => move(index, -1), disabled: index === 0 || reorderMutation.isPending, "aria-label": "Hoger", children: _jsx(ArrowUp, { className: "w-4 h-4" }) }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => move(index, 1), disabled: index === carriers.length - 1 || reorderMutation.isPending, "aria-label": "Lager", children: _jsx(ArrowDown, { className: "w-4 h-4" }) })] }) }), _jsx(TableCell, { className: "font-medium", children: c.name }), _jsx(TableCell, { children: c.contact_person ?? "—" }), _jsx(TableCell, { children: c.email ?? "—" }), _jsx(TableCell, { children: c.phone ?? "—" }), _jsx(TableCell, { children: c.delivery_days != null ? `${c.delivery_days} dagen` : "—" }), _jsx(TableCell, { children: c.rate_count }), _jsx(TableCell, { className: "text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsx(Button, { asChild: true, variant: "ghost", size: "sm", children: _jsx(Link, { to: "/afhandeling/vervoerders/$id/bewerken", params: { id: c.id }, children: _jsx(Pencil, { className: "w-4 h-4" }) }) }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => setDeletingId(c.id), className: "text-destructive hover:text-destructive", children: _jsx(Trash2, { className: "w-4 h-4" }) })] }) })] }, c.id))) })] })) }), _jsx(AlertDialog, { open: !!deletingId, onOpenChange: (o) => !o && setDeletingId(null), children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Vervoerder verwijderen?" }), _jsx(AlertDialogDescription, { children: "Deze actie kan niet ongedaan gemaakt worden. Alle verzendtarieven worden ook verwijderd." })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Annuleren" }), _jsx(AlertDialogAction, { onClick: () => deletingId && deleteMutation.mutate(deletingId), className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: "Verwijderen" })] })] }) })] }));
 }