feat(catalog) : M6 — écran Modification produit + onglets placeholder (ERP-206)

Écran de modification (ajout pré-rempli, bouton « Enregistrer ») et pose des onglets Fournisseurs/Clients en placeholder « en cours de développement ». - route /admin/products/{id}/edit : useProduct(id) charge le détail, prefill du formulaire principal - RG-6.08 : useProductForm en mode édition → PATCH /products/{id} (merge-patch), bouton « Enregistrer » - unicité du code re-validée serveur en édition (409 doublon mappé inline) - onglets Fournisseurs + Clients : ComingSoonPlaceholder, aucun appel API ni champ (HP-M6-01 / RG-6.10) - mêmes onglets placeholder posés sur l'écran Ajouter (cohérence) - i18n admin.products.edit / tab ; 11 tests Vitest (prefill + PATCH + placeholder)
2026-06-25 18:01:33 +02:00
parent ce0e274743
commit 64c3b9b6ec
10 changed files with 544 additions and 10 deletions
@@ -6,6 +6,7 @@ import { useProductForm } from '../useProductForm'
 // Stubs des auto-imports Nuxt consommes par le composable + ses dependances.
 const mockGet = vi.hoisted(() => vi.fn())
 const mockPost = vi.hoisted(() => vi.fn())
+const mockPatch = vi.hoisted(() => vi.fn())
 const mockToastSuccess = vi.hoisted(() => vi.fn())
 const mockToastError = vi.hoisted(() => vi.fn())

