@flowselections/floriday-afhandeling-module 1.0.25 → 1.0.26

package/dist-lib/components/engine/StrategieenPage.js

@@ -1,80 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { Link } from "@tanstack/react-router";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { useServerFn } from "@tanstack/react-start";
-import { Card, CardContent, CardHeader, CardTitle, CardDescription, Button, Input, Label, Textarea, Badge, Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, toast, } from "@flowselections/core";
-import { Plus, Power, PowerOff, Pencil, Trash2, CalendarRange, Sigma } from "lucide-react";
-import { listStrategies, saveStrategy, deleteStrategy, activateStrategy, deactivateAllStrategies, listSchedules, saveSchedule, deleteSchedule, } from "../../lib/logisticsEngine/strategies.functions";
-export function StrategieenPage() {
-    const qc = useQueryClient();
-    const fetchStrategies = useServerFn(listStrategies);
-    const fetchSchedules = useServerFn(listSchedules);
-    const saveStrat = useServerFn(saveStrategy);
-    const activate = useServerFn(activateStrategy);
-    const deactivateAll = useServerFn(deactivateAllStrategies);
-    const delStrat = useServerFn(deleteStrategy);
-    const saveSched = useServerFn(saveSchedule);
-    const delSched = useServerFn(deleteSchedule);
-    const strategiesQ = useQuery({
-        queryKey: ["logistics", "strategies"],
-        queryFn: async () => (await fetchStrategies()).strategies,
-    });
-    const schedulesQ = useQuery({
-        queryKey: ["logistics", "schedules"],
-        queryFn: async () => (await fetchSchedules()).schedules,
-    });
-    const [editOpen, setEditOpen] = useState(false);
-    const [editing, setEditing] = useState(null);
-    const [schedOpen, setSchedOpen] = useState(false);
-    const [schedStrategy, setSchedStrategy] = useState(null);
-    const invalidate = () => {
-        void qc.invalidateQueries({ queryKey: ["logistics", "strategies"] });
-        void qc.invalidateQueries({ queryKey: ["logistics", "schedules"] });
-    };
-    const saveMut = useMutation({
-        mutationFn: (p) => saveStrat({ data: p }),
-        onSuccess: () => { invalidate(); setEditOpen(false); toast.success("Strategie opgeslagen"); },
-        onError: (e) => toast.error(e.message),
-    });
-    const activateMut = useMutation({
-        mutationFn: (id) => activate({ data: { id } }),
-        onSuccess: () => { invalidate(); toast.success("Strategie geactiveerd"); },
-    });
-    const delMut = useMutation({
-        mutationFn: (id) => delStrat({ data: { id } }),
-        onSuccess: () => { invalidate(); toast.success("Verwijderd"); },
-    });
-    const deactivateMut = useMutation({
-        mutationFn: () => deactivateAll(),
-        onSuccess: () => { invalidate(); toast.success("Alle strategieën gepauzeerd"); },
-    });
-    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex items-start justify-between", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold", children: "Logistieke Strategie\u00EBn" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Iedere strategie bevat zijn eigen complete instellingen. Er mag altijd maximaal \u00E9\u00E9n strategie actief zijn." })] }), _jsxs("div", { className: "flex gap-2", children: [_jsxs(Button, { variant: "outline", onClick: () => deactivateMut.mutate(), children: [_jsx(PowerOff, { className: "w-4 h-4 mr-2" }), " Alles pauzeren"] }), _jsxs(Button, { onClick: () => { setEditing({ name: "", priority: 100, color: "#3b82f6" }); setEditOpen(true); }, children: [_jsx(Plus, { className: "w-4 h-4 mr-2" }), " Nieuwe strategie"] })] })] }), _jsxs("div", { className: "grid gap-3 md:grid-cols-2", children: [(strategiesQ.data ?? []).map((s) => (_jsxs(Card, { className: s.is_active ? "border-primary" : "", children: [_jsxs(CardHeader, { className: "flex-row items-start justify-between gap-2 space-y-0", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-4 h-4 rounded", style: { background: s.color } }), _jsxs("div", { children: [_jsx(CardTitle, { className: "text-base", children: s.name }), _jsxs(CardDescription, { children: ["prio ", s.priority, " \u00B7 v", s.version, " \u00B7 gewijzigd ", new Date(s.updated_at).toLocaleString("nl-NL")] })] })] }), s.is_active && _jsx(Badge, { children: "Actief" })] }), _jsxs(CardContent, { className: "space-y-3", children: [s.description && _jsx("p", { className: "text-sm text-muted-foreground", children: s.description }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsxs(Button, { size: "sm", variant: s.is_active ? "outline" : "default", onClick: () => activateMut.mutate(s.id), children: [_jsx(Power, { className: "w-4 h-4 mr-2" }), " ", s.is_active ? "Opnieuw activeren" : "Activeren"] }), _jsxs(Button, { size: "sm", variant: "outline", onClick: () => { setEditing(s); setEditOpen(true); }, children: [_jsx(Pencil, { className: "w-4 h-4 mr-2" }), " Bewerken"] }), _jsxs(Button, { size: "sm", variant: "outline", onClick: () => { setSchedStrategy(s); setSchedOpen(true); }, children: [_jsx(CalendarRange, { className: "w-4 h-4 mr-2" }), " Planner"] }), _jsx(Button, { size: "sm", variant: "outline", asChild: true, children: _jsxs(Link, { to: "/afhandeling/engine/formules", search: { strategy: s.id }, children: [_jsx(Sigma, { className: "w-4 h-4 mr-2" }), " Formules"] }) }), _jsx(Button, { size: "sm", variant: "ghost", className: "text-destructive", onClick: () => {
-                                                    if (confirm(`Verwijder strategie "${s.name}"?`))
-                                                        delMut.mutate(s.id);
-                                                }, children: _jsx(Trash2, { className: "w-4 h-4" }) })] })] })] }, s.id))), (strategiesQ.data ?? []).length === 0 && !strategiesQ.isLoading && (_jsx(Card, { children: _jsx(CardContent, { className: "py-8 text-center text-muted-foreground", children: "Nog geen strategie\u00EBn. Klik op \"Nieuwe strategie\" om te starten." }) }))] }), _jsx(Dialog, { open: editOpen, onOpenChange: setEditOpen, children: _jsxs(DialogContent, { children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: editing?.id ? "Strategie bewerken" : "Nieuwe strategie" }) }), _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { children: [_jsx(Label, { children: "Naam" }), _jsx(Input, { value: editing?.name ?? "", onChange: (e) => setEditing({ ...editing, name: e.target.value }) })] }), _jsxs("div", { children: [_jsx(Label, { children: "Omschrijving" }), _jsx(Textarea, { rows: 3, value: editing?.description ?? "", onChange: (e) => setEditing({ ...editing, description: e.target.value }) })] }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { children: [_jsx(Label, { children: "Prioriteit" }), _jsx(Input, { type: "number", value: editing?.priority ?? 100, onChange: (e) => setEditing({ ...editing, priority: Number(e.target.value) }) })] }), _jsxs("div", { children: [_jsx(Label, { children: "Kleur" }), _jsx(Input, { type: "color", value: editing?.color ?? "#3b82f6", onChange: (e) => setEditing({ ...editing, color: e.target.value }) })] })] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "outline", onClick: () => setEditOpen(false), children: "Annuleren" }), _jsx(Button, { onClick: () => saveMut.mutate({
-                                        id: editing?.id, name: editing?.name ?? "",
-                                        description: editing?.description ?? null,
-                                        priority: editing?.priority, color: editing?.color,
-                                    }), children: "Opslaan" })] })] }) }), _jsx(SchedulesDialog, { open: schedOpen, onOpenChange: setSchedOpen, strategy: schedStrategy, schedules: (schedulesQ.data ?? []).filter((x) => x.strategy_id === schedStrategy?.id), onSave: (p) => saveSched({ data: p }).then(invalidate), onDelete: (id) => delSched({ data: { id } }).then(invalidate) })] }));
-}
-function SchedulesDialog(props) {
-    const [draft, setDraft] = useState({ rule_type: "date_range", start_date: "", end_date: "", condition_expression: "", priority: 100 });
-    if (!props.strategy)
-        return null;
-    return (_jsx(Dialog, { open: props.open, onOpenChange: props.onOpenChange, children: _jsxs(DialogContent, { className: "max-w-2xl", children: [_jsx(DialogHeader, { children: _jsxs(DialogTitle, { children: ["Planner \u2014 ", props.strategy.name] }) }), _jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "space-y-2", children: [props.schedules.length === 0 && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Nog geen automatische regels. Voeg er een toe:" })), props.schedules.map((s) => (_jsxs("div", { className: "flex items-center justify-between border rounded p-2 text-sm", children: [_jsxs("div", { children: [_jsx(Badge, { variant: "outline", children: s.rule_type === "date_range" ? "Datum" : "Conditie" }), " ", s.rule_type === "date_range"
-                                                    ? `${s.start_date ?? "…"} → ${s.end_date ?? "…"}`
-                                                    : _jsx("code", { className: "bg-muted px-1 rounded", children: s.condition_expression }), _jsxs("span", { className: "text-muted-foreground ml-2", children: ["prio ", s.priority] })] }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => props.onDelete(s.id), children: _jsx(Trash2, { className: "w-4 h-4" }) })] }, s.id)))] }), _jsxs("div", { className: "border rounded p-3 space-y-3", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { size: "sm", variant: draft.rule_type === "date_range" ? "default" : "outline", onClick: () => setDraft({ ...draft, rule_type: "date_range" }), children: "Datumreeks" }), _jsx(Button, { size: "sm", variant: draft.rule_type === "condition" ? "default" : "outline", onClick: () => setDraft({ ...draft, rule_type: "condition" }), children: "Conditie" })] }), draft.rule_type === "date_range" ? (_jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsxs("div", { children: [_jsx(Label, { children: "Van" }), _jsx(Input, { type: "date", value: draft.start_date, onChange: (e) => setDraft({ ...draft, start_date: e.target.value }) })] }), _jsxs("div", { children: [_jsx(Label, { children: "Tot" }), _jsx(Input, { type: "date", value: draft.end_date, onChange: (e) => setDraft({ ...draft, end_date: e.target.value }) })] })] })) : (_jsxs("div", { children: [_jsxs(Label, { children: ["Conditie-formule (bv. ", _jsx("code", { children: "openCarts > 40" }), ")"] }), _jsx(Input, { value: draft.condition_expression, onChange: (e) => setDraft({ ...draft, condition_expression: e.target.value }) })] })), _jsxs("div", { children: [_jsx(Label, { children: "Prioriteit" }), _jsx(Input, { type: "number", value: draft.priority, onChange: (e) => setDraft({ ...draft, priority: Number(e.target.value) }) })] }), _jsxs(Button, { size: "sm", onClick: async () => {
-                                        await props.onSave({
-                                            strategy_id: props.strategy.id,
-                                            rule_type: draft.rule_type,
-                                            start_date: draft.rule_type === "date_range" ? draft.start_date || null : null,
-                                            end_date: draft.rule_type === "date_range" ? draft.end_date || null : null,
-                                            condition_expression: draft.rule_type === "condition" ? draft.condition_expression : null,
-                                            priority: draft.priority,
-                                            is_enabled: true,
-                                        });
-                                        setDraft({ rule_type: "date_range", start_date: "", end_date: "", condition_expression: "", priority: 100 });
-                                        toast.success("Regel toegevoegd");
-                                    }, children: [_jsx(Plus, { className: "w-4 h-4 mr-2" }), " Regel toevoegen"] })] })] }), _jsx(DialogFooter, { children: _jsx(Button, { variant: "outline", onClick: () => props.onOpenChange(false), children: "Sluiten" }) })] }) }));
-}