Début mplémentation visuelle des détails d'un EP

src/app/ep/details-ep/details-ep.component.css

@@ -0,0 +1,4 @@
+.saisie {
+    overflow-y: scroll;
+    height: 60%;
+}

src/app/ep/details-ep/details-ep.component.html

@@ -0,0 +1,104 @@
+<app-nav-menu></app-nav-menu>
+<div class="detailsep">
+    <p> Collaborateur : NOM PRENOM (AGENCE) <button mat-stroked-button>Accéder au détails</button></p> 
+    <p> Référent : NOM PRENOM </p>
+    <p> Entretien le : dd/MM/yyyy</p>
+    <p> EPA</p>
+
+    <button mat-raised-button color="primary" title="Valider le déroulement de l'entretien">Valider entretien</button>
+
+    <button mat-raised-button color="primary" title="Signer l'EP">Signer</button>
+
+    <mat-tab-group mat-align-tabs="start">
+        <mat-tab label="La saisie">
+            
+            <mat-vertical-stepper class="saisie" linear  #stepper>
+                <mat-step label="Les objectifs précédents" completed="true">
+
+                </mat-step>
+
+                <mat-step label="Mission/Projet" completed="true">
+
+                </mat-step>
+
+                <mat-step label="Compétences générales" completed="true">
+
+                </mat-step>
+
+                <mat-step label="Compétences techniques" completed="true">
+
+                </mat-step>
+
+                <mat-step label="Apside" completed="true">
+
+                </mat-step>
+
+                <mat-step label="Objectifs" completed="true">
+
+                </mat-step>
+
+
+                <mat-step label="Engagements" completed="true">
+
+
+                </mat-step>
+
+                <mat-step label="Demandes de formation" completed="true">
+
+                </mat-step>
+                <mat-step label="Demande d'augmentation salaire" completed="true">
+
+                </mat-step>
+
+                <mat-step label="Formation effectuée" completed="true">
+
+                </mat-step>
+
+                <mat-step label="Evolution du collaborateur" completed="true">
+                    
+                </mat-step>
+
+            </mat-vertical-stepper>
+
+
+
+
+
+
+        </mat-tab>
+        <mat-tab label="Commentaire assistant">
+            Ajout et consultation des commentaires (pour les assistants)
+        </mat-tab>
+
+        <mat-tab label="Choix de dates"> 
+            Le collaborateur choisi une date parmi la liste des dates proposés (collaborateur)
+        </mat-tab>
+
+        <mat-tab label="Proposition de date">
+            Le référent propose trois dates d'entretien (référent)
+        </mat-tab>
+        <mat-tab label="Demande délégation">
+            Effectuer une demande de délégation (Assistant et référent)
+        </mat-tab>
+        <mat-tab label="Les participants">
+            Ajouter et enlever des participants (Assistants et référent)
+        </mat-tab>
+
+      </mat-tab-group>
+</div>
+
+<!--
+
+    <ng-container *ngIf="ep == undefined" >
+        <mat-spinner></mat-spinner>
+    </ng-container>
+    
+    <ng-container *ngIf="ep != undefined">
+        <p> Collaborateur : {{ep.collaborateur.nom + " " + ep.collaborateur.prenom}}</p>
+        <p *ngIf="ep.referent != undefined"> Référent : {{ep.referent.nom + " " + ep.referent.prenom}}</p>
+        <p *ngIf="ep.referent == undefined"> Aucun référent pour </p>
+        <p> Entretien le : {{ep.datePrevisionnelle }}</p>
+        
+        
+    </ng-container>
+-->

src/app/ep/details-ep/details-ep.component.ts

@@ -0,0 +1,35 @@
+import { Component, OnInit } from "@angular/core";
+import { ActivatedRoute } from "@angular/router";
+import { EpDTO, EpService } from "@shared/api-swagger";
+import { AuthService } from "@shared/auth/auth.service";
+import { Role } from "@shared/utils/roles";
+import { Subscription } from "rxjs";
+
+@Component({
+    selector : "details-ep",
+    templateUrl: "./details-ep.component.html",
+    styleUrls: ["./details-ep.component.css"]
+})
+export class DetailsEPComponent implements OnInit {
+
+    epSubscription : Subscription;
+
+    idEp: any;
+
+    role : Role;
+    roleUtilisateur: string;
+
+    ep : EpDTO;
+    constructor(private epService : EpService, private route : ActivatedRoute, private authService: AuthService) {
+        this.roleUtilisateur = authService.firstRole;
+    }
+
+    ngOnInit() {
+        /*
+        this.idEp = this.route.snapshot.paramMap.get("id");
+        this.epSubscription = this.epService.getEPById(this.idEp).subscribe(
+            ep => this.ep = ep,
+            err => console.log(err) 
+        );*/
+    }
+}

