prevent error on feature change, remove label & fix style

src/components/Feature/Detail/FeatureTable.vue

@@ -21,11 +21,14 @@
             <strong>{{ field.label }}</strong>
           </td>
           <td>
-            <strong>
-              <FeatureExtraForm
+            <strong class="ui form">
+              <span
                 v-if="fastEditionMode && extra_forms.length > 0"
-                :field="getExtraForm(field)"
-              />
+              >
+                <FeatureExtraForm
+                  :field="getExtraForm(field)"
+                />
+              </span>
               <i
                 v-else-if="field.field_type === 'boolean'"
                 :class="[

src/components/Feature/Edit/FeatureExtraForm.vue

 <template>
   <div
-    v-if="field.field_type === 'char'"
+    v-if="field && field.field_type === 'char'"
   >
-    <label for="field.name">{{ field.label }}</label>
+    <label
+      v-if="$route.name === 'editer-signalement'"
+      :for="field.name"
+    >
+      {{ field.label }}
+    </label>
     <input
       :id="field.name"
       :value="field.value"
@@ -13,9 +18,14 @@
   </div>
 
   <div
-    v-else-if="field.field_type === 'list'"
+    v-else-if="field && field.field_type === 'list'"
   >
-    <label for="field.name">{{ field.label }}</label>
+    <label
+      v-if="$route.name === 'editer-signalement'"
+      :for="field.name"
+    >
+      {{ field.label }}
+    </label>
     <Dropdown
       :options="field.options"
       :selected="selected_extra_form_list"
@@ -23,9 +33,14 @@
     />
   </div>
   <div
-    v-else-if="field.field_type === 'integer'"
+    v-else-if="field && field.field_type === 'integer'"
   >
-    <label for="field.name">{{ field.label }}</label>
+    <label
+      v-if="$route.name === 'editer-signalement'"
+      :for="field.name"
+    >
+      {{ field.label }}
+    </label>
     <div class="ui input">
       <!-- //* si click sur fléche dans champ input, pas de focus, donc pas de blur, donc utilisation de @change -->
       <input
@@ -38,7 +53,7 @@
     </div>
   </div>
   <div
-    v-else-if="field.field_type === 'boolean'"
+    v-else-if="field && field.field_type === 'boolean'"
   >
     <div class="ui checkbox">
       <input
@@ -48,13 +63,23 @@
         :name="field.name"
         @change="updateStore_extra_form"
       >
-      <label for="field.name">{{ field.label }}</label>
+      <label
+        v-if="$route.name === 'editer-signalement'"
+        :for="field.name"
+      >
+        {{ field.label }}
+      </label>
     </div>
   </div>
   <div
-    v-else-if="field.field_type === 'date'"
+    v-else-if="field && field.field_type === 'date'"
   >
-    <label for="field.name">{{ field.label }}</label>
+    <label
+      v-if="$route.name === 'editer-signalement'"
+      :for="field.name"
+    >
+      {{ field.label }}
+    </label>
     <input
       :id="field.name"
       :value="field.value"
@@ -64,9 +89,14 @@
     >
   </div>
   <div
-    v-else-if="field.field_type === 'decimal'"
+    v-else-if="field && field.field_type === 'decimal'"
   >
-    <label for="field.name">{{ field.label }}</label>
+    <label
+      v-if="$route.name === 'editer-signalement'"
+      :for="field.name"
+    >
+      {{ field.label }}
+    </label>
     <div class="ui input">
       <input
         :id="field.name"
@@ -79,9 +109,14 @@
     </div>
   </div>
   <div
-    v-else-if="field.field_type === 'text'"
+    v-else-if="field && field.field_type === 'text'"
   >
-    <label :for="field.name">{{ field.label }}</label>
+    <label
+      v-if="$route.name === 'editer-signalement'"
+      :for="field.name"
+    >
+      {{ field.label }}
+    </label>
     <textarea
       :value="field.value"
       :name="field.name"