Finalisation de la fonctionnalité de l'assignation du référent EP pour un ou plusieurs collaborateurs

develop
Yanaël GRETTE 4 years ago
parent 9a1d43fd54
commit 7855d4fcc5
  1. 16
      src/app/referents/assignation-referent/assignation-referent.component.html
  2. 113
      src/app/referents/assignation-referent/assignation-referent.component.ts
  3. 4
      src/app/referents/assignation-referent/dialog-assignation-referent.html
  4. 5
      src/app/referents/referents.module.ts
  5. 6
      src/app/shared/angular-material/angular-material.module.ts
  6. 4
      src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.css
  7. 8
      src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.html
  8. 16
      src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.ts

@ -9,7 +9,8 @@
<collaborateurs-table [typeRecherche]="typeRechercheReferent" [rechercherParBU]="rechercherParBu" [roles]="rolesReferents" [displayedColumns]="displayedColumnsReferent" [rechercherParDate]="rechercherParDate" (eventEmitter)="choixReferent($event)" ></collaborateurs-table> <collaborateurs-table [typeRecherche]="typeRechercheReferent" [rechercherParBU]="rechercherParBu" [roles]="rolesReferents" [displayedColumns]="displayedColumnsReferent" [rechercherParDate]="rechercherParDate" (eventEmitter)="choixReferent($event)" ></collaborateurs-table>
</mat-step> </mat-step>
<mat-step label="Choix des collaborateurs" [completed]="collaborateursSelectionnes.length != 0"> <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="referentChoisi != undefined">Référent sélectionné : {{referentChoisi.nom}} {{referentChoisi.prenom}}</p>
<p *ngIf="collaborateursSelectionnes.length == 0">Veuillez sélectionner un collaborateur</p> <p *ngIf="collaborateursSelectionnes.length == 0">Veuillez sélectionner un collaborateur</p>
<ng-container *ngIf="collaborateursSelectionnes.length != 0"> <ng-container *ngIf="collaborateursSelectionnes.length != 0">
@ -25,11 +26,18 @@
</mat-chip-list> </mat-chip-list>
</ng-container> </ng-container>
<collaborateurs-table [typeRecherche]="typeRechercheCollaborateursEP" [rechercherParBU]="rechercherParBu" [roles]="rolesCollaborateurs" [displayedColumns]="displayedColumnsCollaborateurs" [rechercherParDate]="rechercherParDate" [collaborateursEP]="collaborateursEP" (eventEmitter)="ajoutCollaborateur($event)" ></collaborateurs-table> <collaborateurs-table [typeRecherche]="typeRechercheCollaborateursEP" [rechercherParBU]="rechercherParBu" [roles]="rolesCollaborateurs" [displayedColumns]="displayedColumnsCollaborateurs" [rechercherParDate]="rechercherParDate" [collaborateursEP]="collaborateursEP" [collaborateursAjouts]="collaborateursSelectionnes" (eventEmitter)="ajoutCollaborateur($event)" ></collaborateurs-table>
</mat-step> </mat-step>
<mat-step label="Confirmation"> <mat-step label="Confirmation">
<p *ngIf="referentChoisi != undefined">Référent sélectionné : {{referentChoisi.nom}} {{referentChoisi.prenom}}</p>
<button mat-button >Valider</button> <p> Collaborateurs sélectionnés :</p>
<mat-chip-list >
<mat-chip
*ngFor="let collaborateur of collaborateursSelectionnes">
{{collaborateur.nom}} {{collaborateur.prenom}}
</mat-chip>
</mat-chip-list>
<button mat-raised-button color="primary" (click)="mettreAJourReferentEP()">Valider</button>
</mat-step> </mat-step>
</mat-horizontal-stepper> </mat-horizontal-stepper>