src/app/ep/ep-signes/ep-signes.component.html

@@ -0,0 +1,3 @@
+<app-nav-menu></app-nav-menu>
+<h1>Liste des EP collaborateurs signés</h1>
+<ep-table [typeRechercheEP]="typeRechercheEP" [displayedColumns]="displayedColumns" (eventEmitter)="eventEmitter($event)"></ep-table>

src/app/ep/ep-signes/ep-signes.component.ts

@@ -0,0 +1,35 @@
+import { Component } from '@angular/core';
+import { Router } from '@angular/router';
+import { epTypeRecherche } from '@shared/utils/cles';
+
+/**
+  * Composant qui permet la consultation de la liste des EP signés collaborateur
+  */
+@Component({
+  selector: 'app-ep-signes',
+  templateUrl: './ep-signes.component.html'
+})
+export class EpSignesComponent {
+  displayedColumns: string[] = ["agence", "collaborateur", "referent", "datearrivee", "statutep", "typeep", "dateentretien", "consultation"];
+  
+  typeRechercheEP : string = epTypeRecherche.EPSignes;
+
+  constructor(private router: Router){}
+
+
+  eventEmitter(event: any) {
+    switch(event.type) {
+      case "collaborateur":
+        if(event.ep.collaborateur != undefined)
+          this.router.navigate(["/collaborateurs", event.ep.collaborateur.id])
+        break;
+      case "referent":
+        if(event.ep.referent != undefined)
+          this.router.navigate(["/referents", event.ep.referent.id])
+        break;
+      case "ep":
+        this.router.navigate(["/ep", event.ep.id]);
+        break;
+    }
+  }
+}

src/app/ep/ep.component.html

@@ -1,3 +1,22 @@
 <app-nav-menu></app-nav-menu>
-<h1>Liste des EP collaborateurs</h1>
+<h2>Vos EP</h2>
-<ep-table [typeRechercheEP]="typeRechercheEP" [displayedColumns]="displayedColumns" (eventEmitter)="eventEmitter($event)"></ep-table>
+
+<ng-container *ngIf="idCollaborateur == undefined">
+
+    <mat-spinner></mat-spinner>
+</ng-container>
+<ng-container *ngIf="idCollaborateur != undefined">
+    <mat-tab-group  mat-align-tabs="start">
+        <mat-tab label="EP signés">
+            <ep-table [rechercherParBU]="false" [rechercherParDate]="true" [typeRechercheEP]="epTypeRecherche.RechercheEPCollaborateursSignes" [displayedColumns]="displayedColumnsEPSignes" [idCollaborateur]="idCollaborateur" (eventEmitter)="ouvrirEP($event)" ></ep-table>
+        </mat-tab>
+        
+        <mat-tab label="EP référent">
+            <ep-table [rechercherParBU]="false" [rechercherParDate]="true" [typeRechercheEP]="epTypeRecherche.RechercheEPReferentSignes" [displayedColumns]="displayedColumnsEPReferent" [idCollaborateur]="idCollaborateur" (eventEmitter)="ouvrirEP($event)" ></ep-table>
+        </mat-tab>
+        
+        <mat-tab label="EP Participant">
+            TODO
+        </mat-tab>
+    </mat-tab-group>
+</ng-container>

src/app/ep/ep.component.ts

@@ -1,35 +1,54 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
-import { epTypeRecherche } from '@shared/utils/cles';
+import { CollaborateurDTO } from '@shared/api-swagger';
+import { AuthService } from '@shared/auth/auth.service';
+import { cles, epTypeRecherche } from '@shared/utils/cles';
+import { Role } from '@shared/utils/roles';
+
+
 
-/**
-  * Composant qui permet la consultation d'un EP
-  */
 @Component({
   selector: 'app-ep',
   templateUrl: './ep.component.html'
 })
