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

Ajout du composant ParticipationsFormationTableComponent dans details-formation

Browse Source
develop
jboinembalome 4 years ago
parent ca19622837
commit 58c98d78a1
2 changed files with 12 additions and 64 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. 36
      src/app/formations/details-formation/formation.component.html
  2. 40
      src/app/formations/details-formation/formation.component.ts

36
src/app/formations/details-formation/formation.component.html
Unescape View File

@ -24,41 +24,7 @@
<!-- Afficher la liste des participants --> <!-- Afficher la liste des participants -->
<ng-container *ngIf="formation.participations != undefined && formation.participations.length > 0"> <ng-container *ngIf="formation.participations != undefined && formation.participations.length > 0">
<h3>Liste des participants</h3> <h3>Liste des participants</h3>
<mat-table [dataSource]="dataSource"> <participations-formation-table [participations]="formation.participations" [displayedColumns]="displayedColumns"></participations-formation-table>
<ng-container matColumnDef="collaborateur">
<mat-header-cell *matHeaderCellDef>Collaborateur</mat-header-cell>
<!-- Lien vers les détails du collaborateur -->
<mat-cell *matCellDef="let row" [routerLink]="['/collaborateurs', row.idCollaborateur]">{{row.collaborateur}}</mat-cell>
</ng-container>
<ng-container matColumnDef="dateinscription">
<mat-header-cell *matHeaderCellDef>Inscrit le</mat-header-cell>
<mat-cell *matCellDef="let row">{{row.dateCreation | date :'dd/MM/yy à HH:mm'}}</mat-cell>
</ng-container>
<!--
<ng-container matColumnDef="ep">
<mat-header-cell *matHeaderCellDef>EP</mat-header-cell>
<mat-cell *matCellDef="let row">
<p *ngIf="row.statutEP>=5" [routerLink]="['/ep',row.idEP]">Voir EP</p>
<p *ngIf="row.statutEP>=2 && row.statutEP<5" [routerLink]="['/ep',row.idEP]">EP en cours</p>
<p *ngIf="row.statutEP<=1">Attente prochain EP</p>
</mat-cell>
</ng-container>
-->
<ng-container matColumnDef="evaluation">
<mat-header-cell *matHeaderCellDef>Evaluations</mat-header-cell>
<mat-cell *matCellDef="let row">
<p *ngIf="row.estEvaluee" [routerLink]="['/collaborateurs',row.idCollaborateur,'formations','evaluation',row.id]">Voir évaluation</p>
<p *ngIf="!row.estEvaluee">Attente évaluation</p>
</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
</ng-container> </ng-container>
</ng-container> </ng-container>
<mat-spinner *ngIf="formation==undefined"></mat-spinner> <mat-spinner *ngIf="formation==undefined"></mat-spinner>

40
src/app/formations/details-formation/formation.component.ts
Unescape View File

@ -3,12 +3,8 @@ import { Component, OnInit } from '@angular/core';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
import {ActivatedRoute} from '@angular/router'; import {ActivatedRoute} from '@angular/router';
import {MatTableDataSource} from '@angular/material/table';
import {MatPaginator} from '@angular/material/paginator';
import {MatSort} from '@angular/material/sort';
import { FormationsService } from '@shared/api-swagger/api/api'; import { FormationsService } from '@shared/api-swagger/api/api';
import { FormationDTO, ParticipationFormationDTO } from "@shared/api-swagger/model/models"; import { FormationDTO } from "@shared/api-swagger/model/models";
/** /**
* Composant qui permet l'affichage des détails d'une formation ainsi que de sa liste de participants. * Composant qui permet l'affichage des détails d'une formation ainsi que de sa liste de participants.
@ -19,26 +15,22 @@ import { FormationDTO, ParticipationFormationDTO } from "@shared/api-swagger/mod
}) })
export class FormationComponent implements OnInit { export class FormationComponent implements OnInit {
/** /**
* Formation à rechercher * Formation à rechercher
*/ */
formation:FormationDTO; formation:FormationDTO;
/** /**
* Observable pour récuperer la formation à rechercher * Observable pour récuperer la formation à rechercher
*/ */
formationSubscription: Subscription; formationSubscription: Subscription;
/**
* dataSource qui stocke la liste des participations à afficher dans le Mat Table
*/
dataSource : MatTableDataSource<ParticipationFormationDTO>;
/** /**
* Les conlonnes à afficher dans le Mat Table * Les conlonnes à afficher dans le Mat Table
*/ */
displayedColumns: string[]= ["agence", "collaborateur", "dateinscription", "ep"]; displayedColumns: string[]= ["collaborateur", "dateCreation", "ep", "evaluation"];
/** /**
* id de la formation à récupérer dans l'URL. * id de la formation à récupérer dans l'URL.
*/ */
id:any id:any
constructor(private service:FormationsService,private route:ActivatedRoute) {} constructor(private service:FormationsService,private route:ActivatedRoute) {}
@ -47,20 +39,10 @@ export class FormationComponent implements OnInit {
// récupérer l'id de la formation dans l'URL // récupérer l'id de la formation dans l'URL
this.id = this.route.snapshot.paramMap.get('id'); this.id = this.route.snapshot.paramMap.get('id');
this.formationSubscription = this.service.getFormationById(this.id).subscribe( this.formationSubscription = this.service.getFormationById(this.id).subscribe(
formation => this.initFormation(formation) formation => this.formation = formation
); );
} }
/**
* Initialisé la formation et ses participations si il y en a
*/
initFormation(formation:FormationDTO) {
this.formation = formation;
if(formation.participations != undefined && formation.participations.length != 0 ) {
this.dataSource = new MatTableDataSource(formation.participations);
}
}
/** /**
* Une fois la page fermée, il est nécessaire de se désabonner des Oberservable afin d'éviter les fuites mémoires. * Une fois la page fermée, il est nécessaire de se désabonner des Oberservable afin d'éviter les fuites mémoires.
*/ */

Write Preview
Loading…
Cancel
Save