From 886b90215a97bf18c0615fb4c7abd112ccbbd92e Mon Sep 17 00:00:00 2001
From: kevin <kevin@yuno.malio.fr>
Date: Thu, 12 Feb 2026 08:58:29 +0100
Subject: [PATCH] feat : lister les expeditions terminees

---
 CHANGELOG.md                                |  1 +
 frontend/pages/index.vue                    |  2 +-
 frontend/pages/shipment/finish-shipment.vue | 81 +++++++++++++++++++++
 frontend/services/dto/shipment-data.ts      |  2 +
 4 files changed, 85 insertions(+), 1 deletion(-)
 create mode 100644 frontend/pages/shipment/finish-shipment.vue

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 02a1d49..4076aa1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -40,6 +40,7 @@ Ajouter dans le fichier .env du frontend
 * [#273] Créer une nouvelle expédition (étape 3)
 * [#256] Créer une nouvelle réception (étape 3 - bovin)
 * [#314] Création d'une page d'administration : listing des utilisateurs
+* [#276] Lister les expéditions terminées
 
 ### Changed
 
diff --git a/frontend/pages/index.vue b/frontend/pages/index.vue
index 52d3da7..6a06e55 100644
--- a/frontend/pages/index.vue
+++ b/frontend/pages/index.vue
@@ -9,7 +9,7 @@
         <card-link label="EXPÉDITIONS EN ATTENTE" link="/" iconName="mdi:truck-cargo-container" />
         <card-link label="CASES" link="/" iconName="mdi:cube-outline" />
         <card-link label="RÉCEPTIONS FINIES" link="/reception/finish-reception" iconName="mdi:truck-check-outline" />
-        <card-link label="EXPÉDITIONS FINIES" link="/" iconName="mdi:truck-delivery-outline" />
+        <card-link label="EXPÉDITIONS FINIES" link="/shipment/finish-shipment" iconName="mdi:truck-delivery-outline" />
         <card-link label="PASSEPORT DU BOVIN" link="/" iconName="mdi:cow" />
     </div>
 </template>
diff --git a/frontend/pages/shipment/finish-shipment.vue b/frontend/pages/shipment/finish-shipment.vue
new file mode 100644
index 0000000..59c340b
--- /dev/null
+++ b/frontend/pages/shipment/finish-shipment.vue
@@ -0,0 +1,81 @@
+<template>
+    <div class="flex items-center justify-start gap-10">
+        <Icon @click="router.push('/')" name="gg:arrow-left-o" style="color: black" size="44"/>
+        <h1 class="text-3xl font-bold uppercase">listes des expéditions finie</h1>
+    </div>
+
+    <div class="ps-20 ">
+        <div class="mt-6 border border-slate-200 mb-16 ">
+            <div class="grid grid-cols-6 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide">
+                <div>Numéro</div>
+                <div>Date</div>
+                <div>Client</div>
+                <div>Adresse</div>
+                <div>Type d'expéditon</div>
+                <div>Poids</div>
+            </div>
+            <div
+                v-for="shipment in shipmentList"
+                :key="shipment
+               .id"
+                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="goToshipment(shipment.id)"
+            >
+                <div>{{ shipment.identificationNumber }}</div>
+                <div>{{ shipment.shipmentDate }}</div>
+                <div>{{ shipment.customer?.label }}</div>
+                <div>{{ shipment.address?.fullAddress }}</div>
+                <div>
+                    <template v-if="formatBovinShipmentLines(shipment).length">
+                        <div
+                            v-for="(line, index) in formatBovinShipmentLines(shipment)"
+                            :key="index"
+                            class="leading-5"
+                        >
+                            {{ line }}
+                        </div>
+                    </template>
+                </div>
+                <div>{{ formatWeighing(shipment, 'gross') }} | {{ formatWeighing(shipment, 'tare') }}</div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import type {ShipmentData} from "~/services/dto/shipment-data";
+import {getShipmentList} from "~/services/shipment";
+
+const shipmentList = ref<ShipmentData[]>()
+const router = useRouter()
+
+const formatWeighing = (shipment: ShipmentData, type: 'gross' | 'tare') => {
+    const entry = shipment.weights?.find((weight) => weight.type === type)
+    if (!entry || entry.weight == null || entry.dsd == null) {
+        return '—'
+    }
+    return `${entry.weight} kg`
+}
+
+const formatBovinShipmentLines = (shipment: ShipmentData) => {
+    if (!shipment.bovinShipments?.length) {
+        return []
+    }
+    return shipment.bovinShipments.map((entry) => {
+        const label = typeof entry.shipmentType === 'string'
+            ? entry.shipmentType
+            : entry.shipmentType?.label
+        return `${label ?? '—'} : ${entry.nbBovinSend ?? '—'}`
+    })
+}
+
+const goToshipment = (id: number) => {
+    //router.push(`/shipment/update/${id}`)
+}
+
+onMounted(async () => {
+    shipmentList.value = await getShipmentList(true)
+})
+</script>
diff --git a/frontend/services/dto/shipment-data.ts b/frontend/services/dto/shipment-data.ts
index a78016a..8a5dbfd 100644
--- a/frontend/services/dto/shipment-data.ts
+++ b/frontend/services/dto/shipment-data.ts
@@ -1,6 +1,7 @@
 import type {CarrierData} from '~/services/dto/carrier-data'
 import type {TruckData} from '~/services/dto/truck-data'
 import type {CustomerData} from '~/services/dto/customer-data'
+import type {AddressData} from "~/services/dto/address-data";
 
 export interface ShipmentTypeData {
     id: number
@@ -21,6 +22,7 @@ export type ShipmentData = {
     shipmentDate: string
     currentStep: number
     isValid: boolean
+    address?: AddressData | null
     carrier?: CarrierData | null
     truck?: TruckData | null
     customer?: CustomerData | null