Affichage de la liste des collaborateurs d'un référent depuis ses détails

src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.html

@@ -9,12 +9,26 @@
     <p *ngIf="!estReferent && collaborateur.dateDepart!=undefined"><b>Date départ : {{ collaborateur.dateDepart | date: 'dd MMMM yyyy'}}</b></p>
 
     <mat-tab-group mat-align-tabs="start">
-        <mat-tab *ngIf="!estReferent" label="Liste des EP"><h3>Liste des EP</h3></mat-tab>
-        <mat-tab *ngIf="!estReferent" label="Liste des futurs formations"><h3>Liste des futurs formations</h3></mat-tab>
-        <mat-tab *ngIf="!estReferent" label="Liste des formations effectuées"><h3>Liste des formations effectuées</h3></mat-tab>
-        <mat-tab *ngIf="estReferent" label="Liste des collaborateurs"><h3>Liste des collaborateurs</h3></mat-tab>
-        <mat-tab *ngIf="estReferent" label="Liste des EP effectués"><h3>Liste des EP effectués</h3></mat-tab>
-        <mat-tab *ngIf="estReferent" label="Liste des EP en cours"><h3>Liste des EP en cours</h3></mat-tab>
+        <mat-tab *ngIf="!estReferent" label="Liste des EP">
+            <h3>Liste des EP</h3>
+        </mat-tab>
+        
+        <mat-tab *ngIf="!estReferent" label="Liste des formations">
+            <h3>Liste des formations</h3>
+        </mat-tab>
+        
+        <mat-tab *ngIf="estReferent" label="Liste des collaborateurs">
+            <h3>Liste des collaborateurs</h3>
+            <collaborateurs-table [rechercherParBU]="rechercherParBU" [displayedColumns]="displayedColumns" [typeRecherche]="typeRecherche" [idReferent]="idCollaborateur" ></collaborateurs-table>
+        </mat-tab>
+        
+        <mat-tab *ngIf="estReferent" label="Liste des EP effectués">
+            <h3>Liste des EP effectués</h3>
+        </mat-tab>
+        
+        <mat-tab *ngIf="estReferent" label="Liste des EP en cours">
+            <h3>Liste des EP en cours</h3>
+        </mat-tab>
     </mat-tab-group>
 
 </ng-container>

src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.module.ts

@@ -4,7 +4,7 @@ import { FormsModule } from '@angular/forms';
 
 import { MaterialModule } from "../angular-material/angular-material.module";
 import { AffichageDetailsCollaborateurComponent } from "@shared/affichage-details-collaboarteur/affichage-details-collaborateur";
-
+import { MatTablesModule } from '@shared/mat-tables/mat-tables.module';
 
 @NgModule({
   declarations: [ 
@@ -13,7 +13,8 @@ import { AffichageDetailsCollaborateurComponent } from "@shared/affichage-detail
   imports: [
     MaterialModule,
     CommonModule,
-    FormsModule
+    FormsModule,
+    MatTablesModule
   ],
   exports: [AffichageDetailsCollaborateurComponent]
 })

src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.ts

@@ -1,6 +1,7 @@
 import { Component, Input, OnInit } from "@angular/core";
 import { CollaborateurDTO, CollaborateursService } from "@shared/api-swagger";
 import { Subscription } from "rxjs";
+import { collaborateurTypeRecherche } from "@shared/utils/cles";
 
 @Component({
     selector: "affichage-details-collaborateur",
@@ -10,6 +11,14 @@ export class AffichageDetailsCollaborateurComponent implements OnInit{
     @Input() idCollaborateur: string;
     @Input() estReferent: boolean=false;
     
+    
+    typeRecherche : string = collaborateurTypeRecherche.collaborateursEP;
+    
+    displayedColumns : string[] = ["businessunit", "collaborateur", "datearrivee"];
+    
+    rechercherParBU: boolean = true;
+
+
     collaborateur: CollaborateurDTO = undefined;
     private collaborateurSubscription: Subscription;
 

src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.ts

@@ -70,7 +70,7 @@ export class CollaborateursTableComponent implements OnInit {
     /**
      * Nombre total d'élément du tableau
      */
-    taille: number;
+    taille: number = 0;
 
 
     /**
@@ -93,6 +93,9 @@ export class CollaborateursTableComponent implements OnInit {
      */
     dateFin: Date = undefined;
 
+
+    @Input() idReferent: string;
+
     /**
      * Indiquer si il s'agit d'une recherche collaborateur, d'un recherche référentEP ou d'une recherche collaborateurEP d'un référent
      */
@@ -193,7 +196,7 @@ export class CollaborateursTableComponent implements OnInit {
        * Afficher les informations des collaborateursEP d'un référent 
        */
       updateCollaborateursEP() {
-        this.collaborateursDisponiblesSubscription = this.service.getCollaborateursByReferent(this.collaborateurConnecte.id, this.asc, this.numPage, this.parPage, this.search, this.tri).subscribe(
+        this.collaborateursDisponiblesSubscription = this.service.getCollaborateursByReferent(this.idReferent, this.asc, this.numPage, this.parPage, this.search, this.tri).subscribe(
             collaborateurs => { console.log(collaborateurs); this.dataSource = new MatTableDataSource(collaborateurs);},
             err => console.log(err)
           );