Merge pull request 'refonte_agence_bu' (#11) from refonte_agence_bu into develop

Reviewed-on: Clement.Ferrere/Collaborateur_Epa_Front#11
pull/13/head
Clement.Ferrere 2 years ago
commit 7aa43aafdd
  1. 4
      src/app/app.component.html
  2. 2
      src/app/app.module.ts
  3. 11
      src/app/components/agence/agence-edit/agence-edit.component.html
  4. 15
      src/app/components/agence/agence-edit/agence-edit.component.ts
  5. 11
      src/app/components/agence/agence.component.html
  6. 20
      src/app/components/agence/agence.component.ts
  7. 11
      src/app/components/businessunit/businessunit-edit/businessunit-edit.component.html
  8. 5
      src/app/components/businessunit/businessunit-edit/businessunit-edit.component.ts
  9. 11
      src/app/components/businessunit/businessunit.component.html
  10. 12
      src/app/components/businessunit/businessunit.component.ts
  11. 96
      src/app/components/collaborateur/collaborateur-detail/collaborateur-detail.component.html
  12. 1
      src/app/components/collaborateur/collaborateur-detail/collaborateur-detail.component.scss
  13. 65
      src/app/components/collaborateur/collaborateur-detail/collaborateur-detail.component.ts
  14. 149
      src/app/components/collaborateur/collaborateur-edit/collaborateur-edit.component.html
  15. 79
      src/app/components/collaborateur/collaborateur-edit/collaborateur-edit.component.ts
  16. 147
      src/app/components/collaborateur/collaborateur.component.html
  17. 67
      src/app/components/collaborateur/collaborateur.component.ts
  18. 1
      src/app/interfaces/agence.ts
  19. 1
      src/app/interfaces/businessunit.ts

@ -61,13 +61,13 @@
<a class="toolbar-button" routerLink="/home">Home</a>
</nav>
<nav>
<a class="toolbar-button" routerLink="/collaborateurs">Collaborateurs</a>
<a class="toolbar-button" routerLink="/businessunits">Business Units</a>
</nav>
<nav>
<a class="toolbar-button" routerLink="/agences">Agences</a>
</nav>
<nav>
<a class="toolbar-button" routerLink="/businessunits">Business Units</a>
<a class="toolbar-button" routerLink="/collaborateurs">Collaborateurs</a>
</nav>
</div>

@ -11,7 +11,6 @@ import { AppRoutingModule } from './app-routing.module';
import { HomeComponent } from './components/home/home.component';
import { AgenceComponent } from './components/agence/agence.component';
import { AgenceEditComponent } from './components/agence/agence-edit/agence-edit.component';
import { CollaborateurDetailComponent } from './components/collaborateur/collaborateur-detail/collaborateur-detail.component';
import { BusinessunitComponent } from './components/businessunit/businessunit.component';
import { BusinessunitEditComponent } from './components/businessunit/businessunit-edit/businessunit-edit.component';
@ -23,7 +22,6 @@ import { BusinessunitEditComponent } from './components/businessunit/businessuni
HomeComponent,
AgenceComponent,
AgenceEditComponent,
CollaborateurDetailComponent,
BusinessunitComponent,
BusinessunitEditComponent,

@ -14,6 +14,17 @@
</div>
</div>
<div class="form-group col-12 col-md-6">
<label class="form-label">Business Unit</label>
<select class="form-select" formControlName="businessUnitId" id="businessUnit-select" [ngClass]="{ 'is-invalid': submitted && f.businessUnitId.errors }">
<option value="" disabled selected>Choisissez la business unit de cette agence</option>
<option *ngFor="let businessUnit of businessUnits" [ngValue]="businessUnit.id">{{businessUnit.name}}</option>
</select>
<div *ngIf="submitted && f.businessUnitId.errors" class="invalid-feedback">
<div *ngIf="f.businessUnitId.errors.required">Vous devez choisir la business unit à laquelle appartient l'agence </div>
</div>
</div>
<div>
<button (click)="goBack()">Retour</button>

@ -4,6 +4,8 @@ import {ActivatedRoute} from "@angular/router";
import {AgenceService} from "../../../services/agence.service";
import {Location} from "@angular/common";
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {Businessunit} from "../../../interfaces/businessunit";
import {BusinessunitService} from "../../../services/businessunit.service";
@Component({
selector: 'app-agence-edit',
@ -11,7 +13,9 @@ import {FormBuilder, FormGroup, Validators} from '@angular/forms';
styleUrls: ['./agence-edit.component.scss']
})
export class AgenceEditComponent implements OnInit {
agence = {} as Agence ;
agence = {} as Agence;
businessUnits : Businessunit[] = [];
businessUnit = {} as Businessunit ;
registerForm!: FormGroup;
submitted = false;
@ -19,14 +23,17 @@ export class AgenceEditComponent implements OnInit {
constructor(
private route: ActivatedRoute,
private agenceService: AgenceService,
private businessUnitService: BusinessunitService,
private location: Location,
private formBuilder: FormBuilder
) { }
ngOnInit(): void {
this.getBusinessUnits()
this.getAgence()
this.registerForm = this.formBuilder.group({
name: ['', Validators.required]
name: ['', Validators.required],
businessUnitId:['',Validators.required]
});
}
@ -64,5 +71,9 @@ export class AgenceEditComponent implements OnInit {
this.submitted = false;
this.registerForm.reset();
}
getBusinessUnits():void {
this.businessUnitService.getBusinessunits()
.subscribe(businessunits => this.businessUnits = businessunits);
}
}

@ -12,6 +12,17 @@
</div>
</div>
<div class="form-group col-12 col-md-6">
<label class="form-label">Business Unit</label>
<select class="form-select" formControlName="businessUnitId" id="businessUnit-select" [ngClass]="{ 'is-invalid': submitted && f.businessUnitId.errors }">
<option value="" disabled selected>Choisissez la business unit de cette agence</option>
<option *ngFor="let businessUnit of businessUnits" [ngValue]="businessUnit.id">{{businessUnit.name}}</option>
</select>
<div *ngIf="submitted && f.businessUnitId.errors" class="invalid-feedback">
<div *ngIf="f.businessUnitId.errors.required">Vous devez choisir la business unit à laquelle appartient l'agence </div>
</div>
</div>
<div>
<button type="submit">Créer l'agence</button>

@ -3,6 +3,8 @@ import {Agence} from "../../interfaces/agence";
import {HttpClient} from "@angular/common/http";
import {AgenceService} from "../../services/agence.service";
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {Businessunit} from "../../interfaces/businessunit";
import {BusinessunitService} from "../../services/businessunit.service";
@Component({
selector: 'app-agence',
@ -11,7 +13,9 @@ import {FormBuilder, FormGroup, Validators} from '@angular/forms';
})
export class AgenceComponent implements OnInit {
agences : Agence[] = [];
agence = {} as Agence ;
agence = {} as Agence;
businessUnits : Businessunit[] = [];
businessUnit = {} as Businessunit ;
registerForm!: FormGroup;
submitted = false;
@ -19,13 +23,16 @@ export class AgenceComponent implements OnInit {
constructor(
private http : HttpClient,
private agenceService: AgenceService,
private businessUnitService: BusinessunitService,
private formBuilder: FormBuilder
) { }
ngOnInit(): void {
this.getAgences();
this.getBusinessUnits();
this.registerForm = this.formBuilder.group({
name: ['', Validators.required]
name: ['', Validators.required],
businessUnitId: ['',Validators.required]
});
}
@ -34,6 +41,11 @@ export class AgenceComponent implements OnInit {
.subscribe(agences => this.agences = agences);
}
getBusinessUnits() {
this.businessUnitService.getBusinessunits()
.subscribe(businessunits => this.businessUnits = businessunits);
}
add(agence: Agence): void {
this.agenceService.addAgence(agence)
.subscribe(agence => {
@ -47,7 +59,8 @@ export class AgenceComponent implements OnInit {
if (this.registerForm.invalid) {
return;
}
this.agence = this.registerForm.value
this.agence.name = this.registerForm.value.name
this.agence.businessUnitId = this.registerForm.value.businessUnitId
this.add(this.agence)
}
@ -58,4 +71,5 @@ export class AgenceComponent implements OnInit {
this.registerForm.reset();
}
}

@ -14,17 +14,6 @@
</div>
</div>
<div class="form-group col-12 col-md-6">
<label class="form-label">Agence</label>
<select class="form-select" formControlName="agenceId" id="agence-select" [ngClass]="{ 'is-invalid': submitted && f.agenceId.errors }">
<option value="" disabled selected>Choisissez l'agence de cette business unit</option>
<option *ngFor="let agence of agences" [ngValue]="agence.id">{{agence.name}}</option>
</select>
<div *ngIf="submitted && f.agenceId.errors" class="invalid-feedback">
<div *ngIf="f.agenceId.errors.required">Vous devez choisir l'agence à laquelle appartient la business unit</div>
</div>
</div>
<div>
<button (click)="goBack()">Retour</button>
<button type="submit">Sauvegarder les changements</button>

@ -16,7 +16,6 @@ export class BusinessunitEditComponent implements OnInit {
businessunit = {} as Businessunit ;
agences : Agence[] = [];
agence = {} as Agence ;
registerForm!: FormGroup;
@ -34,8 +33,7 @@ export class BusinessunitEditComponent implements OnInit {
this.getBusinessunit();
this.getAgences();
this.registerForm = this.formBuilder.group({
name: ['', Validators.required],
agenceId: ['',Validators.required]
name: ['', Validators.required]
});
}
@ -75,7 +73,6 @@ export class BusinessunitEditComponent implements OnInit {
return;
}
this.businessunit.name = this.registerForm.value.name
this.businessunit.agenceId = this.registerForm.value.agenceId
this.save()
}

@ -12,17 +12,6 @@
</div>
</div>
<div class="form-group col-12 col-md-6">
<label class="form-label">Agence</label>
<select class="form-select" formControlName="agenceId" id="agence-select" [ngClass]="{ 'is-invalid': submitted && f.agenceId.errors }">
<option value="" disabled selected>Choisissez l'agence de cette business unit</option>
<option *ngFor="let agence of agences" [ngValue]="agence.id">{{agence.name}}</option>
</select>
<div *ngIf="submitted && f.agenceId.errors" class="invalid-feedback">
<div *ngIf="f.agenceId.errors.required">Vous devez choisir l'agence à laquelle appartient la business unit</div>
</div>
</div>
<div>
<button type="submit">Créer la business unit</button>
<button type="reset" (click)="onReset()">Effacer</button>

@ -2,8 +2,6 @@ import { Component, OnInit } from '@angular/core';
import {Businessunit} from "../../interfaces/businessunit";
import {HttpClient} from "@angular/common/http";
import {BusinessunitService} from "../../services/businessunit.service";
import {Agence} from "../../interfaces/agence";
import {AgenceService} from "../../services/agence.service";
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
@Component({
@ -15,8 +13,6 @@ export class BusinessunitComponent implements OnInit {
businessunits : Businessunit[] = [];
businessunit = {} as Businessunit ;
agences : Agence[] = [];
agence = {} as Agence ;
registerForm!: FormGroup;
submitted = false;
@ -24,16 +20,13 @@ export class BusinessunitComponent implements OnInit {
constructor(
private http : HttpClient,
private businessunitService: BusinessunitService,
private agenceService: AgenceService,
private formBuilder: FormBuilder
) { }
ngOnInit(): void {
this.getBusinessunits();
this.getAgences();
this.registerForm = this.formBuilder.group({
name: ['', Validators.required],
agenceId: ['',Validators.required]
});
}
@ -42,11 +35,6 @@ export class BusinessunitComponent implements OnInit {
.subscribe(businessunits => this.businessunits = businessunits);
}
getAgences():void {
this.agenceService.getAgences()
.subscribe(agences => this.agences = agences);
}
add(businessunit: Businessunit): void {
this.businessunitService.addBusinessunit(businessunit)
.subscribe(businessunit => {

@ -1,96 +0,0 @@
<div *ngIf="collaborateur" class="mb-3">
<div class="row mb-2">
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-name" class="form-label">Nom</label>
<input class="form-control" id="collaborateur-name" [(ngModel)]="collaborateur.name" placeholder="Nom">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-firstName" class="form-label">Prénom</label>
<input class="form-control" id="collaborateur-firstName" [(ngModel)]="collaborateur.firstName" placeholder="Prénom">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-birthDate" class="form-label">Date de naissance</label>
<input type="date" class="form-control" id="collaborateur-birthDate" (change)="onBirthDateChange($event)" [(ngModel)]="bDate" placeholder="Date de naissance">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Genre</label>
<select class="form-select" name="genre" id="collaborateur-gender" [(ngModel)]="collaborateur.gender">
<option value="" disabled selected>Genre</option>
<option value="MASCULIN">Masculin</option>
<option value="FEMININ">Féminin</option>
<option value="AUTRE">Autre</option>
</select>
</div>
</div>
<div class="row mb-2">
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-status" class="form-label">Statut</label>
<input class="form-control" id="collaborateur-status" [(ngModel)]="collaborateur.status" placeholder="Statut">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-childrenNumber" class="form-label">Nombre d'enfants</label>
<input type="number" min="0" onkeyup="if(this.value<0){this.value= this.value * -1}" class="form-control" id="collaborateur-childrenNumber" [(ngModel)]="collaborateur.childrenNumber" placeholder="Nombre d'enfants">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-address" class="form-label">Adresse</label>
<input class="form-control" id="collaborateur-address" [(ngModel)]="collaborateur.address" placeholder="Adresse">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-telephone" class="form-label">Téléphone</label>
<input class="form-control" id="collaborateur-telephone" [(ngModel)]="collaborateur.telephone" placeholder="Téléphone">
</div>
</div>
<div class="row mb-4">
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-personalMail" class="form-label">Mail personnel</label>
<input type="email" class="form-control" id="collaborateur-personalMail" [(ngModel)]="collaborateur.personalMail" placeholder="prenom.nom@example.com">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-apsideMail" class="form-label">Mail Apside</label>
<input type="email" class="form-control" id="collaborateur-apsideMail" [(ngModel)]="collaborateur.apsideMail" placeholder="prenom.nom@apside-groupe.com">
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="collaborateur-resignationDate" class="form-label">Date de départ</label>
<input type="date" class="form-control" id="collaborateur-resignationDate" (change)="onResignationDateChange($event)" [ngModel]="rDate" placeholder="Date de départ">
</div>
</div>
<div class="row mb-2">
<div class="form-group col-12 col-md-6">
<label class="form-label">Référent</label>
<select class="form-select" name="referrer" id="referrer-select" [(ngModel)]="collaborateur.referrerId">
<option value="" disabled selected>Choisissez un référent pour le collaborateur</option>
<option *ngFor="let collaborateur of collaborateurs" [ngValue]="collaborateur.id">{{collaborateur.name}} {{collaborateur.firstName}}</option>
</select>
</div>
<div class="form-group col-12 col-md-6">
<label class="form-label">Business Unit</label>
<select class="form-select" name="businessunit" id="businessunit-select" [(ngModel)]="collaborateur.businessUnitId">
<option value="" disabled selected>Choisissez la Business Unit pour le collaborateur</option>
<option *ngFor="let businessunit of businessunits" [ngValue]="businessunit.id">{{businessunit.name}} </option>
</select>
</div>
</div>
<br/>
<span>
*Tous les champs sont obligatoires
</span>
</div>

@ -1,65 +0,0 @@
import {Component, Input, OnInit} from '@angular/core';
import {Collaborateur} from "../../../interfaces/collaborateur";
import {HttpClient} from "@angular/common/http";
import {CollaborateurService} from "../../../services/collaborateur.service";
import {BusinessunitService} from "../../../services/businessunit.service";
import {Businessunit} from "../../../interfaces/businessunit";
@Component({
selector: 'app-collaborateur-detail',
templateUrl: './collaborateur-detail.component.html',
styleUrls: ['./collaborateur-detail.component.scss']
})
export class CollaborateurDetailComponent implements OnInit {
businessunits : Businessunit[] = [];
collaborateurs : Collaborateur[] = [];
rDate : String = "";
bDate : String = "";
@Input()
collaborateur = {} as Collaborateur;
constructor(
private http : HttpClient,
private collaborateurService: CollaborateurService,
private businessunitService: BusinessunitService
) {}
ngOnInit(): void {
this.getCollaborateurs();
this.getBusinessunits();
if (this.collaborateur.resignationDate) {
this.rDate = new Date(this.collaborateur.resignationDate).toISOString().split('T')[0];
console.log(this.rDate)
}
if (this.collaborateur.birthDate) {
this.bDate = new Date(this.collaborateur.birthDate).toISOString().split('T')[0];
console.log(this.bDate)
}
}
getCollaborateurs():void {
this.collaborateurService.getCollaborateurs()
.subscribe(collaborateurs => this.collaborateurs = collaborateurs);
}
getBusinessunits():void {
this.businessunitService.getBusinessunits()
.subscribe(businessunits => this.businessunits = businessunits);
}
onResignationDateChange($event: any):void {
console.log($event.target)
this.collaborateur.resignationDate = new Date($event.target.value);
console.log(this.rDate)
console.log(this.collaborateur.resignationDate)
}
onBirthDateChange($event: any):void {
console.log($event.target)
this.collaborateur.birthDate = new Date($event.target.value);
console.log(this.bDate)
console.log(this.collaborateur.birthDate)
}
}

@ -5,9 +5,150 @@
<div><label class="form-label">ID : </label>{{collaborateur.id}}</div>
<app-collaborateur-detail [collaborateur]="collaborateur"></app-collaborateur-detail>
<form [formGroup]="registerForm" (ngSubmit)="onSubmit()" >
<div class="row mb-2">
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Nom</label>
<input class="form-control" formControlName="name" [ngClass]="{ 'is-invalid': submitted && f.name.errors }" [value]="collaborateur.name">
<div *ngIf="submitted && f.name.errors" class="invalid-feedback">
<div *ngIf="f.name.errors.required">Le nom d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Prénom</label>
<input class="form-control" formControlName="firstName" [ngClass]="{ 'is-invalid': submitted && f.firstName.errors }" [value]="collaborateur.firstName">
<div *ngIf="submitted && f.firstName.errors" class="invalid-feedback">
<div *ngIf="f.firstName.errors.required">Le prénom d'un collaborateur 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 naissance</label>
<input type="date" class="form-control" formControlName="birthDate" (change)="onBirthDateChange($event)" [ngClass]="{ 'is-invalid': submitted && f.birthDate.errors }" [value]="collaborateur.birthDate">
<div *ngIf="submitted && f.birthDate.errors" class="invalid-feedback">
<div *ngIf="f.birthDate.errors.required">La date de naissance d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Genre</label>
<select class="form-select" formControlName="gender" [ngClass]="{ 'is-invalid': submitted && f.gender.errors }" [value]="collaborateur.gender">
<option value="" disabled selected>Genre</option>
<option value="MASCULIN">Masculin</option>
<option value="FEMININ">Féminin</option>
<option value="AUTRE">Autre</option>
</select>
<div *ngIf="submitted && f.gender.errors" class="invalid-feedback">
<div *ngIf="f.gender.errors.required">Vous devez préciser le genre du collaborateur</div>
</div>
</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">Statut</label>
<select class="form-select" formControlName="status" [ngClass]="{ 'is-invalid': submitted && f.status.errors }" [value]="collaborateur.status">
<option value="" disabled selected>Statut</option>
<option value="CADRE">Cadre</option>
<option value="NON-CADRE">Non-cadre</option>
<option value="ALTERNANT">Alternant</option>
<option value="STAGIAIRE">Stagiaire</option>
</select>
<div *ngIf="submitted && f.status.errors" class="invalid-feedback">
<div *ngIf="f.status.errors.required">Vous devez préciser le statut du collaborateur</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Nombre d'enfants</label>
<input class="form-control" formControlName="childrenNumber" [ngClass]="{ 'is-invalid': submitted && f.childrenNumber.errors }" type="number" min="0" onkeyup="if(this.value<0){this.value= this.value * -1}" [value]="collaborateur.childrenNumber">
<div *ngIf="submitted && f.childrenNumber.errors" class="invalid-feedback">
<div *ngIf="f.childrenNumber.errors.required">Le nombre d'enfant d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Adresse</label>
<input class="form-control" formControlName="address" [ngClass]="{ 'is-invalid': submitted && f.address.errors }" [value]="collaborateur.address">
<div *ngIf="submitted && f.address.errors" class="invalid-feedback">
<div *ngIf="f.address.errors.required">L'adresse d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Téléphone</label>
<input class="form-control" formControlName="telephone" [ngClass]="{ 'is-invalid': submitted && f.telephone.errors }" [value]="collaborateur.telephone">
<div *ngIf="submitted && f.telephone.errors" class="invalid-feedback">
<div *ngIf="f.telephone.errors.required">Le numéro de téléphone d'un collaborateur est obligatoire</div>
</div>
</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">Mail personnel</label>
<input type="email" class="form-control" formControlName="personalMail" [ngClass]="{ 'is-invalid': submitted && f.personalMail.errors }" placeholder="prenom.nom@example.com" [value]="collaborateur.personalMail">
<div *ngIf="submitted && f.personalMail.errors" class="invalid-feedback">
<div *ngIf="f.personalMail.errors.required">Le mail personnel d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Mail Apside</label>
<input type="email" class="form-control" formControlName="apsideMail" [ngClass]="{ 'is-invalid': submitted && f.apsideMail.errors }" placeholder="prenom.nom@apside-groupe.com" [value]="collaborateur.apsideMail">
<div *ngIf="submitted && f.apsideMail.errors" class="invalid-feedback">
<div *ngIf="f.apsideMail.errors.required">Le mail Apside d'un collaborateur 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 départ</label>
<input type="date" class="form-control" formControlName="resignationDate" (change)="onResignationDateChange($event)" [ngClass]="{ 'is-invalid': submitted && f.resignationDate.errors }" [value]="collaborateur.resignationDate">
<div *ngIf="submitted && f.resignationDate.errors" class="invalid-feedback">
<div *ngIf="f.resignationDate.errors.required">La date de départ d'un collaborateur est obligatoire</div>
</div>
</div>
</div>
<div class="row mb-2">
<div class="form-group col-12 col-md-6">
<label class="form-label">Référent</label>
<select class="form-select" formControlName="referrerId" [ngClass]="{ 'is-invalid': submitted && f.referrerId.errors }">
<option value="" disabled selected>Choisissez un référent pour le collaborateur</option>
<option *ngFor="let collaborateur of collaborateurs" [ngValue]="collaborateur.id">{{collaborateur.name}} {{collaborateur.firstName}}</option>
</select>
<div *ngIf="submitted && f.referrerId.errors" class="invalid-feedback">
<div *ngIf="f.referrerId.errors.required">Vous devez préciser le référent du collaborateur</div>
</div>
</div>
<div class="form-group col-12 col-md-6">
<label class="form-label">Business Unit</label>
<select class="form-select" formControlName="businessUnitId" [ngClass]="{ 'is-invalid': submitted && f.businessUnitId.errors }">
<option value="" disabled selected>Choisissez une Business Unit pour le collaborateur</option>
<option *ngFor="let businessUnit of businessUnits" [ngValue]="businessUnit.id">{{businessUnit.name}} </option>
</select>
<div *ngIf="submitted && f.businessUnitId.errors" class="invalid-feedback">
<div *ngIf="f.businessUnitId.errors.required">Vous devez préciser la Business Unit du collaborateur</div>
</div>
</div>
</div>
<div>
<button (click)="goBack()">Retour</button>
<button type="submit">Sauvegarder les changements</button>
<button (click)="delete()">Supprimer le collaborateur</button>
<button type="reset" (click)="onReset()">Effacer</button>
</div>
</form>
<button (click)="goBack()">Retour</button>
<button (click)="save()">Sauvegarder les changements</button>
<button (click)="delete()">Supprimer le collaborateur</button>
</div>

@ -3,6 +3,9 @@ import {Collaborateur} from "../../../interfaces/collaborateur";
import { ActivatedRoute } from '@angular/router';
import { Location } from '@angular/common';
import { CollaborateurService} from "../../../services/collaborateur.service";
import {BusinessunitService} from "../../../services/businessunit.service";
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
import {Businessunit} from "../../../interfaces/businessunit";
@Component({
selector: 'app-collaborateur-edit',
@ -10,16 +13,55 @@ import { CollaborateurService} from "../../../services/collaborateur.service";
styleUrls: ['./collaborateur-edit.component.scss']
})
export class CollaborateurEditComponent implements OnInit {
collaborateur : Collaborateur | undefined;
collaborateur = {} as Collaborateur;
collaborateurs : Collaborateur[] = [];
businessUnits : Businessunit[] = [];
businessUnit = {} as Businessunit ;
rDate : String = "";
bDate : String = "";
registerForm!: FormGroup;
submitted = false;
constructor(
private route: ActivatedRoute,
private collaborateurService: CollaborateurService,
private location: Location
private businessunitService: BusinessunitService,
private location: Location,
private formBuilder: FormBuilder
) { }
ngOnInit(): void {
this.getCollaborateur()
this.getCollaborateurs()
this.getCollaborateur();
this.getBusinessunits();
this.registerForm = this.formBuilder.group({
name: ['', Validators.required],
firstName: ['', Validators.required],
birthDate: ['', Validators.required],
gender: ['', Validators.required],
status: ['', Validators.required],
childrenNumber: ['', Validators.required],
address: ['', Validators.required],
telephone: ['', Validators.required],
personalMail: ['', Validators.required],
apsideMail: ['', Validators.required],
resignationDate: ['', Validators.required],
referrerId: ['', Validators.required],
businessUnitId: ['', Validators.required],
});
if (this.collaborateur.resignationDate) {
this.rDate = new Date(this.collaborateur.resignationDate).toISOString().split('T')[0];
}
if (this.collaborateur.birthDate) {
this.bDate = new Date(this.collaborateur.birthDate).toISOString().split('T')[0];
}
}
getCollaborateurs():void {
this.collaborateurService.getCollaborateurs()
.subscribe(collaborateurs => this.collaborateurs = collaborateurs);
}
getCollaborateur(): void {
@ -28,13 +70,17 @@ export class CollaborateurEditComponent implements OnInit {
.subscribe(collaborateur => this.collaborateur = collaborateur);
}
getBusinessunits():void {
this.businessunitService.getBusinessunits()
.subscribe(businessunits => this.businessUnits = businessunits);
}
goBack(): void {
this.location.back();
}
save():void{
if (this.collaborateur){
console.log("SAVE",this.collaborateur.resignationDate)
this.collaborateurService.updateCollaborateur(this.collaborateur)
.subscribe(()=>this.goBack());
}
@ -46,4 +92,29 @@ export class CollaborateurEditComponent implements OnInit {
.subscribe(()=>this.goBack());
}
}
onSubmit() {
this.submitted = true;
if (this.registerForm.invalid) {
return;
}
this.collaborateur = this.registerForm.value
this.save()
}
get f() { return this.registerForm.controls; }
onReset() {
this.submitted = false;
this.registerForm.reset();
}
onResignationDateChange($event: any):void {
this.collaborateur.resignationDate = new Date($event.target.value);
}
onBirthDateChange($event: any):void {
this.collaborateur.birthDate = new Date($event.target.value);
}
}

@ -2,11 +2,150 @@
<h3>Ajouter un collaborateur : </h3>
<app-collaborateur-detail [collaborateur]="collaborateur"></app-collaborateur-detail>
<form [formGroup]="registerForm" (ngSubmit)="onSubmit()" >
<div class="row mb-2">
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Nom</label>
<input class="form-control" formControlName="name" [ngClass]="{ 'is-invalid': submitted && f.name.errors }">
<div *ngIf="submitted && f.name.errors" class="invalid-feedback">
<div *ngIf="f.name.errors.required">Le nom d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Prénom</label>
<input class="form-control" formControlName="firstName" [ngClass]="{ 'is-invalid': submitted && f.firstName.errors }">
<div *ngIf="submitted && f.firstName.errors" class="invalid-feedback">
<div *ngIf="f.firstName.errors.required">Le prénom d'un collaborateur 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 naissance</label>
<input type="date" class="form-control" formControlName="birthDate" (change)="onBirthDateChange($event)" [ngClass]="{ 'is-invalid': submitted && f.birthDate.errors }">
<div *ngIf="submitted && f.birthDate.errors" class="invalid-feedback">
<div *ngIf="f.birthDate.errors.required">La date de naissance d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Genre</label>
<select class="form-select" formControlName="gender" [ngClass]="{ 'is-invalid': submitted && f.gender.errors }">
<option value="" disabled selected>Genre</option>
<option value="MASCULIN">Masculin</option>
<option value="FEMININ">Féminin</option>
<option value="AUTRE">Autre</option>
</select>
<div *ngIf="submitted && f.gender.errors" class="invalid-feedback">
<div *ngIf="f.gender.errors.required">Vous devez préciser le genre du collaborateur</div>
</div>
</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">Statut</label>
<select class="form-select" formControlName="status" [ngClass]="{ 'is-invalid': submitted && f.status.errors }">
<option value="" disabled selected>Statut</option>
<option value="CADRE">Cadre</option>
<option value="NON-CADRE">Non-cadre</option>
<option value="ALTERNANT">Alternant</option>
<option value="STAGIAIRE">Stagiaire</option>
</select>
<div *ngIf="submitted && f.status.errors" class="invalid-feedback">
<div *ngIf="f.status.errors.required">Vous devez préciser le statut du collaborateur</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Nombre d'enfants</label>
<input class="form-control" formControlName="childrenNumber" [ngClass]="{ 'is-invalid': submitted && f.childrenNumber.errors }" type="number" min="0" onkeyup="if(this.value<0){this.value= this.value * -1}">
<div *ngIf="submitted && f.childrenNumber.errors" class="invalid-feedback">
<div *ngIf="f.childrenNumber.errors.required">Le nombre d'enfant d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Adresse</label>
<input class="form-control" formControlName="address" [ngClass]="{ 'is-invalid': submitted && f.address.errors }">
<div *ngIf="submitted && f.address.errors" class="invalid-feedback">
<div *ngIf="f.address.errors.required">L'adresse d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Téléphone</label>
<input class="form-control" formControlName="telephone" [ngClass]="{ 'is-invalid': submitted && f.telephone.errors }">
<div *ngIf="submitted && f.telephone.errors" class="invalid-feedback">
<div *ngIf="f.telephone.errors.required">Le numéro de téléphone d'un collaborateur est obligatoire</div>
</div>
</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">Mail personnel</label>
<input type="email" class="form-control" formControlName="personalMail" [ngClass]="{ 'is-invalid': submitted && f.personalMail.errors }" placeholder="prenom.nom@example.com">
<div *ngIf="submitted && f.personalMail.errors" class="invalid-feedback">
<div *ngIf="f.personalMail.errors.required">Le mail personnel d'un collaborateur est obligatoire</div>
</div>
</div>
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label class="form-label">Mail Apside</label>
<input type="email" class="form-control" formControlName="apsideMail" [ngClass]="{ 'is-invalid': submitted && f.apsideMail.errors }" placeholder="prenom.nom@apside-groupe.com">
<div *ngIf="submitted && f.apsideMail.errors" class="invalid-feedback">
<div *ngIf="f.apsideMail.errors.required">Le mail Apside d'un collaborateur 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 départ</label>
<input type="date" class="form-control" formControlName="resignationDate" (change)="onResignationDateChange($event)" [ngClass]="{ 'is-invalid': submitted && f.resignationDate.errors }">
<div *ngIf="submitted && f.resignationDate.errors" class="invalid-feedback">
<div *ngIf="f.resignationDate.errors.required">La date de départ d'un collaborateur est obligatoire</div>
</div>
</div>
</div>
<div class="row mb-2">
<div class="form-group col-12 col-md-6">
<label class="form-label">Référent</label>
<select class="form-select" formControlName="referrerId" [ngClass]="{ 'is-invalid': submitted && f.referrerId.errors }">
<option value="" disabled selected>Choisissez un référent pour le collaborateur</option>
<option *ngFor="let collaborateur of collaborateurs" [ngValue]="collaborateur.id">{{collaborateur.name}} {{collaborateur.firstName}}</option>
</select>
<div *ngIf="submitted && f.referrerId.errors" class="invalid-feedback">
<div *ngIf="f.referrerId.errors.required">Vous devez préciser le référent du collaborateur</div>
</div>
</div>
<div class="form-group col-12 col-md-6">
<label class="form-label">Business Unit</label>
<select class="form-select" formControlName="businessUnitId" [ngClass]="{ 'is-invalid': submitted && f.businessUnitId.errors }">
<option value="" disabled selected>Choisissez une Business Unit pour le collaborateur</option>
<option *ngFor="let businessUnit of businessUnits" [ngValue]="businessUnit.id">{{businessUnit.name}} </option>
</select>
<div *ngIf="submitted && f.businessUnitId.errors" class="invalid-feedback">
<div *ngIf="f.businessUnitId.errors.required">Vous devez préciser la Business Unit du collaborateur</div>
</div>
</div>
</div>
<div>
<button type="submit">Ajouter le collaborateur</button>
<button type="reset" (click)="onReset()">Effacer</button>
</div>
</form>
<button class="add-button" (click)="add(collaborateur)">
Ajouter un Collaborateur
</button>
<h2 class = mb-4>Collaborateurs</h2>

@ -2,6 +2,9 @@ import { Component, OnInit } from '@angular/core';
import {HttpClient} from "@angular/common/http";
import {CollaborateurService} from "../../services/collaborateur.service";
import {Collaborateur} from "../../interfaces/collaborateur";
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
import {Businessunit} from "../../interfaces/businessunit";
import {BusinessunitService} from "../../services/businessunit.service";
@Component({
selector: 'app-collaborateur',
@ -10,15 +13,47 @@ import {Collaborateur} from "../../interfaces/collaborateur";
})
export class CollaborateurComponent implements OnInit {
collaborateurs : Collaborateur[] = [];
collaborateur = {} as Collaborateur ;
collaborateur = {} as Collaborateur;
businessUnits : Businessunit[] = [];
businessUnit = {} as Businessunit ;
rDate : String = "";
bDate : String = "";
registerForm!: FormGroup;
submitted = false;
constructor(
private http : HttpClient,
private businessunitService: BusinessunitService,
private collaborateurService: CollaborateurService,
private formBuilder: FormBuilder
) { }
ngOnInit(): void {
this.getCollaborateurs();
this.getBusinessunits();
this.registerForm = this.formBuilder.group({
name: ['', Validators.required],
firstName: ['', Validators.required],
birthDate: ['', Validators.required],
gender: ['', Validators.required],
status: ['', Validators.required],
childrenNumber: ['', Validators.required],
address: ['', Validators.required],
telephone: ['', Validators.required],
personalMail: ['', Validators.required],
apsideMail: ['', Validators.required],
resignationDate: ['', Validators.required],
referrerId: ['', Validators.required],
businessUnitId: ['', Validators.required],
});
if (this.collaborateur.resignationDate) {
this.rDate = new Date(this.collaborateur.resignationDate).toISOString().split('T')[0];
}
if (this.collaborateur.birthDate) {
this.bDate = new Date(this.collaborateur.birthDate).toISOString().split('T')[0];
}
}
getCollaborateurs():void {
@ -26,6 +61,11 @@ export class CollaborateurComponent implements OnInit {
.subscribe(collaborateurs => this.collaborateurs = collaborateurs);
}
getBusinessunits():void {
this.businessunitService.getBusinessunits()
.subscribe(businessunits => this.businessUnits = businessunits);
}
add(collaborateur: Collaborateur): void {
this.collaborateurService.addCollaborateur(collaborateur)
.subscribe(collaborateur => {
@ -33,4 +73,29 @@ export class CollaborateurComponent implements OnInit {
});
}
onSubmit() {
this.submitted = true;
if (this.registerForm.invalid) {
return;
}
this.collaborateur = this.registerForm.value
this.add(this.collaborateur)
}
get f() { return this.registerForm.controls; }
onReset() {
this.submitted = false;
this.registerForm.reset();
}
onResignationDateChange($event: any):void {
this.collaborateur.resignationDate = new Date($event.target.value);
}
onBirthDateChange($event: any):void {
this.collaborateur.birthDate = new Date($event.target.value);
}
}

@ -1,4 +1,5 @@
export interface Agence {
name: string;
id: number;
businessUnitId : number;
}

@ -1,5 +1,4 @@
export interface Businessunit {
name: string;
id: number;
agenceId : number;
}

Loading…
Cancel
Save