rework complet des périodes d'essai

Dockerfile

@@ -1,5 +1,4 @@
-# Stage 1
+# Stage 1 : Building the application
-
 FROM node:16-alpine3.14 as build-step
 
 RUN mkdir -p /app
@@ -12,8 +11,7 @@ RUN npm install
 
 RUN npm run build --prod
 
-# Stage 2
+# Stage 2 : Deploying the application on Nginx
-
 FROM nginx:1.17.1-alpine
 
 RUN rm -rf /usr/share/nginx/html/* && rm -rf /etc/nginx/nginx.conf

src/app/components/periode-essai/periode-essai-add/periode-essai-add.component.html

@@ -7,7 +7,8 @@
     <select class="form-select" formControlName="collaborateurId" id="collaborateur-select"
             [ngClass]="{ 'is-invalid': submitted && f.collaborateurId.errors }">
       <option value="" disabled selected>Choisissez le collaborateur concerné par cette période d'essai</option>
-      <option *ngFor="let collaborateur of collaborateurs" [ngValue]="collaborateur.id">{{collaborateur.name}}</option>
+      <option *ngFor="let collaborateur of collaborateurs"
+              [ngValue]="collaborateur.id">{{collaborateur.name}} {{collaborateur.firstName}}</option>
     </select>
     <div *ngIf="submitted && f.collaborateurId.errors" class="invalid-feedback">
       <div *ngIf="f.collaborateurId.errors.required">Vous devez choisir le collaborateur concerné par cette période
@@ -16,6 +17,7 @@
     </div>
   </div>
 
+  <div class="row mb-2">
     <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
       <label class="form-label">Date de début</label>
       <input type="date" class="form-control" formControlName="startingDate" (change)="onStartingDateChange($event)"
@@ -31,36 +33,39 @@
              (change)="onPlannedEndingDateChange($event)"
              [ngClass]="{ 'is-invalid': submitted && f.plannedEndingDate.errors }">
       <div *ngIf="submitted && f.plannedEndingDate.errors" class="invalid-feedback">
-      <div *ngIf="f.plannedEndingDate.errors.required">La date de fin prévue d'une période d'essai est obligatoire</div>
+        <div *ngIf="f.plannedEndingDate.errors.required">La date de fin prévue d'une période d'essai est obligatoire
+        </div>
       </div>
     </div>
 
     <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
       <label class="form-label">Date de fin réelle</label>
-    <input type="date" class="form-control" formControlName="realEndingDate" (change)="onRealEndingDateChange($event)"
+      <input type="date" class="form-control" formControlName="realEndingDate"
-           [ngClass]="{ 'is-invalid': submitted && f.realEndingDate.errors }">
+             (change)="onRealEndingDateChange($event)">
-    <div *ngIf="submitted && f.realEndingDate.errors" class="invalid-feedback">
-      <div *ngIf="f.realEndingDate.errors.required">La date de fin réelle d'une période d'essai est obligatoire</div>
     </div>
   </div>
 
+  <div class="row mb-2">
+
     <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
       <label class="form-label">Commentaire</label>
       <input class="form-control" formControlName="comment" [ngClass]="{ 'is-invalid': submitted && f.comment.errors }">
-    <div *ngIf="submitted && f.comment.errors" class="invalid-feedback">
-      <div *ngIf="f.comment.errors.required">Le commentaire d'une période d'essai est obligatoire</div>
-    </div>
     </div>
 
     <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
       <label class="form-label">Issue</label>
-    <input class="form-control" formControlName="issue" [ngClass]="{ 'is-invalid': submitted && f.issue.errors }">
+      <select class="form-select" formControlName="issue">
-    <div *ngIf="submitted && f.issue.errors" class="invalid-feedback">
+        <option value="" disabled selected>Statut</option>
-      <div *ngIf="f.issue.errors.required">L'issue d'une période d'essai est obligatoire</div>
+        <option value="VALIDEE">Validée</option>
+        <option value="PROLONGEE_COLLAB">Prolongée par le collaborateur</option>
+        <option value="PROLONGEE_APSIDE">Prolongée par Apside</option>
+        <option value="ARRETEE_COLLAB">Arrêtée par le collaborateur</option>
+        <option value="ARRETEE_APSIDE">Arrêtée par Apside</option>
+        <option value="INDETERMINEE">Indéterminée</option>
+      </select>
     </div>
   </div>
 
-
   <div>
     <button type="submit">Créer la période d'essai</button>
     <button type="reset" (click)="onReset()">Effacer</button>

src/app/components/periode-essai/periode-essai-add/periode-essai-add.component.ts

@@ -27,16 +27,21 @@ export class PeriodeEssaiAddComponent implements OnInit {
     private periodeEssaiService: PeriodeEssaiService,
     private formBuilder: FormBuilder,
     private toastr: ToastrService
-  ) { }
+  ) {
+  }
+
+  get f() {
+    return this.registerForm.controls;
+  }
 
   ngOnInit(): void {
     this.getCollaborateurs();
     this.registerForm = this.formBuilder.group({
-      comment: ['', Validators.required],
+      comment: [],
       collaborateurId: ['', Validators.required],
-      issue: ['',Validators.required],
+      issue: [],
       plannedEndingDate: ['', Validators.required],
-      realEndingDate: ['',Validators.required],
+      realEndingDate: [],
       startingDate: ['', Validators.required]
     });
   }
@@ -51,12 +56,22 @@ export class PeriodeEssaiAddComponent implements OnInit {
     if (this.registerForm.invalid) {
       return;
     }
-    this.periodeEssai.comment = this.registerForm.value.comment
+
-    this.periodeEssai.collaborateurId = this.registerForm.value.collaborateurId
+    this.periodeEssai.comment = this.registerForm.value.comment;
-    this.periodeEssai.issue = this.registerForm.value.issue
+    this.periodeEssai.collaborateurId = this.registerForm.value.collaborateurId;
-    this.periodeEssai.plannedEndingDate = this.registerForm.value.plannedEndingDate
+    if (this.registerForm.value.issue == undefined) {
-    this.periodeEssai.realEndingDate = this.registerForm.value.realEndingDate
+      this.periodeEssai.issue = "INDETERMINEE";
-    this.periodeEssai.startingDate = this.registerForm.value.startingDate
+    } else {
+      this.periodeEssai.issue = this.registerForm.value.issue;
+    }
+    if (this.registerForm.value.realEndingDate == undefined) {
+      this.periodeEssai.realEndingDate = new Date();
+    } else {
+      this.periodeEssai.realEndingDate = this.registerForm.value.realEndingDate;
+    }
+    this.periodeEssai.plannedEndingDate = this.registerForm.value.plannedEndingDate;
+    this.periodeEssai.startingDate = this.registerForm.value.startingDate;
+
     this.periodeEssaiService.addPeriodeEssai(this.periodeEssai)
       .subscribe(() => {
           this.showSuccess();
@@ -66,8 +81,6 @@ export class PeriodeEssaiAddComponent implements OnInit {
         });
   }
 
-  get f() { return this.registerForm.controls; }
-
   onReset() {
     this.submitted = false;
     this.registerForm.reset();
@@ -86,11 +99,11 @@ export class PeriodeEssaiAddComponent implements OnInit {
   }
 
   showSuccess() {
-    this.toastr.success('Création réussie', 'Collaborateur');
+    this.toastr.success('Création réussie', 'Période d\'essai');
   }
 
   showError() {
-    this.toastr.error('Création échouée', 'Collaborateur');
+    this.toastr.error('Création échouée', 'Période d\'essai');
   }
 
 }

src/app/components/periode-essai/periode-essai-edit/periode-essai-edit.component.html

@@ -45,27 +45,25 @@
     <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
       <label class="form-label">Date de fin réelle</label>
       <input type="date" [value]="periodeEssai.realEndingDate | date:'yyyy-MM-dd'" class="form-control"
-             formControlName="realEndingDate" (change)="onRealEndingDateChange($event)"
+             formControlName="realEndingDate" (change)="onRealEndingDateChange($event)">
-             [ngClass]="{ 'is-invalid': submitted && f.realEndingDate.errors }">
-      <div *ngIf="submitted && f.realEndingDate.errors" class="invalid-feedback">
-        <div *ngIf="f.realEndingDate.errors.required">La date de fin réelle d'une période d'essai est obligatoire</div>
-      </div>
     </div>
 
     <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
       <label class="form-label">Commentaire</label>
-      <input class="form-control" formControlName="comment" [ngClass]="{ 'is-invalid': submitted && f.comment.errors }">
+      <input class="form-control" formControlName="comment">
-      <div *ngIf="submitted && f.comment.errors" class="invalid-feedback">
-        <div *ngIf="f.comment.errors.required">Le commentaire d'une période d'essai est obligatoire</div>
-      </div>
     </div>
 
     <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
       <label class="form-label">Issue</label>
-      <input class="form-control" formControlName="issue" [ngClass]="{ 'is-invalid': submitted && f.issue.errors }">
+      <select class="form-select" formControlName="issue">
-      <div *ngIf="submitted && f.issue.errors" class="invalid-feedback">
+        <option value="" disabled selected>Statut</option>
-        <div *ngIf="f.issue.errors.required">L'issue d'une période d'essai est obligatoire</div>
+        <option value="VALIDEE">Validée</option>
-      </div>
+        <option value="PROLONGEE_COLLAB">Prolongée par le collaborateur</option>
+        <option value="PROLONGEE_APSIDE">Prolongée par Apside</option>
+        <option value="ARRETEE_COLLAB">Arrêtée par le collaborateur</option>
+        <option value="ARRETEE_APSIDE">Arrêtée par Apside</option>
+        <option value="INDETERMINEE">Indéterminée</option>
+      </select>
     </div>
 
     <div>

src/app/components/periode-essai/periode-essai-edit/periode-essai-edit.component.ts

@@ -40,15 +40,19 @@ export class PeriodeEssaiEditComponent implements OnInit {
     this.id = Number(this.route.snapshot.paramMap.get('id'))
   }
 
+  get f() {
+    return this.registerForm.controls;
+  }
+
   async ngOnInit() {
     this.getCollaborateurs();
     this.getPeriodeEssais();
     this.registerForm = this.formBuilder.group({
-      comment: ['', Validators.required],
+      comment: [],
       collaborateurId: ['', Validators.required],
-      issue: ['',Validators.required],
+      issue: [],
       plannedEndingDate: ['', Validators.required],
-      realEndingDate: ['',Validators.required],
+      realEndingDate: [],
       startingDate: ['', Validators.required]
     });
     this.periodeEssaiObservable = this.periodeEssaiService.getPeriodeEssai(this.id).pipe(tap(pe => this.registerForm.patchValue(pe)))
@@ -82,15 +86,21 @@ export class PeriodeEssaiEditComponent implements OnInit {
     if (this.registerForm.invalid) {
       return;
     }
-    this.periodeEssai.comment = this.registerForm.value.comment
-    this.periodeEssai.collaborateurId = this.registerForm.value.collaborateurId
-    this.periodeEssai.issue = this.registerForm.value.issue
-    this.periodeEssai.realEndingDate = this.registerForm.value.realEndingDate
-    this.periodeEssai.startingDate = this.registerForm.value.startingDate
 
-    if (this.registerForm.value.plannedEndingDate == undefined) {
+    this.periodeEssai.comment = this.registerForm.value.comment;
-      this.periodeEssai.plannedEndingDate = new Date();
+    this.periodeEssai.collaborateurId = this.registerForm.value.collaborateurId;
+    if (this.registerForm.value.issue == undefined) {
+      this.periodeEssai.issue = "INDETERMINEE";
+    } else {
+      this.periodeEssai.issue = this.registerForm.value.issue;
     }
+    if (this.registerForm.value.realEndingDate == undefined || this.registerForm.value.realEndingDate == '') {
+      this.periodeEssai.realEndingDate = null;
+    } else {
+      this.periodeEssai.realEndingDate = this.registerForm.value.realEndingDate;
+    }
+    this.periodeEssai.plannedEndingDate = this.registerForm.value.plannedEndingDate;
+    this.periodeEssai.startingDate = this.registerForm.value.startingDate;
 
     if (this.periodeEssai) {
       this.periodeEssaiService.updatePeriodeEssai(this.periodeEssai)
@@ -103,8 +113,6 @@ export class PeriodeEssaiEditComponent implements OnInit {
     }
   }
 
-  get f() { return this.registerForm.controls; }
-
   onReset() {
     this.submitted = false;
     this.registerForm.reset();

src/app/components/periode-essai/periode-essai.component.html

@@ -2,19 +2,24 @@
 
   <h2 class=mb-4>Périodes d'essai</h2>
 
+  <div style="display: flex">
+    <p style="margin: 10px 0 10px 0">Pour ajouter une nouvelle période d'essai, cliquez ici : </p>
+    <button routerLink="/periodeessais/add">Ajouter</button>
+  </div>
+
   <div style="overflow-x:auto;" class="mb-5 col-12">
     <table class="table">
       <thead>
       <tr>
         <th scope="col">ID</th>
-        <th scope="col">Collaborateur ID</th>
+        <th scope="col">Collaborateur</th>
         <th scope="col">Issue</th>
       </tr>
       </thead>
       <tbody>
       <tr *ngFor="let periodeEssai of periodeEssais">
         <th scope="row">{{periodeEssai.id}}</th>
-        <td> {{periodeEssai.collaborateurId}} </td>
+        <td> {{getCollaborateurById(periodeEssai.collaborateurId).name}} {{getCollaborateurById(periodeEssai.collaborateurId).firstName}} </td>
         <td> {{periodeEssai.issue}}</td>
         <td><a routerLink="{{periodeEssai.id}}"> Modifier </a></td>
       </tr>

src/app/components/periode-essai/periode-essai.component.ts

@@ -1,11 +1,9 @@
 import {Component, OnInit} from '@angular/core';
 import {HttpClient} from "@angular/common/http";
-import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import {PeriodeEssai} from "../../interfaces/periode-essai";
 import {Collaborateur} from "../../interfaces/collaborateur";
 import {CollaborateurService} from "../../services/collaborateur.service";
 import {PeriodeEssaiService} from "../../services/periode-essai.service";
-import {ToastrService} from "ngx-toastr";
 
 @Component({
   selector: 'app-periode-essai',
@@ -15,33 +13,18 @@ import {ToastrService} from "ngx-toastr";
 export class PeriodeEssaiComponent implements OnInit {
 
   collaborateurs: Collaborateur[] = [];
-  collaborateur = {} as Collaborateur;
-
   periodeEssais: PeriodeEssai[] = [];
-  periodeEssai = {} as PeriodeEssai;
-
-  registerForm!: FormGroup;
-  submitted = false;
 
   constructor(
     private http: HttpClient,
     private collaborateurService: CollaborateurService,
     private periodeEssaiService: PeriodeEssaiService,
-    private formBuilder: FormBuilder,
+  ) {
-    private toastr: ToastrService
+  }
-  ) { }
 
   ngOnInit(): void {
     this.getCollaborateurs();
     this.getPeriodeEssais();
-    this.registerForm = this.formBuilder.group({
-      comment: ['', Validators.required],
-      collaborateurId: ['',Validators.required],
-      issue: ['',Validators.required],
-      plannedEndingDate: ['',Validators.required],
-      realEndingDate: ['',Validators.required],
-      startingDate: ['',Validators.required]
-    });
   }
 
   getCollaborateurs(): void {
@@ -49,58 +32,21 @@ export class PeriodeEssaiComponent implements OnInit {
       .subscribe(collaborateurs => this.collaborateurs = collaborateurs);
   }
 
-  getPeriodeEssais() {
+  getCollaborateurById(id : number) : Collaborateur{
-    this.periodeEssaiService.getPeriodeEssais()
+    let collab = {} as Collaborateur;
-      .subscribe(periodeEssais => this.periodeEssais = periodeEssais);
+    this.collaborateurs.forEach(c => {
-  }
+      if (c.id==id){
-
+        collab= c;
-  add(periodeEssai: PeriodeEssai): void {
-    this.periodeEssaiService.addPeriodeEssai(periodeEssai)
-      .subscribe(periodeEssai => {
-        this.periodeEssais.push(periodeEssai);
-      });
-  }
-
-  onSubmit() {
-    this.submitted = true;
-    if (this.registerForm.invalid) {
         return;
       }
-    this.periodeEssai.comment = this.registerForm.value.comment
+    });
-    this.periodeEssai.collaborateurId = this.registerForm.value.collaborateurId
-    this.periodeEssai.issue = this.registerForm.value.issue
-    this.periodeEssai.plannedEndingDate = this.registerForm.value.plannedEndingDate
-    this.periodeEssai.realEndingDate = this.registerForm.value.realEndingDate
-    this.periodeEssai.startingDate = this.registerForm.value.startingDate
-    this.add(this.periodeEssai)
-  }
-
-  get f() { return this.registerForm.controls; }
-
-  onReset() {
-    this.submitted = false;
-    this.registerForm.reset();
-  }
-
-  onStartingDateChange($event: any):void {
-    this.periodeEssai.startingDate = new Date($event.target.value);
-  }
-
-  onPlannedEndingDateChange($event: any):void {
-    this.periodeEssai.plannedEndingDate = new Date($event.target.value);
-  }
 
-  onRealEndingDateChange($event: any):void {
+    return collab;
-    this.periodeEssai.realEndingDate = new Date($event.target.value);
   }
 
-
+  getPeriodeEssais() {
-
+    this.periodeEssaiService.getPeriodeEssais()
-  showSuccess() {
+      .subscribe(periodeEssais => this.periodeEssais = periodeEssais);
-    this.toastr.success('Création réussie', 'Collaborateur');
   }
 
-  showError() {
-    this.toastr.error('Création échouée', 'Collaborateur');
-  }
 }

src/app/components/referencement/referencement-edit/referencement-edit.component.ts

@@ -40,6 +40,10 @@ export class ReferencementEditComponent implements OnInit {
     this.id = Number(this.route.snapshot.paramMap.get('id'))
   }
 
+  get form() {
+    return this.registerForm.controls;
+  }
+
   async ngOnInit() {
     this.getCollaborateurs();
     this.registerForm = this.formBuilder.group({
@@ -65,12 +69,14 @@ export class ReferencementEditComponent implements OnInit {
       return;
     }
 
-    this.referencement.referredId = this.registerForm.value.referredId
+    this.referencement.referredId = this.registerForm.value.referredId;
-    this.referencement.referrerId = this.registerForm.value.referrerId
+    this.referencement.referrerId = this.registerForm.value.referrerId;
-    this.referencement.startingDate = this.registerForm.value.startingDate
+    this.referencement.startingDate = this.registerForm.value.startingDate;
 
-    if (this.registerForm.value.endingDate == undefined) {
+    if (this.registerForm.value.endingDate == undefined || this.registerForm.value.endingDate == '') {
-      this.referencement.endingDate = new Date()
+      this.referencement.endingDate = null;
+    } else {
+      this.referencement.endingDate = this.registerForm.value.endingDate;
     }
 
     if (this.referencement) {
@@ -84,10 +90,6 @@ export class ReferencementEditComponent implements OnInit {
     }
   }
 
-  get form() {
-    return this.registerForm.controls;
-  }
-
   onReset() {
     this.submitted = false;
     this.registerForm.reset();

src/app/interfaces/periode-essai.ts

@@ -3,7 +3,7 @@ export interface PeriodeEssai {
   collaborateurId : number;
   startingDate : Date;
   plannedEndingDate : Date;
-  realEndingDate : Date;
+  realEndingDate : Date | null;
   comment : string;
   issue : string;
 }

src/app/interfaces/referencement.ts

@@ -1,7 +1,7 @@
 export interface Referencement {
   id: number;
   startingDate : Date;
-  endingDate? : Date;
+  endingDate : Date | null;
   referredId : number;
   referrerId : number;
 }