fix : recherche globale + tous les champs

ecole/public/css/historiqueParcours.css

@@ -42,25 +42,99 @@ table.dataTable thead th>div {
     left: 0 !important;
 }
 
-#historiqueParcours_filter label {
-    display: flex;
-    align-items: center;
+#historiqueParcours_filter {
+    margin-bottom: 20px;
 }
 
+.dataTables_wrapper .dataTables_filter {
+    position: relative;
+    text-align: left;
+    float: left;
+    padding: 2px;
+    overflow: visible;
+}
+
+/* Cacher complètement le label "Rechercher" de DataTables */
+.dataTables_wrapper .dataTables_filter label {
+    position: relative;
+    display: inline-block;
+    margin: 0;
+    font-size: 0 !important;
+    line-height: 0 !important;
+    overflow: visible;
+}
+
+.dataTables_wrapper .dataTables_filter label > span:first-child {
+    display: none !important;
+}
+
+/* fond blanc, bordure grise fine, capsule arrondie */
 .dataTables_wrapper .dataTables_filter input[type="search"] {
-    background-color: transparent;
-    border: none;
-    border-bottom: 1px solid #26a69a;
-    border-radius: 0;
+    background-color: #fff;
+    border: 1px solid #e0e0e0;
+    border-radius: 42px;
     outline: none;
-    height: 3rem;
-    width: 100%;
-    font-size: 16px;
-    margin: 0 0 8px 0;
-    padding: 0;
-    box-shadow: none;
-    box-sizing: content-box;
-    transition: box-shadow .3s, border .3s, -webkit-box-shadow .3s;
+    height: 42px;
+    width: 220px;
+    font-size: 15px;
+    margin: 0;
+    padding: 0 20px 0 52px;
+    box-sizing: border-box;
+    transition: all 0.2s ease;
+    color: #333;
+    position: relative;
+}
+
+.dataTables_wrapper .dataTables_filter input[type="search"]:focus {
+    background-color: #fff;
+    border-color: #1d9bf0;
+    box-shadow: 0 0 0 2px #1d9bf0;
+    color: #333;
+}
+
+.dataTables_wrapper .dataTables_filter input[type="search"]::placeholder {
+    color: #71767a;
+}
+
+/* Icône de loupe SVG */
+.dataTables_wrapper .dataTables_filter label::before {
+    content: "";
+    position: absolute;
+    left: 20px;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 18px;
+    height: 18px;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2371767a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center;
+    pointer-events: none;
+    z-index: 1;
+}
+
+/* Texte "Rechercher" à côté de l'icône */
+.dataTables_wrapper .dataTables_filter label::after {
+    content: "Rechercher";
+    position: absolute;
+    left: 52px;
+    top: 50%;
+    transform: translateY(-50%);
+    font-size: 15px;
+    color: #71767a;
+    pointer-events: none;
+    z-index: 1;
+    white-space: nowrap;
+}
+
+/* Cacher le texte "Rechercher" quand on tape, focus, ou si l'input a une valeur */
+.dataTables_wrapper .dataTables_filter:focus-within label::after,
+.dataTables_wrapper .dataTables_filter label.has-value::after {
+    opacity: 0;
+}
+
+.dataTables_wrapper .dataTables_filter input[type="search"]:focus::placeholder {
+    color: transparent;
 }
 
 #historiqueParcours_length>label {
@@ -83,7 +157,7 @@ table.dataTable thead th>div {
     width: 60px;
 }
 
-/* Style Input search by row */
+/* Style Input recherche par ligne */
 #historiqueParcours>thead>tr:nth-child(2)>th>input {
     font-size: 13px !important;
     padding: 6px !important;
@@ -105,7 +179,7 @@ table.dataTable thead .sorting_desc:before {
     content: "";
 }
 
-/* boutons de navigationw */
+/* boutons de navigation */
 .dataTables_wrapper .dataTables_paginate .paginate_button {
     background-color: white !important;
     border: darkblue solid 1.5px !important;

ecole/public/js/historiqueParcours.js

@@ -348,14 +348,29 @@ function initServerSideDataTable() {
 
       // Recherche globale : debounce y compris ENTER (plus de bypass immédiat)
       const $globalInput = $('div.dataTables_filter input[type="search"]');
+      const $filterLabel = $globalInput.closest('label');
       $globalInput.off('.DT'); // nettoie handlers datatables
       const debouncedGlobal = debounce((v) => {
         api.search(v);
         api.ajax.reload();
       }, 350);
+      
+      // Fonction pour gérer l'affichage du texte "Rechercher"
+      function toggleSearchPlaceholder() {
+        if ($globalInput.val().trim() !== '') {
+          $filterLabel.addClass('has-value');
+        } else {
+          $filterLabel.removeClass('has-value');
+        }
+      }
+      
       $globalInput.on('input keyup keydown', function () {
         debouncedGlobal(this.value);
+        toggleSearchPlaceholder();
       });
+      
+      // Vérifier l'état initial
+      toggleSearchPlaceholder();
 
       // Recherche par colonne avec DEBOUNCE (ENTER inclus)
       const debouncedColSearch = debounce((i, val) => {
@@ -418,6 +433,19 @@ function initServerSideDataTable() {
         }
       },
       { type: "date-eu", targets: 1 }, // Date de Création (colonne 1)
+      {
+        // Appliquer la classe nc-value aux cellules contenant "NC"
+        targets: "_all",
+        createdCell: function (td, cellData, rowData, row, col) {
+          // Exclure la première colonne (bouton détails) et les deux dernières (boutons)
+          if (col !== 0 && col < rowData.length - 2) {
+            const cellText = String(cellData || "").trim();
+            if (cellText === "NC") {
+              td.classList.add("nc-value");
+            }
+          }
+        }
+      },
       { responsivePriority: 1, targets: -1 },
       { responsivePriority: 2, targets: -2 }
     ],

ecole/src/controllers/historiqueParcoursController.js

@@ -33,8 +33,12 @@ function buildPocketBaseFilterAndSort({ regions = [], search = { value: "" }, co
       || contrat.type ~ "${esc}"
       || contrat.intermediaire.nom ~ "${esc}"
       || contrat.intermediaire.numPortefeuille ~ "${esc}"
+      || contrat.client.nom ~ "${esc}"
+      || contrat.client.numClient ~ "${esc}"
       || dernierUtilisateur.prenom ~ "${esc}"
       || dernierUtilisateur.nom ~ "${esc}"
+      || dernierUtilisateur.matricule ~ "${esc}"
+      || dernierUtilisateur.region.nom ~ "${esc}"
     )`);
   }