@ -1,14 +1,21 @@
import { Component, OnInit } from "@angular/core"; import { Component, Inject } from "@angular/core";
import { CollaborateurDTO, CollaborateursService } from "@shared/api-swagger"; import { CollaborateurDTO, CollaborateursService, ReferentsEPService, ReferentEPDTO } from "@shared/api-swagger";
import { collaborateurTypeRecherche } from "@shared/utils/cles"; import { collaborateurTypeRecherche } from "@shared/utils/cles";
import {MatDialog, MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { Subscription } from "rxjs"; import { Subscription } from "rxjs";
import { Router } from "@angular/router";
@Component({ @Component({
selector: 'assignation-referent', selector: 'assignation-referent',
templateUrl: './assignation-referent.component.html' templateUrl: './assignation-referent.component.html'
}) })
export class AssignationReferentComponent implements OnInit { export class AssignationReferentComponent {
rechercherParDate: boolean = false; rechercherParDate: boolean = false;
rechercherParBu: boolean = true; rechercherParBu: boolean = true;
@ -40,13 +47,13 @@ export class AssignationReferentComponent implements OnInit {
collaborateurSubscription: Subscription; collaborateurSubscription: Subscription;
constructor(private collaborateurService: CollaborateursService) {} referentEPSubscription: Subscription;
ngOnInit() {
constructor(private collaborateurService: CollaborateursService, private referentEPService: ReferentsEPService, private dialog: MatDialog,
private snackBar: MatSnackBar) {
} }
choixReferent(event) { choixReferent(event: any) {
this.referentChoisi = event.collaborateur; this.referentChoisi = event.collaborateur;
this.setCollaborateurEP(); this.setCollaborateurEP();
} }
@ -55,21 +62,101 @@ export class AssignationReferentComponent implements OnInit {
this.collaborateurSubscription = this.collaborateurService.getCollaborateursByReferent(this.referentChoisi.id).subscribe( this.collaborateurSubscription = this.collaborateurService.getCollaborateursByReferent(this.referentChoisi.id).subscribe(
collaborateurs => { collaborateurs => {
this.collaborateursEP = collaborateurs; this.collaborateursEP = collaborateurs;
this.collaborateursSelectionnes = this.collaborateursSelectionnes.filter(c => !this.contientCollaborateur(this.collaborateursEP, c));
}, },
error => console.log(error) error => console.log(error)
); );
} }
ajoutCollaborateur(event:any) { ajoutCollaborateur(event:any) {
console.log(event); if(event.type != "collaborateur")
if(!this.collaborateursSelectionnes.includes(event.collaborateur)) return;
this.collaborateursSelectionnes.push(event.collaborateur); if(event.collaborateur.id == this.referentChoisi.id) {
console.log(this.collaborateursSelectionnes); this.openSnackBar("Un collaborateur ne peut pas être son propre référent");
return;
}
if(this.contientCollaborateur(this.collaborateursSelectionnes, event.collaborateur)){
this.enleverCollaborateur(event.collaborateur);
return;
}
if(this.contientCollaborateur(this.collaborateursEP, event.collaborateur)){
this.openSnackBar("Le référent choisi est déjà le référent EP du collaborateur sélectionné")
return;
}
this.collaborateursSelectionnes.push(event.collaborateur);
}
peutAjouterCollaborateur(event) : boolean {
return event.type == "collaborateur" && !this.collaborateursSelectionnes.some(event.collaborateur) && !this.collaborateursEP.includes(event.collaborateur);
}
contientCollaborateur(listes: CollaborateurDTO[], collaborateur: CollaborateurDTO ) : boolean {
return listes.some(c => c.id == collaborateur.id);
} }
enleverCollaborateur(collaborateur: CollaborateurDTO) { enleverCollaborateur(collaborateur: CollaborateurDTO) {
this.collaborateursSelectionnes = this.collaborateursSelectionnes.filter(c => c.id != collaborateur.id); this.collaborateursSelectionnes = this.collaborateursSelectionnes.filter(c => c.id != collaborateur.id);
} }
mettreAJourReferentEP() {
const referentEP :ReferentEPDTO = {
idReferent: this.referentChoisi.id,
idsCollaborateur: this.collaborateursSelectionnes.map( collaborateur => collaborateur.id)
};
this.referentEPSubscription = this.referentEPService.updateCollaborateursReferent(referentEP, this.referentChoisi.id).subscribe(
() => this.openDialog(),
err => console.log(err)
)
}
openDialog() {
this.dialog.open(DialogAssignationReferentComponent, { disableClose: true, data: this.referentChoisi.id});
}
openSnackBar(message: string) {
this.snackBar.open(message,"", {
duration: 5000,
horizontalPosition: "center",
verticalPosition: "top",
});
}
/*
etapeAccessible(etape: number) {
switch(etape) {
case 1:
if(this.referentChoisi == undefined)
this.openSnackBar("Vous devez choisir un référent avant d'accéder à l'étape 2");
break;
case 2:
if(this.collaborateursSelectionnes.length == 0)
this.openSnackBar("Vous devez sélectionner au moins un collaborateur pour accéder à l'étape de confirmation");
break;
}
}*/
}
@Component({
selector: "dialog-assignation-referent",
templateUrl: "dialog-assignation-referent.html"
})
export class DialogAssignationReferentComponent {
constructor(private dialogRef: MatDialogRef<DialogAssignationReferentComponent>, @Inject(MAT_DIALOG_DATA) private data: string, private router: Router) {
}
home() {
this.router.navigate(["/home"]);
this.dialogRef.close();
}
detailsReferent() {
this.router.navigate(["/referents", this.data]);
this.dialogRef.close();
}
nouvelleAssignation() {
location.reload();
}
} }

@ -0,0 +1,4 @@
<p>La mise à jour du référent a été effectué avec succès</p>
<button mat-raised-button color="primary" (click)="home()">Retourner à l'accueil</button>
<button mat-raised-button color="primary" (click)="nouvelleAssignation()">Effectuer une nouvelle assignation référent</button>
<button mat-raised-button color="primary" (click)="detailsReferent()">Accéder aux détails du référent</button>

@ -10,11 +10,12 @@ import { MatTablesModule } from "@shared/mat-tables/mat-tables.module";
import { ReferentsComponent } from './referents.component'; import { ReferentsComponent } from './referents.component';
import { DetailsReferentComponent } from './details-referent/details-referent.component'; import { DetailsReferentComponent } from './details-referent/details-referent.component';
import { ReferentsRoutingModule } from './referents.routing.module'; import { ReferentsRoutingModule } from './referents.routing.module';
import { AssignationReferentComponent } from "./assignation-referent/assignation-referent.component"; import { AssignationReferentComponent, DialogAssignationReferentComponent } from "./assignation-referent/assignation-referent.component";
@NgModule({ @NgModule({
declarations: [ DetailsReferentComponent, declarations: [ DetailsReferentComponent,
ReferentsComponent, AssignationReferentComponent ReferentsComponent, AssignationReferentComponent,
DialogAssignationReferentComponent
], ],
exports: [ ReferentsComponent exports: [ ReferentsComponent
], ],

@ -18,7 +18,7 @@ import {MatCheckboxModule} from '@angular/material/checkbox';
import {MatSelectModule} from '@angular/material/select'; import {MatSelectModule} from '@angular/material/select';
import {MatStepperModule} from '@angular/material/stepper'; import {MatStepperModule} from '@angular/material/stepper';
import {MatChipsModule} from '@angular/material/chips'; import {MatChipsModule} from '@angular/material/chips';
import {MatSnackBarModule} from '@angular/material/snack-bar';
import { NgxMatDatetimePickerModule, NgxMatTimepickerModule, NgxMatNativeDateModule } from '@angular-material-components/datetime-picker'; import { NgxMatDatetimePickerModule, NgxMatTimepickerModule, NgxMatNativeDateModule } from '@angular-material-components/datetime-picker';
@ -36,7 +36,7 @@ import { NgxMatDatetimePickerModule, NgxMatTimepickerModule, NgxMatNativeDateMod
NgxMatDatetimePickerModule, MatDatepickerModule, NgxMatDatetimePickerModule, MatDatepickerModule,
NgxMatNativeDateModule, MatNativeDateModule, NgxMatNativeDateModule, MatNativeDateModule,
MatCheckboxModule, MatSelectModule, MatStepperModule, MatCheckboxModule, MatSelectModule, MatStepperModule,
MatChipsModule MatChipsModule, MatSnackBarModule
], ],
exports : [MatCardModule, exports : [MatCardModule,
MatButtonModule, MatMenuModule, MatButtonModule, MatMenuModule,
@ -47,7 +47,7 @@ import { NgxMatDatetimePickerModule, NgxMatTimepickerModule, NgxMatNativeDateMod
NgxMatDatetimePickerModule, MatDatepickerModule, NgxMatDatetimePickerModule, MatDatepickerModule,
NgxMatNativeDateModule, MatNativeDateModule, NgxMatNativeDateModule, MatNativeDateModule,
MatCheckboxModule, MatSelectModule, MatStepperModule, MatCheckboxModule, MatSelectModule, MatStepperModule,
MatChipsModule MatChipsModule, MatSnackBarModule
] ]
}) })
export class MaterialModule {} export class MaterialModule {}

@ -1,7 +1,7 @@
.collaborateurAjoute { .collaborateurAjoute {
background-color: dodgerblue; background-color: #5cb85c;
} }
.dejaCollaborateurEP { .dejaCollaborateurEP {
background-color: red; background-color: #337ab7;
} }

@ -16,11 +16,7 @@
<!--Checkboxes des BU--> <!--Checkboxes des BU-->
<ng-container *ngIf="rechercherParBU"> <ng-container *ngIf="rechercherParBU">
<ul> <mat-checkbox *ngFor="let bu of bus" (change)="updateCheckbox($event.checked,bu)" [checked]="true"> {{bu.nom}}</mat-checkbox>
<li *ngFor="let bu of bus">
<mat-checkbox (change)="updateCheckbox($event.checked,bu)" [checked]="true"> {{bu.nom}}</mat-checkbox>
</li>
</ul>
</ng-container> </ng-container>
<ng-container *ngIf="rechercherParDate"> <ng-container *ngIf="rechercherParDate">
@ -72,7 +68,7 @@
</ng-container> </ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row> <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row> <mat-row [ngClass]="setClassCouleurLigne(row)" *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table> </mat-table>
<mat-paginator #paginator <mat-paginator #paginator

@ -278,6 +278,19 @@ export class CollaborateursTableComponent implements OnInit {
} }
} }
setClassCouleurLigne(collaborateur: CollaborateurDTO) {
if(this.contientCollaborateur(this.collaborateursAjouts,collaborateur)) {
return "collaborateurAjoute";
}
if(this.contientCollaborateur(this.collaborateursEP,collaborateur))
return "dejaCollaborateurEP"
return "";
}
contientCollaborateur(listes: CollaborateurDTO[], collaborateur: CollaborateurDTO ) : boolean {
return listes.some(c => c.id == collaborateur.id);
}
/** /**
* Mettre à jour la liste des * Mettre à jour la liste des
* @param event case cochée ou décochée * @param event case cochée ou décochée
@ -306,4 +319,5 @@ export class CollaborateursTableComponent implements OnInit {
this.collaborateursDisponiblesCountSubscription.unsubscribe(); this.collaborateursDisponiblesCountSubscription.unsubscribe();
} }
} }
} }
Loading…
Cancel
Save