Checkpoint: Implémentation complète de la fonctionnalité "Gestion des plans de formations" :

- Schéma DB : 3 nouvelles tables (catalogueFormation, planFormation, planFormationItem)
- Backend tRPC : routers catalogue et planFormation (CRUD, import bulk CSV, suggestions, toggle validée Itinova)
- Frontend : page Plans de formation (liste par établissement/année, CRUD, soumission/validation)
- Frontend : page Détail plan (items, liaison catalogue, suggestions automatiques)
- Frontend : page Catalogue de formation (liste, filtres thème/Itinova/OPCO, import CSV, badges)
- Menu sidebar : nouvelle section "Plans de formations" avec sous-menus
- Tests unitaires : 13 tests (scoring suggestions, validation données, parsing CSV)

.gitignore

@@ -110,3 +110,4 @@ temp/
 backups/
 *.sql
 *.dump
+.project-config.json

client/src/App.tsx

@@ -44,6 +44,9 @@ import EmargementFormateurScan from "./pages/EmargementFormateurScan";
 import SignerAttestation from "./pages/SignerAttestation";
 import ForgotPassword from "./pages/ForgotPassword";
 import ResetPassword from "./pages/ResetPassword";
+import PlanFormation from "./pages/PlanFormation";
+import PlanFormationDetail from "./pages/PlanFormationDetail";
+import CatalogueFormation from "./pages/CatalogueFormation";
 
 function Router() {
   return (
@@ -87,6 +90,9 @@ function Router() {
       <Route path={"/formateur/emargement"} component={FormateurEmargement} />
       <Route path={"/emargement/:token"} component={EmargementScan} />
       <Route path={"/emargement-formateur/:token"} component={EmargementFormateurScan} />
+      <Route path={"/admin/plans-formation"} component={PlanFormation} />
+      <Route path={"/admin/plans-formation/:id"} component={PlanFormationDetail} />
+      <Route path={"/admin/catalogue-formation"} component={CatalogueFormation} />
       <Route path={"/signer-attestation/:id"} component={SignerAttestation} />
       <Route path={"/404"} component={NotFound} />
       {/* Final fallback route */}

client/src/components/DashboardLayout.tsx

@@ -21,7 +21,7 @@ import {
 } from "@/components/ui/sidebar";
 import { APP_LOGO, APP_TITLE, getLoginUrl } from "@/const";
 import { useIsMobile } from "@/hooks/useMobile";
-import { LayoutDashboard, LogOut, PanelLeft, Users, GraduationCap, Calendar, CalendarDays, Bell, BarChart3, UserCog, Mail, Settings, TrendingUp, Building2, FileSpreadsheet, ClipboardList, ChevronDown, User, FileText, QrCode, Shield } from "lucide-react";
+import { LayoutDashboard, LogOut, PanelLeft, Users, GraduationCap, Calendar, CalendarDays, Bell, BarChart3, UserCog, Mail, Settings, TrendingUp, Building2, FileSpreadsheet, ClipboardList, ChevronDown, User, FileText, QrCode, Shield, BookOpen, Library } from "lucide-react";
 import { CSSProperties, useEffect, useRef, useState } from "react";
 import { useLocation } from "wouter";
 import { DashboardLayoutSkeleton } from './DashboardLayoutSkeleton';
@@ -36,6 +36,7 @@ const getCategoryColor = (sectionTitle: string) => {
     "Traçabilité": "text-purple-500",
     "Analyses": "text-pink-500",
     "Gestion technique": "text-red-500",
+    "Plans de formations": "text-teal-600",
   };
   return colors[sectionTitle] || "text-gray-500";
 };
@@ -48,6 +49,7 @@ const getCategoryGradient = (sectionTitle: string) => {
     "Traçabilité": "from-purple-300 to-purple-400",
     "Analyses": "from-pink-300 to-pink-400",
     "Gestion technique": "from-red-300 to-red-400",
+    "Plans de formations": "from-teal-300 to-teal-400",
   };
   return gradients[sectionTitle] || "from-gray-300 to-gray-400";
 };
@@ -60,6 +62,7 @@ const getCategoryBgColor = (sectionTitle: string) => {
     "Traçabilité": "bg-purple-50/80 hover:bg-purple-100/90",
     "Analyses": "bg-pink-50/80 hover:bg-pink-100/90",
     "Gestion technique": "bg-red-50/80 hover:bg-red-100/90",
+    "Plans de formations": "bg-teal-50/80 hover:bg-teal-100/90",
   };
   return bgColors[sectionTitle] || "bg-gray-50/80 hover:bg-gray-100/90";
 };
@@ -114,6 +117,13 @@ const menuSections = [
       { icon: BarChart3, label: "Statistiques des rappels", path: "/admin/rappels/statistiques" },
     ]
   },
