From fbd5f795f9930fa599f0b30277795e222caba383 Mon Sep 17 00:00:00 2001
From: sroy <sebastien@yuno.malio.fr>
Date: Tue, 10 Feb 2026 11:54:31 +0100
Subject: [PATCH 1/5] feat : finalisation de la partie 1 modification d une
 reception terminee

---
 frontend/pages/reception/finish-reception.vue |   5 +
 frontend/pages/reception/update/[[id]].vue    | 531 ++++++++++++++++++
 src/Entity/Carrier.php                        |   2 +
 3 files changed, 538 insertions(+)
 create mode 100644 frontend/pages/reception/update/[[id]].vue

diff --git a/frontend/pages/reception/finish-reception.vue b/frontend/pages/reception/finish-reception.vue
index 63fbc20..ef1be1c 100644
--- a/frontend/pages/reception/finish-reception.vue
+++ b/frontend/pages/reception/finish-reception.vue
@@ -20,6 +20,7 @@
                 class="grid grid-cols-6 gap-4 px-4 py-3 text-sm hover:bg-slate-50 cursor-pointer border-t border-slate-200"
                 role="button"
                 tabindex="0"
+                @click="goToReception(reception.id)"
             >
                 <div>{{ reception.identificationNumber}}</div>
                 <div>{{ reception.receptionDate}}</div>
@@ -47,6 +48,10 @@ const formatWeighing = (reception: ReceptionData, type: 'gross' | 'tare') => {
     return `${entry.weight} kg`
 }
 
+const goToReception = (id: number) => {
+    router.push(`/reception/update/${id}`)
+}
+
 onMounted(async () => {
     receptionList.value = await getReceptionList(true)
 })
