inversion liste et formulaire

src/app/components/agence/agence.component.html

@@ -1,4 +1,24 @@
 <div xmlns="">
+
+  <h3>Ajouter une agence : </h3>
+
+  <form [formGroup]="registerForm" (ngSubmit)="onSubmit()" >
+
+    <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
+      <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'une agence est obligatoire</div>
+      </div>
+    </div>
+
+
+    <div>
+      <button type="submit">Créer l'agence</button>
+      <button type="reset" (click)="onReset()">Effacer</button>
+    </div>
+  </form>
+
   <h2 class = mb-4>Agences</h2>
 
   <div style="overflow-x:auto;" class="mb-5 col-12">
@@ -19,24 +39,7 @@
     </table>
   </div>
 
-  <h3>Ajouter une agence : </h3>
-
-  <form [formGroup]="registerForm" (ngSubmit)="onSubmit()" >
-
-    <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
-      <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'une agence est obligatoire</div>
-      </div>
-    </div>
-
 
-    <div>
-      <button type="submit">Créer l'agence</button>
-      <button type="reset" (click)="onReset()">Effacer</button>
-    </div>
-  </form>
 
 
 </div>

src/app/components/businessunit/businessunit.component.html

@@ -1,23 +1,5 @@
 <div xmlns="">
-  <h2 class = mb-4>Business Unit</h2>
 
-  <div style="overflow-x:auto;" class="mb-5 col-12">
-    <table class="table">
-      <thead>
-        <tr>
-          <th scope="col">ID</th>
-          <th scope="col">Nom</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr *ngFor="let businessunit of businessunits">
-          <th scope="row">{{businessunit.id}}</th>
-          <td> {{businessunit.name}} </td>
-          <td> <a routerLink="{{businessunit.id}}"> Modifier </a></td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
   <h3>Ajouter une Business Unit : </h3>
 
   <form [formGroup]="registerForm" (ngSubmit)="onSubmit()" >
@@ -46,4 +28,26 @@
       <button type="reset" (click)="onReset()">Effacer</button>
     </div>
   </form>
+
+
+  <h2 class = mb-4>Business Unit</h2>
+
+  <div style="overflow-x:auto;" class="mb-5 col-12">
+    <table class="table">
+      <thead>
+        <tr>
+          <th scope="col">ID</th>
+          <th scope="col">Nom</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr *ngFor="let businessunit of businessunits">
+          <th scope="row">{{businessunit.id}}</th>
+          <td> {{businessunit.name}} </td>
+          <td> <a routerLink="{{businessunit.id}}"> Modifier </a></td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+
 </div>

src/app/components/collaborateur/collaborateur.component.html

@@ -1,4 +1,13 @@
 <div xmlns="">
+
+  <h3>Ajouter un collaborateur : </h3>
+
+  <app-collaborateur-detail [collaborateur]="collaborateur"></app-collaborateur-detail>
+
+  <button class="add-button" (click)="add(collaborateur)">
+    Ajouter un Collaborateur
+  </button>
+
   <h2 class = mb-4>Collaborateurs</h2>
 
   <div style="overflow-x:auto;" class="mb-5 col-12">
@@ -24,11 +33,5 @@
     </table>
   </div>
 
-  <h3>Ajouter un collaborateur : </h3>
-
-  <app-collaborateur-detail [collaborateur]="collaborateur"></app-collaborateur-detail>
 
-  <button class="add-button" (click)="add(collaborateur)">
-    Ajouter un Collaborateur
-  </button>
 </div>