[#FER-30] Revoir l'affichage type bovin (!57)

| Numéro du ticket | Titre du ticket |
|------------------|-----------------|
|                  |                 |

## Description de la PR

## Modification du .env

## Check list

- [ ] Pas de régression
- [ ] TU/TI/TF rédigée
- [ ] TU/TI/TF OK
- [ ] CHANGELOG modifié

Reviewed-on: #57
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>

frontend/pages/admin/bovin/[[id]].vue

@@ -14,10 +14,13 @@
             </h1>
         </div>
 
-        <div class="grid grid-cols-2 items-start pt-7 mb-11 gap-x-[200px]">
+        <div class="grid grid-cols-2 items-start pt-7 mb-8 gap-x-[200px]">
             <UiTextInput label="Nom du bovin" id="bovin-label" v-model="form.label" required />
             <UiTextInput label="Code bovin" id="code-id" v-model="form.code" required />
         </div>
+        <div class="mb-11">
+            <UiCheckbox v-model="form.display" label="Afficher dans les réceptions" />
+        </div>
         <div class="flex justify-center items-center">
             <UiButton
                 type="submit"
@@ -53,7 +56,8 @@ function resolveId(param: unknown) {
 
 const form = reactive<BovinFormData>({
     label: '',
-    code: ''
+    code: '',
+    display: false
 })
 
 
@@ -64,6 +68,7 @@ const hydrateFromBovin = (bovin: BovineTypeData | null) => {
     isHydrating.value = true
     form.label = bovin.label ?? ''
     form.code = bovin.code ?? ''
+    form.display = bovin.display ?? false
     isHydrating.value = false
 }
 
@@ -92,8 +97,8 @@ async function validate() {
 
     const basePayload = {
         label: normalizedBovinLabel,
-        code: normalizedBovinCode
-
+        code: normalizedBovinCode,
+        display: form.display
     }
 
     isLoading.value = true

frontend/pages/admin/bovin/bovin-list.vue

@@ -29,6 +29,14 @@
                 <template #header-code>
                     <UiTextInput v-model="filters.code" placeholder="Code" size="compact" />
                 </template>
+                <template #cell-display="{ item }">
+                    <span
+                        class="inline-flex items-center px-2 py-0.5 rounded text-sm font-medium"
+                        :class="item.display ? 'bg-green-100 text-green-700' : 'bg-slate-100 text-slate-500'"
+                    >
+                        {{ item.display ? 'Oui' : 'Non' }}
+                    </span>
+                </template>
             </UiDataTable>
         </div>
         <div v-else class="mt-6 border border-slate-200 mb-16 px-4 py-6 text-slate-400">
@@ -58,7 +66,8 @@ const { items, totalItems, page, perPage, filters, loading, reload } =
 
 const columns = [
     { key: 'label', label: 'Nom' },
-    { key: 'code', label: 'Code' }
+    { key: 'code', label: 'Code' },
+    { key: 'display', label: 'Affiché en réception' }
 ]
 
 const goToBovin = (bovin: BovineTypeData) => {