feat : Ajout d'un écran pour afficher les informations d'un bovin
This commit is contained in:
49
frontend/pages/identification-bovin.vue
Normal file
49
frontend/pages/identification-bovin.vue
Normal file
@@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="flex justify-between">
|
||||
<h1 class="font-bold text-4xl uppercase">Passeport du bovin</h1>
|
||||
<p v-if="bovinData">{{ bovinData.presencePeriod }}</p>
|
||||
</div>
|
||||
<div class="overflow-x-auto mt-12" v-if="bovinData">
|
||||
<table class="w-full border-collapse border border-black text-sm">
|
||||
<tr>
|
||||
<th
|
||||
rowspan="2"
|
||||
class="w-10 border border-black p-0 align-middle"
|
||||
>
|
||||
<div class="flex h-full w-full items-center justify-center">
|
||||
<span class="-rotate-90 whitespace-nowrap font-semibold tracking-widest">
|
||||
VEAU
|
||||
</span>
|
||||
</div>
|
||||
</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">N° de travail</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">Sexe</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">Code Race</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">Code pays</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">Type de racial</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">Date de naissance</th>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">{{ bovinData.workNumber }}</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">{{ bovinData.sex }}</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">{{ bovinData.breedType }}</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">FR {{ bovinData.numeroNational }}</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">???</th>
|
||||
<th class="border border-black px-4 py-3 text-center font-semibold">{{ bovinData.birthDate }}</th>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {getBovinData} from "~/services/identification-bovin";
|
||||
|
||||
const bovinData = ref<IdentificationBovinData|null>()
|
||||
|
||||
onMounted(async () => {
|
||||
bovinData.value = await getBovinData('7979580026');
|
||||
})
|
||||
</script>
|
||||
Reference in New Issue
Block a user