reco_graphique #9

Merged
Clement.Ferrere merged 7 commits from reco_graphique into develop 3 years ago
  1. 1
      src/app/app.component.html
  2. 1
      src/app/app.component.ts
  3. 5
      src/app/app.module.ts
  4. 8
      src/app/components/agence/agence-detail/agence-detail.component.html
  5. 0
      src/app/components/agence/agence-detail/agence-detail.component.scss
  6. 31
      src/app/components/agence/agence-detail/agence-detail.component.ts
  7. 15
      src/app/components/agence/agence-edit/agence-edit.component.html
  8. 37
      src/app/components/agence/agence.component.html
  9. 33
      src/app/components/businessunit/businessunit-detail/businessunit-detail.component.html
  10. 45
      src/app/components/businessunit/businessunit.component.html
  11. 134
      src/app/components/collaborateur/collaborateur-detail/collaborateur-detail.component.html
  12. 29
      src/app/components/collaborateur/collaborateur-detail/collaborateur-detail.component.ts
  13. 3
      src/app/components/collaborateur/collaborateur-edit/collaborateur-edit.component.html
  14. 1
      src/app/components/collaborateur/collaborateur-edit/collaborateur-edit.component.ts
  15. 28
      src/app/components/collaborateur/collaborateur.component.html
  16. 1
      src/app/components/collaborateur/collaborateur.component.ts
  17. 2
      src/app/services/agence.service.ts
  18. 2
      src/app/services/businessunit.service.ts
  19. 2
      src/app/services/collaborateur.service.ts
  20. 6
      src/ressources/routes/routes.ts
  21. 3
      src/ressources/routes/routesPreprod.ts

@ -22,7 +22,6 @@
} }
.toolbar { .toolbar {
position: absolute;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;

@ -23,7 +23,6 @@ export class AppComponent implements OnInit {
).subscribe(() => { ).subscribe(() => {
const rt = this.getChild(this.activatedRoute); const rt = this.getChild(this.activatedRoute);
rt.data.subscribe(data => { rt.data.subscribe(data => {
console.log(data);
this.titleService.setTitle(data.title)}); this.titleService.setTitle(data.title)});
}); });
} }