diff --git a/frontend/pages/reception/update/[[id]].vue b/frontend/pages/reception/update/[[id]].vue
new file mode 100644
index 0000000..b713e19
--- /dev/null
+++ b/frontend/pages/reception/update/[[id]].vue
@@ -0,0 +1,531 @@
+<template>
+
+    <form @submit.prevent="validate">
+        <div class="flex items-center justify-between mt-8 mb-8 ">
+        <h1 class="font-bold text-5xl uppercase">Réception {{receptionLoad?.identificationNumber}}</h1>
+        <button
+            type="submit"
+            class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] justify-self-end"
+        >Enregistrer
+        </button>
+        </div>
+        <div class="grid grid-cols-2 items-start gap-y-8 gap-x-40 mb-16">
+            <!--    Nom de l'utilisateur       -->
+            <UiSelect
+                id="reception-user"
+                :disabled="!auth.isAdmin"
+                v-model="form.userId"
+                label="Nom de l'utilisateur"
+                :options="users.map((user) => ({
+                    value: String(user.id),
+                    label: user.username
+                }))"
+                :loading="isLoadingUsers"
+                wrapper-class="col-start-1 row-start-1"
+            />
+            <!--    Date de réception        -->
+            <UiDateInput
+                id="reception-date"
+                :disabled="!auth.isAdmin"
+                v-model="form.receptionDate"
+                label="Date de réception"
+                wrapper-class="col-start-1 row-start-2"
+            />
+            <!--    Fournisseur        -->
+            <UiSelect
+                id="reception-supplier"
+                v-model="form.supplierId"
+                :disabled="!auth.isAdmin"
+                label="Fournisseur"
+                :options="suppliers.map((supplier) => ({
+                    value: String(supplier.id),
+                    label: supplier.name
+                }))"
+                :loading="isLoadingSuppliers"
+                wrapper-class="col-start-1 row-start-3"
+            />
+            <!--    Adresse fournisseur        -->
+            <UiSelect
+                id="reception-address"
+                v-model="form.addressId"
+                label="Adresse"
+                :options="supplierAddresses.map((address) => ({
+                    value: String(address.id),
+                    label: address.fullAddress
+                }))"
+                :disabled="(isLoadingSuppliers || supplierAddresses.length === 0) && !auth.isAdmin"
+                wrapper-class="col-start-1 row-start-4"
+            />
+            <!--    Camion        -->
+            <UiSelect
+                id="reception-truck"
+                v-model="form.truckId"
+                :disabled="!auth.isAdmin"
+                label="Camion"
+                :options="trucks.map((truck) => ({
+                    value: String(truck.id),
+                    label: truck.name
+                }))"
+                :loading="isLoadingTrucks"
+                wrapper-class="col-start-2 row-start-1"
+            />
+            <!--    Transporteur        -->
+            <UiSelect
+                id="reception-carrier"
+                v-model="form.carrierId"
+                label="Transporteur"
+                :disabled="!auth.isAdmin"
+                :options="carriers.map((carrier) => ({
+                    value: String(carrier.id),
+                    label: carrier.name
+                }))"
+                :loading="isLoadingCarriers"
+                select-class="h-[34px]"
+                wrapper-class="col-start-2 row-start-2"
+            />
+            <!--    Chauffeur (LIOT)        -->
+            <UiSelect
+                id="reception-driver"
+                v-model="form.driverId"
+                :disabled="!auth.isAdmin"
+                label="Nom du chauffeur si LIOT"
+                :options="filteredDrivers.map((driver) => ({
+                    value: String(driver.id),
+                    label: driver.name
+                }))"
+                :loading="isLoadingDrivers"
+                wrapper-class="col-start-2 row-start-3"
+            />
+            <!--    Plaque d'immatriculation       -->
+            <div v-if="!isLiotCarrier" class="col-start-2 row-start-4">
+                <UiLicensePlateInput
+                    :disabled="!auth.isAdmin"
+                    v-model="form.licensePlate"
+                    v-model:allowAny="allowAnyLicensePlate"
+                />
+            </div>
+            <!--    Immatriculation (LIOT)        -->
+            <UiSelect
+                v-if="isLiotCarrier"
+                id="reception-vehicle"
+                v-model="form.vehicleId"
+                label="Immatriculation"
+                :options="filteredVehicles.map((vehicle) => ({
+                    value: String(vehicle.id),
+                    label: vehicle.plate
+                }))"
+                :loading="isLoadingVehicles"
+                :disabled="(isLoadingVehicles || filteredVehicles.length === 0) && !auth.isAdmin"
+                wrapper-class="col-start-2 row-start-4"
+            />
+        </div>
+    </form>
+</template>
+
+<script setup lang="ts">
+import {useReceptionStore} from '~/stores/reception'
+import type {ReceptionTypeData} from '~/services/dto/reception-type-data'
+import type {UserData} from '~/services/dto/user-data'
+import {getUsers} from '~/services/auth'
+import {useAuthStore} from '~/stores/auth'
+import type {SupplierData} from '~/services/dto/supplier-data'
+import {getSupplierList} from '~/services/supplier'
+import type {TruckData} from '~/services/dto/truck-data'
+import {getTruckList} from '~/services/truck'
+import type {CarrierData} from '~/services/dto/carrier-data'
+import {getCarrier, getCarrierList} from '~/services/carrier'
+import type {DriverData} from '~/services/dto/driver-data'
+import {getDriverList} from '~/services/driver'
+import type {VehicleData} from '~/services/dto/vehicle-data'
+import {getVehicleList} from '~/services/vehicle'
+import {SUPLLIER_CODE} from "~/utils/constants";
+import {deleteReceptionBovine, getReceptionBovineList} from "~/services/reception-bovine";
+import type {ReceptionData} from "~/services/dto/reception-data";
+import {getReception} from "~/services/reception";
+
+type ReceptionFormData = {
+    licensePlate: string
+    receptionDate: string
+    receptionTypeId: string
+    userId: string
+    supplierId: string
+    addressId: string
+    truckId: string
+    carrierId: string
+    driverId: string
+    vehicleId: string
+}
+
+const router = useRouter()
+const receptionStore = useReceptionStore()
+const form = reactive<ReceptionFormData>({
+    licensePlate: '',
+    receptionDate: new Date().toISOString().slice(0, 10),
+    receptionTypeId: '',
+    userId: '',
+    supplierId: '',
+    addressId: '',
+    truckId: '',
+    carrierId: '',
+    driverId: '',
+    vehicleId: ''
+})
+const allowAnyLicensePlate = ref(false)
+const isLoading = ref(false)
+const users = ref<UserData[]>([])
+const isLoadingUsers = ref(false)
+const suppliers = ref<SupplierData[]>([])
+const isLoadingSuppliers = ref(false)
+const trucks = ref<TruckData[]>([])
+const isLoadingTrucks = ref(false)
+const carriers = ref<CarrierData[]>([])
+const isLoadingCarriers = ref(false)
+const drivers = ref<DriverData[]>([])
+const isLoadingDrivers = ref(false)
+const vehicles = ref<VehicleData[]>([])
+const isLoadingVehicles = ref(false)
+const authStore = useAuthStore()
+// Empêche les watchers de reset des champs pendant le remplissage initial
+const isHydrating = ref(false)
+const route = useRoute()
+const idReception = Number(route.params.id)
+const receptionLoad = await getReception(idReception)
+const receptionType = receptionLoad.receptionType
+const auth = useAuthStore()
+
+// Transporteur sélectionné dans le formulaire
+const selectedCarrier = computed(() =>
+    carriers.value.find((carrier) => String(carrier.id) === form.carrierId) ?? null
+)
+// Indique si le transporteur est LIOT
+const isLiotCarrier = computed(() => selectedCarrier.value?.code === SUPLLIER_CODE.LIOT)
+// Adresses disponibles pour le fournisseur sélectionné
+const supplierAddresses = computed(() => {
+    const supplierId = Number(form.supplierId)
+    if (!Number.isFinite(supplierId)) {
+        return []
+    }
+    return suppliers.value.find((supplier) => supplier.id === supplierId)?.addresses ?? []
+})
+// Chauffeurs filtrés par transporteur (LIOT)
+const filteredDrivers = computed<DriverData[]>(() => {
+    if (!form.carrierId) {
+        return []
+    }
+    return drivers.value.filter((driver) => String(driver.carrier?.id) === form.carrierId)
+})
+// Véhicules filtrés par transporteur + type de camion
+const filteredVehicles = computed<VehicleData[]>(() => {
+    if (!form.carrierId) {
+        return []
+    }
+    return vehicles.value.filter(
+        (vehicle) =>
+            String(vehicle.carrier?.id) === form.carrierId &&
+            (!form.truckId || String(vehicle.truck?.id) === form.truckId)
+    )
+})
+
+// Supprime les données bovines si on change de type de réception
+const clearReceptionBovines = async (receptionIri: string) => {
+    const existing = await getReceptionBovineList(receptionIri)
+    for (const selection of existing) {
+        await deleteReceptionBovine(selection.id)
+    }
+}
+
+const hydrateFromUser = (reception: ReceptionData | null)=> {
+    if (!reception) {
+        return
+    }
+    isHydrating.value = true
+    form.licensePlate = reception?.licensePlate ?? ''
+    form.receptionDate = reception?.receptionDate ?? new Date().toISOString().slice(0, 10)
+    form.userId = reception?.user?.id
+        ? String(reception.user.id)
+        : form.userId
+    form.supplierId = reception?.supplier?.id
+        ? String(reception.supplier.id)
+        : ''
+    form.addressId = reception?.address?.id
+        ? String(reception.address.id)
+        : ''
+    form.truckId = reception?.truck?.id
+        ? String(reception.truck.id)
+        : ''
+    form.carrierId = reception?.carrier?.id
+        ? String(reception.carrier.id)
+        : ''
+    form.driverId = reception?.driver?.id
+        ? String(reception.driver.id)
+        : ''
+    isHydrating.value = false
+}
+
+watch(
+    () => idReception,
+    async (id) => {
+        if (id === null) {
+            return
+        }
+        isLoading.value = true
+        try {
+            const user = await getReception(id)
+            hydrateFromUser(user)
+        } finally {
+            isLoading.value = false
+        }
+    },
+    {immediate: true}
+)
+
+// Charge la liste des users pour le select
+const loadUsers = async () => {
+    isLoadingUsers.value = true
+    try {
+        users.value = await getUsers()
+    } finally {
+        isLoadingUsers.value = false
+    }
+}
+
+// Charge la liste des fournisseurs pour le select
+const loadSuppliers = async () => {
+    isLoadingSuppliers.value = true
+    try {
+        suppliers.value = await getSupplierList()
+    } finally {
+        isLoadingSuppliers.value = false
+    }
+}
+
+// Charge la liste des camions pour le select
+const loadTrucks = async () => {
+    isLoadingTrucks.value = true
+    try {
+        trucks.value = await getTruckList()
+    } finally {
+        isLoadingTrucks.value = false
+    }
+}
+
+// Charge la liste des transporteurs pour le select
+const loadCarriers = async () => {
+    isLoadingCarriers.value = true
+    try {
+        carriers.value = await getCarrierList()
+    } finally {
+        isLoadingCarriers.value = false
+    }
+}
+
+// Charge la liste des chauffeurs pour le select
+const loadDrivers = async () => {
+    isLoadingDrivers.value = true
+    try {
+        drivers.value = await getDriverList()
+    } finally {
+        isLoadingDrivers.value = false
+    }
+}
+
+// Charge la liste des véhicules pour le select
+const loadVehicles = async () => {
+    isLoadingVehicles.value = true
+    try {
+        vehicles.value = await getVehicleList()
+    } finally {
+        isLoadingVehicles.value = false
+    }
+}
+
+// On met le user connecté par défaut dans le select
+const setDefaultUser = () => {
+    if (form.userId) {
+        return
+    }
+    if (authStore.user?.id) {
+        form.userId = String(authStore.user.id)
+    }
+}
+
+// On récupère toutes les données des selects au chargement du composant
+onMounted(async () => {
+    await loadUsers()
+    await loadSuppliers()
+    await loadTrucks()
+    await loadCarriers()
+    await loadDrivers()
+    await loadVehicles()
+    await authStore.ensureSession()
+    setDefaultUser()
+})
+
+// Ajuste driver/vehicle quand le transporteur change (logique LIOT)
+watch(
+    () => [form.supplierId, suppliers.value],
+    () => {
+        if (!form.supplierId) {
+            form.addressId = ''
+            return
+        }
+        if (!form.addressId && supplierAddresses.value.length === 1) {
+            form.addressId = String(supplierAddresses.value[0].id)
+            return
+        }
+        if (!form.addressId) {
+            return
+        }
+        const matches = supplierAddresses.value.some(
+            (address) => String(address.id) === form.addressId
+        )
+        if (!matches) {
+            form.addressId = ''
+        }
+    },
+    {immediate: true}
+)
+
+// Valide/auto-sélectionne le véhicule selon camion + transporteur (LIOT)
+watch(
+    () => form.carrierId,
+    () => {
+        if (isHydrating.value) {
+            return
+        }
+        if (!form.carrierId && idReception == null) {
+            form.driverId = ''
+            form.vehicleId = ''
+            return
+        }
+        if (!isLiotCarrier.value && idReception == null) {
+            form.driverId = ''
+            form.vehicleId = ''
+            return
+        }
+        if (filteredDrivers.value.length === 1) {
+            form.driverId = String(filteredDrivers.value[0].id)
+        }
+        if (filteredVehicles.value.length === 1) {
+            form.vehicleId = String(filteredVehicles.value[0].id)
+        }
+    },
+    {immediate: true}
+)
+
+// Récupère la plaque depuis le véhicule choisi (LIOT)
+watch(
+    () => [form.truckId, form.carrierId, vehicles.value],
+    () => {
+        if (!isLiotCarrier.value) {
+            return
+        }
+        if (filteredVehicles.value.length === 1) {
+            form.vehicleId = String(filteredVehicles.value[0].id)
+            return
+        }
+        if (!form.vehicleId) {
+            return
+        }
+        const matches = filteredVehicles.value.some(
+            (vehicle) => String(vehicle.id) === form.vehicleId
+        )
+        if (!matches) {
+            form.vehicleId = ''
+        }
+    },
+    {immediate: true}
+)
+
+// Auto-renseigne le véhicule si la plaque correspond (LIOT)
+watch(
+    () => [form.vehicleId, form.carrierId, vehicles.value],
+    () => {
+        if (!isLiotCarrier.value) {
+            return
+        }
+        if (isHydrating.value) {
+            return
+        }
+        const selected = filteredVehicles.value.find(
+            (vehicle) => String(vehicle.id) === form.vehicleId
+        )
+        if (selected) {
+            form.licensePlate = selected.plate
+            allowAnyLicensePlate.value = false
+        }
+    }
+)
+
+watch(
+    () => [form.licensePlate, form.carrierId, vehicles.value],
+    () => {
+        if (!isLiotCarrier.value || form.vehicleId) {
+            return
+        }
+        const match = filteredVehicles.value.find(
+            (vehicle) => vehicle.plate === form.licensePlate
+        )
+        if (match) {
+            form.vehicleId = String(match.id)
+        }
+    }
+)
+
+// Valide le formulaire et crée/met à jour la réception
+async function validate() {
+    const normalizedLicensePlate = form.licensePlate.trim()
+    const normalizedReceptionDate = form.receptionDate.trim()
+    const normalizedUserId = form.userId.trim()
+    const normalizedSupplierId = form.supplierId.trim()
+    const normalizedAddressId = form.addressId.trim()
+    const normalizedTruckId = form.truckId.trim()
+    const normalizedCarrierId = form.carrierId.trim()
+    const normalizedDriverId = form.driverId.trim()
+    const userIri = normalizedUserId
+        ? `/api/users/${normalizedUserId}`
+        : null
+    const supplierIri = normalizedSupplierId
+        ? `/api/suppliers/${normalizedSupplierId}`
+        : null
+    const addressIri = normalizedAddressId
+        ? `/api/addresses/${normalizedAddressId}`
+        : null
+    const truckIri = normalizedTruckId
+        ? `/api/trucks/${normalizedTruckId}`
+        : null
+    const carrierIri = normalizedCarrierId
+        ? `/api/carriers/${normalizedCarrierId}`
+        : null
+    const driverIri = normalizedDriverId
+        ? `/api/drivers/${normalizedDriverId}`
+        : null
+
+    const basePayload = {
+        licensePlate: normalizedLicensePlate,
+        receptionDate: normalizedReceptionDate,
+        user: userIri,
+        supplier: supplierIri,
+        address: addressIri,
+        truck: truckIri,
+        carrier: carrierIri
+    }
+
+    const payload = {
+        ...basePayload,
+        ...(isLiotCarrier.value && driverIri ? {driver: driverIri} : {})
+    }
+
+    if (idReception) {
+        const updated = await receptionStore.updateReception(idReception,{
+            ...payload
+        })
+        if (updated) {
+            await router.push(`/reception/update/${updated.id}`)
+        }
+        router.push("/reception/finish-reception")
+        return
+    }
+}
+
+</script>
diff --git a/src/Entity/Carrier.php b/src/Entity/Carrier.php
index b0fa17f..048fd51 100644
--- a/src/Entity/Carrier.php
+++ b/src/Entity/Carrier.php
@@ -26,11 +26,13 @@ use Symfony\Component\Serializer\Attribute\Groups;
         new Post(
             normalizationContext: ['groups' => ['carrier:read']],
             denormalizationContext: ['groups' => ['carrier:write']],
+            security: "is_granted('ROLE_ADMIN')"
         ),
         new Patch(
             requirements: ['id' => '\d+'],
             normalizationContext: ['groups' => ['carrier:read']],
             denormalizationContext: ['groups' => ['carrier:write']],
+            security: "is_granted('ROLE_ADMIN')"
         ),
     ],
     security: "is_granted('ROLE_USER')",
