feat : Ajout de zod, création d'un composant de chargement loading-dots.vue et finalisation du flow d'une reception

frontend/pages/reception/[[id]].vue

@@ -1,42 +1,36 @@
 <template>
     <div v-if="errorMessage" class="text-red-600">{{ errorMessage }}</div>
-    <div v-if="isLoading" class="text-neutral-600">Chargement...</div>
     <div v-else>
+        <div class="flex justify-between h-[52px] mb-[90px]">
+            <p class="self-center">Indicateur d’étapes</p>
+            <NuxtLink to="/" class="flex flex-col justify-center uppercase text-xl bg-black text-white h-[50px] w-[272px] text-center">Mettre en pause</NuxtLink>
+        </div>
         <ReceptionForm v-if="storeReception?.currentStep === 0"/>
-        <ReceptionWeight v-if="storeReception?.currentStep === 1"/>
-        <div v-if="storeReception?.currentStep === 2">Décharger</div>
-        <ReceptionWeight v-if="storeReception?.currentStep === 3"/>
+        <ReceptionWeight v-if="storeReception?.currentStep === 1" mode="gross"/>
+        <ReceptionUnloading v-if="storeReception?.currentStep === 2"/>
+        <ReceptionWeight v-if="storeReception?.currentStep === 3" mode="tare"/>
     </div>
 </template>
 
 <script setup lang="ts">
-import { createReception, getReception } from '~/services/reception'
-import type { ReceptionData } from '~/services/dto/reception-data'
 import { useReceptionStore } from '~/stores/reception'
 import { storeToRefs } from 'pinia'
 
 const route = useRoute()
 const router = useRouter()
 
-const isLoading = ref<boolean>(false)
-const errorMessage = ref<string | null>(null)
 const receptionStore = useReceptionStore()
-const { current: storeReception } = storeToRefs(receptionStore)
+const { current: storeReception, isLoading, errorMessage } = storeToRefs(receptionStore)
 
 onMounted(async () => {
-    isLoading.value = true
     const raw = route.params.id
     const idStr = Array.isArray(raw) ? raw[0] : raw
     const id = idStr ? Number(idStr) : null
 
-    try {
-        const result = id === null ? await createReception() : await getReception(id)
-        if (result) {
-            receptionStore.setCurrent(result as ReceptionData)
-        }
-    } catch (error) {
-        errorMessage.value = error.error ?? 'Erreur inconnue.'
+    if (id === null) {
+        await receptionStore.createReception()
+    } else {
+        await receptionStore.loadReception(id)
     }
-    isLoading.value = false
 })
 </script>