ygrette
/
Digitalisation_EPA_Client
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

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

Browse Source
develop
Yanaël GRETTE 4 years ago
parent 76b666ccdc
commit 06d13b43f9
5 changed files with 82 additions and 58 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 21
      src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.html
  2. 5
      src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.module.ts
  3. 9
      src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.ts
  4. 96
      src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.html
  5. 9
      src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.ts

21
src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.html
Unescape View File

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

5
src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.module.ts
Unescape View File

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

9
src/app/shared/affichage-details-collaboarteur/affichage-details-collaborateur.ts
Unescape View File

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

96
src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.html
Unescape View File

@ -3,20 +3,19 @@
</ng-container> </ng-container>
<ng-container *ngIf="!chargement"> <ng-container *ngIf="!chargement">
<!-- Barre de recherche -->
<!-- Barre de recherche --> <mat-form-field>
<mat-form-field> <mat-label>Rechercher un collaborateur</mat-label>
<mat-label>Rechercher un collaborateur</mat-label> <input matInput type="text" [(ngModel)]="search" (keyup)="setSearch()">
<input matInput type="text" [(ngModel)]="search" (keyup)="setSearch()"> <mat-button *ngIf="search" matSuffix mat-icon-button aria-label="Clear" (click)="resetSearch()">
<mat-button *ngIf="search" matSuffix mat-icon-button aria-label="Clear" (click)="resetSearch()"> <mat-icon>close</mat-icon>
<mat-icon>close</mat-icon> </mat-button>
</mat-button> </mat-form-field>
</mat-form-field>
<!--Checkboxes des BU--> <!--Checkboxes des BU-->
<ng-container *ngIf="rechercherParBU"> <ng-container *ngIf="rechercherParBU">
<mat-checkbox *ngFor="let bu of bus" (change)="updateCheckbox($event.checked,bu)" [checked]="true"> {{bu.nom}}</mat-checkbox> <mat-checkbox *ngFor="let bu of bus" (change)="updateCheckbox($event.checked,bu)" [checked]="true"> {{bu.nom}}</mat-checkbox>
</ng-container> </ng-container>
<ng-container *ngIf="rechercherParDate"> <ng-container *ngIf="rechercherParDate">
@ -30,7 +29,7 @@
</mat-form-field> </mat-form-field>
<!-- Datepicker fin --> <!-- Datepicker fin -->
<mat-form-field > <mat-form-field>
<mat-label>Date de fin</mat-label> <mat-label>Date de fin</mat-label>
<input [(ngModel)]="dateFin" matInput [matDatepicker]="dateFinPicker" [min]="dateDebut" disabled (dateChange)="updateDataSource()"> <input [(ngModel)]="dateFin" matInput [matDatepicker]="dateFinPicker" [min]="dateDebut" disabled (dateChange)="updateDataSource()">
<mat-icon *ngIf="this.dateFin != undefined" matDatepickerToggleIcon (click)="updateDateToUndefined(2)">clear</mat-icon> <mat-icon *ngIf="this.dateFin != undefined" matDatepickerToggleIcon (click)="updateDateToUndefined(2)">clear</mat-icon>
@ -38,46 +37,49 @@
<mat-datepicker touchUi #dateFinPicker disabled="false"></mat-datepicker> <mat-datepicker touchUi #dateFinPicker disabled="false"></mat-datepicker>
</mat-form-field> </mat-form-field>
</ng-container> </ng-container>
<ng-container *ngIf="taille == 0">
<p>Aucun collaborateur à afficher</p>
</ng-container>
<ng-container *ngIf="taille != 0">
<!-- Affichage de la liste des collaborateurs -->
<!-- Affichage de la liste des collaborateurs --> <mat-table matSort [dataSource]="dataSource" (matSortChange)="triTableau($event)" matSortActive="{{this.tri}}" matSortDirection="asc" >
<ng-container matColumnDef="businessunit">
<mat-table matSort [dataSource]="dataSource" (matSortChange)="triTableau($event)" matSortActive="{{this.tri}}" matSortDirection="asc" > <mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Agence</mat-header-cell>
<mat-cell *matCellDef="let row">{{ row.businessUnit.nom }}</mat-cell>
<ng-container matColumnDef="businessunit"> </ng-container>
<mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Agence</mat-header-cell>
<mat-cell *matCellDef="let row">{{ row.businessUnit.nom }}</mat-cell>
</ng-container>
<ng-container matColumnDef="collaborateur"> <ng-container matColumnDef="collaborateur">
<mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Collabotareur</mat-header-cell> <mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Collabotareur</mat-header-cell>
<mat-cell *matCellDef="let row" (click)="emitEvent(row,'collaborateur')">{{row.nom}} {{row.prenom}}</mat-cell> <mat-cell *matCellDef="let row" (click)="emitEvent(row,'collaborateur')">{{row.nom}} {{row.prenom}}</mat-cell>
</ng-container> </ng-container>
<ng-container matColumnDef="datearrivee"> <ng-container matColumnDef="datearrivee">
<mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Date embauche</mat-header-cell> <mat-header-cell *matHeaderCellDef mat-sort-header disableClear>Date embauche</mat-header-cell>
<mat-cell *matCellDef="let row">{{row.dateArrivee | date:'dd/MM/yyyy'}}</mat-cell> <mat-cell *matCellDef="let row">{{row.dateArrivee | date:'dd/MM/yyyy'}}</mat-cell>
</ng-container> </ng-container>
<ng-container matColumnDef="referent"> <ng-container matColumnDef="referent">
<mat-header-cell *matHeaderCellDef >Référent</mat-header-cell> <mat-header-cell *matHeaderCellDef >Référent</mat-header-cell>
<mat-cell *matCellDef="let row" > <mat-cell *matCellDef="let row" >
<mat-cell *ngIf="row.referent" (click)="emitEvent(row.referent,'referent')">{{ row.referent.prenom }} {{ row.referent.nom }}</mat-cell> <mat-cell *ngIf="row.referent" (click)="emitEvent(row.referent,'referent')">{{ row.referent.prenom }} {{ row.referent.nom }}</mat-cell>
<mat-cell *ngIf="!row.referent">Aucun référent</mat-cell> <mat-cell *ngIf="!row.referent">Aucun référent</mat-cell>
</mat-cell> </mat-cell>
</ng-container> </ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row> <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row [ngClass]="setClassCouleurLigne(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
[length] = "taille" [length] = "taille"
[pageIndex]="numPage-1" [pageIndex]="numPage-1"
[pageSize]="parPage" [pageSize]="parPage"
[pageSizeOptions]="pageOption" [pageSizeOptions]="pageOption"
(page)="updatePageInfo($event)" (page)="updatePageInfo($event)">
>
</mat-paginator> </mat-paginator>
</ng-container>
</ng-container> </ng-container>