@ -15,6 +15,7 @@ import { CollaborateurDetailComponent } from './components/collaborateur/collabo
import { BusinessunitComponent } from './components/businessunit/businessunit.component'; import { BusinessunitComponent } from './components/businessunit/businessunit.component';
import { BusinessunitEditComponent } from './components/businessunit/businessunit-edit/businessunit-edit.component'; import { BusinessunitEditComponent } from './components/businessunit/businessunit-edit/businessunit-edit.component';
import { BusinessunitDetailComponent } from './components/businessunit/businessunit-detail/businessunit-detail.component'; import { BusinessunitDetailComponent } from './components/businessunit/businessunit-detail/businessunit-detail.component';
import { AgenceDetailComponent } from './components/agence/agence-detail/agence-detail.component';
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -24,10 +25,12 @@ import { BusinessunitDetailComponent } from './components/businessunit/businessu
HomeComponent, HomeComponent,
AgenceComponent, AgenceComponent,
AgenceEditComponent, AgenceEditComponent,
AgenceDetailComponent,
CollaborateurDetailComponent, CollaborateurDetailComponent,
BusinessunitComponent, BusinessunitComponent,
BusinessunitEditComponent, BusinessunitEditComponent,
BusinessunitDetailComponent BusinessunitDetailComponent,
], ],
imports: [ imports: [
BrowserModule, BrowserModule,

@ -0,0 +1,8 @@
<div class="row mb-2">
<div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<label for="agence-name" class="form-label">Nom</label>
<input class="form-control" id="agence-name" [(ngModel)]="agence.name" placeholder="name">
</div>
</div>

@ -0,0 +1,31 @@
import {Component, Input, OnInit} from '@angular/core';
import {Agence} from "../../../interfaces/agence";
import {HttpClient} from "@angular/common/http";
import {AgenceService} from "../../../services/agence.service";
@Component({
selector: 'app-agence-detail',
templateUrl: './agence-detail.component.html',
styleUrls: ['./agence-detail.component.scss']
})
export class AgenceDetailComponent implements OnInit {
agences : Agence[] = [];
@Input()
agence = {} as Agence ;
constructor(
private http : HttpClient,
private agenceService: AgenceService,
) { }
ngOnInit(): void {
this.getAgences();
this.getAgences();
}
getAgences():void {
this.agenceService.getAgences()
.subscribe(agences => this.agences = agences);
}
}

@ -3,21 +3,8 @@
<h2>{{agence.name | uppercase}} </h2> <h2>{{agence.name | uppercase}} </h2>
<div><span>id : </span>{{agence.id}}</div> <div><span>id : </span>{{agence.id}}</div>
<div>
<div class = mb-3>
<table>
<tr>
<th>Name</th>
</tr>
<tr>
<td>
<input id="agence-name" [(ngModel)]="agence.name" placeholder="name">
</td>
</tr>
</table>
</div>
</div>
<app-agence-detail [agence]="agence"></app-agence-detail>
<button (click)="goBack()">Retour</button> <button (click)="goBack()">Retour</button>
<button (click)="save()">Sauvegarder les changements</button> <button (click)="save()">Sauvegarder les changements</button>

@ -1,31 +1,28 @@
<div xmlns=""> <div xmlns="">
<h2 class = mb-4>Agences</h2> <h2 class = mb-4>Agences</h2>
<table class = mb-5> <div style="overflow-x:auto;" class="mb-5 col-12">
<tr> <table class="table">
<th class="spaced">Name</th> <thead>
</tr>
<tr *ngFor="let agence of agences">
<td class="spaced"> {{agence.name}} </td>
<td class="spaced"> <a routerLink="{{agence.id}}"> Modifier </a></td>
</tr>
</table>
<h3>Ajouter une agence : </h3>
<div class = mb-3>
<table>
<tr>
<th>Name</th>
</tr>
<tr> <tr>
<td> <th scope="col">ID</th>
<input id="agence-name" [(ngModel)]="agence.name" placeholder="name"> <th scope="col">Nom</th>
</td>
</tr> </tr>
</thead>
<tbody>
<tr *ngFor="let agence of agences">
<th scope="row">{{agence.id}}</th>
<td> {{agence.name}} </td>
<td> <a routerLink="{{agence.id}}"> Modifier </a></td>
</tr>
</tbody>
</table> </table>
</div> </div>
<h3>Ajouter une agence : </h3>
<app-agence-detail [agence]="agence"></app-agence-detail>
<button class="add-button" (click)="add(agence)"> <button class="add-button" (click)="add(agence)">
Ajouter une Agence Ajouter une Agence
</button> </button>

@ -1,17 +1,20 @@
<div class = mb-3> <div class="row mb-4">
<table>
<tr> <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<th>Name</th> <label for="businessunit-name" class="form-label">Nom</label>
</tr> <input class="form-control" id="businessunit-name" [(ngModel)]="businessunit.name" placeholder="Nom">
<tr> </div>
<td>
<input id="businessunit-name" [(ngModel)]="businessunit.name" placeholder="name"> </div>
</td>
</tr> <div class="row mb-5">
</table>
<div class="form-group col-12 col-md-6">
<label class="form-label">Agence</label>
<select class="form-select" name="agence" id="agence-select" [(ngModel)]="businessunit.agenceId">
<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>
<select name="agence" id="agence-select" [(ngModel)]="businessunit.agenceId">
<option value="">-- Choisissez l'agence de cette business Unit --</option>
<option *ngFor="let agence of agences" [ngValue]="agence.id">{{agence.name}}</option>
</select>
</div> </div>

@ -1,35 +1,26 @@
<div xmlns=""> <div xmlns="">
<h2 class = mb-4>Business Unit</h2> <h2 class = mb-4>Business Unit</h2>
<table class = mb-5> <div style="overflow-x:auto;" class="mb-5 col-12">
<tr> <table class="table">
<th class="spaced">Name</th> <thead>
</tr> <tr>
<tr *ngFor="let businessunit of businessunits"> <th scope="col">ID</th>
<td class="spaced"> {{businessunit.name}} </td> <th scope="col">Nom</th>
<td class="spaced"> <a routerLink="{{businessunit.id}}"> Modifier </a></td> </tr>
</tr> </thead>
</table> <tbody>
<tr *ngFor="let businessunit of businessunits">
<h3>Ajouter une businessunit : </h3> <th scope="row">{{businessunit.id}}</th>
<td> {{businessunit.name}} </td>
<div class = mb-3> <td> <a routerLink="{{businessunit.id}}"> Modifier </a></td>
<table> </tr>
<tr> </tbody>
<th>Name</th>
</tr>
<tr>
<td>
<input id="businessunit-name" [(ngModel)]="businessunit.name" placeholder="name">
</td>
</tr>
</table> </table>
<select name="agence" id="agence-select" [(ngModel)]="businessunit.agenceId">
<option value="">-- Choisissez l'agence de cette business Unit --</option>
<option *ngFor="let agence of agences" [ngValue]="agence.id">{{agence.name}}</option>
</select>
</div> </div>
<h3>Ajouter une Business Unit : </h3>
<app-businessunit-detail [businessunit]="businessunit"></app-businessunit-detail>
<button class="add-button" (click)="add(businessunit)"> <button class="add-button" (click)="add(businessunit)">
Ajouter une businessunit Ajouter une businessunit

@ -1,54 +1,96 @@
<div *ngIf="collaborateur" style="overflow-x:auto;" class="mb-3"> <div *ngIf="collaborateur" class="mb-3">
<table class="mb-3"> <div class="row mb-2">
<tr>
<th>Name</th> <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<th>First Name</th> <label for="collaborateur-name" class="form-label">Nom</label>
<th>Birth Date</th> <input class="form-control" id="collaborateur-name" [(ngModel)]="collaborateur.name" placeholder="Nom">
<th>Gender</th> </div>
<th>Status</th>
<th>Children Number</th> <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<th>Address</th> <label for="collaborateur-firstName" class="form-label">Prénom</label>
<th>Telephone</th> <input class="form-control" id="collaborateur-firstName" [(ngModel)]="collaborateur.firstName" placeholder="Prénom">
<th>Personal Mail</th> </div>
<th>Apside Mail</th>
<th>Resignation Date</th> <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
</tr> <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">
<tr> </div>
<td><input id="collaborateur-name" [(ngModel)]="collaborateur.name" placeholder="name"></td>
<td><input id="collaborateur-firstName" [(ngModel)]="collaborateur.firstName" placeholder="firstname"></td> <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
<td><input id="collaborateur-birthDate" [(ngModel)]="collaborateur.birthDate" placeholder="birthDate"></td> <label class="form-label">Genre</label>
<td><input id="collaborateur-gender" [(ngModel)]="collaborateur.gender" placeholder="gender"></td> <select class="form-select" name="genre" id="collaborateur-gender" [(ngModel)]="collaborateur.gender">
<td><input id="collaborateur-status" [(ngModel)]="collaborateur.status" placeholder="status"></td> <option value="" disabled selected>Genre</option>
<td><input id="collaborateur-childrenNumber" [(ngModel)]="collaborateur.childrenNumber" placeholder="childrenNumber"></td> <option value="MASCULIN">Masculin</option>
<td><input id="collaborateur-address" [(ngModel)]="collaborateur.address" placeholder="address"></td> <option value="FEMININ">Féminin</option>
<td><input id="collaborateur-telephone" [(ngModel)]="collaborateur.telephone" placeholder="telephone"></td> <option value="AUTRE">Autre</option>
<td><input id="collaborateur-personalMail" [(ngModel)]="collaborateur.personalMail" placeholder="personalMail"></td> </select>
<td><input id="collaborateur-apsideMail" [(ngModel)]="collaborateur.apsideMail" placeholder="apsideMail"></td> </div>
<td><input id="collaborateur-resignationDate" [(ngModel)]="collaborateur.resignationDate" placeholder="resignationDate"></td> </div>
</tr>
<div class="row mb-2">
</table>
<select name="referrer" id="referrer-select" [(ngModel)]="collaborateur.referrerId">
<option value="">-- Choisissez un référent pour le nouveau collaborateur --</option>
<option *ngFor="let collaborateur of collaborateurs" [ngValue]="collaborateur.id">{{collaborateur.name}} {{collaborateur.firstName}}</option>
</select>
<select name="businessunit" id="businessunit-select" [(ngModel)]="collaborateur.businessUnitId">
<option value="">-- Choisissez la Business Unit pour le nouveau collaborateur --</option>
<option *ngFor="let businessunit of businessunits" [ngValue]="businessunit.id">{{businessunit.name}} </option>
</select>
<br/>
<span>
*Tous les champs sont obligatoires
</span>
<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> </div>

@ -4,7 +4,6 @@ import {HttpClient} from "@angular/common/http";
import {CollaborateurService} from "../../../services/collaborateur.service"; import {CollaborateurService} from "../../../services/collaborateur.service";
import {BusinessunitService} from "../../../services/businessunit.service"; import {BusinessunitService} from "../../../services/businessunit.service";
import {Businessunit} from "../../../interfaces/businessunit"; import {Businessunit} from "../../../interfaces/businessunit";
@Component({ @Component({
selector: 'app-collaborateur-detail', selector: 'app-collaborateur-detail',
templateUrl: './collaborateur-detail.component.html', templateUrl: './collaborateur-detail.component.html',
@ -14,19 +13,30 @@ export class CollaborateurDetailComponent implements OnInit {
businessunits : Businessunit[] = []; businessunits : Businessunit[] = [];
collaborateurs : Collaborateur[] = []; collaborateurs : Collaborateur[] = [];
rDate : String = "";
bDate : String = "";
@Input() @Input()
collaborateur = {} as Collaborateur ; collaborateur = {} as Collaborateur;
constructor( constructor(
private http : HttpClient, private http : HttpClient,
private collaborateurService: CollaborateurService, private collaborateurService: CollaborateurService,
private businessunitService: BusinessunitService private businessunitService: BusinessunitService
) { } ) {}
ngOnInit(): void { ngOnInit(): void {
this.getCollaborateurs(); this.getCollaborateurs();
this.getBusinessunits(); 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 { getCollaborateurs():void {
@ -39,4 +49,17 @@ export class CollaborateurDetailComponent implements OnInit {
.subscribe(businessunits => this.businessunits = businessunits); .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)
}
} }

@ -2,7 +2,8 @@
<div *ngIf="collaborateur"> <div *ngIf="collaborateur">
<h2>{{collaborateur.name | uppercase}} {{collaborateur.firstName | uppercase}} </h2> <h2>{{collaborateur.name | uppercase}} {{collaborateur.firstName | uppercase}} </h2>
<div><span>id : </span>{{collaborateur.id}}</div>
<div><label class="form-label">ID : </label>{{collaborateur.id}}</div>
<app-collaborateur-detail [collaborateur]="collaborateur"></app-collaborateur-detail> <app-collaborateur-detail [collaborateur]="collaborateur"></app-collaborateur-detail>

@ -34,6 +34,7 @@ export class CollaborateurEditComponent implements OnInit {
save():void{ save():void{
if (this.collaborateur){ if (this.collaborateur){
console.log("SAVE",this.collaborateur.resignationDate)
this.collaborateurService.updateCollaborateur(this.collaborateur) this.collaborateurService.updateCollaborateur(this.collaborateur)
.subscribe(()=>this.goBack()); .subscribe(()=>this.goBack());
} }

@ -1,20 +1,26 @@
<div xmlns=""> <div xmlns="">
<h2 class = mb-4>Collaborateurs</h2> <h2 class = mb-4>Collaborateurs</h2>
<div style="overflow-x:auto;" class="mb-5"> <div style="overflow-x:auto;" class="mb-5 col-12">
<table > <table class="table">
<tr> <thead>
<th class="spaced">Name</th> <tr>
<th class="spaced">First Name</th> <th scope="col">ID</th>
<th class="spaced">Apside Mail</th> <th scope="col">Nom</th>
</tr> <th scope="col">Prénom</th>
<th scope="col">Mail Apside</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let collaborateur of collaborateurs"> <tr *ngFor="let collaborateur of collaborateurs">
<td class="spaced"> {{collaborateur.name}} </td> <th scope="row">{{collaborateur.id}}</th>
<td class="spaced"> {{collaborateur.firstName}} </td> <td> {{collaborateur.name}} </td>
<td class="spaced"> {{collaborateur.apsideMail}} </td> <td> {{collaborateur.firstName}} </td>
<td class="spaced"> <a routerLink="{{collaborateur.id}}"> Modifier </a></td> <td> {{collaborateur.apsideMail}} </td>
<td> <a routerLink="{{collaborateur.id}}"> Modifier </a></td>
</tr> </tr>
</tbody>
</table> </table>
</div> </div>

@ -27,7 +27,6 @@ export class CollaborateurComponent implements OnInit {
} }
add(collaborateur: Collaborateur): void { add(collaborateur: Collaborateur): void {
console.log(collaborateur);
this.collaborateurService.addCollaborateur(collaborateur) this.collaborateurService.addCollaborateur(collaborateur)
.subscribe(collaborateur => { .subscribe(collaborateur => {
this.collaborateurs.push(collaborateur); this.collaborateurs.push(collaborateur);

@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
import {HttpClient, HttpHeaders} from "@angular/common/http"; import {HttpClient, HttpHeaders} from "@angular/common/http";
import {Observable} from "rxjs"; import {Observable} from "rxjs";
import {Agence} from "../interfaces/agence"; import {Agence} from "../interfaces/agence";
import {agencesUrl} from "../../ressources/routes/routes"; import {agencesUrl} from "../../ressources/routes/routesPreprod";
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'

@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
import {HttpClient, HttpHeaders} from "@angular/common/http"; import {HttpClient, HttpHeaders} from "@angular/common/http";
import {Observable} from "rxjs"; import {Observable} from "rxjs";
import {Businessunit} from "../interfaces/businessunit"; import {Businessunit} from "../interfaces/businessunit";
import {businessunitsUrl} from "../../ressources/routes/routes"; import {businessunitsUrl} from "../../ressources/routes/routesPreprod";
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'

@ -2,7 +2,7 @@ import {Collaborateur} from "../interfaces/collaborateur";
import {Injectable} from '@angular/core'; import {Injectable} from '@angular/core';
import {Observable} from "rxjs"; import {Observable} from "rxjs";
import {HttpClient, HttpHeaders} from "@angular/common/http"; import {HttpClient, HttpHeaders} from "@angular/common/http";
import {collaborateursUrl} from "../../ressources/routes/routes"; import {collaborateursUrl} from "../../ressources/routes/routesPreprod";
@Injectable({providedIn: 'root'}) @Injectable({providedIn: 'root'})

@ -1,3 +1,3 @@
export const collaborateursUrl = 'https://localhost:8081/api/collaborateurs'; export const collaborateursUrl = 'https://localhost:5001/api/collaborateurs';
export const agencesUrl = 'https://localhost:8081/api/agences'; export const agencesUrl = 'https://localhost:5001/api/agences';
export const businessunitsUrl = 'https://localhost:8081/api/businessunits'; export const businessunitsUrl = 'https://localhost:5001/api/businessunits';

@ -0,0 +1,3 @@
export const collaborateursUrl = 'https://collaborateur-epa.apsdigit.lan/api/collaborateurs';
export const agencesUrl = 'https://collaborateur-epa.apsdigit.lan/api/agences';
export const businessunitsUrl = 'https://collaborateur-epa.apsdigit.lan/api/businessunits';
Loading…
Cancel
Save