AlexandreRuiz
/
Collaborateur_Epa_Front
2
1
Fork 0
Code Issues Pull Requests 1 Projects Releases Wiki Activity

changement des collaborateurs avec des classes BootStrap. Responsive. A valider.

Browse Source
pull/9/head
Clement FERRERE 3 years ago
parent 4e2297a9e3
commit ea72dbc48b
3 changed files with 102 additions and 57 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 124
      src/app/components/collaborateur/collaborateur-detail/collaborateur-detail.component.html
  2. 3
      src/app/components/collaborateur/collaborateur-edit/collaborateur-edit.component.html
  3. 22
      src/app/components/collaborateur/collaborateur.component.html

124
src/app/components/collaborateur/collaborateur-detail/collaborateur-detail.component.html
Unescape View File

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

3
src/app/components/collaborateur/collaborateur-edit/collaborateur-edit.component.html
Unescape View File

@ -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>

22
src/app/components/collaborateur/collaborateur.component.html
Unescape View File

@ -2,19 +2,25 @@
<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">
<table > <table class="table">
<thead>
<tr> <tr>
<th class="spaced">Name</th> <th scope="col">ID</th>
<th class="spaced">First Name</th> <th scope="col">Name</th>
<th class="spaced">Apside Mail</th> <th scope="col">First Name</th>
<th scope="col">Apside Mail</th>
</tr> </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>

Write Preview
Loading…
Cancel
Save