9
src/app/shared/mat-tables/collaborateurs-table/collaborateurs.table.ts
Unescape View File

@ -70,7 +70,7 @@ export class CollaborateursTableComponent implements OnInit {
/** /**
* Nombre total d'élément du tableau * Nombre total d'élément du tableau
*/ */
taille: number; taille: number = 0;
/** /**
@ -93,6 +93,9 @@ export class CollaborateursTableComponent implements OnInit {
*/ */
dateFin: Date = undefined; 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 * 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,11 +196,11 @@ export class CollaborateursTableComponent implements OnInit {
* Afficher les informations des collaborateursEP d'un référent * Afficher les informations des collaborateursEP d'un référent
*/ */
updateCollaborateursEP() { 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);}, collaborateurs => { console.log(collaborateurs); this.dataSource = new MatTableDataSource(collaborateurs);},
err => console.log(err) err => console.log(err)
); );
this.collaborateursDisponiblesCountSubscription = this.service.getCollaborateursByReferentCount(this.collaborateurConnecte.id, this.asc, this.numPage, this.parPage, this.search, this.tri).subscribe( this.collaborateursDisponiblesCountSubscription = this.service.getCollaborateursByReferentCount(this.idReferent, this.asc, this.numPage, this.parPage, this.search, this.tri).subscribe(
count => { console.log(count); this.taille=count;}, count => { console.log(count); this.taille=count;},
err => console.log(err) err => console.log(err)
); );

Write Preview
Loading…
Cancel
Save