@@ -13,7 +14,7 @@ vi.stubGlobal('useApi', () => ({
    get: mockGet,
    post: mockPost,
    put: vi.fn(),
-    patch: vi.fn(),
+    patch: mockPatch,
    delete: vi.fn(),
 }))
 vi.stubGlobal('useToast', () => ({
@@ -51,6 +52,7 @@ describe('useProductForm', () => {
    beforeEach(() => {
        mockGet.mockReset()
        mockPost.mockReset()
+        mockPatch.mockReset()
        mockToastSuccess.mockReset()
        mockToastError.mockReset()

@@ -217,4 +219,69 @@ describe('useProductForm', () => {
            expect(mockToastError).not.toHaveBeenCalled()
        })
    })
+
+    describe('RG-6.08 — mode edition (prefill + PATCH)', () => {
+        // Produit charge (memes cles que la reponse reelle § 4.0.bis : @id sur les relations).
+        const PRODUCT = {
+            id: 34,
+            code: 'BLE-01',
+            name: 'Blé tendre',
+            states: ['PURCHASE', 'SALE'],
+            manufactured: true,
+            containsMolasses: false,
+            category: { '@id': '/api/categories/12', id: 12, name: 'Céréales', code: 'CEREALES' },
+            sites: [{ '@id': '/api/sites/1', id: 1, name: 'Chatellerault', code: '86', postalCode: '86100', city: 'C', color: '#000', fullAddress: 'x' }],
+            storageTypes: [{ '@id': '/api/storage_types/9', id: 9, code: 'TAS', label: 'Tas' }],
+            createdAt: '', updatedAt: '',
+        }
+
+        it('pre-remplit le formulaire depuis le produit (relations en IRI) + charge le stockage', async () => {
+            const { form, prefill, storageTypeOptions } = useProductForm()
+            await prefill(PRODUCT)
+
+            expect(form.code).toBe('BLE-01')
+            expect(form.name).toBe('Blé tendre')
+            expect(form.states).toEqual(['PURCHASE', 'SALE'])
+            expect(form.categoryIri).toBe('/api/categories/12')
+            expect(form.siteIris).toEqual(['/api/sites/1'])
+            expect(form.storageTypeIris).toEqual(['/api/storage_types/9'])
+            expect(form.manufactured).toBe(true)
+            // Cascade : options de stockage chargees pour le site du produit.
+            expect(mockGet).toHaveBeenCalledWith(
+                '/storage_types',
+                expect.objectContaining({ 'siteId[]': ['1'] }),
+                expect.any(Object),
+            )
+            expect(storageTypeOptions.value.map(o => o.value)).toContain('/api/storage_types/9')
+        })
+
+        it('soumet un PATCH /products/{id} apres prefill (RG-6.08)', async () => {
+            mockPatch.mockResolvedValueOnce({ id: 34 })
+            const { prefill, submit } = useProductForm()
+            await prefill(PRODUCT)
+
+            const ok = await submit()
+
+            expect(ok).toBe(true)
+            expect(mockPost).not.toHaveBeenCalled()
+            expect(mockPatch).toHaveBeenCalledWith(
+                '/products/34',
+                expect.objectContaining({ code: 'BLE-01', name: 'Blé tendre' }),
+                expect.objectContaining({ toast: false }),
+            )
+            expect(mockToastSuccess).toHaveBeenCalled()
+        })
+
+        it('mappe un 409 doublon de code aussi en edition', async () => {
+            mockPatch.mockRejectedValueOnce({ response: { status: 409, _data: {} } })
+            const { errors, prefill, submit } = useProductForm()
+            await prefill(PRODUCT)
+
+            const ok = await submit()
+
+            expect(ok).toBe(false)
+            expect(errors.code).toBe('admin.products.form.duplicateCode')
+            expect(mockToastError).toHaveBeenCalled()
+        })
+    })
 })
@@ -0,0 +1,41 @@
+import { ref } from 'vue'
+import type { Product } from '~/modules/catalog/types/product'
+
+/**
+ * Chargement d'un produit unique (ecran « Modification produit », M6 — ERP-206).
+ * Lit le detail via `GET /api/products/{id}` — meme structure que la ligne de
+ * liste (category / sites / storageTypes embarques, § 4.0.bis).
+ *
+ * L'en-tete `Accept: application/ld+json` est impose pour obtenir le payload
+ * Hydra complet (IRI `@id` des relations, necessaires au pre-remplissage des
+ * selects). Etat 100 % local a l'instance (refs) — aucune persistance URL.
+ */
+export function useProduct(id: number | string) {
+    const api = useApi()
+
+    const product = ref<Product | null>(null)
+    const loading = ref(false)
+    const error = ref(false)
+
+    /** Charge le detail du produit. En cas d'echec : `error = true`, `product = null`. */
+    async function load(): Promise<void> {
+        loading.value = true
+        error.value = false
+        try {
+            product.value = await api.get<Product>(
+                `/products/${id}`,
+                {},
+                { headers: { Accept: 'application/ld+json' }, toast: false },
+            )
+        }
+        catch {
+            error.value = true
+            product.value = null
+        }
+        finally {
+            loading.value = false
+        }
+    }
+
+    return { product, loading, error, load }
+}
@@ -15,6 +15,7 @@ import {
    useCategoryOptions,
    useStorageTypeOptions,
 } from '~/modules/catalog/composables/useProductOptions'
+import type { Product } from '~/modules/catalog/types/product'

 /** Etats produit (miroir de l'enum back Product::STATE_*). */
 export const PRODUCT_STATES = ['PURCHASE', 'SALE', 'OTHER'] as const
@@ -51,6 +52,10 @@ export function useProductForm() {

    const submitting = ref(false)

+    // Id du produit edite (null = creation). Pilote l'URL/methode du submit (RG-6.08 :
+    // « Modification » = meme formulaire/regles que « Ajouter », bouton « Enregistrer »).
+    const productId = ref<number | null>(null)
+
    // RG-6.03 : « Fabriqué » / « Contient de la mélasse » saisissables uniquement
    // si l'etat contient « Vendu » (SALE).
    const isSale = computed(() => form.states.includes('SALE'))
@@ -104,9 +109,34 @@ export function useProductForm() {
    }

    /**
-     * Soumet la creation. Retourne true au succes (la page redirige), false sinon.
-     * 422 → mapping inline par champ (useFormErrors) ; 409 doublon de code →
-     * erreur inline sur `code` + toast explicite (RG-6.01).
+     * Pre-remplit le formulaire depuis un produit charge (mode edition, RG-6.08).
+     * Les relations sont reprises via leur IRI `@id` (= valeur d'option des selects).
+     * Charge au passage les options de Type de stockage pour les sites du produit,
+     * afin que le multi-select affiche les libelles et conserve la selection.
+     */
+    async function prefill(product: Product): Promise<void> {
+        productId.value = product.id
+        form.code = product.code
+        form.name = product.name
+        form.states = [...product.states]
+        form.categoryIri = product.category?.['@id'] ?? null
+        form.siteIris = product.sites.map(s => s['@id'])
+        form.manufactured = product.manufactured
+        form.containsMolasses = product.containsMolasses
+
+        const siteIds = form.siteIris
+            .map(iriToId)
+            .filter((id): id is number => id !== null)
+        await storage.load(siteIds)
+        form.storageTypeIris = product.storageTypes.map(st => st['@id'])
+    }
+
+    /**
+     * Soumet le formulaire. Retourne true au succes (la page redirige), false sinon.
+     * Creation → `POST /products` ; edition (productId non nul, RG-6.08) →
+     * `PATCH /products/{id}` (mode merge-patch gere par useApi). 422 → mapping
+     * inline par champ (useFormErrors) ; 409 doublon de code → erreur inline sur
+     * `code` + toast explicite (RG-6.01, unicite re-validee aussi en edition).
     */
    async function submit(): Promise<boolean> {
        if (submitting.value) {
@@ -114,6 +144,7 @@ export function useProductForm() {
        }
        submitting.value = true
        formErrors.clearErrors()
+        const editing = productId.value !== null
        try {
            const payload = {
                code: form.code || null,
@@ -127,11 +158,15 @@ export function useProductForm() {
                sites: form.siteIris,
                storageTypes: form.storageTypeIris,
            }
-            await api.post('/products', payload, {
-                headers: { Accept: 'application/ld+json' },
-                toast: false,
-            })
-            toast.success({ title: t('admin.products.toast.createSuccess') })
+            const options = { headers: { Accept: 'application/ld+json' }, toast: false }
+            if (editing) {
+                await api.patch(`/products/${productId.value}`, payload, options)
+                toast.success({ title: t('admin.products.toast.updateSuccess') })
+            }
+            else {
+                await api.post('/products', payload, options)
+                toast.success({ title: t('admin.products.toast.createSuccess') })
+            }
            return true
        }
        catch (error) {
@@ -154,6 +189,7 @@ export function useProductForm() {

    return {
        form,
+        productId,
        errors: formErrors.errors,
        submitting,
        isSale,
@@ -165,6 +201,7 @@ export function useProductForm() {
        setStorageTypes,
        setSites,
        loadReferentials,
+        prefill,
        submit,
    }
 }