firstname added to onthefly for child or contact

src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_components/OnTheFly/ThirdParty.vue

@@ -65,7 +65,7 @@
       </div>
 
       <div v-if="thirdparty.kind === 'child' || thirdparty.kind === 'contact'">
-         <div id="child-info">
+         <div class="child-info">
             <div class="input-group mb-3">
                <select class="form-select form-select-lg" id="profession"
                   v-model="thirdparty.civility">
@@ -81,9 +81,19 @@
                </select>
             </div>
          </div>
+         <div class="child-info">
+            <div class="form-floating mb-3">
+               <input class="form-control form-control-lg" id="firstname" v-model="thirdparty.firstname" v-bind:placeholder="$t('thirdparty.firstname')" />
+               <label for="firstname">{{ $t('thirdparty.firstname') }}</label>
+            </div>
+            <div class="form-floating mb-3">
+               <input class="form-control form-control-lg" id="name" v-model="thirdparty.name" v-bind:placeholder="$t('thirdparty.lastname')" />
+               <label for="name">{{ $t('thirdparty.lastname') }}</label>
+            </div>
+         </div>
       </div>
 
-      <div class="form-floating mb-3">
+      <div class="form-floating mb-3" v-if="thirdparty.kind === 'company'">
          <input class="form-control form-control-lg" id="name" v-model="thirdparty.name" v-bind:placeholder="$t('thirdparty.name')" />
          <label for="name">{{ $t('thirdparty.name') }}</label>
       </div>
@@ -307,7 +317,7 @@ dl {
    margin-bottom: 1rem;
 }
 
-#child-info {
+.child-info {
    display: flex;
    justify-content: space-between;
    div {

src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_js/i18n.js

@@ -1,6 +1,8 @@
 const thirdpartyMessages = {
     fr: {
         thirdparty: {
+            firstname: "Prénom",
+            lastname: "Nom",
             name: "Dénomination",
             email: "Courriel",
             phonenumber: "Téléphone",