-- 
2.39.5


From 71ec442bc2f20b8e8523285190869d0e5f913fa2 Mon Sep 17 00:00:00 2001
From: sroy <sebastien@yuno.malio.fr>
Date: Tue, 10 Feb 2026 11:56:18 +0100
Subject: [PATCH 2/5] feat : update changelog

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5902764..308b37e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -33,6 +33,7 @@ Ajouter dans le fichier .env du frontend
 * [#312] Creation administration listing fournisseurs
 * [#315] Creation page admin utilisateur
 * [#317] Admin modification creation transporteur
+* [#318] Affichage modification reception terminée
 
 ### Changed
 
-- 
2.39.5


From f12f56cb435ac6a463b73e3cd0d0af84e34cbd8a Mon Sep 17 00:00:00 2001
From: sroy <sebastien@yuno.malio.fr>
Date: Tue, 10 Feb 2026 12:04:06 +0100
Subject: [PATCH 3/5] feat : update changelog

---
 .../components/reception/reception-form.vue   | 14 +-------------
 frontend/pages/reception/update/[[id]].vue    | 19 +++----------------
 frontend/services/dto/reception-data.ts       | 13 +++++++++++++
 3 files changed, 17 insertions(+), 29 deletions(-)

diff --git a/frontend/components/reception/reception-form.vue b/frontend/components/reception/reception-form.vue
index 393de8f..063a363 100644
--- a/frontend/components/reception/reception-form.vue
+++ b/frontend/components/reception/reception-form.vue
@@ -144,19 +144,7 @@ import type {VehicleData} from '~/services/dto/vehicle-data'
 import {getVehicleList} from '~/services/vehicle'
 import {RECEPTION_TYPE_CODES, SUPLLIER_CODE} from "~/utils/constants";
 import {deleteReceptionBovine, getReceptionBovineList} from "~/services/reception-bovine";
-
-type ReceptionFormData = {
-    licensePlate: string
-    receptionDate: string
-    receptionTypeId: string
-    userId: string
-    supplierId: string
-    addressId: string
-    truckId: string
-    carrierId: string
-    driverId: string
-    vehicleId: string
-}
+import type {ReceptionFormData} from "~/services/dto/reception-data";
 
 const router = useRouter()
 const receptionStore = useReceptionStore()
diff --git a/frontend/pages/reception/update/[[id]].vue b/frontend/pages/reception/update/[[id]].vue
index b713e19..e5b28a7 100644
--- a/frontend/pages/reception/update/[[id]].vue
+++ b/frontend/pages/reception/update/[[id]].vue
@@ -124,7 +124,6 @@
 
 <script setup lang="ts">
 import {useReceptionStore} from '~/stores/reception'
-import type {ReceptionTypeData} from '~/services/dto/reception-type-data'
 import type {UserData} from '~/services/dto/user-data'
 import {getUsers} from '~/services/auth'
 import {useAuthStore} from '~/stores/auth'
@@ -133,29 +132,16 @@ import {getSupplierList} from '~/services/supplier'
 import type {TruckData} from '~/services/dto/truck-data'
 import {getTruckList} from '~/services/truck'
 import type {CarrierData} from '~/services/dto/carrier-data'
-import {getCarrier, getCarrierList} from '~/services/carrier'
+import {getCarrierList} from '~/services/carrier'
 import type {DriverData} from '~/services/dto/driver-data'
 import {getDriverList} from '~/services/driver'
 import type {VehicleData} from '~/services/dto/vehicle-data'
 import {getVehicleList} from '~/services/vehicle'
 import {SUPLLIER_CODE} from "~/utils/constants";
 import {deleteReceptionBovine, getReceptionBovineList} from "~/services/reception-bovine";
-import type {ReceptionData} from "~/services/dto/reception-data";
+import type {ReceptionData, ReceptionFormData} from "~/services/dto/reception-data";
 import {getReception} from "~/services/reception";
 
-type ReceptionFormData = {
-    licensePlate: string
-    receptionDate: string
-    receptionTypeId: string
-    userId: string
-    supplierId: string
-    addressId: string
-    truckId: string
-    carrierId: string
-    driverId: string
-    vehicleId: string
-}
-
 const router = useRouter()
 const receptionStore = useReceptionStore()
 const form = reactive<ReceptionFormData>({
@@ -185,6 +171,7 @@ const isLoadingDrivers = ref(false)
 const vehicles = ref<VehicleData[]>([])
 const isLoadingVehicles = ref(false)
 const authStore = useAuthStore()
+
 // Empêche les watchers de reset des champs pendant le remplissage initial
 const isHydrating = ref(false)
 const route = useRoute()
diff --git a/frontend/services/dto/reception-data.ts b/frontend/services/dto/reception-data.ts
index f1fe901..2ed9a77 100644
--- a/frontend/services/dto/reception-data.ts
+++ b/frontend/services/dto/reception-data.ts
@@ -59,3 +59,16 @@ export type ReceptionPayload = {
     carrier?: string | null
     driver?: string | null
 }
+
+export type ReceptionFormData = {
+    licensePlate: string
+    receptionDate: string
+    receptionTypeId: string
+    userId: string
+    supplierId: string
+    addressId: string
+    truckId: string
+    carrierId: string
+    driverId: string
+    vehicleId: string
+}
-- 
2.39.5


From df12cce54cf6a2fe3dcd9a82df22d7a2bd0ccdf9 Mon Sep 17 00:00:00 2001
From: sroy <sebastien@yuno.malio.fr>
Date: Tue, 10 Feb 2026 16:01:40 +0100
Subject: [PATCH 4/5] feat : sauvegarde01 partie 2

---
 .../components/reception/reception-form.vue   |  1 +
 .../components/reception/update-weight.vue    | 67 +++++++++++++++++++
 frontend/i18n/locales/fr.json                 |  8 ++-
 frontend/pages/admin/carrier/[[id]].vue       |  1 -
 frontend/pages/reception/update/[[id]].vue    |  8 +++
 frontend/services/dto/reception-data.ts       | 19 ++++++
 frontend/services/weight.ts                   |  5 +-
 7 files changed, 106 insertions(+), 3 deletions(-)
 create mode 100644 frontend/components/reception/update-weight.vue

diff --git a/frontend/components/reception/reception-form.vue b/frontend/components/reception/reception-form.vue
index 063a363..d5bee42 100644
--- a/frontend/components/reception/reception-form.vue
+++ b/frontend/components/reception/reception-form.vue
@@ -123,6 +123,7 @@
             </button>
         </div>
     </form>
+
 </template>
 
 <script setup lang="ts">
diff --git a/frontend/components/reception/update-weight.vue b/frontend/components/reception/update-weight.vue
new file mode 100644
index 0000000..b4e2b65
--- /dev/null
+++ b/frontend/components/reception/update-weight.vue
@@ -0,0 +1,67 @@
+<template>
+    <form @submit.prevent="validate">
+        <div class="grid grid-cols-2 gap-x-40 gap-y-8 mb-16">
+            <UiNumberInput
+                label="Pesée à vide"
+                v-model="form.weights[0].weight"
+                :min="0"
+            />
+
+            <UiNumberInput
+                label="Pesée à plein"
+                v-model="form.weights[1].weight"
+                :min="0"
+            />
+        </div>
+
+        <button
+            type="submit"
+            class="bg-primary-500 text-white px-6 py-3 rounded-md"
+        >
+            Enregistrer
+        </button>
+    </form>
+</template>
+
+<script setup lang="ts">
+import type {ReceptionFormWeight, ReceptionUpdatePayload} from '~/services/dto/reception-data'
+import { getReception } from '~/services/reception'
+import { useReceptionStore } from '~/stores/reception'
+import {updateWeight} from "~/services/weight";
+
+const props = defineProps<{
+    idReception: number
+}>()
+
+const receptionStore = useReceptionStore()
+const router = useRouter()
+
+const form = reactive({
+    weights: [
+        { id: 0, type: 'tare' as const, weight: 0 },
+        { id: 0, type: 'gross' as const, weight: 0 }
+    ]
+})
+
+const hydrateFromReception = (reception: ReceptionFormWeight) => {
+    const tare = reception.weights.find(weight => weight.type === 'tare')
+    const gross = reception.weights.find(weight => weight.type === 'gross')
+
+    if (tare) form.weights[0] = { ...tare }
+    if (gross) form.weights[1] = { ...gross }
+}
+
+onMounted(async () => {
+    const reception = await getReception(props.idReception)
+    hydrateFromReception(reception)
+})
+
+async function validate() {
+
+    for (const weight of form.weights) {
+        if (weight.id) {
+            await updateWeight(weight.id, {weight: weight.weight})
+        }
+    }
+}
+</script>
diff --git a/frontend/i18n/locales/fr.json b/frontend/i18n/locales/fr.json
index 4ea1b99..2150e3e 100644
--- a/frontend/i18n/locales/fr.json
+++ b/frontend/i18n/locales/fr.json
@@ -12,7 +12,10 @@
             "fetch": "Impossible de récupérer la réception.",
             "create": "Impossible de créer la réception.",
             "update": "Impossible de mettre à jour la réception.",
-            "weigh": "Impossible de récupérer la pesée."
+            "weight": "Impossible de récupérer la pesée."
+        },
+        "weight": {
+            "update": "Impossible de mettre à jour la pesée"
         },
         "receptionType": {
             "list": "Impossible de récupérer la liste des types de réception."
@@ -79,6 +82,9 @@
         "carrier": {
             "update": "Transporteur mis à jour",
             "create": "Transporteur créé"
+        },
+        "weight": {
+            "update": "Pesée mis à jour"
         }
     }
 }
diff --git a/frontend/pages/admin/carrier/[[id]].vue b/frontend/pages/admin/carrier/[[id]].vue
index 702a3f7..350c627 100644
--- a/frontend/pages/admin/carrier/[[id]].vue
+++ b/frontend/pages/admin/carrier/[[id]].vue
@@ -14,7 +14,6 @@
     </div>
 
     <div class="grid grid-cols-2 items-start gap-y-8 gap-x-40 mb-16">
-
         <UiTextInput
             label = "nom du fournisseur"
             id="carrier-name"
diff --git a/frontend/pages/reception/update/[[id]].vue b/frontend/pages/reception/update/[[id]].vue
index e5b28a7..2066cba 100644
--- a/frontend/pages/reception/update/[[id]].vue
+++ b/frontend/pages/reception/update/[[id]].vue
@@ -119,6 +119,13 @@
                 wrapper-class="col-start-2 row-start-4"
             />
         </div>
+        <div class="grid grid-cols-2 items-start gap-y-8 gap-x-40 mb-16">
+        <h1 class="font-bold text-5xl uppercase col-start-1 row-start-1">pesée</h1>
+        <h1 class="font-bold text-5xl uppercase col-start-2 row-start-1">marchandise</h1>
+        </div>
+        <update-weight
+            :idReception="idReception"
+        />
     </form>
 </template>
 
@@ -141,6 +148,7 @@ import {SUPLLIER_CODE} from "~/utils/constants";
 import {deleteReceptionBovine, getReceptionBovineList} from "~/services/reception-bovine";
 import type {ReceptionData, ReceptionFormData} from "~/services/dto/reception-data";
 import {getReception} from "~/services/reception";
+import UpdateWeight from "~/components/reception/update-weight.vue";
 
 const router = useRouter()
 const receptionStore = useReceptionStore()
diff --git a/frontend/services/dto/reception-data.ts b/frontend/services/dto/reception-data.ts
index 2ed9a77..b81bfe9 100644
--- a/frontend/services/dto/reception-data.ts
+++ b/frontend/services/dto/reception-data.ts
@@ -41,6 +41,14 @@ export interface WeightEntryData {
     weighedAt: string | null
 }
 
+export interface WeightFormData {
+    id: number
+    weight: number
+    type: 'gross' | 'tare'
+}
+
+
+
 export type ReceptionPayload = {
     licensePlate?: string | null
     receptionDate?: string
@@ -72,3 +80,14 @@ export type ReceptionFormData = {
     driverId: string
     vehicleId: string
 }
+
+export type ReceptionFormWeight = {
+    weights: WeightFormData[]
+}
+
+export interface ReceptionUpdatePayload {
+    weights: {
+        id: number
+        weight: number
+    }[]
+}
diff --git a/frontend/services/weight.ts b/frontend/services/weight.ts
index b8ba1f7..7d5414a 100644
--- a/frontend/services/weight.ts
+++ b/frontend/services/weight.ts
@@ -16,5 +16,8 @@ export async function createWeight(payload: WeightPayload) {
 
 export async function updateWeight(id: number, payload: Partial<WeightPayload>) {
     const api = useApi()
-    return api.patch<WeightEntryData>(`weights/${id}`, payload)
+    return api.patch<WeightEntryData>(`weights/${id}`, payload,{
+    toastErrorKey: 'errors.weight.update',
+    toastSuccessKey: 'success.weight.update'
+    })
 }
-- 
2.39.5


From 9afafb316b6e2f303844657b743a0d71e45968c3 Mon Sep 17 00:00:00 2001
From: sroy <sebastien@yuno.malio.fr>
Date: Wed, 11 Feb 2026 11:45:35 +0100
Subject: [PATCH 5/5] feat : finalisation de affichage et update reception
 terminee suite

---
 CHANGELOG.md                                  |   1 +
 .../components/reception/update-bovin.vue     | 183 +++++++++++++
 .../reception/update-merchandise.vue          | 257 ++++++++++++++++++
 .../components/reception/update-weight.vue    |  29 +-
 frontend/pages/reception/update/[[id]].vue    |  24 +-
 5 files changed, 481 insertions(+), 13 deletions(-)
 create mode 100644 frontend/components/reception/update-bovin.vue
 create mode 100644 frontend/components/reception/update-merchandise.vue

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 308b37e..4016f64 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -34,6 +34,7 @@ Ajouter dans le fichier .env du frontend
 * [#315] Creation page admin utilisateur
 * [#317] Admin modification creation transporteur
 * [#318] Affichage modification reception terminée
+* [#320] Affichage modification reception terminée suite
 
 ### Changed
 
diff --git a/frontend/components/reception/update-bovin.vue b/frontend/components/reception/update-bovin.vue
new file mode 100644
index 0000000..8c1fbce
--- /dev/null
+++ b/frontend/components/reception/update-bovin.vue
@@ -0,0 +1,183 @@
+<template>
+    <form @submit.prevent="validate">
+    <div
+        class="flex flex-col items-center gap-16">
+        <div
+            class="flex flex-row gap-6 items-center">
+            <div
+                v-for="type in bovineType"
+                :key="type.id"
+                class="flex flex-row mb-2 gap-6 ">
+                <UiNumberInput
+                    :label="type.label"
+                    :code="type.code"
+                    v-model="bovineQuantities[String(type.id)]"
+                    :disabled="!auth.isAdmin"
+                    :placeholder="0"
+                    :min="0"
+                    :max="10"
+                />
+            </div>
+            <div
+                class=" flex flex-row mb-2 gap-6">
+                <UiNumberInput
+                    label="Autres"
+                    v-model="otherQuantity"
+                    :disabled="!auth.isAdmin"
+                />
+            </div>
+        </div>
+        <button
+            type="submit"
+            class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+            :disabled="!auth.isAdmin"
+        >Valider
+        </button>
+    </div>
+    </form>
+</template>
+<script setup lang="ts">
+import type {BovineTypeData} from "~/services/dto/bovine-type-data";
+import {getBovineTypeList} from "~/services/bovine-type";
+import {
+    createReceptionBovine,
+    deleteReceptionBovine,
+    getReceptionBovineList,
+    updateReceptionBovine
+} from "~/services/reception-bovine";
+import {computed, onMounted, reactive, ref, watch} from "vue";
+import {getReception, updateReception} from "~/services/reception";
+const toast = useToast()
+const isLoadingBovineType = ref(false)
+const bovineType = ref<BovineTypeData[]>([])
+const bovineQuantities = reactive<Record<string, number | null>>({})
+const otherQuantity = ref<number | null>(0)
+const auth = useAuthStore()
+const props = defineProps<{
+    idReception: number
+}>()
+const receptionId = props.idReception
+const reception = await getReception(receptionId)
+
+const receptionIri = computed(() =>
+    receptionId ? `/api/receptions/${receptionId}` : null
+)
+const totalBovines = computed(() => {
+    const base = Object.values(bovineQuantities).reduce((sum, value) => {
+        return sum + (value ?? 0)
+    }, 0)
+    return base + (otherQuantity.value ?? 0)
+})
+
+const loadBovineType = async () => {
+    isLoadingBovineType.value = true
+    try {
+        bovineType.value = await getBovineTypeList()
+    } finally {
+        isLoadingBovineType.value = false
+    }
+}
+
+onMounted(async () => {
+    await loadBovineType()
+})
+
+watch(
+    () => receptionId,
+    async (id) => {
+        if (!id || !receptionIri.value) {
+            return
+        }
+
+        const selectionMap: Record<string, number | null> = {}
+        for (const type of bovineType.value) {
+            selectionMap[String(type.id)] = 0
+        }
+
+        const existing = await getReceptionBovineList(receptionIri.value)
+        for (const selection of existing) {
+            const bovineTypeId = String(selection.bovineType.id)
+            selectionMap[bovineTypeId] = selection.quantity ?? 0
+        }
+
+        for (const key of Object.keys(bovineQuantities)) {
+            delete bovineQuantities[key]
+        }
+        Object.assign(bovineQuantities, selectionMap)
+
+        const existingOther = await reception.bovineDetail
+        const parsedOther =
+            typeof existingOther === 'string' && existingOther.trim() !== ''
+                ? Number(existingOther)
+                : 0
+        otherQuantity.value = Number.isFinite(parsedOther) ? parsedOther : 0
+    },
+    {immediate: true}
+)
+
+async function syncBovineSelections(receptionIri: string) {
+    const existing = await getReceptionBovineList(receptionIri)
+    const existingMap = new Map<string, { id: number; quantity: number | null }>()
+
+    for (const selection of existing) {
+        const bovineTypeId = String(selection.bovineType.id)
+        existingMap.set(bovineTypeId, {
+            id: selection.id,
+            quantity: selection.quantity ?? 0
+        })
+    }
+
+    // Supprime les entrées supprimées ou modifiées
+    for (const [bovineTypeId, entry] of existingMap.entries()) {
+        const selectedQuantity = bovineQuantities[bovineTypeId] ?? 0
+        if (!selectedQuantity) {
+            await deleteReceptionBovine(entry.id)
+            existingMap.delete(bovineTypeId)
+            continue
+        }
+
+        if (selectedQuantity !== entry.quantity) {
+            await updateReceptionBovine(entry.id, {quantity: selectedQuantity})
+            existingMap.set(bovineTypeId, {
+                id: entry.id,
+                quantity: selectedQuantity
+            })
+        }
+    }
+
+    // Crée les entrées manquantes
+    for (const [bovineTypeId, quantity] of Object.entries(bovineQuantities)) {
+        if (!quantity) {
+            continue
+        }
+        if (existingMap.has(bovineTypeId)) {
+            // Déjà à jour
+            continue
+        }
+        await createReceptionBovine({
+            reception: receptionIri,
+            bovineType: `/api/bovine_types/${bovineTypeId}`,
+            quantity
+        })
+    }
+}
+
+async function validate() {
+    // @TODO Ajouter un composable pour le toaster qui gère les key i18n
+    if (totalBovines.value > 52) {
+        toast.error({
+            title: 'Erreur',
+            message: ('Le total des bovins ne peut pas dépasser 52.')
+        })
+        return
+    }
+
+    await syncBovineSelections(receptionIri.value)
+
+    await updateReception(receptionId, {
+        merchandiseType: null,
+        merchandiseDetail: null,
+        bovineDetail: otherQuantity.value ? String(otherQuantity.value) : null,
+    })
+}
+</script>
diff --git a/frontend/components/reception/update-merchandise.vue b/frontend/components/reception/update-merchandise.vue
new file mode 100644
index 0000000..e3c72a6
--- /dev/null
+++ b/frontend/components/reception/update-merchandise.vue
@@ -0,0 +1,257 @@
+<template>
+    <form @submit.prevent="validate">
+    <div class="flex flex-col items-center gap-16">
+        <div
+            class="flex flex-col gap-16 items-center w-full">
+            <UiTextInput
+                id="merchandise-type"
+                v-model="selectedMerchandiseTypeId"
+                label="Type de marchandises"
+                :value="reception.merchandiseType?.label"
+                wrapper-class="w-[550px]"
+                :disabled="true"
+            />
+            <div
+                v-if="merchandiseTypeId && isAutres"
+                class="flex flex-col w-full max-w-[550px]"
+            >
+                <UiTextInput
+                    id="merchandise-detail"
+                    :disabled="!auth.isAdmin"
+                    v-model="merchandiseDetail"
+                    label="Préciser"
+                    placeholder="Précisions complémentaires"
+                    :maxlength="255"
+                />
+            </div>
+
+            <div
+                v-if="merchandiseTypeId && !isGranule"
+                class="flex gap-4 w-[550px] justify-evenly"
+            >
+                <div
+                    v-for="building in buildings"
+                    :key="building.id"
+                >
+                    <UiCheckbox
+                        v-model="selectedBuildingIds"
+                        :value="String(building.id)"
+                        :label="building.label"
+                        :disabled="!auth.isAdmin"
+                        label-class="text-xl"
+                    />
+                </div>
+            </div>
+
+            <div
+                v-if="merchandiseTypeId && isGranule"
+                class="flex flex-col gap-10 w-full max-w-[1100px]"
+            >
+                <div class="grid grid-cols-1 gap-10 md:grid-cols-4">
+                    <div v-for="type in pelletTypes" :key="type.id" class="flex flex-col gap-4">
+                        <p class="font-bold uppercase">{{ type.label }}</p>
+                        <div
+                            v-for="building in buildings"
+                            :key="building.id"
+                            class="flex items-center gap-2 text-lg"
+                        >
+                            <UiCheckbox
+                                v-model="selectedPelletBuildingIds[String(type.id)]"
+                                :value="String(building.id)"
+                                :label="building.label"
+                                :disabled="!auth.isAdmin"
+                                label-class="text-lg"
+                            />
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <button
+            type="submit"
+            class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+            :disabled="!auth.isAdmin"
+        >Valider
+        </button>
+    </div>
+    </form>
+</template>
+
+<script setup lang="ts">
+import {computed, onMounted, ref} from 'vue'
+import {getBuildingList} from '~/services/building'
+import {getMerchandiseTypeList} from '~/services/merchandise-type'
+import type {MerchandiseTypeData} from '~/services/dto/merchandise-type-data'
+import type {BuildingData} from '~/services/dto/building-data'
+import type {PelletTypeData} from '~/services/dto/pellet-type-data'
+import {getPelletTypeList} from '~/services/pellet-type'
+import {
+    createReceptionPelletBuilding,
+    deleteReceptionPelletBuilding,
+    getReceptionPelletBuildingList
+} from '~/services/reception-pellet-building'
+import {MERCHANDISE_TYPE_CODES} from '~/utils/constants'
+import {getReception, updateReception} from "~/services/reception";
+
+const merchandiseTypes = ref<MerchandiseTypeData[]>([])
+const buildings = ref<BuildingData[]>([])
+const pelletTypes = ref<PelletTypeData[]>([])
+const selectedMerchandiseTypeId = ref('')
+const selectedBuildingIds = ref<string[]>([])
+const selectedPelletBuildingIds = ref<Record<string, string[]>>({})
+const merchandiseDetail = ref('')
+const auth = useAuthStore()
+const props = defineProps<{
+    idReception: number
+}>()
+const receptionId = props.idReception
+const reception = await getReception(receptionId)
+const merchandiseTypeId = await reception.receptionType?.id
+
+// Extrait l'ID d'une relation depuis un IRI ou un objet complet.
+const getRelationId = (value: unknown): string | null => {
+    if (!value) {
+        return null
+    }
+
+    if (typeof value === 'string') {
+        const match = value.match(/\/(\d+)$/)
+        return match ? match[1] : null
+    }
+
+    if (typeof value === 'object' && 'id' in value) {
+        const record = value as { id?: number | string }
+        if (typeof record.id === 'number') {
+            return String(record.id)
+        }
+        if (typeof record.id === 'string') {
+            return record.id
+        }
+    }
+
+    return null
+}
+
+// Type de marchandise sélectionné dans le select
+const selectedMerchandiseType = computed(() =>
+    merchandiseTypes.value.find((type) => String(type.id) === selectedMerchandiseTypeId.value)
+)
+// Indique si le type est "Granulé"
+const isGranule = computed(() => selectedMerchandiseType.value?.code === MERCHANDISE_TYPE_CODES.GRANULE)
+// Indique si le type est "Autres"
+const isAutres = computed(() => selectedMerchandiseType.value?.code === MERCHANDISE_TYPE_CODES.AUTRES)
+
+// Charge les référentiels et hydrate le formulaire depuis la réception
+onMounted(async () => {
+    const [merchandiseTypeList, buildingList, pelletTypeList] = await Promise.all([
+        getMerchandiseTypeList(),
+        getBuildingList(),
+        getPelletTypeList()
+    ])
+    merchandiseTypes.value = merchandiseTypeList
+    buildings.value = buildingList
+    pelletTypes.value = pelletTypeList
+
+    const currentId = reception.merchandiseType?.id
+    if (currentId) {
+        selectedMerchandiseTypeId.value = String(currentId)
+    }
+    merchandiseDetail.value = reception.merchandiseDetail ?? ''
+
+    selectedBuildingIds.value =
+        reception.buildings?.map((building) => String(building.id)) ?? []
+
+    const existingPelletSelections = reception.pelletBuildings ?? []
+    const selectionMap: Record<string, string[]> = {}
+    for (const selection of existingPelletSelections) {
+        // L'API peut renvoyer les relations comme IRI ou comme objets selon le contexte.
+        const pelletTypeId = getRelationId(selection.pelletType)
+        const buildingId = getRelationId(selection.building)
+        if (!pelletTypeId || !buildingId) {
+            continue
+        }
+        if (!selectionMap[pelletTypeId]) {
+            selectionMap[pelletTypeId] = []
+        }
+        selectionMap[pelletTypeId].push(buildingId)
+    }
+    for (const pelletType of pelletTypes.value) {
+        const key = String(pelletType.id)
+        if (!selectionMap[key]) {
+            selectionMap[key] = []
+        }
+    }
+    selectedPelletBuildingIds.value = selectionMap
+})
+// Enregistre les sélections et passe à l'étape suivante
+async function validate() {
+
+    const receptionIri = `/api/receptions/${reception.id}`
+
+    await updateReception(reception.id, {
+        merchandiseDetail: isAutres.value ? merchandiseDetail.value.trim() : null,
+        buildings: isGranule.value
+            ? []
+            : selectedBuildingIds.value.map((id) => `/api/buildings/${id}`),
+        bovineDetail: null,
+        bovinesTypes: null,
+    })
+
+    if (isGranule.value) {
+        await syncPelletSelections(receptionIri)
+    } else {
+        await clearPelletSelections(receptionIri)
+    }
+}
+
+// Supprime toutes les associations granulés/bâtiments existantes
+async function clearPelletSelections(receptionIri: string) {
+    const existing = await getReceptionPelletBuildingList(receptionIri)
+    for (const selection of existing) {
+        await deleteReceptionPelletBuilding(selection.id)
+    }
+}
+// Synchronise les associations granulés/bâtiments avec l'état du formulaire
+async function syncPelletSelections(receptionIri: string) {
+    const existing = await getReceptionPelletBuildingList(receptionIri)
+    const existingMap = new Map<string, number>()
+    for (const selection of existing) {
+        // Construit la table de correspondance avec des IDs normalisés pour éviter les doublons.
+        const pelletTypeId = getRelationId(selection.pelletType)
+        const buildingId = getRelationId(selection.building)
+        if (!pelletTypeId || !buildingId) {
+            continue
+        }
+        const key = `${pelletTypeId}:${buildingId}`
+        existingMap.set(key, selection.id)
+    }
+
+    const desiredEntries: Array<{ pelletTypeId: string; buildingId: string }> = []
+    for (const [pelletTypeId, buildingIds] of Object.entries(selectedPelletBuildingIds.value)) {
+        for (const buildingId of buildingIds) {
+            desiredEntries.push({pelletTypeId, buildingId})
+        }
+    }
+
+    const desiredKeys = new Set(desiredEntries.map(
+        (entry) => `${entry.pelletTypeId}:${entry.buildingId}`
+    ))
+
+    for (const [key, id] of existingMap.entries()) {
+        if (!desiredKeys.has(key)) {
+            await deleteReceptionPelletBuilding(id)
+        }
+    }
+
+    for (const entry of desiredEntries) {
+        const key = `${entry.pelletTypeId}:${entry.buildingId}`
+        if (!existingMap.has(key)) {
+            await createReceptionPelletBuilding({
+                reception: receptionIri,
+                pelletType: `/api/pellet_types/${entry.pelletTypeId}`,
+                building: `/api/buildings/${entry.buildingId}`
+            })
+        }
+    }
+}
+</script>
diff --git a/frontend/components/reception/update-weight.vue b/frontend/components/reception/update-weight.vue
index b4e2b65..2f97c5c 100644
--- a/frontend/components/reception/update-weight.vue
+++ b/frontend/components/reception/update-weight.vue
@@ -1,40 +1,47 @@
 <template>
     <form @submit.prevent="validate">
+
         <div class="grid grid-cols-2 gap-x-40 gap-y-8 mb-16">
             <UiNumberInput
                 label="Pesée à vide"
                 v-model="form.weights[0].weight"
+                :disabled="!auth.isAdmin"
                 :min="0"
             />
 
             <UiNumberInput
                 label="Pesée à plein"
                 v-model="form.weights[1].weight"
+                :disabled="!auth.isAdmin"
                 :min="0"
             />
         </div>
 
-        <button
-            type="submit"
-            class="bg-primary-500 text-white px-6 py-3 rounded-md"
-        >
-            Enregistrer
-        </button>
+        <div class="flex justify-center">
+            <button
+                type="submit"
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+                :disabled="!auth.isAdmin"
+            >
+                Valider
+            </button>
+        </div>
+
     </form>
 </template>
 
 <script setup lang="ts">
-import type {ReceptionFormWeight, ReceptionUpdatePayload} from '~/services/dto/reception-data'
+import type {ReceptionFormWeight} from '~/services/dto/reception-data'
 import { getReception } from '~/services/reception'
-import { useReceptionStore } from '~/stores/reception'
 import {updateWeight} from "~/services/weight";
+import {useAuthStore} from "~/stores/auth";
 
 const props = defineProps<{
     idReception: number
 }>()
 
-const receptionStore = useReceptionStore()
-const router = useRouter()
+const idReception = props.idReception
+const auth = useAuthStore()
 
 const form = reactive({
     weights: [
@@ -52,7 +59,7 @@ const hydrateFromReception = (reception: ReceptionFormWeight) => {
 }
 
 onMounted(async () => {
-    const reception = await getReception(props.idReception)
+    const reception = await getReception(idReception)
     hydrateFromReception(reception)
 })
 
diff --git a/frontend/pages/reception/update/[[id]].vue b/frontend/pages/reception/update/[[id]].vue
index 2066cba..a4fe8a2 100644
--- a/frontend/pages/reception/update/[[id]].vue
+++ b/frontend/pages/reception/update/[[id]].vue
@@ -6,6 +6,7 @@
         <button
             type="submit"
             class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] justify-self-end"
+            :disabled="!auth.isAdmin"
         >Enregistrer
         </button>
         </div>
@@ -120,12 +121,27 @@
             />
         </div>
         <div class="grid grid-cols-2 items-start gap-y-8 gap-x-40 mb-16">
-        <h1 class="font-bold text-5xl uppercase col-start-1 row-start-1">pesée</h1>
-        <h1 class="font-bold text-5xl uppercase col-start-2 row-start-1">marchandise</h1>
+        <h1 class="font-bold text-5xl uppercase col-start-1 row-start-1" @click="isBtWeight = true" >pesées</h1>
+        <h1 class="font-bold text-5xl uppercase col-start-2 row-start-1" @click="isBtWeight = false">{{isMerchandise ? "Marchandises" : "Bovins"}}</h1>
         </div>
         <update-weight
+            v-if="isBtWeight"
             :idReception="idReception"
+            :disabled="!auth.isAdmin"
         />
+
+        <update-merchandise
+            v-else-if="isMerchandise"
+            :idReception="idReception"
+            :disabled="!auth.isAdmin"
+        />
+
+        <update-bovin
+            v-else
+            :idReception="idReception"
+            :disabled="!auth.isAdmin"
+        />
+
     </form>
 </template>
 
@@ -149,6 +165,8 @@ import {deleteReceptionBovine, getReceptionBovineList} from "~/services/receptio
 import type {ReceptionData, ReceptionFormData} from "~/services/dto/reception-data";
 import {getReception} from "~/services/reception";
 import UpdateWeight from "~/components/reception/update-weight.vue";
+import UpdateMerchandise from "~/components/reception/update-merchandise.vue";
+import UpdateBovin from "~/components/reception/update-bovin.vue";
 
 const router = useRouter()
 const receptionStore = useReceptionStore()
@@ -187,6 +205,8 @@ const idReception = Number(route.params.id)
 const receptionLoad = await getReception(idReception)
 const receptionType = receptionLoad.receptionType
 const auth = useAuthStore()
+const isBtWeight = ref(true)
+const isMerchandise = ref(receptionType.code === 'MARCHANDISES')
 
 // Transporteur sélectionné dans le formulaire
 const selectedCarrier = computed(() =>
-- 
2.39.5