reformattage complet d'IntelliJ + modif période d'essai

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

@@ -7,7 +7,8 @@
 
     <div class="form-group col-12 col-md-6">
       <label class="form-label">Collaborateur</label>
-      <select [ngClass]="{ 'is-invalid': submitted && f.collaborateurId.errors }" class="form-select" formControlName="collaborateurId"
+      <select [ngClass]="{ 'is-invalid': submitted && f.collaborateurId.errors }" class="form-select"
+              formControlName="collaborateurId"
               id="collaborateur-select">
         <option disabled selected value="">Choisissez le collaborateur concerné par cette période d'essai</option>
         <option *ngFor="let collaborateur of collaborateurs"
@@ -20,50 +21,63 @@
       </div>
     </div>
 
-    <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 (change)="onStartingDateChange($event)" [ngClass]="{ 'is-invalid': submitted && f.startingDate.errors }" [value]="periodeEssai.startingDate | date:'yyyy-MM-dd'"
-             class="form-control" formControlName="startingDate"
-             type="date">
-      <div *ngIf="submitted && f.startingDate.errors" class="invalid-feedback">
-        <div *ngIf="f.startingDate.errors.required">La date de début d'une période d'essai est obligatoire</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 (change)="onStartingDateChange($event)" [ngClass]="{ 'is-invalid': submitted && f.startingDate.errors }"
+               [value]="periodeEssai.startingDate | date:'yyyy-MM-dd'"
+               class="form-control" formControlName="startingDate"
+               type="date">
+        <div *ngIf="submitted && f.startingDate.errors" class="invalid-feedback">
+          <div *ngIf="f.startingDate.errors.required">La date de début d'une période d'essai est obligatoire</div>
+        </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 prévue</label>
-      <input (change)="onPlannedEndingDateChange($event)" [ngClass]="{ 'is-invalid': submitted && f.plannedEndingDate.errors }" [value]="periodeEssai.plannedEndingDate | date:'yyyy-MM-dd'"
-             class="form-control"
-             formControlName="plannedEndingDate"
-             type="date">
-      <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 class="form-group col-12 col-sm-6 col-md-4 col-lg-3">
+        <label class="form-label">Date de fin prévue</label>
+        <input (change)="onPlannedEndingDateChange($event)"
+               [ngClass]="{ 'is-invalid': submitted && f.plannedEndingDate.errors }"
+               [value]="periodeEssai.plannedEndingDate | date:'yyyy-MM-dd'"
+               class="form-control"
+               formControlName="plannedEndingDate"
+               type="date">
+        <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>
       </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 (change)="onRealEndingDateChange($event)" [value]="periodeEssai.realEndingDate | date:'yyyy-MM-dd'" class="form-control"
-             formControlName="realEndingDate" type="date">
-    </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 (change)="onRealEndingDateChange($event)" [value]="periodeEssai.realEndingDate | date:'yyyy-MM-dd'"
+               class="form-control"
+               formControlName="realEndingDate" type="date">
+      </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">
     </div>
 
-    <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
-      <label class="form-label">Issue</label>
-      <select class="form-select" formControlName="issue">
-        <option disabled selected value="">Statut</option>
-        <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 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">
+      </div>
+
+      <div class="form-group col-12 col-sm-6 col-md-4 col-lg-3 mb-2">
+        <label class="form-label">Issue</label>
+        <select class="form-select" formControlName="issue">
+          <option disabled selected value="">Statut</option>
+          <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>