feat(front) : page Ajouter un fournisseur (/suppliers/new) + workflow par onglets (ERP-94) (#83)

ERP-94 (etape front 7/7 du M2). **Stack sur #97** (base = `feature/ERP-97-suppliers-i18n-sidebar`, elle-meme sur #93) pour un diff isole. A recibler sur `develop` une fois #93 (MR #81) et #97 (MR #82) mergees.

Page « Ajouter un fournisseur » — **replique a l'identique le fonctionnement de l'ecran Client** (workflow inline par onglets, blocs reutilisables, validation 422 inline ERP-101), avec les specificites M2.

## Architecture (miroir Client)
- Workflow par onglets **inline dans `suppliers/new.vue`** (comme `clients/new.vue` — il n'existe pas de `useClientForm` monolithique). Helpers paralleles : `useSupplierReferentials`, `useSupplierFormErrors`, `supplierFormRules`, `supplierEdit` (payloads), `types/supplierForm`.
- Blocs `SupplierContactBlock` / `SupplierAddressBlock` (miroir des blocs Client).
- POST `/suppliers` puis PATCH partiels par onglet (mode strict, groupes de serialisation). Sous-ressources : `/suppliers/{id}/contacts|addresses|ribs`.
- Validation ERP-101 : 422 `violations[].propertyPath` mappees inline par champ (`useFormErrors` / `mapViolationsToRecord`), `{ toast: false }`, bouton Valider toujours actif.

## Specificites M2 (vs M1)
- Formulaire principal **sans contact inline** (ERP-106) : Entreprise + Categorie (type FOURNISSEUR, `?typeCode=FOURNISSEUR`).
- Adresse : **radio exclusif** Prospect/Depart/Rendu (`addressType` enum, RG-2.09), champs **Bennes** (stepper) + **Prestation de triage**, **pas d'email de facturation**.
- Information : champ **Volume previsionnel** (8e champ).
- Compta (Admin+Compta) : banque si VIREMENT (RG-2.07), RIB si LCR (RG-2.08) ; RIB sous-ressource gardee par `accounting.manage`.

## Tests (mirroir strategie Client)
- `make nuxt-test` : 338 passed (specs ajoutees : supplierFormRules, supplierEdit, useSupplierReferentials, SupplierContactBlock, SupplierAddressBlock).
- ESLint propre ; `nuxi typecheck` (lance en container) : **0 erreur**.
- Golden path navigateur valide end-to-end : POST /suppliers OK, companyName normalise UPPERCASE (RG-2.12), gating des onglets (Information actif, Contacts deverrouille).

## Note de revue
~30 `WARN Duplicated imports` au typecheck : les helpers Supplier exportent les memes noms generiques que leurs equivalents Client (`buildMainPayload`, `omitEmptyRequired`, `RefOption`...), tous deux auto-importes par Nuxt. **Sans impact runtime** : tous les consommateurs utilisent des imports explicites (qui priment). Consequence directe du miroir 1:1 ; une factorisation des generiques dans `shared/` pourrait etre un suivi.

Reviewed-on: #83
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>

frontend/modules/commercial/components/SupplierAddressBlock.vue

@@ -0,0 +1,314 @@
+<template>
+    <div class="relative grid grid-cols-4 gap-x-[44px] gap-y-4 bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]">
+        <!-- Suppression : modal de confirmation cote parent. -->
+        <MalioButtonIcon
+            v-if="removable && !readonly"
+            icon="mdi:delete-outline"
+            variant="ghost"
+            button-class="absolute top-3 right-3"
+            v-bind="{ ariaLabel: t('commercial.suppliers.form.address.remove') }"
+            @click="$emit('remove')"
+        />
+
+        <!-- Type d'adresse : Prospect / Depart / Rendu (RG-2.09). Select en attendant
+             l'arbitrage metier (radio vs select) ; l'erreur 422 (propertyPath
+             `addressType`) s'affiche via la prop native :error de MalioSelect. -->
+        <MalioSelect
+            :model-value="model.addressType"
+            :options="addressTypeOptions"
+            :label="t('commercial.suppliers.form.address.addressType')"
+            :readonly="readonly"
+            empty-option-label=""
+            :required="true"
+            :error="errors?.addressType"
+            @update:model-value="(v: string | number | null) => update('addressType', v === null ? null : (v as SupplierAddressType))"
+        />
+
+        <!-- Sites Starseed : multiselect a tags (>= 1 obligatoire, RG-2.06). -->
+        <MalioSelectCheckbox
+            :model-value="model.siteIris"
+            :options="siteOptions"
+            :label="t('commercial.suppliers.form.address.sites')"
+            :display-tag="true"
+            :readonly="readonly"
+            :required="true"
+            :error="errors?.sites"
+            @update:model-value="(v: (string | number)[]) => update('siteIris', v.map(String))"
+        />
+
+        <!-- Contacts rattaches (M2M, facultatif). -->
+        <MalioSelectCheckbox
+            :model-value="model.contactIris"
+            :options="contactOptions"
+            :label="t('commercial.suppliers.form.address.contacts')"
+            :display-tag="true"
+            :readonly="readonly"
+            @update:model-value="(v: (string | number)[]) => update('contactIris', v.map(String))"
+        />
+
+        <!-- Filler : aligne le debut de ligne suivant sur la grille (le bloc client
+             porte ici l'email de facturation, absent cote fournisseur). -->
+        <div aria-hidden="true" />
+
+        <!-- Categories de type FOURNISSEUR (>= 1 obligatoire, RG-2.10). -->
+        <MalioSelectCheckbox
+            :model-value="model.categoryIris"
+            :options="categoryOptions"
+            :label="t('commercial.suppliers.form.address.categories')"
+            :display-tag="true"
+            :readonly="readonly"
+            :required="true"
+            :error="errors?.categories"
+            @update:model-value="(v: (string | number)[]) => update('categoryIris', v.map(String))"
+        />
+
+        <MalioSelect
+            :model-value="model.country"
+            :options="countryOptions"
+            :label="t('commercial.suppliers.form.address.country')"
+            :readonly="readonly"
+            :required="true"
+            @update:model-value="(v: string | number | null) => update('country', String(v ?? 'France'))"
+        />
+
+        <MalioInputText
+            :model-value="model.postalCode"
+            :label="t('commercial.suppliers.form.address.postalCode')"
+            :mask="POSTAL_CODE_MASK"
+            :readonly="readonly"
+            :required="true"
+            :error="errors?.postalCode"
+            @update:model-value="onPostalCodeChange"
+        />
+
+        <!-- Ville : MalioSelect alimente par le code postal (BAN). Saisie libre si BAN indispo. -->
+        <MalioSelect
+            v-if="!degraded"
+            :model-value="model.city"
+            :options="cityOptions"
+            :label="t('commercial.suppliers.form.address.city')"
+            :readonly="readonly"
+            empty-option-label=""
+            :required="true"
+            :error="errors?.city"
+            @update:model-value="(v: string | number | null) => update('city', v === null ? null : String(v))"
+        />
+        <MalioInputText
+            v-else
+            :model-value="model.city"
+            :label="t('commercial.suppliers.form.address.city')"
+            :readonly="readonly"
+            :required="true"
+            :error="errors?.city"
+            @update:model-value="(v: string) => update('city', v)"
+        />
+
+        <!-- Adresse (BAN) sur 2 colonnes + Adresse complementaire. allow-create : le
+             texte saisi est conserve si la BAN ne propose rien (saisie manuelle). -->
+        <div class="col-span-2">
+            <MalioInputAutocomplete
+                v-if="!readonly"
+                :model-value="model.street"
+                :options="addressOptions"
+                :loading="addressLoading"
+                :min-search-length="3"
+                :label="t('commercial.suppliers.form.address.street')"
+                :readonly="readonly"
+                :required="true"
+                :error="errors?.street"
+                :allow-create="true"
+                :no-results-text="t('commercial.suppliers.form.address.streetNotFound')"
+                @update:model-value="(v: string | number | null) => update('street', v === null ? null : String(v))"
+                @search="onAddressSearch"
+                @select="onAddressSelect"
+            />
+            <MalioInputText
+                v-else
+                :model-value="model.street"
+                :label="t('commercial.suppliers.form.address.street')"
+                :readonly="readonly"
+                :required="true"
+                :error="errors?.street"
+                @update:model-value="(v: string) => update('street', v)"
+            />
+        </div>
+
+        <div class="col-span-1">
+            <MalioInputText
+                :model-value="model.streetComplement"
+                :label="t('commercial.suppliers.form.address.streetComplement')"
+                :readonly="readonly"
+                :error="errors?.streetComplement"
+                @update:model-value="(v: string) => update('streetComplement', v)"
+            />
+        </div>
+
+        <!-- Bennes : stepper (specifique fournisseur, defaut 0). -->
+        <MalioInputNumber
+            :model-value="model.bennes"
+            :label="t('commercial.suppliers.form.address.bennes')"
+            :min="0"
+            :readonly="readonly"
+            :error="errors?.bennes"
+            @update:model-value="(v: string) => update('bennes', v)"
+        />
+
+        <!-- Prestation de triage : booleen porte par l'adresse (specifique fournisseur). -->
+        <MalioCheckbox
+            id="address-triage-provider"
+            :label="t('commercial.suppliers.form.address.triageProvider')"
+            :model-value="model.triageProvider"
+            group-class="self-center"
+            :readonly="readonly"
+            @update:model-value="(v: boolean) => update('triageProvider', v)"
+        />
+    </div>
+</template>
+
+<script setup lang="ts">
+import { useAddressAutocomplete, type AddressSuggestion } from '~/shared/composables/useAddressAutocomplete'
+import type { CategoryOption, RefOption } from '~/modules/commercial/composables/useSupplierReferentials'
+import type { SupplierAddressFormDraft, SupplierAddressType } from '~/modules/commercial/types/supplierForm'
+
+// Masque code postal FR : 5 chiffres.
+const POSTAL_CODE_MASK = '#####'
+
+const props = defineProps<{
+    /** Brouillon de l'adresse (v-model). */
+    modelValue: SupplierAddressFormDraft
+    title: string
+    /** Categories autorisees sur une adresse (type FOURNISSEUR). */
+    categoryOptions: CategoryOption[]
+    /** Sites Starseed disponibles. */
+    siteOptions: RefOption[]
+    /** Contacts deja saisis, rattachables a l'adresse. */
+    contactOptions: RefOption[]
+    /** Pays disponibles (France par defaut). */
+    countryOptions: RefOption[]
+    removable?: boolean
+    readonly?: boolean
+    /** Erreurs serveur 422 de cette ligne, indexees par champ (ERP-101). */
+    errors?: Record<string, string>
+}>()
+
+const emit = defineEmits<{
+    'update:modelValue': [value: SupplierAddressFormDraft]
+    'remove': []
+    /** Emis une fois quand le service d'autocompletion bascule en indisponible. */
+    'degraded': []
+}>()
+
+const { t } = useI18n()
+const autocomplete = useAddressAutocomplete()
+
+const model = computed(() => props.modelValue)
+
+const addressTypeOptions = computed<{ value: SupplierAddressType, label: string }[]>(() => [
+    { value: 'PROSPECT', label: t('commercial.suppliers.form.address.addressTypeProspect') },
+    { value: 'DEPART', label: t('commercial.suppliers.form.address.addressTypeDepart') },
+    { value: 'RENDU', label: t('commercial.suppliers.form.address.addressTypeRendu') },
+])
+
+// Repli saisie libre de la VILLE quand la BAN est indisponible (recuperable).
+const degraded = ref(false)
+let unavailableNotified = false
+const banCityOptions = ref<RefOption[]>([])
+const banAddressOptions = ref<RefOption[]>([])
+
+// Options ville effectives : on garantit que la ville courante figure toujours
+// dans la liste, sinon MalioSelect afficherait un champ vide en lecture seule.
+const cityOptions = computed<RefOption[]>(() => {
+    const current = props.modelValue.city
+    if (current && !banCityOptions.value.some(o => o.value === current)) {
+        return [{ value: current, label: current }, ...banCityOptions.value]
+    }
+    return banCityOptions.value
+})
+
+// Meme garantie pour le champ Adresse : la rue courante doit toujours figurer
+// dans les options, sinon MalioInputAutocomplete laisse le champ vide.
+const addressOptions = computed<RefOption[]>(() => {
+    const current = props.modelValue.street
+    if (current && !banAddressOptions.value.some(o => o.value === current)) {
+        return [{ value: current, label: current }, ...banAddressOptions.value]
+    }
+    return banAddressOptions.value
+})
+const addressLoading = ref(false)
+// Conserve les suggestions d'adresse pour retrouver ville/CP au moment du select.
+let lastAddressSuggestions: AddressSuggestion[] = []
+
+/** Emet un nouveau brouillon avec le champ modifie (immutabilite). */
+function update<K extends keyof SupplierAddressFormDraft>(field: K, value: SupplierAddressFormDraft[K]): void {
+    emit('update:modelValue', { ...props.modelValue, [field]: value })
+}
+
+/** Previent le parent (toast unique) que l'autocompletion est indisponible. */
+function notifyUnavailable(): void {
+    if (!unavailableNotified) {
+        unavailableNotified = true
+        emit('degraded')
+    }
+}
+
+/** Saisie du code postal → met a jour le champ + interroge la BAN pour la ville. */
+async function onPostalCodeChange(value: string): Promise<void> {
+    update('postalCode', value)
+
+    const digits = (value ?? '').replace(/\D/g, '')
+    if (digits.length < 5) {
+        return
+    }
+    try {
+        const suggestions = await autocomplete.searchCity(digits)
+        banCityOptions.value = suggestions.map(s => ({ value: s.city, label: s.city }))
+        degraded.value = false
+    }
+    catch {
+        degraded.value = true
+        notifyUnavailable()
+    }
+}
+
+/** Recherche d'adresse assistee (event de MalioInputAutocomplete). */
+async function onAddressSearch(query: string): Promise<void> {
+    // La BAN exige au moins 3 caracteres : on n'envoie rien en deca (evite un 400).
+    if (query.trim().length < 3) {
+        banAddressOptions.value = []
+        return
+    }
+    addressLoading.value = true
+    try {
+        const postalCode = (model.value.postalCode ?? '').replace(/\D/g, '') || undefined
+        const suggestions = await autocomplete.searchAddress(query, postalCode)
+        lastAddressSuggestions = suggestions
+        banAddressOptions.value = suggestions.map(s => ({ value: s.street, label: s.label }))
+    }
+    catch {
+        // Erreur transitoire : on vide les suggestions, la prochaine frappe reessaie.
+        banAddressOptions.value = []
+        notifyUnavailable()
+    }
+    finally {
+        addressLoading.value = false
+    }
+}
+
+/** Selection d'une suggestion d'adresse → remplit rue + ville + CP. */
+function onAddressSelect(option: { label: string, value: string | number } | null): void {
+    if (option === null) {
+        return
+    }
+    const suggestion = lastAddressSuggestions.find(s => s.street === option.value)
+    if (!suggestion) {
+        update('street', String(option.value))
+        return
+    }
+    emit('update:modelValue', {
+        ...props.modelValue,
+        street: suggestion.street,
+        city: suggestion.city,
+        postalCode: suggestion.postalCode,
+    })
+}
+</script>

frontend/modules/commercial/components/SupplierContactBlock.vue

@@ -0,0 +1,104 @@
+<template>
+    <div class="relative grid grid-cols-4 gap-x-[44px] gap-y-4 bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]">
+        <!-- Suppression : ouvre une modal de confirmation cote parent. Masquee si
+             non supprimable (1er bloc, RG-2.13) ou en lecture seule. -->
+        <MalioButtonIcon
+            v-if="removable && !readonly"
+            icon="mdi:delete-outline"
+            variant="ghost"
+            button-class="absolute top-3 right-3"
+            v-bind="{ ariaLabel: t('commercial.suppliers.form.contact.remove') }"
+            @click="$emit('remove')"
+        />
+
+        <MalioInputText
+            :model-value="model.lastName"
+            :label="t('commercial.suppliers.form.contact.lastName')"
+            :readonly="readonly"
+            :error="errors?.lastName"
+            @update:model-value="(v: string) => update('lastName', v)"
+        />
+        <MalioInputText
+            :model-value="model.firstName"
+            :label="t('commercial.suppliers.form.contact.firstName')"
+            :readonly="readonly"
+            :error="errors?.firstName"
+            @update:model-value="(v: string) => update('firstName', v)"
+        />
+        <MalioInputText
+            :model-value="model.jobTitle"
+            :label="t('commercial.suppliers.form.contact.jobTitle')"
+            :readonly="readonly"
+            :error="errors?.jobTitle"
+            @update:model-value="(v: string) => update('jobTitle', v)"
+        />
+        <MalioInputEmail
+            :model-value="model.email"
+            :label="t('commercial.suppliers.form.contact.email')"
+            :readonly="readonly"
+            :lowercase="true"
+            :error="errors?.email"
+            @update:model-value="(v: string) => update('email', v)"
+        />
+        <MalioInputPhone
+            :model-value="model.phonePrimary"
+            :label="t('commercial.suppliers.form.contact.phonePrimary')"
+            :mask="PHONE_MASK"
+            :readonly="readonly"
+            :error="errors?.phonePrimary"
+            :addable="!model.hasSecondaryPhone && !readonly"
+            :add-button-label="t('commercial.suppliers.form.contact.addPhone')"
+            @update:model-value="(v: string) => update('phonePrimary', v)"
+            @add="revealSecondaryPhone"
+        />
+        <MalioInputPhone
+            v-if="model.hasSecondaryPhone"
+            :model-value="model.phoneSecondary"
+            :label="t('commercial.suppliers.form.contact.phoneSecondary')"
+            :mask="PHONE_MASK"
+            :readonly="readonly"
+            :error="errors?.phoneSecondary"
+            @update:model-value="(v: string) => update('phoneSecondary', v)"
+        />
+    </div>
+</template>
+
+<script setup lang="ts">
+import type { SupplierContactFormDraft } from '~/modules/commercial/types/supplierForm'
+
+// Masque telephone FR : 5 groupes de 2 chiffres (la normalisation finale reste serveur).
+const PHONE_MASK = '## ## ## ## ##'
+
+const props = defineProps<{
+    /** Brouillon du contact (v-model). */
+    modelValue: SupplierContactFormDraft
+    /** Titre du bloc (ex: « Contact 1 »). */
+    title: string
+    /** Affiche l'icone de suppression (1er bloc non supprimable, RG-2.13). */
+    removable?: boolean
+    /** Bloc en lecture seule (onglet valide). */
+    readonly?: boolean
+    /** Erreurs serveur 422 de cette ligne, indexees par champ (ERP-101). */
+    errors?: Record<string, string>
+}>()
+
+const emit = defineEmits<{
+    'update:modelValue': [value: SupplierContactFormDraft]
+    'remove': []
+}>()
+
+const { t } = useI18n()
+
+// Alias local pour la lisibilite du template.
+const model = computed(() => props.modelValue)
+
+/** Emet un nouveau brouillon avec le champ modifie (immutabilite). */
+function update<K extends keyof SupplierContactFormDraft>(field: K, value: SupplierContactFormDraft[K]): void {
+    emit('update:modelValue', { ...props.modelValue, [field]: value })
+}
+
+/** Revele le 2e numero (max 1 secondaire, le « + » disparait). */
+function revealSecondaryPhone(): void {
+    emit('update:modelValue', { ...props.modelValue, hasSecondaryPhone: true })
+}
+</script>

frontend/modules/commercial/components/__tests__/SupplierAddressBlock.spec.ts

@@ -0,0 +1,178 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { mount, flushPromises } from '@vue/test-utils'
+import { defineComponent, h, ref, computed } from 'vue'
+import { emptyAddress } from '~/modules/commercial/types/supplierForm'
+import SupplierAddressBlock from '../SupplierAddressBlock.vue'
+
+// Mocks controlables du composable BAN (hoisted).
+const { searchCityMock, searchAddressMock } = vi.hoisted(() => ({
+    searchCityMock: vi.fn(),
+    searchAddressMock: vi.fn(),
+}))
+vi.mock('~/shared/composables/useAddressAutocomplete', () => ({
+    useAddressAutocomplete: () => ({
+        searchCity: searchCityMock,
+        searchAddress: searchAddressMock,
+    }),
+}))
+
+// Auto-imports Nuxt/Vue utilises sans import explicite par le composant.
+vi.stubGlobal('useI18n', () => ({ t: (key: string) => key }))
+vi.stubGlobal('ref', ref)
+vi.stubGlobal('computed', computed)
+
+// Stub de MalioInputAutocomplete : expose les `value` des options + allowCreate.
+const MalioInputAutocompleteStub = defineComponent({
+    name: 'MalioInputAutocomplete',
+    props: {
+        modelValue: { type: [String, Number, null], default: undefined },
+        options: { type: Array as () => { value: string | number, label: string }[], default: () => [] },
+        loading: { type: Boolean, default: false },
+        minSearchLength: { type: Number, default: 0 },
+        label: { type: String, default: '' },
+        readonly: { type: Boolean, default: false },
+        allowCreate: { type: Boolean, default: false },
+    },
+    emits: ['update:modelValue', 'search', 'select'],
+    setup(props) {
+        return () => h('div', {
+            'data-testid': 'addr-autocomplete',
+            'data-options': JSON.stringify(props.options.map(o => o.value)),
+        })
+    },
+})
+
+function mountBlock(overrides: Record<string, unknown> = {}, errors?: Record<string, string>) {
+    return mount(SupplierAddressBlock, {
+        props: {
+            modelValue: { ...emptyAddress(), ...overrides },
+            title: 'Adresse 1',
+            categoryOptions: [],
+            siteOptions: [],
+            contactOptions: [],
+            countryOptions: [],
+            ...(errors ? { errors } : {}),
+        },
+        global: {
+            stubs: {
+                MalioButtonIcon: true,
+                MalioCheckbox: true,
+                MalioInputNumber: true,
+                MalioSelect: true,
+                MalioSelectCheckbox: true,
+                MalioInputText: true,
+                MalioInputAutocomplete: MalioInputAutocompleteStub,
+            },
+        },
+    })
+}
+
+describe('SupplierAddressBlock — specificites M2 (type, bennes, triage)', () => {
+    it('rend un select de type d\'adresse (en attendant l\'arbitrage metier)', () => {
+        const wrapper = mountBlock()
+        const addressTypeSelect = wrapper.findAll('malio-select-stub').find(
+            el => el.attributes('label') === 'commercial.suppliers.form.address.addressType',
+        )
+        expect(addressTypeSelect).toBeDefined()
+    })
+
+    it('rend le stepper Bennes et la case Prestation de triage (champs specifiques fournisseur)', () => {
+        const wrapper = mountBlock()
+        expect(wrapper.find('malio-input-number-stub').exists()).toBe(true)
+        expect(wrapper.find('malio-checkbox-stub').exists()).toBe(true)
+    })
+
+    it('ne rend aucun champ d\'email de facturation (difference M1)', () => {
+        const wrapper = mountBlock()
+        // Aucun MalioInputEmail dans le bloc adresse fournisseur.
+        expect(wrapper.find('malio-input-email-stub').exists()).toBe(false)
+    })
+})
+
+describe('SupplierAddressBlock — mapping erreur par champ (ERP-101)', () => {
+    it('affiche l\'erreur serveur du type d\'adresse (propertyPath addressType) sur le select', () => {
+        const wrapper = mountBlock({}, { addressType: 'Le type d\'adresse est obligatoire.' })
+        const addressTypeSelect = wrapper.findAll('malio-select-stub').find(
+            el => el.attributes('label') === 'commercial.suppliers.form.address.addressType',
+        )
+        expect(addressTypeSelect?.attributes('error')).toBe('Le type d\'adresse est obligatoire.')
+    })
+
+    it('affiche les erreurs serveur sur sites et categories', () => {
+        const wrapper = mountBlock({}, {
+            sites: 'Au moins un site est obligatoire.',
+            categories: 'Au moins une catégorie est obligatoire.',
+        })
+        const checkboxes = wrapper.findAll('malio-select-checkbox-stub')
+        const sitesField = checkboxes.find(el => el.attributes('label') === 'commercial.suppliers.form.address.sites')
+        const categoriesField = checkboxes.find(el => el.attributes('label') === 'commercial.suppliers.form.address.categories')
+
+        expect(sitesField?.attributes('error')).toBe('Au moins un site est obligatoire.')
+        expect(categoriesField?.attributes('error')).toBe('Au moins une catégorie est obligatoire.')
+    })
+
+    it('affiche l\'erreur serveur sur le code postal', () => {
+        const wrapper = mountBlock({}, { postalCode: 'Code postal invalide.' })
+        const field = wrapper.findAll('malio-input-text-stub').find(
+            el => el.attributes('label') === 'commercial.suppliers.form.address.postalCode',
+        )
+        expect(field?.attributes('error')).toBe('Code postal invalide.')
+    })
+})
+
+describe('SupplierAddressBlock — autocompletion adresse (BAN) robuste', () => {
+    beforeEach(() => {
+        searchAddressMock.mockReset()
+    })
+
+    it('n\'appelle pas la BAN en deca de 3 caracteres', async () => {
+        const wrapper = mountBlock()
+        wrapper.findComponent(MalioInputAutocompleteStub).vm.$emit('search', 'ab')
+        await flushPromises()
+        expect(searchAddressMock).not.toHaveBeenCalled()
+    })
+
+    it('relance la recherche apres une erreur (pas de bascule definitive)', async () => {
+        searchAddressMock
+            .mockRejectedValueOnce(new Error('BAN indisponible'))
+            .mockResolvedValueOnce([
+                { label: '8 Boulevard du Port, Paris', street: '8 Boulevard du Port', postalCode: '75001', city: 'Paris' },
+            ])
+
+        const wrapper = mountBlock()
+        const auto = wrapper.findComponent(MalioInputAutocompleteStub)
+
+        auto.vm.$emit('search', 'boulevard du port')
+        await flushPromises()
+        auto.vm.$emit('search', 'boulevard du porte')
+        await flushPromises()
+
+        expect(searchAddressMock).toHaveBeenCalledTimes(2)
+        expect(wrapper.find('[data-testid="addr-autocomplete"]').exists()).toBe(true)
+    })
+
+    it('emet « degraded » une seule fois malgre plusieurs erreurs', async () => {
+        searchAddressMock.mockRejectedValue(new Error('BAN indisponible'))
+
+        const wrapper = mountBlock()
+        const auto = wrapper.findComponent(MalioInputAutocompleteStub)
+
+        auto.vm.$emit('search', 'rue de la paix')
+        await flushPromises()
+        auto.vm.$emit('search', 'rue de la paixx')
+        await flushPromises()
+
+        expect(wrapper.emitted('degraded')).toHaveLength(1)
+    })
+
+    it('active allow-create sur le champ Adresse (saisie manuelle libre)', () => {
+        const wrapper = mountBlock()
+        expect(wrapper.findComponent(MalioInputAutocompleteStub).props('allowCreate')).toBe(true)
+    })
+
+    it('inclut la rue courante dans les options meme sans recherche BAN', () => {
+        const wrapper = mountBlock({ street: '8 Boulevard du Port' })
+        const values = JSON.parse(wrapper.find('[data-testid="addr-autocomplete"]').attributes('data-options') ?? '[]')
+        expect(values).toContain('8 Boulevard du Port')
+    })
+})

frontend/modules/commercial/components/__tests__/SupplierContactBlock.spec.ts

@@ -0,0 +1,56 @@
+import { describe, it, expect, vi } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { defineComponent, h, ref, computed } from 'vue'
+import { emptyContact } from '~/modules/commercial/types/supplierForm'
+import SupplierContactBlock from '../SupplierContactBlock.vue'
+
+// Auto-imports Nuxt/Vue utilises sans import explicite par le composant.
+vi.stubGlobal('useI18n', () => ({ t: (key: string) => key }))
+vi.stubGlobal('ref', ref)
+vi.stubGlobal('computed', computed)
+
+/** Stub d'un champ Malio qui re-expose la prop `error` recue dans un data-* attribut. */
+function errorProbe(testid: string) {
+    return defineComponent({
+        name: `Probe-${testid}`,
+        props: {
+            modelValue: { type: [String, Number, null], default: undefined },
+            error: { type: String, default: '' },
+            label: { type: String, default: '' },
+            readonly: { type: Boolean, default: false },
+        },
+        setup(props) {
+            return () => h('div', { 'data-testid': testid, 'data-error': props.error })
+        },
+    })
+}
+
+function mountBlock(errors?: Record<string, string>) {
+    return mount(SupplierContactBlock, {
+        props: {
+            modelValue: emptyContact(),
+            title: 'Contact 1',
+            ...(errors ? { errors } : {}),
+        },
+        global: {
+            stubs: {
+                MalioButtonIcon: true,
+                MalioInputPhone: true,
+                MalioInputText: errorProbe('contact-text'),
+                MalioInputEmail: errorProbe('contact-email'),
+            },
+        },
+    })
+}
+
+describe('SupplierContactBlock — mapping erreur par champ (ERP-101)', () => {
+    it('affiche l\'erreur serveur sur le champ email via la prop errors', () => {
+        const wrapper = mountBlock({ email: 'Adresse e-mail invalide.' })
+        expect(wrapper.find('[data-testid="contact-email"]').attributes('data-error')).toBe('Adresse e-mail invalide.')
+    })
+
+    it('laisse les champs sans erreur quand errors est absent', () => {
+        const wrapper = mountBlock()
+        expect(wrapper.find('[data-testid="contact-email"]').attributes('data-error')).toBe('')
+    })
+})