Déplacement du code dans ngOnChanges + ajout des filtres pour statut et intitulé

src/app/shared/mat-tables/participations-formation-table/participations-formation.table.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnInit, ViewChild, AfterViewInit} from "@angular/core";
+import { Component, Input, OnInit, OnChanges, ViewChild, AfterViewInit} from "@angular/core";
 
 import {MatPaginator} from '@angular/material/paginator';
 import {MatSort} from '@angular/material/sort';
@@ -13,7 +13,7 @@ import { DatePipe } from "@angular/common";
     templateUrl: "./participations-formation.table.html",
     styleUrls: ["./participations-formation.table.css"]
 })
-export class ParticipationsFormationTableComponent implements OnInit, AfterViewInit  {
+export class ParticipationsFormationTableComponent implements OnInit, OnChanges, AfterViewInit  {
 
   
   @ViewChild(MatPaginator) paginator: MatPaginator;
@@ -56,21 +56,31 @@ export class ParticipationsFormationTableComponent implements OnInit, AfterViewI
     }
 
     ngOnInit() {
-      this.dataSource = new MatTableDataSource(this.participations);
-      this.dataSource.sortingDataAccessor = (item, property) => {
-        switch(property) {
-          case 'collaborateur': return item.collaborateur.nom + " "+ item.collaborateur.prenom;
-          case 'ep': return item.ep.statut;
-          case 'evaluation': return item.estEvaluee;    
-          default: return item[property];
-        }
-      };
-      this.dataSource.filterPredicate = (data, filter) => {
-        const formatted=this.pipe.transform(data.dateCreation,'dd/MM/yyyy');
-        return formatted.indexOf(filter) >= 0 || 
-          data.collaborateur.nom.toLocaleLowerCase().includes(filter) ||
-          data.collaborateur.prenom.toLocaleLowerCase().includes(filter);
-      };
+     
+    }
+
+    ngOnChanges() {
+      if(this.participations.length > 0) {
+        this.dataSource = new MatTableDataSource(this.participations);
+        this.dataSource.sortingDataAccessor = (item, property) => {
+          switch(property) {
+            case 'collaborateur': return item.collaborateur.nom + " "+ item.collaborateur.prenom;
+            case 'ep': return item.ep.statut;
+            case 'evaluation': return item.estEvaluee; 
+            case 'statut': return item.statut.libelle;      
+            default: return item[property];
+          }
+        };
+        this.dataSource.filterPredicate = (data, filter) => {
+          const formatted=this.pipe.transform(data.dateCreation,'dd/MM/yyyy');
+          return formatted.indexOf(filter) >= 0 || 
+            data.collaborateur.nom.toLocaleLowerCase().includes(filter) ||
+            data.collaborateur.prenom.toLocaleLowerCase().includes(filter) ||
+            data.intitule.toLocaleLowerCase().includes(filter) ||
+            data.statut.libelle.toLocaleLowerCase().includes(filter);
+        };
+      }
+     
     }
 
     ngAfterViewInit() {