From 9a1d43fd54eeeb8ee24a2267800afd08267cf146 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yana=C3=ABl=20GRETTE?= <yanael.grette@outlook.com>
Date: Wed, 10 Feb 2021 17:44:40 +0100
Subject: [PATCH] =?UTF-8?q?impl=C3=A9mentation=20de=20la=20r=C3=A9cup?=
 =?UTF-8?q?=C3=A9ration=20des=20collaborateurs=20dont=20le=20r=C3=A9f?=
 =?UTF-8?q?=C3=A9rent=20doit=20=C3=AAtre=20mise=20=C3=A0=20jour?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../assignation-referent.component.html       | 23 ++++++++++++++++---
 .../assignation-referent.component.ts         | 21 ++++++++++++++---
 .../angular-material.module.ts                |  8 +++++--
 .../collaborateurs.table.css                  |  2 +-
 4 files changed, 45 insertions(+), 9 deletions(-)

diff --git a/src/app/referents/assignation-referent/assignation-referent.component.html b/src/app/referents/assignation-referent/assignation-referent.component.html
index b20fd91..3930f8b 100644
--- a/src/app/referents/assignation-referent/assignation-referent.component.html
+++ b/src/app/referents/assignation-referent/assignation-referent.component.html
@@ -1,18 +1,35 @@
 <app-nav-menu></app-nav-menu>
 <h1>Assignation référent</h1>
 
-<p *ngIf="referentChoisi != undefined">Référent sélectionné : {{referentChoisi.nom}} {{referentChoisi.prenom}}</p>
 
 <mat-horizontal-stepper linear  #stepper>
     <mat-step label="Choix du référent" [completed]="referentChoisi != undefined">
+        <p *ngIf="referentChoisi == undefined">Veuillez sélectionner un référent</p>
+        <p *ngIf="referentChoisi != undefined">Référent sélectionné : {{referentChoisi.nom}} {{referentChoisi.prenom}}</p>
         <collaborateurs-table [typeRecherche]="typeRechercheReferent" [rechercherParBU]="rechercherParBu" [roles]="rolesReferents" [displayedColumns]="displayedColumnsReferent" [rechercherParDate]="rechercherParDate" (eventEmitter)="choixReferent($event)" ></collaborateurs-table>
     </mat-step>
 
-    <mat-step label="Choix des collaborateurs" [completed]="false">
+    <mat-step label="Choix des collaborateurs" [completed]="collaborateursSelectionnes.length != 0">
+        <p *ngIf="referentChoisi != undefined">Référent sélectionné : {{referentChoisi.nom}} {{referentChoisi.prenom}}</p>
+        <p *ngIf="collaborateursSelectionnes.length == 0">Veuillez sélectionner un collaborateur</p>
+        <ng-container *ngIf="collaborateursSelectionnes.length != 0">
+            <p> Collaborateurs sélectionnés :</p>
+            <mat-chip-list >
+                <mat-chip
+                    *ngFor="let collaborateur of collaborateursSelectionnes"
+                    [removable]="true"
+                    (removed)="enleverCollaborateur(collaborateur)">
+                    {{collaborateur.nom}} {{collaborateur.prenom}}
+                    <mat-icon matChipRemove>cancel</mat-icon>
+                </mat-chip>
+            </mat-chip-list>
+        </ng-container>
+
+        <collaborateurs-table [typeRecherche]="typeRechercheCollaborateursEP" [rechercherParBU]="rechercherParBu" [roles]="rolesCollaborateurs" [displayedColumns]="displayedColumnsCollaborateurs" [rechercherParDate]="rechercherParDate" [collaborateursEP]="collaborateursEP" (eventEmitter)="ajoutCollaborateur($event)" ></collaborateurs-table>
     </mat-step>
 
     <mat-step label="Confirmation">
-        <button mat-button matStepperPrevious>Retour</button>
+
         <button mat-button >Valider</button>
     </mat-step>
 </mat-horizontal-stepper>
