From 4e2fe556be9257a8ccf73948047d924dc7507942 Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Mon, 9 Feb 2026 17:36:26 +0100
Subject: [PATCH 1/8] feat : admin fournisseurs creation et modif (WIP)

---
 .../components/supplier/supplier-form.vue     | 183 ++++++++++++++++++
 frontend/pages/admin/supplier/[[id]].vue      |   8 +
 frontend/services/dto/address-data.ts         |   8 +
 frontend/services/dto/supplier-data.ts        |  20 +-
 frontend/services/supplier.ts                 |  43 ++--
 5 files changed, 248 insertions(+), 14 deletions(-)
 create mode 100644 frontend/components/supplier/supplier-form.vue
 create mode 100644 frontend/pages/admin/supplier/[[id]].vue

diff --git a/frontend/components/supplier/supplier-form.vue b/frontend/components/supplier/supplier-form.vue
new file mode 100644
index 0000000..f0ff7dd
--- /dev/null
+++ b/frontend/components/supplier/supplier-form.vue
@@ -0,0 +1,183 @@
+<template>
+    <form @submit.prevent="validate">
+        <div class="flex items-center justify-between gap-10">
+            <h1 class="text-3xl font-bold uppercase">
+                {{ supplierId ? "Modifications du fournisseur" : "Ajout d'un fournisseur" }}
+            </h1>
+
+            <button
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+                type="submit"
+                :disabled="isLoading"
+            >
+                {{ supplierId ? "Sauvegarder" : "Ajouter" }}
+            </button>
+        </div>
+
+        <div class="grid gap-y-16 gap-x-40 mb-16">
+
+            <UiTextInput
+                id="supplier-name"
+                v-model="form.name"
+                label="Nom du fournisseur"
+            />
+
+            <UiTextInput
+                id="supplier-email"
+                v-model="form.email"
+                label="Email"
+            />
+
+            <UiTextInput
+                id="supplier-phone"
+                v-model="form.phone"
+                label="Téléphone"
+            />
+
+            <UiTextInput
+                id="supplier-street"
+                v-model="form.addresses[0].street"
+                label="Rue"
+            />
+
+            <UiTextInput
+                id="supplier-street2"
+                v-model="form.addresses[0].street2"
+                label="Complément"
+            />
+
+            <UiTextInput
+                id="supplier-postalCode"
+                v-model="form.addresses[0].postalCode"
+                label="Code postal"
+            />
+
+            <UiTextInput
+                id="supplier-city"
+                v-model="form.addresses[0].city"
+                label="Ville"
+            />
+
+            <UiTextInput
+                id="supplier-country"
+                v-model="form.addresses[0].country"
+                label="Pays"
+            />
+        </div>
+    </form>
+</template>
+
+<script setup lang="ts">
+import { computed, reactive, ref, watch } from "vue"
+import { createSupplier, getSupplier, updateSupplier } from "~/services/supplier"
+import type { SupplierData, SupplierFormData } from "~/services/dto/supplier-data"
+
+definePageMeta({ layout: "admin" })
+
+const route = useRoute()
+const router = useRouter()
+
+const resolveId = (param: unknown) => {
+    const idStr = Array.isArray(param) ? param[0] : param
+    if (!idStr) return null
+    const id = Number(idStr)
+    return Number.isFinite(id) ? id : null
+}
+
+const supplierId = computed(() => resolveId(route.params.id))
+
+const isLoading = ref(false)
+const isHydrating = ref(false)
+
+const form = reactive<SupplierFormData>({
+    name: "",
+    email: "",
+    phone: "",
+    addresses: [
+        {
+            id: null,
+            street: "",
+            street2: "",
+            postalCode: "",
+            city: "",
+            country: ""
+        }
+    ]
+})
+
+const hydrateFromSupplier = (supplier: SupplierData | null) => {
+    if (!supplier) return
+
+    isHydrating.value = true
+
+    form.name = supplier.name ?? ""
+    form.email = supplier.email ?? ""
+    form.phone = supplier.phone ?? ""
+
+    const a0 = supplier.addresses?.[0] ?? null
+
+    form.addresses[0].id = a0?.id ?? null
+    form.addresses[0].street = a0?.street ?? ""
+    form.addresses[0].street2 = a0?.street2 ?? ""
+    form.addresses[0].postalCode = a0?.postalCode ?? ""
+    form.addresses[0].city = a0?.city ?? ""
+    form.addresses[0].country = a0?.country ?? ""
+
+    isHydrating.value = false
+}
+
+watch(
+    () => supplierId.value,
+    async (id) => {
+        if (id === null) return
+
+        isLoading.value = true
+        try {
+            const supplier = await getSupplier(id)
+            hydrateFromSupplier(supplier)
+        } finally {
+            isLoading.value = false
+        }
+    },
+    { immediate: true }
+)
+
+async function validate() {
+
+    const name = form.name.trim()
+    const email = form.email.trim()
+    const phone = form.phone.trim()
+
+    const a0 = form.addresses[0]
+    const street = a0.street.trim()
+    const street2 = (a0.street2 ?? "").trim()
+    const postalCode = a0.postalCode.trim()
+    const city = a0.city.trim()
+    const country = a0.country.trim()
+
+    const payload = {
+        name,
+        email,
+        phone,
+        addresses: [
+            {
+                id: a0.id ?? undefined,
+                street,
+                street2: street2 || undefined,
+                postalCode,
+                city,
+                country
+            }
+        ]
+    }
+
+    if (supplierId.value !== null) {
+        await updateSupplier(supplierId.value, payload)
+        await router.push("/admin/supplier/supplier-list")
+        return
+    }
+
+    await createSupplier(payload)
+    await router.push("/admin/supplier/supplier-list")
+}
+</script>
diff --git a/frontend/pages/admin/supplier/[[id]].vue b/frontend/pages/admin/supplier/[[id]].vue
new file mode 100644
index 0000000..9624710
--- /dev/null
+++ b/frontend/pages/admin/supplier/[[id]].vue
@@ -0,0 +1,8 @@
+<template>
+    <SupplierForm/>
+</template>
+<script setup lang="ts">
+definePageMeta({
+    layout: 'admin'
+})
+</script>
diff --git a/frontend/services/dto/address-data.ts b/frontend/services/dto/address-data.ts
index db93c92..9c91f24 100644
--- a/frontend/services/dto/address-data.ts
+++ b/frontend/services/dto/address-data.ts
@@ -8,3 +8,11 @@ export interface AddressData {
     countryCode: string
     fullAddress?: string
 }
+export interface AddressFormData {
+    id?: number | null
+    street: string
+    street2?: string
+    postalCode: string
+    city: string
+    country: string
+}
diff --git a/frontend/services/dto/supplier-data.ts b/frontend/services/dto/supplier-data.ts
index 80f9f80..a3c9cf4 100644
--- a/frontend/services/dto/supplier-data.ts
+++ b/frontend/services/dto/supplier-data.ts
@@ -1,9 +1,25 @@
-import type { AddressData } from '~/services/dto/address-data'
+import type { AddressFormData } from '~/services/dto/address-data'
 
 export interface SupplierData {
     id: number
     name: string
     email?: string | null
     phone?: string | null
-    addresses?: AddressData[] | null
+    addresses: AddressFormData[]
+}
+export interface SupplierFormData {
+    name: string
+    email?: string
+    phone?: string
+    addresses: AddressFormData[]
+}
+
+export type SupplierPayload = {
+    name: string
+    email?: string | null
+    phone?: string | null
+    street?: string | null
+    city?: string | null
+    postalCode?: string | null
+    country?: string | null
 }
diff --git a/frontend/services/supplier.ts b/frontend/services/supplier.ts
index 90cec8e..7cc6141 100644
--- a/frontend/services/supplier.ts
+++ b/frontend/services/supplier.ts
@@ -1,23 +1,42 @@
-import { useApi } from '~/composables/useApi'
-import type { SupplierData } from '~/services/dto/supplier-data'
+import { useApi } from "~/composables/useApi"
+import type { SupplierData, SupplierPayload } from "~/services/dto/supplier-data"
 
 export type SupplierListResponse =
     | SupplierData[]