+  {
+    title: "Plans de formations",
+    items: [
+      { icon: BookOpen, label: "Plans de formations", path: "/admin/plans-formation" },
+      { icon: Library, label: "Catalogue de formation", path: "/admin/catalogue-formation" },
+    ]
+  },
   {
     title: "Gestion technique",
     items: [

client/src/pages/CatalogueFormation.tsx

@@ -0,0 +1,650 @@
+import { useState, useRef, useMemo } from "react";
+import { useAuth } from "@/_core/hooks/useAuth";
+import DashboardLayout from "@/components/DashboardLayout";
+import { trpc } from "@/lib/trpc";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { Switch } from "@/components/ui/switch";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { toast } from "sonner";
+import {
+  Plus, Pencil, Trash2, Library, CheckCircle2,
+  Upload, Search, Filter, Loader2, Star, Euro,
+  X, ChevronDown, ChevronUp
+} from "lucide-react";
+
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+
+function parseCsvLine(line: string): string[] {
+  const result: string[] = [];
+  let current = "";
+  let inQuotes = false;
+  for (let i = 0; i < line.length; i++) {
+    const ch = line[i];
+    if (ch === '"') {
+      inQuotes = !inQuotes;
+    } else if ((ch === "," || ch === ";") && !inQuotes) {
+      result.push(current.trim());
+      current = "";
+    } else {
+      current += ch;
+    }
+  }
+  result.push(current.trim());
+  return result;
+}
+
+function parseCsvContent(content: string) {
+  const lines = content.split(/\r?\n/).filter(l => l.trim());
+  if (lines.length < 2) return [];
+  const headers = parseCsvLine(lines[0]).map(h => h.toLowerCase().replace(/[^a-z]/g, ""));
+  return lines.slice(1).map(line => {
+    const values = parseCsvLine(line);
+    const obj: Record<string, string> = {};
+    headers.forEach((h, i) => { obj[h] = values[i] ?? ""; });
+    return obj;
+  }).filter(r => r[headers[0]]);
+}
+
+function mapCsvRow(row: Record<string, string>) {
+  const get = (...keys: string[]) => {
+    for (const k of keys) {
+      const found = Object.keys(row).find(rk => rk.includes(k));
+      if (found && row[found]) return row[found];
+    }
+    return undefined;
+  };
+  return {
+    intitule: get("intitul", "titre", "nom", "formation") ?? "",
+    theme: get("theme", "categorie", "domaine"),
+    motsCles: get("motscles", "mots", "tags", "keywords"),
+    duree: get("duree", "dur"),
+    prestataire: get("prestataire", "organisme", "fournisseur"),
+    description: get("description", "detail"),
+    objectifs: get("objectifs", "objectif"),
+    publicConcerne: get("public", "destinataire", "cible"),
+    opcoEligible: ["oui", "true", "1", "x"].includes((get("opco", "eligible") ?? "").toLowerCase()),
+    budgetOpco: get("budget", "cout", "prix", "tarif"),
+    referenceOpco: get("reference", "ref", "code"),
+  };
+}
+
+// ─── Composant principal ──────────────────────────────────────────────────────
+
+export default function CatalogueFormation() {
+  const { user } = useAuth();
+  const isAdmin = user?.role === "admin";
+
+  // Filtres
+  const [search, setSearch] = useState("");
+  const [filtreTheme, setFiltreTheme] = useState("all");
+  const [filtreValidee, setFiltreValidee] = useState("all");
+  const [filtreOpco, setFiltreOpco] = useState("all");
+  const [showFilters, setShowFilters] = useState(false);
+
+  // Dialogs
+  const [showCreate, setShowCreate] = useState(false);
+  const [showImport, setShowImport] = useState(false);
+  const [editFormation, setEditFormation] = useState<null | typeof emptyForm & { id: number }>(null);
+  const [expandedId, setExpandedId] = useState<number | null>(null);
+
+  // Import CSV
+  const fileRef = useRef<HTMLInputElement>(null);
+  const [csvRows, setCsvRows] = useState<ReturnType<typeof mapCsvRow>[]>([]);
+  const [csvFileName, setCsvFileName] = useState("");
+
+  // Formulaire
+  const emptyForm = {
+    intitule: "", theme: "", motsCles: "", duree: "", prestataire: "",
+    description: "", objectifs: "", publicConcerne: "",
+    validateeItinova: false, opcoEligible: false, budgetOpco: "", referenceOpco: "",
+  };
+  const [form, setForm] = useState(emptyForm);
+
+  const utils = trpc.useUtils();
+
+  const { data: formations = [], isLoading } = trpc.catalogue.list.useQuery({});
+  const { data: themes = [] } = trpc.catalogue.themes.useQuery();
+
+  const createM = trpc.catalogue.create.useMutation({
+    onSuccess: () => {
+      toast.success("Formation ajoutée au catalogue");
+      utils.catalogue.list.invalidate();
+      utils.catalogue.themes.invalidate();
+      setShowCreate(false);
+      setForm(emptyForm);
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const updateM = trpc.catalogue.update.useMutation({
+    onSuccess: () => {
+      toast.success("Formation mise à jour");
+      utils.catalogue.list.invalidate();
+      utils.catalogue.themes.invalidate();
+      setEditFormation(null);
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const deleteM = trpc.catalogue.delete.useMutation({
+    onSuccess: () => {
+      toast.success("Formation supprimée du catalogue");
+      utils.catalogue.list.invalidate();
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const toggleValideeM = trpc.catalogue.toggleValideeItinova.useMutation({
+    onSuccess: () => {
+      utils.catalogue.list.invalidate();
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const importM = trpc.catalogue.importBulk.useMutation({
+    onSuccess: (data) => {
+      toast.success(`${data.inserted} formation(s) importée(s) avec succès`);
+      utils.catalogue.list.invalidate();
+      utils.catalogue.themes.invalidate();
+      setShowImport(false);
+      setCsvRows([]);
+      setCsvFileName("");
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  // Filtrage
+  const filtered = useMemo(() => {
+    return formations.filter(f => {
+      if (search) {
+        const s = search.toLowerCase();
+        if (!f.intitule.toLowerCase().includes(s) &&
+          !(f.theme ?? "").toLowerCase().includes(s) &&
+          !(f.prestataire ?? "").toLowerCase().includes(s) &&
+          !(f.motsCles ?? "").toLowerCase().includes(s)) return false;
+      }
+      if (filtreTheme !== "all" && f.theme !== filtreTheme) return false;
+      if (filtreValidee === "oui" && !f.validateeItinova) return false;
+      if (filtreValidee === "non" && f.validateeItinova) return false;
+      if (filtreOpco === "oui" && !f.opcoEligible) return false;
+      if (filtreOpco === "non" && f.opcoEligible) return false;
+      return true;
+    });
+  }, [formations, search, filtreTheme, filtreValidee, filtreOpco]);
+
+  // Stats
+  const stats = useMemo(() => ({
+    total: formations.length,
+    validees: formations.filter(f => f.validateeItinova).length,
+    opco: formations.filter(f => f.opcoEligible).length,
+  }), [formations]);
+
+  function handleFileChange(e: React.ChangeEvent<HTMLInputElement>) {
+    const file = e.target.files?.[0];
+    if (!file) return;
+    setCsvFileName(file.name);
+    const reader = new FileReader();
+    reader.onload = (ev) => {
+      const content = ev.target?.result as string;
+      const rows = parseCsvContent(content);
+      const mapped = rows.map(mapCsvRow).filter(r => r.intitule);
+      setCsvRows(mapped);
+      if (mapped.length === 0) {
+        toast.error("Aucune ligne valide trouvée. Vérifiez le format du fichier.");
+      } else {
+        toast.success(`${mapped.length} formation(s) détectée(s) — vérifiez avant d'importer`);
+      }
+    };
+    reader.readAsText(file, "UTF-8");
+  }
+
+  function handleImport() {
+    if (csvRows.length === 0) return;
+    importM.mutate({ formations: csvRows.filter(r => r.intitule), source: "import_csv" });
+  }
+
+  function handleCreate() {
+    if (!form.intitule.trim()) { toast.error("L'intitulé est obligatoire"); return; }
+    createM.mutate({ ...form, budgetOpco: form.budgetOpco || undefined });
+  }
+
+  function handleUpdate() {
+    if (!editFormation) return;
+    const { id: _id, ...editData } = editFormation;
+    updateM.mutate({ id: editFormation.id, ...editData, budgetOpco: editFormation.budgetOpco || undefined });
+  }
+
+  return (
+    <DashboardLayout>
+      <div className="p-6 space-y-6">
+        {/* En-tête */}
+        <div className="flex items-center justify-between">
+          <div className="flex items-center gap-3">
+            <div className="p-2 bg-teal-100 rounded-lg">
+              <Library className="h-6 w-6 text-teal-600" />
+            </div>
+            <div>
+              <h1 className="text-2xl font-bold text-gray-900">Catalogue de formation</h1>
+              <p className="text-sm text-gray-500">Référentiel partagé des formations disponibles</p>
+            </div>
+          </div>
+          {isAdmin && (
+            <div className="flex gap-2">
+              <Button variant="outline" onClick={() => setShowImport(true)}>
+                <Upload className="h-4 w-4 mr-2" />
+                Importer CSV
+              </Button>
+              <Button onClick={() => setShowCreate(true)} className="bg-teal-600 hover:bg-teal-700">
+                <Plus className="h-4 w-4 mr-2" />
+                Ajouter
+              </Button>
+            </div>
+          )}
+        </div>
+
+        {/* Stats */}
+        <div className="grid grid-cols-3 gap-4">
+          <Card className="border-l-4 border-l-teal-400">
+            <CardContent className="p-4">
+              <p className="text-xs text-gray-500 uppercase tracking-wide">Total</p>
+              <p className="text-2xl font-bold text-teal-700">{stats.total}</p>
+            </CardContent>
+          </Card>
+          <Card className="border-l-4 border-l-green-400">
+            <CardContent className="p-4">
+              <p className="text-xs text-green-600 uppercase tracking-wide">Validées Itinova</p>
+              <p className="text-2xl font-bold text-green-700">{stats.validees}</p>
+            </CardContent>
+          </Card>
+          <Card className="border-l-4 border-l-blue-400">
+            <CardContent className="p-4">
+              <p className="text-xs text-blue-600 uppercase tracking-wide">Éligibles OPCO</p>
+              <p className="text-2xl font-bold text-blue-700">{stats.opco}</p>
+            </CardContent>
+          </Card>
+        </div>
+
+        {/* Barre de recherche et filtres */}
+        <Card>
+          <CardContent className="p-4 space-y-3">
+            <div className="flex gap-3">
+              <div className="relative flex-1">
+                <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" />
+                <Input
+                  className="pl-9"
+                  placeholder="Rechercher par intitulé, thème, prestataire, mots-clés..."
+                  value={search}
+                  onChange={e => setSearch(e.target.value)}
+                />
+                {search && (
+                  <button className="absolute right-3 top-1/2 -translate-y-1/2" onClick={() => setSearch("")}>
+                    <X className="h-4 w-4 text-gray-400 hover:text-gray-600" />
+                  </button>
+                )}
+              </div>
+              <Button variant="outline" onClick={() => setShowFilters(!showFilters)}>
+                <Filter className="h-4 w-4 mr-2" />
+                Filtres
+                {showFilters ? <ChevronUp className="h-3 w-3 ml-1" /> : <ChevronDown className="h-3 w-3 ml-1" />}
+              </Button>
+            </div>
+            {showFilters && (
+              <div className="flex flex-wrap gap-3 pt-2 border-t">
+                <Select value={filtreTheme} onValueChange={setFiltreTheme}>
+                  <SelectTrigger className="w-44">
+                    <SelectValue placeholder="Thème" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">Tous les thèmes</SelectItem>
+                    {themes.map(t => <SelectItem key={t} value={t}>{t}</SelectItem>)}
+                  </SelectContent>
+                </Select>
+                <Select value={filtreValidee} onValueChange={setFiltreValidee}>
+                  <SelectTrigger className="w-44">
+                    <SelectValue placeholder="Validée Itinova" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">Toutes</SelectItem>
+                    <SelectItem value="oui">Validées Itinova</SelectItem>
+                    <SelectItem value="non">Non validées</SelectItem>
+                  </SelectContent>
+                </Select>
+                <Select value={filtreOpco} onValueChange={setFiltreOpco}>
+                  <SelectTrigger className="w-40">
+                    <SelectValue placeholder="OPCO" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">Toutes</SelectItem>
+                    <SelectItem value="oui">Éligibles OPCO</SelectItem>
+                    <SelectItem value="non">Non éligibles</SelectItem>
+                  </SelectContent>
+                </Select>
+                <span className="text-sm text-gray-500 self-center ml-auto">{filtered.length} résultat(s)</span>
+              </div>
+            )}
+          </CardContent>
+        </Card>
+
+        {/* Liste */}
+        {isLoading ? (
+          <div className="flex items-center justify-center py-12">
+            <Loader2 className="h-8 w-8 animate-spin text-teal-600" />
+          </div>
+        ) : filtered.length === 0 ? (
+          <Card>
+            <CardContent className="p-12 text-center">
+              <Library className="h-12 w-12 text-gray-300 mx-auto mb-4" />
+              <p className="text-gray-500 text-lg">Aucune formation dans le catalogue</p>
+              {isAdmin && (
+                <div className="flex gap-3 justify-center mt-4">
+                  <Button variant="outline" onClick={() => setShowImport(true)}>
+                    <Upload className="h-4 w-4 mr-2" />
+                    Importer CSV
+                  </Button>
+                  <Button onClick={() => setShowCreate(true)} className="bg-teal-600 hover:bg-teal-700">
+                    <Plus className="h-4 w-4 mr-2" />
+                    Ajouter manuellement
+                  </Button>
+                </div>
+              )}
+            </CardContent>
+          </Card>
+        ) : (
+          <div className="space-y-2">
+            {filtered.map(f => (
+              <Card key={f.id} className={`hover:shadow-md transition-all border-l-4 ${f.validateeItinova ? "border-l-teal-500" : "border-l-gray-200"}`}>
+                <CardContent className="p-4">
+                  <div className="flex items-start justify-between gap-4">
+                    <div className="flex-1 min-w-0">
+                      <div className="flex items-center gap-2 flex-wrap">
+                        <span className="font-semibold text-gray-900">{f.intitule}</span>
+                        {f.validateeItinova && (
+                          <Badge className="bg-teal-600 text-white text-xs">
+                            <CheckCircle2 className="h-3 w-3 mr-1" />
+                            Validée Itinova
+                          </Badge>
+                        )}
+                        {f.opcoEligible && (
+                          <Badge className="bg-blue-100 text-blue-700 border-blue-200 text-xs">
+                            <Euro className="h-3 w-3 mr-1" />
+                            OPCO
+                          </Badge>
+                        )}
+                        {f.theme && (
+                          <Badge variant="outline" className="text-gray-500 text-xs">{f.theme}</Badge>
+                        )}
+                      </div>
+                      <div className="flex flex-wrap gap-3 mt-1 text-xs text-gray-500">
+                        {f.duree && <span>⏱ {f.duree}</span>}
+                        {f.prestataire && <span>🏢 {f.prestataire}</span>}
+                        {f.publicConcerne && <span>👥 {f.publicConcerne}</span>}
+                        {f.budgetOpco && <span>💰 OPCO : {f.budgetOpco} €</span>}
+                        {f.motsCles && <span className="text-gray-400">🏷 {f.motsCles}</span>}
+                      </div>
+                      {/* Détails dépliables */}
+                      {expandedId === f.id && (
+                        <div className="mt-3 space-y-2 text-sm text-gray-600 border-t pt-3">
+                          {f.description && <p><strong>Description :</strong> {f.description}</p>}
+                          {f.objectifs && <p><strong>Objectifs :</strong> {f.objectifs}</p>}
+                          {f.referenceOpco && <p><strong>Référence OPCO :</strong> {f.referenceOpco}</p>}
+                          <p className="text-xs text-gray-400">Source : {f.source}</p>
+                        </div>
+                      )}
+                      {(f.description || f.objectifs) && (
+                        <button
+                          className="text-xs text-teal-600 hover:text-teal-800 mt-1 flex items-center gap-1"
+                          onClick={() => setExpandedId(expandedId === f.id ? null : f.id)}
+                        >
+                          {expandedId === f.id ? <><ChevronUp className="h-3 w-3" />Réduire</> : <><ChevronDown className="h-3 w-3" />Voir détails</>}
+                        </button>
+                      )}
+                    </div>
+                    {isAdmin && (
+                      <div className="flex items-center gap-1 flex-shrink-0">
+                        {/* Toggle Validée Itinova */}
+                        <Button
+                          size="sm"
+                          variant="ghost"
+                          className={f.validateeItinova ? "text-teal-600 hover:text-teal-800 hover:bg-teal-50" : "text-gray-400 hover:text-teal-600 hover:bg-teal-50"}
+                          title={f.validateeItinova ? "Retirer la validation Itinova" : "Marquer comme validée Itinova"}
+                          onClick={() => toggleValideeM.mutate({ id: f.id, valeur: !f.validateeItinova })}
+                        >
+                          <Star className={`h-4 w-4 ${f.validateeItinova ? "fill-teal-500" : ""}`} />
+                        </Button>
+                        <Button
+                          size="sm"
+                          variant="ghost"
+                          className="text-blue-500 hover:text-blue-700 hover:bg-blue-50"
+                          onClick={() => setEditFormation({
+                            id: f.id,
+                            intitule: f.intitule,
+                            theme: f.theme ?? "",
+                            motsCles: f.motsCles ?? "",
+                            duree: f.duree ?? "",
+                            prestataire: f.prestataire ?? "",
+                            description: f.description ?? "",
+                            objectifs: f.objectifs ?? "",
+                            publicConcerne: f.publicConcerne ?? "",
+                            validateeItinova: f.validateeItinova,
+                            opcoEligible: f.opcoEligible,
+                            budgetOpco: f.budgetOpco ?? "",
+                            referenceOpco: f.referenceOpco ?? "",
+                          })}
+                        >
+                          <Pencil className="h-4 w-4" />
+                        </Button>
+                        <Button
+                          size="sm"
+                          variant="ghost"
+                          className="text-red-500 hover:text-red-700 hover:bg-red-50"
+                          onClick={() => {
+                            if (confirm("Supprimer cette formation du catalogue ?")) {
+                              deleteM.mutate({ id: f.id });
+                            }
+                          }}
+                        >
+                          <Trash2 className="h-4 w-4" />
+                        </Button>
+                      </div>
+                    )}
+                  </div>
+                </CardContent>
+              </Card>
+            ))}
+          </div>
+        )}
+      </div>
+
+      {/* Dialog : Créer */}
+      <Dialog open={showCreate} onOpenChange={setShowCreate}>
+        <DialogContent className="max-w-2xl max-h-[85vh] overflow-y-auto">
+          <DialogHeader>
+            <DialogTitle className="flex items-center gap-2">
+              <Library className="h-5 w-5 text-teal-600" />
+              Ajouter au catalogue
+            </DialogTitle>
+          </DialogHeader>
+          <FormFields form={form} setForm={setForm} />
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setShowCreate(false)}>Annuler</Button>
+            <Button onClick={handleCreate} disabled={createM.isPending} className="bg-teal-600 hover:bg-teal-700">
+              {createM.isPending ? <Loader2 className="h-4 w-4 animate-spin mr-2" /> : null}
+              Ajouter
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {/* Dialog : Modifier */}
+      <Dialog open={!!editFormation} onOpenChange={() => setEditFormation(null)}>
+        <DialogContent className="max-w-2xl max-h-[85vh] overflow-y-auto">
+          <DialogHeader>
+            <DialogTitle>Modifier la formation</DialogTitle>
+          </DialogHeader>
+          {editFormation && (
+            <FormFields form={editFormation} setForm={(fn) => setEditFormation(prev => prev ? { ...prev, ...fn(prev) } : null)} />
+          )}
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setEditFormation(null)}>Annuler</Button>
+            <Button onClick={handleUpdate} disabled={updateM.isPending} className="bg-teal-600 hover:bg-teal-700">
+              {updateM.isPending ? <Loader2 className="h-4 w-4 animate-spin mr-2" /> : null}
+              Enregistrer
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {/* Dialog : Import CSV */}
+      <Dialog open={showImport} onOpenChange={setShowImport}>
+        <DialogContent className="max-w-3xl max-h-[85vh] overflow-y-auto">
+          <DialogHeader>
+            <DialogTitle className="flex items-center gap-2">
+              <Upload className="h-5 w-5 text-teal-600" />
+              Importer depuis un fichier CSV
+            </DialogTitle>
+          </DialogHeader>
+          <div className="space-y-4 py-2">
+            <div className="p-4 bg-blue-50 border border-blue-200 rounded-lg text-sm text-blue-700">
+              <strong>Format attendu :</strong> fichier CSV (séparateur virgule ou point-virgule) avec en-têtes.
+              <br />Colonnes reconnues : <code>intitule</code>, <code>theme</code>, <code>duree</code>, <code>prestataire</code>, <code>public</code>, <code>description</code>, <code>objectifs</code>, <code>motsCles</code>, <code>opco</code>, <code>budget</code>, <code>reference</code>.
+            </div>
+            <div
+              className="border-2 border-dashed border-teal-300 rounded-lg p-8 text-center cursor-pointer hover:bg-teal-50 transition-colors"
+              onClick={() => fileRef.current?.click()}
+            >
+              <Upload className="h-10 w-10 text-teal-400 mx-auto mb-3" />
+              <p className="text-gray-600">{csvFileName || "Cliquez pour sélectionner un fichier CSV"}</p>
+              <p className="text-xs text-gray-400 mt-1">Formats acceptés : .csv, .txt</p>
+              <input ref={fileRef} type="file" accept=".csv,.txt" className="hidden" onChange={handleFileChange} />
+            </div>
+            {csvRows.length > 0 && (
+              <div>
+                <p className="text-sm font-medium text-gray-700 mb-2">{csvRows.length} formation(s) prête(s) à importer :</p>
+                <div className="max-h-48 overflow-y-auto border rounded-lg divide-y">
+                  {csvRows.slice(0, 20).map((r, i) => (
+                    <div key={i} className="p-2 text-sm flex items-center gap-2">
+                      <span className="text-gray-400 w-6 text-right">{i + 1}.</span>
+                      <span className="font-medium text-gray-900">{r.intitule}</span>
+                      {r.theme && <Badge variant="outline" className="text-xs">{r.theme}</Badge>}
+                      {r.duree && <span className="text-gray-400 text-xs">{r.duree}</span>}
+                      {r.opcoEligible && <Badge className="bg-blue-100 text-blue-700 text-xs">OPCO</Badge>}
+                    </div>
+                  ))}
+                  {csvRows.length > 20 && (
+                    <div className="p-2 text-center text-xs text-gray-400">... et {csvRows.length - 20} autres</div>
+                  )}
+                </div>
+              </div>
+            )}
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => { setShowImport(false); setCsvRows([]); setCsvFileName(""); }}>Annuler</Button>
+            <Button
+              onClick={handleImport}
+              disabled={csvRows.length === 0 || importM.isPending}
+              className="bg-teal-600 hover:bg-teal-700"
+            >
+              {importM.isPending ? <Loader2 className="h-4 w-4 animate-spin mr-2" /> : null}
+              Importer {csvRows.length > 0 ? `(${csvRows.length})` : ""}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </DashboardLayout>
+  );
+}
+
+// ─── Sous-composant formulaire ────────────────────────────────────────────────
+
+type FormType = {
+  intitule: string; theme: string; motsCles: string; duree: string; prestataire: string;
+  description: string; objectifs: string; publicConcerne: string;
+  validateeItinova: boolean; opcoEligible: boolean; budgetOpco: string; referenceOpco: string;
+};
+
+function FormFields({ form, setForm }: { form: FormType; setForm: (fn: (prev: FormType) => FormType) => void }) {
+  const set = (key: keyof FormType, value: string | boolean) =>
+    setForm(f => ({ ...f, [key]: value }));
+
+  return (
+    <div className="space-y-4 py-2">
+      <div>
+        <Label>Intitulé *</Label>
+        <Input value={form.intitule} onChange={e => set("intitule", e.target.value)} placeholder="Intitulé de la formation" />
+      </div>
+      <div className="grid grid-cols-2 gap-3">
+        <div>
+          <Label>Thème / Domaine</Label>
+          <Input value={form.theme} onChange={e => set("theme", e.target.value)} placeholder="Ex: Sécurité, Soins..." />
+        </div>
+        <div>
+          <Label>Durée</Label>
+          <Input value={form.duree} onChange={e => set("duree", e.target.value)} placeholder="Ex: 2 jours, 14h" />
+        </div>
+      </div>
+      <div>
+        <Label>Mots-clés</Label>
+        <Input value={form.motsCles} onChange={e => set("motsCles", e.target.value)} placeholder="Ex: gestes, postures, manutention" />
+      </div>
+      <div className="grid grid-cols-2 gap-3">
+        <div>
+          <Label>Prestataire</Label>
+          <Input value={form.prestataire} onChange={e => set("prestataire", e.target.value)} placeholder="Organisme de formation" />
+        </div>
+        <div>
+          <Label>Public concerné</Label>
+          <Input value={form.publicConcerne} onChange={e => set("publicConcerne", e.target.value)} placeholder="Ex: Aides-soignants" />
+        </div>
+      </div>
+      <div>
+        <Label>Description</Label>
+        <Textarea value={form.description} onChange={e => set("description", e.target.value)} rows={2} placeholder="Description de la formation..." />
+      </div>
+      <div>
+        <Label>Objectifs pédagogiques</Label>
+        <Textarea value={form.objectifs} onChange={e => set("objectifs", e.target.value)} rows={2} placeholder="Objectifs visés..." />
+      </div>
+      {/* Badges */}
+      <div className="grid grid-cols-2 gap-4 p-4 bg-gray-50 rounded-lg">
+        <div className="flex items-center justify-between">
+          <div>
+            <Label className="text-teal-700 font-semibold">Validée Itinova</Label>
+            <p className="text-xs text-gray-500">Formation recommandée par Itinova</p>
+          </div>
+          <Switch
+            checked={form.validateeItinova}
+            onCheckedChange={v => set("validateeItinova", v)}
+          />
+        </div>
+        <div className="flex items-center justify-between">
+          <div>
+            <Label className="text-blue-700 font-semibold">Éligible OPCO</Label>
+            <p className="text-xs text-gray-500">Financement OPCO possible</p>
+          </div>
+          <Switch
+            checked={form.opcoEligible}
+            onCheckedChange={v => set("opcoEligible", v)}
+          />
+        </div>
+      </div>
+      {form.opcoEligible && (
+        <div className="grid grid-cols-2 gap-3">
+          <div>
+            <Label>Budget OPCO (€)</Label>
+            <Input value={form.budgetOpco} onChange={e => set("budgetOpco", e.target.value)} placeholder="Ex: 1200" />
+          </div>
+          <div>
+            <Label>Référence OPCO</Label>
+            <Input value={form.referenceOpco} onChange={e => set("referenceOpco", e.target.value)} placeholder="Ex: REF-2024-001" />
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}

client/src/pages/PlanFormation.tsx

@@ -0,0 +1,469 @@
+import { useState, useMemo } from "react";
+import { useAuth } from "@/_core/hooks/useAuth";
+import DashboardLayout from "@/components/DashboardLayout";
+import { trpc } from "@/lib/trpc";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { toast } from "sonner";
+import {
+  Plus, Pencil, Trash2, Eye, ChevronRight, BookOpen,
+  CheckCircle2, Clock, XCircle, Send, AlertCircle, Loader2,
+  Users, Calendar, Building2
+} from "lucide-react";
+import { useLocation } from "wouter";
+
+// ─── Types ───────────────────────────────────────────────────────────────────
+
+type PlanStatut = "brouillon" | "soumis" | "valide" | "rejete";
+
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+
+function statutBadge(statut: PlanStatut) {
+  switch (statut) {
+    case "brouillon": return <Badge variant="outline" className="text-gray-600 border-gray-300 bg-gray-50"><Clock className="h-3 w-3 mr-1" />Brouillon</Badge>;
+    case "soumis": return <Badge className="bg-blue-100 text-blue-700 border-blue-200"><Send className="h-3 w-3 mr-1" />Soumis</Badge>;
+    case "valide": return <Badge className="bg-green-100 text-green-700 border-green-200"><CheckCircle2 className="h-3 w-3 mr-1" />Validé</Badge>;
+    case "rejete": return <Badge className="bg-red-100 text-red-700 border-red-200"><XCircle className="h-3 w-3 mr-1" />Rejeté</Badge>;
+  }
+}
+
+const ANNEES = Array.from({ length: 8 }, (_, i) => new Date().getFullYear() - 1 + i);
+
+// ─── Composant principal ──────────────────────────────────────────────────────
+
+export default function PlanFormation() {
+  const { user } = useAuth();
+  const [, setLocation] = useLocation();
+  const isAdmin = user?.role === "admin";
+
+  // Filtres
+  const [filtreAnnee, setFiltreAnnee] = useState<string>("all");
+  const [filtreStatut, setFiltreStatut] = useState<string>("all");
+  const [filtreEtab, setFiltreEtab] = useState<string>("");
+
+  // Dialogs
+  const [showCreate, setShowCreate] = useState(false);
+  const [showValider, setShowValider] = useState(false);
+  const [planAValider, setPlanAValider] = useState<number | null>(null);
+  const [decisionValidation, setDecisionValidation] = useState<"valide" | "rejete">("valide");
+  const [notesValidation, setNotesValidation] = useState("");
+
+  // Formulaire création
+  const [formData, setFormData] = useState({
+    codeEtablissement: "",
+    nomEtablissement: "",
+    annee: new Date().getFullYear(),
+    notes: "",
+  });
+
+  const utils = trpc.useUtils();
+
+  const { data: plans = [], isLoading } = trpc.planFormation.list.useQuery({});
+
+  const createMutation = trpc.planFormation.create.useMutation({
+    onSuccess: () => {
+      toast.success("Plan de formation créé avec succès");
+      utils.planFormation.list.invalidate();
+      setShowCreate(false);
+      setFormData({ codeEtablissement: "", nomEtablissement: "", annee: new Date().getFullYear(), notes: "" });
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const soumettreM = trpc.planFormation.soumettre.useMutation({
+    onSuccess: () => {
+      toast.success("Plan soumis pour validation");
+      utils.planFormation.list.invalidate();
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const validerM = trpc.planFormation.valider.useMutation({
+    onSuccess: () => {
+      toast.success(decisionValidation === "valide" ? "Plan validé" : "Plan rejeté");
+      utils.planFormation.list.invalidate();
+      setShowValider(false);
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const deleteM = trpc.planFormation.delete.useMutation({
+    onSuccess: () => {
+      toast.success("Plan supprimé");
+      utils.planFormation.list.invalidate();
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  // Filtrage
+  const plansFiltres = useMemo(() => {
+    return plans.filter(p => {
+      if (filtreAnnee !== "all" && p.annee !== parseInt(filtreAnnee)) return false;
+      if (filtreStatut !== "all" && p.statut !== filtreStatut) return false;
+      if (filtreEtab && !p.codeEtablissement.toLowerCase().includes(filtreEtab.toLowerCase())
+        && !(p.nomEtablissement ?? "").toLowerCase().includes(filtreEtab.toLowerCase())) return false;
+      return true;
+    });
+  }, [plans, filtreAnnee, filtreStatut, filtreEtab]);
+
+  // Stats
+  const stats = useMemo(() => ({
+    total: plans.length,
+    brouillons: plans.filter(p => p.statut === "brouillon").length,
+    soumis: plans.filter(p => p.statut === "soumis").length,
+    valides: plans.filter(p => p.statut === "valide").length,
+  }), [plans]);
+
+  function handleCreate() {
+    if (!formData.codeEtablissement.trim()) {
+      toast.error("Le code établissement est obligatoire");
+      return;
+    }
+    createMutation.mutate(formData);
+  }
+
+  function handleSoumettre(id: number) {
+    if (confirm("Soumettre ce plan pour validation par l'équipe Itinova ?")) {
+      soumettreM.mutate({ id });
+    }
+  }
+
+  function handleValider() {
+    if (!planAValider) return;
+    validerM.mutate({ id: planAValider, decision: decisionValidation, notesValidation });
+  }
+
+  function handleDelete(id: number) {
+    if (confirm("Supprimer définitivement ce plan de formation ?")) {
+      deleteM.mutate({ id });
+    }
+  }
+
+  return (
+    <DashboardLayout>
+      <div className="p-6 space-y-6">
+        {/* En-tête */}
+        <div className="flex items-center justify-between">
+          <div className="flex items-center gap-3">
+            <div className="p-2 bg-teal-100 rounded-lg">
+              <BookOpen className="h-6 w-6 text-teal-600" />
+            </div>
+            <div>
+              <h1 className="text-2xl font-bold text-gray-900">Plans de formations</h1>
+              <p className="text-sm text-gray-500">Gestion des plans de formation par établissement et par année</p>
+            </div>
+          </div>
+          <Button onClick={() => setShowCreate(true)} className="bg-teal-600 hover:bg-teal-700">
+            <Plus className="h-4 w-4 mr-2" />
+            Nouveau plan
+          </Button>
+        </div>
+
+        {/* Statistiques */}
+        <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+          <Card className="border-l-4 border-l-gray-400">
+            <CardContent className="p-4">
+              <p className="text-xs text-gray-500 uppercase tracking-wide">Total</p>
+              <p className="text-2xl font-bold text-gray-700">{stats.total}</p>
+            </CardContent>
+          </Card>
+          <Card className="border-l-4 border-l-gray-400">
+            <CardContent className="p-4">
+              <p className="text-xs text-gray-500 uppercase tracking-wide">Brouillons</p>
+              <p className="text-2xl font-bold text-gray-600">{stats.brouillons}</p>
+            </CardContent>
+          </Card>
+          <Card className="border-l-4 border-l-blue-400">
+            <CardContent className="p-4">
+              <p className="text-xs text-blue-600 uppercase tracking-wide">Soumis</p>
+              <p className="text-2xl font-bold text-blue-700">{stats.soumis}</p>
+            </CardContent>
+          </Card>
+          <Card className="border-l-4 border-l-green-400">
+            <CardContent className="p-4">
+              <p className="text-xs text-green-600 uppercase tracking-wide">Validés</p>
+              <p className="text-2xl font-bold text-green-700">{stats.valides}</p>
+            </CardContent>
+          </Card>
+        </div>
+
+        {/* Filtres */}
+        <Card>
+          <CardContent className="p-4">
+            <div className="flex flex-wrap gap-3 items-center">
+              <div className="flex items-center gap-2">
+                <Calendar className="h-4 w-4 text-gray-400" />
+                <Select value={filtreAnnee} onValueChange={setFiltreAnnee}>
+                  <SelectTrigger className="w-32">
+                    <SelectValue placeholder="Année" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">Toutes</SelectItem>
+                    {ANNEES.map(a => (
+                      <SelectItem key={a} value={String(a)}>{a}</SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              </div>
+              <div className="flex items-center gap-2">
+                <AlertCircle className="h-4 w-4 text-gray-400" />
+                <Select value={filtreStatut} onValueChange={setFiltreStatut}>
+                  <SelectTrigger className="w-36">
+                    <SelectValue placeholder="Statut" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">Tous les statuts</SelectItem>
+                    <SelectItem value="brouillon">Brouillon</SelectItem>
+                    <SelectItem value="soumis">Soumis</SelectItem>
+                    <SelectItem value="valide">Validé</SelectItem>
+                    <SelectItem value="rejete">Rejeté</SelectItem>
+                  </SelectContent>
+                </Select>
+              </div>
+              {isAdmin && (
+                <div className="flex items-center gap-2">
+                  <Building2 className="h-4 w-4 text-gray-400" />
+                  <Input
+                    placeholder="Filtrer par établissement..."
+                    value={filtreEtab}
+                    onChange={e => setFiltreEtab(e.target.value)}
+                    className="w-56"
+                  />
+                </div>
+              )}
+              <span className="text-sm text-gray-500 ml-auto">{plansFiltres.length} plan(s)</span>
+            </div>
+          </CardContent>
+        </Card>
+
+        {/* Liste des plans */}
+        {isLoading ? (
+          <div className="flex items-center justify-center py-12">
+            <Loader2 className="h-8 w-8 animate-spin text-teal-600" />
+          </div>
+        ) : plansFiltres.length === 0 ? (
+          <Card>
+            <CardContent className="p-12 text-center">
+              <BookOpen className="h-12 w-12 text-gray-300 mx-auto mb-4" />
+              <p className="text-gray-500 text-lg">Aucun plan de formation</p>
+              <p className="text-gray-400 text-sm mt-1">Créez votre premier plan en cliquant sur "Nouveau plan"</p>
+            </CardContent>
+          </Card>
+        ) : (
+          <div className="space-y-3">
+            {plansFiltres.map(plan => (
+              <Card key={plan.id} className="hover:shadow-md transition-shadow border-l-4 border-l-teal-400">
+                <CardContent className="p-4">
+                  <div className="flex items-center justify-between gap-4">
+                    <div className="flex items-center gap-4 min-w-0">
+                      <div className="flex-shrink-0">
+                        <div className="h-10 w-10 rounded-lg bg-teal-100 flex items-center justify-center">
+                          <span className="text-teal-700 font-bold text-sm">{plan.annee}</span>
+                        </div>
+                      </div>
+                      <div className="min-w-0">
+                        <div className="flex items-center gap-2 flex-wrap">
+                          <span className="font-semibold text-gray-900">
+                            {plan.nomEtablissement || plan.codeEtablissement}
+                          </span>
+                          <span className="text-gray-400">—</span>
+                          <span className="text-gray-600">Plan {plan.annee}</span>
+                          {statutBadge(plan.statut as PlanStatut)}
+                        </div>
+                        {plan.nomEtablissement && (
+                          <p className="text-xs text-gray-400 mt-0.5">Code : {plan.codeEtablissement}</p>
+                        )}
+                        {plan.notes && (
+                          <p className="text-sm text-gray-500 mt-1 truncate max-w-lg">{plan.notes}</p>
+                        )}
+                        {plan.notesValidation && (
+                          <p className="text-xs text-amber-600 mt-1 italic">Note Itinova : {plan.notesValidation}</p>
+                        )}
+                      </div>
+                    </div>
+                    <div className="flex items-center gap-2 flex-shrink-0">
+                      {/* Soumettre (si brouillon) */}
+                      {plan.statut === "brouillon" && (
+                        <Button
+                          size="sm"
+                          variant="outline"
+                          className="text-blue-600 border-blue-200 hover:bg-blue-50"
+                          onClick={() => handleSoumettre(plan.id)}
+                          disabled={soumettreM.isPending}
+                        >
+                          <Send className="h-3 w-3 mr-1" />
+                          Soumettre
+                        </Button>
+                      )}
+                      {/* Valider/Rejeter (admin, si soumis) */}
+                      {isAdmin && plan.statut === "soumis" && (
+                        <Button
+                          size="sm"
+                          className="bg-green-600 hover:bg-green-700 text-white"
+                          onClick={() => {
+                            setPlanAValider(plan.id);
+                            setDecisionValidation("valide");
+                            setNotesValidation("");
+                            setShowValider(true);
+                          }}
+                        >
+                          <CheckCircle2 className="h-3 w-3 mr-1" />
+                          Valider
+                        </Button>
+                      )}
+                      {/* Voir le détail */}
+                      <Button
+                        size="sm"
+                        variant="outline"
+                        className="text-teal-600 border-teal-200 hover:bg-teal-50"
+                        onClick={() => setLocation(`/admin/plans-formation/${plan.id}`)}
+                      >
+                        <Eye className="h-3 w-3 mr-1" />
+                        Détail
+                        <ChevronRight className="h-3 w-3 ml-1" />
+                      </Button>
+                      {/* Supprimer (brouillon uniquement ou admin) */}
+                      {(plan.statut === "brouillon" || isAdmin) && (
+                        <Button
+                          size="sm"
+                          variant="ghost"
+                          className="text-red-500 hover:text-red-700 hover:bg-red-50"
+                          onClick={() => handleDelete(plan.id)}
+                        >
+                          <Trash2 className="h-3 w-3" />
+                        </Button>
+                      )}
+                    </div>
+                  </div>
+                </CardContent>
+              </Card>
+            ))}
+          </div>
+        )}
+      </div>
+
+      {/* Dialog : Créer un plan */}
+      <Dialog open={showCreate} onOpenChange={setShowCreate}>
+        <DialogContent className="max-w-md">
+          <DialogHeader>
+            <DialogTitle className="flex items-center gap-2">
+              <BookOpen className="h-5 w-5 text-teal-600" />
+              Nouveau plan de formation
+            </DialogTitle>
+          </DialogHeader>
+          <div className="space-y-4 py-2">
+            <div className="grid grid-cols-2 gap-3">
+              <div>
+                <Label>Code établissement *</Label>
+                <Input
+                  placeholder="Ex: ETA001"
+                  value={formData.codeEtablissement}
+                  onChange={e => setFormData(f => ({ ...f, codeEtablissement: e.target.value }))}
+                />
+              </div>
+              <div>
+                <Label>Année *</Label>
+                <Select
+                  value={String(formData.annee)}
+                  onValueChange={v => setFormData(f => ({ ...f, annee: parseInt(v) }))}
+                >
+                  <SelectTrigger>
+                    <SelectValue />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {ANNEES.map(a => (
+                      <SelectItem key={a} value={String(a)}>{a}</SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              </div>
+            </div>
+            <div>
+              <Label>Nom de l'établissement</Label>
+              <Input
+                placeholder="Ex: EHPAD Les Tilleuls"
+                value={formData.nomEtablissement}
+                onChange={e => setFormData(f => ({ ...f, nomEtablissement: e.target.value }))}
+              />
+            </div>
+            <div>
+              <Label>Notes générales</Label>
+              <Textarea
+                placeholder="Contexte, priorités, besoins particuliers..."
+                value={formData.notes}
+                onChange={e => setFormData(f => ({ ...f, notes: e.target.value }))}
+                rows={3}
+              />
+            </div>
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setShowCreate(false)}>Annuler</Button>
+            <Button
+              onClick={handleCreate}
+              disabled={createMutation.isPending}
+              className="bg-teal-600 hover:bg-teal-700"
+            >
+              {createMutation.isPending ? <Loader2 className="h-4 w-4 animate-spin mr-2" /> : null}
+              Créer le plan
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {/* Dialog : Valider/Rejeter */}
+      <Dialog open={showValider} onOpenChange={setShowValider}>
+        <DialogContent className="max-w-md">
+          <DialogHeader>
+            <DialogTitle>Décision de validation</DialogTitle>
+          </DialogHeader>
+          <div className="space-y-4 py-2">
+            <div className="flex gap-3">
+              <Button
+                variant={decisionValidation === "valide" ? "default" : "outline"}
+                className={decisionValidation === "valide" ? "bg-green-600 hover:bg-green-700 flex-1" : "flex-1"}
+                onClick={() => setDecisionValidation("valide")}
+              >
+                <CheckCircle2 className="h-4 w-4 mr-2" />
+                Valider
+              </Button>
+              <Button
+                variant={decisionValidation === "rejete" ? "default" : "outline"}
+                className={decisionValidation === "rejete" ? "bg-red-600 hover:bg-red-700 flex-1" : "flex-1"}
+                onClick={() => setDecisionValidation("rejete")}
+              >
+                <XCircle className="h-4 w-4 mr-2" />
+                Rejeter
+              </Button>
+            </div>
+            <div>
+              <Label>Notes de validation (optionnel)</Label>
+              <Textarea
+                placeholder="Commentaires, suggestions, motif de rejet..."
+                value={notesValidation}
+                onChange={e => setNotesValidation(e.target.value)}
+                rows={3}
+              />
+            </div>
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setShowValider(false)}>Annuler</Button>
+            <Button
+              onClick={handleValider}
+              disabled={validerM.isPending}
+              className={decisionValidation === "valide" ? "bg-green-600 hover:bg-green-700" : "bg-red-600 hover:bg-red-700"}
+            >
+              {validerM.isPending ? <Loader2 className="h-4 w-4 animate-spin mr-2" /> : null}
+              Confirmer
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </DashboardLayout>
+  );
+}

client/src/pages/PlanFormationDetail.tsx

@@ -0,0 +1,539 @@
+import { useState } from "react";
+import { useAuth } from "@/_core/hooks/useAuth";
+import DashboardLayout from "@/components/DashboardLayout";
+import { trpc } from "@/lib/trpc";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { toast } from "sonner";
+import {
+  Plus, Pencil, Trash2, ArrowLeft, BookOpen,
+  CheckCircle2, Clock, XCircle, Send, Loader2,
+  Users, Star, Lightbulb, Library
+} from "lucide-react";
+import { useLocation, useParams } from "wouter";
+
+// ─── Types ───────────────────────────────────────────────────────────────────
+
+type ItemStatut = "en_attente" | "valide" | "refuse" | "suggere";
+type PlanStatut = "brouillon" | "soumis" | "valide" | "rejete";
+
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+
+function itemStatutBadge(statut: ItemStatut) {
+  switch (statut) {
+    case "en_attente": return <Badge variant="outline" className="text-gray-600 border-gray-300"><Clock className="h-3 w-3 mr-1" />En attente</Badge>;
+    case "valide": return <Badge className="bg-green-100 text-green-700 border-green-200"><CheckCircle2 className="h-3 w-3 mr-1" />Validé</Badge>;
+    case "refuse": return <Badge className="bg-red-100 text-red-700 border-red-200"><XCircle className="h-3 w-3 mr-1" />Refusé</Badge>;
+    case "suggere": return <Badge className="bg-amber-100 text-amber-700 border-amber-200"><Lightbulb className="h-3 w-3 mr-1" />Suggéré</Badge>;
+  }
+}
+
+function prioriteLabel(p: number) {
+  if (p === 1) return <span className="text-red-600 font-semibold text-xs">Haute</span>;
+  if (p === 2) return <span className="text-amber-600 text-xs">Moyenne</span>;
+  return <span className="text-gray-400 text-xs">Basse</span>;
+}
+
+// ─── Composant principal ──────────────────────────────────────────────────────
+
+export default function PlanFormationDetail() {
+  const { user } = useAuth();
+  const [, setLocation] = useLocation();
+  const params = useParams<{ id: string }>();
+  const planId = parseInt(params.id ?? "0");
+  const isAdmin = user?.role === "admin";
+
+  // Dialogs
+  const [showAddItem, setShowAddItem] = useState(false);
+  const [editItem, setEditItem] = useState<null | { id: number; intitule: string; duree: string; prestataire: string; publicConcerne: string; nbPersonnes: string; description: string; budgetEstime: string; priorite: number }>(null);
+  const [showSuggest, setShowSuggest] = useState(false);
+  const [suggestItemId, setSuggestItemId] = useState<number | null>(null);
+
+  // Formulaire item
+  const emptyItem = { intitule: "", duree: "", prestataire: "", publicConcerne: "", nbPersonnes: "", description: "", budgetEstime: "", priorite: 2 };
+  const [itemForm, setItemForm] = useState(emptyItem);
+
+  const utils = trpc.useUtils();
+
+  const { data: plan, isLoading } = trpc.planFormation.getById.useQuery(
+    { id: planId },
+    { enabled: planId > 0 }
+  );
+
+  const addItemM = trpc.planFormation.addItem.useMutation({
+    onSuccess: () => {
+      toast.success("Formation ajoutée au plan");
+      utils.planFormation.getById.invalidate({ id: planId });
+      setShowAddItem(false);
+      setItemForm(emptyItem);
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const updateItemM = trpc.planFormation.updateItem.useMutation({
+    onSuccess: () => {
+      toast.success("Formation mise à jour");
+      utils.planFormation.getById.invalidate({ id: planId });
+      setEditItem(null);
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  const deleteItemM = trpc.planFormation.deleteItem.useMutation({
+    onSuccess: () => {
+      toast.success("Formation retirée du plan");
+      utils.planFormation.getById.invalidate({ id: planId });
+    },
+    onError: (err) => toast.error(err.message),
+  });
+
+  // Suggestions du catalogue
+  const suggestItem = plan?.items?.find(i => i.id === suggestItemId);
+  const { data: suggestions } = trpc.catalogue.suggest.useQuery(
+    {
+      intitule: suggestItem?.intitule ?? "",
+      theme: undefined,
+    },
+    { enabled: showSuggest && !!suggestItem }
+  );
+
+  function handleAddItem() {
+    if (!itemForm.intitule.trim()) {
+      toast.error("L'intitulé est obligatoire");
+      return;
+    }
+    addItemM.mutate({
+      planId,
+      intitule: itemForm.intitule,
+      duree: itemForm.duree || undefined,
+      prestataire: itemForm.prestataire || undefined,
+      publicConcerne: itemForm.publicConcerne || undefined,
+      nbPersonnes: itemForm.nbPersonnes ? parseInt(itemForm.nbPersonnes) : undefined,
+      description: itemForm.description || undefined,
+      budgetEstime: itemForm.budgetEstime || undefined,
+      priorite: itemForm.priorite,
+    });
+  }
+
+  function handleUpdateItem() {
+    if (!editItem) return;
+    updateItemM.mutate({
+      id: editItem.id,
+      intitule: editItem.intitule,
+      duree: editItem.duree || undefined,
+      prestataire: editItem.prestataire || undefined,
+      publicConcerne: editItem.publicConcerne || undefined,
+      nbPersonnes: editItem.nbPersonnes ? parseInt(editItem.nbPersonnes) : undefined,
+      description: editItem.description || undefined,
+      budgetEstime: editItem.budgetEstime || undefined,
+      priorite: editItem.priorite,
+    });
+  }
+
+  function handleLinkCatalogue(catalogueId: number) {
+    if (!suggestItemId) return;
+    updateItemM.mutate({ id: suggestItemId, catalogueFormationId: catalogueId });
+    setShowSuggest(false);
+  }
+
+  if (isLoading) {
+    return (
+      <DashboardLayout>
+        <div className="flex items-center justify-center py-20">
+          <Loader2 className="h-8 w-8 animate-spin text-teal-600" />
+        </div>
+      </DashboardLayout>
+    );
+  }
+
+  if (!plan) {
+    return (
+      <DashboardLayout>
+        <div className="p-6 text-center text-gray-500">Plan introuvable</div>
+      </DashboardLayout>
+    );
+  }
+
+  const canEdit = plan.statut === "brouillon" || plan.statut === "rejete";
+
+  return (
+    <DashboardLayout>
+      <div className="p-6 space-y-6">
+        {/* En-tête */}
+        <div className="flex items-center gap-4">
+          <Button variant="ghost" size="sm" onClick={() => setLocation("/admin/plans-formation")}>
+            <ArrowLeft className="h-4 w-4 mr-1" />
+            Retour
+          </Button>
+          <div className="flex items-center gap-3 flex-1">
+            <div className="p-2 bg-teal-100 rounded-lg">
+              <BookOpen className="h-5 w-5 text-teal-600" />
+            </div>
+            <div>
+              <h1 className="text-xl font-bold text-gray-900">
+                {plan.nomEtablissement || plan.codeEtablissement} — Plan {plan.annee}
+              </h1>
+              <div className="flex items-center gap-2 mt-0.5">
+                <span className="text-xs text-gray-400">Code : {plan.codeEtablissement}</span>
+                {plan.statut === "brouillon" && <Badge variant="outline" className="text-gray-600 border-gray-300 text-xs"><Clock className="h-3 w-3 mr-1" />Brouillon</Badge>}
+                {plan.statut === "soumis" && <Badge className="bg-blue-100 text-blue-700 border-blue-200 text-xs"><Send className="h-3 w-3 mr-1" />Soumis</Badge>}
+                {plan.statut === "valide" && <Badge className="bg-green-100 text-green-700 border-green-200 text-xs"><CheckCircle2 className="h-3 w-3 mr-1" />Validé</Badge>}
+                {plan.statut === "rejete" && <Badge className="bg-red-100 text-red-700 border-red-200 text-xs"><XCircle className="h-3 w-3 mr-1" />Rejeté</Badge>}
+              </div>
+            </div>
+          </div>
+          {canEdit && (
+            <Button onClick={() => setShowAddItem(true)} className="bg-teal-600 hover:bg-teal-700">
+              <Plus className="h-4 w-4 mr-2" />
+              Ajouter une formation
+            </Button>
+          )}
+        </div>
+
+        {/* Notes */}
+        {plan.notes && (
+          <Card className="bg-blue-50 border-blue-200">
+            <CardContent className="p-4">
+              <p className="text-sm text-blue-700"><strong>Notes :</strong> {plan.notes}</p>
+            </CardContent>
+          </Card>
+        )}
+        {plan.notesValidation && (
+          <Card className="bg-amber-50 border-amber-200">
+            <CardContent className="p-4">
+              <p className="text-sm text-amber-700"><strong>Note Itinova :</strong> {plan.notesValidation}</p>
+            </CardContent>
+          </Card>
+        )}
+
+        {/* Liste des formations du plan */}
+        <Card>
+          <CardHeader className="pb-3">
+            <CardTitle className="text-base flex items-center justify-between">
+              <span>Formations demandées ({plan.items?.length ?? 0})</span>
+            </CardTitle>
+          </CardHeader>
+          <CardContent className="p-0">
+            {!plan.items || plan.items.length === 0 ? (
+              <div className="p-8 text-center text-gray-400">
+                <BookOpen className="h-10 w-10 mx-auto mb-3 text-gray-200" />
+                <p>Aucune formation dans ce plan</p>
+                {canEdit && (
+                  <Button variant="outline" className="mt-3" onClick={() => setShowAddItem(true)}>
+                    <Plus className="h-4 w-4 mr-2" />
+                    Ajouter une formation
+                  </Button>
+                )}
+              </div>
+            ) : (
+              <div className="divide-y">
+                {plan.items.map((item) => (
+                  <div key={item.id} className="p-4 hover:bg-gray-50 transition-colors">
+                    <div className="flex items-start justify-between gap-4">
+                      <div className="flex-1 min-w-0">
+                        <div className="flex items-center gap-2 flex-wrap">
+                          <span className="font-medium text-gray-900">{item.intitule}</span>
+                          {itemStatutBadge(item.statut as ItemStatut)}
+                          {item.priorite && (
+                            <span className="flex items-center gap-1">
+                              <Star className="h-3 w-3 text-amber-400" />
+                              {prioriteLabel(item.priorite)}
+                            </span>
+                          )}
+                          {item.catalogueFormation && (
+                            <Badge className="bg-teal-100 text-teal-700 border-teal-200 text-xs">
+                              <Library className="h-3 w-3 mr-1" />
+                              Catalogue
+                            </Badge>
+                          )}
+                        </div>
+                        <div className="flex flex-wrap gap-3 mt-1 text-xs text-gray-500">
+                          {item.duree && <span>⏱ {item.duree}</span>}
+                          {item.prestataire && <span>🏢 {item.prestataire}</span>}
+                          {item.publicConcerne && <span><Users className="h-3 w-3 inline mr-0.5" />{item.publicConcerne}</span>}
+                          {item.nbPersonnes && <span>👥 {item.nbPersonnes} pers.</span>}
+                          {item.budgetEstime && <span>💰 {item.budgetEstime} €</span>}
+                        </div>
+                        {item.description && (
+                          <p className="text-xs text-gray-400 mt-1 line-clamp-2">{item.description}</p>
+                        )}
+                        {/* Suggestion catalogue liée */}
+                        {item.catalogueFormation && (
+                          <div className="mt-2 p-2 bg-teal-50 rounded text-xs text-teal-700 border border-teal-200">
+                            <strong>Catalogue Itinova :</strong> {item.catalogueFormation.intitule}
+                            {item.catalogueFormation.validateeItinova && (
+                              <Badge className="ml-2 bg-teal-600 text-white text-xs">✓ Validée Itinova</Badge>
+                            )}
+                          </div>
+                        )}
+                      </div>
+                      {canEdit && (
+                        <div className="flex items-center gap-1 flex-shrink-0">
+                          <Button
+                            size="sm"
+                            variant="ghost"
+                            className="text-amber-500 hover:text-amber-700 hover:bg-amber-50"
+                            title="Rechercher dans le catalogue"
+                            onClick={() => {
+                              setSuggestItemId(item.id);
+                              setShowSuggest(true);
+                            }}
+                          >
+                            <Lightbulb className="h-4 w-4" />
+                          </Button>
+                          <Button
+                            size="sm"
+                            variant="ghost"
+                            className="text-blue-500 hover:text-blue-700 hover:bg-blue-50"
+                            onClick={() => setEditItem({
+                              id: item.id,
+                              intitule: item.intitule,
+                              duree: item.duree ?? "",
+                              prestataire: item.prestataire ?? "",
+                              publicConcerne: item.publicConcerne ?? "",
+                              nbPersonnes: item.nbPersonnes ? String(item.nbPersonnes) : "",
+                              description: item.description ?? "",
+                              budgetEstime: item.budgetEstime ?? "",
+                              priorite: item.priorite ?? 2,
+                            })}
+                          >
+                            <Pencil className="h-4 w-4" />
+                          </Button>
+                          <Button
+                            size="sm"
+                            variant="ghost"
+                            className="text-red-500 hover:text-red-700 hover:bg-red-50"
+                            onClick={() => {
+                              if (confirm("Retirer cette formation du plan ?")) {
+                                deleteItemM.mutate({ id: item.id });
+                              }
+                            }}
+                          >
+                            <Trash2 className="h-4 w-4" />
+                          </Button>
+                        </div>
+                      )}
+                    </div>
+                  </div>
+                ))}
+              </div>
+            )}
+          </CardContent>
+        </Card>
+      </div>
+
+      {/* Dialog : Ajouter une formation */}
+      <Dialog open={showAddItem} onOpenChange={setShowAddItem}>
+        <DialogContent className="max-w-lg">
+          <DialogHeader>
+            <DialogTitle>Ajouter une formation au plan</DialogTitle>
+          </DialogHeader>
+          <div className="space-y-3 py-2">
+            <div>
+              <Label>Intitulé *</Label>
+              <Input
+                placeholder="Ex: Formation gestes et postures"
+                value={itemForm.intitule}
+                onChange={e => setItemForm(f => ({ ...f, intitule: e.target.value }))}
+              />
+            </div>
+            <div className="grid grid-cols-2 gap-3">
+              <div>
+                <Label>Durée</Label>
+                <Input placeholder="Ex: 2 jours" value={itemForm.duree} onChange={e => setItemForm(f => ({ ...f, duree: e.target.value }))} />
+              </div>
+              <div>
+                <Label>Nb personnes</Label>
+                <Input type="number" placeholder="Ex: 10" value={itemForm.nbPersonnes} onChange={e => setItemForm(f => ({ ...f, nbPersonnes: e.target.value }))} />
+              </div>
+            </div>
+            <div>
+              <Label>Prestataire souhaité</Label>
+              <Input placeholder="Ex: Organisme XYZ" value={itemForm.prestataire} onChange={e => setItemForm(f => ({ ...f, prestataire: e.target.value }))} />
+            </div>
+            <div>
+              <Label>Public concerné</Label>
+              <Input placeholder="Ex: Aides-soignants" value={itemForm.publicConcerne} onChange={e => setItemForm(f => ({ ...f, publicConcerne: e.target.value }))} />
+            </div>
+            <div className="grid grid-cols-2 gap-3">
+              <div>
+                <Label>Budget estimé (€)</Label>
+                <Input placeholder="Ex: 1500" value={itemForm.budgetEstime} onChange={e => setItemForm(f => ({ ...f, budgetEstime: e.target.value }))} />
+              </div>
+              <div>
+                <Label>Priorité</Label>
+                <Select value={String(itemForm.priorite)} onValueChange={v => setItemForm(f => ({ ...f, priorite: parseInt(v) }))}>
+                  <SelectTrigger><SelectValue /></SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="1">Haute</SelectItem>
+                    <SelectItem value="2">Moyenne</SelectItem>
+                    <SelectItem value="3">Basse</SelectItem>
+                  </SelectContent>
+                </Select>
+              </div>
+            </div>
+            <div>
+              <Label>Description / Objectifs</Label>
+              <Textarea placeholder="Détails, objectifs pédagogiques..." value={itemForm.description} onChange={e => setItemForm(f => ({ ...f, description: e.target.value }))} rows={2} />
+            </div>
+          </div>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setShowAddItem(false)}>Annuler</Button>
+            <Button onClick={handleAddItem} disabled={addItemM.isPending} className="bg-teal-600 hover:bg-teal-700">
+              {addItemM.isPending ? <Loader2 className="h-4 w-4 animate-spin mr-2" /> : null}
+              Ajouter
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {/* Dialog : Modifier une formation */}
+      <Dialog open={!!editItem} onOpenChange={() => setEditItem(null)}>
+        <DialogContent className="max-w-lg">
+          <DialogHeader>
+            <DialogTitle>Modifier la formation</DialogTitle>
+          </DialogHeader>
+          {editItem && (
+            <div className="space-y-3 py-2">
+              <div>
+                <Label>Intitulé *</Label>
+                <Input value={editItem.intitule} onChange={e => setEditItem(ei => ei ? { ...ei, intitule: e.target.value } : null)} />
+              </div>
+              <div className="grid grid-cols-2 gap-3">
+                <div>
+                  <Label>Durée</Label>
+                  <Input value={editItem.duree} onChange={e => setEditItem(ei => ei ? { ...ei, duree: e.target.value } : null)} />
+                </div>
+                <div>
+                  <Label>Nb personnes</Label>
+                  <Input type="number" value={editItem.nbPersonnes} onChange={e => setEditItem(ei => ei ? { ...ei, nbPersonnes: e.target.value } : null)} />
+                </div>
+              </div>
+              <div>
+                <Label>Prestataire</Label>
+                <Input value={editItem.prestataire} onChange={e => setEditItem(ei => ei ? { ...ei, prestataire: e.target.value } : null)} />
+              </div>
+              <div>
+                <Label>Public concerné</Label>
+                <Input value={editItem.publicConcerne} onChange={e => setEditItem(ei => ei ? { ...ei, publicConcerne: e.target.value } : null)} />
+              </div>
+              <div className="grid grid-cols-2 gap-3">
+                <div>
+                  <Label>Budget estimé (€)</Label>
+                  <Input value={editItem.budgetEstime} onChange={e => setEditItem(ei => ei ? { ...ei, budgetEstime: e.target.value } : null)} />
+                </div>
+                <div>
+                  <Label>Priorité</Label>
+                  <Select value={String(editItem.priorite)} onValueChange={v => setEditItem(ei => ei ? { ...ei, priorite: parseInt(v) } : null)}>
+                    <SelectTrigger><SelectValue /></SelectTrigger>
+                    <SelectContent>
+                      <SelectItem value="1">Haute</SelectItem>
+                      <SelectItem value="2">Moyenne</SelectItem>
+                      <SelectItem value="3">Basse</SelectItem>
+                    </SelectContent>
+                  </Select>
+                </div>
+              </div>
+              <div>
+                <Label>Description</Label>
+                <Textarea value={editItem.description} onChange={e => setEditItem(ei => ei ? { ...ei, description: e.target.value } : null)} rows={2} />
+              </div>
+            </div>
+          )}
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setEditItem(null)}>Annuler</Button>
+            <Button onClick={handleUpdateItem} disabled={updateItemM.isPending} className="bg-teal-600 hover:bg-teal-700">
+              {updateItemM.isPending ? <Loader2 className="h-4 w-4 animate-spin mr-2" /> : null}
+              Enregistrer
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {/* Dialog : Suggestions catalogue */}
+      <Dialog open={showSuggest} onOpenChange={setShowSuggest}>
+        <DialogContent className="max-w-2xl max-h-[80vh] overflow-y-auto">
+          <DialogHeader>
+            <DialogTitle className="flex items-center gap-2">
+              <Lightbulb className="h-5 w-5 text-amber-500" />
+              Formations correspondantes dans le catalogue
+            </DialogTitle>
+          </DialogHeader>
+          {suggestItem && (
+            <p className="text-sm text-gray-500 mb-3">Recherche pour : <strong>{suggestItem.intitule}</strong></p>
+          )}
+          {!suggestions ? (
+            <div className="flex items-center justify-center py-8">
+              <Loader2 className="h-6 w-6 animate-spin text-teal-600" />
+            </div>
+          ) : (suggestions.validateesItinova.length === 0 && suggestions.autres.length === 0) ? (
+            <div className="text-center py-8 text-gray-400">
+              <Library className="h-10 w-10 mx-auto mb-3 text-gray-200" />
+              <p>Aucune formation correspondante dans le catalogue</p>
+            </div>
+          ) : (
+            <div className="space-y-4">
+              {suggestions.validateesItinova.length > 0 && (
+                <div>
+                  <h3 className="text-sm font-semibold text-teal-700 mb-2 flex items-center gap-1">
+                    <CheckCircle2 className="h-4 w-4" />
+                    Formations validées Itinova
+                  </h3>
+                  <div className="space-y-2">
+                    {suggestions.validateesItinova.map(f => (
+                      <div key={f.id} className="p-3 border border-teal-200 bg-teal-50 rounded-lg flex items-start justify-between gap-3">
+                        <div className="flex-1 min-w-0">
+                          <p className="font-medium text-gray-900 text-sm">{f.intitule}</p>
+                          <div className="flex flex-wrap gap-2 mt-1 text-xs text-gray-500">
+                            {f.theme && <span>📚 {f.theme}</span>}
+                            {f.duree && <span>⏱ {f.duree}</span>}
+                            {f.prestataire && <span>🏢 {f.prestataire}</span>}
+                            {f.opcoEligible && <Badge className="bg-blue-100 text-blue-700 text-xs">OPCO</Badge>}
+                          </div>
+                        </div>
+                        <Button size="sm" className="bg-teal-600 hover:bg-teal-700 flex-shrink-0" onClick={() => handleLinkCatalogue(f.id)}>
+                          Lier
+                        </Button>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              )}
+              {suggestions.autres.length > 0 && (
+                <div>
+                  <h3 className="text-sm font-semibold text-gray-600 mb-2">Autres formations du catalogue</h3>
+                  <div className="space-y-2">
+                    {suggestions.autres.map(f => (
+                      <div key={f.id} className="p-3 border border-gray-200 bg-gray-50 rounded-lg flex items-start justify-between gap-3">
+                        <div className="flex-1 min-w-0">
+                          <p className="font-medium text-gray-900 text-sm">{f.intitule}</p>
+                          <div className="flex flex-wrap gap-2 mt-1 text-xs text-gray-500">
+                            {f.theme && <span>📚 {f.theme}</span>}
+                            {f.duree && <span>⏱ {f.duree}</span>}
+                            {f.prestataire && <span>🏢 {f.prestataire}</span>}
+                          </div>
+                        </div>
+                        <Button size="sm" variant="outline" className="flex-shrink-0" onClick={() => handleLinkCatalogue(f.id)}>
+                          Lier
+                        </Button>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              )}
+            </div>
+          )}
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setShowSuggest(false)}>Fermer</Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </DashboardLayout>
+  );
+}

drizzle/meta/_journal.json

@@ -141,6 +141,13 @@
       "when": 1772187475069,
       "tag": "0019_aberrant_black_tarantula",
       "breakpoints": true
+    },
+    {
+      "idx": 20,
+      "version": "5",
+      "when": 1779898978661,
+      "tag": "0020_free_the_captain",
+      "breakpoints": true
     }
   ]
 }

drizzle/schema.ts

@@ -593,3 +593,110 @@ export const historiqueAttestations = mysqlTable("historiqueAttestations", {
 export type HistoriqueAttestation = typeof historiqueAttestations.$inferSelect;
 export type InsertHistoriqueAttestation = typeof historiqueAttestations.$inferInsert;
 
+
+/**
+ * Table du catalogue de formations partagé
+ * Géré par l'équipe Itinova, accessible en lecture à tous les établissements
+ */
+export const catalogueFormation = mysqlTable("catalogueFormation", {
+  id: int("id").autoincrement().primaryKey(),
+  /** Intitulé de la formation */
+  intitule: varchar("intitule", { length: 255 }).notNull(),
+  /** Thème principal de la formation */
+  theme: varchar("theme", { length: 255 }),
+  /** Mots-clés pour la recherche et la suggestion automatique (séparés par des virgules) */
+  motsCles: text("motsCles"),
+  /** Durée indicative (ex: "2 jours", "14h") */
+  duree: varchar("duree", { length: 100 }),
+  /** Organisme ou prestataire de formation */
+  prestataire: varchar("prestataire", { length: 255 }),
+  /** Description détaillée de la formation */
+  description: text("description"),
+  /** Objectifs pédagogiques */
+  objectifs: text("objectifs"),
+  /** Public concerné */
+  publicConcerne: varchar("publicConcerne", { length: 255 }),
+  /** Formation qualifiée "Validée Itinova" par l'équipe Itinova */
+  validateeItinova: boolean("validateeItinova").default(false).notNull(),
+  /** Formation éligible au financement OPCO */
+  opcoEligible: boolean("opcoEligible").default(false).notNull(),
+  /** Budget OPCO estimé (en euros) */
+  budgetOpco: decimal("budgetOpco", { precision: 10, scale: 2 }),
+  /** Référence du dossier OPCO */
+  referenceOpco: varchar("referenceOpco", { length: 255 }),
+  /** Source de la formation (import CSV, saisie manuelle, organisme externe) */
+  source: varchar("source", { length: 100 }).default("manuel").notNull(),
+  actif: boolean("actif").default(true).notNull(),
+  createdAt: timestamp("createdAt").defaultNow().notNull(),
+  updatedAt: timestamp("updatedAt").defaultNow().onUpdateNow().notNull(),
+});
+
+export type CatalogueFormation = typeof catalogueFormation.$inferSelect;
+export type InsertCatalogueFormation = typeof catalogueFormation.$inferInsert;
+
+/**
+ * Table des plans de formation par établissement et par année
+ */
+export const planFormation = mysqlTable("planFormation", {
+  id: int("id").autoincrement().primaryKey(),
+  /** Code de l'établissement concerné */
+  codeEtablissement: varchar("codeEtablissement", { length: 50 }).notNull(),
+  /** Nom de l'établissement (dénormalisé pour affichage) */
+  nomEtablissement: varchar("nomEtablissement", { length: 255 }),
+  /** Année du plan de formation */
+  annee: int("annee").notNull(),
+  /** Statut du plan (brouillon, soumis, valide, rejete) */
+  statut: mysqlEnum("statut", ["brouillon", "soumis", "valide", "rejete"]).default("brouillon").notNull(),
+  /** Notes générales sur le plan */
+  notes: text("notes"),
+  /** Notes de validation par l'équipe Itinova */
+  notesValidation: text("notesValidation"),
+  /** ID de l'utilisateur qui a créé le plan */
+  creePar: int("creePar"),
+  /** ID de l'utilisateur qui a validé le plan */
+  validePar: int("validePar"),
+  /** Date de soumission */
+  dateSoumission: timestamp("dateSoumission"),
+  /** Date de validation */
+  dateValidation: timestamp("dateValidation"),
+  createdAt: timestamp("createdAt").defaultNow().notNull(),
+  updatedAt: timestamp("updatedAt").defaultNow().onUpdateNow().notNull(),
+});
+
+export type PlanFormation = typeof planFormation.$inferSelect;
+export type InsertPlanFormation = typeof planFormation.$inferInsert;
+
+/**
+ * Table des items (lignes) d'un plan de formation
+ * Chaque item représente une formation souhaitée dans le plan
+ */
+export const planFormationItem = mysqlTable("planFormationItem", {
+  id: int("id").autoincrement().primaryKey(),
+  /** ID du plan de formation parent */
+  planId: int("planId").notNull(),
+  /** Intitulé de la formation souhaitée */
+  intitule: varchar("intitule", { length: 255 }).notNull(),
+  /** Durée souhaitée */
+  duree: varchar("duree", { length: 100 }),
+  /** Prestataire souhaité */
+  prestataire: varchar("prestataire", { length: 255 }),
+  /** Public concerné par cette formation */
+  publicConcerne: varchar("publicConcerne", { length: 255 }),
+  /** Nombre de personnes à former */
+  nbPersonnes: int("nbPersonnes"),
+  /** Description ou contexte de la demande */
+  description: text("description"),
+  /** Statut de l'item (en_attente, valide, refuse, suggere) */
+  statut: mysqlEnum("statut", ["en_attente", "valide", "refuse", "suggere"]).default("en_attente").notNull(),
+  /** ID de la formation du catalogue associée (suggestion ou validation) */
+  catalogueFormationId: int("catalogueFormationId"),
+  /** Budget estimé pour cet item */
+  budgetEstime: decimal("budgetEstime", { precision: 10, scale: 2 }),
+  /** Priorité (1 = haute, 2 = moyenne, 3 = basse) */
+  priorite: int("priorite").default(2),
+  createdAt: timestamp("createdAt").defaultNow().notNull(),
+  updatedAt: timestamp("updatedAt").defaultNow().onUpdateNow().notNull(),
+});
+
+export type PlanFormationItem = typeof planFormationItem.$inferSelect;
+export type InsertPlanFormationItem = typeof planFormationItem.$inferInsert;

server/__tests__/planFormation.test.ts

@@ -0,0 +1,175 @@
+/**
+ * Tests unitaires pour les routers catalogue et planFormation
+ * Ces tests vérifient la logique de scoring des suggestions et les validations de base.
+ */
+import { describe, it, expect } from "vitest";
+
+// ─── Tests logique de scoring des suggestions ─────────────────────────────────
+
+describe("Catalogue - logique de suggestion", () => {
+  // Reproduire la logique de scoring du router catalogue
+  function scoreFormation(
+    f: { intitule: string; theme?: string | null; motsCles?: string | null; description?: string | null; validateeItinova: boolean },
+    searchTerms: string[]
+  ): number {
+    let score = 0;
+    const haystack = [
+      f.intitule,
+      f.theme ?? "",
+      f.motsCles ?? "",
+      f.description ?? "",
+    ].join(" ").toLowerCase();
+
+    for (const term of searchTerms) {
+      if (haystack.includes(term)) score += 2;
+      if (term.length >= 4) {
+        const words = haystack.split(/\s+/);
+        for (const word of words) {
+          if (word.startsWith(term.substring(0, 4))) score += 1;
+        }
+      }
+    }
+    if (f.validateeItinova) score += 5;
+    return score;
+  }
+
+  it("doit donner un score plus élevé aux formations validées Itinova", () => {
+    const f1 = { intitule: "Gestes et postures", theme: "Sécurité", motsCles: null, description: null, validateeItinova: true };
+    const f2 = { intitule: "Gestes et postures", theme: "Sécurité", motsCles: null, description: null, validateeItinova: false };
+    const terms = ["gestes"];
+    expect(scoreFormation(f1, terms)).toBeGreaterThan(scoreFormation(f2, terms));
+  });
+
+  it("doit retourner 0 pour une formation sans correspondance", () => {
+    const f = { intitule: "Formation cuisine", theme: "Alimentation", motsCles: null, description: null, validateeItinova: false };
+    const terms = ["sécurité", "incendie"];
+    expect(scoreFormation(f, terms)).toBe(0);
+  });
+
+  it("doit scorer les correspondances partielles (4+ caractères)", () => {
+    const f = { intitule: "Prévention des risques", theme: null, motsCles: null, description: null, validateeItinova: false };
+    const terms = ["préven"];
+    const score = scoreFormation(f, terms);
+    expect(score).toBeGreaterThan(0);
+  });
+
+  it("doit scorer les correspondances dans les mots-clés", () => {
+    const f = { intitule: "Formation X", theme: null, motsCles: "manutention, ergonomie, postures", description: null, validateeItinova: false };
+    const terms = ["manutention"];
+    expect(scoreFormation(f, terms)).toBeGreaterThan(0);
+  });
+
+  it("doit trier par score décroissant", () => {
+    const formations = [
+      { intitule: "Sécurité incendie", theme: "Sécurité", motsCles: "incendie, évacuation", description: null, validateeItinova: false },
+      { intitule: "Gestes et postures", theme: "Sécurité", motsCles: null, description: null, validateeItinova: true },
+      { intitule: "Cuisine équilibrée", theme: "Alimentation", motsCles: null, description: null, validateeItinova: false },
+    ];
+    const terms = ["sécurité"];
+    const scored = formations
+      .map(f => ({ ...f, _score: scoreFormation(f, terms) }))
+      .filter(f => f._score > 0)
+      .sort((a, b) => b._score - a._score);
+
+    expect(scored.length).toBe(2);
+    expect(scored[0]._score).toBeGreaterThanOrEqual(scored[1]._score);
+  });
+});
+
+// ─── Tests validation des données de plan ────────────────────────────────────
+
+describe("PlanFormation - validation des données", () => {
+  it("doit valider qu'une année est dans une plage raisonnable", () => {
+    const anneeMin = 2020;
+    const anneeMax = 2100;
+    const validAnnees = [2024, 2025, 2026, 2030];
+    const invalidAnnees = [1999, 2101, 0, -1];
+
+    validAnnees.forEach(a => {
+      expect(a >= anneeMin && a <= anneeMax).toBe(true);
+    });
+    invalidAnnees.forEach(a => {
+      expect(a >= anneeMin && a <= anneeMax).toBe(false);
+    });
+  });
+
+  it("doit valider les statuts possibles d'un plan", () => {
+    const statutsValides = ["brouillon", "soumis", "valide", "rejete"];
+    expect(statutsValides).toContain("brouillon");
+    expect(statutsValides).toContain("soumis");
+    expect(statutsValides).not.toContain("archive");
+    expect(statutsValides).not.toContain("en_cours");
+  });
+
+  it("doit valider les statuts possibles d'un item", () => {
+    const statutsValides = ["en_attente", "valide", "refuse", "suggere"];
+    expect(statutsValides).toContain("en_attente");
+    expect(statutsValides).toContain("suggere");
+    expect(statutsValides).not.toContain("brouillon");
+  });
+
+  it("doit valider les priorités (1=haute, 2=moyenne, 3=basse)", () => {
+    const prioritesValides = [1, 2, 3];
+    expect(prioritesValides).toContain(1);
+    expect(prioritesValides).toContain(2);
+    expect(prioritesValides).toContain(3);
+    expect(prioritesValides).not.toContain(0);
+    expect(prioritesValides).not.toContain(4);
+  });
+});
+
+// ─── Tests parsing CSV ────────────────────────────────────────────────────────
+
+describe("CatalogueFormation - parsing CSV", () => {
+  function parseCsvLine(line: string): string[] {
+    const result: string[] = [];
+    let current = "";
+    let inQuotes = false;
+    for (let i = 0; i < line.length; i++) {
+      const ch = line[i];
+      if (ch === '"') {
+        inQuotes = !inQuotes;
+      } else if ((ch === "," || ch === ";") && !inQuotes) {
+        result.push(current.trim());
+        current = "";
+      } else {
+        current += ch;
+      }
+    }
+    result.push(current.trim());
+    return result;
+  }
+
+  it("doit parser une ligne CSV simple avec virgule", () => {
+    const line = "Formation A,Sécurité,2 jours,Organisme X";
+    const result = parseCsvLine(line);
+    expect(result).toHaveLength(4);
+    expect(result[0]).toBe("Formation A");
+    expect(result[1]).toBe("Sécurité");
+  });
+
+  it("doit parser une ligne CSV avec point-virgule", () => {
+    const line = "Formation B;Soins;1 jour;Organisme Y";
+    const result = parseCsvLine(line);
+    expect(result).toHaveLength(4);
+    expect(result[0]).toBe("Formation B");
+  });
+
+  it("doit gérer les valeurs entre guillemets", () => {
+    const line = '"Formation, avec virgule",Thème,3 jours';
+    const result = parseCsvLine(line);
+    expect(result[0]).toBe("Formation, avec virgule");
+    expect(result[1]).toBe("Thème");
+  });
+
+  it("doit détecter l'éligibilité OPCO", () => {
+    const opcoValues = ["oui", "true", "1", "x", "OUI", "TRUE"];
+    const nonOpcoValues = ["non", "false", "0", "", "no"];
+    opcoValues.forEach(v => {
+      expect(["oui", "true", "1", "x"].includes(v.toLowerCase())).toBe(true);
+    });
+    nonOpcoValues.forEach(v => {
+      expect(["oui", "true", "1", "x"].includes(v.toLowerCase())).toBe(false);
+    });
+  });
+});

server/routers.ts

@@ -16,6 +16,8 @@ import { parseExcelFile, validateImportData, importToDatabase } from "./importEx
 import crypto from "crypto";
 import bcrypt from "bcryptjs";
 import { sql } from "drizzle-orm";
+import { catalogueRouter } from "./routers/catalogue";
+import { planFormationRouter } from "./routers/planFormation";
 
 // Procédure admin uniquement
 const adminProcedure = protectedProcedure.use(({ ctx, next }) => {
@@ -3135,6 +3137,7 @@ export const appRouter = router({
         return await fail2banDb.countRecentBans(input.hours);
       }),
   }),
+  catalogue: catalogueRouter,
+  planFormation: planFormationRouter,
 });
-
 export type AppRouter = typeof appRouter;

server/routers/catalogue.ts

@@ -0,0 +1,308 @@
+import { z } from "zod";
+import { protectedProcedure, router } from "../_core/trpc";
+import { TRPCError } from "@trpc/server";
+import { getDb } from "../db";
+import { catalogueFormation } from "../../drizzle/schema";
+import { eq, like, or, and } from "drizzle-orm";
+
+// ─── Helpers ────────────────────────────────────────────────────────────────
+
+function isAdmin(role: string) {
+  return role === "admin";
+}
+
+// ─── Router ─────────────────────────────────────────────────────────────────
+
+export const catalogueRouter = router({
+  /** Lister toutes les formations du catalogue (accessible à tous les utilisateurs connectés) */
+  list: protectedProcedure
+    .input(
+      z.object({
+        search: z.string().optional(),
+        theme: z.string().optional(),
+        validateeItinova: z.boolean().optional(),
+        opcoEligible: z.boolean().optional(),
+      }).optional()
+    )
+    .query(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      const rows = await db.select().from(catalogueFormation);
+
+      let filtered = rows.filter(r => r.actif);
+
+      if (input?.search) {
+        const s = input.search.toLowerCase();
+        filtered = filtered.filter(r =>
+          r.intitule.toLowerCase().includes(s) ||
+          (r.theme ?? "").toLowerCase().includes(s) ||
+          (r.motsCles ?? "").toLowerCase().includes(s) ||
+          (r.prestataire ?? "").toLowerCase().includes(s)
+        );
+      }
+      if (input?.theme) {
+        filtered = filtered.filter(r => r.theme === input.theme);
+      }
+      if (input?.validateeItinova !== undefined) {
+        filtered = filtered.filter(r => r.validateeItinova === input.validateeItinova);
+      }
+      if (input?.opcoEligible !== undefined) {
+        filtered = filtered.filter(r => r.opcoEligible === input.opcoEligible);
+      }
+
+      return filtered;
+    }),
+
+  /** Obtenir une formation par ID */
+  getById: protectedProcedure
+    .input(z.object({ id: z.number() }))
+    .query(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+      const rows = await db.select().from(catalogueFormation).where(eq(catalogueFormation.id, input.id));
+      if (!rows[0]) throw new TRPCError({ code: "NOT_FOUND", message: "Formation introuvable" });
+      return rows[0];
+    }),
+
+  /** Créer une formation dans le catalogue (admin uniquement) */
+  create: protectedProcedure
+    .input(
+      z.object({
+        intitule: z.string().min(1),
+        theme: z.string().optional(),
+        motsCles: z.string().optional(),
+        duree: z.string().optional(),
+        prestataire: z.string().optional(),
+        description: z.string().optional(),
+        objectifs: z.string().optional(),
+        publicConcerne: z.string().optional(),
+        validateeItinova: z.boolean().optional(),
+        opcoEligible: z.boolean().optional(),
+        budgetOpco: z.string().optional(),
+        referenceOpco: z.string().optional(),
+        source: z.string().optional(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      if (!isAdmin(ctx.user.role)) {
+        throw new TRPCError({ code: "FORBIDDEN", message: "Réservé aux administrateurs" });
+      }
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      await db.insert(catalogueFormation).values({
+        intitule: input.intitule,
+        theme: input.theme ?? null,
+        motsCles: input.motsCles ?? null,
+        duree: input.duree ?? null,
+        prestataire: input.prestataire ?? null,
+        description: input.description ?? null,
+        objectifs: input.objectifs ?? null,
+        publicConcerne: input.publicConcerne ?? null,
+        validateeItinova: input.validateeItinova ?? false,
+        opcoEligible: input.opcoEligible ?? false,
+        budgetOpco: input.budgetOpco ? input.budgetOpco : null,
+        referenceOpco: input.referenceOpco ?? null,
+        source: input.source ?? "manuel",
+        actif: true,
+      });
+
+      return { success: true };
+    }),
+
+  /** Mettre à jour une formation du catalogue (admin uniquement) */
+  update: protectedProcedure
+    .input(
+      z.object({
+        id: z.number(),
+        intitule: z.string().min(1).optional(),
+        theme: z.string().optional(),
+        motsCles: z.string().optional(),
+        duree: z.string().optional(),
+        prestataire: z.string().optional(),
+        description: z.string().optional(),
+        objectifs: z.string().optional(),
+        publicConcerne: z.string().optional(),
+        validateeItinova: z.boolean().optional(),
+        opcoEligible: z.boolean().optional(),
+        budgetOpco: z.string().optional(),
+        referenceOpco: z.string().optional(),
+        actif: z.boolean().optional(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      if (!isAdmin(ctx.user.role)) {
+        throw new TRPCError({ code: "FORBIDDEN", message: "Réservé aux administrateurs" });
+      }
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      const { id, ...rest } = input;
+      const updateData: Record<string, unknown> = {};
+      if (rest.intitule !== undefined) updateData.intitule = rest.intitule;
+      if (rest.theme !== undefined) updateData.theme = rest.theme;
+      if (rest.motsCles !== undefined) updateData.motsCles = rest.motsCles;
+      if (rest.duree !== undefined) updateData.duree = rest.duree;
+      if (rest.prestataire !== undefined) updateData.prestataire = rest.prestataire;
+      if (rest.description !== undefined) updateData.description = rest.description;
+      if (rest.objectifs !== undefined) updateData.objectifs = rest.objectifs;
+      if (rest.publicConcerne !== undefined) updateData.publicConcerne = rest.publicConcerne;
+      if (rest.validateeItinova !== undefined) updateData.validateeItinova = rest.validateeItinova;
+      if (rest.opcoEligible !== undefined) updateData.opcoEligible = rest.opcoEligible;
+      if (rest.budgetOpco !== undefined) updateData.budgetOpco = rest.budgetOpco;
+      if (rest.referenceOpco !== undefined) updateData.referenceOpco = rest.referenceOpco;
+      if (rest.actif !== undefined) updateData.actif = rest.actif;
+
+      await db.update(catalogueFormation).set(updateData).where(eq(catalogueFormation.id, id));
+      return { success: true };
+    }),
+
+  /** Supprimer une formation du catalogue (admin uniquement) */
+  delete: protectedProcedure
+    .input(z.object({ id: z.number() }))
+    .mutation(async ({ ctx, input }) => {
+      if (!isAdmin(ctx.user.role)) {
+        throw new TRPCError({ code: "FORBIDDEN", message: "Réservé aux administrateurs" });
+      }
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+      await db.delete(catalogueFormation).where(eq(catalogueFormation.id, input.id));
+      return { success: true };
+    }),
+
+  /** Qualifier une formation comme "Validée Itinova" (admin uniquement) */
+  toggleValideeItinova: protectedProcedure
+    .input(z.object({ id: z.number(), valeur: z.boolean() }))
+    .mutation(async ({ ctx, input }) => {
+      if (!isAdmin(ctx.user.role)) {
+        throw new TRPCError({ code: "FORBIDDEN", message: "Réservé aux administrateurs" });
+      }
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+      await db.update(catalogueFormation)
+        .set({ validateeItinova: input.valeur })
+        .where(eq(catalogueFormation.id, input.id));
+      return { success: true };
+    }),
+
+  /** Importer des formations depuis un CSV/Excel (admin uniquement) */
+  importBulk: protectedProcedure
+    .input(
+      z.object({
+        formations: z.array(
+          z.object({
+            intitule: z.string().min(1),
+            theme: z.string().optional(),
+            motsCles: z.string().optional(),
+            duree: z.string().optional(),
+            prestataire: z.string().optional(),
+            description: z.string().optional(),
+            objectifs: z.string().optional(),
+            publicConcerne: z.string().optional(),
+            opcoEligible: z.boolean().optional(),
+            budgetOpco: z.string().optional(),
+            referenceOpco: z.string().optional(),
+          })
+        ),
+        source: z.string().optional(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      if (!isAdmin(ctx.user.role)) {
+        throw new TRPCError({ code: "FORBIDDEN", message: "Réservé aux administrateurs" });
+      }
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      let inserted = 0;
+      for (const f of input.formations) {
+        await db.insert(catalogueFormation).values({
+          intitule: f.intitule,
+          theme: f.theme ?? null,
+          motsCles: f.motsCles ?? null,
+          duree: f.duree ?? null,
+          prestataire: f.prestataire ?? null,
+          description: f.description ?? null,
+          objectifs: f.objectifs ?? null,
+          publicConcerne: f.publicConcerne ?? null,
+          validateeItinova: false,
+          opcoEligible: f.opcoEligible ?? false,
+          budgetOpco: f.budgetOpco ?? null,
+          referenceOpco: f.referenceOpco ?? null,
+          source: input.source ?? "import",
+          actif: true,
+        });
+        inserted++;
+      }
+
+      return { success: true, inserted };
+    }),
+
+  /** Suggestion automatique : trouver les formations correspondant à un intitulé/thème */
+  suggest: protectedProcedure
+    .input(
+      z.object({
+        intitule: z.string(),
+        theme: z.string().optional(),
+        motsCles: z.string().optional(),
+      })
+    )
+    .query(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      const allFormations = await db.select().from(catalogueFormation).where(eq(catalogueFormation.actif, true));
+
+      const searchTerms = [
+        input.intitule.toLowerCase(),
+        ...(input.theme ? [input.theme.toLowerCase()] : []),
+        ...(input.motsCles ? input.motsCles.toLowerCase().split(",").map(k => k.trim()) : []),
+      ].filter(Boolean);
+
+      function scoreFormation(f: typeof allFormations[0]): number {
+        let score = 0;
+        const haystack = [
+          f.intitule,
+          f.theme ?? "",
+          f.motsCles ?? "",
+          f.description ?? "",
+        ].join(" ").toLowerCase();
+
+        for (const term of searchTerms) {
+          if (haystack.includes(term)) score += 2;
+          // Correspondance partielle (au moins 4 caractères)
+          if (term.length >= 4) {
+            const words = haystack.split(/\s+/);
+            for (const word of words) {
+              if (word.startsWith(term.substring(0, 4))) score += 1;
+            }
+          }
+        }
+        // Bonus si validée Itinova
+        if (f.validateeItinova) score += 5;
+        return score;
+      }
+
+      const scored = allFormations
+        .map(f => ({ ...f, _score: scoreFormation(f) }))
+        .filter(f => f._score > 0)
+        .sort((a, b) => b._score - a._score)
+        .slice(0, 10);
+
+      // Séparer validées Itinova des autres
+      const validateesItinova = scored.filter(f => f.validateeItinova);
+      const autres = scored.filter(f => !f.validateeItinova);
+
+      return { validateesItinova, autres };
+    }),
+
+  /** Lister les thèmes distincts du catalogue */
+  themes: protectedProcedure.query(async () => {
+    const db = await getDb();
+    if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+    const rows = await db.select({ theme: catalogueFormation.theme }).from(catalogueFormation);
+    const themes = [...new Set(rows.map(r => r.theme).filter(Boolean))] as string[];
+    return themes.sort();
+  }),
+});

server/routers/planFormation.ts

@@ -0,0 +1,306 @@
+import { z } from "zod";
+import { protectedProcedure, router } from "../_core/trpc";
+import { TRPCError } from "@trpc/server";
+import { getDb } from "../db";
+import { planFormation, planFormationItem, catalogueFormation } from "../../drizzle/schema";
+import { eq, and } from "drizzle-orm";
+
+// ─── Helpers ────────────────────────────────────────────────────────────────
+
+function isAdmin(role: string) {
+  return role === "admin";
+}
+
+// ─── Router Plans de formation ───────────────────────────────────────────────
+
+export const planFormationRouter = router({
+
+  /** Lister les plans de formation
+   * - Admin : voit tous les plans
+   * - User : voit uniquement les plans de son établissement (via codeEtablissement)
+   */
+  list: protectedProcedure
+    .input(
+      z.object({
+        codeEtablissement: z.string().optional(),
+        annee: z.number().optional(),
+        statut: z.enum(["brouillon", "soumis", "valide", "rejete"]).optional(),
+      }).optional()
+    )
+    .query(async ({ ctx, input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      let rows = await db.select().from(planFormation);
+
+      if (input?.codeEtablissement) {
+        rows = rows.filter(r => r.codeEtablissement === input.codeEtablissement);
+      }
+      if (input?.annee) {
+        rows = rows.filter(r => r.annee === input.annee);
+      }
+      if (input?.statut) {
+        rows = rows.filter(r => r.statut === input.statut);
+      }
+
+      return rows.sort((a, b) => b.annee - a.annee);
+    }),
+
+  /** Obtenir un plan par ID avec ses items */
+  getById: protectedProcedure
+    .input(z.object({ id: z.number() }))
+    .query(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      const plans = await db.select().from(planFormation).where(eq(planFormation.id, input.id));
+      if (!plans[0]) throw new TRPCError({ code: "NOT_FOUND", message: "Plan introuvable" });
+
+      const items = await db.select().from(planFormationItem).where(eq(planFormationItem.planId, input.id));
+
+      // Récupérer les formations du catalogue associées
+      const catalogueIds = items
+        .map(i => i.catalogueFormationId)
+        .filter((id): id is number => id !== null && id !== undefined);
+
+      let catalogueItems: typeof catalogueFormation.$inferSelect[] = [];
+      if (catalogueIds.length > 0) {
+        catalogueItems = await db.select().from(catalogueFormation);
+        catalogueItems = catalogueItems.filter(c => catalogueIds.includes(c.id));
+      }
+
+      const itemsWithCatalogue = items.map(item => ({
+        ...item,
+        catalogueFormation: item.catalogueFormationId
+          ? catalogueItems.find(c => c.id === item.catalogueFormationId) ?? null
+          : null,
+      }));
+
+      return { ...plans[0], items: itemsWithCatalogue };
+    }),
+
+  /** Créer un plan de formation */
+  create: protectedProcedure
+    .input(
+      z.object({
+        codeEtablissement: z.string().min(1),
+        nomEtablissement: z.string().optional(),
+        annee: z.number().min(2020).max(2100),
+        notes: z.string().optional(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      await db.insert(planFormation).values({
+        codeEtablissement: input.codeEtablissement,
+        nomEtablissement: input.nomEtablissement ?? null,
+        annee: input.annee,
+        statut: "brouillon",
+        notes: input.notes ?? null,
+        creePar: ctx.user.id,
+      });
+
+      return { success: true };
+    }),
+
+  /** Mettre à jour un plan de formation */
+  update: protectedProcedure
+    .input(
+      z.object({
+        id: z.number(),
+        codeEtablissement: z.string().optional(),
+        nomEtablissement: z.string().optional(),
+        annee: z.number().optional(),
+        notes: z.string().optional(),
+        notesValidation: z.string().optional(),
+        statut: z.enum(["brouillon", "soumis", "valide", "rejete"]).optional(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      const { id, ...rest } = input;
+      const updateData: Record<string, unknown> = {};
+
+      if (rest.codeEtablissement !== undefined) updateData.codeEtablissement = rest.codeEtablissement;
+      if (rest.nomEtablissement !== undefined) updateData.nomEtablissement = rest.nomEtablissement;
+      if (rest.annee !== undefined) updateData.annee = rest.annee;
+      if (rest.notes !== undefined) updateData.notes = rest.notes;
+      if (rest.notesValidation !== undefined) updateData.notesValidation = rest.notesValidation;
+      if (rest.statut !== undefined) {
+        updateData.statut = rest.statut;
+        if (rest.statut === "soumis") {
+          updateData.dateSoumission = new Date();
+        }
+        if ((rest.statut === "valide" || rest.statut === "rejete") && isAdmin(ctx.user.role)) {
+          updateData.dateValidation = new Date();
+          updateData.validePar = ctx.user.id;
+        }
+      }
+
+      await db.update(planFormation).set(updateData).where(eq(planFormation.id, id));
+      return { success: true };
+    }),
+
+  /** Soumettre un plan pour validation */
+  soumettre: protectedProcedure
+    .input(z.object({ id: z.number() }))
+    .mutation(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      await db.update(planFormation).set({
+        statut: "soumis",
+        dateSoumission: new Date(),
+      }).where(eq(planFormation.id, input.id));
+
+      return { success: true };
+    }),
+
+  /** Valider ou rejeter un plan (admin uniquement) */
+  valider: protectedProcedure
+    .input(
+      z.object({
+        id: z.number(),
+        decision: z.enum(["valide", "rejete"]),
+        notesValidation: z.string().optional(),
+      })
+    )
+    .mutation(async ({ ctx, input }) => {
+      if (!isAdmin(ctx.user.role)) {
+        throw new TRPCError({ code: "FORBIDDEN", message: "Réservé aux administrateurs" });
+      }
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      await db.update(planFormation).set({
+        statut: input.decision,
+        notesValidation: input.notesValidation ?? null,
+        dateValidation: new Date(),
+        validePar: ctx.user.id,
+      }).where(eq(planFormation.id, input.id));
+
+      return { success: true };
+    }),
+
+  /** Supprimer un plan (admin ou créateur si brouillon) */
+  delete: protectedProcedure
+    .input(z.object({ id: z.number() }))
+    .mutation(async ({ ctx, input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      const plans = await db.select().from(planFormation).where(eq(planFormation.id, input.id));
+      if (!plans[0]) throw new TRPCError({ code: "NOT_FOUND", message: "Plan introuvable" });
+
+      const plan = plans[0];
+      if (!isAdmin(ctx.user.role) && (plan.statut !== "brouillon" || plan.creePar !== ctx.user.id)) {
+        throw new TRPCError({ code: "FORBIDDEN", message: "Vous ne pouvez supprimer que vos propres brouillons" });
+      }
+
+      // Supprimer les items d'abord
+      await db.delete(planFormationItem).where(eq(planFormationItem.planId, input.id));
+      await db.delete(planFormation).where(eq(planFormation.id, input.id));
+      return { success: true };
+    }),
+
+  // ─── Items du plan ────────────────────────────────────────────────────────
+
+  /** Ajouter un item au plan */
+  addItem: protectedProcedure
+    .input(
+      z.object({
+        planId: z.number(),
+        intitule: z.string().min(1),
+        duree: z.string().optional(),
+        prestataire: z.string().optional(),
+        publicConcerne: z.string().optional(),
+        nbPersonnes: z.number().optional(),
+        description: z.string().optional(),
+        budgetEstime: z.string().optional(),
+        priorite: z.number().min(1).max(3).optional(),
+        catalogueFormationId: z.number().optional(),
+      })
+    )
+    .mutation(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      await db.insert(planFormationItem).values({
+        planId: input.planId,
+        intitule: input.intitule,
+        duree: input.duree ?? null,
+        prestataire: input.prestataire ?? null,
+        publicConcerne: input.publicConcerne ?? null,
+        nbPersonnes: input.nbPersonnes ?? null,
+        description: input.description ?? null,
+        statut: "en_attente",
+        budgetEstime: input.budgetEstime ?? null,
+        priorite: input.priorite ?? 2,
+        catalogueFormationId: input.catalogueFormationId ?? null,
+      });
+
+      return { success: true };
+    }),
+
+  /** Mettre à jour un item */
+  updateItem: protectedProcedure
+    .input(
+      z.object({
+        id: z.number(),
+        intitule: z.string().optional(),
+        duree: z.string().optional(),
+        prestataire: z.string().optional(),
+        publicConcerne: z.string().optional(),
+        nbPersonnes: z.number().optional(),
+        description: z.string().optional(),
+        statut: z.enum(["en_attente", "valide", "refuse", "suggere"]).optional(),
+        budgetEstime: z.string().optional(),
+        priorite: z.number().min(1).max(3).optional(),
+        catalogueFormationId: z.number().nullable().optional(),
+      })
+    )
+    .mutation(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+
+      const { id, ...rest } = input;
+      const updateData: Record<string, unknown> = {};
+      if (rest.intitule !== undefined) updateData.intitule = rest.intitule;
+      if (rest.duree !== undefined) updateData.duree = rest.duree;
+      if (rest.prestataire !== undefined) updateData.prestataire = rest.prestataire;
+      if (rest.publicConcerne !== undefined) updateData.publicConcerne = rest.publicConcerne;
+      if (rest.nbPersonnes !== undefined) updateData.nbPersonnes = rest.nbPersonnes;
+      if (rest.description !== undefined) updateData.description = rest.description;
+      if (rest.statut !== undefined) updateData.statut = rest.statut;
+      if (rest.budgetEstime !== undefined) updateData.budgetEstime = rest.budgetEstime;
+      if (rest.priorite !== undefined) updateData.priorite = rest.priorite;
+      if (rest.catalogueFormationId !== undefined) updateData.catalogueFormationId = rest.catalogueFormationId;
+
+      await db.update(planFormationItem).set(updateData).where(eq(planFormationItem.id, id));
+      return { success: true };
+    }),
+
+  /** Supprimer un item */
+  deleteItem: protectedProcedure
+    .input(z.object({ id: z.number() }))
+    .mutation(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+      await db.delete(planFormationItem).where(eq(planFormationItem.id, input.id));
+      return { success: true };
+    }),
+
+  /** Lister les items d'un plan */
+  listItems: protectedProcedure
+    .input(z.object({ planId: z.number() }))
+    .query(async ({ input }) => {
+      const db = await getDb();
+      if (!db) throw new TRPCError({ code: "INTERNAL_SERVER_ERROR", message: "DB non disponible" });
+      const items = await db.select().from(planFormationItem).where(eq(planFormationItem.planId, input.planId));
+      return items;
+    }),
+});

todo.md

@@ -1724,3 +1724,48 @@
 - [x] Résolution 500x160px pour équilibre qualité/taille (< 1 Mo par PDF)
 - [x] Tester sur TEST
 - [x] Déployer sur PROD
+
+## Fonctionnalité - Gestion des plans de formations
+
+### Schéma DB
+- [ ] Ajouter la table catalogueFormation (intitulé, thème, mots-clés, durée, prestataire, description, validateeItinova, opcoEligible, budgetOpco, referenceOpco, source)
+- [ ] Ajouter la table planFormation (etablissementId, annee, statut, notes)
+- [ ] Ajouter la table planFormationItem (planId, intitule, duree, prestataire, publicConcerne, description, statut, catalogueFormationId optionnel)
+- [ ] Migrer le schéma avec pnpm db:push
+
+### Backend tRPC
+- [ ] Procédures catalogue : list, create, update, delete, importCSV, importExcel
+- [ ] Procédures planFormation : list, create, update, delete, valider
+- [ ] Procédures planFormationItem : list, create, update, delete
+- [ ] Logique de suggestion automatique (formations "validée Itinova" par thème/mot-clé, sinon catalogue général)
+
+### Frontend - Menu & Navigation
+- [x] Ajouter la section "Gestion des plans de formations" dans DashboardLayout.tsx
+- [x] Ajouter les routes dans App.tsx
+
+### Frontend - Page Plans de formation
+- [x] Créer la page PlanFormation.tsx (liste des plans par établissement/année)
+- [x] Formulaire de création/édition d'un plan (établissement + année)
+- [x] Gestion des items du plan (intitulé, durée, prestataire, public concerné, description)
+- [x] Statut du plan (brouillon, soumis, validé)
+- [x] Vue détail d'un plan avec ses items
+- [x] Bouton "Soumettre pour validation" (rôle établissement)
+- [x] Bouton "Valider le plan" avec suggestion automatique (rôle admin/Itinova)
+
+### Frontend - Page Catalogue de formation
+- [x] Créer la page CatalogueFormation.tsx (liste des formations du catalogue)
+- [x] Formulaire d'ajout/édition d'une formation du catalogue
+- [x] Badge "Validée Itinova" (qualification par admin)
+- [x] Champs OPCO (éligibilité, budget, référence)
+- [x] Import CSV/Excel de formations
+- [x] Filtres par thème, validée Itinova, OPCO
+
+### Frontend - Suggestion automatique
+- [x] Modal de suggestion lors de la validation d'un plan
+- [x] Afficher en priorité les formations "validée Itinova" correspondant par thème/mot-clé
+- [x] Sinon afficher les formations du catalogue général
+- [x] Permettre d'associer une formation du catalogue à un item du plan
+
+### Déploiement
+- [ ] Tester sur TEST
+- [ ] Déployer sur PROD