-export class EpComponent {
+export class EpComponent implements OnInit {
-  displayedColumns: string[] = ["agence", "collaborateur", "referent", "datearrivee", "statutep", "typeep", "dateentretien", "consultation"];
   
-  typeRechercheEP : string = epTypeRecherche.EPSignes;
+
-
+  role = Role;
-  constructor(private router: Router){}
+  /**
-
+    * Le rôle de l'utilisateur.
-
+    */
-  eventEmitter(event: any) {
+  userRole : string;
-    switch(event.type) {
+
-      case "collaborateur":
+  displayedColumnsEPSignes : string[] = ["referent", "statutep","typeep", "dateentretien", "consultation"];
-        if(event.ep.collaborateur != undefined)
+  displayedColumnsEPReferent : string[] = ["agence", "collaborateur", "datearrivee", "statutep","typeep", "dateentretien", "consultation"];
-          this.router.navigate(["/collaborateurs", event.ep.collaborateur.id])
+  displayedColumnsEPParticipant : string[] = ["referent", "statutep","typeep", "dateentretien", "consultation"];
-        break;
+  epTypeRecherche : any = epTypeRecherche;
-      case "referent":
+
-        if(event.ep.referent != undefined)
+  idCollaborateur: string;
-          this.router.navigate(["/referents", event.ep.referent.id])
+
-        break;
+
-      case "ep":
+  constructor(private authService: AuthService, private router: Router){
-        this.router.navigate(["/ep", event.ep.id]);
+    this.userRole = this.authService.firstRole;
-        break;
+  }
+  
+  ngOnInit() {
+    this.setIdCollaborateur();
+  }
+
+  setIdCollaborateur() {
+    if(sessionStorage.getItem(cles.sessionKeyConnectee) == undefined) {
+      setTimeout( () => this.setIdCollaborateur(), 1000);
+    }
+    else {
+      const collaborateurConnecte : CollaborateurDTO = JSON.parse(sessionStorage.getItem(cles.sessionKeyConnectee));
+      this.idCollaborateur = collaborateurConnecte.id;
     }
   }
+
+
+  ouvrirEP(event) {
+    if(event.type == "ep")
+        this.router.navigate(["/ep", event.ep.id]);
+  }
 }

src/app/ep/ep.module.ts

@@ -8,42 +8,28 @@ import { MaterialModule } from "@shared/angular-material/angular-material.module
 import {NavMenuModule} from '@shared/nav-menu/nav-menu.module';
 
 import { EpComponent } from './ep.component';
-import { EpAugmentationSalaireComponent } from "./ep-augmentation-salaire/ep-augmentation-salaire.component";
-import { EpChoixDateComponent } from "./ep-choix-date/ep-choix-date.component";
-import { EpDemandeDelegationComponent } from "./ep-demande-delegation/ep-demande-delegation.component";
-import { EpDemandesFormationComponent } from "./ep-demandes-formation/ep-demandes-formation.component";
-import { EpPropositionsDatesComponent } from "./ep-propositions-dates/ep-propositions-dates.component";
-import { EpParticipantsComponent } from "./ep-participants/ep-participants.component";
-import { NewParticipantComponent } from "./ep-participants/new-participant/new-participant.component";
-import { EpConsultationComponent } from "./ep-consultation/ep-consultation.component";
-import { EpSignatureComponent } from "./ep-signature/ep-signature.component";
-import { EpaComponent } from "./epa/epa.component";
-import { EpaSixAnsComponent } from "./epa-six-ans/epa-six-ans.component";
-import { EpsComponent } from "./eps/eps.component";
-import { EpCommentaireAssistantComponent } from "./ep-commentaire-assistant/ep-commentaire-assistant.component";
-import { EpCommentaireReferentComponent } from "./ep-commentaire-referent/ep-commentaire-referent.component";
 
 import { EpRoutingModule } from './ep.routing.module';
 import { MatTablesModule } from "@shared/mat-tables/mat-tables.module";
+import { EpSignesComponent } from "./ep-signes/ep-signes.component";
+import { DetailsEPComponent } from "./details-ep/details-ep.component";
 
 /**
   * Module de l'ep
   */
 @NgModule({
-  declarations: [EpComponent, EpAugmentationSalaireComponent, EpChoixDateComponent,
+  declarations: [
-    EpDemandeDelegationComponent, EpDemandesFormationComponent, EpParticipantsComponent,
+    EpComponent, EpSignesComponent, DetailsEPComponent
-    EpPropositionsDatesComponent, NewParticipantComponent, EpConsultationComponent,
-    EpSignatureComponent, EpaComponent, EpaSixAnsComponent, EpsComponent,
-    EpCommentaireAssistantComponent, EpCommentaireReferentComponent
   ],
-  exports: [EpComponent
+  exports: [EpComponent, DetailsEPComponent
   ],
   imports: [
     MaterialModule,
     NavMenuModule,
     EpRoutingModule,
     RouterModule,
-    MatTablesModule
+    MatTablesModule,
+    CommonModule,
   ],
 })
 export class EpModule {}

src/app/ep/ep.routing.module.ts

@@ -3,55 +3,28 @@ import { Routes, RouterModule } from '@angular/router';
 
 
 import { EpComponent } from "./ep.component";
-import { EpAugmentationSalaireComponent } from "./ep-augmentation-salaire/ep-augmentation-salaire.component";
-import { EpChoixDateComponent } from "./ep-choix-date/ep-choix-date.component";
-import { EpConsultationComponent } from './ep-consultation/ep-consultation.component';
-import { EpDemandeDelegationComponent } from "./ep-demande-delegation/ep-demande-delegation.component";
-import { EpDemandesFormationComponent } from "./ep-demandes-formation/ep-demandes-formation.component";
-import { EpParticipantsComponent } from "./ep-participants/ep-participants.component";
-import { EpPropositionsDatesComponent } from "./ep-propositions-dates/ep-propositions-dates.component";
-import { EpSignatureComponent } from "./ep-signature/ep-signature.component";
-import { EpaComponent } from "./epa/epa.component";
-import { EpaSixAnsComponent } from "./epa-six-ans/epa-six-ans.component";
-import { EpsComponent } from "./eps/eps.component";
-import { EpCommentaireAssistantComponent } from "./ep-commentaire-assistant/ep-commentaire-assistant.component";
-import { EpCommentaireReferentComponent } from "./ep-commentaire-referent/ep-commentaire-referent.component";
-import { NewParticipantComponent } from "./ep-participants/new-participant/new-participant.component";
 
 import { AuthGuard } from '@shared/auth/auth.guard';
 import { paths_ep } from "@shared/utils/paths";
+import { EpSignesComponent } from './ep-signes/ep-signes.component';
+import { DetailsEPComponent } from './details-ep/details-ep.component';
 
 /**
   * Routes du module ep
   */
 const routes: Routes = [
-  {
+  { path: paths_ep.signes,
-    path:'',
+    component: EpSignesComponent,
-    component: EpComponent,
     canActivate: [AuthGuard]
   },
-  {
+  { 
-    path:paths_ep.consultation,
+    path: paths_ep.consultation,
-    component: EpConsultationComponent,
+    component: DetailsEPComponent,
-    canActivate: [AuthGuard],
+    canActivate: [AuthGuard]
-    children: [
-      {path:paths_ep.salaire, component: EpAugmentationSalaireComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.choixdate, component: EpChoixDateComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.demandedelegation, component: EpDemandeDelegationComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.demandesformation, component: EpDemandesFormationComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.participants, component: EpParticipantsComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.propositionsdates, component: EpPropositionsDatesComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.signature, component: EpSignatureComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.epa, component: EpaComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.eps, component: EpsComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.epa6ans, component: EpaSixAnsComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.assistant, component: EpCommentaireAssistantComponent, canActivate: [AuthGuard]},
-      {path:paths_ep.referent, component: EpCommentaireReferentComponent, canActivate: [AuthGuard]}
-    ]
   },
   {
-    path:paths_ep.newparticipant,
+    path:'',
-    component: NewParticipantComponent,
+    component: EpComponent,
     canActivate: [AuthGuard]
   },
 ];

src/app/shared/nav-menu/nav-menu-assistante/nav-menu-assistante.component.html

@@ -1,4 +1,4 @@
-<button mat-button routerLink="/ep">Liste des EP signés</button>
+<button mat-button routerLink="/ep/signes">Liste des EP signés</button>
 <button mat-button routerLink="/collaborateurs" routerLinkActive>Liste des collaborateurs</button>
 
 <button mat-button [matMenuTriggerFor]="menuReferents">

src/app/shared/nav-menu/nav-menu.component.html

@@ -4,7 +4,7 @@
     <img routerLink="/home" src="../../assets/img/logo.png">
     <!--LIEN VERS HOME-->
     <button mat-button routerLink="/home">Accueil</button>
-    <button mat-button mat-button *ngIf="this.userRole == role.commercial || this.userRole == role.collaborateur">EP</button>
+    <button mat-button mat-button *ngIf="this.userRole == role.commercial || this.userRole == role.collaborateur" routerLink="/ep">EP</button>
     <!--MENU EN FONCTION DES ROLES-->
     <app-nav-menu-assistante *ngIf="this.userRole == role.assistante"></app-nav-menu-assistante>
     <app-nav-menu-collaborateur *ngIf="this.userRole == role.collaborateur"></app-nav-menu-collaborateur>

src/app/shared/utils/paths.ts

@@ -35,22 +35,8 @@ const paths_demandes_formation = {
 const paths_ep = {
   base: "/ep",
   path: "ep",
-  salaire: "augmentationsalaire",
-  choixdate: "choixdate",
-  demandedelegation: "demandedelegation",
-  demandesformation: "demandesformation",
-  propositionsdates: "propositiondate",
-  participants: "participants",
-  commentaireAssistante: "commentaireassistante",
-  commentaireReferent: "commentairereferent",
-  signature: "signature",
-  epa: "epa",
-  eps: "eps",
-  epa6ans: "epasixans",
-  assistant: "commentaireassistant",
-  referent: "commentairereferent",
   consultation: ":id",
-  newparticipant: "ajoutparticipant"
+  signes: "signes"
 };
 
 /**