-    | { 'hydra:member'?: SupplierData[] }
+    | { "hydra:member"?: SupplierData[] }
 
 export async function getSupplierList(): Promise<SupplierData[]> {
     const api = useApi()
-    const response = await api.get<SupplierListResponse>('suppliers', {}, {
-        toastErrorKey: 'errors.supplier.list'
+    const response = await api.get<SupplierListResponse>("suppliers", {}, {
+        toastErrorKey: "errors.supplier.list"
     })
 
-    if (Array.isArray(response)) {
-        return response
+    if (Array.isArray(response)) return response
+    if (response && typeof response === "object" && Array.isArray(response["hydra:member"])) {
+        return response["hydra:member"]
     }
-
-    if (response && typeof response === 'object' && Array.isArray(response['hydra:member'])) {
-        return response['hydra:member']
-    }
-
     return []
 }
+
+export async function getSupplier(id: number): Promise<SupplierData> {
+    const api = useApi()
+    return api.get<SupplierData>(`supplier/${id}`, {}, {
+        toastErrorKey: "errors.supplier.fetch"
+    })
+}
+
+export async function updateSupplier(id: number, payload: SupplierPayload): Promise<SupplierData> {
+    const api = useApi()
+    return api.patch<SupplierData>(`supplier/${id}`, payload, {
+        toastErrorKey: "errors.supplier.update",
+        toastSuccessKey: "success.supplier.update"
+    })
+}
+
+export async function createSupplier(payload: SupplierPayload): Promise<SupplierData> {
+    const api = useApi()
+    return api.post<SupplierData>("supplier", payload, {
+        toastErrorKey: "errors.supplier.create",
+        toastSuccessKey: "success.supplier.create"
+    })
+}
-- 
2.39.5


From b1c12138f1f01a066ea8b8cb501e6fea03c55357 Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Tue, 10 Feb 2026 11:48:02 +0100
Subject: [PATCH 2/8] feat : admin fournisseurs creation et modif (WIP)

---
 .../components/supplier/supplier-form.vue     | 183 ++++++++----------
 .../pages/admin/supplier/supplier-list.vue    |  85 +++++---
 frontend/services/address.ts                  |  35 ++++
 frontend/services/dto/address-data.ts         |   7 +-
 frontend/services/dto/supplier-data.ts        |  12 +-
 frontend/services/supplier.ts                 |  14 +-
 src/Entity/Address.php                        |  24 ++-
 src/Entity/Supplier.php                       |  46 ++++-
 8 files changed, 248 insertions(+), 158 deletions(-)
 create mode 100644 frontend/services/address.ts

diff --git a/frontend/components/supplier/supplier-form.vue b/frontend/components/supplier/supplier-form.vue
index f0ff7dd..eac9de2 100644
--- a/frontend/components/supplier/supplier-form.vue
+++ b/frontend/components/supplier/supplier-form.vue
@@ -14,63 +14,28 @@
             </button>
         </div>
 
-        <div class="grid gap-y-16 gap-x-40 mb-16">
+        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-16">
+            <UiTextInput id="supplier-name" v-model="form.name" label="Nom du fournisseur" />
+            <UiTextInput id="supplier-email" v-model="form.email" label="Email" />
+            <UiTextInput id="supplier-phone" v-model="form.phone" label="Téléphone" />
 
-            <UiTextInput
-                id="supplier-name"
-                v-model="form.name"
-                label="Nom du fournisseur"
-            />
-
-            <UiTextInput
-                id="supplier-email"
-                v-model="form.email"
-                label="Email"
-            />
-
-            <UiTextInput
-                id="supplier-phone"
-                v-model="form.phone"
-                label="Téléphone"
-            />
-
-            <UiTextInput
-                id="supplier-street"
-                v-model="form.addresses[0].street"
-                label="Rue"
-            />
-
-            <UiTextInput
-                id="supplier-street2"
-                v-model="form.addresses[0].street2"
-                label="Complément"
-            />
-
-            <UiTextInput
-                id="supplier-postalCode"
-                v-model="form.addresses[0].postalCode"
-                label="Code postal"
-            />
-
-            <UiTextInput
-                id="supplier-city"
-                v-model="form.addresses[0].city"
-                label="Ville"
-            />
-
-            <UiTextInput
-                id="supplier-country"
-                v-model="form.addresses[0].country"
-                label="Pays"
-            />
+            <UiTextInput id="supplier-street" v-model="form.addresses[0].street" label="Rue" />
+            <UiTextInput id="supplier-street2" v-model="form.addresses[0].street2" label="Complément" />
+            <UiTextInput id="supplier-postalCode" v-model="form.addresses[0].postalCode" label="Code postal" />
+            <UiTextInput id="supplier-city" v-model="form.addresses[0].city" label="Ville" />
+            <UiTextInput id="supplier-country" v-model="form.addresses[0].countryCode" label="Pays" />
         </div>
+
+        <p v-if="errorMsg" class="text-red-600 mt-4">{{ errorMsg }}</p>
     </form>
 </template>
 
 <script setup lang="ts">
 import { computed, reactive, ref, watch } from "vue"
 import { createSupplier, getSupplier, updateSupplier } from "~/services/supplier"
-import type { SupplierData, SupplierFormData } from "~/services/dto/supplier-data"
+import { createAddress, updateAddress, type AddressPayload } from "~/services/address"
+import type { SupplierData, SupplierFormData, SupplierPayload } from "~/services/dto/supplier-data"
+import type { AddressFormData } from "~/services/dto/address-data"
 
 definePageMeta({ layout: "admin" })
 
@@ -87,50 +52,51 @@ const resolveId = (param: unknown) => {
 const supplierId = computed(() => resolveId(route.params.id))
 
 const isLoading = ref(false)
-const isHydrating = ref(false)
+const errorMsg = ref<string | null>(null)
+
+const emptyAddress = (): AddressFormData => ({
+    id: null,
+    label: "",
+    street: "",
+    street2: null,
+    postalCode: "",
+    city: "",
+    countryCode: "",
+})
 
 const form = reactive<SupplierFormData>({
     name: "",
     email: "",
     phone: "",
-    addresses: [
-        {
-            id: null,
-            street: "",
-            street2: "",
-            postalCode: "",
-            city: "",
-            country: ""
-        }
-    ]
+    addresses: [emptyAddress()],
 })
 
 const hydrateFromSupplier = (supplier: SupplierData | null) => {
     if (!supplier) return
 
-    isHydrating.value = true
-
     form.name = supplier.name ?? ""
     form.email = supplier.email ?? ""
     form.phone = supplier.phone ?? ""
 
-    const a0 = supplier.addresses?.[0] ?? null
+    if (!Array.isArray(supplier.addresses) || supplier.addresses.length === 0) return
+    const a0 = supplier.addresses[0]
 
-    form.addresses[0].id = a0?.id ?? null
-    form.addresses[0].street = a0?.street ?? ""
-    form.addresses[0].street2 = a0?.street2 ?? ""
-    form.addresses[0].postalCode = a0?.postalCode ?? ""
-    form.addresses[0].city = a0?.city ?? ""
-    form.addresses[0].country = a0?.country ?? ""
+    // si IRIs -> ignore
+    if (typeof a0 === "string") return
 
-    isHydrating.value = false
+    form.addresses[0].id = a0.id ?? null
+    form.addresses[0].label = a0.label ?? ""
+    form.addresses[0].street = a0.street ?? ""
+    form.addresses[0].street2 = a0.street2 ?? null
+    form.addresses[0].postalCode = a0.postalCode ?? ""
+    form.addresses[0].city = a0.city ?? ""
+    form.addresses[0].countryCode = a0.countryCode ?? ""
 }
 
 watch(
     () => supplierId.value,
     async (id) => {
         if (id === null) return
-
         isLoading.value = true
         try {
             const supplier = await getSupplier(id)
@@ -143,41 +109,56 @@ watch(
 )
 
 async function validate() {
+    if (isLoading.value) return
+    isLoading.value = true
+    errorMsg.value = null
 
-    const name = form.name.trim()
-    const email = form.email.trim()
-    const phone = form.phone.trim()
+    try {
+        const name = form.name.trim()
+        const email = (form.email ?? "").trim() || null
+        const phone = (form.phone ?? "").trim() || null
 
-    const a0 = form.addresses[0]
-    const street = a0.street.trim()
-    const street2 = (a0.street2 ?? "").trim()
-    const postalCode = a0.postalCode.trim()
-    const city = a0.city.trim()
-    const country = a0.country.trim()
+        const a0 = form.addresses[0]
 
-    const payload = {
-        name,
-        email,
-        phone,
-        addresses: [
-            {
-                id: a0.id ?? undefined,
-                street,
-                street2: street2 || undefined,
-                postalCode,
-                city,
-                country
-            }
-        ]
-    }
+        const label = a0.label.trim() || name || "Adresse"
+
+        const addressPayload: AddressPayload = {
+            label,
+            street: a0.street.trim(),
+            street2: a0.street2?.trim() || null,
+            postalCode: a0.postalCode.trim(),
+            city: a0.city.trim(),
+            countryCode: a0.countryCode.trim(),
+        }
+
+        let addressId: number
+        if (a0.id) {
+            const updated = await updateAddress(a0.id, addressPayload)
+            addressId = updated.id
+        } else {
+            const created = await createAddress(addressPayload)
+            addressId = created.id
+            a0.id = addressId
+        }
+        const supplierPayload: SupplierPayload = {
+            name,
+            email,
+            phone,
+            addresses: [`/api/addresses/${addressId}`],
+        }
+
+        if (supplierId.value !== null) {
+            await updateSupplier(supplierId.value, supplierPayload)
+        } else {
+            await createSupplier(supplierPayload)
+        }
 
-    if (supplierId.value !== null) {
-        await updateSupplier(supplierId.value, payload)
         await router.push("/admin/supplier/supplier-list")
-        return
+    } catch (e) {
+        errorMsg.value = "Erreur lors de l’enregistrement."
+        throw e
+    } finally {
+        isLoading.value = false
     }
-
-    await createSupplier(payload)
-    await router.push("/admin/supplier/supplier-list")
 }
 </script>
diff --git a/frontend/pages/admin/supplier/supplier-list.vue b/frontend/pages/admin/supplier/supplier-list.vue
index 7840c65..043d4be 100644
--- a/frontend/pages/admin/supplier/supplier-list.vue
+++ b/frontend/pages/admin/supplier/supplier-list.vue
@@ -1,16 +1,18 @@
 <template>
     <div class="flex items-center justify-between">
-        <h1 class="text-3xl font-bold uppercase"> Fournisseurs </h1>
-        <NuxtLink to="/admin/supplier"
-                  class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+        <h1 class="text-3xl font-bold uppercase">Fournisseurs</h1>
+        <NuxtLink
+            to="/admin/supplier"
+            class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
         >
             Ajouter
         </NuxtLink>
     </div>
+
     <div class="mt-6 border border-slate-200 mb-16">
         <div class="max-h-96 overflow-y-auto">
             <div
-                class="sticky top-0 z-10 grid grid-cols-6 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide"
+                class="sticky top-0 z-10 grid grid-cols-7 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide"
             >
                 <div>Nom</div>
                 <div>Mail</div>
@@ -18,31 +20,49 @@
                 <div>Complément</div>
                 <div>Code Postal</div>
                 <div>Ville</div>
+                <div>Pays</div>
+            </div>
+
+            <div v-if="supplierList.length === 0" class="px-4 py-6 text-slate-400">
+                Aucun fournisseur.
             </div>
 
             <div v-for="supplier in supplierList" :key="supplier.id">
-                <template v-if="supplier.addresses?.length">
+                <div
+                    v-if="!supplier.addresses || supplier.addresses.length === 0"
+                    class="grid grid-cols-7 border-t gap-4 px-4 py-2 text-slate-400"
+                >
+                    <div class="truncate">{{ supplier.name }}</div>
+                    <div class="truncate">{{ supplier.email }}</div>
+                    <div class="col-span-5">—</div>
+                </div>
+
+                <template v-else-if="isAddressObjectArray(supplier.addresses)">
                     <div
-                        v-for="addr in supplier.addresses"
-                        :key="addr.id"
-                        class="grid grid-cols-6 hover:bg-slate-50 border-t gap-4 px-4 py-2"
+                        v-for="(address, idx) in supplier.addresses"
+                        :key="address.id ?? `${supplier.id}-${idx}-${address.street}-${address.postalCode}`"
+                        class="grid grid-cols-7 hover:bg-slate-50 border-t gap-4 px-4 py-2 cursor-pointer"
                         @click="goToSupplier(supplier.id)"
                     >
-                        <div class="truncate">
-                            {{ supplier.name }}
-                        </div>
-                        <div class="truncate">
-                            {{ supplier.email }}
-                        </div>
-                        <div class="truncate">
-                            {{ addr.street }}
-                        </div>
-                        <div class="truncate">
-                            {{ addr.street2 }}
-                        </div>
-                        <div>{{ addr.postalCode }}</div>
-                        <div class="uppercase truncate">
-                            {{ addr.city }}
+                        <div class="truncate">{{ supplier.name }}</div>
+                        <div class="truncate">{{ supplier.email }}</div>
+                        <div class="truncate">{{ address.street }}</div>
+                        <div class="truncate">{{ address.street2 }}</div>
+                        <div>{{ address.postalCode }}</div>
+                        <div class="uppercase truncate">{{ address.city }}</div>
+                        <div class="uppercase truncate">{{ address.countryCode }}</div>
+                    </div>
+                </template>
+
+                <template v-else>
+                    <div
+                        class="grid grid-cols-7 hover:bg-slate-50 border-t gap-4 px-4 py-2 cursor-pointer"
+                        @click="goToSupplier(supplier.id)"
+                    >
+                        <div class="truncate">{{ supplier.name }}</div>
+                        <div class="truncate">{{ supplier.email }}</div>
+                        <div class="col-span-5 text-slate-400">
+                            Adresses non chargées (IRIs)
                         </div>
                     </div>
                 </template>
@@ -52,23 +72,26 @@
 </template>
 
 <script setup lang="ts">
-import type {SupplierData} from "~/services/dto/supplier-data"
-import {getSupplierList} from "~/services/supplier"
+import { getSupplierList } from "~/services/supplier"
+import type { SupplierData } from "~/services/dto/supplier-data"
+import type { AddressFormData } from "~/services/dto/address-data"
 
-definePageMeta({layout: "admin"})
+definePageMeta({ layout: "admin" })
 
 const supplierList = ref<SupplierData[]>([])
 const router = useRouter()
 
-
 const goToSupplier = (id: number) => {
     router.push(`/admin/supplier/${id}`)
 }
 
+function isAddressObjectArray(value: SupplierData["addresses"]): value is AddressFormData[] {
+    if (!Array.isArray(value) || value.length === 0) return false
+    const v0 = value[0]
+    return typeof v0 === "object" && v0 !== null && "street" in v0 && "postalCode" in v0
+}
+
 onMounted(async () => {
-    supplierList.value = (await getSupplierList(false)) ?? []
+    supplierList.value = await getSupplierList()
 })
-
 </script>
-
-
diff --git a/frontend/services/address.ts b/frontend/services/address.ts
new file mode 100644
index 0000000..d54b8ad
--- /dev/null
+++ b/frontend/services/address.ts
@@ -0,0 +1,35 @@
+import { useApi } from '~/composables/useApi'
+import type { AddressData } from '~/services/dto/address-data'
+export interface AddressPayload {
+    label: string
+    street: string
+    street2?: string | null
+    postalCode: string
+    city: string
+    countryCode: string
+}
+
+export interface AddressData extends AddressPayload {
+    id: number
+}
+
+export async function createAddress(
+    payload: AddressPayload
+): Promise<AddressData> {
+    const api = useApi()
+
+    return await api.post<AddressData>('addresses', payload, {
+        toastErrorKey: 'errors.address.create',
+    })
+}
+
+export async function updateAddress(
+    id: number,
+    payload: AddressPayload
+): Promise<AddressData> {
+    const api = useApi()
+
+    return await api.patch<AddressData>(`addresses/${id}`, payload, {
+        toastErrorKey: 'errors.address.update',
+    })
+}
diff --git a/frontend/services/dto/address-data.ts b/frontend/services/dto/address-data.ts
index 9c91f24..4fa7a78 100644
--- a/frontend/services/dto/address-data.ts
+++ b/frontend/services/dto/address-data.ts
@@ -6,13 +6,14 @@ export interface AddressData {
     postalCode: string
     city: string
     countryCode: string
-    fullAddress?: string
 }
+
 export interface AddressFormData {
     id?: number | null
+    label: string
     street: string
-    street2?: string
+    street2?: string | null
     postalCode: string
     city: string
-    country: string
+    countryCode: string
 }
diff --git a/frontend/services/dto/supplier-data.ts b/frontend/services/dto/supplier-data.ts
index a3c9cf4..26217dc 100644
--- a/frontend/services/dto/supplier-data.ts
+++ b/frontend/services/dto/supplier-data.ts
@@ -1,12 +1,15 @@
-import type { AddressFormData } from '~/services/dto/address-data'
+import type { AddressFormData } from "~/services/dto/address-data"
+
+export type SupplierAddresses = AddressFormData[] | string[]
 
 export interface SupplierData {
     id: number
     name: string
     email?: string | null
     phone?: string | null
-    addresses: AddressFormData[]
+    addresses: SupplierAddresses
 }
+
 export interface SupplierFormData {
     name: string
     email?: string
@@ -18,8 +21,5 @@ export type SupplierPayload = {
     name: string
     email?: string | null
     phone?: string | null
-    street?: string | null
-    city?: string | null
-    postalCode?: string | null
-    country?: string | null
+    addresses: string[]
 }
diff --git a/frontend/services/supplier.ts b/frontend/services/supplier.ts
index 7cc6141..bc3ce84 100644
--- a/frontend/services/supplier.ts
+++ b/frontend/services/supplier.ts
@@ -8,7 +8,7 @@ export type SupplierListResponse =
 export async function getSupplierList(): Promise<SupplierData[]> {
     const api = useApi()
     const response = await api.get<SupplierListResponse>("suppliers", {}, {
-        toastErrorKey: "errors.supplier.list"
+        toastErrorKey: "errors.supplier.list",
     })
 
     if (Array.isArray(response)) return response
@@ -20,23 +20,23 @@ export async function getSupplierList(): Promise<SupplierData[]> {
 
 export async function getSupplier(id: number): Promise<SupplierData> {
     const api = useApi()
-    return api.get<SupplierData>(`supplier/${id}`, {}, {
-        toastErrorKey: "errors.supplier.fetch"
+    return api.get<SupplierData>(`suppliers/${id}`, {}, {
+        toastErrorKey: "errors.supplier.fetch",
     })
 }
 
 export async function updateSupplier(id: number, payload: SupplierPayload): Promise<SupplierData> {
     const api = useApi()
-    return api.patch<SupplierData>(`supplier/${id}`, payload, {
+    return api.patch<SupplierData>(`suppliers/${id}`, payload, {
         toastErrorKey: "errors.supplier.update",
-        toastSuccessKey: "success.supplier.update"
+        toastSuccessKey: "success.supplier.update",
     })
 }
 
 export async function createSupplier(payload: SupplierPayload): Promise<SupplierData> {
     const api = useApi()
-    return api.post<SupplierData>("supplier", payload, {
+    return api.post<SupplierData>("suppliers", payload, {
         toastErrorKey: "errors.supplier.create",
-        toastSuccessKey: "success.supplier.create"
+        toastSuccessKey: "success.supplier.create",
     })
 }
diff --git a/src/Entity/Address.php b/src/Entity/Address.php
index 81903d4..29ec41c 100644
--- a/src/Entity/Address.php
+++ b/src/Entity/Address.php
@@ -7,6 +7,8 @@ namespace App\Entity;
 use ApiPlatform\Metadata\ApiResource;
 use ApiPlatform\Metadata\Get;
 use ApiPlatform\Metadata\GetCollection;
+use ApiPlatform\Metadata\Patch;
+use ApiPlatform\Metadata\Post;
 use Doctrine\Common\Collections\ArrayCollection;
 use Doctrine\Common\Collections\Collection;
 use Doctrine\ORM\Mapping as ORM;
@@ -23,6 +25,16 @@ use Symfony\Component\Serializer\Attribute\Groups;
         new GetCollection(
             normalizationContext: ['groups' => ['address:read']],
         ),
+        new Post(
+            normalizationContext: ['groups' => ['address:read']],
+            denormalizationContext: ['groups' => ['address:write']],
+            security: "is_granted('ROLE_ADMIN')",
+        ),
+        new Patch(
+            normalizationContext: ['groups' => ['address:read']],
+            denormalizationContext: ['groups' => ['address:write']],
+            security: "is_granted('ROLE_ADMIN')",
+        ),
     ],
     security: "is_granted('ROLE_USER')",
 )]
@@ -35,27 +47,27 @@ class Address
     private ?int $id = null;
 
     #[ORM\Column(length: 120)]
-    #[Groups(['address:read', 'supplier:read', 'reception:read'])]
+    #[Groups(['address:read', 'supplier:read', 'reception:read', 'address:write'])]
     private string $label = '';
 
     #[ORM\Column(length: 180)]
-    #[Groups(['address:read', 'supplier:read', 'reception:read'])]
+    #[Groups(['address:read', 'supplier:read', 'reception:read', 'address:write'])]
     private string $street = '';
 
     #[ORM\Column(name: 'street2', length: 180, nullable: true)]
-    #[Groups(['address:read', 'supplier:read', 'reception:read'])]
+    #[Groups(['address:read', 'supplier:read', 'reception:read', 'address:write'])]
     private ?string $street2 = null;
 
     #[ORM\Column(name: 'postal_code', length: 20)]
-    #[Groups(['address:read', 'supplier:read', 'reception:read'])]
+    #[Groups(['address:read', 'supplier:read', 'reception:read', 'address:write'])]
     private string $postalCode = '';
 
     #[ORM\Column(length: 120)]
-    #[Groups(['address:read', 'supplier:read', 'reception:read'])]
+    #[Groups(['address:read', 'supplier:read', 'reception:read', 'address:write'])]
     private string $city = '';
 
     #[ORM\Column(name: 'country_code', length: 2)]
-    #[Groups(['address:read', 'supplier:read'])]
+    #[Groups(['address:read', 'supplier:read', 'address:write'])]
     private string $countryCode = '';
 
     /**
diff --git a/src/Entity/Supplier.php b/src/Entity/Supplier.php
index 189f001..23c172f 100644
--- a/src/Entity/Supplier.php
+++ b/src/Entity/Supplier.php
@@ -8,6 +8,8 @@ use ApiPlatform\Metadata\ApiProperty;
 use ApiPlatform\Metadata\ApiResource;
 use ApiPlatform\Metadata\Get;
 use ApiPlatform\Metadata\GetCollection;
+use ApiPlatform\Metadata\Patch;
+use ApiPlatform\Metadata\Post;
 use Doctrine\Common\Collections\ArrayCollection;
 use Doctrine\Common\Collections\Collection;
 use Doctrine\ORM\Mapping as ORM;
@@ -24,6 +26,16 @@ use Symfony\Component\Serializer\Attribute\Groups;
         new GetCollection(
             normalizationContext: ['groups' => ['supplier:read']],
         ),
+        new Post(
+            normalizationContext: ['groups' => ['supplier:read']],
+            denormalizationContext: ['groups' => ['supplier:write']],
+            security: "is_granted('ROLE_ADMIN')",
+        ),
+        new Patch(
+            normalizationContext: ['groups' => ['supplier:read']],
+            denormalizationContext: ['groups' => ['supplier:write']],
+            security: "is_granted('ROLE_ADMIN')",
+        ),
     ],
     security: "is_granted('ROLE_USER')",
 )]
@@ -36,15 +48,15 @@ class Supplier
     private ?int $id = null;
 
     #[ORM\Column(length: 180)]
-    #[Groups(['supplier:read', 'reception:read'])]
+    #[Groups(['supplier:read', 'reception:read', 'supplier:write'])]
     private string $name = '';
 
     #[ORM\Column(length: 180, nullable: true)]
-    #[Groups(['supplier:read', 'reception:read'])]
+    #[Groups(['supplier:read', 'reception:read', 'supplier:write'])]
     private ?string $email = null;
 
     #[ORM\Column(length: 40, nullable: true)]
-    #[Groups(['supplier:read', 'reception:read'])]
+    #[Groups(['supplier:read', 'reception:read', 'supplier:write'])]
     private ?string $phone = null;
 
     /**
@@ -52,7 +64,7 @@ class Supplier
      */
     #[ORM\ManyToMany(targetEntity: Address::class, inversedBy: 'suppliers')]
     #[ORM\JoinTable(name: 'supplier_address')]
-    #[Groups(['supplier:read'])]
+    #[Groups(['supplier:read', 'supplier:write'])]
     #[ApiProperty(readableLink: true)]
     private Collection $addresses;
 
@@ -109,4 +121,30 @@ class Supplier
     {
         return $this->addresses;
     }
+
+    public function setAddresses(iterable $addresses): self
+    {
+        $this->addresses->clear();
+        foreach ($addresses as $address) {
+            $this->addAddress($address);
+        }
+
+        return $this;
+    }
+
+    public function addAddress(Address $address): self
+    {
+        if (!$this->addresses->contains($address)) {
+            $this->addresses->add($address);
+        }
+
+        return $this;
+    }
+
+    public function removeAddress(Address $address): self
+    {
+        $this->addresses->removeElement($address);
+
+        return $this;
+    }
 }
-- 
2.39.5


From 4a3114ca52cfbf95f13b2abdfcbd672721a4c1cd Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Tue, 10 Feb 2026 12:05:54 +0100
Subject: [PATCH 3/8] feat : admin fournisseurs creation et modif

---
 CHANGELOG.md                                   | 1 +
 frontend/components/supplier/supplier-form.vue | 1 -
 2 files changed, 1 insertion(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5902764..c787ef6 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
+* [#313] Admin modification creation fournisseur
 
 ### Changed
 
diff --git a/frontend/components/supplier/supplier-form.vue b/frontend/components/supplier/supplier-form.vue
index eac9de2..67f925b 100644
--- a/frontend/components/supplier/supplier-form.vue
+++ b/frontend/components/supplier/supplier-form.vue
@@ -81,7 +81,6 @@ const hydrateFromSupplier = (supplier: SupplierData | null) => {
     if (!Array.isArray(supplier.addresses) || supplier.addresses.length === 0) return
     const a0 = supplier.addresses[0]
 
-    // si IRIs -> ignore
     if (typeof a0 === "string") return
 
     form.addresses[0].id = a0.id ?? null
-- 
2.39.5


From 83b339746ebfcc86ebfd1d4fb6d343e8c024ff98 Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Tue, 10 Feb 2026 13:08:40 +0100
Subject: [PATCH 4/8] feat : admin fournisseurs creation et modif

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

diff --git a/CHANGELOG.md b/CHANGELOG.md
index be96218..cb58947 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -35,6 +35,7 @@ Ajouter dans le fichier .env du frontend
 * [#317] Admin modification creation transporteur
 * [#318] Affichage modification reception terminée
 * [#313] Admin modification creation fournisseur
+
 ### Changed
 
 ### Fixed
-- 
2.39.5


From 1e794bba00ddc989de06533eae961935ed98549b Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Wed, 11 Feb 2026 08:18:55 +0100
Subject: [PATCH 5/8] feat : admin fournisseurs creation et modif (WIP)

---
 frontend/components/address/add-address.vue   | 238 ++++++++++++++++++
 .../components/supplier/supplier-form.vue     | 152 +++++++----
 frontend/i18n/locales/fr.json                 |  24 +-
 frontend/pages/admin/supplier/address.vue     |   7 +
 .../pages/admin/supplier/supplier-list.vue    |  16 +-
 frontend/services/address.ts                  |  10 +
 frontend/services/dto/supplier-data.ts        |   2 +-
 7 files changed, 389 insertions(+), 60 deletions(-)
 create mode 100644 frontend/components/address/add-address.vue
 create mode 100644 frontend/pages/admin/supplier/address.vue

diff --git a/frontend/components/address/add-address.vue b/frontend/components/address/add-address.vue
new file mode 100644
index 0000000..f32afd1
--- /dev/null
+++ b/frontend/components/address/add-address.vue
@@ -0,0 +1,238 @@
+<template>
+    <form @submit.prevent="validate">
+        <div class="flex items-center justify-between gap-10">
+            <div>
+                <h1 class="text-3xl font-bold uppercase">
+                    {{ addressId ? "Modification d'une adresse" : "Ajout d'une adresse" }}
+                </h1>
+                <p v-if="entityName" class="text-sm text-slate-500 mt-1">
+                    {{ entityLabel }} : {{ entityName }}
+                </p>
+            </div>
+
+            <button
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+                type="submit"
+                :disabled="isLoading || entityId === null"
+            >
+                {{ addressId ? "Sauvegarder" : "Ajouter" }}
+            </button>
+        </div>
+
+        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-16 mt-10">
+            <UiTextInput id="address-label" v-model="form.label" label="Libellé" />
+            <UiTextInput id="address-street" v-model="form.street" label="Rue" />
+            <UiTextInput id="address-street2" v-model="form.street2" label="Complément" />
+            <UiTextInput id="address-postalCode" v-model="form.postalCode" label="Code postal" />
+            <UiTextInput id="address-city" v-model="form.city" label="Ville" />
+            <UiTextInput id="address-country" v-model="form.countryCode" label="Pays" />
+        </div>
+
+        <p v-if="errorMsg" class="text-red-600 mt-4">{{ errorMsg }}</p>
+    </form>
+</template>
+
+<script setup lang="ts">
+import { computed, reactive, ref, watch } from "vue"
+import { createAddress, getAddress, updateAddress, type AddressPayload } from "~/services/address"
+import { getSupplier, updateSupplier } from "~/services/supplier"
+import type { SupplierPayload } from "~/services/dto/supplier-data"
+
+const route = useRoute()
+const router = useRouter()
+const { $i18n } = useNuxtApp()
+
+type AddressOwner = {
+    id: number
+    name?: string | null
+    email?: string | null
+    phone?: string | null
+    addresses?: unknown
+}
+
+type AddressOwnerAdapter = {
+    loadEntity: (id: number) => Promise<AddressOwner>
+    updateEntity: (id: number, payload: unknown) => Promise<unknown>
+    buildUpdatePayload: (owner: AddressOwner | null, addresses: string[]) => unknown
+    getEntityName: (owner: AddressOwner | null) => string
+    normalizeAddresses: (addresses: AddressOwner["addresses"]) => string[]
+}
+
+const props = defineProps<{
+    entityType?: "supplier" | "customer"
+    entityId?: number | null
+    returnPath?: string
+    adapter?: Partial<AddressOwnerAdapter>
+}>()
+
+const resolveId = (param: unknown) => {
+    const idStr = Array.isArray(param) ? param[0] : param
+    if (!idStr) return null
+    const id = Number(idStr)
+    return Number.isFinite(id) ? id : null
+}
+
+const entityType = computed<"supplier" | "customer">(() => {
+    if (props.entityType) return props.entityType
+    const queryType = route.query.entityType
+    if (queryType === "customer" || queryType === "supplier") return queryType
+    const path = route.path
+    if (path.includes("/customer/")) return "customer"
+    return "supplier"
+})
+
+const entityId = computed(() => {
+    if (props.entityId !== undefined) return props.entityId ?? null
+    const typeKey = `${entityType.value}Id`
+    return resolveId(route.query[typeKey]) ?? resolveId(route.query.entityId)
+})
+const addressId = computed(() => resolveId(route.query.addressId))
+
+const entity = ref<AddressOwner | null>(null)
+const entityName = computed(() => activeAdapter.value.getEntityName(entity.value))
+const entityLabel = computed(() => (entityType.value === "customer" ? "Client" : "Fournisseur"))
+
+const isLoading = ref(false)
+const errorMsg = ref<string | null>(null)
+
+const form = reactive<AddressPayload>({
+    label: "",
+    street: "",
+    street2: null,
+    postalCode: "",
+    city: "",
+    countryCode: "",
+})
+
+const defaultSupplierAdapter: AddressOwnerAdapter = {
+    loadEntity: getSupplier,
+    updateEntity: updateSupplier,
+    buildUpdatePayload: (owner, addresses) => ({
+        name: owner?.name ?? "",
+        email: owner?.email ?? null,
+        phone: owner?.phone ?? null,
+        addresses,
+    } satisfies SupplierPayload),
+    getEntityName: (owner) => owner?.name ?? "",
+    normalizeAddresses: (value) => {
+        if (!Array.isArray(value) || value.length === 0) return []
+        if (typeof value[0] === "string") {
+            return value.filter((item): item is string => typeof item === "string")
+        }
+        return value
+            .map((address) =>
+                address && typeof address === "object" && "id" in address && address.id
+                    ? `/api/addresses/${address.id}`
+                    : null
+            )
+            .filter((item): item is string => Boolean(item))
+    },
+}
+
+const activeAdapter = computed<AddressOwnerAdapter>(() => ({
+    ...defaultSupplierAdapter,
+    ...props.adapter,
+}))
+
+watch(
+    () => [entityId.value, addressId.value] as const,
+    async ([entityIdValue, addressIdValue]) => {
+        if (entityIdValue === null) {
+            entity.value = null
+            return
+        }
+        isLoading.value = true
+        try {
+            entity.value = await activeAdapter.value.loadEntity(entityIdValue)
+            if (addressIdValue !== null) {
+                const address = await getAddress(addressIdValue)
+                form.label = address.label ?? ""
+                form.street = address.street ?? ""
+                form.street2 = address.street2 ?? null
+                form.postalCode = address.postalCode ?? ""
+                form.city = address.city ?? ""
+                form.countryCode = address.countryCode ?? ""
+            } else {
+                form.label = ""
+                form.street = ""
+                form.street2 = null
+                form.postalCode = ""
+                form.city = ""
+                form.countryCode = ""
+            }
+        } finally {
+            isLoading.value = false
+        }
+    },
+    { immediate: true }
+)
+
+async function validate() {
+    if (isLoading.value) return
+    if (entityId.value === null) {
+        errorMsg.value = String($i18n.t("errors.address.entityNotFound"))
+        return
+    }
+    errorMsg.value = null
+    isLoading.value = true
+
+    try {
+        if (!entity.value) {
+            entity.value = await activeAdapter.value.loadEntity(entityId.value)
+        }
+
+        const payload: AddressPayload = {
+            label: form.label.trim() || entityName.value || "Adresse",
+            street: form.street.trim(),
+            street2: form.street2?.trim() || null,
+            postalCode: form.postalCode.trim(),
+            city: form.city.trim(),
+            countryCode: form.countryCode.trim().toUpperCase(),
+        }
+        if (!payload.street) {
+            errorMsg.value = String($i18n.t("errors.address.streetRequired"))
+            return
+        }
+        if (!payload.postalCode) {
+            errorMsg.value = String($i18n.t("errors.address.postalCodeRequired"))
+            return
+        }
+        if (!payload.city) {
+            errorMsg.value = String($i18n.t("errors.address.cityRequired"))
+            return
+        }
+        if (payload.countryCode.length !== 2) {
+            errorMsg.value = String($i18n.t("errors.address.countryCodeInvalid"))
+            return
+        }
+
+        let updatedAddressId = addressId.value
+        if (addressId.value !== null) {
+            const updated = await updateAddress(addressId.value, payload)
+            updatedAddressId = updated.id
+        } else {
+            const created = await createAddress(payload)
+            updatedAddressId = created.id
+        }
+
+        if (updatedAddressId !== null) {
+            const existingAddresses = activeAdapter.value.normalizeAddresses(entity.value?.addresses ?? [])
+            const updatedAddresses = existingAddresses.includes(`/api/addresses/${updatedAddressId}`)
+                ? existingAddresses
+                : [...existingAddresses, `/api/addresses/${updatedAddressId}`]
+
+            const updatePayload = activeAdapter.value.buildUpdatePayload(entity.value, updatedAddresses)
+            await activeAdapter.value.updateEntity(entityId.value, updatePayload)
+        }
+        const returnPath =
+            props.returnPath ?? `/admin/${entityType.value}/${entityId.value}`
+        await router.push(returnPath)
+    } catch (e) {
+        const errorKey = addressId.value !== null ? "errors.address.update" : "errors.address.create"
+        errorMsg.value = String($i18n.t(errorKey))
+        throw e
+    } finally {
+        isLoading.value = false
+    }
+}
+</script>
diff --git a/frontend/components/supplier/supplier-form.vue b/frontend/components/supplier/supplier-form.vue
index 67f925b..037298c 100644
--- a/frontend/components/supplier/supplier-form.vue
+++ b/frontend/components/supplier/supplier-form.vue
@@ -14,16 +14,60 @@
             </button>
         </div>
 
-        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-16">
+        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-10">
             <UiTextInput id="supplier-name" v-model="form.name" label="Nom du fournisseur" />
             <UiTextInput id="supplier-email" v-model="form.email" label="Email" />
             <UiTextInput id="supplier-phone" v-model="form.phone" label="Téléphone" />
+        </div>
 
-            <UiTextInput id="supplier-street" v-model="form.addresses[0].street" label="Rue" />
-            <UiTextInput id="supplier-street2" v-model="form.addresses[0].street2" label="Complément" />
-            <UiTextInput id="supplier-postalCode" v-model="form.addresses[0].postalCode" label="Code postal" />
-            <UiTextInput id="supplier-city" v-model="form.addresses[0].city" label="Ville" />
-            <UiTextInput id="supplier-country" v-model="form.addresses[0].countryCode" label="Pays" />
+        <div class="flex items-center justify-between mb-4">
+            <h2 class="text-2xl font-bold uppercase">Adresse fournisseur</h2>
+            <button
+                type="button"
+                class="text-sm uppercase bg-primary-500 text-white h-[40px] px-6"
+                :disabled="supplierId === null"
+                @click="goToAddAddress"
+            >
+                Ajouter
+            </button>
+        </div>
+        <div class="overflow-x-auto mb-10">
+            <table class="w-full border-collapse">
+                <thead>
+                    <tr class="text-left border-b border-gray-200">
+                        <th class="py-3 pr-4 text-sm uppercase">Libellé</th>
+                        <th class="py-3 pr-4 text-sm uppercase">Rue</th>
+                        <th class="py-3 pr-4 text-sm uppercase">Complément</th>
+                        <th class="py-3 pr-4 text-sm uppercase">Code postal</th>
+                        <th class="py-3 pr-4 text-sm uppercase">Ville</th>
+                        <th class="py-3 pr-4 text-sm uppercase">Pays</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <template v-if="form.addresses.length === 0">
+                        <tr>
+                            <td colspan="6" class="py-4 text-slate-400">
+                                Aucune adresse.
+                            </td>
+                        </tr>
+                    </template>
+                    <template v-else>
+                        <tr
+                            v-for="(address, index) in form.addresses"
+                            :key="address.id ?? index"
+                            class="border-b border-gray-100 cursor-pointer hover:bg-slate-50"
+                            @click="goToEditAddress(address.id ?? null)"
+                        >
+                            <td class="py-3 pr-4">{{ address.label || "—" }}</td>
+                            <td class="py-3 pr-4">{{ address.street || "—" }}</td>
+                            <td class="py-3 pr-4">{{ address.street2 || "—" }}</td>
+                            <td class="py-3 pr-4">{{ address.postalCode || "—" }}</td>
+                            <td class="py-3 pr-4">{{ address.city || "—" }}</td>
+                            <td class="py-3 pr-4">{{ address.countryCode || "—" }}</td>
+                        </tr>
+                    </template>
+                </tbody>
+            </table>
         </div>
 
         <p v-if="errorMsg" class="text-red-600 mt-4">{{ errorMsg }}</p>
@@ -33,14 +77,13 @@
 <script setup lang="ts">
 import { computed, reactive, ref, watch } from "vue"
 import { createSupplier, getSupplier, updateSupplier } from "~/services/supplier"
-import { createAddress, updateAddress, type AddressPayload } from "~/services/address"
 import type { SupplierData, SupplierFormData, SupplierPayload } from "~/services/dto/supplier-data"
-import type { AddressFormData } from "~/services/dto/address-data"
 
 definePageMeta({ layout: "admin" })
 
 const route = useRoute()
 const router = useRouter()
+const { $i18n } = useNuxtApp()
 
 const resolveId = (param: unknown) => {
     const idStr = Array.isArray(param) ? param[0] : param
@@ -54,23 +97,36 @@ const supplierId = computed(() => resolveId(route.params.id))
 const isLoading = ref(false)
 const errorMsg = ref<string | null>(null)
 
-const emptyAddress = (): AddressFormData => ({
-    id: null,
-    label: "",
-    street: "",
-    street2: null,
-    postalCode: "",
-    city: "",
-    countryCode: "",
-})
-
 const form = reactive<SupplierFormData>({
     name: "",
     email: "",
     phone: "",
-    addresses: [emptyAddress()],
+    addresses: [],
 })
 
+const goToAddAddress = () => {
+    if (supplierId.value === null) return
+    router.push({
+        path: "/admin/supplier/address",
+        query: {
+            supplierId: String(supplierId.value),
+            fromSupplier: "1",
+        },
+    })
+}
+
+const goToEditAddress = (addressId: number | null) => {
+    if (supplierId.value === null || addressId === null) return
+    router.push({
+        path: "/admin/supplier/address",
+        query: {
+            supplierId: String(supplierId.value),
+            addressId: String(addressId),
+            fromSupplier: "1",
+        },
+    })
+}
+
 const hydrateFromSupplier = (supplier: SupplierData | null) => {
     if (!supplier) return
 
@@ -78,18 +134,24 @@ const hydrateFromSupplier = (supplier: SupplierData | null) => {
     form.email = supplier.email ?? ""
     form.phone = supplier.phone ?? ""
 
-    if (!Array.isArray(supplier.addresses) || supplier.addresses.length === 0) return
-    const a0 = supplier.addresses[0]
+    if (!Array.isArray(supplier.addresses) || supplier.addresses.length === 0) {
+        form.addresses = []
+        return
+    }
+    if (typeof supplier.addresses[0] === "string") {
+        form.addresses = []
+        return
+    }
 
-    if (typeof a0 === "string") return
-
-    form.addresses[0].id = a0.id ?? null
-    form.addresses[0].label = a0.label ?? ""
-    form.addresses[0].street = a0.street ?? ""
-    form.addresses[0].street2 = a0.street2 ?? null
-    form.addresses[0].postalCode = a0.postalCode ?? ""
-    form.addresses[0].city = a0.city ?? ""
-    form.addresses[0].countryCode = a0.countryCode ?? ""
+    form.addresses = supplier.addresses.map((address) => ({
+        id: address.id ?? null,
+        label: address.label ?? "",
+        street: address.street ?? "",
+        street2: address.street2 ?? null,
+        postalCode: address.postalCode ?? "",
+        city: address.city ?? "",
+        countryCode: address.countryCode ?? "",
+    }))
 }
 
 watch(
@@ -114,36 +176,17 @@ async function validate() {
 
     try {
         const name = form.name.trim()
+        if (!name) {
+            errorMsg.value = String($i18n.t("errors.supplier.nameRequired"))
+            return
+        }
         const email = (form.email ?? "").trim() || null
         const phone = (form.phone ?? "").trim() || null
 
-        const a0 = form.addresses[0]
-
-        const label = a0.label.trim() || name || "Adresse"
-
-        const addressPayload: AddressPayload = {
-            label,
-            street: a0.street.trim(),
-            street2: a0.street2?.trim() || null,
-            postalCode: a0.postalCode.trim(),
-            city: a0.city.trim(),
-            countryCode: a0.countryCode.trim(),
-        }
-
-        let addressId: number
-        if (a0.id) {
-            const updated = await updateAddress(a0.id, addressPayload)
-            addressId = updated.id
-        } else {
-            const created = await createAddress(addressPayload)
-            addressId = created.id
-            a0.id = addressId
-        }
         const supplierPayload: SupplierPayload = {
             name,
             email,
             phone,
-            addresses: [`/api/addresses/${addressId}`],
         }
 
         if (supplierId.value !== null) {
@@ -154,7 +197,8 @@ async function validate() {
 
         await router.push("/admin/supplier/supplier-list")
     } catch (e) {
-        errorMsg.value = "Erreur lors de l’enregistrement."
+        const errorKey = supplierId.value !== null ? "errors.supplier.update" : "errors.supplier.create"
+        errorMsg.value = String($i18n.t(errorKey))
         throw e
     } finally {
         isLoading.value = false
diff --git a/frontend/i18n/locales/fr.json b/frontend/i18n/locales/fr.json
index 4ea1b99..584efa0 100644
--- a/frontend/i18n/locales/fr.json
+++ b/frontend/i18n/locales/fr.json
@@ -37,7 +37,21 @@
             "delete": "Impossible de supprimer le bovin."
         },
         "supplier": {
-            "list": "Impossible de récupérer la liste des fournisseurs."
+            "list": "Impossible de récupérer la liste des fournisseurs.",
+            "fetch": "Impossible de récupérer le fournisseur.",
+            "create": "Impossible de créer le fournisseur.",
+            "update": "Impossible de mettre à jour le fournisseur.",
+            "nameRequired": "Le nom du fournisseur est obligatoire."
+        },
+        "address": {
+            "fetch": "Impossible de récupérer l'adresse.",
+            "create": "Impossible de créer l'adresse.",
+            "update": "Impossible de mettre à jour l'adresse.",
+            "entityNotFound": "Entité introuvable.",
+            "streetRequired": "La rue est obligatoire.",
+            "postalCodeRequired": "Le code postal est obligatoire.",
+            "cityRequired": "La ville est obligatoire.",
+            "countryCodeInvalid": "Le pays doit être un code ISO2 (2 lettres)."
         },
         "truck": {
             "list": "Impossible de récupérer la liste des camions."
@@ -70,6 +84,14 @@
         "reception": {
             "update": "Réception mise à jour avec succès."
         },
+        "supplier": {
+            "create": "Fournisseur créé avec succès.",
+            "update": "Fournisseur mis à jour avec succès."
+        },
+        "address": {
+            "create": "Adresse créée avec succès.",
+            "update": "Adresse mise à jour avec succès."
+        },
         "auth": {
             "update": "Utilisateur mis à jour avec succès.",
             "create": "Utilisateur créé avec succès.",
diff --git a/frontend/pages/admin/supplier/address.vue b/frontend/pages/admin/supplier/address.vue
new file mode 100644
index 0000000..d850bd8
--- /dev/null
+++ b/frontend/pages/admin/supplier/address.vue
@@ -0,0 +1,7 @@
+<template>
+    <AddressAddAddress />
+</template>
+
+<script setup lang="ts">
+definePageMeta({ layout: "admin" })
+</script>
diff --git a/frontend/pages/admin/supplier/supplier-list.vue b/frontend/pages/admin/supplier/supplier-list.vue
index 043d4be..a13fae5 100644
--- a/frontend/pages/admin/supplier/supplier-list.vue
+++ b/frontend/pages/admin/supplier/supplier-list.vue
@@ -30,11 +30,16 @@
             <div v-for="supplier in supplierList" :key="supplier.id">
                 <div
                     v-if="!supplier.addresses || supplier.addresses.length === 0"
-                    class="grid grid-cols-7 border-t gap-4 px-4 py-2 text-slate-400"
+                    class="grid grid-cols-7 border-t gap-4 px-4 py-2 cursor-pointer hover:bg-slate-50"
+                    @click="goToSupplier(supplier.id)"
                 >
                     <div class="truncate">{{ supplier.name }}</div>
                     <div class="truncate">{{ supplier.email }}</div>
-                    <div class="col-span-5">—</div>
+                    <div class="col-span-1">Pas d'adresse</div>
+                    <div class="col-span-1"></div>
+                    <div class="col-span-1"></div>
+                    <div class="col-span-1"></div>
+                    <div class="col-span-1"></div>
                 </div>
 
                 <template v-else-if="isAddressObjectArray(supplier.addresses)">
@@ -42,10 +47,13 @@
                         v-for="(address, idx) in supplier.addresses"
                         :key="address.id ?? `${supplier.id}-${idx}-${address.street}-${address.postalCode}`"
                         class="grid grid-cols-7 hover:bg-slate-50 border-t gap-4 px-4 py-2 cursor-pointer"
+                        :class="idx > 0 ? 'pl-4 border-l-4 border-l-slate-200 bg-slate-50' : ''"
                         @click="goToSupplier(supplier.id)"
                     >
-                        <div class="truncate">{{ supplier.name }}</div>
-                        <div class="truncate">{{ supplier.email }}</div>
+                        <div class="truncate">
+                            {{ idx === 0 ? supplier.name : "↳" }}
+                        </div>
+                        <div class="truncate">{{ idx === 0 ? supplier.email : "" }}</div>
                         <div class="truncate">{{ address.street }}</div>
                         <div class="truncate">{{ address.street2 }}</div>
                         <div>{{ address.postalCode }}</div>
diff --git a/frontend/services/address.ts b/frontend/services/address.ts
index d54b8ad..4b353c8 100644
--- a/frontend/services/address.ts
+++ b/frontend/services/address.ts
@@ -20,6 +20,7 @@ export async function createAddress(
 
     return await api.post<AddressData>('addresses', payload, {
         toastErrorKey: 'errors.address.create',
+        toastSuccessKey: 'success.address.create',
     })
 }
 
@@ -31,5 +32,14 @@ export async function updateAddress(
 
     return await api.patch<AddressData>(`addresses/${id}`, payload, {
         toastErrorKey: 'errors.address.update',
+        toastSuccessKey: 'success.address.update',
+    })
+}
+
+export async function getAddress(id: number): Promise<AddressData> {
+    const api = useApi()
+
+    return await api.get<AddressData>(`addresses/${id}`, {}, {
+        toastErrorKey: 'errors.address.fetch',
     })
 }
diff --git a/frontend/services/dto/supplier-data.ts b/frontend/services/dto/supplier-data.ts
index 26217dc..f44eb4b 100644
--- a/frontend/services/dto/supplier-data.ts
+++ b/frontend/services/dto/supplier-data.ts
@@ -21,5 +21,5 @@ export type SupplierPayload = {
     name: string
     email?: string | null
     phone?: string | null
-    addresses: string[]
+    addresses?: string[]
 }
-- 
2.39.5


From 2b1ee3be3b7914db68c6723c69e7125db83e12f5 Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Wed, 11 Feb 2026 15:49:29 +0100
Subject: [PATCH 6/8] feat : admin fournisseurs creation et modif (WIP)

---
 frontend/components/address.vue               |  82 ++++++
 frontend/components/address/add-address.vue   | 238 ------------------
 .../components/supplier/supplier-form.vue     | 207 ---------------
 frontend/i18n/locales/fr.json                 |  10 +
 frontend/pages/admin/supplier/[[id]].vue      | 189 +++++++++++++-
 frontend/pages/admin/supplier/address.vue     |  42 +++-
 .../pages/admin/supplier/supplier-list.vue    |  45 ++--
 frontend/services/supplier.ts                 |   2 +-
 src/Entity/Supplier.php                       |   5 +
 9 files changed, 351 insertions(+), 469 deletions(-)
 create mode 100644 frontend/components/address.vue
 delete mode 100644 frontend/components/address/add-address.vue
 delete mode 100644 frontend/components/supplier/supplier-form.vue

diff --git a/frontend/components/address.vue b/frontend/components/address.vue
new file mode 100644
index 0000000..d014836
--- /dev/null
+++ b/frontend/components/address.vue
@@ -0,0 +1,82 @@
+<template>
+    <form @submit.prevent="validateForm">
+        <div class="flex items-center justify-between gap-10">
+            <div>
+                <h1 class="text-3xl font-bold uppercase">
+                    {{ props.address ? "Modification d'une adresse" : "Ajout d'une adresse" }}
+                </h1>
+            </div>
+
+            <button
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+                type="submit"
+                :disabled="isLoading"
+            >
+                {{ props.address? "Sauvegarder" : "Ajouter" }}
+            </button>
+        </div>
+
+        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-16 mt-10">
+            <UiTextInput id="address-label" v-model="form.label" label="Libellé" />
+            <UiTextInput id="address-street" v-model="form.street" label="Rue" />
+            <UiTextInput id="address-street2" v-model="form.street2" label="Complément" />
+            <UiTextInput id="address-postalCode" v-model="form.postalCode" label="Code postal" />
+            <UiTextInput id="address-city" v-model="form.city" label="Ville" />
+            <UiTextInput id="address-country" v-model="form.countryCode" label="Pays" />
+        </div>
+    </form>
+</template>
+
+<script setup lang="ts">
+import { AddressPayload } from "~/services/address"
+
+
+const route = useRoute()
+const router = useRouter()
+
+const props = defineProps<{
+    type?: "supplier" | "customer",
+    address?: AddressPayload | null
+}>()
+
+const isLoading = ref(false)
+
+const emptyForm = (): AddressPayload => ({
+    label: "",
+    street: "",
+    street2: null,
+    postalCode: "",
+    city: "",
+    countryCode: "",
+})
+
+const form = reactive<AddressPayload>(emptyForm())
+
+const hydrateForm = (address?: AddressPayload | null) => {
+    console.log(props.address)
+    const data = address ?? emptyForm()
+    form.label = data.label ?? ""
+    form.street = data.street ?? ""
+    form.street2 = data.street2 ?? null
+    form.postalCode = data.postalCode ?? ""
+    form.city = data.city ?? ""
+    form.countryCode = data.countryCode ?? ""
+}
+
+watch(
+    () => props.address,
+    (addr) => {
+        hydrateForm(addr)
+    },
+    { immediate: true }
+)
+
+const validateForm = () => {
+    if (isLoading.value) return
+    emit("validate", {...form})
+}
+
+const emit = defineEmits<{
+    (event: 'validate', form: AddressPayload): void
+}>()
+</script>
diff --git a/frontend/components/address/add-address.vue b/frontend/components/address/add-address.vue
deleted file mode 100644
index f32afd1..0000000
--- a/frontend/components/address/add-address.vue
+++ /dev/null
@@ -1,238 +0,0 @@
-<template>
-    <form @submit.prevent="validate">
-        <div class="flex items-center justify-between gap-10">
-            <div>
-                <h1 class="text-3xl font-bold uppercase">
-                    {{ addressId ? "Modification d'une adresse" : "Ajout d'une adresse" }}
-                </h1>
-                <p v-if="entityName" class="text-sm text-slate-500 mt-1">
-                    {{ entityLabel }} : {{ entityName }}
-                </p>
-            </div>
-
-            <button
-                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
-                type="submit"
-                :disabled="isLoading || entityId === null"
-            >
-                {{ addressId ? "Sauvegarder" : "Ajouter" }}
-            </button>
-        </div>
-
-        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-16 mt-10">
-            <UiTextInput id="address-label" v-model="form.label" label="Libellé" />
-            <UiTextInput id="address-street" v-model="form.street" label="Rue" />
-            <UiTextInput id="address-street2" v-model="form.street2" label="Complément" />
-            <UiTextInput id="address-postalCode" v-model="form.postalCode" label="Code postal" />
-            <UiTextInput id="address-city" v-model="form.city" label="Ville" />
-            <UiTextInput id="address-country" v-model="form.countryCode" label="Pays" />
-        </div>
-
-        <p v-if="errorMsg" class="text-red-600 mt-4">{{ errorMsg }}</p>
-    </form>
-</template>
-
-<script setup lang="ts">
-import { computed, reactive, ref, watch } from "vue"
-import { createAddress, getAddress, updateAddress, type AddressPayload } from "~/services/address"
-import { getSupplier, updateSupplier } from "~/services/supplier"
-import type { SupplierPayload } from "~/services/dto/supplier-data"
-
-const route = useRoute()
-const router = useRouter()
-const { $i18n } = useNuxtApp()
-
-type AddressOwner = {
-    id: number
-    name?: string | null
-    email?: string | null
-    phone?: string | null
-    addresses?: unknown
-}
-
-type AddressOwnerAdapter = {
-    loadEntity: (id: number) => Promise<AddressOwner>
-    updateEntity: (id: number, payload: unknown) => Promise<unknown>
-    buildUpdatePayload: (owner: AddressOwner | null, addresses: string[]) => unknown
-    getEntityName: (owner: AddressOwner | null) => string
-    normalizeAddresses: (addresses: AddressOwner["addresses"]) => string[]
-}
-
-const props = defineProps<{
-    entityType?: "supplier" | "customer"
-    entityId?: number | null
-    returnPath?: string
-    adapter?: Partial<AddressOwnerAdapter>
-}>()
-
-const resolveId = (param: unknown) => {
-    const idStr = Array.isArray(param) ? param[0] : param
-    if (!idStr) return null
-    const id = Number(idStr)
-    return Number.isFinite(id) ? id : null
-}
-
-const entityType = computed<"supplier" | "customer">(() => {
-    if (props.entityType) return props.entityType
-    const queryType = route.query.entityType
-    if (queryType === "customer" || queryType === "supplier") return queryType
-    const path = route.path
-    if (path.includes("/customer/")) return "customer"
-    return "supplier"
-})
-
-const entityId = computed(() => {
-    if (props.entityId !== undefined) return props.entityId ?? null
-    const typeKey = `${entityType.value}Id`
-    return resolveId(route.query[typeKey]) ?? resolveId(route.query.entityId)
-})
-const addressId = computed(() => resolveId(route.query.addressId))
-
-const entity = ref<AddressOwner | null>(null)
-const entityName = computed(() => activeAdapter.value.getEntityName(entity.value))
-const entityLabel = computed(() => (entityType.value === "customer" ? "Client" : "Fournisseur"))
-
-const isLoading = ref(false)
-const errorMsg = ref<string | null>(null)
-
-const form = reactive<AddressPayload>({
-    label: "",
-    street: "",
-    street2: null,
-    postalCode: "",
-    city: "",
-    countryCode: "",
-})
-
-const defaultSupplierAdapter: AddressOwnerAdapter = {
-    loadEntity: getSupplier,
-    updateEntity: updateSupplier,
-    buildUpdatePayload: (owner, addresses) => ({
-        name: owner?.name ?? "",
-        email: owner?.email ?? null,
-        phone: owner?.phone ?? null,
-        addresses,
-    } satisfies SupplierPayload),
-    getEntityName: (owner) => owner?.name ?? "",
-    normalizeAddresses: (value) => {
-        if (!Array.isArray(value) || value.length === 0) return []
-        if (typeof value[0] === "string") {
-            return value.filter((item): item is string => typeof item === "string")
-        }
-        return value
-            .map((address) =>
-                address && typeof address === "object" && "id" in address && address.id
-                    ? `/api/addresses/${address.id}`
-                    : null
-            )
-            .filter((item): item is string => Boolean(item))
-    },
-}
-
-const activeAdapter = computed<AddressOwnerAdapter>(() => ({
-    ...defaultSupplierAdapter,
-    ...props.adapter,
-}))
-
-watch(
-    () => [entityId.value, addressId.value] as const,
-    async ([entityIdValue, addressIdValue]) => {
-        if (entityIdValue === null) {
-            entity.value = null
-            return
-        }
-        isLoading.value = true
-        try {
-            entity.value = await activeAdapter.value.loadEntity(entityIdValue)
-            if (addressIdValue !== null) {
-                const address = await getAddress(addressIdValue)
-                form.label = address.label ?? ""
-                form.street = address.street ?? ""
-                form.street2 = address.street2 ?? null
-                form.postalCode = address.postalCode ?? ""
-                form.city = address.city ?? ""
-                form.countryCode = address.countryCode ?? ""
-            } else {
-                form.label = ""
-                form.street = ""
-                form.street2 = null
-                form.postalCode = ""
-                form.city = ""
-                form.countryCode = ""
-            }
-        } finally {
-            isLoading.value = false
-        }
-    },
-    { immediate: true }
-)
-
-async function validate() {
-    if (isLoading.value) return
-    if (entityId.value === null) {
-        errorMsg.value = String($i18n.t("errors.address.entityNotFound"))
-        return
-    }
-    errorMsg.value = null
-    isLoading.value = true
-
-    try {
-        if (!entity.value) {
-            entity.value = await activeAdapter.value.loadEntity(entityId.value)
-        }
-
-        const payload: AddressPayload = {
-            label: form.label.trim() || entityName.value || "Adresse",
-            street: form.street.trim(),
-            street2: form.street2?.trim() || null,
-            postalCode: form.postalCode.trim(),
-            city: form.city.trim(),
-            countryCode: form.countryCode.trim().toUpperCase(),
-        }
-        if (!payload.street) {
-            errorMsg.value = String($i18n.t("errors.address.streetRequired"))
-            return
-        }
-        if (!payload.postalCode) {
-            errorMsg.value = String($i18n.t("errors.address.postalCodeRequired"))
-            return
-        }
-        if (!payload.city) {
-            errorMsg.value = String($i18n.t("errors.address.cityRequired"))
-            return
-        }
-        if (payload.countryCode.length !== 2) {
-            errorMsg.value = String($i18n.t("errors.address.countryCodeInvalid"))
-            return
-        }
-
-        let updatedAddressId = addressId.value
-        if (addressId.value !== null) {
-            const updated = await updateAddress(addressId.value, payload)
-            updatedAddressId = updated.id
-        } else {
-            const created = await createAddress(payload)
-            updatedAddressId = created.id
-        }
-
-        if (updatedAddressId !== null) {
-            const existingAddresses = activeAdapter.value.normalizeAddresses(entity.value?.addresses ?? [])
-            const updatedAddresses = existingAddresses.includes(`/api/addresses/${updatedAddressId}`)
-                ? existingAddresses
-                : [...existingAddresses, `/api/addresses/${updatedAddressId}`]
-
-            const updatePayload = activeAdapter.value.buildUpdatePayload(entity.value, updatedAddresses)
-            await activeAdapter.value.updateEntity(entityId.value, updatePayload)
-        }
-        const returnPath =
-            props.returnPath ?? `/admin/${entityType.value}/${entityId.value}`
-        await router.push(returnPath)
-    } catch (e) {
-        const errorKey = addressId.value !== null ? "errors.address.update" : "errors.address.create"
-        errorMsg.value = String($i18n.t(errorKey))
-        throw e
-    } finally {
-        isLoading.value = false
-    }
-}
-</script>
diff --git a/frontend/components/supplier/supplier-form.vue b/frontend/components/supplier/supplier-form.vue
deleted file mode 100644
index 037298c..0000000
--- a/frontend/components/supplier/supplier-form.vue
+++ /dev/null
@@ -1,207 +0,0 @@
-<template>
-    <form @submit.prevent="validate">
-        <div class="flex items-center justify-between gap-10">
-            <h1 class="text-3xl font-bold uppercase">
-                {{ supplierId ? "Modifications du fournisseur" : "Ajout d'un fournisseur" }}
-            </h1>
-
-            <button
-                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
-                type="submit"
-                :disabled="isLoading"
-            >
-                {{ supplierId ? "Sauvegarder" : "Ajouter" }}
-            </button>
-        </div>
-
-        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-10">
-            <UiTextInput id="supplier-name" v-model="form.name" label="Nom du fournisseur" />
-            <UiTextInput id="supplier-email" v-model="form.email" label="Email" />
-            <UiTextInput id="supplier-phone" v-model="form.phone" label="Téléphone" />
-        </div>
-
-        <div class="flex items-center justify-between mb-4">
-            <h2 class="text-2xl font-bold uppercase">Adresse fournisseur</h2>
-            <button
-                type="button"
-                class="text-sm uppercase bg-primary-500 text-white h-[40px] px-6"
-                :disabled="supplierId === null"
-                @click="goToAddAddress"
-            >
-                Ajouter
-            </button>
-        </div>
-        <div class="overflow-x-auto mb-10">
-            <table class="w-full border-collapse">
-                <thead>
-                    <tr class="text-left border-b border-gray-200">
-                        <th class="py-3 pr-4 text-sm uppercase">Libellé</th>
-                        <th class="py-3 pr-4 text-sm uppercase">Rue</th>
-                        <th class="py-3 pr-4 text-sm uppercase">Complément</th>
-                        <th class="py-3 pr-4 text-sm uppercase">Code postal</th>
-                        <th class="py-3 pr-4 text-sm uppercase">Ville</th>
-                        <th class="py-3 pr-4 text-sm uppercase">Pays</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <template v-if="form.addresses.length === 0">
-                        <tr>
-                            <td colspan="6" class="py-4 text-slate-400">
-                                Aucune adresse.
-                            </td>
-                        </tr>
-                    </template>
-                    <template v-else>
-                        <tr
-                            v-for="(address, index) in form.addresses"
-                            :key="address.id ?? index"
-                            class="border-b border-gray-100 cursor-pointer hover:bg-slate-50"
-                            @click="goToEditAddress(address.id ?? null)"
-                        >
-                            <td class="py-3 pr-4">{{ address.label || "—" }}</td>
-                            <td class="py-3 pr-4">{{ address.street || "—" }}</td>
-                            <td class="py-3 pr-4">{{ address.street2 || "—" }}</td>
-                            <td class="py-3 pr-4">{{ address.postalCode || "—" }}</td>
-                            <td class="py-3 pr-4">{{ address.city || "—" }}</td>
-                            <td class="py-3 pr-4">{{ address.countryCode || "—" }}</td>
-                        </tr>
-                    </template>
-                </tbody>
-            </table>
-        </div>
-
-        <p v-if="errorMsg" class="text-red-600 mt-4">{{ errorMsg }}</p>
-    </form>
-</template>
-
-<script setup lang="ts">
-import { computed, reactive, ref, watch } from "vue"
-import { createSupplier, getSupplier, updateSupplier } from "~/services/supplier"
-import type { SupplierData, SupplierFormData, SupplierPayload } from "~/services/dto/supplier-data"
-
-definePageMeta({ layout: "admin" })
-
-const route = useRoute()
-const router = useRouter()
-const { $i18n } = useNuxtApp()
-
-const resolveId = (param: unknown) => {
-    const idStr = Array.isArray(param) ? param[0] : param
-    if (!idStr) return null
-    const id = Number(idStr)
-    return Number.isFinite(id) ? id : null
-}
-
-const supplierId = computed(() => resolveId(route.params.id))
-
-const isLoading = ref(false)
-const errorMsg = ref<string | null>(null)
-
-const form = reactive<SupplierFormData>({
-    name: "",
-    email: "",
-    phone: "",
-    addresses: [],
-})
-
-const goToAddAddress = () => {
-    if (supplierId.value === null) return
-    router.push({
-        path: "/admin/supplier/address",
-        query: {
-            supplierId: String(supplierId.value),
-            fromSupplier: "1",
-        },
-    })
-}
-
-const goToEditAddress = (addressId: number | null) => {
-    if (supplierId.value === null || addressId === null) return
-    router.push({
-        path: "/admin/supplier/address",
-        query: {
-            supplierId: String(supplierId.value),
-            addressId: String(addressId),
-            fromSupplier: "1",
-        },
-    })
-}
-
-const hydrateFromSupplier = (supplier: SupplierData | null) => {
-    if (!supplier) return
-
-    form.name = supplier.name ?? ""
-    form.email = supplier.email ?? ""
-    form.phone = supplier.phone ?? ""
-
-    if (!Array.isArray(supplier.addresses) || supplier.addresses.length === 0) {
-        form.addresses = []
-        return
-    }
-    if (typeof supplier.addresses[0] === "string") {
-        form.addresses = []
-        return
-    }
-
-    form.addresses = supplier.addresses.map((address) => ({
-        id: address.id ?? null,
-        label: address.label ?? "",
-        street: address.street ?? "",
-        street2: address.street2 ?? null,
-        postalCode: address.postalCode ?? "",
-        city: address.city ?? "",
-        countryCode: address.countryCode ?? "",
-    }))
-}
-
-watch(
-    () => supplierId.value,
-    async (id) => {
-        if (id === null) return
-        isLoading.value = true
-        try {
-            const supplier = await getSupplier(id)
-            hydrateFromSupplier(supplier)
-        } finally {
-            isLoading.value = false
-        }
-    },
-    { immediate: true }
-)
-
-async function validate() {
-    if (isLoading.value) return
-    isLoading.value = true
-    errorMsg.value = null
-
-    try {
-        const name = form.name.trim()
-        if (!name) {
-            errorMsg.value = String($i18n.t("errors.supplier.nameRequired"))
-            return
-        }
-        const email = (form.email ?? "").trim() || null
-        const phone = (form.phone ?? "").trim() || null
-
-        const supplierPayload: SupplierPayload = {
-            name,
-            email,
-            phone,
-        }
-
-        if (supplierId.value !== null) {
-            await updateSupplier(supplierId.value, supplierPayload)
-        } else {
-            await createSupplier(supplierPayload)
-        }
-
-        await router.push("/admin/supplier/supplier-list")
-    } catch (e) {
-        const errorKey = supplierId.value !== null ? "errors.supplier.update" : "errors.supplier.create"
-        errorMsg.value = String($i18n.t(errorKey))
-        throw e
-    } finally {
-        isLoading.value = false
-    }
-}
-</script>
diff --git a/frontend/i18n/locales/fr.json b/frontend/i18n/locales/fr.json
index 584efa0..87c0d3d 100644
--- a/frontend/i18n/locales/fr.json
+++ b/frontend/i18n/locales/fr.json
@@ -53,6 +53,12 @@
             "cityRequired": "La ville est obligatoire.",
             "countryCodeInvalid": "Le pays doit être un code ISO2 (2 lettres)."
         },
+        "customer": {
+            "list": "Impossible de récupérer la liste des clients.",
+            "fetch": "Impossible de récupérer le client.",
+            "create": "Impossible de créer le client.",
+            "update": "Impossible de mettre à jour le client."
+        },
         "truck": {
             "list": "Impossible de récupérer la liste des camions."
         },
@@ -92,6 +98,10 @@
             "create": "Adresse créée avec succès.",
             "update": "Adresse mise à jour avec succès."
         },
+        "customer": {
+            "create": "Client créé avec succès.",
+            "update": "Client mis à jour avec succès."
+        },
         "auth": {
             "update": "Utilisateur mis à jour avec succès.",
             "create": "Utilisateur créé avec succès.",
diff --git a/frontend/pages/admin/supplier/[[id]].vue b/frontend/pages/admin/supplier/[[id]].vue
index 9624710..f80fd0b 100644
--- a/frontend/pages/admin/supplier/[[id]].vue
+++ b/frontend/pages/admin/supplier/[[id]].vue
@@ -1,8 +1,191 @@
 <template>
-    <SupplierForm/>
+    <form @submit.prevent="validate">
+        <div class="flex items-center justify-between gap-10">
+            <h1 class="text-3xl font-bold uppercase">
+                {{ supplierId ? "Modifications du fournisseur" : "Ajout d'un fournisseur" }}
+            </h1>
+
+            <button
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+                type="submit"
+                :disabled="isLoading || !auth.isAdmin"
+            >
+                {{ supplierId ? "Sauvegarder" : "Ajouter" }}
+            </button>
+        </div>
+
+        <div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-10 py-12  border-b border-black ">
+            <UiTextInput id="supplier-name" v-model="form.name" label="Nom du fournisseur" :disabled="!auth.isAdmin"/>
+            <UiTextInput id="supplier-email" v-model="form.email" label="Email" :disabled="!auth.isAdmin"/>
+            <UiTextInput id="supplier-phone" v-model="form.phone" label="Téléphone" :disabled="!auth.isAdmin"/>
+        </div>
+
+        <div class="flex items-center justify-between mb-4 py-6 border-t border-black"></div>
+        <div class="flex items-center justify-between mb-4">
+            <h2 class="text-3xl font-bold uppercase">Adresses fournisseur</h2>
+            <button
+                type="button"
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+                :disabled="supplierId === null || !auth.isAdmin"
+                @click="goToAddAddress"
+            >
+                Ajouter
+            </button>
+        </div>
+        <div class="overflow-x-auto mb-10">
+            <table class="w-full border-collapse">
+                <thead>
+                <tr class="text-left border-b border-gray-200">
+                    <th class="py-3 pr-4 text-sm uppercase">Libellé</th>
+                    <th class="py-3 pr-4 text-sm uppercase">Rue</th>
+                    <th class="py-3 pr-4 text-sm uppercase">Complément</th>
+                    <th class="py-3 pr-4 text-sm uppercase">Code postal</th>
+                    <th class="py-3 pr-4 text-sm uppercase">Ville</th>
+                    <th class="py-3 pr-4 text-sm uppercase">Pays</th>
+                </tr>
+                </thead>
+                <tbody>
+                <template v-if="form.addresses.length === 0">
+                    <tr>
+                        <td colspan="6" class="py-4 text-slate-400">
+                            Aucune adresse.
+                        </td>
+                    </tr>
+                </template>
+                <template v-else>
+                    <tr
+                        v-for="(address, index) in form.addresses"
+                        :key="address.id ?? index"
+                        class="border-b border-gray-100 hover:bg-slate-50"
+                        :class="auth.isAdmin ? 'cursor-pointer' : 'cursor-not-allowed opacity-60'"
+                        @click="goToEditAddress(address.id ?? null)"
+                    >
+                        <td class="py-3 pr-4">{{ address.label || "—" }}</td>
+                        <td class="py-3 pr-4">{{ address.street || "—" }}</td>
+                        <td class="py-3 pr-4">{{ address.street2 || "—" }}</td>
+                        <td class="py-3 pr-4">{{ address.postalCode || "—" }}</td>
+                        <td class="py-3 pr-4">{{ address.city || "—" }}</td>
+                        <td class="py-3 pr-4">{{ address.countryCode || "—" }}</td>
+                    </tr>
+                </template>
+                </tbody>
+            </table>
+        </div>
+    </form>
 </template>
+
 <script setup lang="ts">
-definePageMeta({
-    layout: 'admin'
+import {computed, reactive, ref, watch} from "vue"
+import {createSupplier, getSupplier, updateSupplier} from "~/services/supplier"
+import type {SupplierData, SupplierFormData, SupplierPayload} from "~/services/dto/supplier-data"
+import {useAuthStore} from "~/stores/auth"
+
+definePageMeta({layout: "admin"})
+
+const route = useRoute()
+const router = useRouter()
+const auth = useAuthStore()
+
+const resolveId = (param: unknown) => {
+    const idStr = Array.isArray(param) ? param[0] : param
+    if (!idStr) return null
+    const id = Number(idStr)
+    return Number.isFinite(id) ? id : null
+}
+const supplierId = computed(() => resolveId(route.params.id))
+const isLoading = ref(false)
+const form = reactive<SupplierFormData>({
+    name: "",
+    email: "",
+    phone: "",
+    addresses: [],
 })
+
+const goToAddAddress = () => {
+    if (supplierId.value === null || !auth.isAdmin) return
+    router.push({
+        path: "/admin/supplier/address",
+        query: {
+            supplierId: String(supplierId.value),
+            fromSupplier: "1",
+        },
+    })
+}
+
+const goToEditAddress = (addressId: number | null) => {
+    if (supplierId.value === null || addressId === null || !auth.isAdmin) return
+    router.push({
+        path: "/admin/supplier/address",
+        query: {
+            supplierId: String(supplierId.value),
+            addressId: String(addressId),
+            fromSupplier: "1",
+        },
+    })
+}
+
+const hydrateFromSupplier = (supplier: SupplierData | null) => {
+    if (!supplier) return
+    if (!Array.isArray(supplier.addresses) || supplier.addresses.length === 0) {
+        form.addresses = []
+        return
+    }
+    if (typeof supplier.addresses[0] === "string") {
+        form.addresses = []
+        return
+    }
+
+    form.addresses = supplier.addresses.map((address) => ({
+        id: address.id ?? null,
+        label: address.label ?? "",
+        street: address.street ?? "",
+        street2: address.street2 ?? null,
+        postalCode: address.postalCode ?? "",
+        city: address.city ?? "",
+        countryCode: address.countryCode ?? "",
+    }))
+}
+
+watch(
+    () => supplierId.value,
+    async (id) => {
+        if (id === null) return
+        isLoading.value = true
+        try {
+            const supplier = await getSupplier(id)
+            hydrateFromSupplier(supplier)
+        } finally {
+            isLoading.value = false
+        }
+    },
+    {immediate: true}
+)
+
+async function validate() {
+    if (isLoading.value) return
+    if (!auth.isAdmin) return
+    isLoading.value = true
+
+    try {
+        const name = form.name.trim()
+        const email = (form.email ?? "").trim() || null
+        const phone = (form.phone ?? "").trim() || null
+
+        const supplierPayload: SupplierPayload = {
+            name,
+            email,
+            phone,
+        }
+
+        if (supplierId.value !== null) {
+            await updateSupplier(supplierId.value, supplierPayload)
+        } else {
+            await createSupplier(supplierPayload)
+        }
+
+        await router.push("/admin/supplier/supplier-list")
+    } finally {
+        isLoading.value = false
+    }
+}
 </script>
diff --git a/frontend/pages/admin/supplier/address.vue b/frontend/pages/admin/supplier/address.vue
index d850bd8..c13a0f3 100644
--- a/frontend/pages/admin/supplier/address.vue
+++ b/frontend/pages/admin/supplier/address.vue
@@ -1,7 +1,47 @@
 <template>
-    <AddressAddAddress />
+    <Address type="supplier" :address="address" @validate="validate"/>
 </template>
 
 <script setup lang="ts">
+import type {AddressData, AddressPayload} from "~/services/address";
+import {createAddress, getAddress, updateAddress} from "~/services/address";
+import {getSupplier, updateSupplier} from "~/services/supplier";
+import type {SupplierData} from "~/services/dto/supplier-data";
+
 definePageMeta({ layout: "admin" })
+
+const route = useRoute()
+const router = useRouter()
+const supplierId = computed(() => { return Number(route.query.supplierId) })
+const supplier = ref<SupplierData|null>(null);
+const addressId = computed(() => { return route.query.addressId !== undefined ? Number(route.query.addressId) : null })
+const address = ref<AddressData|null>(null)
+
+const validate = async (address: AddressPayload) => {
+    try {
+        if (addressId.value !== null) {
+            await updateAddress(addressId.value, address)
+        } else {
+            await addAddress(address)
+        }
+    } finally {
+        await router.push('/admin/supplier/' + supplierId.value)
+    }
+}
+
+const addAddress = async (address: AddressPayload) => {
+    const response: AddressData = await createAddress(address)
+    const addressIRI = `/api/addresses/${response.id}`
+    const existingIris = (supplier.value.addresses ?? []).map((item: any) => `/api/addresses/${item.id}`)
+    const next = [...new Set([...existingIris, addressIRI])]
+
+    return await updateSupplier(supplierId.value, { addresses: next })
+}
+
+onMounted(async () => {
+    supplier.value = await getSupplier(supplierId.value)
+    if (addressId.value !== null) {
+        address.value = await getAddress(addressId.value)
+    }
+})
 </script>
diff --git a/frontend/pages/admin/supplier/supplier-list.vue b/frontend/pages/admin/supplier/supplier-list.vue
index a13fae5..9f231f9 100644
--- a/frontend/pages/admin/supplier/supplier-list.vue
+++ b/frontend/pages/admin/supplier/supplier-list.vue
@@ -4,12 +4,14 @@
         <NuxtLink
             to="/admin/supplier"
             class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+            :class="auth.isAdmin ? '' : 'cursor-not-allowed opacity-60'"
+            @click="handleAddClick"
         >
             Ajouter
         </NuxtLink>
     </div>
 
-    <div class="mt-6 border border-slate-200 mb-16">
+    <div v-if="auth.isAdmin" class="mt-6 border border-slate-200 mb-16">
         <div class="max-h-96 overflow-y-auto">
             <div
                 class="sticky top-0 z-10 grid grid-cols-7 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide"
@@ -30,19 +32,19 @@
             <div v-for="supplier in supplierList" :key="supplier.id">
                 <div
                     v-if="!supplier.addresses || supplier.addresses.length === 0"
-                    class="grid grid-cols-7 border-t gap-4 px-4 py-2 cursor-pointer hover:bg-slate-50"
+                    class="grid grid-cols-7 border-t gap-4 px-4 py-2 hover:bg-slate-50 cursor-pointer"
                     @click="goToSupplier(supplier.id)"
                 >
                     <div class="truncate">{{ supplier.name }}</div>
                     <div class="truncate">{{ supplier.email }}</div>
                     <div class="col-span-1">Pas d'adresse</div>
-                    <div class="col-span-1"></div>
-                    <div class="col-span-1"></div>
-                    <div class="col-span-1"></div>
-                    <div class="col-span-1"></div>
+                    <div class="uppercase truncate">{{"—"}}</div>
+                    <div class="uppercase truncate">{{"—"}}</div>
+                    <div class="uppercase truncate">{{"—"}}</div>
+                    <div class="uppercase truncate">{{"—"}}</div>
                 </div>
 
-                <template v-else-if="isAddressObjectArray(supplier.addresses)">
+                <template v-else-if="supplier.addresses.length > 0">
                     <div
                         v-for="(address, idx) in supplier.addresses"
                         :key="address.id ?? `${supplier.id}-${idx}-${address.street}-${address.postalCode}`"
@@ -53,12 +55,12 @@
                         <div class="truncate">
                             {{ idx === 0 ? supplier.name : "↳" }}
                         </div>
-                        <div class="truncate">{{ idx === 0 ? supplier.email : "" }}</div>
-                        <div class="truncate">{{ address.street }}</div>
-                        <div class="truncate">{{ address.street2 }}</div>
-                        <div>{{ address.postalCode }}</div>
-                        <div class="uppercase truncate">{{ address.city }}</div>
-                        <div class="uppercase truncate">{{ address.countryCode }}</div>
+                        <div class="truncate">{{ idx === 0 ? supplier.email : ""  }}</div>
+                        <div class="truncate">{{ address.street || "—" }}</div>
+                        <div class="truncate">{{ address.street2 || "—" }}</div>
+                        <div>{{ address.postalCode || "—"  }}</div>
+                        <div class="uppercase truncate">{{ address.city || "—"  }}</div>
+                        <div class="uppercase truncate">{{ address.countryCode || "—" }}</div>
                     </div>
                 </template>
 
@@ -70,36 +72,41 @@
                         <div class="truncate">{{ supplier.name }}</div>
                         <div class="truncate">{{ supplier.email }}</div>
                         <div class="col-span-5 text-slate-400">
-                            Adresses non chargées (IRIs)
+                            Adresses non chargées
                         </div>
                     </div>
                 </template>
             </div>
         </div>
     </div>
+    <div v-else class="mt-6 border border-slate-200 mb-16 px-4 py-6 text-slate-400">
+        Accès réservé aux administrateurs.
+    </div>
 </template>
 
 <script setup lang="ts">
 import { getSupplierList } from "~/services/supplier"
 import type { SupplierData } from "~/services/dto/supplier-data"
-import type { AddressFormData } from "~/services/dto/address-data"
+import { useAuthStore } from "~/stores/auth"
 
 definePageMeta({ layout: "admin" })
 
 const supplierList = ref<SupplierData[]>([])
 const router = useRouter()
+const auth = useAuthStore()
 
 const goToSupplier = (id: number) => {
+    if (!auth.isAdmin) return
     router.push(`/admin/supplier/${id}`)
 }
 
-function isAddressObjectArray(value: SupplierData["addresses"]): value is AddressFormData[] {
-    if (!Array.isArray(value) || value.length === 0) return false
-    const v0 = value[0]
-    return typeof v0 === "object" && v0 !== null && "street" in v0 && "postalCode" in v0
+const handleAddClick = (event: Event) => {
+    if (auth.isAdmin) return
+    event.preventDefault()
 }
 
 onMounted(async () => {
+    if (!auth.isAdmin) return
     supplierList.value = await getSupplierList()
 })
 </script>
diff --git a/frontend/services/supplier.ts b/frontend/services/supplier.ts
index bc3ce84..9a47e40 100644
--- a/frontend/services/supplier.ts
+++ b/frontend/services/supplier.ts
@@ -25,7 +25,7 @@ export async function getSupplier(id: number): Promise<SupplierData> {
     })
 }
 
-export async function updateSupplier(id: number, payload: SupplierPayload): Promise<SupplierData> {
+export async function updateSupplier(id: number, payload: Partial<SupplierPayload>): Promise<SupplierData> {
     const api = useApi()
     return api.patch<SupplierData>(`suppliers/${id}`, payload, {
         toastErrorKey: "errors.supplier.update",
diff --git a/src/Entity/Supplier.php b/src/Entity/Supplier.php
index 23c172f..5e467cd 100644
--- a/src/Entity/Supplier.php
+++ b/src/Entity/Supplier.php
@@ -26,6 +26,11 @@ use Symfony\Component\Serializer\Attribute\Groups;
         new GetCollection(
             normalizationContext: ['groups' => ['supplier:read']],
         ),
+        new GetCollection(
+            uriTemplate: '/admin/suppliers',
+            normalizationContext: ['groups' => ['supplier:read']],
+            security: "is_granted('ROLE_ADMIN')"
+        ),
         new Post(
             normalizationContext: ['groups' => ['supplier:read']],
             denormalizationContext: ['groups' => ['supplier:write']],
-- 
2.39.5


From 8a4f135a3db069acdcf117ba40dfc454625cc9f9 Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Wed, 11 Feb 2026 15:52:57 +0100
Subject: [PATCH 7/8] feat : admin fournisseurs creation et modif (WIP)

---
 frontend/pages/admin/supplier/[[id]].vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/frontend/pages/admin/supplier/[[id]].vue b/frontend/pages/admin/supplier/[[id]].vue
index f80fd0b..d3e39a5 100644
--- a/frontend/pages/admin/supplier/[[id]].vue
+++ b/frontend/pages/admin/supplier/[[id]].vue
@@ -126,6 +126,9 @@ const goToEditAddress = (addressId: number | null) => {
 
 const hydrateFromSupplier = (supplier: SupplierData | null) => {
     if (!supplier) return
+    form.name = supplier.name ?? ""
+    form.email = supplier.email ?? ""
+    form.phone = supplier.phone ?? ""
     if (!Array.isArray(supplier.addresses) || supplier.addresses.length === 0) {
         form.addresses = []
         return
-- 
2.39.5


From 785d3231dc6d5af2aaa2a02a97b39db428f0ddfc Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Thu, 12 Feb 2026 08:45:50 +0100
Subject: [PATCH 8/8] fix : review MR

---
 frontend/components/address.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/components/address.vue b/frontend/components/address.vue
index d014836..d24f5eb 100644
--- a/frontend/components/address.vue
+++ b/frontend/components/address.vue
@@ -53,7 +53,6 @@ const emptyForm = (): AddressPayload => ({
 const form = reactive<AddressPayload>(emptyForm())
 
 const hydrateForm = (address?: AddressPayload | null) => {
-    console.log(props.address)
     const data = address ?? emptyForm()
     form.label = data.label ?? ""
     form.street = data.street ?? ""
-- 
2.39.5