\ No newline at end of file
diff --git a/src/app/referents/assignation-referent/assignation-referent.component.ts b/src/app/referents/assignation-referent/assignation-referent.component.ts
index 0bff504..7308e16 100644
--- a/src/app/referents/assignation-referent/assignation-referent.component.ts
+++ b/src/app/referents/assignation-referent/assignation-referent.component.ts
@@ -17,12 +17,17 @@ export class AssignationReferentComponent implements OnInit {
     
     rolesReferents : string[] = ["Manager", "RA", "CP", "TL"];
 
-    rolesCollaborateurs : ["Collaborateur"];
-
+    
     typeRechercheReferent: string = collaborateurTypeRecherche.referents;
     
     collaborateursEP: CollaborateurDTO[] = [];
+    
+    rolesCollaborateurs : string[] = ["Collaborateur"];
+
+    typeRechercheCollaborateursEP = collaborateurTypeRecherche.collaborateurs;
 
+    collaborateursSelectionnes: CollaborateurDTO[] = [];
+    
     /**
         * Liste des colonnes du tableau à afficher pour les référents.
         */
@@ -31,7 +36,7 @@ export class AssignationReferentComponent implements OnInit {
     /**
         * Liste des colonnes du tableau à afficher.
         */
-    displayedColumns : string[] = ["businessunit", "collaborateur"];
+    displayedColumnsCollaborateurs : string[] = ["businessunit", "collaborateur", "datearrivee", "referent"];
     
     collaborateurSubscription: Subscription;
 
@@ -56,5 +61,15 @@ export class AssignationReferentComponent implements OnInit {
         );
     }
 
+    ajoutCollaborateur(event:any) {
+        console.log(event);
+        if(!this.collaborateursSelectionnes.includes(event.collaborateur))
+            this.collaborateursSelectionnes.push(event.collaborateur);
+        console.log(this.collaborateursSelectionnes);
+    }
+
+    enleverCollaborateur(collaborateur: CollaborateurDTO) {
+        this.collaborateursSelectionnes = this.collaborateursSelectionnes.filter(c => c.id != collaborateur.id);
+    }
 
 }
\ No newline at end of file
diff --git a/src/app/shared/angular-material/angular-material.module.ts b/src/app/shared/angular-material/angular-material.module.ts
index 39dd4b9..538300c 100644
--- a/src/app/shared/angular-material/angular-material.module.ts
+++ b/src/app/shared/angular-material/angular-material.module.ts
@@ -17,6 +17,8 @@ import {MatNativeDateModule} from '@angular/material/core';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatSelectModule} from '@angular/material/select';
 import {MatStepperModule} from '@angular/material/stepper';
+import {MatChipsModule} from '@angular/material/chips';
+
 
 import { NgxMatDatetimePickerModule, NgxMatTimepickerModule, NgxMatNativeDateModule } from '@angular-material-components/datetime-picker';
 
@@ -33,7 +35,8 @@ import { NgxMatDatetimePickerModule, NgxMatTimepickerModule, NgxMatNativeDateMod
     MatTabsModule, MatFormFieldModule,
     NgxMatDatetimePickerModule, MatDatepickerModule,
     NgxMatNativeDateModule, MatNativeDateModule,
-    MatCheckboxModule, MatSelectModule, MatStepperModule
+    MatCheckboxModule, MatSelectModule, MatStepperModule,
+    MatChipsModule
   ],
   exports : [MatCardModule,
     MatButtonModule, MatMenuModule,
@@ -43,7 +46,8 @@ import { NgxMatDatetimePickerModule, NgxMatTimepickerModule, NgxMatNativeDateMod
     MatTabsModule, MatFormFieldModule,
     NgxMatDatetimePickerModule, MatDatepickerModule,
     NgxMatNativeDateModule, MatNativeDateModule,
-    MatCheckboxModule, MatSelectModule, MatStepperModule
+    MatCheckboxModule, MatSelectModule, MatStepperModule,
+    MatChipsModule
   ]
 })
 export class MaterialModule {}
diff --git a/src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.css b/src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.css
index aeb720b..9191d36 100644
--- a/src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.css
+++ b/src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.css
@@ -3,5 +3,5 @@
 }
 
 .dejaCollaborateurEP {
-
+    background-color: red;
 }
\ No newline at end of file