chore: bump version to v0.1.113

feat(technique) : entités + repositories Provider* (ERP-133) (#91 )
PR **empilée sur ERP-132** (#90) — base = \`feature/ERP-132-migrer-schema-bdd-m3\` (ERP-132 pas encore mergé dans develop). À rebaser sur develop une fois #90 mergée. ## Périmètre (ticket Lesstime #133, M3 § 3.3/3.4/2.12/4.0) Entités Doctrine + mapping ApiResource (squelette) + repository avec hydratation anti-N+1. Miroir des entités `Supplier*` (M2), **amputé de l'onglet Information** et **augmenté de `provider.sites`** (M2M direct, RG-3.03). ### Créé - `Provider`, `ProviderContact`, `ProviderAddress` (simplifiée : pas de `addressType`/`bennes`/`triageProvider`), `ProviderRib` — `#[Auditable]` + Timestampable/Blamable. - `ProviderRepositoryInterface` + `DoctrineProviderRepository` : `createListQueryBuilder` (filtres + tri seuls) + `hydrateListCollections` anti-N+1 (catégories puis **sites en relation directe**, requêtes `IN` bornées séparées — § 2.12). ### Contrat de sérialisation (RETEX M1 — 3 maillons) Groupes posés sur l'entité (source unique) : liste = `provider:read`+`category:read`+`site:read` ; détail = +`provider:item:read`. Piège booléen `isArchived` traité (`#[Groups]`+`#[SerializedName]` sur le getter). Embed `categories[].code/name` + `sites[].name/postalCode` (objet, pas IRI). ### Consommation cross-module (§ 2.1) - Site/Category via contrats Shared (`SiteInterface`/`CategoryInterface` + `resolve_target_entities`) — comme Supplier, conforme règle ABSOLUE n°1. - Référentiels comptables (`TvaMode`/`PaymentDelay`/`PaymentType`/`Bank`) en relation ORM partagée directe (décision § 2.1, remontée Shared tracée HP-M4-2). ### Garde-fous / infra (requis pour le vert) - Mapping ORM du module `Technique` dans `doctrine.yaml` (sinon les 9 tables `provider*` vues orphelines → DROP). - Tables `provider*` ajoutées à `ColumnCommentsCatalog` + ligne `dbal:run-sql uq_provider_company_name_active` au makefile `test-db-setup`. - 4 libellés `audit.entity.technique_*` (fr.json) ; `ProviderAddress::postalCode` whitelisté dans `EXCLUDED_LENGTH_MIRROR` (Regex CP {4,5}). ## Hors périmètre (→ ERP-134) ApiResource **sans** `ProviderProvider`/`ProviderProcessor` ; sous-entités **sans** `#[ApiResource]`. Hydratation effective, gating accounting, cloisonnement par site, normalisation, 409 doublon, RG-3.07/3.08 → ERP-134. Sous-ressources POST/PATCH/DELETE → ticket ultérieur. ## Tests - \`make test\` → **589/589 ✓** · \`php-cs-fixer\` → 0 correction. - \`schema:validate\` : mapping OK ; « not in sync » résiduel strictement homologue à supplier (COMMENT via catalogue + index FK auto-Doctrine), non régressif. --------- Co-authored-by: Matthieu <contact@malio.fr> Reviewed-on: #91
2026-06-12 14:34:35 +00:00 · 2026-06-12 14:25:27 +00:00 · 2026-06-12 14:19:46 +00:00 · 2026-06-12 14:19:14 +00:00 · 2026-06-12 08:45:47 +00:00 · 2026-06-12 08:45:38 +00:00
253 changed files with 34512 additions and 1709 deletions
@@ -6,6 +6,13 @@
 - PHP CS Fixer : regles Symfony + PSR-12 + strict types (commande : `make php-cs-fixer-allow-risky`)
 - Commentaires (docblock, inline, bloc) **en francais** ; code (classes, methodes, variables) en anglais

+## Messages de validation (obligatoire)
+
+Toute contrainte `#[Assert\*]` d'une entite metier : **message FR explicite**, et `Assert\Length.max` = `length` de la colonne ORM (coherence 3 niveaux nullable DB <-> NotBlank back <-> required front, ERP-101). RG inter-champs via `#[Assert\Callback]->atPath('<champ>')` (mapping inline front, pas toast). Exceptions miroir Length (Bic/Iban/Regex borne) : whitelist `EntityConstraintsHaveFrenchMessageTest::EXCLUDED_LENGTH_MIRROR`.
+
+Garde-fou : `tests/Architecture/EntityConstraintsHaveFrenchMessageTest` (casse `make test`).
+→ patterns code + exemples + justification complete : skill `backend-entity-conventions`.
+
 ## API Platform (pas de controllers)

 - Toujours utiliser `#[ApiResource]` + Providers + Processors — pas de controllers Symfony classiques
@@ -15,61 +22,10 @@

 ## Pagination (obligatoire)

-**Regle** : toute collection API DOIT etre paginee. Aucun retour de collection complete cote serveur.
+Toute collection API est paginee (defaut 10, max 50 ; `?pagination=false` = echappatoire selects, `?itemsPerPage=25` borne par le max). Standard global dans `config/packages/api_platform.yaml`. Jamais `paginationEnabled: false` hors whitelist `CollectionsArePaginatedTest::EXCLUDED`. Provider custom : ne jamais retourner un `array` brut sur une `CollectionOperationInterface` (court-circuite Hydra) — wrapper un Paginator (ORM : `ApiPlatform\Doctrine\Orm\Paginator` ; DBAL : `DbalPaginator`) et gerer `?pagination=false` via `$this->pagination->isEnabled(...)`.

-### Standard global
-
-Pose dans `config/packages/api_platform.yaml` (section `defaults:`) et heritee par toutes les ressources :
-
-| Cle | Valeur | Effet |
-|---|---|---|
-| `pagination_enabled` | `true` | Pagination Hydra active par defaut. |
-| `pagination_items_per_page` | `10` | Taille de page par defaut, aligne sur l'UI `MalioDataTable`. |
-| `pagination_maximum_items_per_page` | `50` | Borne dure : `?itemsPerPage=999` → ramene a 50. Anti deep-fetch. |
-| `pagination_client_items_per_page` | `true` | Le client peut envoyer `?itemsPerPage=25` (bornee par le max). |
-| `pagination_client_enabled` | `true` | Le client peut envoyer `?pagination=false` pour TOUT recuperer (echappatoire selects). |
-
-### Override par ressource (rare)
-
-Si une ressource a besoin d'un autre defaut (ex: payload lourd), utiliser les attributs sur l'operation. **JAMAIS `paginationEnabled: false`** sans whitelist explicite dans `tests/Architecture/CollectionsArePaginatedTest::EXCLUDED`.
-
-```php
-new GetCollection(
-    paginationItemsPerPage: 5,           // override taille par defaut
-    paginationMaximumItemsPerPage: 20,   // override borne max
-)
-```
-
-### Selects et autocompletions
-
-Pour alimenter un `<select>` ou un drawer RBAC (Role, Permission, Site, CategoryType), le front passe :
-
-```ts
-useApi().get('/api/roles?pagination=false')
-```
-
-Le serveur retourne toute la collection, sans `view`. C'est l'echappatoire prevue par `pagination_client_enabled: true`. Sur les ressources a forte volumetrie, preferer une saisie assistee (recherche serveur via `?q=`) — a planifier dans un ticket dedie.
-
-Les tests fonctionnels qui exercent ce comportement doivent egalement passer `?pagination=false` (cf. `CategoryListTest`, `PermissionApiTest`).
-
-### Providers customs et pagination
-
-Un provider custom qui retourne un `array` brut sur une `CollectionOperationInterface` **court-circuite la pagination Hydra** (pas de `totalItems`, pas de `view`). Patterns supportes :
-
- **ORM** : injecter `ApiPlatform\State\Pagination\Pagination`, wrap un `Doctrine\ORM\Tools\Pagination\Paginator` dans `ApiPlatform\Doctrine\Orm\Paginator`. Exemple : `CategoryProvider`.
- **DBAL** : implementer un paginator local conforme a `PaginatorInterface`. Exemple : `DbalPaginator` (Core) + `AuditLogProvider`.
-
-Gerer l'echappatoire `?pagination=false` :
-
-```php
-if (!$this->pagination->isEnabled($operation, $context)) {
-    return $qb->getQuery()->getResult(); // tout retourner
-}
-```
-
-### Garde-fou architecture
-
-`tests/Architecture/CollectionsArePaginatedTest` scanne reflexivement toutes les classes `#[ApiResource]` sous `src/` et echoue si une `GetCollection` pose `paginationEnabled: false` hors whitelist `EXCLUDED`. Ajouter une entree a la whitelist requiert une justification courte + un ticket Lesstime ouvert.
+Garde-fou : `tests/Architecture/CollectionsArePaginatedTest` (casse `make test`).
+→ tableau des cles `pagination_*` + selects + providers ORM/DBAL detailles : skill `backend-entity-conventions`.

 ## Repositories

@@ -98,26 +54,19 @@ Format obligatoire : `module.resource[.subresource].action` en snake_case.
 - Audit ManyToMany : trace automatiquement `{fieldName: {added: [ids], removed: [ids]}}` — aucune action supplementaire
 - Spec complete : @doc/audit-log.md

+### Libelle i18n du type d'entite (obligatoire avec `#[Auditable]`)
+
+Toute entite `#[Auditable]` doit avoir sa cle `audit.entity.<module>_<entity>` dans `frontend/i18n/locales/fr.json` (cle = `strtolower(module)` + `_` + `strtolower(Entity)`, decision ERP-99). Sans elle, le filtre « Type d'entite » de l'audit-log retombe silencieusement sur le type technique brut (ex: `commercial.Client`). Fait partie de la definition de fini d'une entite auditee.
+
+Garde-fou : `tests/Architecture/AuditableEntitiesHaveI18nLabelTest` (casse `make test`).
+→ derivation detaillee + exemples : skill `backend-entity-conventions`.
+
 ## Timestampable + Blamable (obligatoire pour entites metier)

-Toute **nouvelle** entite metier sous `src/Module/*/Domain/Entity/` doit porter les 4 colonnes `created_at` / `updated_at` / `created_by` / `updated_by`, remplies automatiquement. Trois lignes a ajouter a l'entite :
+Toute **nouvelle** entite metier sous `src/Module/*/Domain/Entity/` : `implements TimestampableInterface, BlamableInterface` + `use TimestampableBlamableTrait` (porte les 4 colonnes `created_at` / `updated_at` / `created_by` / `updated_by`, remplies par `TimestampableBlamableSubscriber` au prePersist/preUpdate). La migration cree les 4 colonnes (`created_at`/`updated_at` NOT NULL, `created_by`/`updated_by` nullable `ON DELETE SET NULL`). Referentiel statique justifie : whitelist `EntitiesAreTimestampableBlamableTest::EXCLUDED`.

-```php
-use App\Shared\Domain\Contract\BlamableInterface;
-use App\Shared\Domain\Contract\TimestampableInterface;
-use App\Shared\Domain\Trait\TimestampableBlamableTrait;
-
-class MyEntity implements TimestampableInterface, BlamableInterface
-{
-    use TimestampableBlamableTrait; // porte les 4 props + getters/setters
-    // ... reste metier
-}
-```
-
- Le `TimestampableBlamableSubscriber` (`Shared/Infrastructure/Doctrine/`) remplit les colonnes au `prePersist` / `preUpdate`. Hors contexte HTTP (CLI, cron, migration), le blame reste `null` (libelle « Systeme » cote front).
- La migration de l'entite doit creer les 4 colonnes (`created_at` / `updated_at` NOT NULL, `created_by` / `updated_by` nullable `ON DELETE SET NULL`).
- **Garde-fou CI** : `tests/Architecture/EntitiesAreTimestampableBlamableTest` echoue si une entite oublie le pattern. Un referentiel statique justifie (ex: `CategoryType`) doit etre explicitement whiteliste dans la constante `EXCLUDED` avec un commentaire.
- Spec complete : @docs/specs/M0-categories/spec-back.md § 2.8 + § 2.8.bis
+Garde-fou : `tests/Architecture/EntitiesAreTimestampableBlamableTest` (casse `make test`).
+→ snippet complet : skill `backend-entity-conventions` ; spec : @docs/specs/M0-categories/spec-back.md § 2.8 + § 2.8.bis.

 ## Serialization

@@ -135,50 +84,7 @@ Exemple : pour qu'`User.profile` soit embarque au lieu d'un lien IRI sous le gro

 ## Migrations Doctrine

-### Documentation SQL obligatoire (`COMMENT ON COLUMN`)
+Toute migration creant/modifiant une colonne d'une table metier pose un `COMMENT ON COLUMN` (FR, ≤ 200 caracteres, semantique + contrainte/RG, cible pour les FK). Les 4 colonnes Timestampable/Blamable recoivent leur description via le helper centralise `addStandardTimestampableBlamableComments($schema, 'table')`. Bonus : `COMMENT ON TABLE` pour decrire la table.

-**Toute migration qui cree ou modifie une colonne d'une table metier doit poser un `COMMENT ON COLUMN` decrivant le champ.** La description est stockee dans `pg_description` et visible dans tous les outils d'admin BDD (DBeaver, DataGrip, pgAdmin), sans avoir a lire les annotations PHP.
-
-**Format de la description** :
- En francais
- ≤ 200 caracteres
- Semantique du champ — contraintes / lien RG si pertinent
- Pour les colonnes d'identifiant ou FK, mentionner la cible
-
-Exemples :
-
-```php
-// Migration : creation d'une colonne avec son commentaire dans la meme migration
-$this->addSql("ALTER TABLE client ADD COLUMN siren VARCHAR(9) DEFAULT NULL");
-$this->addSql("COMMENT ON COLUMN client.siren IS 'SIREN (9 chiffres) — identifiant legal entreprise. Unique parmi non-archives (RG-1.15).'");
-
-// Cas FK : preciser la cible
-$this->addSql("COMMENT ON COLUMN client.legal_form_id IS 'Reference forme juridique (SARL, SAS, SA...) — FK -> legal_form.id, ON DELETE RESTRICT.'");
-
-// Cas booleen : preciser le sens et la valeur par defaut
-$this->addSql("COMMENT ON COLUMN user.is_admin IS 'Drapeau super-administrateur — bypass complet RBAC. Faux par defaut.'");
-
-// Bonus : decrire la table elle-meme
-$this->addSql("COMMENT ON TABLE client IS 'Repertoire clients (M1 Commercial) — entites archivables.'");
-```
-
-### Helper Timestampable/Blamable
-
-Les 4 colonnes `created_at`, `updated_at`, `created_by`, `updated_by` ajoutees par `TimestampableBlamableTrait` recoivent une description **standardisee** via le helper centralise pour eviter la duplication. Helper a creer ou appeler :
-
-```php
-// Dans la migration, apres avoir ajoute les 4 colonnes :
-$this->addStandardTimestampableBlamableComments($schema, 'client');
-```
-
-L'implementation du helper applique :
- `created_at` : « Horodatage de creation de la ligne (UTC, rempli automatiquement par TimestampableBlamableSubscriber). »
- `updated_at` : « Horodatage de derniere modification de la ligne (UTC, rempli automatiquement par TimestampableBlamableSubscriber). »
- `created_by` : « ID de l'utilisateur ayant cree la ligne — null pour les creations hors HTTP (CLI, migration, fixture). FK -> user.id, ON DELETE SET NULL. »
- `updated_by` : « ID de l'utilisateur ayant modifie la ligne en dernier — null pour les modifications hors HTTP. FK -> user.id, ON DELETE SET NULL. »
-
-### Garde-fou architecture
-
-`tests/Architecture/ColumnsHaveSqlCommentTest` parcourt `information_schema.columns` filtre sur le schema `public` et echoue si **une seule colonne** n'a pas de `col_description`. Seules les tables system (`doctrine_migration_versions`) et la whitelist `EXCLUDED_TABLES` explicite (commentaire de justification + ticket Lesstime ouvert pour le retrofit) sont tolerees.
-
-Conclusion : si tu crees une colonne sans poser son `COMMENT ON COLUMN`, `make test` casse en CI.
+Garde-fou : `tests/Architecture/ColumnsHaveSqlCommentTest` parcourt `information_schema.columns` (schema `public`) ; une seule colonne sans `col_description` casse `make test` (hors `EXCLUDED_TABLES`).
+→ exemples SQL + textes du helper : skill `backend-entity-conventions`.
@@ -44,6 +44,45 @@ Tout champ de formulaire / filtre doit utiliser les composants `Malio*` plutot q

 Toute autre exception requiert validation avant merge.

+## Standard ecran formulaire — reference : ecran Client
+
+**Tout nouvel ecran de formulaire doit ressembler au premier ecran Client** (`frontend/modules/commercial/pages/clients/new.vue` + `[id]/edit.vue`) : meme structure (bloc principal puis onglets), memes marges/espacements, memes blocs de collection (ajout/suppression inline), meme validation inline 422 par champ. C'est la reference visuelle et fonctionnelle des formulaires du projet — s'en inspirer avant d'en creer un nouveau.
+
+## Validation des formulaires — useFormErrors obligatoire (erreur par champ)
+
+**Tout formulaire qui soumet a une API DOIT afficher les erreurs de validation 422 sous le champ concerne, via `useFormErrors`** (`frontend/shared/composables/useFormErrors.ts`). C'est le pendant front de « le back renvoie TOUTES les violations d'une 422 d'un coup » : un seul aller-retour, chaque erreur affichee inline sous son champ (prop `:error` des `Malio*`), pas un toast fourre-tout.
+
+Principe cle : **le nom du champ cote front = le `propertyPath` renvoye par le back**. Aucun mapping manuel champ par champ.
+
+Pattern de reference (champs scalaires) :
+
+```ts
+const { errors, setError, clearErrors, handleApiError } = useFormErrors()
+
+async function submit() {
+    clearErrors()
+    try {
+        await useApi().post('/clients', payload, { toast: false }) // toast: false obligatoire
+    } catch (e) {
+        // 422 → mapping inline par champ (pas de toast) ; autre → toast de fallback.
+        handleApiError(e, { fallbackMessage: t('foo.error') })
+    }
+}
+```
+
+```vue
+<MalioInputText v-model="form.companyName" :error="errors.companyName" />
+<MalioSelect    v-model="form.siren"       :error="errors.siren" />
+```
+
+Regles :
+- **Toujours `{ toast: false }`** sur l'appel API qui veut un mapping inline (sinon le toast natif d'`useApi` masque le fin).
+- **Cas metier specifique** (ex: 409 doublon) : `setError('champ', message)` + toast explicite **avant** de deleguer le reste a `handleApiError`. Cf. `useCategoryForm` (doublon RG-1.07).
+- **Collections** (listes de sous-entites sauvees par un appel par ligne) : une erreur PAR LIGNE via un tableau `ref<Record<string, string>[]>` aligne sur l'index, peuple par `mapViolationsToRecord(error.response._data)` (util pur de `shared/utils/api.ts`). Le composant de ligne expose une prop `:errors` (`Record<string, string>`) bindee sur le `:error` de chaque champ. Cf. `ClientContactBlock` / `ClientAddressBlock` et les submits de `clients/new.vue` / `clients/[id]/edit.vue`.
+- **Message back technique → surcharge i18n par code** : la plupart des contraintes back portent un message FR explicite (affiche tel quel). Mais une 422 peut porter un message TECHNIQUE non montrable (ex. erreur de type API Platform sur une date non parsable : « Cette valeur doit être de type DateTimeImmutable|null. », voire en anglais selon la negociation). On le surcharge **cote front** via le `code` de violation (UUID Symfony fige, robuste — pas un match sur le texte) : table `VIOLATION_MESSAGE_I18N` + `resolveViolationMessage` dans `shared/utils/api.ts`, appliquee par `useFormErrors`. Ajouter un cas = une entree `code -> cle i18n`. Cas reference : date invalide (MalioDate forwarde la saisie brute via `@update:rawValue`, le back renvoie 422 sur `foundedAt` grace a `collectDenormalizationErrors`, le front affiche `errors.validation.invalidDate`).
+
+**Interdit** : se contenter d'un toast global sur une 422 quand le back identifie les champs fautifs (`propertyPath`). Reimplementer un mapping `if/else` par champ a la main au lieu d'`useFormErrors` / `mapViolationsToRecord`.
+
 ## Tableaux de donnees — MalioDataTable obligatoire

 Tout affichage LISTE tabulaire (donnees metier paginees, CRUD admin) doit passer par `MalioDataTable` :
@@ -108,6 +147,18 @@ A NE PAS faire :
 - Seuls les deep links "de navigation metier" (ex: ouvrir un detail precis `/users/42`) sont dans l'URL
 - Exceptions autorisees **sur demande explicite** de l'utilisateur

+## Validation des formulaires (standard ERP-101)
+
+Regle transverse a TOUS les formulaires front (et a rappeler a l'ecriture de chaque ticket back/front portant un formulaire). Decidee en ERP-101 (declencheur : ecran « Ajouter un client » ERP-63).
+
+- **Champs obligatoires** : prop `required` du composant `Malio*` + etoile (asterisque) rouge dans le label. Ne JAMAIS griser le bouton « Valider » sans feedback : bouton toujours actif + erreurs affichees sous les champs.
+- **Couche de validation autoritaire = le back** : les RG sont re-validees serveur (mode strict). Au `422`, mapper `violations[].propertyPath` vers la prop `error` du champ via `extractApiViolations` (deja utilise par `useCategoryForm`). Zero duplication de RG, zero drift.
+- **Feedback instantane au blur** : uniquement requis / min / max / format (pas de re-implementation des RG metier cote front).
+- **Regles front-only** : celles sans equivalent back (ex. FK nullable cote back mais obligatoire selon un choix UI) sont validees et affichees cote front.
+- **Email — PAS de masque** : un email n'a pas de structure fixe. Normalisation via la prop `lowercase` de `MalioInputEmail` (trim + suppression des espaces + lowercase, coherent avec la normalisation serveur RG-1.21). Le format est valide par la prop `error` (violations serveur ou check au blur), jamais par un masque. Retirer tout shaping email ad hoc des ecrans.
+- **Contrat back attendu** : tout `422` issu d'un Processor/Validator doit porter `violations[].propertyPath` aligne sur les noms de champs du formulaire, pour etre consommable par `extractApiViolations`.
+- **Dependance** : le branchement des props `required` suppose `@malio/layer-ui` a jour (props `required` + etoile — MUI-41 / ERP-101).
+
 ## Interdits

 - `modules-loader.ts`, `.module.ts` — le scan des layers est automatique
@@ -0,0 +1,251 @@
+---
+name: backend-entity-conventions
+description: Conventions détaillées des entités métier Starseed (back PHP/Symfony/API Platform) — messages de validation FR sur les contraintes, pagination API Platform et providers ORM/DBAL, libellé i18n du type d'entité auditée, Timestampable/Blamable, COMMENT ON COLUMN des migrations. Charger dès qu'on crée ou modifie une entité Domain, un ApiResource, un Provider/Processor, une contrainte de validation, ou une migration Doctrine. Le résumé court de chaque règle (+ nom du test garde-fou) reste dans .claude/rules/backend.md ; ce skill porte les patterns, tableaux et exemples complets.
+---
+
+# Conventions entités métier — détail
+
+Ce skill contient le détail (patterns code, tableaux, dérivations) des 5 règles back qui ont chacune
+un test Architecture déterministe. L'énoncé court de chaque règle vit dans `.claude/rules/backend.md`
+(chargé à chaque session) ; ici on trouve le « comment » complet.
+
+> Règle d'or : le **test Architecture reste le juge** (il casse `make test`). Ce skill aide à écrire
+> le code juste du premier coup, il ne remplace pas le garde-fou.
+
+---
+
+## 1. Messages de validation (Garde-fou : `EntityConstraintsHaveFrenchMessageTest`)
+
+**Toute contrainte `#[Assert\*]` portée par une entité métier doit avoir un message FR explicite**, et
+**`Assert\Length.max` doit refléter le `length` de la colonne ORM**. C'est le pendant back du mapping
+d'erreur par champ côté front (ERP-101 : `useFormErrors` / `mapViolationsToRecord` affiche sous chaque
+champ le `message` renvoyé par le back).
+
+Pourquoi :
+- Sans `message:` explicite, Symfony renvoie le défaut **anglais** (« This value is not a valid email
+  address. »). La locale FR globale (`default_locale: fr` dans `framework.yaml`) sert de FILET via
+  `validators.fr.xlf`, mais les contraintes métier portent en plus leur message FR pour un contrôle total.
+- Une colonne string bornée **sans `Assert\Length`** échoue au niveau Postgres (500 générique, non
+  rattachée au champ) au lieu d'une 422 propre. Le `max` doit égaler le `length` ORM (anti-dérive).
+
+Pattern par champ scalaire :
+
+```php
+// Email métier
+#[Assert\Email(message: 'L\'adresse email n\'est pas valide.')]
+
+// Longueur calée sur la colonne (VARCHAR(120))
+#[ORM\Column(length: 120)]
+#[Assert\Length(max: 120, maxMessage: 'Le nom ne peut dépasser {{ limit }} caractères.', normalizer: 'trim')]
+
+// Obligatoire (aligner nullable DB / NotBlank back / required front)
+#[Assert\NotBlank(message: 'Le téléphone est obligatoire.', normalizer: 'trim')]
+```
+
+Cohérence à 3 niveaux pour un champ obligatoire : colonne `nullable` (DB) <-> `Assert\NotBlank` (back)
+<-> `:required` + astérisque (front ERP-101). Les trois doivent s'accorder.
+
+Exceptions au miroir `Length` : un format déjà borné par `Assert\Bic` / `Assert\Iban` (longueur
+garantie) ou par un `Assert\Regex` borné (ex. code postal `{4,5}`, couleur hex `#RRGGBB`) — whitelister
+alors la propriété dans `EntityConstraintsHaveFrenchMessageTest::EXCLUDED_LENGTH_MIRROR` avec justification.
+
+Les règles inter-champs (RG métier : exclusivité distributor/broker RG-1.03, billingEmail RG-1.11, etc.)
+passent par un `#[Assert\Callback]` qui construit la violation avec `->atPath('<champ>')` — indispensable
+pour que le front la mappe en inline plutôt qu'en toast.
+
+### Garde-fou architecture
+
+`tests/Architecture/EntityConstraintsHaveFrenchMessageTest` scanne réflexivement les entités sous
+`src/Module/*/Domain/Entity/` et échoue si :
+1. une contrainte connue n'a pas de message FR explicite (comparé au défaut Symfony) ;
+2. une colonne string bornée writable n'a pas de `Assert\Length(max == ORM length)` (hors whitelist).
+
+Une contrainte non gérée par le mapping du test le fait échouer : il faut l'ajouter explicitement
+(anti faux positif vert).
+
+---
+
+## 2. Pagination (Garde-fou : `CollectionsArePaginatedTest`)
+
+**Règle** : toute collection API DOIT être paginée. Aucun retour de collection complète côté serveur.
+
+### Standard global
+
+Posé dans `config/packages/api_platform.yaml` (section `defaults:`) et hérité par toutes les ressources :
+
+| Clé | Valeur | Effet |
+|---|---|---|
+| `pagination_enabled` | `true` | Pagination Hydra active par défaut. |
+| `pagination_items_per_page` | `10` | Taille de page par défaut, alignée sur l'UI `MalioDataTable`. |
+| `pagination_maximum_items_per_page` | `50` | Borne dure : `?itemsPerPage=999` → ramené à 50. Anti deep-fetch. |
+| `pagination_client_items_per_page` | `true` | Le client peut envoyer `?itemsPerPage=25` (bornée par le max). |
+| `pagination_client_enabled` | `true` | Le client peut envoyer `?pagination=false` pour TOUT récupérer (échappatoire selects). |
+
+### Override par ressource (rare)
+
+Si une ressource a besoin d'un autre défaut (ex: payload lourd), utiliser les attributs sur l'opération.
+**JAMAIS `paginationEnabled: false`** sans whitelist explicite dans
+`tests/Architecture/CollectionsArePaginatedTest::EXCLUDED`.
+
+```php
+new GetCollection(
+    paginationItemsPerPage: 5,           // override taille par défaut
+    paginationMaximumItemsPerPage: 20,   // override borne max
+)
+```
+
+### Selects et autocomplétions
+
+Pour alimenter un `<select>` ou un drawer RBAC (Role, Permission, Site, CategoryType), le front passe :
+
+```ts
+useApi().get('/api/roles?pagination=false')
+```
+
+Le serveur retourne toute la collection, sans `view`. C'est l'échappatoire prévue par
+`pagination_client_enabled: true`. Sur les ressources à forte volumétrie, préférer une saisie assistée
+(recherche serveur via `?q=`) — à planifier dans un ticket dédié.
+
+Les tests fonctionnels qui exercent ce comportement doivent également passer `?pagination=false`
+(cf. `CategoryListTest`, `PermissionApiTest`).
+
+### Providers customs et pagination
+
+Un provider custom qui retourne un `array` brut sur une `CollectionOperationInterface`
+**court-circuite la pagination Hydra** (pas de `totalItems`, pas de `view`). Patterns supportés :
+
+- **ORM** : injecter `ApiPlatform\State\Pagination\Pagination`, wrap un
+  `Doctrine\ORM\Tools\Pagination\Paginator` dans `ApiPlatform\Doctrine\Orm\Paginator`. Exemple : `CategoryProvider`.
+- **DBAL** : implémenter un paginator local conforme à `PaginatorInterface`. Exemple : `DbalPaginator`
+  (Core) + `AuditLogProvider`.
+
+Gérer l'échappatoire `?pagination=false` :
+
+```php
+if (!$this->pagination->isEnabled($operation, $context)) {
+    return $qb->getQuery()->getResult(); // tout retourner
+}
+```
+
+### Garde-fou architecture
+
+`tests/Architecture/CollectionsArePaginatedTest` scanne réflexivement toutes les classes
+`#[ApiResource]` sous `src/` et échoue si une `GetCollection` pose `paginationEnabled: false` hors
+whitelist `EXCLUDED`. Ajouter une entrée à la whitelist requiert une justification courte + un ticket
+Lesstime ouvert.
+
+---
+
+## 3. Libellé i18n du type d'entité auditée (Garde-fou : `AuditableEntitiesHaveI18nLabelTest`)
+
+**Toute entité `#[Auditable]` doit avoir son libellé FR dans le bloc `audit.entity` de
+`frontend/i18n/locales/fr.json`.** C'est la contrepartie i18n de l'attribut : sans elle, le filtre
+« Type d'entité » de l'audit-log affiche le type technique brut (ex: `commercial.Client`) au lieu d'un
+libellé lisible.
+
+Pourquoi : le filtre est dynamique (`GET /audit-log-entity-types` renvoie les `entity_type` distincts
+présents en base) ; dès qu'un module audite une entité, son type y apparaît. Le front
+(`formatEntityType`, `audit-log.vue`) construit la clé `audit.entity.<module>_<entity>` et, faute de
+traduction, **retombe silencieusement** sur le type brut.
+
+Dérivation de la clé (emplacement centralisé + schéma flat — décision ERP-99) :
+
+| FQCN entité | `entity_type` (back) | Clé i18n (flat) |
+|---|---|---|
+| `App\Module\Commercial\Domain\Entity\Client` | `commercial.Client` | `commercial_client` |
+| `App\Module\Commercial\Domain\Entity\ClientAddress` | `commercial.ClientAddress` | `commercial_clientaddress` |
+| `App\Module\Catalog\Domain\Entity\Category` | `catalog.Category` | `catalog_category` |
+
+Règle : `strtolower(module)` + `_` + `strtolower(Entity)`. Ajouter sa clé de libellé audit fait partie
+de la **définition de fini** d'une entité métier auditée.
+
+**Garde-fou** : `tests/Architecture/AuditableEntitiesHaveI18nLabelTest` scanne les entités `#[Auditable]`
+et échoue si une seule n'a pas sa clé `audit.entity.*`. Conclusion : créer une entité `#[Auditable]`
+sans son libellé i18n casse `make test`.
+
+---
+
+## 4. Timestampable + Blamable (Garde-fou : `EntitiesAreTimestampableBlamableTest`)
+
+Toute **nouvelle** entité métier sous `src/Module/*/Domain/Entity/` doit porter les 4 colonnes
+`created_at` / `updated_at` / `created_by` / `updated_by`, remplies automatiquement. Trois lignes à
+ajouter à l'entité :
+
+```php
+use App\Shared\Domain\Contract\BlamableInterface;
+use App\Shared\Domain\Contract\TimestampableInterface;
+use App\Shared\Domain\Trait\TimestampableBlamableTrait;
+
+class MyEntity implements TimestampableInterface, BlamableInterface
+{
+    use TimestampableBlamableTrait; // porte les 4 props + getters/setters
+    // ... reste métier
+}
+```
+
+- Le `TimestampableBlamableSubscriber` (`Shared/Infrastructure/Doctrine/`) remplit les colonnes au
+  `prePersist` / `preUpdate`. Hors contexte HTTP (CLI, cron, migration), le blame reste `null`
+  (libellé « Système » côté front).
+- La migration de l'entité doit créer les 4 colonnes (`created_at` / `updated_at` NOT NULL,
+  `created_by` / `updated_by` nullable `ON DELETE SET NULL`).
+- **Garde-fou CI** : `tests/Architecture/EntitiesAreTimestampableBlamableTest` échoue si une entité
+  oublie le pattern. Un référentiel statique justifié (ex: `CategoryType`) doit être explicitement
+  whitelisté dans la constante `EXCLUDED` avec un commentaire.
+- Spec complète : @docs/specs/M0-categories/spec-back.md § 2.8 + § 2.8.bis
+
+---
+
+## 5. Migrations Doctrine — COMMENT ON COLUMN (Garde-fou : `ColumnsHaveSqlCommentTest`)
+
+**Toute migration qui crée ou modifie une colonne d'une table métier doit poser un `COMMENT ON COLUMN`
+décrivant le champ.** La description est stockée dans `pg_description` et visible dans tous les outils
+d'admin BDD (DBeaver, DataGrip, pgAdmin), sans avoir à lire les annotations PHP.
+
+**Format de la description** :
+- En français
+- ≤ 200 caractères
+- Sémantique du champ — contraintes / lien RG si pertinent
+- Pour les colonnes d'identifiant ou FK, mentionner la cible
+
+Exemples :
+
+```php
+// Migration : création d'une colonne avec son commentaire dans la même migration
+$this->addSql("ALTER TABLE client ADD COLUMN siren VARCHAR(9) DEFAULT NULL");
+$this->addSql("COMMENT ON COLUMN client.siren IS 'SIREN (9 chiffres) — identifiant legal entreprise. Unique parmi non-archives (RG-1.15).'");
+
+// Cas FK : préciser la cible
+$this->addSql("COMMENT ON COLUMN client.legal_form_id IS 'Reference forme juridique (SARL, SAS, SA...) — FK -> legal_form.id, ON DELETE RESTRICT.'");
+
+// Cas booléen : préciser le sens et la valeur par défaut
+$this->addSql("COMMENT ON COLUMN user.is_admin IS 'Drapeau super-administrateur — bypass complet RBAC. Faux par defaut.'");
+
+// Bonus : décrire la table elle-même
+$this->addSql("COMMENT ON TABLE client IS 'Repertoire clients (M1 Commercial) — entites archivables.'");
+```
+
+### Helper Timestampable/Blamable
+
+Les 4 colonnes `created_at`, `updated_at`, `created_by`, `updated_by` ajoutées par
+`TimestampableBlamableTrait` reçoivent une description **standardisée** via le helper centralisé pour
+éviter la duplication. Helper à créer ou appeler :
+
+```php
+// Dans la migration, après avoir ajouté les 4 colonnes :
+$this->addStandardTimestampableBlamableComments($schema, 'client');
+```
+
+L'implémentation du helper applique :
+- `created_at` : « Horodatage de creation de la ligne (UTC, rempli automatiquement par TimestampableBlamableSubscriber). »
+- `updated_at` : « Horodatage de derniere modification de la ligne (UTC, rempli automatiquement par TimestampableBlamableSubscriber). »
+- `created_by` : « ID de l'utilisateur ayant cree la ligne — null pour les creations hors HTTP (CLI, migration, fixture). FK -> user.id, ON DELETE SET NULL. »
+- `updated_by` : « ID de l'utilisateur ayant modifie la ligne en dernier — null pour les modifications hors HTTP. FK -> user.id, ON DELETE SET NULL. »
+
+### Garde-fou architecture
+
+`tests/Architecture/ColumnsHaveSqlCommentTest` parcourt `information_schema.columns` filtré sur le
+schéma `public` et échoue si **une seule colonne** n'a pas de `col_description`. Seules les tables
+système (`doctrine_migration_versions`) et la whitelist `EXCLUDED_TABLES` explicite (commentaire de
+justification + ticket Lesstime ouvert pour le retrofit) sont tolérées.
+
+Conclusion : si tu crées une colonne sans poser son `COMMENT ON COLUMN`, `make test` casse en CI.
@@ -75,7 +75,7 @@ jobs:
      - name: Bootstrap test database
        # Aligne sur la cible `test-db-setup` du makefile : apres
        # `schema:update --force`, on RECREE manuellement l'index unique
-        # partiel `uq_category_name_type_active` car Doctrine ORM ne sait
+        # partiel `uq_category_name_active` car Doctrine ORM ne sait
        # pas exprimer les index fonctionnels partiels (LOWER(name) + WHERE
        # deleted_at IS NULL) et `schema:update` les considere comme
        # orphelins et les DROP — collisions non detectees, tests d'unicite
@@ -89,7 +89,7 @@ jobs:
          php bin/console app:apply-column-comments --env=test --no-interaction
          php bin/console doctrine:fixtures:load --env=test --no-interaction
          php bin/console app:sync-permissions --env=test --no-interaction
-          php bin/console --env=test dbal:run-sql "CREATE UNIQUE INDEX IF NOT EXISTS uq_category_name_type_active ON category (LOWER(name), category_type_id) WHERE deleted_at IS NULL"
+          php bin/console --env=test dbal:run-sql "CREATE UNIQUE INDEX IF NOT EXISTS uq_category_name_active ON category (LOWER(name)) WHERE deleted_at IS NULL"

      - name: Run PHPUnit
        run: php -d memory_limit=512M vendor/bin/phpunit
@@ -1,209 +1,362 @@
 # Starseed

-CRM/ERP — Symfony 8 (API Platform 4) + Nuxt 4
+CRM/ERP en architecture **modular monolith DDD** — Symfony 8 (API Platform 4) + Nuxt 4.
+
+Le backend est la **source de vérité unique** : il décide des modules actifs et de
+l'organisation de la sidebar. Le frontend scanne `frontend/modules/*/` comme layers
+Nuxt et consomme l'API pour la navigation.
+
+---
+
+## Sommaire
+
+- [Stack](#stack)
+- [Prérequis](#prérequis)
+- [Démarrage rapide](#démarrage-rapide)
+- [Dev local : avec ou sans données de seed](#dev-local--avec-ou-sans-données-de-seed)
+- [Comptes (dev)](#comptes-dev)
+- [Bases de données : dev et test](#bases-de-données--dev-et-test)
+- [Tests](#tests)
+- [Déploiement : seed RBAC en recette / prod](#déploiement--seed-rbac-en-recette--prod)
+- [Commandes make](#commandes-make)
+- [Architecture](#architecture)
+- [Structure du dépôt](#structure-du-dépôt)
+- [CI/CD](#cicd)
+- [Conventions](#conventions)
+
+---

 ## Stack

 - **Backend** : PHP 8.4, Symfony 8, API Platform 4, Doctrine ORM, PostgreSQL 16
- **Frontend** : Nuxt 4 (SPA), Vue 3, Pinia, Tailwind CSS, @malio/layer-ui
- **Auth** : JWT HTTP-only cookie (Lexik)
+- **Frontend** : Nuxt 4 (SPA, SSR off), Vue 3, Pinia, Tailwind CSS, @malio/layer-ui, @nuxtjs/i18n
+- **Auth** : JWT HTTP-only cookie (Lexik), login sur `/login_check`
 - **Infra** : Docker Compose (dev + prod multi-stage)
 - **CI/CD** : Gitea Actions (auto-tag + build Docker)

-## Quick Start
+| Service       | Port |
+|---------------|------|
+| API (Nginx)   | 8083 |
+| Frontend dev  | 3004 |
+| PostgreSQL    | 5437 |
+
+---
+
+## Prérequis
+
+- Docker + Docker Compose
+- `make`
+- `nvm` (la version de Node est fixée par `.nvmrc`, voir `make node-use`)
+
+Toutes les commandes `make` s'exécutent dans le container PHP (`php-starseed-fpm`) ;
+rien n'est requis sur l'hôte hormis Docker — **sauf les tests E2E**, qui tournent sur
+l'hôte (navigateur réel, voir [Tests](#tests)).
+
+---
+
+## Démarrage rapide

 ```bash
-make start           # Demarrer les containers Docker
-make install         # Composer, migrations, fixtures, build Nuxt
+make start      # Démarre les containers Docker
+make install    # Composer + clés JWT + migrations + permissions + BDD de test
+make dev-nuxt   # Serveur Nuxt avec hot reload (http://localhost:3004)
 ```

-Dev frontend (hot reload) :
+`make install` prépare une base de dev **vierge** (schéma + RBAC structurel, sans
+données de démo) et la base de **test**. Pour obtenir des comptes et des données de
+démo prêtes à l'emploi, lis la section suivante.
+
+> Override local possible : `make` lit `infra/dev/.env.docker`, surchargé par
+> `infra/dev/.env.docker.local` s'il existe (créé automatiquement par `make env-init`).
+
+---
+
+## Dev local : avec ou sans données de seed
+
+Le projet distingue deux états de base de données de dev. Les **fixtures Doctrine sont
+en `require-dev`** : elles n'existent qu'en dev, jamais dans le build de prod.
+
+### Sans données de seed (base vierge)
+
+C'est ce que produit `make install`. La base contient :
+
+- le **schéma** complet (toutes les migrations jouées) ;
+- les **rôles système** `admin` / `user` (seedés en SQL par la migration RBAC) ;
+- le **catalogue de permissions** synchronisé (`app:sync-permissions`).
+
+Mais **aucun compte utilisateur ni donnée métier**. Pour pouvoir te connecter,
+crée toi-même un compte :

 ```bash
-make dev-nuxt        # Port 3003
+make shell
+php bin/console app:create-user admin monMotDePasse --admin   # compte ROLE_ADMIN
 ```

-## Ports
+Optionnel — provisionner les **rôles métier** (bureau / compta / commerciale / usine
+ matrice RBAC § 2.7) sans comptes de démo :

-| Service    | Port |
-|------------|------|
-| API (Nginx)| 8083 |
-| Frontend   | 3004 |
-| PostgreSQL | 5437 |
+```bash
+php bin/console app:seed-rbac
+```

-## Commandes
+Cet état est utile pour repartir d'une base propre, reproduire un bug sur données
+minimales, ou tester un parcours d'onboarding réel.

-| Commande | Description |
-|----------|-------------|
-| `make start` | Demarrer les containers |
-| `make stop` | Arreter les containers |
-| `make restart` | Redemarrer les containers |
-| `make install` | Install complet |
-| `make reset` | Tout supprimer et reinstaller |
-| `make dev-nuxt` | Serveur dev Nuxt (hot reload) |
-| `make shell` | Shell dans le container PHP |
-| `make cache-clear` | Vider le cache Symfony |
-| `make migration-migrate` | Lancer les migrations |
-| `make fixtures` | Charger les fixtures |
-| `make db-reset` | Reset BDD + migrations + fixtures |
-| `make test` | PHPUnit (tests back) |
-| `make nuxt-test` | Vitest (tests unitaires front) |
-| `make test-e2e` | Playwright (tests E2E front) |
-| `make test-e2e-ui` | Playwright UI interactive (debug) |
-| `make seed-e2e` | Seed les 6 personas E2E |
-| `make install-e2e-deps` | One-time : Chromium + libs systeme (sudo) |
-| `make php-cs-fixer-allow-risky` | Fix code style PHP |
-| `make logs-dev` | Tail logs Symfony |
+### Avec données de seed (base de démo)
+
+`make db-reset` (ou `make fixtures` après un `make install`) recharge la base de dev
+avec un jeu complet de données de démonstration, **idempotent** :
+
+```bash
+make db-reset   # ATTENTION : drop + recrée la base de dev, puis charge tout le seed
+```
+
+Ce que les fixtures posent :
+
+- **3 utilisateurs système** : `admin` (ROLE_ADMIN), `alice`, `bob` (ROLE_USER),
+  rattachés à des sites distincts ;
+- **3 sites** : Chatellerault, Saint-Jean, Pommevic ;
+- **les comptes de démo RBAC métier** (`bureau`, `compta`, `commerciale`, `usine`,
+  mot de passe `demo`) avec la matrice § 2.7 attachée ;
+- les **référentiels et données métier** des modules (catégories, clients de démo,
+  référentiels comptables…).
+
+Toutes les fixtures sont rejouables sans effet de bord (lookup par clé naturelle,
+aucun doublon).
+
+> Différence avec `make install` : `install` ne charge **pas** les fixtures sur la base
+> de dev (il alimente uniquement la base de test). Utilise `make db-reset` ou
+> `make fixtures` quand tu veux des données de démo en dev.
+
+---
+
+## Comptes (dev)
+
+Disponibles uniquement après `make db-reset` / `make fixtures` (état « avec seed ») :
+
+| Username      | Password | Rôle       | RBAC métier                                                   |
+|---------------|----------|------------|---------------------------------------------------------------|
+| `admin`       | `admin`  | ROLE_ADMIN | bypass complet (`is_admin`)                                   |
+| `alice`       | `alice`  | ROLE_USER  | —                                                             |
+| `bob`         | `bob`    | ROLE_USER  | —                                                             |
+| `bureau`      | `demo`   | ROLE_USER  | clients : view + manage                                       |
+| `compta`      | `demo`   | ROLE_USER  | clients : view + accounting.view / manage                     |
+| `commerciale` | `demo`   | ROLE_USER  | clients : view + manage                                       |
+| `usine`       | `demo`   | ROLE_USER  | aucun accès clients                                           |
+
+---
+
+## Bases de données : dev et test
+
+Deux bases distinctes vivent dans le **même container PostgreSQL** (port 5437) :
+
+| Base       | Environnement | Construite par                       | Usage                          |
+|------------|---------------|--------------------------------------|--------------------------------|
+| `<db>`      | `dev`         | `make install` / `make db-reset`     | développement manuel, dev-nuxt |
+| `<db>_test` | `test`        | `make test-db-setup`                 | PHPUnit (jamais touchée à la main) |
+
+Le suffixe `_test` est appliqué **automatiquement** par Doctrine quand `APP_ENV=test`
+(config `when@test` dans `config/packages/doctrine.yaml`). La base de test est donc
+totalement **isolée** de la base de dev : lancer `make test` ne touche jamais tes
+données de dev.
+
+`make test-db-setup` fait davantage que jouer les migrations, car certaines structures
+ne sont pas portées par des migrations « métier » :
+
+1. `doctrine:migrations:migrate` — schéma métier réel ;
+2. `doctrine:schema:update --force` — crée les tables mappées en `when@test`
+   uniquement (entités de test) ;
+3. `app:apply-column-comments` — réapplique les `COMMENT ON COLUMN` que
+   `schema:update` efface sur les tables managées par l'ORM (garde-fou
+   `ColumnsHaveSqlCommentTest`) ;
+4. `fixtures:load` → `sync-permissions` → `seed-rbac` — dans cet ordre précis
+   (le purger des fixtures vide la table `permission`, donc la sync passe après) ;
+5. recréation des **index partiels uniques** (`LOWER(...) WHERE ...`) non exprimables
+   en attributs ORM, indispensables aux tests d'unicité (RG-1.07, RG-1.16, RG-1.03/1.29).
+
+`make install` et `make db-reset` appellent déjà `test-db-setup` : tu n'as à le
+relancer à la main que si la base de test diverge (nouvelle migration, nouvelle
+permission) sans vouloir reseed la base de dev.
+
+---

 ## Tests

- **Back** : `make test` (PHPUnit). Fixtures dediees sous `tests/Fixtures/`.
- **Front unitaire** : `make nuxt-test` (Vitest, happy-dom). Composables, utils, stores — rapide, <30s.
- **Front E2E** : `make test-e2e` (Playwright). Couvre login + matrice RBAC sidebar. Suite volontairement minimaliste (11 tests) — voir la regle d'or dans `CLAUDE.md`.
+| Suite             | Commande         | Outil                | Où                                |
+|-------------------|------------------|----------------------|-----------------------------------|
+| Back              | `make test`      | PHPUnit              | container PHP, base `<db>_test`   |
+| Front unitaire    | `make nuxt-test` | Vitest (happy-dom)   | container Node, < 30 s            |
+| Front E2E         | `make test-e2e`  | Playwright           | **hôte** (navigateur réel requis) |
+| Tout (back+front) | `make test-all`  | PHPUnit + Vitest     | —                                 |
+
+### Tests back (PHPUnit)

-**Bootstrap E2E (une fois par poste)** :
 ```bash
-make install-e2e-deps   # Telecharge Chromium + libs systeme via apt (sudo)
+make test                       # toute la suite
+make test FILES=tests/Module/Commercial   # un dossier / fichier ciblé
 ```

-**Workflow E2E** :
+PHPUnit force `APP_ENV=test` (`phpunit.dist.xml`) : les tests tournent **toujours**
+sur la base `<db>_test`, jamais sur la base de dev. Prérequis : que la base de test
+existe — c'est le cas après `make install`. Si elle a divergé, rejoue
+`make test-db-setup` (cf. [Bases de données](#bases-de-données--dev-et-test)).
+
+### Tests front unitaires (Vitest)
+
 ```bash
-# Terminal 1 : containers + dev server
+make nuxt-test   # composables, utils, stores — rapide et stable
+```
+
+C'est la **place par défaut** pour étendre la couverture (cf. règle d'or ci-dessous).
+
+### Tests E2E (Playwright)
+
+Suite volontairement minimaliste (login + matrice RBAC sidebar). **Règle d'or : un
+nouveau test E2E ne s'ajoute que si un bug critique est passé en prod** — sinon,
+préférer un test Vitest ou étendre un persona existant.
+
+Bootstrap (une fois par poste) :
+
+```bash
+make install-e2e-deps   # télécharge Chromium + libs système (apt/dnf, sudo)
+```
+
+Workflow :
+
+```bash
+# Terminal 1 — containers, seed des personas, serveur dev
 make start && make seed-e2e && make dev-nuxt

-# Terminal 2 : tests
-make test-e2e
+# Terminal 2 — tests
+make test-e2e            # headless
+make test-e2e-ui         # UI interactive (debug)
 ```

+> Toute permission testable touche **3 miroirs** à garder alignés : `config/sidebar.php`,
+> `frontend/tests/e2e/_fixtures/personas.ts`, `SeedE2ECommand.php`.
+
+---
+
+## Déploiement : seed RBAC en recette / prod
+
+Les fixtures Doctrine étant en `require-dev`, elles sont **absentes du build de prod**.
+Le RBAC métier (rôles `bureau` / `compta` / `commerciale` / `usine` + matrice § 2.7)
+est seedé par une **commande applicative idempotente**, jouée dans l'étape de release,
+**après** les migrations et la synchronisation des permissions :
+
+```bash
+php bin/console doctrine:migrations:migrate --no-interaction
+php bin/console app:sync-permissions      # pose les permissions (commercial.clients.*, …)
+php bin/console app:seed-rbac             # PROD : rôles + matrice § 2.7 (sans comptes démo)
+```
+
+En **recette / staging**, ajouter le flag pour disposer de logins de test. Le mot de
+passe est fourni **explicitement** (jamais en dur, jamais committé) :
+
+```bash
+php bin/console app:seed-rbac --with-demo-users --password='<mot-de-passe>'
+# ou via la variable d'environnement RBAC_DEMO_PASSWORD
+```
+
+La commande est rejouable sans effet de bord (aucun doublon de rôle, de lien ou de
+compte). Pour créer un premier administrateur en prod :
+
+```bash
+php bin/console app:create-user <username> <password> --admin
+```
+
+---
+
+## Commandes make
+
+`make` (sans argument) ou `make help` affiche l'aide colorée. Les principales :
+
+| Commande                       | Description                                              |
+|--------------------------------|----------------------------------------------------------|
+| `make start` / `stop` / `restart` | Cycle de vie des containers                          |
+| `make install`                 | Install complet (base dev vierge + base de test)         |
+| `make reset`                   | Tout supprimer et réinstaller (**drop la BDD**)          |
+| `make dev-nuxt`                | Serveur Nuxt hot reload (port 3004)                      |
+| `make shell` / `shell-root`    | Shell bash dans le container PHP                         |
+| `make migration-migrate`       | Jouer les migrations Doctrine                            |
+| `make fixtures`                | Charger les fixtures (données de démo dev)               |
+| `make sync-permissions`        | Synchroniser le catalogue RBAC                           |
+| `make seed-rbac`               | Seed RBAC métier (rôles + matrice § 2.7)                 |
+| `make db-reset`                | Reset base dev : drop + migrate + fixtures + RBAC        |
+| `make test-db-setup`           | (Re)construire la base de test                           |
+| `make test`                    | PHPUnit (back)                                           |
+| `make nuxt-test`               | Vitest (front unitaire)                                  |
+| `make test-all`                | PHPUnit + Vitest                                         |
+| `make test-e2e` / `test-e2e-ui`| Playwright (E2E, sur l'hôte)                             |
+| `make seed-e2e`                | Seed des 6 personas E2E                                  |
+| `make php-cs-fixer-allow-risky`| Fix du code style PHP                                    |
+| `make php-cs-fixer-check`      | Dry-run du fixer (CI / avant push)                       |
+| `make logs-dev`                | Tail des logs Symfony                                    |
+
+---
+
 ## Architecture

-**Modular Monolith DDD** : chaque module est un bounded context autonome, activable/desactivable par tenant. Le backend est la seule source de verite pour l'activation et l'organisation de la sidebar.
+**Modular Monolith DDD** : chaque module est un bounded context autonome,
+activable / désactivable par tenant. Le backend est la seule source de vérité pour
+l'activation des modules et l'organisation de la sidebar.

 - `config/modules.php` — liste des modules actifs
 - `config/sidebar.php` — structure de la sidebar (sections + items avec module owner)
- `GET /api/sidebar` — retourne les sections filtrees par les modules actifs + les routes desactivees
- Frontend : chaque `frontend/modules/*/` est auto-detecte comme layer Nuxt, la sidebar est fetchee de l'API
+- `GET /api/modules` — IDs des modules actifs (public)
+- `GET /api/sidebar` — sections filtrées par modules actifs + routes désactivées (public)

-Pour desactiver un module : commenter sa ligne dans `config/modules.php`, clear cache. Ses items de sidebar disparaissent et ses routes sont bloquees par le middleware front.
+**Désactiver un module** : commenter sa ligne dans `config/modules.php`, vider le cache.
+Ses items de sidebar disparaissent et ses routes sont bloquées par le middleware front.
+Le code reste dans le bundle (layer auto-détecté) → réactivation instantanée.

-Pour reorganiser la sidebar (ex: deplacer un item d'une section a l'autre) : editer `config/sidebar.php` uniquement, le code des modules n'est pas touche.
+**Réorganiser la sidebar** : éditer `config/sidebar.php` uniquement — le code des
+modules n'est pas touché.

-## Structure
+**Communication inter-modules** : jamais d'import direct d'un module à l'autre. Passer
+par `Shared/Domain/Contract/` (interfaces) ou des domain events.
+
+---
+
+## Structure du dépôt

 ```
 src/                              # Backend Symfony
-  Kernel.php
-  Shared/                         # Noyau technique partage
-    Domain/
-      ValueObject/                # Email, ...
-      Event/                      # DomainEventInterface
-      Contract/                   # Interfaces inter-modules
-    Application/
-      Bus/                        # CommandBusInterface, QueryBusInterface
-    Infrastructure/
-      ApiPlatform/
-        Resource/                 # AppVersion, ModulesResource, SidebarResource
-        State/                    # AppVersionProvider, ModulesProvider, SidebarProvider
+  Shared/                         # Noyau technique partagé (Domain/, Application/Bus/, Infrastructure/ApiPlatform/)
  Module/
-    Core/                         # Module obligatoire (auth, users)
-      CoreModule.php              # Declaration (ID, LABEL, REQUIRED)
-      Domain/
-        Entity/                   # User
-        Repository/               # UserRepositoryInterface
-        Event/                    # UserCreated
-      Application/
-        DTO/                      # UserOutput
-      Infrastructure/
-        Doctrine/                 # DoctrineUserRepository, Migrations/
-        ApiPlatform/State/
-          Provider/               # MeProvider
-          Processor/              # UserPasswordHasherProcessor
-        Console/                  # CreateUserCommand
-        DataFixtures/             # AppFixtures
-    Commercial/                   # Autre module (exemple)
-      CommercialModule.php
+    Core/                         # Module obligatoire (auth, users, RBAC)
+      CoreModule.php              # Déclaration (ID, LABEL, REQUIRED, permissions())
+      Domain/ Application/ Infrastructure/
+    Commercial/ Catalog/ Sites/   # Modules métier
 config/
-  modules.php                     # Source de verite activation
-  sidebar.php                     # Source de verite navigation
-  version.yaml
-  packages/                       # Config Symfony
-  jwt/                            # Cles JWT
-migrations/                       # Anciennes migrations
+  modules.php                     # Source de vérité : activation
+  sidebar.php                     # Source de vérité : navigation
+  packages/                       # Config Symfony (doctrine, api_platform, security…)
+migrations/                       # Migrations d'initialisation (namespace racine : setup, RBAC, seed de base)
 frontend/                         # App Nuxt 4 (SPA)
-  app/
-    layouts/                      # default.vue, auth.vue
-    middleware/                   # auth.global.ts, modules.global.ts
-  shared/                         # Code partage (hors modules)
-    composables/                  # useApi, useAppVersion, useSidebar
-    components/ui/                # AppTopNav, ...
-    stores/                       # auth, ui
-    services/                     # auth
-    types/                        # SidebarSection, UserData
-    utils/                        # api (Hydra)
-  modules/                        # Modules auto-detectes comme layers Nuxt
-    core/
-      nuxt.config.ts              # Marqueur layer
-      pages/                      # index, login, logout
-    commercial/
-      nuxt.config.ts
-      pages/                      # commercial.vue
-  app.vue
-  nuxt.config.ts                  # Scanne modules/*/ automatiquement
-  i18n/locales/                   # Traductions (sidebar.*, etc.)
-  assets/                         # CSS, images
-  public/                         # Fichiers statiques
+  app/                            # Shell : layouts, middlewares (auth.global, modules.global)
+  shared/                         # Code inter-modules (composables, stores, utils, types)
+  modules/                        # Layers Nuxt auto-détectés (core/, commercial/…)
+  i18n/locales/                   # Traductions (sidebar.*, audit.entity.*, …)
 infra/
-  dev/                            # Docker dev (Dockerfile, nginx, php.ini, xdebug)
+  dev/                            # Docker dev (Dockerfile, nginx, php.ini, xdebug, .env.docker)
  prod/                           # Docker prod (multi-stage, nginx, php-prod.ini)
 .gitea/workflows/                 # CI Gitea (auto-tag, build Docker)
-.claude/
-  skills/create-module/           # Skill Claude Code pour scaffolder un module
 ```

+---
+
 ## CI/CD

 - **Auto Tag** : push sur `develop` → bump `config/version.yaml` → tag `vX.Y.Z`
 - **Build Docker** : push tag `v*` → build image multi-stage → push Gitea Registry

 Secrets requis dans Gitea :
+
 - `RELEASE_TOKEN` — PAT avec droits `write:repository`
 - `REGISTRY_TOKEN` — token pour le registry Docker

-## Déploiement — seed RBAC (recette / prod)
-
-Le RBAC métier (rôles `bureau` / `compta` / `commerciale` / `usine` + matrice § 2.7)
-est seedé par une **commande applicative idempotente** (présente dans le build prod,
-contrairement aux fixtures Doctrine en `require-dev`). À jouer dans l'étape de release,
-**après** les migrations et la synchronisation des permissions :
-
-```bash
-php bin/console doctrine:migrations:migrate --no-interaction
-php bin/console app:sync-permissions          # pose les permissions commercial.clients.*
-php bin/console app:seed-rbac                  # PROD : rôles + matrice § 2.7 (sans comptes démo)
-```
-
-En **recette / staging**, ajouter le flag pour disposer de logins de test (mot de passe
-fourni explicitement, jamais en dur) :
-
-```bash
-php bin/console app:seed-rbac --with-demo-users --password='<mot-de-passe>'
-# ou via la variable d'env RBAC_DEMO_PASSWORD
-```
-
-La commande est rejouable sans effet de bord (aucun doublon de rôle, de lien ou de compte).
-En dev, `make db-reset` produit le même résultat (rôles + matrice + comptes démo).
-
-## Credentials (dev)
-
-| Username | Password | Role | RBAC métier |
-|----------|----------|------|-------------|
-| admin | admin | ROLE_ADMIN | bypass (is_admin) |
-| alice | alice | ROLE_USER | — |
-| bob | bob | ROLE_USER | — |
-| bureau | demo | ROLE_USER | clients : view + manage |
-| compta | demo | ROLE_USER | clients : view + accounting.view/manage |
-| commerciale | demo | ROLE_USER | clients : view + manage (Information obligatoire — RG-1.04) |
-| usine | demo | ROLE_USER | aucun accès clients |
+---

 ## Conventions

@@ -213,4 +366,13 @@ En dev, `make db-reset` produit le même résultat (rôles + matrice + comptes d
 <type>(<scope optionnel>) : <message>
 ```

-Types : `build`, `chore`, `ci`, `docs`, `feat`, `fix`, `perf`, `refactor`, `revert`, `style`, `test`
+Espaces obligatoires autour du `:`. Types : `build`, `chore`, `ci`, `docs`, `feat`,
+`fix`, `perf`, `refactor`, `revert`, `style`, `test`.
+
+### Langue
+
+- UI et communication : **français**
+- Code (classes, méthodes, variables) : **anglais**
+- Commentaires (PHP, TS, Vue) : **français**
+
+> Règles détaillées : `CLAUDE.md` et `.claude/rules/`.
@@ -33,6 +33,7 @@
        "symfony/runtime": "8.0.*",
        "symfony/security-bundle": "8.0.*",
        "symfony/serializer": "8.0.*",
+        "symfony/translation": "8.0.*",
        "symfony/twig-bundle": "8.0.*",
        "symfony/uid": "8.0.*",
        "symfony/validator": "8.0.*",
@@ -4,7 +4,7 @@
        "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
        "This file is @generated automatically"
    ],
-    "content-hash": "aada2e60fd7563f1498b5505b37e3f4b",
+    "content-hash": "2dc5db01e7f5d6aecd5956749b21a092",
    "packages": [
        {
            "name": "api-platform/doctrine-common",
@@ -7657,6 +7657,99 @@
            ],
            "time": "2026-03-30T15:14:47+00:00"
        },
+        {
+            "name": "symfony/translation",
+            "version": "v8.0.10",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/symfony/translation.git",
+                "reference": "f63e9342e12646a57c91ef8a366a4f9d8e557b67"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/symfony/translation/zipball/f63e9342e12646a57c91ef8a366a4f9d8e557b67",
+                "reference": "f63e9342e12646a57c91ef8a366a4f9d8e557b67",
+                "shasum": ""
+            },
+            "require": {
+                "php": ">=8.4",
+                "symfony/polyfill-mbstring": "^1.0",
+                "symfony/translation-contracts": "^3.6.1"
+            },
+            "conflict": {
+                "nikic/php-parser": "<5.0",
+                "symfony/http-client-contracts": "<2.5",
+                "symfony/service-contracts": "<2.5"
+            },
+            "provide": {
+                "symfony/translation-implementation": "2.3|3.0"
+            },
+            "require-dev": {
+                "nikic/php-parser": "^5.0",
+                "psr/log": "^1|^2|^3",
+                "symfony/config": "^7.4|^8.0",
+                "symfony/console": "^7.4|^8.0",
+                "symfony/dependency-injection": "^7.4|^8.0",
+                "symfony/finder": "^7.4|^8.0",
+                "symfony/http-client-contracts": "^2.5|^3.0",
+                "symfony/http-kernel": "^7.4|^8.0",
+                "symfony/intl": "^7.4|^8.0",
+                "symfony/polyfill-intl-icu": "^1.21",
+                "symfony/routing": "^7.4|^8.0",
+                "symfony/service-contracts": "^2.5|^3",
+                "symfony/yaml": "^7.4|^8.0"
+            },
+            "type": "library",
+            "autoload": {
+                "files": [
+                    "Resources/functions.php"
+                ],
+                "psr-4": {
+                    "Symfony\\Component\\Translation\\": ""
+                },
+                "exclude-from-classmap": [
+                    "/Tests/"
+                ]
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Fabien Potencier",
+                    "email": "fabien@symfony.com"
+                },
+                {
+                    "name": "Symfony Community",
+                    "homepage": "https://symfony.com/contributors"
+                }
+            ],
+            "description": "Provides tools to internationalize your application",
+            "homepage": "https://symfony.com",
+            "support": {
+                "source": "https://github.com/symfony/translation/tree/v8.0.10"
+            },
+            "funding": [
+                {
+                    "url": "https://symfony.com/sponsor",
+                    "type": "custom"
+                },
+                {
+                    "url": "https://github.com/fabpot",
+                    "type": "github"
+                },
+                {
+                    "url": "https://github.com/nicolas-grekas",
+                    "type": "github"
+                },
+                {
+                    "url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
+                    "type": "tidelift"
+                }
+            ],
+            "time": "2026-05-06T11:30:54+00:00"
+        },
        {
            "name": "symfony/translation-contracts",
            "version": "v3.6.1",
@@ -5,10 +5,12 @@ use App\Module\Catalog\CatalogModule;
 use App\Module\Commercial\CommercialModule;
 use App\Module\Core\CoreModule;
 use App\Module\Sites\SitesModule;
+use App\Module\Technique\TechniqueModule;

 return [
    CoreModule::class,
    CommercialModule::class,
    SitesModule::class,
    CatalogModule::class,
+    TechniqueModule::class,
 ];
@@ -80,6 +80,16 @@ doctrine:
                dir: '%kernel.project_dir%/src/Module/Commercial/Domain/Entity'
                prefix: 'App\Module\Commercial\Domain\Entity'
                alias: Commercial
+            # Mapping inconditionnel du module Technique (meme logique que Commercial) :
+            # les tables prestataires (provider + sous-collections + jointures M2M)
+            # creees par la migration M3 (Version20260612100000) doivent etre connues
+            # de l'ORM. L'activation fonctionnelle passe par config/modules.php.
+            Technique:
+                type: attribute
+                is_bundle: false
+                dir: '%kernel.project_dir%/src/Module/Technique/Domain/Entity'
+                prefix: 'App\Module\Technique\Domain\Entity'
+                alias: Technique
        controller_resolver:
            auto_mapping: false

@@ -3,6 +3,14 @@ lexik_jwt_authentication:
    public_key: '%env(resolve:JWT_PUBLIC_KEY)%'
    pass_phrase: '%env(JWT_PASSPHRASE)%'
    token_ttl: '%env(int:JWT_TOKEN_TTL)%'
+    # Tolerance d'horloge (en secondes) appliquee a la validation des claims
+    # temporels iat / nbf / exp (LooseValidAt cote lcobucci). Sans cette marge
+    # (defaut 0), un recul d'horloge entre la signature (/login_check) et la
+    # requete suivante rend iat/nbf « dans le futur » -> « Invalid JWT Token »
+    # (401). Observe en dev sous WSL2/Docker (horloge CLOCK_REALTIME non
+    # monotone) : flakes intermittents de la suite PHPUnit (ERP-98). Benefice
+    # aussi en prod si les noeuds derivent legerement entre eux.
+    clock_skew: 15
    remove_token_from_body_when_cookies_used: true
    token_extractors:
        authorization_header:
@@ -0,0 +1,12 @@
+doctrine:
+    dbal:
+        connections:
+            # Force le profiling DBAL en environnement de test independamment de
+            # APP_DEBUG. Sans cela, la CI tourne en APP_DEBUG=0 (prod-like) et le
+            # service `doctrine.debug_data_holder` n'est pas enregistre : le test
+            # anti-N+1 (SupplierListTest::testListQueryCountDoesNotGrowWithRowCount)
+            # qui compte les requetes via ce holder echoue alors en CI alors qu'il
+            # passe en local (APP_DEBUG=1). Activer le profiling ici garde le test
+            # actif precisement la ou il compte (CI), sans impacter la prod.
+            default:
+                profiling: true
@@ -0,0 +1,12 @@
+framework:
+    # Locale par defaut FR (ERP-107) : les messages natifs des contraintes
+    # Symfony (Email, NotBlank, Length, Iban, Bic...) sont alors servis en
+    # francais via validators.fr.xlf. C'est le FILET ; les contraintes metier
+    # portent en plus un `message:` FR explicite, teste par
+    # tests/Architecture/EntityConstraintsHaveFrenchMessageTest.
+    default_locale: fr
+    translator:
+        default_path: '%kernel.project_dir%/translations'
+        fallbacks:
+            - fr
+        providers:
@@ -38,6 +38,29 @@ declare(strict_types=1);
 */

 return [
+    // Section "Commerciale" : pole metier principal, remontee en tete de sidebar (ERP-71).
+    // L'ordre interne des onglets et les permissions restent inchanges (simple deplacement
+    // du bloc, aucun gate touche).
+    [
+        'label' => 'sidebar.commercial.section',
+        'icon'  => 'mdi:account-arrow-left-outline',
+        'items' => [
+            [
+                'label'      => 'sidebar.commercial.suppliers',
+                'to'         => '/suppliers',
+                'icon'       => 'mdi:account-arrow-left-outline',
+                'module'     => 'commercial',
+                'permission' => 'commercial.suppliers.view',
+            ],
+            [
+                'label'      => 'sidebar.commercial.clients',
+                'to'         => '/clients',
+                'icon'       => 'mdi:account-group-outline',
+                'module'     => 'commercial',
+                'permission' => 'commercial.clients.view',
+            ],
+        ],
+    ],
    // Section "Administration" : regroupe toutes les pages de configuration
    // applicative (RBAC, users, sites, audit log).
    //
@@ -99,25 +122,6 @@ return [
            ],
        ],
    ],
-    [
-        'label' => 'sidebar.commercial.section',
-        'icon'  => 'mdi:account-arrow-left-outline',
-        'items' => [
-            [
-                'label'      => 'sidebar.commercial.clients',
-                'to'         => '/clients',
-                'icon'       => 'mdi:account-group-outline',
-                'module'     => 'commercial',
-                'permission' => 'commercial.clients.view',
-            ],
-            [
-                'label'  => 'sidebar.commercial.suppliers',
-                'to'     => '/suppliers',
-                'icon'   => 'mdi:account-arrow-left-outline',
-                'module' => 'commercial',
-            ],
-        ],
-    ],
    // Section "Mon compte" : espace personnel. Accessible a tout user authentifie
    // (aucune permission RBAC requise, tous les items restent dans `core` pour
    // rester toujours presents meme quand les modules metier sont desactives).
@@ -1,2 +1,2 @@
 parameters:
-    app.version: '0.1.62'
+    app.version: '0.1.113'
@@ -118,6 +118,8 @@ Aucun pattern soft delete existant dans Starseed (vérifié, aucune entité ne p

 Index unique partiel sur `(LOWER(name), category_type_id) WHERE deleted_at IS NULL`. Permet de recréer une catégorie avec le même `(name, type)` après suppression logique. Postgres supporte nativement (`CREATE UNIQUE INDEX ... WHERE`). Pattern propre, pas besoin de validator applicatif maison côté unicité — la contrainte SQL fait le job.

+> **🔗 Évolution ERP-78 (refonte taxonomie M1)** : `Category` porte désormais une colonne **`code`** (`VARCHAR(50)`, NOT NULL), slug MAJUSCULE auto-généré du nom (figé à la création, lecture seule via l'API), avec un **second index unique partiel** `uq_category_code (code) WHERE deleted_at IS NULL`. Ce code est la clé métier stable utilisée par le M1 Commercial (RG-1.03 / RG-1.29). Détail : `docs/specs/M1-clients/spec-back.md` § 3.3.
+
 ### 2.5 Audit & traces temporelles — deux niveaux complémentaires

 Deux mécanismes **indépendants** cohabitent :
@@ -0,0 +1,146 @@
+# Validation « tous les blocs » sur les onglets à blocs dynamiques (Client M1)
+
+> Date : 2026-06-04 · Module : Commercial (M1 Clients) · Tickets liés : ERP-101 / ERP-107
+> Écrans : `clients/new.vue`, `clients/[id]/edit.vue` · Onglets concernés : Contacts, Adresses, RIB
+
+## 1. Problème
+
+À la soumission des onglets à **blocs d'ajout dynamiques** (Contacts / Adresses / RIB), la validation
+par champ ne s'affiche pas correctement. Deux causes **distinctes et cumulées** :
+
+### Cause A — 500 back qui court-circuite la validation (cause racine)
+
+Les opérations `Post` des sous-ressources sont déclarées ainsi :
+
+```php
+new Post(
+    uriTemplate: '/clients/{clientId}/contacts',
+    uriVariables: ['clientId' => new Link(fromClass: Client::class, toProperty: 'client')],
+    processor: ClientContactProcessor::class,
+)
+```
+
+Au stade « read » du POST, API Platform résout `clientId` via `LinksHandlerTrait` (branche `toProperty`,
+`vendor/api-platform/doctrine-orm/State/LinksHandlerTrait.php:134-141`). La requête générée porte sur
+l'entité **enfant** :
+
+```sql
+SELECT o FROM ClientContact o INNER JOIN o.client c WHERE c.id = :clientId
+```
+
+exécutée via `ItemProvider::provide` → `getOneOrNullResult()`
+(`vendor/api-platform/doctrine-orm/State/ItemProvider.php:89`). Donc :
+
+| Nb d'enfants du client | Lignes retournées | Résultat |
+|---|---|---|
+| 0 | 0 | `null` → OK (cas du test CI actuel) |
+| 1 | 1 | OK |
+| **≥ 2** | **≥ 2** | **`NonUniqueResultException` → HTTP 500** |
+
+Conséquence : un client à ≥2 contacts (resp. adresses, RIB) ne peut plus en recevoir un nouveau.
+La 500 survient **avant** la déserialisation/validation → aucune 422 n'est produite → `mapRowError`
+(qui ne mappe que les 422) retombe sur un toast générique.
+
+Les **3** sous-ressources ont strictement la même config → même bug latent (contacts est juste le
+premier à sauter car les clients de démo ont 3 contacts).
+
+### Cause B — la boucle front s'arrête au premier bloc en erreur
+
+`submitContacts` / `submitAddresses` / boucle RIB de `submitAccounting` (dans `new.vue` ET `edit.vue`)
+font `return` dans le `catch` du premier bloc en échec :
+
+```js
+catch (error) {
+    if (!mapRowError(error, contactErrors, index)) { toast(...) }
+    return   // ← stoppe : les blocs suivants ne sont jamais validés ni affichés
+}
+```
+
+→ même une fois le 500 corrigé, seules les erreurs du **premier** bloc fautif s'afficheraient.
+
+## 2. Objectif
+
+À la validation d'un onglet collection, **tenter tous les blocs** et **afficher l'erreur inline sous
+chaque champ fautif, pour chaque bloc**, en un seul aller-retour de soumission. Pas de toast récapitulatif
+(décision : inline seul, cohérent ERP-101). Pas de toast succès tant qu'au moins un bloc reste en erreur.
+
+Hors périmètre : le workflow incrémental (créer le client, puis débloquer les onglets) reste inchangé ;
+les onglets scalaires (Principal / Information / Comptabilité-scalaires) fonctionnent déjà et ne sont pas
+touchés.
+
+## 3. Conception
+
+### 3.1 Back — supprimer le read cassé du POST (cause racine)
+
+Sur les opérations `Post` de `ClientContact`, `ClientAddress`, `ClientRib` :
+
+- Ajouter **`read: false`**. Le stade « read » est inutile : le `*Processor::linkParent` rattache déjà le
+  parent manuellement via `$em->getRepository(Client::class)->find($clientId)`. Pattern déjà employé dans
+  le projet (`Sites/.../CurrentSiteResource.php`).
+- Durcir les 3 `linkParent` : si `find($clientId)` renvoie `null`, lever
+  `Symfony\Component\HttpKernel\Exception\NotFoundHttpException` (préserve le **404** sur parent
+  inexistant — sans le read, on régresserait sinon en 500 au persist sur `client_id NOT NULL`).
+
+Effet : plus de `getOneOrNullResult` foireux → déserialisation + validation Symfony s'exécutent → **422
+propre par champ** avec `violations[].propertyPath` (déjà garanti par ERP-107 : messages FR explicites).
+
+Aucune autre modification (security, normalizationContext, processor restant) n'est nécessaire.
+
+### 3.2 Front — collecter les erreurs de tous les blocs
+
+Dans `submitContacts`, `submitAddresses`, et la boucle RIB de `submitAccounting`, **dans `new.vue` ET
+`edit.vue`** :
+
+- Conserver la réinitialisation du tableau d'erreurs en début de submit (`xxxErrors.value = []`).
+- Introduire un drapeau local `hasError`. Dans le `catch`, remplacer `return` par
+  `hasError = true; continue` → la boucle tente/valide **tous** les blocs ; chaque 422 se mappe sur
+  `xxxErrors[index]` via `mapRowError` (mécanique existante, inchangée).
+- Après la boucle : si `hasError` → **ne pas** appeler `completeTab(...)`, **pas** de toast succès. Sinon
+  → comportement actuel (`completeTab` + toast succès).
+- Les blocs déjà créés (id non-null) repassent en `PATCH` au resubmit → idempotent, pas de doublon.
+- Awaits **séquentiels** conservés (volume faible, ordre des blocs préservé, pas de course).
+
+Le binding inline est déjà en place côté template (`:errors="contactErrors[index]"` /
+`:error="ribErrors[index]?.iban"` …). Aucun changement de composant `Malio*` requis.
+
+### 3.3 Réutilisation / isolation
+
+Le bloc « boucle de soumission d'une collection avec collecte d'erreurs par index » est dupliqué 3× × 2
+pages. Pour rester testable et DRY, extraire un helper de soumission de collection (ex.
+`submitCollection(rows, { buildBody, post, patch, errors })` retournant `{ hasError }`) consommé par les
+6 sites d'appel. À acter dans le plan d'implémentation (option : garder inline si l'extraction dégrade la
+lisibilité — décision lors du plan).
+
+## 4. Tests
+
+### Back (TDD — échouent d'abord)
+
+Dans `tests/Module/Commercial/Api/ClientSubResourceApiTest` :
+
+- `testPostContactToClientWithTwoExistingContactsReturns201` : seed un client + 2 contacts, POST un 3ᵉ →
+  attendu **201** (rouge aujourd'hui : 500).
+- `testPostContactInvalidEmailOnClientWithExistingContactsReturns422` : même seed, POST email invalide →
+  **422** avec `propertyPath=email` et message FR (vérifie que la validation est bien atteinte).
+- Variantes germes pour adresses et RIB (au moins une chacune) pour verrouiller les 3 sous-ressources.
+
+Pré-requis : helper de seed de contacts/adresses/RIB dans `AbstractCommercialApiTestCase` (ajouter si
+absent).
+
+### Front (Vitest)
+
+- Si helper `submitCollection` extrait : test unitaire « 3 blocs, le 2ᵉ renvoie 422 → les erreurs du 2ᵉ
+  sont mappées, les blocs 1 et 3 sont tentés, `hasError = true`, tab non complété ».
+- Sinon : test de composant sur `ClientContactBlock` + page, vérifiant l'affichage inline multi-blocs.
+
+### Vérifications finales
+
+`make test` + `make php-cs-fixer-allow-risky` (back), `make nuxt-test` (front). Golden path manuel :
+client à 3 contacts, ajouter un 4ᵉ avec email invalide → 422 inline sous l'email du bon bloc, pas de 500.
+
+## 5. Impact / risques
+
+- API contract : POST sous-ressource passe de 500→201/422 (correction) ; 404 préservé sur parent
+  inexistant. Pas de changement de payload ni de réponse de succès.
+- Le test fonctionnel CI actuel (POST sur client à 0 contact) reste vert.
+- Régression possible si un consommateur dépendait du read implicite du parent au POST : aucun identifié
+  (les 3 processors gèrent déjà le rattachement manuellement).
@@ -0,0 +1,633 @@
+# Validation « tous les blocs » — onglets à blocs dynamiques (Client M1) — Plan d'implémentation
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Permettre la validation 422 par champ sur TOUS les blocs des onglets Contacts / Adresses / RIB d'un client (création + édition), en supprimant la 500 `NonUniqueResultException` qui les bloque dès ≥2 enfants et en ne stoppant plus la boucle front au premier bloc en erreur.
+
+**Architecture:** Côté back, on retire le stade « read » inutile du POST des 3 sous-ressources (`read: false`) — le parent est déjà rattaché manuellement par le processor — et on durcit ce rattachement (404 si parent absent). Côté front, on factorise la boucle de soumission de collection dans `useClientFormErrors().submitRows(...)` qui tente tous les blocs et collecte les erreurs par index, puis on branche les 6 sites d'appel (`new.vue` + `edit.vue` × contacts/adresses/RIB).
+
+**Tech Stack:** Symfony 8 / API Platform 4 (PHP 8.4, PHPUnit) ; Nuxt 4 / Vue 3 / TypeScript / Vitest.
+
+**Spec de référence :** `docs/superpowers/specs/2026-06-04-client-collection-blocks-validation-design.md`
+
+**Pré-vol :** `make start` (containers up), branche de travail = celle de la MR (`feat/erp-107-validation-messages-fr`) ou une branche dédiée selon décision utilisateur.
+
+---
+
+## Structure des fichiers
+
+**Back — modifiés :**
+- `src/Module/Commercial/Domain/Entity/ClientContact.php` — `read: false` sur `Post`
+- `src/Module/Commercial/Domain/Entity/ClientAddress.php` — `read: false` sur `Post`
+- `src/Module/Commercial/Domain/Entity/ClientRib.php` — `read: false` sur `Post`
+- `src/Module/Commercial/Infrastructure/ApiPlatform/State/Processor/ClientContactProcessor.php` — `linkParent` → 404
+- `.../Processor/ClientAddressProcessor.php` — idem
+- `.../Processor/ClientRibProcessor.php` — idem
+- `tests/Module/Commercial/Api/AbstractCommercialApiTestCase.php` — helper `seedContact()`
+- `tests/Module/Commercial/Api/ClientSubResourceApiTest.php` — tests de non-régression
+
+**Front — modifiés :**
+- `frontend/modules/commercial/composables/useClientFormErrors.ts` — méthode `submitRows()`
+- `frontend/modules/commercial/composables/__tests__/useClientFormErrors.spec.ts` — créé (test unitaire)
+- `frontend/modules/commercial/pages/clients/new.vue` — branchements (3 submits)
+- `frontend/modules/commercial/pages/clients/[id]/edit.vue` — branchements (3 submits)
+
+---
+
+## Task 1 : Back — test rouge (POST sur client à ≥2 enfants)
+
+**Files:**
+- Modify: `tests/Module/Commercial/Api/AbstractCommercialApiTestCase.php`
+- Test: `tests/Module/Commercial/Api/ClientSubResourceApiTest.php`
+
+- [ ] **Step 1 : Ajouter un helper de seed de contact à la base de test**
+
+Dans `AbstractCommercialApiTestCase.php`, ajouter (sous `seedClient`, avant `cleanupCommercialTestData`) :
+
+```php
+    /**
+     * Seede directement un ClientContact en base (sans passer par l'API), pour
+     * preparer un client deja dote de N contacts. Au moins le prenom est pose
+     * (RG-1.05 / CHECK chk_client_contact_name).
+     */
+    protected function seedContact(ClientEntity $client, string $firstName): \App\Module\Commercial\Domain\Entity\ClientContact
+    {
+        $em      = $this->getEm();
+        $contact = new \App\Module\Commercial\Domain\Entity\ClientContact();
+        $contact->setClient($client);
+        $contact->setFirstName($firstName);
+        $em->persist($contact);
+        $em->flush();
+
+        return $contact;
+    }
+```
+
+- [ ] **Step 2 : Écrire les tests rouges**
+
+Dans `ClientSubResourceApiTest.php`, ajouter dans la section `// === Contacts ===` :
+
+```php
+    /**
+     * Regression ERP (bug subresource Link toProperty) : POST d'un contact sur un
+     * client qui en a DEJA >= 2 ne doit pas exploser en 500
+     * (NonUniqueResultException sur la resolution du parent), mais creer (201).
+     */
+    public function testPostContactOnClientWithTwoExistingContactsReturns201(): void
+    {
+        $client = $this->createAdminClient();
+        $seed   = $this->seedClient('Contact Multi');
+        $this->seedContact($seed, 'Alpha');
+        $this->seedContact($seed, 'Beta');
+
+        $client->request('POST', '/api/clients/'.$seed->getId().'/contacts', [
+            'headers' => ['Content-Type' => self::LD, 'Accept' => self::LD],
+            'json'    => ['firstName' => 'Gamma'],
+        ]);
+
+        self::assertResponseStatusCodeSame(201);
+    }
+
+    /**
+     * Meme contexte (>= 2 contacts existants) : un email invalide doit produire
+     * une 422 par champ (la validation est bien atteinte), pas une 500.
+     */
+    public function testPostInvalidContactOnPopulatedClientReturns422OnField(): void
+    {
+        $client = $this->createAdminClient();
+        $seed   = $this->seedClient('Contact Multi Bad');
+        $this->seedContact($seed, 'Alpha');
+        $this->seedContact($seed, 'Beta');
+
+        $response = $client->request('POST', '/api/clients/'.$seed->getId().'/contacts', [
+            'headers' => ['Content-Type' => self::LD, 'Accept' => self::LD],
+            'json'    => ['firstName' => 'Gamma', 'email' => 'pas-un-email'],
+        ]);
+
+        self::assertResponseStatusCodeSame(422);
+        $byPath = [];
+        foreach ($response->toArray(false)['violations'] ?? [] as $v) {
+            $byPath[$v['propertyPath']] = $v['message'];
+        }
+        self::assertArrayHasKey('email', $byPath);
+        self::assertSame('L\'adresse email n\'est pas valide.', $byPath['email']);
+    }
+```
+
+- [ ] **Step 3 : Lancer les tests, vérifier qu'ils échouent (500 au lieu de 201/422)**
+
+Run : `make test` (ou ciblé dans le container : `docker exec php-starseed-fpm php bin/phpunit --filter ClientSubResourceApiTest`)
+Expected : les 2 nouveaux tests ÉCHOUENT (HTTP 500 `NonUniqueResultException`). `testPostContactOnClient...` reçoit 500, pas 201.
+
+- [ ] **Step 4 : Commit (test rouge)**
+
+```bash
+git add tests/Module/Commercial/Api/AbstractCommercialApiTestCase.php tests/Module/Commercial/Api/ClientSubResourceApiTest.php
+git commit -m "test(commercial) : reproduit la 500 NonUniqueResult au POST contact sur client peuple (ERP-107)"
+```
+
+---
+
+## Task 2 : Back — fix (read:false + linkParent durci) → tests verts
+
+**Files:**
+- Modify: `src/Module/Commercial/Domain/Entity/ClientContact.php:48-57`
+- Modify: `src/Module/Commercial/Domain/Entity/ClientAddress.php:61-70`
+- Modify: `src/Module/Commercial/Domain/Entity/ClientRib.php:52-61`
+- Modify: `.../State/Processor/ClientContactProcessor.php:76-94`
+- Modify: `.../State/Processor/ClientAddressProcessor.php:63-81`
+- Modify: `.../State/Processor/ClientRibProcessor.php:65-83`
+
+- [ ] **Step 1 : `read: false` sur les 3 opérations `Post`**
+
+`ClientContact.php`, opération `Post` — ajouter la ligne `read: false,` :
+
+```php
+        new Post(
+            uriTemplate: '/clients/{clientId}/contacts',
+            uriVariables: [
+                'clientId' => new Link(fromClass: Client::class, toProperty: 'client'),
+            ],
+            // read:false : pas de stade lecture du parent (le Link toProperty
+            // resoudrait l'enfant et casse en NonUniqueResult des >= 2 enfants).
+            // Le parent est rattache par ClientContactProcessor::linkParent.
+            read: false,
+            security: "is_granted('commercial.clients.manage')",
+            normalizationContext: ['groups' => ['client_contact:read']],
+            denormalizationContext: ['groups' => ['client_contact:write']],
+            processor: ClientContactProcessor::class,
+        ),
+```
+
+`ClientAddress.php` — idem dans son `Post` (`security: commercial.clients.manage`, processor `ClientAddressProcessor`), commentaire pointant `ClientAddressProcessor::linkParent`.
+
+`ClientRib.php` — idem dans son `Post` (`security: commercial.clients.accounting.manage`, processor `ClientRibProcessor`), commentaire pointant `ClientRibProcessor::linkParent`.
+
+- [ ] **Step 2 : Durcir les 3 `linkParent` (404 si parent absent)**
+
+Dans chaque processor, ajouter l'import en tête de fichier :
+
+```php
+use Symfony\Component\HttpKernel\Exception\NotFoundHttpException;
+```
+
+`ClientContactProcessor::linkParent` — remplacer le bloc final par :
+
+```php
+        if (null === $clientId) {
+            return;
+        }
+
+        $client = $clientId instanceof Client
+            ? $clientId
+            : $this->em->getRepository(Client::class)->find($clientId);
+
+        // read:false sur le POST : sans stade lecture, un parent introuvable
+        // n'est plus intercepte en amont -> 404 explicite (sinon 500 au persist
+        // sur client_id NOT NULL).
+        if (!$client instanceof Client) {
+            throw new NotFoundHttpException('Client introuvable.');
+        }
+
+        $contact->setClient($client);
+```
+
+`ClientAddressProcessor::linkParent` — idem avec `$address->setClient($client);`.
+`ClientRibProcessor::linkParent` — idem avec `$rib->setClient($client);`.
+
+- [ ] **Step 3 : Lancer les tests, vérifier qu'ils passent**
+
+Run : `make test`
+Expected : les 2 tests de Task 1 PASSENT (201 + 422 `propertyPath=email`). Aucun test existant cassé (notamment `testPostContactInvalidEmailReturns422WithFrenchMessageOnField` et les tests d'archi ERP-107 restent verts).
+
+- [ ] **Step 4 : Lint PHP**
+
+Run : `make php-cs-fixer-allow-risky`
+Expected : 0 fichier à corriger (ou corrections appliquées et re-vérifiées).
+
+- [ ] **Step 5 : Commit (fix back)**
+
+```bash
+git add src/Module/Commercial/Domain/Entity/ClientContact.php src/Module/Commercial/Domain/Entity/ClientAddress.php src/Module/Commercial/Domain/Entity/ClientRib.php src/Module/Commercial/Infrastructure/ApiPlatform/State/Processor/ClientContactProcessor.php src/Module/Commercial/Infrastructure/ApiPlatform/State/Processor/ClientAddressProcessor.php src/Module/Commercial/Infrastructure/ApiPlatform/State/Processor/ClientRibProcessor.php
+git commit -m "fix(commercial) : POST sous-ressource client en read:false + parent 404 (corrige 500 NonUniqueResult, ERP-107)"
+```
+
+---
+
+## Task 3 : Back — germes adresses + RIB (verrouille les 3 sous-ressources)
+
+**Files:**
+- Modify: `tests/Module/Commercial/Api/AbstractCommercialApiTestCase.php` (helpers `seedAddress`, `seedRib`)
+- Test: `tests/Module/Commercial/Api/ClientSubResourceApiTest.php`
+
+- [ ] **Step 1 : Helpers de seed adresse + RIB**
+
+Dans `AbstractCommercialApiTestCase.php`, ajouter :
+
+```php
+    /** Seede une adresse minimale valide (RG : CP/ville/rue requis). */
+    protected function seedAddress(ClientEntity $client, string $city): \App\Module\Commercial\Domain\Entity\ClientAddress
+    {
+        $em      = $this->getEm();
+        $address = new \App\Module\Commercial\Domain\Entity\ClientAddress();
+        $address->setClient($client);
+        $address->setPostalCode('33000');
+        $address->setCity($city);
+        $address->setStreet('1 rue du Test');
+        $em->persist($address);
+        $em->flush();
+
+        return $address;
+    }
+
+    /** Seede un RIB valide (BIC/IBAN conformes). */
+    protected function seedRib(ClientEntity $client, string $label): \App\Module\Commercial\Domain\Entity\ClientRib
+    {
+        $em  = $this->getEm();
+        $rib = new \App\Module\Commercial\Domain\Entity\ClientRib();
+        $rib->setClient($client);
+        $rib->setLabel($label);
+        $rib->setBic('BNPAFRPPXXX');
+        $rib->setIban('FR1420041010050500013M02606');
+        $em->persist($rib);
+        $em->flush();
+
+        return $rib;
+    }
+```
+
+> Note : si une propriété est non-nullable et absente ci-dessus (ex. `position`, flags d'adresse), poser les setters correspondants avec une valeur par défaut neutre — vérifier les entités `ClientAddress` / `ClientRib` au moment de l'écriture.
+
+- [ ] **Step 2 : Tests de non-régression adresses + RIB**
+
+Dans `ClientSubResourceApiTest.php`, section adresses puis RIB :
+
+```php
+    public function testPostAddressOnClientWithTwoExistingAddressesReturns201(): void
+    {
+        $client = $this->createAdminClient();
+        $seed   = $this->seedClient('Addr Multi');
+        $this->seedAddress($seed, 'Bordeaux');
+        $this->seedAddress($seed, 'Lyon');
+
+        $client->request('POST', '/api/clients/'.$seed->getId().'/addresses', [
+            'headers' => ['Content-Type' => self::LD, 'Accept' => self::LD],
+            'json'    => ['postalCode' => '75001', 'city' => 'Paris', 'street' => '2 rue Neuve'],
+        ]);
+
+        self::assertResponseStatusCodeSame(201);
+    }
+
+    public function testPostRibOnClientWithTwoExistingRibsReturns201(): void
+    {
+        $client = $this->createAdminClient();
+        $seed   = $this->seedClient('Rib Multi');
+        $this->seedRib($seed, 'Compte 1');
+        $this->seedRib($seed, 'Compte 2');
+
+        $client->request('POST', '/api/clients/'.$seed->getId().'/ribs', [
+            'headers' => ['Content-Type' => self::LD, 'Accept' => self::LD],
+            'json'    => ['label' => 'Compte 3', 'bic' => self::VALID_BIC, 'iban' => self::VALID_IBAN],
+        ]);
+
+        self::assertResponseStatusCodeSame(201);
+    }
+```
+
+> Le POST RIB exige `commercial.clients.accounting.manage` — `admin` (ROLE_ADMIN) l'a. Si une 403 apparaît, vérifier le compte de test.
+
+- [ ] **Step 3 : Lancer, vérifier vert**
+
+Run : `make test`
+Expected : PASS (les 2 nouveaux tests verts grâce au fix de Task 2).
+
+- [ ] **Step 4 : Commit**
+
+```bash
+git add tests/Module/Commercial/Api/AbstractCommercialApiTestCase.php tests/Module/Commercial/Api/ClientSubResourceApiTest.php
+git commit -m "test(commercial) : verrouille POST adresses/RIB sur client peuple (ERP-107)"
+```
+
+---
+
+## Task 4 : Front — helper `submitRows` + test unitaire
+
+**Files:**
+- Modify: `frontend/modules/commercial/composables/useClientFormErrors.ts`
+- Create: `frontend/modules/commercial/composables/__tests__/useClientFormErrors.spec.ts`
+
+- [ ] **Step 1 : Écrire le test rouge**
+
+Créer `useClientFormErrors.spec.ts` :
+
+```ts
+import { describe, it, expect, vi } from 'vitest'
+import { useClientFormErrors } from '../useClientFormErrors'
+
+// Construit une erreur facon useApi : 422 avec violations Hydra.
+function http422(path: string, message: string) {
+    return { response: { status: 422, _data: { violations: [{ propertyPath: path, message }] } } }
+}
+
+describe('useClientFormErrors.submitRows', () => {
+    it('tente TOUS les blocs et mappe les erreurs par index, sans stopper au premier echec', async () => {
+        const { contactErrors, submitRows } = useClientFormErrors()
+        const seen: number[] = []
+        const onUnmapped = vi.fn()
+
+        const saveRow = async (_row: unknown, index: number) => {
+            seen.push(index)
+            if (index === 1) throw http422('email', 'Email invalide')
+        }
+
+        const hasError = await submitRows(
+            [{ a: 0 }, { a: 1 }, { a: 2 }],
+            contactErrors,
+            saveRow,
+            onUnmapped,
+        )
+
+        expect(seen).toEqual([0, 1, 2])            // tous les blocs tentes
+        expect(hasError).toBe(true)
+        expect(contactErrors.value[1]).toEqual({ email: 'Email invalide' })
+        expect(contactErrors.value[0]).toBeUndefined()
+        expect(onUnmapped).not.toHaveBeenCalled()  // 422 mappee, pas de fallback
+    })
+
+    it('saute les lignes filtrees par shouldSkip et renvoie false si tout passe', async () => {
+        const { contactErrors, submitRows } = useClientFormErrors()
+        const saved: number[] = []
+
+        const hasError = await submitRows(
+            [{ skip: true }, { skip: false }],
+            contactErrors,
+            async (_row, index) => { saved.push(index) },
+            vi.fn(),
+            (row: { skip: boolean }) => row.skip,
+        )
+
+        expect(saved).toEqual([1])
+        expect(hasError).toBe(false)
+    })
+})
+```
+
+- [ ] **Step 2 : Lancer, vérifier l'échec**
+
+Run : `make nuxt-test` (ou ciblé : `docker exec <node> npx vitest run useClientFormErrors`)
+Expected : FAIL — `submitRows` n'existe pas encore.
+
+- [ ] **Step 3 : Implémenter `submitRows`**
+
+Dans `useClientFormErrors.ts`, ajouter la méthode (dans la fonction, après `mapRowError`) et l'exposer dans le `return` :
+
+```ts
+    /**
+     * Soumet TOUS les blocs d'une collection (contacts/adresses/RIB) en collectant
+     * les erreurs par index : on n'arrete PAS au premier bloc en echec (ERP-101).
+     * Reinitialise le tableau d'erreurs cible, tente chaque ligne via `saveRow`,
+     * mappe les 422 inline (mapRowError) ou delegue le fallback a `onUnmappedError`.
+     * Retourne true si au moins un bloc a echoue (le caller ne valide alors pas l'onglet).
+     */
+    async function submitRows<T>(
+        rows: T[],
+        target: Ref<Record<string, string>[]>,
+        saveRow: (row: T, index: number) => Promise<void>,
+        onUnmappedError: (error: unknown, index: number) => void,
+        shouldSkip?: (row: T, index: number) => boolean,
+    ): Promise<boolean> {
+        target.value = []
+        let hasError = false
+        for (let index = 0; index < rows.length; index++) {
+            if (shouldSkip?.(rows[index], index)) {
+                continue
+            }
+            try {
+                await saveRow(rows[index], index)
+            }
+            catch (error) {
+                if (!mapRowError(error, target, index)) {
+                    onUnmappedError(error, index)
+                }
+                hasError = true
+            }
+        }
+
+        return hasError
+    }
+```
+
+Ajouter `submitRows` à l'objet retourné par `useClientFormErrors`.
+
+- [ ] **Step 4 : Lancer, vérifier vert**
+
+Run : `make nuxt-test`
+Expected : PASS (les 2 cas verts).
+
+- [ ] **Step 5 : Commit**
+
+```bash
+git add frontend/modules/commercial/composables/useClientFormErrors.ts frontend/modules/commercial/composables/__tests__/useClientFormErrors.spec.ts
+git commit -m "feat(commercial) : submitRows collecte les erreurs de tous les blocs de collection (ERP-101)"
+```
+
+---
+
+## Task 5 : Front — brancher `submitRows` dans new.vue + edit.vue
+
+**Files:**
+- Modify: `frontend/modules/commercial/pages/clients/new.vue` (`submitContacts`, `submitAddresses`, boucle RIB de `submitAccounting`)
+- Modify: `frontend/modules/commercial/pages/clients/[id]/edit.vue` (les 3 équivalents)
+
+- [ ] **Step 1 : Récupérer `submitRows` du composable**
+
+Dans `new.vue` ET `edit.vue`, ajouter `submitRows` à la déstructuration de `useClientFormErrors()` :
+
+```ts
+const {
+    mainErrors,
+    informationErrors,
+    accountingErrors,
+    contactErrors,
+    addressErrors,
+    ribErrors,
+    mapRowError,
+    submitRows,
+} = useClientFormErrors()
+```
+
+- [ ] **Step 2 : Réécrire `submitContacts` (new.vue)**
+
+Remplacer le corps de la boucle par un appel à `submitRows` :
+
+```ts
+async function submitContacts(): Promise<void> {
+    if (clientId.value === null || !canValidateContacts.value || tabSubmitting.value) return
+    tabSubmitting.value = true
+    try {
+        const hasError = await submitRows(
+            contacts.value,
+            contactErrors,
+            async (contact) => {
+                const body = {
+                    firstName: contact.firstName || null,
+                    lastName: contact.lastName || null,
+                    jobTitle: contact.jobTitle || null,
+                    phonePrimary: contact.phonePrimary || null,
+                    phoneSecondary: contact.hasSecondaryPhone ? (contact.phoneSecondary || null) : null,
+                    email: contact.email || null,
+                }
+                if (contact.id === null) {
+                    const created = await api.post<ContactResponse>(
+                        `/clients/${clientId.value}/contacts`,
+                        body,
+                        { headers: { Accept: 'application/ld+json' }, toast: false },
+                    )
+                    contact.id = created.id
+                    contact.iri = created['@id'] ?? null
+                }
+                else {
+                    await api.patch(`/client_contacts/${contact.id}`, body, { toast: false })
+                }
+            },
+            (error) => toast.error({ title: t('commercial.clients.toast.error'), message: apiErrorMessage(error) }),
+            (contact) => !isContactNamed(contact),
+        )
+        if (hasError) return
+        completeTab('contact')
+        toast.success({ title: t('commercial.clients.toast.updateSuccess') })
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+```
+
+- [ ] **Step 3 : Réécrire `submitAddresses` (new.vue)**
+
+```ts
+async function submitAddresses(): Promise<void> {
+    if (clientId.value === null || !canValidateAddresses.value || tabSubmitting.value) return
+    tabSubmitting.value = true
+    try {
+        const hasError = await submitRows(
+            addresses.value,
+            addressErrors,
+            async (address) => {
+                const body = {
+                    isProspect: address.isProspect,
+                    isDelivery: address.isDelivery,
+                    isBilling: address.isBilling,
+                    country: address.country,
+                    postalCode: address.postalCode || null,
+                    city: address.city || null,
+                    street: address.street || null,
+                    streetComplement: address.streetComplement || null,
+                    categories: address.categoryIris,
+                    sites: address.siteIris,
+                    contacts: address.contactIris,
+                    billingEmail: isBillingEmailRequired(address) ? (address.billingEmail || null) : null,
+                }
+                if (address.id === null) {
+                    const created = await api.post<{ id: number }>(
+                        `/clients/${clientId.value}/addresses`,
+                        body,
+                        { headers: { Accept: 'application/ld+json' }, toast: false },
+                    )
+                    address.id = created.id
+                }
+                else {
+                    await api.patch(`/client_addresses/${address.id}`, body, { toast: false })
+                }
+            },
+            (error) => toast.error({ title: t('commercial.clients.toast.error'), message: apiErrorMessage(error) }),
+        )
+        if (hasError) return
+        completeTab('address')
+        toast.success({ title: t('commercial.clients.toast.updateSuccess') })
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+```
+
+- [ ] **Step 4 : Réécrire la boucle RIB de `submitAccounting` (new.vue)**
+
+Garder le PATCH scalaire inchangé (1) ; remplacer la boucle (2) :
+
+```ts
+        // 2) POST/PATCH des RIB (erreurs inline par ligne, tous les blocs).
+        const ribHasError = await submitRows(
+            ribs.value,
+            ribErrors,
+            async (rib) => {
+                const body = { label: rib.label, bic: rib.bic, iban: rib.iban }
+                if (rib.id === null) {
+                    const created = await api.post<{ id: number }>(
+                        `/clients/${clientId.value}/ribs`,
+                        body,
+                        { headers: { Accept: 'application/ld+json' }, toast: false },
+                    )
+                    rib.id = created.id
+                }
+                else {
+                    await api.patch(`/client_ribs/${rib.id}`, body, { toast: false })
+                }
+            },
+            (error) => toast.error({ title: t('commercial.clients.toast.error'), message: apiErrorMessage(error) }),
+            (rib) => !ribIsComplete(rib),
+        )
+        if (ribHasError) return
+
+        completeTab('accounting')
+        toast.success({ title: t('commercial.clients.toast.updateSuccess') })
+```
+
+> Retirer le `ribErrors.value = []` désormais fait par `submitRows`. Le `accountingErrors.clearErrors()` du PATCH scalaire reste.
+
+- [ ] **Step 5 : Mirror dans edit.vue**
+
+Appliquer les mêmes réécritures aux `submitContacts` / `submitAddresses` / boucle RIB de `submitAccounting` d'`edit.vue`. Conserver le **fallback d'erreur propre à edit.vue** (si edit.vue utilise `showError(...)` au lieu de `toast.error(...)`, passer ce fallback comme `onUnmappedError`). Vérifier les noms des refs (`clientId` peut y être l'id de route).
+
+- [ ] **Step 6 : Vérifier le typecheck + tests front**
+
+Run : `make nuxt-test`
+Expected : PASS. Aucune régression des specs existantes (`ClientContactBlock.spec.ts`, etc.).
+
+- [ ] **Step 7 : Commit**
+
+```bash
+git add frontend/modules/commercial/pages/clients/new.vue "frontend/modules/commercial/pages/clients/[id]/edit.vue"
+git commit -m "feat(commercial) : valide tous les blocs contacts/adresses/RIB et affiche les erreurs par bloc (ERP-101)"
+```
+
+---
+
+## Task 6 : Vérification finale + golden path manuel
+
+- [ ] **Step 1 : Suite complète back**
+
+Run : `make test` puis `make php-cs-fixer-allow-risky`
+Expected : tout vert, 0 fichier à corriger.
+
+- [ ] **Step 2 : Suite complète front**
+
+Run : `make nuxt-test`
+Expected : tout vert.
+
+- [ ] **Step 3 : Golden path manuel (`make dev-nuxt`, port 3004)**
+
+Scénario : ouvrir un client à 3 contacts (compte `admin`), onglet Contacts, ajouter un bloc avec email invalide + un autre bloc avec prénom/nom vides → Valider.
+Attendu : **pas de 500** ; « L'adresse email n'est pas valide. » sous l'email du bon bloc ET « Le prénom ou le nom du contact est obligatoire. » sous le prénom de l'autre bloc, **affichés simultanément**. L'onglet ne se valide pas tant qu'une erreur subsiste. Idem à vérifier rapidement sur Adresses et RIB.
+
+- [ ] **Step 4 : Si une vérif échoue ou ne peut être lancée, le dire explicitement** (ne pas annoncer « fini »).
+
+---
+
+## Self-review (auteur du plan)
+
+- **Couverture spec §3.1 (back)** : Task 2 (read:false + linkParent 404) ✓ ; §3.2 (front collect-all) : Tasks 4-5 ✓ ; §3.3 (helper réutilisable) : Task 4 `submitRows` ✓ ; §4 tests : Tasks 1, 3 (back), 4 (front) + Task 6 golden path ✓.
+- **Périmètre 3 sous-ressources** : contacts (Task 1-2), adresses + RIB (Task 3 + branchements Task 5) ✓.
+- **Décision « inline seul »** : aucun toast succès si `hasError` ; pas de toast récap ✓.
+- **Pas de placeholder** : le seul point ouvert est la note Task 3 Step 1 (setters non-nullables éventuels d'adresse/RIB à compléter en lisant les entités) — à lever à l'écriture. Cohérence des noms : `submitRows` utilisé identiquement en Task 4 et Task 5.
@@ -10,18 +10,18 @@ trous, zéro duplication »).

 ERP-60 n'écrit QUE les tests des RG non déjà couvertes par la stack, et mappe ici
 l'intégralité des RG (existantes + nouvelles + déléguées). Les tests dépendants
-des **rôles métier** (matrice RBAC bureau/compta/commerciale/usine + RG-1.04
-fonctionnel) sont **délégués à ERP-74 (#493)** : ces rôles n'existent qu'après le
+des **rôles métier** (matrice RBAC bureau/compta/commerciale/usine) sont
+**délégués à ERP-74 (#493)** : ces rôles n'existent qu'après le
 merge de la stack.

 ## Mapping RG → test

 | RG | Intitulé | Test(s) | Source |
 |----|----------|---------|--------|
-| RG-1.01 | Prénom OU nom obligatoire → 422 | `ClientApiTest::testPostWithoutFirstOrLastNameReturns422` ; `ClientProcessorTest` (unit) | ERP-55 |
-| RG-1.02 | phoneSecondary persisté ; max 2 téléphones | `ClientFormulaireMainTest::testPostPersistsSecondaryPhoneNormalized` ; `::testThirdPhoneFieldIsIgnored` | **ERP-60** |
+| ~~RG-1.01~~ | _(supprimée V1 — refonte-contact)_ contact inline retiré du Client ; complétude couverte par RG-1.05 / RG-1.14 (`ClientContact`) | — | refonte-contact |
+| ~~RG-1.02~~ | _(supprimée du Client V1)_ téléphones inline retirés du Client (testés sur `ClientContact`) | — | refonte-contact |
 | RG-1.03 | distributor/broker exclusifs + type catégorie | `ClientApiTest::testPostWithDistributorAndBrokerReturns422` ; `::testPostDistributorReferencingNonDistributorReturns422` ; `::testPostValidDistributorReturns201` ; `ClientProcessorTest` (unit) | ERP-55 |
-| RG-1.04 | Onglet Information obligatoire pour rôle Commerciale | `ClientProcessorTest::testCommercialeIncompleteInformationIsUnprocessable` ; `::testNonCommercialeSkipsInformationCompleteness` (unit, dormant). **Test fonctionnel + durcissement → ERP-74** | ERP-55 / **ERP-74** |
+| ~~RG-1.04~~ | _(SUPPRIMÉE)_ Onglet Information désormais facultatif pour tous les rôles (validation de complétude retirée) | — | ERP-55 / ERP-74 |
 | RG-1.05 | Contact : prénom OU nom → 422 (CHECK) | `ClientSubResourceApiTest::testPostContactWithoutNameReturns422` | ERP-57 |
 | RG-1.06/07/08 | Adresse prospect exclusive de livraison/facturation → 422 (Assert\Callback + CHECK filet) | `ClientAddressTest::testProspectAddressCannotBeDelivery` ; `::testProspectAddressCannotBeBilling` | ERP-60 / **ERP-76** |
 | RG-1.09 | Code postal `^[0-9]{4,5}$` → 422 | `ClientSubResourceApiTest::testPostAddressWithInvalidPostalCodeReturns422` | ERP-57 |
@@ -60,8 +60,7 @@ merge de la stack.

 - **Matrice RBAC différenciée** par rôle métier (Bureau / Compta / Commerciale /
  Usine) : 200/403 par verbe et par onglet selon le rôle.
- **RG-1.04 fonctionnel** : PATCH onglet Information par une Commerciale avec
-  champs incomplets → 422 ; même PATCH par Admin → 200 (+ durcissement code/spec).
+- ~~**RG-1.04 fonctionnel**~~ : _(SUPPRIMÉE)_ l'onglet Information est désormais facultatif pour tous les rôles.
 - Raison : ces rôles métier ne sont seedés qu'après le merge de la stack M1.

 ## Gaps & suivi
@@ -0,0 +1,135 @@
+# M1 · Ticket 1/3 (Backend) — Supprimer le contact inline du `Client`
+
+## 1. Objectif
+
+Retirer de l'entité `Client` (et de la table `client`) les **5 champs du contact
+principal inline** : `firstName`, `lastName`, `phonePrimary`, `phoneSecondary`, `email`.
+La gestion des contacts passe désormais **exclusivement** par la sous-entité
+`ClientContact` (onglet « Contacts »), déjà en place et déjà porteuse des mêmes champs.
+
+Le code M1 est **déjà livré en prod** : ce ticket inclut donc une **migration de données**
+(backfill) pour ne perdre aucune information de contact existante avant de supprimer les
+colonnes.
+
+Contexte et justification : voir `README.md` du dossier `refonte-contact`.
+
+## 2. Périmètre
+
+### IN
+
+- Migration Doctrine : **backfill puis suppression** des 5 colonnes de `client`.
+- `Client` (entité) : supprimer les 5 propriétés, getters/setters, annotations ORM /
+  `Assert` / `Groups`.
+- `ClientProcessor` : retirer les 5 champs de `MAIN_FIELDS`, `changedBusinessFields()`,
+  `normalize()` ; supprimer `validateMainContact()` (RG-1.01 — n'a plus d'objet).
+- `DoctrineClientRepository::applySearch()` : trancher D1 (recherche) et l'appliquer.
+- `ClientExportController` : trancher D2 (colonnes export) et l'appliquer.
+- `ClientFixtures` : retirer les 5 paramètres inline de `ensureClient()` ; garantir que
+  chaque client seedé possède au moins 1 `ClientContact` (déjà géré par `addContact()`).
+- Tests PHPUnit : mettre à jour / retirer les cas qui exercent ces 5 champs sur `Client`.
+
+### OUT
+
+- Toute modification de `ClientContact` / `ClientContactProcessor` : **inchangés** (c'est la
+  cible, les champs y restent). `ClientFieldNormalizer` reste tel quel (toujours appelé par
+  `ClientContactProcessor`).
+- Le front (formulaires, vues, types, i18n) → **ticket 2/3**.
+- Les specs (`spec-back.md`, `spec-front.md`, cahier de test) → **ticket 3/3**.
+
+## 3. Fichiers à modifier
+
+| Fichier | Action |
+|---|---|
+| `src/Module/Commercial/Domain/Entity/Client.php` | Supprimer props `firstName` (~l.158), `lastName` (~l.163), `phonePrimary` (~l.168), `phoneSecondary` (~l.172), `email` (~l.178) + leurs getters/setters (~l.329-382) + groupes `client:read`/`client:write:main` + `Assert\*`. |
+| `src/Module/Commercial/Infrastructure/ApiPlatform/State/Processor/ClientProcessor.php` | Retirer les 5 clés de `MAIN_FIELDS` (~l.63) ; de `changedBusinessFields()` (~l.277-281) ; les 6 lignes de `normalize()` qui touchent email/phone/first/last/secondary (~l.433-441) ; supprimer `validateMainContact()` (~l.447-456) et son appel. |
+| `src/Module/Commercial/Infrastructure/Doctrine/DoctrineClientRepository.php` | `applySearch()` (~l.110-124) : appliquer **D1**. |
+| `src/Module/Commercial/Infrastructure/Controller/ClientExportController.php` | `buildHeaders()` (~l.94-114) + `buildRows()` (~l.121-143) : appliquer **D2**. |
+| `src/Module/Commercial/Infrastructure/DataFixtures/ClientFixtures.php` | `ensureClient()` (~l.357-395) : retirer firstName/lastName/phonePrimary/phoneSecondary/email ; conserver `addContact()`. |
+| `migrations/Version<timestamp>.php` (NOUVELLE) | Backfill + `DROP COLUMN` (cf. § 4). |
+| `tests/Module/Commercial/**` | Voir § 5. |
+
+## 4. Migration Doctrine — backfill puis suppression
+
+> Migration **modulaire** (`src/Module/Commercial/Infrastructure/Doctrine/Migrations/`) : ce
+> n'est PAS une migration d'initialisation, le schéma `client` / `client_contact` existe
+> déjà (règle ABSOLUE n°11).
+
+### `up()`
+
+1. **Backfill — ne créer un contact que pour les clients qui n'en ont aucun**, afin de ne
+   pas dupliquer le contact déjà recopié à la création (`prefillFirstContact`) :
+
+   ```sql
+   INSERT INTO client_contact
+       (client_id, first_name, last_name, phone_primary, phone_secondary, email, position, created_at, updated_at)
+   SELECT c.id, c.first_name, c.last_name, c.phone_primary, c.phone_secondary, c.email, 0, NOW(), NOW()
+   FROM client c
+   WHERE NOT EXISTS (SELECT 1 FROM client_contact cc WHERE cc.client_id = c.id)
+     AND (c.first_name IS NOT NULL OR c.last_name IS NOT NULL);
+   ```
+
+   > Le `WHERE ... first_name OU last_name IS NOT NULL` respecte le CHECK
+   > `chk_client_contact_name`. Les rares clients sans nom de contact ET sans contact
+   > existant ne reçoivent pas de ligne (cas théorique : `phone_primary`/`email` étaient
+   > `NOT NULL` mais les noms nullables).
+
+2. **Supprimer les 5 colonnes** :
+
+   ```sql
+   ALTER TABLE client
+       DROP COLUMN first_name,
+       DROP COLUMN last_name,
+       DROP COLUMN phone_primary,
+       DROP COLUMN phone_secondary,
+       DROP COLUMN email;
+   ```
+
+   > Pas de `COMMENT ON COLUMN` à poser (on supprime). Vérifier qu'aucun index ne portait
+   > sur `email` (l'index unique `uq_client_email_active` a déjà été supprimé — décision Q4 /
+   > RG-1.17, cf. `ClientMigrationTest`).
+
+### `down()` (best-effort)
+
+1. Recréer les 5 colonnes (`phone_primary`/`email` en `NOT NULL` impose un défaut transitoire
+   ou un re-remplissage depuis le contact `position = 0`).
+2. Re-remplir depuis `client_contact` (`position = 0`) si possible.
+3. Reposer les `COMMENT ON COLUMN` d'origine (textes RG-1.19/1.20/1.21/1.01/1.17 — cf.
+   `migrations/Version20260601000000.php` l.251-255).
+
+> `down()` ne peut pas restaurer parfaitement les données (ambiguïté si plusieurs contacts).
+> Documenter cette limite dans le docblock de la migration.
+
+## 5. Tests à mettre à jour
+
+| Fichier | Action |
+|---|---|
+| `tests/Module/Commercial/Api/ClientApiTest.php` | Retirer firstName/lastName/phone/email des payloads POST/PATCH `client` et des assertions JSON. |
+| `tests/.../ClientFormulaireMainTest.php` | Supprimer les tests RG-1.01 (firstName/lastName) et RG-1.02 (téléphones) **côté Client** — ils basculent côté `ClientContact` (couverts ailleurs). |
+| `tests/.../ClientExportControllerTest.php` | Aligner les en-têtes/lignes attendus sur **D2**. |
+| `tests/.../ClientMigrationTest.php` | Asserter que les 5 colonnes **n'existent plus** sur `client` ; vérifier le backfill (un client sans contact obtient bien 1 `client_contact`). |
+| `tests/.../ClientFieldNormalizerTest.php` | Conserver les tests du normalizer (toujours utilisé par `ClientContact`) ; retirer les cas spécifiques aux champs `Client` s'il y en a. |
+| RG-1.01/1.02 (matrice) | Ne plus tester sur `Client` ; vérifier qu'ils restent couverts sur `ClientContact` (RG-1.05). |
+
+## 6. Décisions à trancher (cf. README § 3)
+
+- **D1 — recherche** : recommandé = `LEFT JOIN client_contact` (fuzzy sur
+  `companyName` + contact `first_name`/`last_name`/`email`). Attention au `DISTINCT` /
+  risque de doublons de lignes si plusieurs contacts matchent (grouper par `client.id`).
+- **D2 — export** : recommandé = alimenter les colonnes contact depuis le contact de plus
+  petit `position` (fetch-join `contacts` pour éviter le N+1).
+
+## 7. Critères d'acceptation (DoD)
+
+- [ ] Les colonnes `first_name`, `last_name`, `phone_primary`, `phone_secondary`, `email`
+      n'existent plus sur la table `client`.
+- [ ] La migration est jouable sur une base seedée sans perte de contact (backfill vérifié)
+      et `down()` documenté comme best-effort.
+- [ ] `Client`, `ClientProcessor`, `DoctrineClientRepository`, `ClientExportController`,
+      `ClientFixtures` ne référencent plus les 5 champs.
+- [ ] D1 et D2 implémentées conformément à la décision validée.
+- [ ] `ClientContact` / `ClientContactProcessor` / `ClientFieldNormalizer` inchangés.
+- [ ] `make test` vert (notamment `tests/Architecture/ColumnsHaveSqlCommentTest` et
+      `EntitiesAreTimestampableBlamableTest`).
+- [ ] `make php-cs-fixer-allow-risky` ne signale rien sur les fichiers touchés.
+- [ ] Aucune régression du contrat de sérialisation : capturer le JSON réel de
+      `GET /api/clients/{id}` et vérifier l'absence des 5 champs (réflexe RETEX M1).
@@ -0,0 +1,58 @@
+# Prompt d'implémentation — M1 · Ticket 1/3 (Backend)
+
+Tu travailles sur le projet **Starseed** (Symfony 8 / API Platform 4 / Doctrine / PostgreSQL).
+Lis `CLAUDE.md` et `.claude/rules/backend.md` avant de coder. Commentaires en français,
+code en anglais, `declare(strict_types=1);` partout.
+
+## Mission
+
+Supprimer le **contact principal inline** de l'entité `Client` : les 5 champs
+`firstName`, `lastName`, `phonePrimary`, `phoneSecondary`, `email`. Les contacts sont gérés
+uniquement via la sous-entité `ClientContact` (onglet Contacts), déjà en place. Le code est
+déjà en prod → migration avec **backfill** avant `DROP`.
+
+La spec détaillée du ticket est dans `docs/specs/M1-clients/refonte-contact/M1-ticket-01-back.md`.
+Lis-la en entier, ainsi que le `README.md` du même dossier (décision + RG impactées + D1/D2).
+
+## Étapes
+
+1. **Explorer** : `Client.php`, `ClientProcessor.php`, `DoctrineClientRepository.php`,
+   `ClientExportController.php`, `ClientFixtures.php`, et `ClientContact.php` (pour confirmer
+   que la cible porte bien les mêmes champs).
+2. **Demander la validation des décisions D1 (recherche) et D2 (export)** avant de coder —
+   défauts recommandés : D1 = LEFT JOIN sur `client_contact`, D2 = colonnes export depuis le
+   contact `position` minimal. Ne pas inventer un autre comportement.
+3. **Migration** (`src/Module/Commercial/Infrastructure/Doctrine/Migrations/`) : backfill
+   `INSERT INTO client_contact ... WHERE NOT EXISTS(...)` puis `ALTER TABLE client DROP COLUMN ...`
+   (les 5). `down()` best-effort documenté. Voir le SQL exact dans la spec § 4.
+4. **Entité** : retirer les 5 props + getters/setters + `#[ORM\Column]` + `#[Assert\*]` +
+   `#[Groups(['client:read','client:write:main'])]`.
+5. **Processor** : retirer de `MAIN_FIELDS`, `changedBusinessFields()`, `normalize()` ;
+   supprimer `validateMainContact()` et son appel.
+6. **Repository** : `applySearch()` selon D1.
+7. **Export** : `buildHeaders()` / `buildRows()` selon D2.
+8. **Fixtures** : alléger `ensureClient()` ; garder `addContact()`.
+9. **Tests** : mettre à jour `ClientApiTest`, `ClientFormulaireMainTest`,
+   `ClientExportControllerTest`, `ClientMigrationTest`, `ClientFieldNormalizerTest`
+   (cf. spec § 5). Ajouter une assertion que le backfill crée bien un contact pour un client
+   qui n'en avait pas.
+
+## Garde-fous
+
+- Ne touche **pas** `ClientContact`, `ClientContactProcessor`, `ClientFieldNormalizer`.
+- Respecte les règles ABSOLUES : pagination, `#[Auditable]`, COMMENT ON COLUMN (ici on
+  supprime → pas de commentaire à poser, mais ne pas casser le garde-fou).
+- Les RG-1.01 et RG-1.02 disparaissent **du Client** : leur équivalent (RG-1.05 / RG-1.14)
+  vit déjà sur `ClientContact`, ne le duplique pas.
+
+## Vérification finale (obligatoire avant de dire « fini »)
+
+```bash
+make db-reset && make migration-migrate     # migration rejouable sur base fraîche
+make test                                    # PHPUnit vert
+make php-cs-fixer-allow-risky                # lint
+```
+
+Puis capture le JSON réel de `GET /api/clients/{id}` (avec un JWT) et confirme que les 5
+champs ont disparu de la réponse et que `contacts[]` porte bien l'info (réflexe RETEX M1 :
+on valide sur le contrat réel, pas sur les annotations).
@@ -0,0 +1,74 @@
+# M1 · Ticket 2/3 (Frontend) — Retirer le bloc contact principal des écrans Client
+
+## 1. Objectif
+
+Retirer le **bloc « contact principal »** (Nom, Prénom, Téléphone, Téléphone 2, Email) des
+trois écrans Client — **création**, **consultation**, **modification** — ainsi que des
+types, mappeurs, validations et clés i18n associés. La saisie des contacts se fait
+désormais uniquement dans l'**onglet « Contacts »** (composant `ClientContactBlock`, déjà
+en place et inchangé).
+
+Dépend du **ticket 1/3 (back)** : l'API ne renvoie/n'accepte plus ces 5 champs sur `client`.
+Contexte : voir `README.md` du dossier `refonte-contact`.
+
+## 2. Périmètre
+
+### IN — fichiers `frontend/modules/commercial/`
+
+| Fichier | Action |
+|---|---|
+| `pages/clients/new.vue` | Supprimer le bloc principal Nom/Prénom/Téléphones/Email (~l.27-63), l'état `main.firstName/lastName/email`, `mainPhones` (~l.445-459), la fonction `prefillFirstContact()` (~l.658-665) et son appel, le mapping payload POST `phonePrimary/phoneSecondary` (~l.513-524). Adapter `isMainValid` (~l.479-493) : la validation principale ne porte plus que sur `companyName` (+ relation/catégories selon RG existantes). L'onglet **Contacts** devient le point de saisie des coordonnées ; garantir au moins un `ClientContactBlock` vide au départ. |
+| `pages/clients/[id]/edit.vue` | Supprimer les 5 champs du bloc principal (~l.32-73). `mapMainDraft()` et `buildMainPayload()` ne portent plus ces champs. L'onglet Contacts reste éditable. |
+| `pages/clients/[id]/index.vue` | Supprimer l'affichage lecture seule des 5 champs du bloc principal (~l.49-104, partie contact). Conserver l'onglet Contacts (lecture seule). |
+| `types/clientForm.ts` | `MainFormDraft` : retirer `firstName`, `lastName`, `email`, `phonePrimary`, `phoneSecondary`, `hasSecondaryPhone`. Garder `ContactFormDraft` (inchangé). |
+| `types/clientConsultation.ts` | `ClientDetail` : retirer `firstName/lastName/phonePrimary/phoneSecondary/email` (les commentaires « Contact principal »). Garder `ContactRead`. |
+| `utils/clientEdit.ts` | `mapMainDraft()` et `buildMainPayload()` : retirer les 5 champs. Garder `buildContactPayload()`. |
+| `utils/clientConsultation.ts` | Retirer toute lecture des 5 champs inline du client (garder `mapContactToDraft`, `contactOptionsOf`). |
+| `i18n/locales/fr.json` | Retirer `commercial.clients.form.main.firstName/lastName/email/phonePrimary/phoneSecondary/addPhone`. **Conserver** tout le bloc `commercial.clients.form.contact.*`. Vérifier qu'aucune autre vue ne référence les clés retirées. |
+| `**/__tests__/*.spec.ts` | Mettre à jour `clientFormRules.spec.ts`, `clientEdit.spec.ts`, `clientConsultation.spec.ts` (cf. § 4). |
+
+### OUT
+
+- `ClientContactBlock.vue`, l'onglet Contacts, `useClient`, la liste/répertoire
+  (`pages/clients/index.vue` — ses colonnes n'affichent déjà pas le contact inline) :
+  **inchangés**.
+- Le back → ticket 1/3. Les specs → ticket 3/3.
+
+## 3. Comportement attendu après modification
+
+- **Création** : le formulaire principal demande l'entreprise (et relation/catégories selon
+  l'existant), plus de Nom/Prénom/Téléphone/Email inline. L'utilisateur renseigne les
+  coordonnées dans l'onglet **Contacts**. La création reste valide tant qu'il y a
+  `companyName` **et** ≥ 1 bloc Contact valide (Nom OU Prénom) — RG-1.05/RG-1.14 inchangées.
+- **Consultation** : plus de bloc contact principal ; l'onglet Contacts affiche les
+  contacts.
+- **Modification** : idem ; le PATCH du groupe `client:write:main` n'envoie plus les 5
+  champs.
+
+## 4. Tests Vitest à mettre à jour
+
+- `clientFormRules.spec.ts` : la validité du « principal » ne dépend plus de
+  firstName/email/phone ; conserver `isContactNamed()` (RG-1.05) sur les blocs Contacts.
+- `clientEdit.spec.ts` : `buildMainPayload()` ne contient plus les 5 champs ; `mapMainDraft()`
+  non plus.
+- `clientConsultation.spec.ts` : retirer les assertions sur les 5 champs inline.
+
+## 5. Tips & rappels projet
+
+- `useApi()` obligatoire (jamais `$fetch`/`ofetch`). Composants `Malio*` obligatoires.
+- État de tableau jamais dans l'URL (règle inchangée).
+- Les valeurs sont **normalisées côté serveur** (Capitalize / chiffres / lowercase) : le
+  front envoie la saisie et réaffiche la valeur renvoyée — ne pas réintroduire de
+  normalisation front.
+- Ne pas créer de clé i18n orpheline ni laisser de clé `form.main.*` morte.
+
+## 6. Critères d'acceptation (DoD)
+
+- [ ] Les 3 écrans n'affichent plus Nom/Prénom/Téléphone/Téléphone 2/Email en bloc principal.
+- [ ] Le parcours de création fonctionne avec `companyName` + onglet Contacts (≥ 1 contact).
+- [ ] `MainFormDraft` / `ClientDetail` ne déclarent plus les 5 champs ; `mapMainDraft` /
+      `buildMainPayload` non plus.
+- [ ] Aucune clé i18n `form.main.firstName/lastName/email/phone*` restante ni référencée.
+- [ ] `make nuxt-test` vert.
+- [ ] Vérification visuelle du golden path (`make dev-nuxt`, port 3004) : création →
+      consultation → modification d'un client sans bloc contact inline.
@@ -0,0 +1,47 @@
+# Prompt d'implémentation — M1 · Ticket 2/3 (Frontend)
+
+Projet **Starseed** (Nuxt 4 / Vue 3 Composition API / TypeScript / @malio/layer-ui).
+Lis `CLAUDE.md` et `.claude/rules/frontend.md` avant de coder. Commentaires en français,
+code en anglais, 4 espaces d'indentation.
+
+## Mission
+
+Retirer le **bloc « contact principal »** (Nom, Prénom, Téléphone, Téléphone 2, Email) des
+écrans Client (création / consultation / modification) et de tout le code associé (types,
+mappeurs, validations, i18n). Les contacts restent gérés par l'onglet **Contacts**
+(`ClientContactBlock`, inchangé).
+
+Spec détaillée : `docs/specs/M1-clients/refonte-contact/M1-ticket-02-front.md` (lis-la en
+entier + le `README.md` du dossier). Ce ticket dépend du ticket back (l'API ne porte plus
+les 5 champs sur `client`).
+
+## Étapes
+
+1. Explorer `frontend/modules/commercial/` : `pages/clients/new.vue`, `[id]/edit.vue`,
+   `[id]/index.vue`, `types/clientForm.ts`, `types/clientConsultation.ts`,
+   `utils/clientEdit.ts`, `utils/clientConsultation.ts`, `i18n/locales/fr.json`.
+2. Supprimer le bloc principal des 3 écrans + l'état réactif `main.firstName/lastName/email`,
+   `mainPhones`, `prefillFirstContact()`.
+3. Adapter `isMainValid` : ne dépend plus que de `companyName` (+ relation/catégories selon
+   l'existant). La garantie « ≥ 1 contact valide » reste portée par l'onglet Contacts.
+4. Nettoyer les types (`MainFormDraft`, `ClientDetail`) et les mappeurs (`mapMainDraft`,
+   `buildMainPayload`, `clientConsultation`).
+5. Retirer les clés i18n `form.main.firstName/lastName/email/phonePrimary/phoneSecondary/addPhone` ;
+   vérifier par recherche qu'aucune vue ne les utilise plus. **Garder** `form.contact.*`.
+6. Mettre à jour les specs Vitest (`clientFormRules`, `clientEdit`, `clientConsultation`).
+
+## Garde-fous
+
+- `useApi()` uniquement ; composants `Malio*` uniquement ; pas d'état tableau dans l'URL.
+- Ne touche pas `ClientContactBlock.vue`, l'onglet Contacts, ni la liste/répertoire.
+- Pas de normalisation front (le serveur normalise).
+
+## Vérification finale
+
+```bash
+make nuxt-test            # Vitest vert
+make dev-nuxt             # port 3004 — golden path manuel
+```
+
+Golden path à vérifier dans le navigateur : créer un client (entreprise + 1 contact dans
+l'onglet Contacts), le consulter, le modifier — sans aucun bloc contact inline.
@@ -0,0 +1,51 @@
+# M1 · Ticket 3/3 (Specs) — Acter la suppression du contact inline dans les specs M1
+
+## 1. Objectif
+
+Mettre à jour la **documentation fonctionnelle/technique M1** pour refléter la décision :
+le contact principal inline est supprimé du `Client`, les contacts vivent uniquement dans
+`ClientContact`. Les specs sont la **source de vérité** du projet (cf. `workflow.md`) : elles
+doivent décrire le modèle cible, pas l'ancien.
+
+> Idéalement réalisé **avant** les tickets 1 et 2 (la spec guide le code), mais peut être
+> fait en parallèle. À minima, ne pas merger le code sans aligner la spec.
+
+## 2. Fichiers à modifier
+
+| Fichier | Sections concernées |
+|---|---|
+| `docs/specs/M1-clients/spec-back.md` | § 3.1 diagramme E-R (retirer les 5 colonnes du bloc `client`) ; § 3.2 migration SQL `CREATE TABLE client` (retirer `first_name`/`last_name`/`phone_primary`/`phone_secondary`/`email` + leurs COMMENT) ; § 3.4 squelette entité `Client` (retirer les 5 props) ; § 4.3 exemple payload `POST /api/clients` (retirer les 5 champs) ; § 4.1 filtre `?search=` (refléter D1) ; § 4.6 export (refléter D2) ; § 7 RG (voir § 3 ci-dessous) ; § 8 cahier de tests (déplacer RG-1.01/1.02 vers ClientContact). |
+| `docs/specs/M1-clients/spec-front.md` | « Formulaire principal » (l.85-103) : retirer les lignes Nom/Prénom/Téléphone/Téléphone 2/Email ; écrans Consultation / Modification ; règles de formatage. Préciser que les coordonnées se saisissent dans l'onglet Contact. |
+| `docs/specs/M1-clients/cahier-test-back-M1.md` | Retirer / requalifier les lignes RG-1.01 et RG-1.02 (désormais couvertes par RG-1.05 sur `ClientContact`). |
+
+## 3. Traitement des règles de gestion
+
+- **RG-1.01** (firstName OU lastName obligatoire sur Client) → marquer **supprimée** :
+  « Remplacée par RG-1.05 (≥ 1 contact valide) + RG-1.14 (≥ 1 bloc Contact). Le contact
+  principal inline n'existe plus. »
+- **RG-1.02** (max 2 téléphones sur Client) → marquer **supprimée du Client** (reste
+  applicable aux blocs `ClientContact`).
+- **RG-1.19 / RG-1.20 / RG-1.21** (normalisation) → préciser que le **scope `Client`
+  disparaît** ; la normalisation reste sur `ClientContact` (et `ClientAddress.billingEmail`
+  pour RG-1.21).
+- Ne **pas renuméroter** les RG existantes (éviter le drift avec le code/tests) : marquer
+  « supprimée / requalifiée » en place, avec date et renvoi à la décision.
+
+## 4. Forme
+
+- Bumper la version des deux specs (`version: V0` → `V1`) dans le frontmatter, avec une
+  entrée d'historique : date `2026-06-03`, motif « Suppression du contact inline du Client
+  (refonte-contact) », auteur.
+- Ajouter un encadré « Décision » en tête de la section modèle de données, renvoyant au
+  `README.md` du dossier `refonte-contact`.
+- Conserver le style des specs (sections numérotées, tableaux RG, exemples JSON).
+
+## 5. Critères d'acceptation (DoD)
+
+- [ ] `spec-back.md` : aucune mention des 5 colonnes inline dans le modèle `client`
+      (E-R + SQL + entité + payload) ; RG-1.01/1.02 marquées supprimées ; D1/D2 décrites.
+- [ ] `spec-front.md` : le formulaire principal ne liste plus les champs de contact ;
+      l'onglet Contact est présenté comme seul lieu de saisie des coordonnées.
+- [ ] `cahier-test-back-M1.md` : RG-1.01/1.02 retirées/requalifiées.
+- [ ] Versions bumpées (V1) + historique daté dans les deux specs.
+- [ ] Cohérence vérifiée avec les tickets 1 et 2 (mêmes décisions D1/D2).
@@ -0,0 +1,38 @@
+# Prompt d'implémentation — M1 · Ticket 3/3 (Specs)
+
+Projet **Starseed**. Tâche **documentaire** : mettre à jour les specs M1 Clients pour acter
+la suppression du contact principal inline du `Client`. Les specs sont la source de vérité ;
+elles doivent décrire le modèle cible.
+
+## Mission
+
+Modifier `docs/specs/M1-clients/spec-back.md`, `spec-front.md` et `cahier-test-back-M1.md`
+pour retirer le contact inline du `Client` (5 champs `firstName/lastName/phonePrimary/
+phoneSecondary/email`) — les contacts vivent uniquement dans `ClientContact`.
+
+Spec du ticket : `docs/specs/M1-clients/refonte-contact/M1-ticket-03-specs.md` (lis-la + le
+`README.md` du dossier, qui contient la décision, les RG impactées et les décisions D1/D2).
+
+## Étapes
+
+1. Lire les 3 fichiers de specs M1 visés, repérer toutes les occurrences des 5 champs
+   (diagramme E-R, CREATE TABLE client, squelette entité, payload POST, filtre search,
+   export, RG, cahier de test).
+2. Retirer les 5 colonnes du modèle `client` (E-R + SQL + entité + exemple JSON).
+3. Marquer **supprimées** RG-1.01 et RG-1.02 (renvoi à RG-1.05/RG-1.14 sur `ClientContact`),
+   restreindre le scope de RG-1.19/1.20/1.21 à `ClientContact`. **Ne pas renuméroter** les RG.
+4. Refléter les décisions D1 (recherche) et D2 (export) une fois tranchées.
+5. Côté `spec-front.md` : retirer les champs de contact du formulaire principal ; présenter
+   l'onglet Contact comme seul lieu de saisie.
+6. Bumper `version: V0 → V1` + ajouter une entrée d'historique datée (2026-06-03).
+
+## Garde-fous
+
+- Ne touche pas au code, uniquement aux `.md` de specs.
+- Garde le style existant (sections numérotées, tableaux RG, exemples JSON).
+- Cohérence stricte avec les tickets 1 (back) et 2 (front) : mêmes décisions D1/D2.
+
+## Vérification
+
+Relire les 3 fichiers : plus aucune mention des 5 champs inline dans le modèle `client` ;
+RG-1.01/1.02 marquées supprimées ; versions à V1 avec historique.
@@ -0,0 +1,57 @@
+# Amendement des tickets M2 existants — suppression du contact inline du `Supplier`
+
+Les 14 tickets M2 (n° 84–97, groupe Lesstime « M2 — Répertoire fournisseurs ») ont été
+rédigés sur le modèle initial **avec** contact inline. La décision `refonte-contact` les
+amende : `Supplier` ne porte **plus** les 5 champs `firstName/lastName/phonePrimary/
+phoneSecondary/email` ; les contacts vivent uniquement dans `SupplierContact` (onglet
+Contacts). Comme M2 n'est pas codé, il suffit de **ne jamais créer** ces colonnes/champs.
+
+## Bandeau injecté en tête des tickets impactés
+
+> ⚠️ **AMENDEMENT 2026-06-03 — refonte-contact.** Le contact principal inline est
+> **supprimé** du `Supplier` : ne pas créer/saisir les colonnes ni les champs `firstName`,
+> `lastName`, `phonePrimary`, `phoneSecondary`, `email` sur l'entité/le formulaire
+> `Supplier`. Les contacts sont gérés **uniquement** via `SupplierContact` (onglet
+> Contacts). RG-2.01 et RG-2.02 sont supprimées (équivalent assuré par RG-2.04 / RG-2.13).
+> RG-2.12 ne s'applique qu'à `companyName` + `SupplierContact`. Décisions transverses
+> recherche (D1) et export (D2) : cf. `docs/specs/M1-clients/refonte-contact/README.md`.
+
+## Tickets à amender
+
+### Back
+
+| Ticket | n° | Impact |
+|---|---|---|
+| migration BDD M2 (supplier + sous-collections) | #85 | Retirer `first_name/last_name/phone_primary/phone_secondary/email` du `CREATE TABLE supplier` et leurs `COMMENT ON COLUMN`. `supplier_contact` inchangé. |
+| entités + repositories M2 | #86 | `Supplier` : retirer les 5 props + `Assert\Callback` RG-2.01. `SupplierContact` inchangé. |
+| SupplierProvider + SupplierProcessor | #87 | Retirer la validation RG-2.01, la normalisation des champs inline, leur présence dans `MAIN_FIELDS` / changedFields. Recherche selon D1. |
+| export XLSX fournisseurs | #91 | Colonnes contact selon D2 (depuis le contact principal, ou supprimées). |
+| tests PHPUnit M2 | #92 | RG-2.01/2.02 testées sur `SupplierContact` (pas `Supplier`) ; contrat de sérialisation sans les 5 champs inline sur le supplier. |
+
+### Front
+
+| Ticket | n° | Impact |
+|---|---|---|
+| page Ajouter un fournisseur (`/suppliers/new`) + `useSupplierForm` | #94 | Retirer le bloc contact principal du formulaire + le pré-remplissage du 1er contact. Saisie des coordonnées dans l'onglet Contacts. |
+| page Consultation fournisseur (`/suppliers/{id}`) | #95 | Retirer l'affichage du bloc contact principal. |
+| page Modification fournisseur (`/suppliers/{id}/edit`) | #96 | Retirer les 5 champs du bloc principal ; payload `supplier:write:main` sans ces champs. |
+
+### Léger
+
+| Ticket | n° | Impact |
+|---|---|---|
+| page Répertoire fournisseurs + datatable | #93 | Recherche « nom / contact / email » selon D1. Datatable : colonnes inchangées (pas de contact inline en colonne). |
+| i18n + sidebar fournisseurs | #97 | Ne pas créer les clés i18n `form.main.firstName/lastName/email/phone*` (garder `form.contact.*`). |
+
+## Tickets NON impactés
+
+- #84 (taxonomie FOURNISSEUR), #88 (sous-ressources contacts/adresses/ribs —
+  `SupplierContact` est la cible, inchangé), #89 (validators Information Commerciale /
+  catégorie / RG-2.07-2.08), #90 (RBAC fournisseurs).
+
+## Méthode d'amendement
+
+Pour chaque ticket impacté : **préfixer** la description existante du bandeau ci-dessus
+(sans rien supprimer du contenu d'origine), via `mcp__lesstime__update-task`
+(`description` = bandeau + description actuelle). La méthode préserve l'historique et reste
+réversible (retirer le bandeau).
@@ -0,0 +1,55 @@
+# M2 · Ticket Specs — Retirer le contact inline du `Supplier` dans les specs M2
+
+## 1. Objectif
+
+Mettre à jour les specs **M2 Fournisseurs** déjà rédigées pour **ne plus inclure** le contact
+principal inline sur le `Supplier`. M2 est le jumeau strict de M1 (`Supplier` /
+`SupplierContact` / `SupplierAddress` / `SupplierRib`) et n'est **pas encore codé** : il faut
+donc corriger la conception **en amont**, pour que les 14 tickets M2 « prêts à dev » soient
+implémentés directement sans les 5 colonnes inline.
+
+> Pendant de M1 ticket 3/3, mais côté M2 : **aucune migration de suppression ni backfill** —
+> on retire simplement le contact inline du modèle cible. Contexte : `README.md` du dossier
+> `refonte-contact`.
+
+## 2. Fichiers à modifier
+
+| Fichier | Sections concernées |
+|---|---|
+| `docs/specs/M2-suppliers/spec-back.md` | § 3.1 diagramme E-R (l.175-179 : retirer les 5 colonnes du bloc `supplier`) ; § 3.2 `CREATE TABLE supplier` (l.227-231) ; § 3.4 squelette entité `Supplier` (l.496-517 : props + `Assert\Callback` RG-2.01) ; § 4 exemples payload POST/GET (l.782-805, 867-871) ; recherche `?search=` (l.847 : refléter D1) ; export (refléter D2) ; § contrat de sérialisation (l.725, 729) ; § 7 RG (voir § 3). |
+| `docs/specs/M2-suppliers/spec-front.md` | « Formulaire principal » (l.105-117 : retirer Nom/Prénom/Téléphone/Téléphone 2/Email) ; onglet « Contact » (l.140-157 : retirer la phrase de pré-remplissage depuis le formulaire principal, l.142) ; écrans Consultation/Modification ; règles de formatage (l.283-285) ; recherche (l.76 : refléter D1). |
+
+## 3. Traitement des règles de gestion M2
+
+- **RG-2.01** (firstName OU lastName obligatoire sur Supplier) → **supprimée** : remplacée
+  par RG-2.04 (≥ 1 contact valide) + RG-2.13 (≥ 1 bloc Contact). Le contact inline n'existe
+  plus sur `Supplier`.
+- **RG-2.02** (max 2 téléphones sur Supplier) → **supprimée du Supplier** (reste sur
+  `SupplierContact`).
+- **RG-2.12** (normalisation Capitalize / chiffres / lowercase) → restreindre le scope :
+  s'applique à `companyName` (UPPERCASE) et aux champs de `SupplierContact` ; **plus** aux
+  champs inline du `Supplier` (qui disparaissent).
+- Ne pas renuméroter les RG : marquer « supprimée / requalifiée » en place, avec date.
+
+## 4. Forme
+
+- Bumper la version des deux specs M2 + entrée d'historique datée (2026-06-03, motif
+  « Suppression du contact inline du Supplier — alignement refonte-contact M1 »).
+- Encadré « Décision » renvoyant au `README.md` du dossier `refonte-contact`.
+- Garder le style des specs M2.
+
+## 5. Lien avec les tickets M2 existants
+
+La mise à jour des specs doit être cohérente avec l'**amendement des tickets M2** (voir
+`M2-amendement-tickets.md`) : tickets back #85/#86/#87/#91/#92 et front #94/#95/#96 (+ #93/#97
+légers). Specs et tickets décrivent le **même** modèle cible (sans contact inline).
+
+## 6. Critères d'acceptation (DoD)
+
+- [ ] `spec-back.md` M2 : aucune mention des 5 colonnes inline dans le modèle `supplier`
+      (E-R + SQL + entité + payloads + sérialisation) ; RG-2.01/2.02 marquées supprimées ;
+      D1/D2 décrites.
+- [ ] `spec-front.md` M2 : formulaire principal sans champs de contact ; onglet Contact
+      présenté comme seul lieu de saisie (sans pré-remplissage depuis le principal).
+- [ ] Versions bumpées + historique daté.
+- [ ] Cohérence avec l'amendement des tickets M2.
@@ -0,0 +1,36 @@
+# Prompt d'implémentation — M2 · Ticket Specs
+
+Projet **Starseed**. Tâche **documentaire**. Mettre à jour les specs M2 Fournisseurs
+(`docs/specs/M2-suppliers/spec-back.md` + `spec-front.md`) pour retirer le contact principal
+inline du `Supplier` (5 champs `firstName/lastName/phonePrimary/phoneSecondary/email`).
+
+M2 n'est **pas encore codé** : on corrige la conception en amont, **sans** migration ni
+backfill (contrairement à M1). Les contacts vivent uniquement dans `SupplierContact`.
+
+Spec du ticket : `docs/specs/M1-clients/refonte-contact/M2-ticket-specs.md` (lis-la + le
+`README.md` du dossier).
+
+## Étapes
+
+1. Lire `spec-back.md` et `spec-front.md` M2 ; repérer toutes les occurrences des 5 champs
+   (E-R l.175-179, CREATE TABLE supplier l.227-231, entité l.496-517, payloads l.782-805 /
+   867-871, sérialisation l.725-729, RG-2.01/2.02/2.12, recherche, export, formulaire
+   principal front l.105-117, pré-remplissage onglet Contact l.142).
+2. Retirer les 5 colonnes du modèle `supplier`.
+3. Marquer **supprimées** RG-2.01 et RG-2.02 (renvoi RG-2.04/RG-2.13) ; restreindre RG-2.12
+   à `companyName` + `SupplierContact`. Ne pas renuméroter.
+4. Refléter D1 (recherche : LEFT JOIN supplier_contact recommandé) et D2 (export depuis le
+   contact principal recommandé).
+5. Front : retirer les champs de contact du formulaire principal ; retirer la phrase de
+   pré-remplissage du 1er bloc Contact ; présenter l'onglet Contact comme seul lieu de saisie.
+6. Bumper la version + historique daté (2026-06-03).
+
+## Garde-fous
+
+- Uniquement les `.md` de specs M2. Style existant conservé.
+- Cohérence stricte avec l'amendement des tickets M2 et avec la décision M1 (jumeau).
+
+## Vérification
+
+Relire les 2 specs : plus aucune mention des 5 champs inline dans le modèle `supplier` ;
+RG-2.01/2.02 supprimées ; versions bumpées.
@@ -0,0 +1,84 @@
+# Refonte « contact » — suppression du contact inline des tiers (Client M1 + Supplier M2)
+
+> Dossier de tickets transverse. Source de vérité de la décision et de son découpage.
+> Rédigé le 2026-06-03. Owner : Matthieu.
+
+## 1. Décision
+
+Le **contact « principal » inline** (les 5 colonnes plates `first_name`, `last_name`,
+`phone_primary`, `phone_secondary`, `email`) est **supprimé de l'entité tier** (`Client`,
+puis `Supplier`). La gestion des contacts passe **exclusivement** par la sous-entité
+dédiée (`ClientContact` / `SupplierContact`), c.-à-d. l'**onglet « Contacts »**.
+
+### Pourquoi
+
+- **Modèle unique, zéro duplication.** Aujourd'hui le contact est saisi deux fois : une
+  fois dans le bloc principal (inline sur le tier) et une fois dans l'onglet Contacts
+  (sous-entité). À la création, le front recopie même l'un dans l'autre
+  (`prefillFirstContact`). Deux sources pour la même information = risque de divergence.
+- **Cohérence métier.** Un tier peut avoir plusieurs contacts ; il n'y a pas de raison
+  qu'un seul soit « privilégié » au niveau de la table tier. La notion de contact
+  appartient à la collection de contacts.
+- **Garantie préservée.** L'invariant « il y a toujours au moins un contact » est déjà
+  assuré par la sous-entité : RG-1.05/RG-1.14 (M1) et RG-2.04/RG-2.13 (M2) imposent
+  **≥ 1 bloc Contact valide** (Nom OU Prénom). Supprimer le contact inline ne crée donc
+  aucun trou : le contact reste obligatoire, mais au bon endroit.
+
+### Règles de gestion impactées
+
+| RG | Avant | Après |
+|---|---|---|
+| RG-1.01 / RG-2.01 (firstName OU lastName obligatoire **sur le tier**) | sur `Client` / `Supplier` | **supprimée** du tier — équivalent assuré par RG-1.05 / RG-2.04 sur la sous-entité |
+| RG-1.02 / RG-2.02 (max 2 téléphones **sur le tier**) | sur le tier | **supprimée** du tier — reste sur la sous-entité |
+| RG-1.19/1.20/1.21 — RG-2.12 (normalisation Capitalize / chiffres / lowercase) | appliquée aux champs **du tier ET** de la sous-entité | ne s'applique plus aux champs du tier (qui n'existent plus) — **inchangée** sur la sous-entité |
+
+## 2. Périmètre & découpage
+
+### M1 — Clients (code DÉJÀ livré → suppression + migration de données)
+
+| # | Ticket | Tag | Effort |
+|---|--------|-----|--------|
+| 1 | `M1-ticket-01-back` — supprimer le contact inline du `Client` (migration + backfill + entité + processor + provider + export + fixtures + tests) | Backend | M |
+| 2 | `M1-ticket-02-front` — retirer le bloc contact principal des écrans création / consultation / modification | Frontend | M |
+| 3 | `M1-ticket-03-specs` — acter la décision dans les specs M1 (back + front + cahier de test) | Maintenance | S |
+
+### M2 — Fournisseurs (NON codé → on retire le contact inline dès la conception)
+
+| # | Action | Tag | Effort |
+|---|--------|-----|--------|
+| 4 | `M2-ticket-specs` — mettre à jour les specs M2 déjà écrites (back + front) pour retirer le contact inline du `Supplier` | Maintenance | S |
+| — | `M2-amendement-tickets` — amender les tickets M2 existants (n° 84–97) impactés (migration, entités, processor, export, front, tests, i18n) | — | — |
+
+> M2 ne nécessite **pas** de migration de suppression ni de backfill : il suffit de **ne
+> jamais créer** les 5 colonnes inline sur `supplier`. Le travail M2 est donc un
+> ajustement de specs + un amendement des tickets « prêts à dev ».
+
+## 3. Décisions transverses à trancher (mêmes pour M1 et M2)
+
+Deux comportements s'appuyaient sur les colonnes inline du tier. À la suppression, il faut
+choisir leur nouvelle source. Recommandation par défaut entre parenthèses.
+
+- **D1 — Recherche serveur** (`?search=`). Aujourd'hui : fuzzy sur `companyName` +
+  `lastName` + `email` **du tier**. Après suppression, deux options :
+  - (a) restreindre la recherche à `companyName` seul (simple, mais perte de la recherche
+    par contact) ;
+  - (b) **[recommandé]** étendre la recherche en `LEFT JOIN` sur la sous-entité contact
+    (`first_name` / `last_name` / `email` du contact), pour préserver l'UX « recherche par
+    nom / contact / email » annoncée dans la barre de recherche.
+- **D2 — Colonnes de l'export XLSX** (Nom contact / Prénom / Téléphone / Téléphone 2 /
+  Email). Après suppression :
+  - (a) supprimer ces colonnes ;
+  - (b) **[recommandé]** les alimenter depuis le **contact principal** (le contact de plus
+    petit `position`), pour garder un export utile.
+
+Ces deux décisions sont à valider par le métier (Matthieu) avant implémentation et sont
+rappelées dans chaque ticket concerné.
+
+## 4. Fichiers de ce dossier
+
+- `README.md` (ce fichier) — décision + découpage.
+- `M1-ticket-01-back.md` / `.prompt.md` — description + prompt d'implémentation.
+- `M1-ticket-02-front.md` / `.prompt.md`.
+- `M1-ticket-03-specs.md` / `.prompt.md`.
+- `M2-ticket-specs.md` / `.prompt.md`.
+- `M2-amendement-tickets.md` — bandeau d'amendement + liste des tickets M2 à mettre à jour.
@@ -5,8 +5,11 @@ nom: "Répertoire clients"
 ecran: repertoire-clients
 owner_spec: Matthieu
 backup_spec: Tristan
-version: V0
+version: V1
 date_redaction: 2026-05-28
+# Historique : V1 (2026-06-03) — Refonte contact : suppression du contact principal inline
+#   du Client (firstName/lastName/phonePrimary/phoneSecondary/email retirés de la table client).
+#   Les contacts vivent uniquement dans ClientContact. Cf. docs/specs/M1-clients/refonte-contact/README.md

 # === LIENS ===
 spec_front: ./spec-front.md
@@ -203,11 +206,11 @@ Le **formatage `XX XX XX XX XX`** est fait à l'affichage côté front (filter V
 |                   |        +-----------------------+        |  (Catalog)   |
 | id (PK)           |                                         +--------------+
 | company_name      |
-| first_name        |        +-----------------------+        +--------------+
-| last_name         |--1:n-->|    client_contact     |        |   site       |
-| phone_primary     |        +-----------------------+        |  (Sites)     |
-| phone_secondary   |                                         +--------------+
-| email             |        +-----------------------+              ^
+| (contact inline   |        +-----------------------+        +--------------+
+|  retiré V1 —      |--1:n-->|    client_contact     |        |   site       |
+|  firstName,       |        +-----------------------+        |  (Sites)     |
+|  lastName, phones,|                                         +--------------+
+|  email)           |        +-----------------------+              ^
 | distributor_id    |--1:n-->|    client_address     |--n:m---------+
 | broker_id         |        +-----------------------+
 | triage_service    |                  |
@@ -302,15 +305,12 @@ CREATE TABLE client (
    id                  SERIAL PRIMARY KEY,
    -- Formulaire principal
    company_name        VARCHAR(180) NOT NULL,
-    first_name          VARCHAR(120),
-    last_name           VARCHAR(120),
-    phone_primary       VARCHAR(20) NOT NULL,
-    phone_secondary     VARCHAR(20),
-    email               VARCHAR(180) NOT NULL,
+    -- Contact inline retiré (V1, refonte-contact) : first_name / last_name / phone_primary /
+    -- phone_secondary / email vivent désormais uniquement dans client_contact (onglet Contacts).
    distributor_id      INT REFERENCES client(id) ON DELETE SET NULL,
    broker_id           INT REFERENCES client(id) ON DELETE SET NULL,
    triage_service      BOOLEAN NOT NULL DEFAULT FALSE,
-    -- Onglet Information (Commerciale obligatoire — RG-1.04 — null sinon)
+    -- Onglet Information (facultatif pour tous — RG-1.04 supprimée)
    description         TEXT,
    competitors         VARCHAR(255),
    founded_at          DATE,
@@ -465,26 +465,32 @@ CREATE TABLE client_rib (
 CREATE INDEX idx_client_rib_client ON client_rib(client_id);
 ```

-### 3.3 Seed `CategoryType` (extension du M0)
+### 3.3 Seed taxonomie — type unique `CLIENT` + `Category.code` (refonte ERP-78)

-Au M0, la table `category_type` a été créée mais reste vide (HP-1 du M0). Le M1 lève cette restriction avec un seed initial des **types métier** dont le module Tiers a besoin :
+> **⚠ Refonte ERP-78 (décision produit 01/06) — le modèle ci-dessous remplace l'ancien.**
+> Historique : à l'origine (#38), `DISTRIBUTEUR` / `COURTIER` / `SECTEUR` / `AUTRE` étaient des **`category_type`**. Le modèle a été **inversé** :
+>
+> - **UN SEUL `category_type` : `CLIENT`** (code `CLIENT`, label « Client »).
+> - `Distributeur` / `Courtier` / `Secteur` / `Autre` (+ catégories métier fines) sont désormais des **`Category`** rattachées au type `CLIENT`.
+> - Le filtrage métier ne se fait plus sur le **type** mais sur un **`code` stable porté par la `Category`** (NOT NULL, unique parmi les actifs — index partiel `uq_category_code`). Le code est un **slug MAJUSCULE auto-généré du nom** (`CategoryCodeGenerator`), figé à la création, et exposé en **lecture seule** (groupe `category:read`). Les codes `DISTRIBUTEUR` / `COURTIER` (anciennement portés par le type) sont reportés sur les `Category` correspondantes.
+
+Seed cible (migration corrective `Version20260602100000`, namespace racine) :

 ```sql
-INSERT INTO category_type (code, label, position) VALUES
-    ('DISTRIBUTEUR', 'Distributeur', 10),
-    ('COURTIER',     'Courtier',     20),
-    ('SECTEUR',      'Secteur',      30),
-    ('AUTRE',        'Autre',        99);
+-- Type unique
+INSERT INTO category_type (code, label) VALUES ('CLIENT', 'Client') ON CONFLICT (code) DO NOTHING;
+-- Catégories système sous CLIENT (codes stables pilotant les RG)
+-- Distributeur -> DISTRIBUTEUR, Courtier -> COURTIER, Secteur -> SECTEUR, Autre -> AUTRE
 ```

-> **Note** : le CRUD admin de `CategoryType` reste HP (cf. M0).
+> **Note** : le CRUD admin de `CategoryType` reste HP (cf. M0). Le `code` de `Category` n'est PAS saisissable via l'API (auto-généré côté serveur).
 >
-> **Seed en DEUX endroits (décision 29/05, vérifiée empiriquement)** : le `make db-reset` lance les fixtures, dont le purger Doctrine **vide `category_type`** (entité M0 mappée) avant `load()` → un seed posé uniquement en migration disparaît en dev/test. Donc :
-> 1. **Migration** (`ON CONFLICT (code) DO NOTHING`) → sert en **prod** (pas de fixtures).
-> 2. **Fixture Commercial idempotente** (ex. `CommercialReferentialFixtures`) re-seedant les 4 types → survit au `db-reset`, satisfait le critère « 4 types présents après db-reset ».
+> **Seed en DEUX endroits (décision 29/05, vérifiée empiriquement)** : le `make db-reset` lance les fixtures, dont le purger Doctrine **vide `category` / `category_type`** (entités M0 mappées) avant `load()` → un seed posé uniquement en migration disparaît en dev/test. Donc :
+> 1. **Migration** (`ON CONFLICT` / guards `NOT EXISTS`) → sert en **prod** (pas de fixtures).
+> 2. **Fixtures idempotentes** (`CategoryTypeFixtures` → type CLIENT ; `CategoryFixtures` → catégories codées sous CLIENT) → survivent au `db-reset`.
 >
 > ⚠ **À venir en ERP-54** : `tva_mode` / `payment_delay` / `payment_type` / `bank` ne sont pas encore des entités mappées au M1.0 → le purger ne les touche pas, leur seed migration survit. **Dès qu'ERP-54 crée leurs entités, ils seront purgés au db-reset** → il faudra les ajouter à la même fixture référentielle.
-> 🔗 **Coordination ERP-68** : ERP-53 pose la fixture référentielle minimale (4 category_types). ERP-68 l'**étend** (clients de démo, ~12-15) sans la dupliquer.
+> 🔗 **Coordination ERP-68** : ERP-78 (cette refonte) atterrit avant ERP-68. `CategoryFixtures` / `ClientFixtures` ont été adaptées au type unique CLIENT + codes (les tiers distributeur/courtier portent les `Category` de code DISTRIBUTEUR/COURTIER).

 ### 3.4 Entité `Client` — squelette

@@ -574,32 +580,9 @@ class Client implements TimestampableInterface, BlamableInterface
    #[Groups(['client:read', 'client:write:main'])]
    private ?string $companyName = null;

-    // RG-1.01 — first_name OU last_name obligatoire (validation Assert\Callback
-    // au niveau de l'entite, levee dans le Processor).
-    #[ORM\Column(length: 120, nullable: true)]
-    #[Assert\Length(max: 120, normalizer: 'trim')]
-    #[Groups(['client:read', 'client:write:main'])]
-    private ?string $firstName = null;
-
-    #[ORM\Column(length: 120, nullable: true)]
-    #[Assert\Length(max: 120, normalizer: 'trim')]
-    #[Groups(['client:read', 'client:write:main'])]
-    private ?string $lastName = null;
-
-    #[ORM\Column(length: 20)]
-    #[Assert\NotBlank]
-    #[Groups(['client:read', 'client:write:main'])]
-    private ?string $phonePrimary = null;
-
-    #[ORM\Column(length: 20, nullable: true)]
-    #[Groups(['client:read', 'client:write:main'])]
-    private ?string $phoneSecondary = null;
-
-    #[ORM\Column(length: 180)]
-    #[Assert\NotBlank]
-    #[Assert\Email]
-    #[Groups(['client:read', 'client:write:main'])]
-    private ?string $email = null;
+    // Contact inline retiré (V1, refonte-contact) : firstName / lastName / phonePrimary /
+    // phoneSecondary / email ne sont plus portés par Client — ils vivent dans ClientContact
+    // (onglet Contacts). La garantie « ≥ 1 contact nommé » est portée par RG-1.05 + RG-1.14.

    // RG-1.03 — distributor / broker auto-references (mutuellement exclusives,
    // contrainte CHECK en base).
@@ -742,8 +725,8 @@ class Client implements TimestampableInterface, BlamableInterface
 - **Security** : `is_granted('commercial.clients.view')`
 - **Query params** :
  - `includeArchived=true|false` (default `false`)
-  - `categoryType=<code>` (filtre par type de catégorie via `SearchFilter`)
-  - `search=<text>` (recherche fuzzy sur companyName + lastName + email)
+  - `categoryCode=<code>` (filtre les clients ayant ≥ 1 `Category` de ce code stable — ERP-78 ; ex. `DISTRIBUTEUR`, `COURTIER`)
+  - `search=<text>` (recherche fuzzy sur companyName + contacts liés `client_contact` (firstName / lastName / email) via LEFT JOIN groupé par `client.id` — décision D1, refonte-contact)
 - **Tri par défaut** : `companyName ASC`
 - **Pagination** : front via `<MalioDataTable>` (volumétrie cible faible). Pas de pagination serveur au M1.
 - **Réponse 200** (JSON-LD Hydra) : items avec champs `client:read` UNIQUEMENT (pas les champs `client:read:accounting` sauf si l'user a la permission `accounting.view`).
@@ -762,10 +745,6 @@ class Client implements TimestampableInterface, BlamableInterface
 ```json
 {
  "companyName": "ACME SAS",
-  "firstName": "Jean",
-  "lastName": "Dupont",
-  "phonePrimary": "0612345678",
-  "email": "jean.dupont@acme.fr",
  "categories": ["/api/categories/3", "/api/categories/7"],
  "distributor": null,
  "broker": null,
@@ -777,7 +756,7 @@ class Client implements TimestampableInterface, BlamableInterface
  - `201` / `400` / `401` / `403`
  - `409 Conflict` si doublon de nom de société (`companyName` — RG-1.16). SIREN et email ne sont pas uniques (cf. Q4, § 2.4).
  - `422 Unprocessable Entity` :
-    - RG-1.01 : ni firstName ni lastName
+    - (RG-1.01 supprimée V1 — la complétude du contact est portée par l'onglet Contacts : RG-1.05 / RG-1.14)
    - RG-1.03 : distributor + broker remplis simultanément
    - Catégories vides (Assert\Count min=1)

@@ -879,14 +858,13 @@ Cf. § 2.6. Pattern Shared standard.

 ### Formulaire principal

- **RG-1.01** : Au moins l'un des champs `firstName` (Prénom du contact principal) ou `lastName` (Nom du contact principal) doit être renseigné. Sinon → 422.
- **RG-1.02** : Le champ `phoneSecondary` est optionnel et apparaît au clic sur un bouton `+` côté front. Maximum 2 téléphones (primary + secondary). Comportement purement front au niveau UI ; côté serveur, les 2 colonnes existent et sont distinctes.
- **RG-1.03** : Les champs `distributor` et `broker` sont **mutuellement exclusifs** (au plus une seule des deux est renseignée). Tentative d'envoyer les deux → 422. Contrainte CHECK en base également : `NOT (distributor_id IS NOT NULL AND broker_id IS NOT NULL)`. La liste front de `distributor` = clients ayant au moins une catégorie de type `DISTRIBUTEUR` ; idem pour `broker` avec `COURTIER`.
+- ~~**RG-1.01**~~ _(SUPPRIMÉE — V1, 2026-06-03, refonte-contact)_ : le contact principal inline est retiré du `Client`. La garantie « au moins un contact nommé » est désormais portée par **RG-1.05** (bloc Contact valide) + **RG-1.14** (≥ 1 bloc Contact) sur `ClientContact`.
+- ~~**RG-1.02**~~ _(SUPPRIMÉE du Client — V1, refonte-contact)_ : plus de téléphones inline sur le `Client`. Le « maximum 2 téléphones » reste applicable aux blocs `ClientContact` (normalisation RG-1.20).
+- **RG-1.03** : Les champs `distributor` et `broker` sont **mutuellement exclusifs** (au plus une seule des deux est renseignée). Tentative d'envoyer les deux → 422. Contrainte CHECK en base également : `NOT (distributor_id IS NOT NULL AND broker_id IS NOT NULL)`. Un `distributor` référencé doit porter une **`Category` de code `DISTRIBUTEUR`** ; un `broker` une **`Category` de code `COURTIER`** — sinon 422. _(Refonte ERP-78 : le filtrage se fait sur le `code` de la `Category`, plus sur le type — `ClientProcessor::hasCategoryCode`.)_ La liste front de `distributor` = clients ayant une catégorie de code `DISTRIBUTEUR`, via `GET /api/clients?categoryCode=DISTRIBUTEUR` ; idem `broker` avec `COURTIER`.

 ### Onglet Information

- **RG-1.04** _(durcie — ERP-74)_ : Pour un utilisateur portant le rôle métier **Commerciale**, **tous** les champs de l'onglet Information (`description`, `competitors`, `foundedAt`, `employeesCount`, `revenueAmount`, `directorName`, `profitAmount`) sont obligatoires sur **POST et sur tout PATCH**, **indépendamment des champs réellement envoyés** (la condition d'intersection avec `client:write:information` a été retirée). Pour les autres rôles, ces champs restent optionnels. Implémenté via un validator custom `ClientInformationCompletenessValidator` invoqué systématiquement par le `ClientProcessor` quand le user porte le rôle Commerciale.
-  - **Conséquence** : le POST n'exposant que le groupe `client:write:main`, l'onglet Information n'y est pas renseignable → une Commerciale obtient **422** sur tout POST (cf. § 8.1). La complétude se fait donc via les PATCH `client:write:information` ultérieurs. Un Admin (non gaté) crée normalement (201).
+- ~~**RG-1.04**~~ _(SUPPRIMÉE)_ : l'onglet Information est désormais **facultatif pour tous les rôles**, y compris Commerciale. Les champs `description`, `competitors`, `foundedAt`, `employeesCount`, `revenueAmount`, `directorName`, `profitAmount` restent optionnels (colonnes nullable, aucune validation de complétude). Le validator `ClientInformationCompletenessValidator` et le gating par rôle métier dans le `ClientProcessor` ont été retirés.

 ### Onglet Contact

@@ -904,6 +882,7 @@ Cf. § 2.6. Pattern Shared standard.

 ### Onglet Comptabilité

+- **RG-1.30** _(ajoutée — correctif incohérence spec-front/spec-back)_ : à la **validation complète de l'onglet Comptabilité**, les six champs scalaires `siren`, `accountNumber`, `tvaMode`, `nTva`, `paymentDelay`, `paymentType` sont **obligatoires** (alignement sur spec-front § Onglet Comptabilité). Colonnes `nullable` en base (l'onglet est rempli dans un second temps, et l'onglet principal ne les envoie pas) + validateur contextuel `ClientAccountingCompletenessValidator` invoqué par le `ClientProcessor` (parti pris : nullable + validateur d'onglet plutôt qu'un `Assert\NotBlank` sur l'entité). Déclenchement : uniquement quand **les six champs sont présents dans le payload** (le front les envoie toujours ensemble via « Valider ») ; un PATCH ciblant un sous-ensemble de champs comptables (édition ponctuelle) n'est pas soumis à la complétude. Chaque champ manquant → 422 sur son `propertyPath` (mapping inline front, ERP-101). `bank` reste hors complétude (conditionnel RG-1.12).
 - **RG-1.12** : Le champ `bank` est visible et obligatoire **uniquement** si `paymentType.code = 'VIREMENT'`. Validation server-side dans le `ClientProcessor` : si `payment_type.code = VIREMENT` et `bank IS NULL` → 422.
 - **RG-1.13** : Les champs RIB (`label`, `bic`, `iban`) sont obligatoires si **au moins un bloc RIB est présent ET** `paymentType.code = 'LCR'`. C'est-à-dire :
  - Si `paymentType.code = LCR` ET `client.ribs.count() = 0` → 422 « Au moins un RIB est obligatoire pour le type LCR ».
@@ -923,9 +902,9 @@ Cf. § 2.6. Pattern Shared standard.
 ### Normalisation serveur (formatage)

 - **RG-1.18** : `companyName` est **upper-cased** intégralement côté serveur avant validation et persistance (`mb_strtoupper(trim($v), 'UTF-8')`). Le client n'a pas besoin de saisir en majuscules ; la BDD stocke en majuscules.
- **RG-1.19** : `firstName`, `lastName` (sur `Client` et `ClientContact`) sont **capitalize**-és serveur (`mb_convert_case(trim($v), MB_CASE_TITLE, 'UTF-8')`). Exemple : `JEAN dupont` → `Jean Dupont`.
- **RG-1.20** : Les champs téléphone (`phonePrimary`, `phoneSecondary` sur `Client`, et idem sur `ClientContact`) sont **normalisés à chiffres uniquement** côté serveur (`preg_replace('/\D+/', '', $v)`). Stockage : `0612345678`. Le **format affichage `XX XX XX XX XX`** est de la responsabilité du front via un filter Vue dédié (cf. spec-front).
- **RG-1.21** : `email` (`Client.email`, `ClientAddress.billingEmail`, `ClientContact.email`) est **lowercase** intégralement côté serveur (`mb_strtolower(trim($v), 'UTF-8')`).
+- **RG-1.19** : `firstName`, `lastName` (sur `ClientContact` ; scope `Client` retiré en V1) sont **capitalize**-és serveur (`mb_convert_case(trim($v), MB_CASE_TITLE, 'UTF-8')`). Exemple : `JEAN dupont` → `Jean Dupont`.
+- **RG-1.20** : Les champs téléphone (`phonePrimary`, `phoneSecondary` sur `ClientContact` ; scope `Client` retiré en V1) sont **normalisés à chiffres uniquement** côté serveur (`preg_replace('/\D+/', '', $v)`). Stockage : `0612345678`. Le **format affichage `XX XX XX XX XX`** est de la responsabilité du front via un filter Vue dédié (cf. spec-front).
+- **RG-1.21** : `email` (`ClientAddress.billingEmail`, `ClientContact.email` ; `Client.email` retiré en V1) est **lowercase** intégralement côté serveur (`mb_strtolower(trim($v), 'UTF-8')`).

 ### Archivage

@@ -946,19 +925,19 @@ Cf. § 2.6. Pattern Shared standard.

 - **RG-1.28** : Si un PATCH contient des champs de **plusieurs groupes** de sérialisation et que l'utilisateur **n'a pas toutes les permissions** correspondantes, le `ClientProcessor` renvoie **403 Forbidden sur l'ensemble du payload** (mode strict — pas de filtrage silencieux). Le front est responsable de ne JAMAIS envoyer de champs hors-permission (les onglets masqués via `usePermissions()` ne génèrent pas de payload). Cette règle protège contre les appels API directs malveillants. Exemple : un Bureau qui envoie `{ "companyName": "...", "siren": "..." }` → 403, le message d'erreur précise « Champ `siren` requiert la permission `commercial.clients.accounting.manage` ».

-### Catégorie sur ClientAddress (filtrage par type)
+### Catégorie sur ClientAddress (filtrage par code)

- **RG-1.29** : Le `<MalioSelectCheckbox>` Catégorie de l'onglet Adresse n'expose **que** les `Category` dont `categoryType.code IN ('SECTEUR', 'AUTRE')`. Les types `DISTRIBUTEUR` et `COURTIER` qualifient une **relation entre clients** (cf. RG-1.03) et n'ont pas de sens sur une adresse physique. Implémentation : `ClientAddressProvider` filtre côté serveur via paramètre de requête à l'endpoint `GET /api/categories?categoryType.code[]=SECTEUR&categoryType.code[]=AUTRE` (SearchFilter API Platform). Côté validation du POST/PATCH : si l'utilisateur tente de poster une catégorie de type DISTRIBUTEUR ou COURTIER sur une adresse → **422** avec violation `categories: "Type de catégorie non autorisé sur une adresse."`.
+- **RG-1.29** _(refonte ERP-78)_ : sur une adresse, les `Category` de **code `DISTRIBUTEUR` ou `COURTIER`** sont **interdites** — elles qualifient une **relation entre clients** (cf. RG-1.03) et n'ont pas de sens sur une adresse physique. **Toute autre** catégorie (type unique CLIENT) est autorisée. Validation du POST/PATCH : poster une catégorie de code DISTRIBUTEUR/COURTIER sur une adresse → **422** avec violation `categories: "Type de catégorie non autorisé sur une adresse."` (`ClientAddress::validateCategoryCodes`). Côté front, le `<MalioSelectCheckbox>` Catégorie de l'onglet Adresse exclut les `Category` de code `DISTRIBUTEUR` / `COURTIER` (le `code` est exposé en lecture sur `/api/categories`).

 ## 8. Tests à automatiser

 ### 8.1 Cas à couvrir (back — PHPUnit)

- [ ] **RG-1.01** : POST sans firstName ni lastName → 422
- [ ] **RG-1.02** : POST avec phoneSecondary rempli → persistance OK ; PATCH ajoutant un 3e téléphone → côté API, 2 colonnes uniquement (test que le payload ne peut pas créer un 3e)
+- [ ] ~~RG-1.01~~ _(supprimée V1)_ : la complétude du contact est couverte par RG-1.05 / RG-1.14 sur `ClientContact`
+- [ ] ~~RG-1.02~~ _(supprimée du Client V1)_ : plus de téléphones inline sur le Client (téléphones testés sur `ClientContact`)
 - [ ] **RG-1.03** : POST avec distributor ET broker → 422 ; POST distributor seul → 201
- [ ] **RG-1.03** : POST distributor référençant un client SANS catégorie de type DISTRIBUTEUR → 422 (validation custom)
- [ ] **RG-1.04** : PATCH onglet Information par un user Commerciale avec champs incomplets → 422 ; même PATCH par Admin → 200
+- [ ] **RG-1.03** : POST distributor référençant un client SANS catégorie de code DISTRIBUTEUR → 422 (validation custom `ClientProcessor::hasCategoryCode`)
+- [x] ~~**RG-1.04**~~ _(SUPPRIMÉE)_ : onglet Information facultatif pour tous les rôles (plus de validation de complétude)
 - [ ] **RG-1.05** : POST contact sans firstName ni lastName → 422 (BDD CHECK lève une exception)
 - [ ] **RG-1.06/07/08** : POST adresse avec isProspect=true ET isDelivery=true → 422 / CHECK
 - [ ] **RG-1.09** : POST adresse avec postalCode invalide (3 chiffres) → 422 ; CP/ville incohérents → 200 (pas de validation stricte côté serveur)
@@ -969,9 +948,9 @@ Cf. § 2.6. Pattern Shared standard.
 - [ ] **RG-1.14** : front-driven uniquement, pas de test back
 - [ ] **RG-1.16** : POST avec `companyName` déjà pris → 409 ; POST avec même `companyName` après archivage de l'ancien → 201. SIREN et email dupliqués → 201 (plus d'unicité — RG-1.15/1.17 supprimées, Q4).
 - [ ] **RG-1.18** : POST `companyName="acme sas"` → BDD persiste `"ACME SAS"`
- [ ] **RG-1.19** : POST `firstName="JEAN"`, `lastName="dupont"` → persiste `"Jean"`, `"Dupont"`
- [ ] **RG-1.20** : POST `phonePrimary="06.12.34.56.78"` → persiste `"0612345678"`
- [ ] **RG-1.21** : POST `email="Jean.DUPONT@ACME.FR"` → persiste `"jean.dupont@acme.fr"`
+- [ ] **RG-1.19** : POST `firstName="JEAN"`, `lastName="dupont"` (via un bloc `ClientContact`) → persiste `"Jean"`, `"Dupont"`
+- [ ] **RG-1.20** : POST `phonePrimary="06.12.34.56.78"` (via un bloc `ClientContact`) → persiste `"0612345678"`
+- [ ] **RG-1.21** : POST `email="Jean.DUPONT@ACME.FR"` (via `ClientContact` ou `ClientAddress.billingEmail`) → persiste `"jean.dupont@acme.fr"`
 - [ ] **RG-1.22/23** : PATCH isArchived=true par Bureau (sans `archive`) → 403 ; par Admin → 200 + archivedAt rempli ; PATCH isArchived=false sur un client archivé dont le SIREN a été repris → 409
 - [ ] **RG-1.24/25** : GET liste sans flag → exclut archivés ; avec `?includeArchived=true` → inclut
 - [ ] **RG-1.26** : GET liste → tri companyName ASC
@@ -5,12 +5,15 @@ nom: "Répertoire clients"
 ecran: repertoire-clients
 owner_spec: Matthieu
 backup_spec: Tristan
-version: V0
+version: V1
+# Historique : V1 (2026-06-03) — Refonte contact : suppression du bloc contact principal inline
+#   (Nom/Prénom/Téléphone/Téléphone 2/Email retirés du formulaire principal et des écrans).
+#   Saisie via l'onglet Contacts uniquement. Cf. docs/specs/M1-clients/refonte-contact/README.md
 date_redaction: 2026-05-28

 # === LIENS ===
 maquette_figma: "https://www.figma.com/design/jRYgT0T9c03VsEbjGhCwwS/Composants---Design-System?node-id=1132-31898"
-regles_metier: [RG-1.01, RG-1.02, RG-1.03, RG-1.04, RG-1.05, RG-1.06, RG-1.07, RG-1.08, RG-1.09, RG-1.10, RG-1.11, RG-1.12, RG-1.13, RG-1.14, RG-1.15, RG-1.16, RG-1.17, RG-1.18, RG-1.19, RG-1.20, RG-1.21, RG-1.22, RG-1.23, RG-1.24, RG-1.25, RG-1.26, RG-1.27, RG-1.28, RG-1.29]
+regles_metier: [RG-1.01, RG-1.02, RG-1.03, RG-1.05, RG-1.06, RG-1.07, RG-1.08, RG-1.09, RG-1.10, RG-1.11, RG-1.12, RG-1.13, RG-1.14, RG-1.15, RG-1.16, RG-1.17, RG-1.18, RG-1.19, RG-1.20, RG-1.21, RG-1.22, RG-1.23, RG-1.24, RG-1.25, RG-1.26, RG-1.27, RG-1.28, RG-1.29]
 roles: [Admin, Bureau, Compta, Commerciale, Usine]
 lien_spec_back: ./spec-back.md

@@ -68,9 +71,6 @@ Composant : `<MalioDataTable>`. Colonnes (à raffiner avec Tristan en revue maqu
 | Colonne | Source | Tri |
 |---|---|---|
 | **Nom entreprise** | `client.companyName` | ASC par défaut |
-| **Contact principal** | `firstName + lastName` | Oui |
-| **Téléphone principal** | `phonePrimary` (formaté `XX XX XX XX XX`) | Non |
-| **Email principal** | `email` | Oui |
 | **Catégories** | liste des codes catégories séparés par `,` | Non |
 | **Site(s)** | sites rattachés à au moins une adresse (badges colorés) | Non |

@@ -86,18 +86,15 @@ Création par **onglets successifs avec validation incrémentale** : pour pouvoi

 C'est le 1er bloc à remplir. Sans validation de ce formulaire, les onglets ne sont pas accessibles.

+> **V1 — refonte-contact** : le contact principal (Nom / Prénom / Téléphone / Téléphone 2 / Email) a été **retiré** du formulaire principal. Les coordonnées se saisissent désormais dans l'onglet **Contacts** (RG-1.05 / RG-1.14). Le formulaire principal ne contient plus que Entreprise + Catégorie + relation Distributeur/Courtier.
+
 | Champ | Type composant | Obligatoire | Règle |
 |---|---|---|---|
 | **Nom du client (Entreprise)** | `<MalioInputText>` | Oui | RG-1.18 (normalisation UPPERCASE serveur) |
-| **Nom du contact principal** | `<MalioInputText>` | Conditionnel | RG-1.01 + RG-1.19 (Capitalize) |
-| **Prénom du contact principal** | `<MalioInputText>` | Conditionnel | RG-1.01 + RG-1.19 (Capitalize) |
 | **Catégorie** | `<MalioSelectCheckbox>` (multi) | Oui | Liste des `Category` de l'API ; M2M Client ↔ Category |
-| **Téléphone principal** | `<MalioInputText>` (masque tel) | Oui | RG-1.02 + RG-1.20 (format `XX XX XX XX XX`) |
-| **Téléphone secondaire** | `<MalioInputText>` (masque tel) | Non | Apparaît au clic sur le bouton `+` (RG-1.02). Max 2 — bouton `+` disparaît une fois rempli. |
-| **Email** | `<MalioInputText>` type email | Oui | RG-1.21 (lowercase) |
 | **Distributeur / Courtier** | `<MalioSelect>` | Non | Valeurs : `Dépend du distributeur` / `Dépend du courtier` / `Aucun`. RG-1.03 conditionne les 2 champs suivants. |
-| **Nom du distributeur** | `<MalioSelect>` | Conditionnel | Visible si « Dépend du distributeur ». Liste = clients ayant ≥ 1 catégorie de type `DISTRIBUTEUR`. RG-1.03. |
-| **Nom du courtier** | `<MalioSelect>` | Conditionnel | Visible si « Dépend du courtier ». Liste = clients ayant ≥ 1 catégorie de type `COURTIER`. RG-1.03. |
+| **Nom du distributeur** | `<MalioSelect>` | Conditionnel | Visible si « Dépend du distributeur ». Liste = clients ayant ≥ 1 catégorie de **code** `DISTRIBUTEUR` (ERP-78), via `GET /api/clients?categoryCode=DISTRIBUTEUR`. RG-1.03. |
+| **Nom du courtier** | `<MalioSelect>` | Conditionnel | Visible si « Dépend du courtier ». Liste = clients ayant ≥ 1 catégorie de **code** `COURTIER` (ERP-78), via `GET /api/clients?categoryCode=COURTIER`. RG-1.03. |
 | **Prestation de triage** | `<MalioCheckbox>` | Non | — |

 **Action** : « Valider » (`<MalioButton>`) → POST `/api/clients` ([`spec-back.md` § 4.3](./spec-back.md)). Si succès, on passe automatiquement à l'onglet « Information ».
@@ -108,19 +105,19 @@ Saisir les informations de l'entreprise.

 | Champ | Type | Obligatoire | Règle |
 |---|---|---|---|
-| **Description** | `<MalioInputTextArea>` | Conditionnel | RG-1.04 (obligatoire pour rôle Commerciale) |
-| **Concurrents** | `<MalioInputText>` | Conditionnel | RG-1.04 |
-| **Date de création** (de l'entreprise) | `<input type="date">` (exception Malio — pas de composant date couvert) | Conditionnel | RG-1.04 |
-| **Nombre de salariés** | `<MalioInputNumber>` | Conditionnel | RG-1.04 |
-| **CA €** | `<MalioInputAmount>` | Conditionnel | RG-1.04 |
-| **Dirigeant** | `<MalioInputText>` | Conditionnel | RG-1.04 |
-| **Résultat €** | `<MalioInputAmount>` | Conditionnel | RG-1.04 |
+| **Description** | `<MalioInputTextArea>` | Non | — _(onglet facultatif, RG-1.04 supprimée)_ |
+| **Concurrents** | `<MalioInputText>` | Non | — |
+| **Date de création** (de l'entreprise) | `<input type="date">` (exception Malio — pas de composant date couvert) | Non | — |
+| **Nombre de salariés** | `<MalioInputNumber>` | Non | — |
+| **CA €** | `<MalioInputAmount>` | Non | — |
+| **Dirigeant** | `<MalioInputText>` | Non | — |
+| **Résultat €** | `<MalioInputAmount>` | Non | — |

 **Action** : « Valider » → PATCH partiel `/api/clients/{id}` (groupe `client:write:information`).

 ### Onglet « Contact »

-Saisir un ou plusieurs contacts associés au client. Le 1er bloc est **pré-rempli** depuis les champs du formulaire principal (Nom, Prénom, Téléphone, Email — édition autorisée).
+Saisir un ou plusieurs contacts associés au client. **(V1 — refonte-contact : plus de pré-remplissage depuis le formulaire principal ; les coordonnées du contact se saisissent directement ici.)** Au moins un bloc Contact valide est requis (RG-1.14).

 **Bloc Contact** :

@@ -150,7 +147,7 @@ Saisir une ou plusieurs adresses du client, rattachées à un ou plusieurs sites
 | **Prospect** | `<MalioCheckbox>` | Non | RG-1.06 — masque Adresse de livraison + Facturation si coché |
 | **Adresse de livraison** | `<MalioCheckbox>` | Non | RG-1.07 — masque Prospect si coché |
 | **Facturation** | `<MalioCheckbox>` | Non | RG-1.08 — masque Prospect si coché ; affiche le champ Email (RG-1.11) |
-| **Catégorie** | `<MalioSelectCheckbox>` (multi) | Oui | Liste des `Category` de **type SECTEUR + AUTRE** uniquement (cf. décision Q5 — DISTRIBUTEUR et COURTIER qualifient une relation entre clients, pas un lieu) |
+| **Catégorie** | `<MalioSelectCheckbox>` (multi) | Oui | Liste des `Category` **hors codes `DISTRIBUTEUR` / `COURTIER`** (ERP-78 — ces codes qualifient une relation entre clients, pas un lieu). Le front exclut ces 2 codes du select (le `code` est exposé en lecture sur `/api/categories`). |
 | **Pays** | `<MalioSelect>` | Oui | Préremplie « France » |
 | **Code postal** | `<MalioInputText>` (masque numérique) | Oui | RG-1.09 — déclenche autocomplete ville via BAN |
 | **Ville** | `<MalioSelect>` | Oui | RG-1.09 — alimentée par api-adresse.data.gouv.fr suivant le CP |
@@ -250,7 +247,7 @@ Le serveur normalise systématiquement (cf. RG-1.18 à RG-1.21 dans [`spec-back.
 |---|---|---|
 | Nom entreprise (`companyName`) | UPPERCASE intégral | UPPERCASE |
 | Nom + Prénom contact | Capitalize (1ère lettre majuscule + reste minuscule) | identique |
-| Téléphone (`phonePrimary`, `phoneSecondary`, contact phones) | Chiffres uniquement en BDD | Formaté `XX XX XX XX XX` à l'affichage (filter Vue) |
+| Téléphone (téléphones des blocs `ClientContact`) | Chiffres uniquement en BDD | Formaté `XX XX XX XX XX` à l'affichage (filter Vue) |
 | Email | lowercase intégral | identique |

 > **Le front ne fait pas la normalisation** — il envoie la valeur saisie, le serveur normalise puis renvoie la valeur normalisée. L'UI affiche immédiatement la valeur normalisée renvoyée par l'API. Cohérent avec le pattern `useApi()`.
@@ -261,21 +258,22 @@ Le composant `Code postal` + `Ville` + `Adresse` est branché sur **api-adresse.

 - Composable dédié `useAddressAutocomplete()` (à créer en M1).
 - Appel HTTP **direct depuis le front** (CORS OK), pas de proxy back.
- Pattern : à la saisie du code postal (5 chiffres), GET `https://api-adresse.data.gouv.fr/search/?q={cp}&type=municipality` → alimente le select Ville. Sur saisie d'adresse : `?q={addr}&postcode={cp}&type=housenumber` → suggestions adresse.
+- Pattern : à la saisie du code postal (5 chiffres), GET `https://api-adresse.data.gouv.fr/search/?q={cp}&type=municipality` → alimente le select Ville. Sur saisie d'adresse : `?q={addr}&postcode={cp}` (sans filtre `type`) → suggestions adresse.
+    - ⚠ **Ne pas forcer `type=housenumber`** sur la recherche d'adresse (corrigé en ERP-66) : la BAN ne renvoie un résultat de ce type qu'une fois un numéro saisi, donc une recherche par nom de rue (« boulevard du port ») renverrait **0 résultat** pendant toute la frappe. Sans filtre `type`, la BAN classe rues + numéros par pertinence — comportement d'autocomplétion attendu.
 - Cas dégradé : si l'API ne répond pas (offline, timeout), le champ Ville devient un `<MalioInputText>` libre éditable + toast d'avertissement. Validation serveur acceptera la saisie libre.

 ## Points laissés ouverts par la V0 (résolus côté back)

 | # | Zone d'ombre V0 | Résolution (cf. `spec-back.md`) |
 |---|---|---|
-| 1 | Catégorie en multi-select non clarifiée (1 ou n par client) | **M2M `client_category`** validée. CategoryType seedé avec `DISTRIBUTEUR`, `COURTIER`, `SECTEUR`, `AUTRE` (HP-3 du M0 levé). |
+| 1 | Catégorie en multi-select non clarifiée (1 ou n par client) | **M2M `client_category`** validée. Refonte ERP-78 : type unique `CLIENT` ; `Distributeur`/`Courtier`/`Secteur`/`Autre` (+ catégories métier) sont des `Category` portant un `code` stable (HP-3 du M0 levé). |
 | 2 | Distributeur / Courtier : liste de quoi ? | **Auto-référence Client** via 2 FK nullables `distributor_id` et `broker_id` (cf. RG-1.03). Une seule des deux est remplie à la fois. |
 | 3 | Onglet « Comptabilité » : qui édite ? | **Admin et Compta** peuvent éditer l'onglet Comptabilité (`commercial.clients.accounting.manage`). Bureau / Commerciale ne voient pas l'onglet. Compta ne peut pas créer un client (pas de `manage` global), mais peut éditer la partie comptable d'un client existant. |
 | 4 | Workflow par onglet | **Sauvegarde incrémentale**. POST formulaire principal crée le `Client` (status implicite « actif »). Chaque onglet validé = PATCH partiel par groupe de sérialisation dédié. Pas d'état « draft ». |
 | 5 | Onglets « À venir » | **Placeholders blancs** (frames vides, pas de message). Ré-activables sans rebuild quand les modules associés arriveront. |
 | 6 | Archive vs soft delete | **Flag `is_archived` séparé de `deleted_at`**. Archive ≠ delete : un client archivé est masqué par défaut mais reste en BDD éditable (Admin seul). Filtres UI distincts. Soft delete = HP M2. |
 | 7 | Unicité métier | **Nom d'entreprise uniquement** (case-insensitive, parmi non-archivés) — décision Q4. SIREN et email NON uniques. Index partiel Postgres `uq_client_company_name_active`. Doublon de nom → 409 Conflict. |
-| 8 | Téléphones (max 2) | **2 colonnes plates** `phone_primary` + `phone_secondary`. Pas de table séparée. |
+| 8 | Téléphones (max 2) | Sur les blocs `ClientContact` (`phone_primary` + `phone_secondary`). _(V1 : retirés du Client — refonte-contact.)_ |
 | 9 | API code postal | **api-adresse.data.gouv.fr** (BAN). Appel direct front via composable dédié. Cas dégradé : saisie libre + toast. |
 | 10 | Référentiels comptables | **4 entités CRUD-ables** (`TvaMode`, `PaymentDelay`, `PaymentType`, `Bank`) seedées au M1, CRUD admin futur (HP-M2). |
 | 11 | Format de l'export | **XLSX uniquement** au M1. CSV à étudier en HP. |
@@ -0,0 +1,331 @@
+---
+# === IDENTITÉ ===
+module: M2
+nom: "Répertoire fournisseurs"
+ecran: repertoire-fournisseurs
+owner_spec: Matthieu
+backup_spec: Tristan
+version: V0.2
+date_redaction: 2026-06-02
+# Historique : V0.2 (2026-06-03) — Refonte contact : suppression du bloc contact principal inline
+#   du formulaire Supplier (Nom/Prénom/Téléphone/Téléphone 2/Email). Saisie via l'onglet Contacts.
+#   Aligné sur M1. Cf. docs/specs/M1-clients/refonte-contact/README.md
+
+# === LIENS ===
+maquette_figma: "https://www.figma.com/design/jRYgT0T9c03VsEbjGhCwwS/Composants---Design-System?node-id=1132-36987&p=f&m=dev"
+regles_metier: [RG-2.01, RG-2.02, RG-2.03, RG-2.04, RG-2.05, RG-2.06, RG-2.07, RG-2.08, RG-2.09, RG-2.10, RG-2.11, RG-2.12, RG-2.13, RG-2.14, RG-2.15, RG-2.16, RG-2.17]
+roles: [Admin, Bureau, Compta, Commerciale, Usine]
+lien_spec_back: ./spec-back.md
+
+# === VALIDATION CLIENT ===
+client_validation_1:
+  statut: validee
+  date: 2026-05-22
+  version: V0
+  valide_par: "Matthieu (CP MALIO)"
+client_validation_2:
+  statut: validee
+  date: 2026-06-01
+  version: V0.1
+  valide_par: "Matthieu (CP MALIO)"
+  resume: "Module 2 — Répertoire fournisseurs. Page d'entrée Commercial. Datatable + 3 écrans (Ajouter / Consulter / Modifier). Création par onglets : Information / Contact / Adresse / Comptabilité (Transport, Statistiques, Rapports, Échanges = placeholders 'À venir')."
+  trace_archivee: "uploads/M2-reportoire-fournisseurs.docx (V0.1) + M2-reportoire-fournisseurs-V01.pdf"
+
+# === LIEN LESSTIME ===
+lesstime_taskgroup_id: 26
+lesstime_project_id: 6
+statut_global: a_dev
+---
+
+# Module 2 — Répertoire fournisseurs (V0.1 front)
+
+> **Origine** : spec front livrée le 22/05/2026 (V0), amendée le 01/06/2026 (V0.1) — `M2-reportoire-fournisseurs.docx`. Restitution Markdown pour intégration au workflow MALIO. Le contenu fonctionnel original n'est pas modifié ; toute décision technique (back) vit dans [`spec-back.md`](./spec-back.md). Le M2 réutilise massivement le pattern et les composants posés au [M1 clients](../M1-clients/spec-front.md).
+
+## But
+
+Permettre aux utilisateurs Starseed (selon rôle) de gérer le **répertoire des fournisseurs** de l'organisation : consultation, création, modification, archivage. C'est la **deuxième porte d'entrée du module Commercial** (aux côtés des Clients).
+
+## Accès
+
+- **Depuis** : menu principal → section **Commercial** → entrée « Répertoire fournisseurs » (route `/suppliers`).
+- **Rôles autorisés** :
+
+| Rôle | Consultation | Création / Modification | Archivage |
+|---|---|---|---|
+| **Admin** | ✅ Tout | ✅ Tout | ✅ |
+| **Bureau** | ✅ Tout | ✅ Tout sauf onglet Comptabilité | ❌ |
+| **Compta** | ✅ Tout | ✅ Onglet Comptabilité uniquement | ❌ |
+| **Commerciale** | ✅ Tout sauf Comptabilité | ✅ Tout sauf Comptabilité | ❌ |
+| **Usine** | ❌ (pas d'accès) | ❌ | ❌ |
+
+> **Note** : RBAC identique au M1, transposée sur `commercial.suppliers.*`. Compta édite uniquement l'onglet Comptabilité (SIREN / N° compte / TVA / Délai / Type de règlement / Banque / RIBs) d'un fournisseur existant ; Compta ne peut pas **créer** un fournisseur. **L'archivage est réservé à Admin** (cf. tableau du docx).
+
+## Navigation
+
+Page d'entrée du module **Commercial** (route `/suppliers`). Titre : « **Répertoire fournisseurs** ».
+
+- Affichage principal : un **datatable** listant tous les fournisseurs **actifs** (les archivés sont masqués par défaut — toggle UI dédié).
+- **Clic sur une ligne** → écran **Consultation fournisseur** (page dédiée).
+- **Bouton « + Ajouter »** (haut droite) → écran **Ajouter un fournisseur**.
+- **Bouton « Filtrer »** (haut droite, **à côté de « + Ajouter »**) → ouvre le **panneau de filtres** (cf. ci-dessous). Un badge/compteur indique le nombre de filtres actifs ; un bouton « Réinitialiser » les vide.
+- **Bouton « Exporter »** (haut droite) → télécharge un **XLSX** des fournisseurs **affichés** (cf. filtres actifs). Format dans [`spec-back.md § 4.6`](./spec-back.md).
+
+### Panneau de filtres (bouton « Filtrer »)
+
+Ouvre un drawer/popover (composant à confirmer côté équipe front — réutiliser le pattern M1 s'il existe). Filtres proposés, branchés sur les query params de `GET /api/suppliers` (cf. [`spec-back.md § 4.1`](./spec-back.md)) :
+
+| Filtre | Composant | Query param back |
+|---|---|---|
+| **Recherche** (nom entreprise / contact / email — recherche contact via `supplier_contact`, décision D1) | `<MalioInputText>` | `?search=` |
+| **Catégorie** | `<MalioSelectCheckbox>` (multi, type FOURNISSEUR) | `?categoryCode=` |
+| **Site** | `<MalioSelectCheckbox>` (86 / 17 / 82) | `?siteId=` |
+| **Inclure les archivés** | `<MalioCheckbox>` | `?includeArchived=true` |
+
+- À l'application des filtres → `setFilters(...)` de `usePaginatedList` (retombe en **page 1**), qui relance `GET /api/suppliers` avec les params.
+- **État 100 % local** (jamais dans l'URL — règle ABSOLUE n°6). Le bouton « Filtrer » + son panneau remplacent/regroupent l'ancien toggle « archivés » isolé.
+
+## Datatable du Répertoire
+
+Composant : `<MalioDataTable>` branché sur `usePaginatedList<Supplier>({ url: '/suppliers' })` (règle frontend obligatoire — pagination Hydra, état 100 % local). Colonnes **conformes à la maquette Figma** (4 colonnes) :
+
+| Colonne | Source | Tri |
+|---|---|---|
+| **Nom** | `supplier.companyName` | ASC par défaut |
+| **Catégories** | `supplier.categories[].name` (embarquées en liste — cohérence M1/ERP-62 ; libellé = `name`, pas `label`) | Non |
+| **Site** | `supplier.sites[].name` (agrégat des adresses via `getSites()` ; `Site` n'a pas de `code`) | Non |
+| **Dernière activité** | `supplier.updatedAt` (format `JJ-MM-AAAA`) — exposé dans `supplier:read` | Oui |
+
+> **Clic sur une ligne** (texte en bleu lien) → écran Consultation.
+> **Filtres** : regroupés dans le panneau du bouton « Filtrer » (cf. section précédente), dont l'inclusion des archivés (désactivée par défaut). **État local** (jamais dans l'URL — règle ABSOLUE n°6).
+> **Pagination** : `<MalioDataTable>` + `usePaginatedList`, options **standard Starseed 10 / 25 / 50 (défaut 10)** — on **n'applique pas** le « Ligne : 20 » de la maquette (décision Matthieu : on reste sur le standard). Tri serveur `companyName ASC` par défaut.
+
+## Écran « Ajouter un fournisseur »
+
+Création par **onglets successifs avec validation incrémentale** : pour passer à l'onglet suivant, il faut avoir validé l'onglet en cours. **Une fois un onglet validé, on passe automatiquement au suivant** ; les champs validés passent en lecture seule + bouton « Valider » désactivé (disabled). Cf. [`spec-back.md § 2.10`](./spec-back.md) (PATCH partiels par groupe de sérialisation).
+
+**Barre d'onglets en création (5 onglets, conforme maquette)** : `Information` · `Contacts` · `Adresses` · `Transport` · `Comptabilité`. L'onglet `Information` est actif par défaut juste après validation du formulaire principal. Les onglets `Statistiques`, `Rapports` et `Échanges` **n'apparaissent PAS dans le flux de création** — ils ne sont présents qu'en Consultation / Modification.
+
+### Formulaire principal (pré-onglets)
+
+1er bloc à remplir. Sans validation, les onglets ne sont pas accessibles. Une fois validé → POST `/api/suppliers`, puis bascule sur l'onglet Information ; les champs passent en readonly.
+
+> **V0.2 — refonte-contact** : le contact principal (Nom / Prénom / Téléphone / Téléphone 2 / Email) a été **retiré** du formulaire principal. Les coordonnées se saisissent dans l'onglet **Contacts** (RG-2.04 / RG-2.13). Le formulaire principal ne contient plus que Entreprise + Catégorie.
+
+| Champ | Type composant | Obligatoire | Règle |
+|---|---|---|---|
+| **Nom du fournisseur (Entreprise)** | `<MalioInputText>` | Oui | RG-2.12 (UPPERCASE serveur) |
+| **Catégorie** | `<MalioSelectCheckbox>` (multi) | Oui | `Category` de **type FOURNISSEUR** via `GET /api/categories?typeCode=FOURNISSEUR` (RG-2.10). Libellé affiché = `category.name`. ⚠️ Le type + le filtre `?typeCode=` sont **à créer** côté back (n'existent pas en prod — cf. spec-back § 2.4). |
+
+**Action** : « Valider » (`<MalioButton>`) → POST `/api/suppliers` ([`spec-back.md § 4.3`](./spec-back.md)). Succès → onglet « Information ».
+
+### Onglet « Information »
+
+Saisir les informations du fournisseur.
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **Description** | `<MalioInputTextArea>` | Conditionnel | RG-2.03 (obligatoire rôle Commerciale) |
+| **Concurrent** | `<MalioInputText>` | Conditionnel | RG-2.03 |
+| **Date création** (entreprise) | `<input type="date">` (exception Malio — `// TODO migrer`) | Conditionnel | RG-2.03 |
+| **Nombre de salariés** | `<MalioInputNumber>` | Conditionnel | RG-2.03 |
+| **CA €** | `<MalioInputAmount>` | Conditionnel | RG-2.03 |
+| **Dirigeant** | `<MalioInputText>` | Conditionnel | RG-2.03 |
+| **Résultat €** | `<MalioInputAmount>` | Conditionnel | RG-2.03 |
+| **Volume Prévisionnel** | `<MalioInputNumber>` | Conditionnel | RG-2.03 (champ spécifique fournisseur) |
+
+> **Disposition maquette** : 3 colonnes — ligne 1 (Description / Concurrent / Date création), ligne 2 (Nombre de salariés / CA / Dirigeant), ligne 3 (Résultat / Volume Prévisionnel).
+
+**Action** : « Valider » → PATCH `/api/suppliers/{id}` (groupe `supplier:write:information`).
+
+### Onglet « Contact »
+
+Saisir un ou plusieurs contacts. **(V0.2 — refonte-contact : plus de pré-remplissage depuis le formulaire principal ; les coordonnées du contact se saisissent directement ici.)** Au moins un bloc Contact valide est requis (RG-2.13).
+
+**Bloc Contact** :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **Nom** | `<MalioInputText>` | Conditionnel | RG-2.04 + RG-2.12 (Capitalize) |
+| **Prénom** | `<MalioInputText>` | Conditionnel | RG-2.04 + RG-2.12 (Capitalize) |
+| **Fonction** | `<MalioInputText>` | Non | — |
+| **Téléphone** (x1, +1 possible) | `<MalioInputText>` | Non | RG-2.12 (format) |
+| **Email** | `<MalioInputText>` type email | Non | RG-2.12 (lowercase) |
+
+**RG-2.04 / RG-2.13** : au moins 1 bloc Contact valide (Nom OU Prénom rempli) pour valider l'onglet — l'onglet Contact ne peut pas être finalisé vide.
+
+**Actions** :
+- « + Nouveau contact » : ajoute un bloc. **Désactivé tant que le bloc précédent n'a pas Prénom OU Nom** (RG-2.04).
+- « Supprimer » (icône) : modal de confirmation, puis suppression du bloc.
+- « Valider » → PATCH `/api/suppliers/{id}/contacts`.
+
+### Onglet « Adresse »
+
+Saisir une ou plusieurs adresses, rattachées à un ou plusieurs sites (86 / 17 / 82) et à des contacts.
+
+**Bloc Adresse** :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **Type d'adresse** | `<MalioRadioButton>` — `Prospect` / `Départ` / `Rendu` | Oui | RG-2.09 (exclusif, enum `PROSPECT`/`DEPART`/`RENDU`) |
+| **Pays** | `<MalioSelect>` (saisie assistée — préremplie « France ») | Oui | — |
+| **Code postal** | `<MalioInputText>` (saisie assistée) | Oui | RG-2.05 — déclenche autocomplete ville (BAN) |
+| **Ville** | `<MalioSelect>` (saisie assistée) | Oui | RG-2.05 — alimentée par api-adresse.data.gouv.fr suivant le CP |
+| **Adresse** | `<MalioInputText>` (saisie assistée) | Oui | RG-2.05 — autocomplete BAN |
+| **Adresse complémentaire** | `<MalioInputText>` | Non | — |
+| **Sélecteur de site** | `<MalioSelectCheckbox>` (86 / 17 / 82) | Oui | RG-2.06 — ≥ 1 site. Les 3 cases = les 3 `Site` fixes ; libellés « 86/17/82 » = **préfixe du `postalCode`** (86100/17400/82400), pas un `Site.code` (qui n'existe pas). La sélection stocke des **IDs de Site** (M2M). |
+| **Catégories** | `<MalioSelectCheckbox>` (multi) | Oui | Catégories de type FOURNISSEUR (RG-2.10), liées aux catégories du fournisseur |
+| **Contact** | `<MalioSelectCheckbox>` (multi) | Non | Liste = blocs Contact saisis dans l'onglet Contact |
+| **Benne(s)** | `<MalioInputNumber>` (stepper −/+ , défaut 0) | Non | Champ spécifique fournisseur |
+| **Prestation de triage** | `<MalioCheckbox>` | Non | Champ spécifique fournisseur (porté par l'adresse — colonne back `triage_provider`) |
+
+> **Disposition maquette par bloc** : ligne 1 = radio (Prospect / Départ / Rendu) + Pays + Code postal ; ligne 2 = Ville + Adresse + Adresse complémentaire ; ligne 3 = sites (86 / 17 / 82) + Catégories + Contact ; ligne 4 = Benne(s) + Prestation de triage. Icône corbeille en haut à droite de chaque bloc pour le supprimer.
+
+**Actions** :
+- « + Nouvelle Adresse » : ajoute un bloc identique au premier.
+- « Supprimer » : modal de confirmation puis suppression.
+- « Valider » → PATCH `/api/suppliers/{id}/addresses`.
+
+### Onglet « Transport »
+
+🚧 **Onglet placeholder minimal au M2.** Conforme à la maquette : la frame est **vide** (aucun champ, aucun bouton de validation, aucune API back). L'onglet reste navigable. Un libellé discret « À venir » est toléré mais non requis (la maquette ne l'affiche pas). Cet onglet **fait partie de la barre de création** (entre Adresses et Comptabilité).
+
+### Onglet « Comptabilité »
+
+⚠ **Accessible aux rôles avec `commercial.suppliers.accounting.view`** (Admin + Compta au M2). Bureau et Commerciale ne voient pas l'onglet. **Compta peut éditer** cet onglet (`accounting.manage`). Compta ne peut pas créer un fournisseur (pas de `manage` global).
+
+**Champs comptables** :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **SIREN** | `<MalioInputText>` (masque 9 chiffres) | Oui | 9 chiffres. **Pas d'unicité** (cf. § 2.6) |
+| **Numéro de compte** | `<MalioInputText>` | Oui | — |
+| **Mode de TVA** | `<MalioSelect>` | Oui | Liste depuis `/api/tva_modes` (référentiel M1) |
+| **N° de TVA** | `<MalioInputText>` | Oui | — |
+| **Délai de règlement** | `<MalioSelect>` | Oui | Liste depuis `/api/payment_delays` |
+| **Type de règlement** | `<MalioSelect>` | Oui | Liste depuis `/api/payment_types` |
+| **Banque** | `<MalioSelect>` | Conditionnel | RG-2.07 — visible et obligatoire **si** Type de règlement = `VIREMENT`. Liste depuis `/api/banks` (SG / CIC / CA). |
+
+**Bloc RIB** (0..n, présence obligatoire conditionnée par RG-2.08) :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **Libellé** | `<MalioInputText>` | Oui (si LCR) | RG-2.08 |
+| **BIC** | `<MalioInputText>` | Oui (si LCR) | RG-2.08 |
+| **IBAN** | `<MalioInputText>` | Oui (si LCR) | RG-2.08 |
+
+**Actions** :
+- « + RIB » : ajoute un bloc.
+- « Supprimer » (icône) : modal de confirmation.
+- « Valider » → PATCH `/api/suppliers/{id}` (groupe `supplier:write:accounting`) + sous-ressource RIBs.
+
+### Onglets « Statistiques » / « Rapports » / « Échanges »
+
+🚧 **Placeholders minimaux au M2 — uniquement en Consultation / Modification** (ils n'apparaissent **pas** dans le flux de création, cf. maquette). Frames vides, pas de validation, pas d'API.
+
+## Écran « Consultation fournisseur »
+
+Tous les champs en **lecture seule**. Layout identique à l'écran Ajouter mais sans bouton « Valider », sans `+` pour ajouter des blocs.
+
+- **Flèche retour** (gauche) → revient au Répertoire.
+- **Bouton « Modifier »** (droite, visible si `commercial.suppliers.manage`) → écran Modification.
+- **Bouton « Archiver »** (droite, visible **uniquement Admin** via `commercial.suppliers.archive`) → modal de confirmation, puis PATCH `/api/suppliers/{id}` `{ "isArchived": true }`.
+
+> Un fournisseur archivé peut être restauré (`isArchived: false`) — bouton « Restaurer » remplace « Archiver » dans la consultation d'un archivé.
+
+### Onglets affichés en consultation
+
+Information / Contacts / Adresses / Transport / Statistiques / Rapports / Échanges / Comptabilité (les 4 derniers métiers en placeholder « À venir », Comptabilité selon permission). L'utilisateur navigue **librement** entre les onglets (pas de séquence forcée en consultation).
+
+## Écran « Modification fournisseur »
+
+Comportement identique à l'écran Ajouter sauf :
+- **Pas de formulaire principal** réaffiché (champs principaux édités via les onglets correspondants).
+- Les champs sont **pré-remplis** avec les valeurs actuelles.
+- **Validation par onglet** : on peut modifier UN onglet sans toucher aux autres (PATCH partiel).
+- Les onglets pour lesquels l'utilisateur n'a **pas** la permission `manage` (ou `accounting.manage`) restent en **lecture seule** (pas de bouton Valider, pas d'icône suppression).
+- Les onglets placeholders « À venir » restent non éditables.
+
+## Composants UI à utiliser (`@malio/layer-ui`)
+
+- **Datatable** : `<MalioDataTable>` (+ `usePaginatedList`)
+- **Input texte** : `<MalioInputText>`
+- **Input numérique** : `<MalioInputNumber>` (Nombre de salariés, Volume prévisionnel, Bennes)
+- **Input montant** : `<MalioInputAmount>` (CA, Résultat)
+- **TextArea** : `<MalioInputTextArea>` (Description)
+- **Select simple** : `<MalioSelect>` (Pays, Ville, référentiels comptables)
+- **Select multi (cases à cocher)** : `<MalioSelectCheckbox>` (Catégorie, Sites, Contacts rattachés)
+- **Radio** : `<MalioRadioButton>` (Type d'adresse Prospect / Départ / Rendu — RG-2.09)
+- **Checkbox** : `<MalioCheckbox>` (Prestataire de triage)
+- **Bouton** : `<MalioButton>`, `<MalioButtonIcon>`
+- **Toasts** : standards via `useApi()`
+
+**Exceptions autorisées** (commenter `// TODO migrer quand Malio couvre`) :
+- `<input type="date">` pour « Date Création » (`MalioDate` non couvert).
+- Modal de confirmation : `<MalioModal>` ou wrapper partagé dans `frontend/shared/` (réutiliser celui du M1 si présent).
+
+## Composables & appels API
+
+- `usePaginatedList<Supplier>({ url: '/suppliers' })` — liste paginée (obligatoire, règle frontend). La liste consomme `categories[]` (libellé = `name`) et `sites[]` (libellé = `name`, pas de `code`) **embarqués** + `updatedAt` (cohérence M1/ERP-62, cf. [`spec-back.md § 2.12 / § 4.0`](./spec-back.md)). Côté back, fetch-joins anti-N+1.
+- `useSupplier(id)` — charge le détail via `GET /api/suppliers/{id}`, qui **embarque** `contacts`, `addresses` (avec `sites` / `categories` / `contacts` imbriqués) et, si permission, `ribs` + scalaires compta. Les écrans Consultation et Modification se peuplent depuis cette seule réponse (RETEX M1 §2 : embed borné, pas de N+1 d'appels). **DoD avant intégration** : vérifier que le JSON réel contient bien ces blocs (cf. [`spec-back.md § 4.0.bis`](./spec-back.md)).
+- `useSupplierForm()` — workflow par onglet (POST principal + PATCH partiels par groupe), miroir de `useClientForm()`.
+- `useAddressAutocomplete()` — **réutilisé du M1** (BAN), pas de réécriture.
+- `usePermissions()` — masque l'onglet Comptabilité et le bouton Archiver.
+- Tous les appels passent par `useApi()` (jamais `$fetch` direct — règle ABSOLUE n°4).
+- Filter `formatPhoneFR()` — **réutilisé du M1** pour l'affichage `XX XX XX XX XX`.
+
+## Règles de formatage et normalisation
+
+Le serveur normalise systématiquement (RG-2.12 — cf. [`spec-back.md`](./spec-back.md)) :
+
+| Champ | Normalisation serveur | Affichage front |
+|---|---|---|
+| Nom fournisseur (`companyName`) | UPPERCASE intégral | UPPERCASE |
+| Nom + Prénom contact | Capitalize | identique |
+| Téléphones (blocs `SupplierContact`) | Chiffres uniquement en BDD | Formaté `XX XX XX XX XX` (filter Vue) |
+| Email | lowercase intégral | identique |
+
+> Le front **ne normalise pas** : il envoie la valeur saisie, le serveur normalise et renvoie la valeur normalisée que l'UI affiche. Cohérent avec `useApi()`.
+
+## API adresse postale
+
+Code postal + Ville + Adresse branchés sur **api-adresse.data.gouv.fr** (BAN) via le composable `useAddressAutocomplete()` **déjà créé au M1** (réutilisé tel quel) :
+- À la saisie du CP (5 chiffres) : `GET https://api-adresse.data.gouv.fr/search/?q={cp}&type=municipality` → alimente le select Ville.
+- À la saisie d'adresse : `?q={addr}&postcode={cp}&type=housenumber` → suggestions.
+- Cas dégradé (timeout / offline) : Ville en `<MalioInputText>` libre + toast d'avertissement.
+
+## Différences notables avec le M1 (clients)
+
+| Zone | M1 clients | M2 fournisseurs |
+|---|---|---|
+| Distributeur / Courtier | Auto-référence Client (RG-1.03) | **Absent** |
+| Prestation de triage | Booléen sur le client (formulaire principal) | **Booléen sur l'adresse** (`triage_provider`) |
+| Type d'adresse | 3 checkboxes Prospect / Livraison / Facturation | **Radio exclusif** Prospect / Départ / Rendu (RG-2.09) |
+| Email facturation sur adresse | Oui (conditionnel) | **Absent** |
+| Champ adresse « Bennes » | — | **Présent** (nombre) |
+| Onglet Information | 7 champs | **8 champs** (ajout « Volume prévisionnel ») |
+| Catégories | type unique `CLIENT` (codes ERP-78) | **nouveau type `FOURNISSEUR`** |
+| Archivage | Admin | **Admin uniquement** (idem) |
+| Onglets « À venir » | frames blanches | **placeholder « À venir »** (minimal) |
+
+## Points résolus côté back
+
+| # | Zone d'ombre | Résolution (cf. `spec-back.md`) |
+|---|---|---|
+| 1 | Catégorie multi-select | M2M `supplier_category`, `Category` de type **FOURNISSEUR** (RG-2.10) |
+| 2 | Type d'adresse Prospect/Départ/Rendu | Enum exclusif `address_type` (RG-2.09) |
+| 3 | Onglet Comptabilité : qui édite ? | Admin + Compta (`accounting.manage`) ; Bureau/Commerciale ne le voient pas |
+| 4 | Workflow par onglet | Sauvegarde incrémentale (POST principal + PATCH partiels) — pas d'état « draft » |
+| 5 | Onglets « À venir » | Placeholder minimal « À venir » (Transport / Stats / Rapports / Échanges) |
+| 6 | Archive vs delete | Flag `is_archived` séparé de `deleted_at` ; archivage Admin seul ; soft delete = HP |
+| 7 | Unicité métier | Nom de fournisseur uniquement (à valider — § 2.6). SIREN/email non uniques |
+| 8 | Référentiels comptables | Réutilisés du M1 (zéro duplication) |
+| 9 | API code postal | BAN via `useAddressAutocomplete()` du M1 |
+| 10 | Format export | XLSX uniquement (CSV = HP) |
+
+---
+
+## 📦 Tickets Lesstime
+
+**TaskGroup Lesstime** : à créer — `M2 — Répertoire fournisseurs` (projet `ERP / Starseed`, projectId=6).
+
+> Détail complet et action manuelle → voir [`spec-back.md § Tickets Lesstime`](./spec-back.md#-tickets-lesstime-à-découper).
@@ -0,0 +1,339 @@
+---
+# === IDENTITÉ ===
+module: M3
+nom: "Répertoire prestataires"
+ecran: repertoire-prestataires
+owner_spec: Matthieu
+backup_spec: Tristan
+version: V0.2
+date_redaction: 2026-06-11
+# Historique :
+#   V0.2 (2026-06-11) — Restitution Markdown du docx « M3-reportoire-prestataires.docx » (04/06/2026).
+#     Alignement refonte-contact (comme M1/M2) : le contact principal inline du formulaire principal
+#     du PDF V0.1 (Nom contact / Prénom contact / Téléphone + / Email) est RETIRÉ — saisie via
+#     l'onglet Contacts uniquement (décision Matthieu, 11/06 : « oublie le contact inline, comme client »).
+#     RG-3.01 / RG-3.02 (contact inline + max 2 tél sur le formulaire principal) supprimées en conséquence.
+#   V0.1 (PDF) — version fonctionnelle plus ancienne, NON retenue (contact inline sur le formulaire principal).
+
+# === LIENS ===
+maquette_figma: "https://www.figma.com/design/jRYgT0T9c03VsEbjGhCwwS/Composants---Design-System?node-id=1132-42090&p=f&m=dev"
+regles_metier: [RG-3.03, RG-3.04, RG-3.05, RG-3.06, RG-3.07, RG-3.08, RG-3.09, RG-3.10, RG-3.11, RG-3.12, RG-3.13, RG-3.14, RG-3.15, RG-3.16, RG-3.17]
+roles: [Admin, Bureau, Compta, Commerciale, Usine]
+lien_spec_back: ./spec-back.md
+
+# === VALIDATION CLIENT ===
+client_validation_1:
+  statut: validee
+  date: 2026-05-22
+  version: V0
+  valide_par: "Matthieu (CP MALIO)"
+client_validation_2:
+  statut: validee
+  date: 2026-06-01
+  version: V0.1
+  valide_par: "Matthieu (CP MALIO)"
+client_validation_3:
+  statut: a_valider
+  date: 2026-06-04
+  version: V0.2
+  resume: "Module 3 — Répertoire prestataires. Pôle Technique (nouvelle section sidebar). Datatable + 3 écrans (Ajouter / Consulter / Modifier). Création par onglets : Contact / Adresse / Comptabilité (Rapports, Échanges = placeholders 'À venir'). PAS d'onglet Information. Sélecteur de site aussi sur le formulaire principal."
+  trace_archivee: "uploads/M3-reportoire-prestataires.docx (V0.2) + M3-reportoire-prestataires-V01.pdf (V0.1, obsolète)"
+
+# === LIEN LESSTIME ===
+lesstime_taskgroup_id: 29   # M3 — Répertoire prestataires (projet STARSEED #6)
+lesstime_project_id: 6
+statut_global: en_dev
+---
+
+# Module 3 — Répertoire prestataires (V0.2 front)
+
+> **Origine** : spec fonctionnelle `M3-reportoire-prestataires.docx` (V0.2 du 04/06/2026 ; historique V0 22/05 → V0.1 01/06). Restitution Markdown pour intégration au workflow MALIO. Le contenu fonctionnel original n'est pas modifié, **sauf** l'alignement refonte-contact (cf. ci-dessous). Toute décision technique (back) vit dans [`spec-back.md`](./spec-back.md). Le M3 réutilise massivement le pattern et les composants posés au [M1 clients](../M1-clients/spec-front.md) et au [M2 fournisseurs](../M2-suppliers/spec-front.md).
+
+> **⚠️ Alignement refonte-contact (décision Matthieu, 11/06/2026)** : le PDF V0.1 portait un **contact principal inline** sur le formulaire principal (Nom du contact / Prénom du contact / Téléphone + bouton + / Email) avec RG-3.01 (Nom OU Prénom) et RG-3.02 (max 2 téléphones). Ce contact inline est **retiré**, exactement comme l'a fait M1/M2 (refonte-contact). Les coordonnées du contact se saisissent **uniquement dans l'onglet Contacts**. **RG-3.01 et RG-3.02 sont donc supprimées du formulaire principal** ; la garantie « au moins un contact nommé » est portée par RG-3.04 + RG-3.12, et le « maximum 2 téléphones » s'applique aux blocs Contact.
+
+> **⚠️ Décision d'architecture (à confirmer) — pôle « Technique »** : le docx place le répertoire prestataires dans un **Module « Technique »**. Confirmé par Matthieu (11/06) : c'est bien un **nouveau pôle Technique**, distinct du Commercial. Côté front cela se traduit par une **nouvelle section sidebar « Technique »** (route `/providers`). Côté back, voir [`spec-back.md § 2.1`](./spec-back.md) (nouveau module `Technique`, entités jumelles du fournisseur, référentiels comptables consommés en relation ORM partagée).
+
+## But
+
+Lister tous les prestataires de l'organisation et accéder rapidement à leurs fiches : consultation, création, modification, archivage. C'est la **porte d'entrée du pôle Technique**.
+
+## Accès
+
+- **Depuis** : menu principal → section **Technique** → entrée « Répertoire prestataires » (route `/providers`).
+- **Rôles autorisés** (tableau « Rôles & permissions » du docx) :
+
+| Rôle | Consultation | Création / Modification | Archivage |
+|---|---|---|---|
+| **Admin** | ✅ Tout | ✅ Tout | ✅ |
+| **Bureau** | ✅ Tout | ✅ Tout sauf onglet Comptabilité | ❌ |
+| **Compta** | ✅ Tout | ✅ Onglet Comptabilité uniquement | ❌ |
+| **Commerciale** | ✅ Tout sauf Comptabilité | ✅ Tout sauf Comptabilité | ❌ |
+| **Usine** | ✅ Son site uniquement | — | ❌ |
+
+> **Notes** :
+> - RBAC transposée sur `technique.providers.*` (cf. [`spec-back.md § 2.9 / § 5`](./spec-back.md)). Compta édite uniquement l'onglet Comptabilité d'un prestataire existant ; Compta ne peut pas **créer** un prestataire. **L'archivage est réservé à Admin**.
+> - **Cloisonnement par site (décision 11/06 — DANS LE PÉRIMÈTRE M3)** : « Tout » vs « son site uniquement » n'est **pas porté par le rôle** mais par l'**utilisateur**. Chaque user a un site courant ; **par défaut il ne voit que les prestataires rattachés à son site**. Les profils qui doivent voir tous les sites (Admin, et par défaut Bureau / Compta / Commerciale) ont la permission `sites.bypass_scope` (Admin l'a automatiquement). **Usine** n'a pas le bypass → cloisonnée à son site. Filtrage **automatique côté back** (cf. [`spec-back.md § 2.13`](./spec-back.md)) — aucun filtre à coder côté front.
+
+## Navigation
+
+Page d'entrée du pôle **Technique** (route `/providers`). Titre : « **Répertoire prestataires** ».
+
+- Affichage principal : un **datatable** listant tous les prestataires **actifs** (les archivés sont masqués par défaut — toggle/filtre dédié).
+- **Clic sur une ligne** → écran **Consultation prestataire** (page dédiée).
+- **Bouton « + Ajouter »** (haut droite) → écran **Ajouter un prestataire**.
+- **Bouton « Filtrer »** (haut droite) → panneau de filtres (cf. ci-dessous).
+- **Bouton « Exporter »** (haut droite) → télécharge un **XLSX** des prestataires **affichés** (cf. filtres actifs). Format dans [`spec-back.md § 4.6`](./spec-back.md).
+
+### Panneau de filtres (bouton « Filtrer »)
+
+Réutilise le pattern M1/M2. Filtres branchés sur les query params de `GET /api/providers` (cf. [`spec-back.md § 4.1`](./spec-back.md)) :
+
+| Filtre | Composant | Query param back |
+|---|---|---|
+| **Recherche** (nom entreprise / contact / email) | `<MalioInputText>` | `?search=` |
+| **Catégorie** | `<MalioSelectCheckbox>` (multi, type PRESTATAIRE) | `?categoryCode=` |
+| **Site** | `<MalioSelectCheckbox>` (86 / 17 / 82) | `?siteId=` |
+| **Inclure les archivés** | `<MalioCheckbox>` | `?includeArchived=true` |
+
+- À l'application des filtres → `setFilters(...)` de `usePaginatedList` (retombe en **page 1**), qui relance `GET /api/providers`.
+- **État 100 % local** (jamais dans l'URL — règle ABSOLUE n°6).
+
+## Datatable du Répertoire
+
+Composant : `<MalioDataTable>` branché sur `usePaginatedList<Provider>({ url: '/providers' })` (règle frontend obligatoire — pagination Hydra, état 100 % local). Colonnes (alignées M2) :
+
+| Colonne | Source | Tri |
+|---|---|---|
+| **Nom** | `provider.companyName` | ASC par défaut |
+| **Catégories** | `provider.categories[].name` (embarquées en liste — cohérence M1/M2 ; libellé = `name`, pas `label`) | Non |
+| **Site** | `provider.sites[].name` (sites du prestataire — cf. note ci-dessous) | Non |
+| **Dernière activité** | `provider.updatedAt` (format `JJ-MM-AAAA`) — exposé dans `provider:read` | Oui |
+
+> **Source de la colonne « Site »** : le M3 porte un sélecteur de site **sur le formulaire principal** (RG-3.03) — donc `provider.sites[]` est une relation **directe** du prestataire (≠ M2 où les sites venaient de l'agrégat des adresses). La colonne liste affiche ces sites directs. Voir [`spec-back.md § 2.12`](./spec-back.md).
+> **Clic sur une ligne** → écran Consultation. **Pagination** : standard Starseed 10 / 25 / 50 (défaut 10). Tri serveur `companyName ASC` par défaut.
+
+## Écran « Ajouter un prestataire »
+
+Création par **onglets successifs avec validation incrémentale** : pour passer à l'onglet suivant, il faut avoir validé l'onglet en cours. **Une fois un onglet validé, on passe automatiquement au suivant** ; les champs validés passent en lecture seule + bouton « Valider » désactivé (disabled). Cf. [`spec-back.md § 2.10`](./spec-back.md) (PATCH partiels par groupe de sérialisation).
+
+**Accès** : bouton « + Ajouter » du Répertoire. **Rôles** : Admin, Bureau.
+
+**Barre d'onglets en création (3 onglets)** : `Contact` · `Adresse` · `Comptabilité`. Les onglets `Rapports` et `Échanges` **n'apparaissent PAS dans le flux de création** — ils ne sont présents qu'en Consultation / Modification (placeholders « À venir »).
+
+> **Différence majeure avec M2 : PAS d'onglet « Information ».** Le M3 n'a aucun champ Description / Concurrent / Date création / Salariés / CA / Dirigeant / Résultat / Volume. Le formulaire principal est minimal (3 champs).
+
+> **Règle « placeholder par défaut » (convention MALIO)** : tout onglet ou écran que la spec ne détaille pas explicitement (ici **Rapports** et **Échanges**) est livré en **placeholder « À venir »** (frame vide, navigable, pas de validation ni d'API), à l'identique des autres modules (M1/M2). Aucun champ inventé hors spec.
+
+### Formulaire principal (pré-onglets)
+
+1er bloc à remplir. Sans validation, les onglets ne sont pas accessibles. Une fois validé → POST `/api/providers`, puis bascule sur l'onglet Contact ; les champs passent en readonly.
+
+| Champ | Type composant | Obligatoire | Règle |
+|---|---|---|---|
+| **Nom du prestataire (Entreprise)** | `<MalioInputText>` | Oui | RG-3.11 (UPPERCASE serveur) ; RG-3.10 (unicité) |
+| **Catégorie** | `<MalioSelectCheckbox>` (multi) | Oui | `Category` de **type PRESTATAIRE** via `GET /api/categories?typeCode=PRESTATAIRE` (RG-3.09). Libellé affiché = `category.name`. |
+| **Sélecteur de site** | `<MalioSelectCheckbox>` (86 / 17 / 82) | Oui | RG-3.03 — ≥ 1 site. Les 3 cases = les 3 `Site` fixes ; libellés « 86/17/82 » = **préfixe du `postalCode`** (86100 / 17400 / 82400), pas un `Site.code` (qui n'existe pas). La sélection stocke des **IDs de Site** (M2M `provider_site`). |
+
+**Action** : « Valider » (`<MalioButton>`) → POST `/api/providers` ([`spec-back.md § 4.3`](./spec-back.md)). Succès → onglet « Contact ».
+
+### Onglet « Contact »
+
+Saisir un ou plusieurs contacts. Au moins un bloc Contact valide est requis (RG-3.12). **(Refonte-contact : pas de pré-remplissage depuis le formulaire principal ; les coordonnées du contact se saisissent directement ici.)**
+
+**Bloc Contact** :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **Nom** | `<MalioInputText>` | Conditionnel | RG-3.04 + RG-3.11 (Capitalize) |
+| **Prénom** | `<MalioInputText>` | Conditionnel | RG-3.04 + RG-3.11 (Capitalize) |
+| **Fonction** | `<MalioInputText>` | Non | — |
+| **Téléphone** (x1, +1 possible, **max 2**) | `<MalioInputText>` | Non | RG-3.11 (format) ; max 2 téléphones par contact |
+| **Email** | `<MalioInputText>` type email | Non | RG-3.11 (lowercase) |
+
+**RG-3.04 / RG-3.12** : un bloc Contact est valide dès qu'au moins 1 champ est rempli ; au moins 1 bloc Contact valide pour finaliser l'onglet — l'onglet Contact ne peut pas être validé vide.
+
+**Actions** :
+- « + Nouveau contact » : ajoute un bloc. **Désactivé tant que le bloc précédent n'a pas au moins 1 champ rempli** (RG-3.04).
+- « Supprimer » (icône) : modal de confirmation, puis suppression du bloc.
+- « Valider » → PATCH `/api/providers/{id}/contacts`.
+
+### Onglet « Adresse »
+
+Saisir une ou plusieurs adresses, rattachées à un ou plusieurs sites (86 / 17 / 82) et à des contacts.
+
+**Bloc Adresse** :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **Sélecteur de site** | `<MalioSelectCheckbox>` (86 / 17 / 82) | Oui | RG-3.05 — ≥ 1 site. Stocke des IDs de Site (M2M `provider_address_site`). |
+| **Adresse** | `<MalioInputText>` (saisie assistée) | Oui | RG-3.06 — autocomplete BAN |
+| **Adresse complémentaire** | `<MalioInputText>` | Non | — |
+| **Code postal** | `<MalioInputText>` (saisie assistée) | Oui | RG-3.06 — déclenche autocomplete ville (BAN) |
+| **Ville** | `<MalioSelect>` (saisie assistée) | Oui | RG-3.06 — alimentée par api-adresse.data.gouv.fr suivant le CP ; si plusieurs villes, choix dans le select |
+| **Pays** | `<MalioSelect>` (préremplie « France ») | Oui | — |
+| **Catégories** | `<MalioSelectCheckbox>` (multi) | Oui | Catégories de type PRESTATAIRE (RG-3.09) |
+| **Contact** | `<MalioSelectCheckbox>` (multi) | Non | Liste = blocs Contact saisis dans l'onglet Contact |
+
+> **Différence avec M2** : l'adresse prestataire n'a **PAS** de Type d'adresse (Prospect/Départ/Rendu), **PAS** de Bennes, **PAS** de Prestation de triage. C'est une adresse « simple » (site + adresse postale + catégories + contacts).
+
+**Actions** :
+- « + Nouvelle Adresse » : ajoute un bloc identique au premier.
+- « Supprimer » (icône) : modal de confirmation puis suppression.
+- « Valider » → PATCH `/api/providers/{id}/addresses`.
+
+### Onglet « Comptabilité »
+
+⚠ **Accessible aux rôles avec `technique.providers.accounting.view`** (Admin + Compta). Bureau et Commerciale ne voient pas l'onglet. **Compta peut éditer** cet onglet (`accounting.manage`). Compta ne peut pas créer un prestataire (pas de `manage` global).
+
+**Champs comptables** :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **SIREN** | `<MalioInputText>` (masque 9 chiffres) | Oui | 9 chiffres. **Pas d'unicité** (cf. [`spec-back.md § 2.6`](./spec-back.md)) |
+| **Numéro de compte** | `<MalioInputText>` | Oui | — |
+| **Mode de TVA** | `<MalioSelect>` | Oui | Liste depuis `/api/tva_modes` (référentiel partagé M1) |
+| **N° de TVA** | `<MalioInputText>` | Oui | — |
+| **Délai de règlement** | `<MalioSelect>` | Oui | Liste depuis `/api/payment_delays` |
+| **Type de règlement** | `<MalioSelect>` | Oui | Liste depuis `/api/payment_types` |
+| **Banque** | `<MalioSelect>` | Conditionnel | RG-3.07 — visible et obligatoire **si** Type de règlement = `VIREMENT`. Liste depuis `/api/banks` (SG / CIC / CA). |
+
+**Bloc RIB** (0..n, présence obligatoire conditionnée par RG-3.08) :
+
+| Champ | Type | Obligatoire | Règle |
+|---|---|---|---|
+| **Libellé** | `<MalioInputText>` | Oui (si LCR) | RG-3.08 |
+| **BIC** | `<MalioInputText>` | Oui (si LCR) | RG-3.08 |
+| **IBAN** | `<MalioInputText>` | Oui (si LCR) | RG-3.08 |
+
+**Actions** :
+- « + RIB » : ajoute un bloc.
+- « Supprimer » (icône) : modal de confirmation.
+- « Valider » → PATCH `/api/providers/{id}` (groupe `provider:write:accounting`) + sous-ressource RIBs.
+
+## Écran « Consultation prestataire »
+
+Tous les champs en **lecture seule**. La page s'ouvre par défaut sur l'onglet **Contacts**. Layout identique à l'écran Ajouter mais sans bouton « Valider », sans `+` pour ajouter des blocs.
+
+- **Flèche retour** (gauche) → revient au Répertoire.
+- **Bouton « Modifier »** (droite, visible si `technique.providers.manage`) → écran Modification.
+- **Bouton « Archiver »** (droite, visible **uniquement Admin** via `technique.providers.archive`) → modal de confirmation, puis PATCH `/api/providers/{id}` `{ "isArchived": true }`.
+
+> Un prestataire archivé peut être restauré (`isArchived: false`) — bouton « Restaurer » remplace « Archiver » dans la consultation d'un archivé.
+
+### Onglets affichés en consultation
+
+`Contacts` · `Adresse` · `Rapports` · `Échanges` · `Comptabilité`. Navigation **libre** entre onglets (pas de séquence forcée). `Rapports` et `Échanges` = placeholders « À venir ». `Comptabilité` selon permission.
+
+- **Onglet Contacts** : un bloc par contact, 5 champs en lecture seule (Nom / Prénom / Fonction / Téléphone / Email).
+- **Onglet Adresse** : un bloc par adresse, en lecture seule (Sélecteur de site / Adresse / Adresse complémentaire / Code postal / Ville / Pays / Catégorie / Contact).
+- **Onglet Comptabilité** : bloc principal (champs comptables) + un bloc par RIB. Le champ **Banque** n'apparaît que si Type de règlement = Virement (RG-3.07).
+
+## Écran « Modification prestataire »
+
+Comportement identique à l'écran Ajouter (mêmes formulaires, mêmes RG-3.03 → RG-3.08) sauf :
+- **Pas de formulaire principal** réaffiché (champs principaux édités via l'onglet correspondant / pré-remplis).
+- Les champs sont **pré-remplis** avec les valeurs actuelles du prestataire.
+- **Validation par onglet** : on peut modifier UN onglet sans toucher aux autres (PATCH partiel).
+- Les onglets pour lesquels l'utilisateur n'a **pas** la permission `manage` (ou `accounting.manage`) restent en **lecture seule** (pas de bouton Valider, pas d'icône suppression).
+- **Accès** : Admin, Bureau (Compta pour l'onglet Comptabilité uniquement).
+
+## Composants UI à utiliser (`@malio/layer-ui`)
+
+- **Datatable** : `<MalioDataTable>` (+ `usePaginatedList`)
+- **Input texte** : `<MalioInputText>`
+- **Select simple** : `<MalioSelect>` (Pays, Ville, référentiels comptables)
+- **Select multi (cases à cocher)** : `<MalioSelectCheckbox>` (Catégorie, Sites, Contacts rattachés)
+- **Bouton** : `<MalioButton>`, `<MalioButtonIcon>`
+- **Toasts** : standards via `useApi()`
+- **Validation par champ** : `useFormErrors` (mapping 422 inline — règle frontend obligatoire)
+
+**Exceptions autorisées** (commenter `// TODO migrer quand Malio couvre`) :
+- Modal de confirmation : `<MalioModal>` ou wrapper partagé dans `frontend/shared/` (réutiliser celui du M1/M2).
+
+## Composables & appels API
+
+- `usePaginatedList<Provider>({ url: '/providers' })` — liste paginée (obligatoire). La liste consomme `categories[]` (libellé = `name`) et `sites[]` (libellé = `name`, pas de `code`) **embarqués** + `updatedAt` (cf. [`spec-back.md § 2.12 / § 4.0`](./spec-back.md)).
+- `useProvider(id)` — charge le détail via `GET /api/providers/{id}`, qui **embarque** `contacts`, `addresses` (avec `sites` / `categories` / `contacts` imbriqués) et, si permission, `ribs` + scalaires compta. Écrans Consultation et Modification peuplés depuis cette seule réponse (RETEX M1 §2 : embed borné, pas de N+1). **DoD avant intégration** : vérifier que le JSON réel contient ces blocs (cf. [`spec-back.md § 4.0.bis`](./spec-back.md)).
+- `useProviderForm()` — workflow par onglet (POST principal + PATCH partiels par groupe), miroir de `useSupplierForm()`.
+- `useAddressAutocomplete()` — **réutilisé du M1/M2** (BAN), pas de réécriture.
+- `usePermissions()` — masque l'onglet Comptabilité et le bouton Archiver.
+- Tous les appels passent par `useApi()` (jamais `$fetch` direct — règle ABSOLUE n°4).
+- Filter `formatPhoneFR()` — **réutilisé** pour l'affichage `XX XX XX XX XX`.
+
+## Règles de formatage et normalisation
+
+Le serveur normalise systématiquement (RG-3.11 — cf. [`spec-back.md`](./spec-back.md)) :
+
+| Champ | Normalisation serveur | Affichage front |
+|---|---|---|
+| Nom prestataire (`companyName`) | UPPERCASE intégral | UPPERCASE |
+| Nom + Prénom contact | Capitalize | identique |
+| Téléphones (blocs `ProviderContact`) | Chiffres uniquement en BDD | Formaté `XX XX XX XX XX` (filter Vue) |
+| Email | lowercase intégral | identique |
+
+> Le front **ne normalise pas** : il envoie la valeur saisie, le serveur normalise et renvoie la valeur normalisée que l'UI affiche.
+
+## API adresse postale
+
+Code postal + Ville + Adresse branchés sur **api-adresse.data.gouv.fr** (BAN) via le composable `useAddressAutocomplete()` **déjà créé au M1/M2** (réutilisé tel quel) :
+- À la saisie du CP (5 chiffres) : `GET https://api-adresse.data.gouv.fr/search/?q={cp}&type=municipality` → alimente le select Ville (RG-3.06 : si plusieurs villes, choix dans le select).
+- À la saisie d'adresse : `?q={addr}&postcode={cp}&type=housenumber` → suggestions.
+- Cas dégradé (timeout / offline) : Ville en `<MalioInputText>` libre + toast d'avertissement.
+
+## Différences notables avec le M2 (fournisseurs)
+
+| Zone | M2 fournisseurs | M3 prestataires |
+|---|---|---|
+| Onglet Information | 8 champs (Description … Volume) | **Absent** (aucun champ Information) |
+| Sélecteur de site sur formulaire principal | Non (sites uniquement via adresses) | **Oui** (RG-3.03 — relation directe `provider.sites`) |
+| Type d'adresse | Radio Prospect / Départ / Rendu (RG-2.09) | **Absent** |
+| Bennes / Prestation de triage (adresse) | Présents | **Absents** |
+| Onglet Transport | Placeholder | **Absent** |
+| Onglet Statistiques | Placeholder | **Absent** |
+| Onglets « À venir » | Transport / Stats / Rapports / Échanges | **Rapports / Échanges** uniquement |
+| Catégories | type `FOURNISSEUR` | **nouveau type `PRESTATAIRE`** |
+| Pôle / module | Commercial | **Technique** (nouvelle section sidebar + module back) |
+| Cloisonnement par site | aucun | **Visibilité par site, pilotée par l'utilisateur** (bypass via `sites.bypass_scope`) — § 2.13 |
+
+## Points résolus côté back
+
+| # | Zone d'ombre | Résolution (cf. `spec-back.md`) |
+|---|---|---|
+| 1 | Catégorie multi-select | M2M `provider_category`, `Category` de type **PRESTATAIRE** (RG-3.09) |
+| 2 | Site sur le formulaire principal | M2M `provider_site` (≥ 1 — RG-3.03), distinct de `provider_address_site` (RG-3.05) |
+| 3 | Onglet Comptabilité : qui édite ? | Admin + Compta (`accounting.manage`) ; Bureau/Commerciale ne le voient pas |
+| 4 | Workflow par onglet | Sauvegarde incrémentale (POST principal + PATCH partiels) — pas d'état « draft » |
+| 5 | Onglets « À venir » | Placeholder minimal « À venir » (Rapports / Échanges) |
+| 6 | Archive vs delete | Flag `is_archived` séparé de `deleted_at` ; archivage Admin seul ; soft delete = HP |
+| 7 | Unicité métier | Nom de prestataire uniquement (à valider — § 2.6). SIREN/email non uniques |
+| 8 | Référentiels comptables | Réutilisés M1/M2 (zéro duplication) ; relation ORM partagée |
+| 9 | API code postal | BAN via `useAddressAutocomplete()` du M1/M2 (RG-3.06) |
+| 10 | Format export | XLSX uniquement (CSV = HP) |
+| 11 | Cloisonnement par site (Usine « son site ») | Filtre back automatique par `currentSite` + bypass `sites.bypass_scope` (§ 2.13 / RG-3.17) |
+
+---
+
+## 📦 Tickets Lesstime
+
+**TaskGroup Lesstime** : **#29 — M3 — Répertoire prestataires** (projet `ERP / Starseed`, projectId=6) — créé le 11/06/2026, 16 tickets `ERP-131` → `ERP-146`, statut « Prêt à dev », assignés à **Tristan**.
+
+| # | Ticket | Réf | Tag |
+|---|---|---|---|
+| 1.1 | Créer module Technique + taxonomie PRESTATAIRE | ERP-131 | Backend |
+| 1.2 | Migrer le schéma BDD M3 (provider + sous-collections) | ERP-132 | Backend |
+| 1.3 | Créer entités + repositories Provider* | ERP-133 | Backend |
+| 1.4 | ProviderProvider + ProviderProcessor + cloisonnement site | ERP-134 | Backend |
+| 1.5 | Sous-ressources Contacts / Adresses / RIBs | ERP-135 | Backend |
+| 1.6 | Valider les RG métier server-side (RG-3.03→3.09) | ERP-136 | Backend |
+| 1.7 | Export XLSX des prestataires | ERP-137 | Backend |
+| 1.8 | RBAC technique.providers.* (3 sources) | ERP-138 | Backend |
+| 1.9 | PHPUnit RG-3.x + capture contrat JSON | ERP-139 | Backend |
+| 1.10 | Page Répertoire (/providers) | ERP-140 | Frontend |
+| 1.11 | Page Ajouter (/providers/new) + formulaire principal | ERP-141 | Frontend |
+| 1.12 | Onglet Contact | ERP-142 | Frontend |
+| 1.13 | Onglet Adresse (autocomplete BAN) | ERP-143 | Frontend |
+| 1.14 | Onglet Comptabilité + RIB | ERP-144 | Frontend |
+| 1.15 | Pages Consultation + Modification | ERP-145 | Frontend |
+| 1.16 | i18n + sidebar Technique + libellés audit | ERP-146 | Frontend |
+
+> Détail back complet → voir [`spec-back.md § Tickets Lesstime`](./spec-back.md#-tickets-lesstime-à-découper).
@@ -0,0 +1,80 @@
+# RETEX M1 (Clients) → à appliquer pour M2 (Fournisseurs)
+
+> But : éviter de reproduire en M2 les erreurs de **contrat de sérialisation** qui ont bloqué M1.
+> ~80 % des frictions M1 venaient du contrat API (sérialisation / groupes / sous-ressources), **pas** du métier.
+> À lire AVANT de rédiger `spec-back.md` et `spec-front.md` du M2, et à garder ouvert pendant la rédaction.
+
+---
+
+## 0. TL;DR (les 3 erreurs à ne jamais refaire)
+
+1. **Affirmer qu'un champ est « embarqué » sans vérifier les 3 maillons de sérialisation.** En M1 : `Category.code` annoncé dans `client:read`, détail annoncé embarquant contacts/adresses/ribs → **faux dans le code**. Résultat : colonnes liste vides, onglets détail impossibles à peupler.
+2. **Livrer des sous-ressources en POST-only** (pas de `GetCollection`, pas d'embed) → le front ne peut pas lister les enfants de l'agrégat.
+3. **Écrire la spec/les tickets sur une intention, pas sur le contrat réel.** Le docblock `Client` décrivait un embed jamais implémenté.
+
+---
+
+## 1. Contrat de sérialisation : les 3 maillons obligatoires
+
+Pour **chaque champ affiché** (liste OU détail), la spec back doit prouver les trois maillons. Si un seul manque → le champ sort en quasi-IRI (`@id`/`@type` seulement) ou pas du tout.
+
+| Maillon | Question | Exemple M1 raté |
+|---|---|---|
+| (a) Groupe sur la **propriété** | `#[Groups([...])]` contient-il un read-group ? | `Supplier::$addresses` sans groupe → jamais sérialisé |
+| (b) Groupe dans le **`normalizationContext` de l'opération** | l'opération (`GetCollection`/`Get`) liste-t-elle ce groupe ? | `GetCollection` en `['client:read','default:read']` |
+| (c) Read-group de l'**entité imbriquée** dans le contexte parent | pour embarquer les champs d'une relation (catégorie, site…), le contexte parent inclut-il `category:read` / `site:read` ? | `Category.code` ∈ `category:read`, absent du contexte client → pas de `code` |
+
+**Règle de rédaction** : dans `spec-back.md`, faire un tableau « champ → groupe propriété → groupe(s) à ajouter au contexte de chaque opération » pour la liste ET le détail. Inclure explicitement les **relations imbriquées** (ex. catégories d'une adresse, sites d'une adresse).
+
+## 2. Collections enfant d'un agrégat : décider embed vs GetCollection, et câbler en ENTIER
+
+Décision à acter dès la spec back pour chaque sous-collection (contacts, adresses, RIB, lignes…) :
+
+- **Embed dans le détail (recommandé pour un agrégat DDD)** : poser `#[Groups(['<root>:item:read'])]` sur la propriété + ajouter au `normalizationContext` du `Get` racine les read-groups des entités enfant **et** de leurs relations imbriquées. 1 requête, cohérent avec un composable `useX(id)`. Réservé aux ensembles **bornés** (ne viole pas la règle n°13 : elle vise les collections exposées, pas un embed borné d'item).
+- **GetCollection sous-ressource** : `/<root>/{id}/children` paginé. À réserver aux collections potentiellement volumineuses. Si choisi, **créer l'opération** (pas seulement POST).
+
+❌ Anti-pattern M1 : sous-ressources avec `POST` + `Get` unitaire seulement → **aucun moyen de lister** (ids non découvrables). Interdit.
+
+## 3. Vérifier le contrat sur l'API RÉELLE avant d'écrire les tickets front
+
+Le blocage M1 (codes/sites/sous-collections) aurait été vu en 5 min. À mettre dans la **definition of done de la spec back** :
+
+> Créer un enregistrement de test, appeler `GET /api/<resource>` (liste) ET `GET /api/<resource>/{id}` (détail), **coller la réponse JSON réelle** dans la spec. Toute donnée affichée par le front doit apparaître dans ce JSON collé.
+
+## 4. La spec décrit le RÉEL, pas l'intention
+
+- Bannir les « devrait être embarqué », « est exposé » non vérifiés. Décrire ce qui existe (ou ce qui sera livré dans le ticket, en le marquant clairement « à livrer »).
+- Si un docblock/commentaire existant contredit le code, le **corriger**, pas le recopier.
+
+## 5. Réutiliser les acquis M1 (ne pas réinventer)
+
+- **Taxonomie ERP-78** : si M2 catégorise les fournisseurs, repartir du modèle **type unique + `code` stable** (slug MAJUSCULE auto-généré, NOT NULL, figé, **lecture seule** `category:read`), filtrage métier via `?categoryCode=`. Réutiliser le contrat partagé `CategoryInterface` (pas d'import inter-module).
+- **Front** : `usePaginatedList` (listes), composants `Malio*`, `useApi()`, `formatPhoneFR`, blocs réutilisables (Contact/Adresse), pattern de blocs dynamiques + modal de confirmation.
+- **Archive** : flag `is_archived` **distinct** de `deleted_at` (soft delete). Restauration → gérer le 409 homonyme.
+- **Normalisation = serveur** (UPPERCASE nom société, Capitalize noms, lowercase email, téléphone en chiffres). Le front envoie la saisie, réaffiche la valeur normalisée renvoyée. À documenter dans la spec.
+- **Gating fin + mode strict PATCH** : PATCH par groupe de sérialisation ; tout champ hors-permission dans le payload = **403 sur l'intégralité** (pas de filtrage silencieux). Spécifier la matrice rôle × onglet.
+
+## 6. Règles ABSOLUES transverses à rappeler dans la spec M2
+
+- **Pagination obligatoire** (règle n°13) sur toute `GetCollection` ; échappatoire `?pagination=false` réservée aux selects de référentiels bornés.
+- **`COMMENT ON COLUMN`** (règle n°12) sur chaque colonne créée/modifiée (sinon `make test` casse). Helper standard pour les colonnes Timestampable/Blamable.
+- **Timestampable + Blamable** sur toute nouvelle entité métier (4 colonnes + trait) ; garde-fou archi.
+- **`#[Auditable]`** sur les entités métier ; **`#[AuditIgnore]`** sur les champs sensibles (équivalents BIC/IBAN/secret).
+- **`declare(strict_types=1);`** partout ; commentaires FR, code EN.
+- **Routes front à plat** (pas de préfixe module), état tableau **jamais** dans l'URL.
+- **3 miroirs RBAC** à toucher ensemble : `config/sidebar.php`, `frontend/tests/e2e/_fixtures/personas.ts`, `SeedE2ECommand.php`.
+- **Communication inter-module** uniquement via `Shared/Domain/Contract/` ou domain events — jamais d'import direct.
+
+## 7. Fixtures & seed dès le départ
+
+M1 a subi un aller-retour (ERP-68) faute de fixtures alignées. Pour M2 : prévoir dès la spec un seed de fournisseurs démo **couvrant tous les cas des règles métier** (relations, catégories codées, archivés, cas comptables) + comptes de rôles démo, pour vérifier le gating et le golden path sans bricolage.
+
+## 8. Mini-checklist de relecture de la spec M2 (avant de la déclarer prête)
+
+- [ ] Chaque champ affiché (liste + détail) a ses 3 maillons de sérialisation documentés (propriété, contexte opération, relations imbriquées).
+- [ ] Chaque sous-collection a une décision **embed vs GetCollection** explicite et **complètement câblée** (pas de POST-only).
+- [ ] Réponses JSON réelles (liste + détail) collées dans la spec back.
+- [ ] Matrice RBAC rôle × écran × onglet + mode strict PATCH spécifiés.
+- [ ] Pagination, COMMENT ON COLUMN, Timestampable/Blamable, Audit, routes à plat : rappelés.
+- [ ] Réutilisations M1 identifiées (taxonomie code, usePaginatedList, blocs, archive, normalisation).
+- [ ] Seed/fixtures démo planifiés.
@@ -0,0 +1,119 @@
+# ERP-101 — Mapping des erreurs de validation par champ (convention forms)
+
+> Statut : design validé — implémentation TDD en cours
+> Branche : `feat/ERP-101-form-field-validation-mapping`
+> Date : 2026-06-03
+
+## Problème
+
+Quand le back renvoie une **422** (violations API Platform), il renvoie **toutes** les
+violations d'un coup (un `propertyPath` + `message` par champ fautif). Aujourd'hui, seul
+le drawer Catégorie (`useCategoryForm`) exploite ce détail pour afficher l'erreur **sous
+le champ concerné** ; il le fait via un `if/else` manuel par champ, non réutilisable.
+
+Le formulaire Client (≈ 20 champs sur 5 submits, dont 3 collections) ne mappe rien : une
+422 multi-champs ⇒ un seul **toast global**. On veut un retour par champ, et surtout
+**une convention unique réutilisée par tous les modules**.
+
+## Décisions
+
+1. **Primitif générique** plutôt que composable par form : `useFormErrors()` partagé.
+2. **Périmètre complet** sur Client : champs scalaires **et** collections (erreur par ligne).
+
+## Architecture — 3 briques
+
+### 1. `mapViolationsToRecord(data)` — `frontend/shared/utils/api.ts`
+
+Util pur, fondation réutilisée partout. Transforme un payload 422 en
+`Record<propertyPath, message>`. S'appuie sur `extractApiViolations` (déjà existant,
+gère les formats `violations` et `hydra:violations`).
+
+```ts
+export function mapViolationsToRecord(data: unknown): Record<string, string> {
+    const out: Record<string, string> = {}
+    for (const v of extractApiViolations(data)) {
+        if (v.propertyPath) out[v.propertyPath] = v.message
+    }
+    return out
+}
+```
+
+### 2. `useFormErrors()` — `frontend/shared/composables/useFormErrors.ts`
+
+API que tous les forms **scalaires** consomment.
+
+```ts
+const { errors, hasErrors, setServerErrors, setError, clearError, clearErrors, handleApiError } = useFormErrors()
+```
+
+- `errors` : `reactive<Record<string, string>>` indexé par `propertyPath`.
+- `setServerErrors(data)` : `mapViolationsToRecord` → remplit `errors`. Retourne `true`
+  si au moins une violation a été mappée.
+- `setError(field, msg)` / `clearError(field)` / `clearErrors()` : manipulation fine.
+- `hasErrors` : `computed` booléen.
+- `handleApiError(e, opts?)` : dispatch standard depuis une erreur ofetch —
+  **422** → `setServerErrors` (mapping inline, pas de toast) ; **autre** → toast
+  générique de fallback (message extrait via `extractApiErrorMessage`).
+
+Côté template, le nom du champ **est** le `propertyPath` :
+
+```vue
+<MalioInputText v-model="main.companyName" :error="errors.companyName" />
+<MalioInputText v-model="accounting.siren" :error="errors.siren" />
+```
+
+> L'unicité SIREN (RG-1.15) remonte en **422 `UniqueEntity` avec `propertyPath: "siren"`**
+> → mappée automatiquement. Pas de cas 409 spécial (contrairement à Catégorie).
+
+### 3. Collections — erreurs par ligne
+
+Chaque ligne (contact / adresse / RIB) est persistée par **son propre appel API**, donc
+le back renvoie un 422 **relatif à la sous-entité** (`propertyPath: "email"`, `"iban"`…).
+
+- Le parent tient, par collection, un tableau d'erreurs **aligné sur l'index de ligne** :
+  `const contactErrors = ref<Record<string, string>[]>([])`.
+- Au submit de la ligne `i` : `catch` → `contactErrors.value[i] = mapViolationsToRecord(data)`.
+- On `clearErrors` la collection au début de chaque passe de submit.
+- Les blocs reçoivent une prop `:errors` (`Record<string, string>`) et bindent
+  `:error="errors?.email"` sur chaque champ Malio.
+
+## Fichiers touchés
+
+| Fichier | Action |
+|---|---|
+| `shared/utils/api.ts` | + `mapViolationsToRecord` |
+| `shared/composables/useFormErrors.ts` | **nouveau** composable |
+| `modules/commercial/pages/clients/new.vue` | scalaires (Main/Info/Compta) + erreurs par ligne |
+| `modules/commercial/pages/clients/[id]/edit.vue` | idem |
+| `modules/commercial/components/ClientContactBlock.vue` | + prop `:errors`, bind `:error` |
+| `modules/commercial/components/ClientAddressBlock.vue` | + prop `:errors`, bind `:error` |
+| RIB (inline dans new/edit) | bind `:error` par ligne |
+
+## Tests (Vitest — règle « pas d'E2E »)
+
+- `mapViolationsToRecord` : formats `violations` / `hydra:violations`, payload vide,
+  `propertyPath` manquant.
+- `useFormErrors` : `setServerErrors` mappe et retourne `true` / `false` sans violation,
+  `clearErrors`, fallback toast sur non-422.
+
+## Convention posée pour tous les forms
+
+À reporter dans `.claude/rules/frontend.md` une fois le pattern stabilisé :
+
+> Tout form qui veut un retour d'erreur par champ : appels API en `{ toast: false }` +
+> `useFormErrors` pour les champs scalaires (422 inline), `mapViolationsToRecord` par
+> ligne pour les collections. `useCategoryForm` migrera sur `useFormErrors`.
+
+## Fait dans la foulée (post-ERP-101 initial)
+
+- **`useCategoryForm` migré sur `useFormErrors`** : `errors` devient le `reactive` du
+  composable (drawer adapté : `form.errors.name` au lieu de `form.errors.value.name`,
+  bloc `_global` retiré → erreur transverse en toast). 28 tests verts.
+- **Convention reportée dans `.claude/rules/frontend.md`** (section « Validation des
+  formulaires — useFormErrors obligatoire »).
+
+## Hors scope ERP-101 (suivi : ticket ERP-107)
+
+- Langue / présence des messages de validation côté back : le `message` affiché est celui
+  renvoyé par le serveur. Audit des contraintes Symfony (présence d'un `message` FR,
+  contraintes manquantes, violations sans `propertyPath`) tracké dans **ERP-107**.
@@ -2,7 +2,9 @@
    Valeurs en dur issues de la maquette Figma (design Starseed) :
      - sidebar depliee : 232px (w-[232px], repli laisse par defaut 72px)
      - marge horizontale du contenu sur desktop : 170px (xl:px-[170px])
-      - bande blanche sticky sous la navbar : 47px (h-[47px])
+    La marge haute du contenu (44px) vit desormais DANS l'entete (PageHeader,
+    pt-11) et non sur le <main> : sinon, l'entete etant sticky, ce padding
+    laissait un trou blanc entre le SiteSelector et l'entete.
    A faire evoluer uniquement avec une mise a jour de maquette.
 -->
 <template>
@@ -25,9 +27,6 @@
                <SiteSelector v-if="showSiteSelector"/>
                <main
                    class="flex flex-1 flex-col overflow-y-auto overflow-x-hidden bg-white px-4 pb-10 sm:px-6 lg:px-12 xl:px-11">
-                    <div
-                        aria-hidden="true"
-                        class="pointer-events-none sticky top-0 z-30 h-11 flex-shrink-0 bg-white"/>
                    <slot/>
                </main>
            </div>
@@ -10,7 +10,11 @@
        "confirm": "Confirmer",
        "yes": "Oui",
        "no": "Non",
-        "actions": "Actions"
+        "actions": "Actions",
+        "comingSoon": {
+            "title": "En cours de dev",
+            "subtitle": "Cette fonctionnalité arrive bientôt."
+        }
    },
    "sidebar": {
        "administration": {
@@ -44,7 +48,319 @@
    },
    "commercial": {
        "title": "Commercial",
-        "welcome": "Module Commercial"
+        "welcome": "Module Commercial",
+        "suppliers": {
+            "title": "Répertoire fournisseurs",
+            "add": "Ajouter",
+            "export": "Exporter",
+            "empty": "Aucun fournisseur pour l'instant.",
+            "column": {
+                "companyName": "Nom",
+                "categories": "Catégories",
+                "sites": "Site",
+                "lastActivity": "Dernière activité"
+            },
+            "filters": {
+                "title": "Filtres",
+                "search": "Recherche",
+                "categories": "Catégories",
+                "sites": "Sites",
+                "status": "Statut",
+                "includeArchived": "Inclure les archivés",
+                "apply": "Voir les résultats",
+                "reset": "Réinitialiser"
+            },
+            "toast": {
+                "error": "Une erreur est survenue. Réessayez.",
+                "exportError": "L'export du répertoire fournisseurs a échoué. Réessayez.",
+                "createSuccess": "Fournisseur créé avec succès",
+                "updateSuccess": "Fournisseur mis à jour avec succès",
+                "addComplete": "Fournisseur ajouté",
+                "archiveSuccess": "Fournisseur archivé avec succès",
+                "restoreSuccess": "Fournisseur restauré avec succès",
+                "restoreConflict": "Impossible de restaurer : un fournisseur actif portant ce nom existe déjà."
+            },
+            "comingSoon": "À venir",
+            "tab": {
+                "information": "Information",
+                "contacts": "Contacts",
+                "addresses": "Adresses",
+                "transport": "Transport",
+                "accounting": "Comptabilité",
+                "statistics": "Statistiques",
+                "reports": "Rapports",
+                "exchanges": "Échanges"
+            },
+            "action": {
+                "edit": "Modifier",
+                "archive": "Archiver",
+                "restore": "Restaurer"
+            },
+            "consultation": {
+                "title": "Consultation fournisseur",
+                "back": "Retour au répertoire",
+                "loading": "Chargement du fournisseur…",
+                "notFound": "Fournisseur introuvable.",
+                "confirmArchive": {
+                    "title": "Archiver le fournisseur",
+                    "message": "Ce fournisseur n'apparaîtra plus dans le répertoire actif. Confirmer l'archivage ?"
+                },
+                "confirmRestore": {
+                    "title": "Restaurer le fournisseur",
+                    "message": "Ce fournisseur réapparaîtra dans le répertoire actif. Confirmer la restauration ?"
+                }
+            },
+            "edit": {
+                "title": "Modifier le fournisseur",
+                "back": "Retour au répertoire",
+                "loading": "Chargement du fournisseur…",
+                "notFound": "Fournisseur introuvable.",
+                "save": "Valider"
+            },
+            "form": {
+                "title": "Ajouter un fournisseur",
+                "back": "Précédent",
+                "submit": "Valider",
+                "duplicateCompany": "Un fournisseur portant ce nom de société existe déjà.",
+                "main": {
+                    "companyName": "Nom du fournisseur (Entreprise)",
+                    "categories": "Catégorie"
+                },
+                "information": {
+                    "description": "Description",
+                    "competitors": "Concurrent",
+                    "foundedAt": "Date de création",
+                    "employeesCount": "Nombre de salariés",
+                    "revenueAmount": "CA",
+                    "profitAmount": "Résultat",
+                    "directorName": "Dirigeant",
+                    "volumeForecast": "Volume prévisionnel"
+                },
+                "contact": {
+                    "title": "Contact {n}",
+                    "lastName": "Nom",
+                    "firstName": "Prénom",
+                    "jobTitle": "Fonction",
+                    "email": "Email",
+                    "phonePrimary": "Téléphone",
+                    "phoneSecondary": "Téléphone (2)",
+                    "addPhone": "Ajouter un numéro",
+                    "remove": "Supprimer le contact",
+                    "add": "Nouveau contact"
+                },
+                "address": {
+                    "title": "Adresse {n}",
+                    "addressType": "Type d'adresse",
+                    "addressTypeProspect": "Prospect",
+                    "addressTypeDepart": "Départ",
+                    "addressTypeRendu": "Rendu",
+                    "categories": "Catégorie",
+                    "country": "Pays",
+                    "postalCode": "Code postal",
+                    "city": "Ville",
+                    "street": "Adresse",
+                    "streetNotFound": "Adresse introuvable ? Saisissez-la directement.",
+                    "streetComplement": "Adresse complémentaire",
+                    "sites": "Sites",
+                    "contacts": "Contact(s) rattaché(s)",
+                    "bennes": "Benne(s)",
+                    "triageProvider": "Prestation de triage",
+                    "remove": "Supprimer l'adresse",
+                    "add": "Nouvelle adresse",
+                    "degraded": "Service d'adresse indisponible : saisie de la ville et de l'adresse en mode libre."
+                },
+                "accounting": {
+                    "siren": "SIREN",
+                    "accountNumber": "Numéro de compte",
+                    "tvaMode": "Mode de TVA",
+                    "nTva": "N° de TVA",
+                    "paymentDelay": "Délai de règlement",
+                    "paymentType": "Type de règlement",
+                    "bank": "Banque",
+                    "ribLabel": "Libellé",
+                    "ribBic": "BIC",
+                    "ribIban": "IBAN",
+                    "addRib": "Ajouter un RIB",
+                    "removeRib": "Supprimer le RIB"
+                },
+                "confirmDelete": {
+                    "title": "Confirmer la suppression",
+                    "contact": "Supprimer ce contact ?",
+                    "address": "Supprimer cette adresse ?",
+                    "rib": "Supprimer ce RIB ?",
+                    "cancel": "Annuler",
+                    "confirm": "Confirmer"
+                }
+            }
+        },
+        "clients": {
+            "title": "Répertoire clients",
+            "add": "Ajouter",
+            "export": "Exporter",
+            "empty": "Aucun client pour l'instant.",
+            "column": {
+                "companyName": "Nom",
+                "categories": "Catégories",
+                "sites": "Site",
+                "lastActivity": "Dernière activité"
+            },
+            "filters": {
+                "title": "Filtres",
+                "search": "Recherche",
+                "categories": "Catégories",
+                "sites": "Sites",
+                "status": "Statut",
+                "archivedOnly": "Voir les archivés",
+                "apply": "Voir les résultats",
+                "reset": "Réinitialiser"
+            },
+            "tab": {
+                "information": "Information",
+                "contact": "Contact",
+                "address": "Adresse",
+                "transport": "Transport",
+                "accounting": "Comptabilité",
+                "statistics": "Statistiques",
+                "reports": "Rapports",
+                "exchanges": "Échanges"
+            },
+            "action": {
+                "edit": "Modifier",
+                "archive": "Archiver",
+                "restore": "Restaurer"
+            },
+            "toast": {
+                "createSuccess": "Client créé avec succès",
+                "updateSuccess": "Client mis à jour avec succès",
+                "addComplete": "Client ajouté",
+                "archiveSuccess": "Client archivé avec succès",
+                "restoreSuccess": "Client restauré avec succès",
+                "error": "Une erreur est survenue. Réessayez.",
+                "exportError": "L'export du répertoire clients a échoué. Réessayez.",
+                "restoreConflict": "Impossible de restaurer : un client actif portant ce nom existe déjà."
+            },
+            "consultation": {
+                "title": "Consultation client",
+                "back": "Retour au répertoire",
+                "loading": "Chargement du client…",
+                "notFound": "Client introuvable.",
+                "confirmArchive": {
+                    "title": "Archiver le client",
+                    "message": "Ce client n'apparaîtra plus dans le répertoire actif. Confirmer l'archivage ?"
+                },
+                "confirmRestore": {
+                    "title": "Restaurer le client",
+                    "message": "Ce client réapparaîtra dans le répertoire actif. Confirmer la restauration ?"
+                }
+            },
+            "edit": {
+                "title": "Modifier le client",
+                "back": "Retour au répertoire",
+                "loading": "Chargement du client…",
+                "notFound": "Client introuvable.",
+                "save": "Valider"
+            },
+            "validation": {
+                "informationRequiredForCommercial": "Les informations de l'entreprise sont obligatoires pour le rôle Commerciale.",
+                "contactRequired": "Au moins un contact (nom ou prénom) est obligatoire.",
+                "siteRequired": "Au moins un site Starseed doit être rattaché à l'adresse.",
+                "billingEmailRequired": "L'email de facturation est obligatoire pour une adresse de facturation.",
+                "bankRequiredForTransfer": "La banque est obligatoire pour un règlement par virement.",
+                "ribRequiredForLcr": "Au moins un RIB complet est obligatoire pour un règlement par LCR.",
+                "phoneFormat": "Format de téléphone invalide (attendu : XX XX XX XX XX).",
+                "emailFormat": "Format d'email invalide.",
+                "addressCategoryForbidden": "Une catégorie « Distributeur » ou « Courtier » ne peut pas qualifier une adresse."
+            },
+            "form": {
+                "title": "Ajouter un client",
+                "back": "Précédent",
+                "submit": "Valider",
+                "duplicateCompany": "Un client portant ce nom de société existe déjà.",
+                "main": {
+                    "companyName": "Nom du client (Entreprise)",
+                    "categories": "Catégorie",
+                    "relation": "Distributeur / Courtier",
+                    "relationNone": "Aucun",
+                    "relationDistributor": "Dépend du distributeur",
+                    "relationBroker": "Dépend du courtier",
+                    "distributorName": "Nom du distributeur",
+                    "brokerName": "Nom du courtier",
+                    "triageService": "Prestation de triage"
+                },
+                "information": {
+                    "description": "Description",
+                    "competitors": "Concurrent",
+                    "foundedAt": "Date de création",
+                    "employeesCount": "Nombre de salariés",
+                    "revenueAmount": "CA",
+                    "profitAmount": "Résultat",
+                    "directorName": "Dirigeant"
+                },
+                "contact": {
+                    "title": "Contact {n}",
+                    "lastName": "Nom",
+                    "firstName": "Prénom",
+                    "jobTitle": "Fonction",
+                    "email": "Email",
+                    "phonePrimary": "Téléphone",
+                    "phoneSecondary": "Téléphone (2)",
+                    "addPhone": "Ajouter un numéro",
+                    "remove": "Supprimer le contact",
+                    "add": "Nouveau contact"
+                },
+                "address": {
+                    "title": "Adresse {n}",
+                    "prospect": "Prospect",
+                    "delivery": "Adresse de livraison",
+                    "billing": "Facturation",
+                    "addressType": "Type d'adresse",
+                    "addressTypeProspect": "Prospect",
+                    "addressTypeDelivery": "Livraison",
+                    "addressTypeBilling": "Facturation",
+                    "addressTypeDeliveryBilling": "Adresse + Facturation",
+                    "addressTypeBroker": "Adresse Courtier",
+                    "addressTypeDistributor": "Adresse Distributeur",
+                    "categories": "Catégorie",
+                    "country": "Pays",
+                    "postalCode": "Code postal",
+                    "city": "Ville",
+                    "street": "Adresse",
+                    "streetNotFound": "Adresse introuvable ? Saisissez-la directement.",
+                    "streetComplement": "Adresse complémentaire",
+                    "sites": "Sites",
+                    "contacts": "Contact(s) rattaché(s)",
+                    "billingEmail": "Email de facturation",
+                    "billingEmailSecondary": "Email de facturation secondaire",
+                    "addBillingEmail": "Ajouter un email",
+                    "remove": "Supprimer l'adresse",
+                    "add": "Nouvelle adresse",
+                    "degraded": "Service d'adresse indisponible : saisie de la ville et de l'adresse en mode libre."
+                },
+                "accounting": {
+                    "siren": "SIREN",
+                    "accountNumber": "Numéro de compte",
+                    "tvaMode": "Mode de TVA",
+                    "nTva": "N° de TVA",
+                    "paymentDelay": "Délai de règlement",
+                    "paymentType": "Type de règlement",
+                    "bank": "Banque",
+                    "ribTitle": "RIB {n}",
+                    "ribLabel": "Libellé",
+                    "ribBic": "BIC",
+                    "ribIban": "IBAN",
+                    "addRib": "Ajouter un RIB",
+                    "removeRib": "Supprimer le RIB"
+                },
+                "confirmDelete": {
+                    "title": "Confirmer la suppression",
+                    "contact": "Supprimer ce contact ?",
+                    "address": "Supprimer cette adresse ?",
+                    "rib": "Supprimer ce RIB ?",
+                    "cancel": "Annuler",
+                    "confirm": "Confirmer"
+                }
+            }
+        }
    },
    "auth": {
        "login": "Connexion",
@@ -67,6 +383,12 @@
        },
        "sites": {
            "notAuthorized": "Vous n'êtes pas autorisé à sélectionner ce site."
+        },
+        "title": "Erreur",
+        "generic": "Une erreur est survenue.",
+        "unknown": "Erreur inconnue.",
+        "validation": {
+            "invalidDate": "Date invalide"
        }
    },
    "sites": {
@@ -82,10 +404,23 @@
            "delete": "Suppression"
        },
        "entity": {
-            "core_user":       "Utilisateur",
-            "core_role":       "Rôle",
-            "core_permission": "Permission",
-            "sites_site":      "Site"
+            "core_user":              "Utilisateur",
+            "core_role":              "Rôle",
+            "core_permission":        "Permission",
+            "sites_site":             "Site",
+            "catalog_category":       "Catégorie",
+            "commercial_client":      "Client",
+            "commercial_clientaddress": "Adresse client",
+            "commercial_clientcontact": "Contact client",
+            "commercial_clientrib":   "RIB client",
+            "commercial_supplier":    "Fournisseur",
+            "commercial_supplieraddress": "Adresse fournisseur",
+            "commercial_suppliercontact": "Contact fournisseur",
+            "commercial_supplierrib": "RIB fournisseur",
+            "technique_provider":     "Prestataire",
+            "technique_provideraddress": "Adresse prestataire",
+            "technique_providercontact": "Contact prestataire",
+            "technique_providerrib":  "RIB prestataire"
        },
        "empty": "Aucune activité enregistrée",
        "no_results": "Aucun résultat pour ces filtres",
@@ -119,7 +454,8 @@
    "success": {
        "auth": {
            "logout": "Deconnexion reussie"
-        }
+        },
+        "title": "Succès"
    },
    "admin": {
        "roles": {
@@ -237,21 +573,26 @@
            "newCategory": "Ajouter",
            "editCategory": "Modifier la catégorie",
            "createCategory": "Créer une catégorie",
-            "viewCategory": "Détail de la catégorie",
            "noCategories": "Aucune catégorie pour l'instant.",
            "table": {
                "name": "Nom",
-                "type": "Type"
+                "types": "Types"
+            },
+            "filters": {
+                "title": "Filtres",
+                "search": "Recherche",
+                "types": "Types de catégorie",
+                "apply": "Voir les résultats",
+                "reset": "Réinitialiser"
            },
            "form": {
                "name": "Nom",
-                "type": "Type de catégorie",
-                "typePlaceholder": "Sélectionner un type"
+                "types": "Types de catégorie"
            },
            "validation": {
                "nameRequired": "Le nom est obligatoire.",
                "nameLength": "Le nom doit faire entre 2 et 120 caractères.",
-                "typeRequired": "Le type de catégorie est obligatoire."
+                "typesRequired": "Sélectionnez au moins un type de catégorie."
            },
            "delete": {
                "title": "Supprimer la catégorie",
@@ -261,7 +602,7 @@
                "created": "Catégorie créée avec succès",
                "updated": "Catégorie mise à jour avec succès",
                "deleted": "Catégorie supprimée avec succès",
-                "duplicate": "Une catégorie nommée « {name} » existe déjà pour ce type.",
+                "duplicate": "Une catégorie nommée « {name} » existe déjà.",
                "typesLoadFailed": "Impossible de charger les types de catégorie. Réessayez."
            }
        }
@@ -20,27 +20,22 @@
                :label="t('admin.categories.form.name')"
                input-class="w-full"
                :max-length="120"
-                :error="form.errors.value.name"
+                :error="form.errors.name"
                required
            />

-            <!-- Type (RG-1.05 obligatoire). MalioSelect porte la valeur en
-                 number (categoryType id) ; conversion en IRI au moment du save
-                 par le composable useCategoryForm. -->
-            <MalioSelect
-                v-model="form.categoryTypeId.value"
+            <!-- Types (RG-1.05 : au moins un obligatoire). MalioSelectCheckbox
+                 porte un tableau d'ids (categoryType id) ; conversion en tableau
+                 d'IRI au moment du save par le composable useCategoryForm. -->
+            <MalioSelectCheckbox
+                v-model="form.categoryTypeIds.value"
                :options="typeOptions"
-                :label="t('admin.categories.form.type')"
-                :empty-option-label="t('admin.categories.form.typePlaceholder')"
-                :error="form.errors.value.categoryType"
+                :label="t('admin.categories.form.types')"
+                :error="form.errors.categoryTypes"
+                :display-tag="true"
                :disabled="loadingTypes"
+                required
            />
-
-            <!-- Erreur transverse (typiquement reseau / 5xx) — separe des
-                 erreurs de validation par champ. -->
-            <p v-if="form.errors.value._global" class="text-sm text-red-600">
-                {{ form.errors.value._global }}
-            </p>
        </form>

        <!-- Footer fixe : depuis 1.7.1 le slot #footer est un frere du body
@@ -95,28 +90,17 @@ const emit = defineEmits<{
    delete: []
 }>()

-/**
- * Mode du drawer (dérivé du composable `useCategoryForm`) :
- *  - 'create' : pas de category prop, formulaire vide, POST au save.
- *  - 'view'   : category prop set, formulaire pre-rempli, save MASQUE
- *               jusqu'a ce que l'utilisateur modifie un champ.
- *  - 'edit'   : category prop set et formulaire « dirty » (au moins un
- *               champ different de l'original), PATCH au save.
- */
-type DrawerMode = 'create' | 'view' | 'edit'
-
+// Mode du drawer : creation (pas de category prop, POST au save) ou
+// modification d'une categorie existante (PATCH au save). Pas de distinction
+// view/edit : comme les autres drawers, le titre et le bouton Enregistrer sont
+// stables quel que soit l'etat « dirty » du formulaire.
 const isCreateMode = computed(() => props.category === null)

-const mode = computed<DrawerMode>(() => {
-    if (isCreateMode.value) return 'create'
-    return form.isDirty.value ? 'edit' : 'view'
-})
-
-const headerLabel = computed(() => {
-    if (mode.value === 'create') return t('admin.categories.createCategory')
-    if (mode.value === 'edit') return t('admin.categories.editCategory')
-    return t('admin.categories.viewCategory')
-})
+const headerLabel = computed(() =>
+    isCreateMode.value
+        ? t('admin.categories.createCategory')
+        : t('admin.categories.editCategory'),
+)

 // Le bouton Supprimer n'est visible qu'en consultation/edition d'une categorie
 // existante et seulement pour les users ayant la permission manage. En mode
@@ -125,10 +109,12 @@ const canShowDelete = computed(
    () => !isCreateMode.value && can('catalog.categories.manage'),
 )

-// Save : visible en creation, ou en edition (apres modification d'un champ).
-// Masque en view tant que rien n'a change.
+// Save : visible en creation, et en consultation/edition d'une categorie
+// existante (l'utilisateur doit pouvoir enregistrer sans qu'un champ ait
+// d'abord ete modifie). Le bouton reste neanmoins protege par son `disabled`
+// pendant la soumission / le chargement des types.
 const canShowSave = computed(
-    () => mode.value === 'create' || mode.value === 'edit',
+    () => isCreateMode.value || can('catalog.categories.manage'),
 )

 const typeOptions = computed(() =>
@@ -158,18 +144,18 @@ watch(
 )

 /**
- * Sauvegarde : delegue au composable (POST en mode create, PATCH en mode
- * edit). Le toast succes + mapping erreur 409/422 est gere par le composable.
- * En cas de succes, on ferme le drawer et on previent le parent pour qu'il
- * refresh la liste.
+ * Sauvegarde : delegue au composable (POST en creation, PATCH en modification).
+ * Le toast succes + mapping erreur 409/422 est gere par le composable. Le PATCH
+ * envoie le payload complet, donc le bouton Enregistrer sauvegarde a tout
+ * moment (meme sans modification). En cas de succes, on ferme le drawer et on
+ * previent le parent pour qu'il refresh la liste.
 */
 async function handleSave(): Promise<void> {
-    let result: Category | null = null
-    if (mode.value === 'create') {
-        result = await form.submitCreate()
-    } else if (mode.value === 'edit' && props.category) {
-        result = await form.submitUpdate(props.category.id)
-    }
+    const result = isCreateMode.value
+        ? await form.submitCreate()
+        : props.category
+            ? await form.submitUpdate(props.category.id)
+            : null
    if (result) {
        emit('saved')
        emit('update:modelValue', false)
@@ -1,5 +1,6 @@
 import { describe, it, expect, vi, beforeEach } from 'vitest'
 import type { Category, CategoryType } from '~/modules/catalog/types/category'
+import { useFormErrors } from '~/shared/composables/useFormErrors'
 import { useCategoryForm } from '../useCategoryForm'

 // Stubs des auto-imports Nuxt consommes par le composable.
@@ -21,6 +22,9 @@ vi.stubGlobal('useToast', () => ({
    success: mockToastSuccess,
    error: mockToastError,
 }))
+// useFormErrors est un auto-import Nuxt : on expose l'implementation reelle
+// (elle consomme useToast, deja stubbe ci-dessus) pour tester l'integration.
+vi.stubGlobal('useFormErrors', useFormErrors)
 // useI18n.t : on renvoie la cle telle quelle (pratique pour asserter dessus).
 // Quand le composable passe des params (ex: doublon), on les serialise pour
 // pouvoir verifier que l'interpolation a bien recu le bon nom.
@@ -35,7 +39,7 @@ const TYPE_ACHAT: CategoryType = { id: 2, code: 'ACHAT', label: 'Achat' }
 const CAT: Category = {
    id: 42,
    name: 'Vis',
-    categoryType: TYPE_VENTE,
+    categoryTypes: [TYPE_VENTE],
    deletedAt: null,
    createdAt: '2026-01-01T10:00:00+00:00',
    updatedAt: '2026-01-01T10:00:00+00:00',
@@ -54,25 +58,25 @@ describe('useCategoryForm', () => {
    })

    describe('loadFrom', () => {
-        it('pre-remplit le formulaire depuis une categorie existante', () => {
+        it('pre-remplit le formulaire depuis une categorie existante (multi-types)', () => {
            const form = useCategoryForm()

-            form.loadFrom(CAT)
+            form.loadFrom({ ...CAT, categoryTypes: [TYPE_VENTE, TYPE_ACHAT] })

            expect(form.name.value).toBe('Vis')
-            expect(form.categoryTypeId.value).toBe(1)
-            expect(form.errors.value).toEqual({ name: '', categoryType: '', _global: '' })
+            expect(form.categoryTypeIds.value).toEqual([1, 2])
+            expect(form.errors).toEqual({})
        })

        it('vide le formulaire en mode creation (null)', () => {
            const form = useCategoryForm()
            form.name.value = 'old'
-            form.categoryTypeId.value = 99
+            form.categoryTypeIds.value = [99]

            form.loadFrom(null)

            expect(form.name.value).toBe('')
-            expect(form.categoryTypeId.value).toBeNull()
+            expect(form.categoryTypeIds.value).toEqual([])
        })

        it('reinitialise le snapshot initial → isDirty=false juste apres', () => {
@@ -94,100 +98,122 @@ describe('useCategoryForm', () => {

            expect(form.isDirty.value).toBe(true)
        })
+
+        it('passe a true quand on ajoute un type (selection multi)', () => {
+            const form = useCategoryForm()
+            form.loadFrom(CAT)
+            expect(form.isDirty.value).toBe(false)
+
+            form.categoryTypeIds.value = [1, 2]
+
+            expect(form.isDirty.value).toBe(true)
+        })
+
+        it('reste false si la selection est identique dans un autre ordre', () => {
+            const form = useCategoryForm()
+            form.loadFrom({ ...CAT, categoryTypes: [TYPE_VENTE, TYPE_ACHAT] })
+
+            form.categoryTypeIds.value = [2, 1]
+
+            expect(form.isDirty.value).toBe(false)
+        })
    })

    describe('validate', () => {
        it('signale une erreur si name est vide (RG-1.02)', () => {
            const form = useCategoryForm()
            form.name.value = ''
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const ok = form.validate()

            expect(ok).toBe(false)
-            expect(form.errors.value.name).toBe('admin.categories.validation.nameRequired')
+            expect(form.errors.name).toBe('admin.categories.validation.nameRequired')
        })

        it('signale erreur si name est whitespace-only (trim → vide)', () => {
            const form = useCategoryForm()
            form.name.value = '   '
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const ok = form.validate()

            expect(ok).toBe(false)
-            expect(form.errors.value.name).toBe('admin.categories.validation.nameRequired')
+            expect(form.errors.name).toBe('admin.categories.validation.nameRequired')
        })

        it('signale erreur si name fait 1 caractere (< 2, RG-1.04)', () => {
            const form = useCategoryForm()
            form.name.value = 'A'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const ok = form.validate()

            expect(ok).toBe(false)
-            expect(form.errors.value.name).toBe('admin.categories.validation.nameLength')
+            expect(form.errors.name).toBe('admin.categories.validation.nameLength')
        })

        it('signale erreur si name fait 121 caracteres (> 120, RG-1.04)', () => {
            const form = useCategoryForm()
            form.name.value = 'A'.repeat(121)
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const ok = form.validate()

            expect(ok).toBe(false)
-            expect(form.errors.value.name).toBe('admin.categories.validation.nameLength')
+            expect(form.errors.name).toBe('admin.categories.validation.nameLength')
        })

-        it('signale erreur si categoryTypeId est null (RG-1.05)', () => {
+        it('signale erreur si aucun type selectionne (RG-1.05)', () => {
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = null
+            form.categoryTypeIds.value = []

            const ok = form.validate()

            expect(ok).toBe(false)
-            expect(form.errors.value.categoryType).toBe('admin.categories.validation.typeRequired')
+            expect(form.errors.categoryTypes).toBe('admin.categories.validation.typesRequired')
        })

-        it('passe quand name et categoryType sont valides', () => {
+        it('passe quand name et au moins un type sont valides', () => {
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1, 2]

            const ok = form.validate()

            expect(ok).toBe(true)
-            expect(form.errors.value).toEqual({ name: '', categoryType: '', _global: '' })
+            expect(form.errors).toEqual({})
        })

        it('reinitialise les erreurs avant chaque validation', () => {
            const form = useCategoryForm()
-            // Erreur prealable.
-            form.errors.value._global = 'erreur ancienne'
-            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            // Erreur prealable : une validation en echec peuple errors.name.
+            form.name.value = ''
+            form.categoryTypeIds.value = [1]
+            form.validate()
+            expect(form.errors.name).toBeTruthy()

+            // Seconde validation avec des valeurs valides : errors repart vide.
+            form.name.value = 'Vis'
            form.validate()

-            expect(form.errors.value._global).toBe('')
+            expect(form.errors).toEqual({})
        })
    })

    describe('submitCreate', () => {
-        it('appelle POST /categories avec body { name trimme, categoryType en IRI }', async () => {
+        it('appelle POST /categories avec body { name trimme, categoryTypes en IRI[] }', async () => {
            mockPost.mockResolvedValueOnce(CAT)
            const form = useCategoryForm()
            form.name.value = '  Vis  '
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1, 2]

            const result = await form.submitCreate()

            expect(mockPost).toHaveBeenCalledWith(
                '/categories',
-                { name: 'Vis', categoryType: '/api/category_types/1' },
+                { name: 'Vis', categoryTypes: ['/api/category_types/1', '/api/category_types/2'] },
                { toast: false },
            )
            expect(result).toEqual(CAT)
@@ -196,7 +222,7 @@ describe('useCategoryForm', () => {
        it('ne declenche aucun appel API si la validation client echoue', async () => {
            const form = useCategoryForm()
            form.name.value = ''
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const result = await form.submitCreate()

@@ -208,12 +234,12 @@ describe('useCategoryForm', () => {
            mockPost.mockResolvedValueOnce(CAT)
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            await form.submitCreate()

            expect(mockToastSuccess).toHaveBeenCalledWith({
-                title: 'Succès',
+                title: 'success.title',
                message: 'admin.categories.toast.created',
            })
        })
@@ -224,15 +250,15 @@ describe('useCategoryForm', () => {
            })
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const result = await form.submitCreate()

            expect(result).toBeNull()
            // La cle est interpolee avec le nom soumis : on retrouve "Vis" dans
            // les params i18n (stub serialise les params).
-            expect(form.errors.value.name).toContain('admin.categories.toast.duplicate')
-            expect(form.errors.value.name).toContain('"name":"Vis"')
+            expect(form.errors.name).toContain('admin.categories.toast.duplicate')
+            expect(form.errors.name).toContain('"name":"Vis"')
            expect(mockToastError).toHaveBeenCalledTimes(1)
            const toastArg = mockToastError.mock.calls[0]?.[0] as { message: string }
            expect(toastArg.message).toContain('Vis')
@@ -251,50 +277,51 @@ describe('useCategoryForm', () => {
            })
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const result = await form.submitCreate()

            expect(result).toBeNull()
-            expect(form.errors.value.name).toBe('name should not be blank.')
+            expect(form.errors.name).toBe('name should not be blank.')
            // Pas de toast quand on a mappe les violations : l erreur est
            // affichee inline sous le champ concerne.
            expect(mockToastError).not.toHaveBeenCalled()
        })

-        it('mappe aussi hydra:violations (negociation de format alternative)', async () => {
+        it('mappe une violation sur categoryTypes (hydra:violations alternative)', async () => {
            mockPost.mockRejectedValueOnce({
                response: {
                    status: 422,
                    _data: {
                        'hydra:violations': [
-                            { propertyPath: 'categoryType', message: 'Type invalide.' },
+                            { propertyPath: 'categoryTypes', message: 'Sélectionnez au moins un type de catégorie.' },
                        ],
                    },
                },
            })
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            await form.submitCreate()

-            expect(form.errors.value.categoryType).toBe('Type invalide.')
+            expect(form.errors.categoryTypes).toBe('Sélectionnez au moins un type de catégorie.')
        })

-        it('fallback en erreur globale + toast si le status n est ni 409 ni 422', async () => {
+        it('fallback en toast generique si le status n est ni 409 ni 422', async () => {
            mockPost.mockRejectedValueOnce({
                response: { status: 500, _data: { 'hydra:description': 'Boom server' } },
            })
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            await form.submitCreate()

-            expect(form.errors.value._global).toBe('Boom server')
+            // Pas d'erreur inline par champ : l'erreur transverse part en toast.
+            expect(form.errors).toEqual({})
            expect(mockToastError).toHaveBeenCalledWith({
-                title: 'Erreur',
+                title: 'errors.title',
                message: 'Boom server',
            })
        })
@@ -306,7 +333,7 @@ describe('useCategoryForm', () => {
            )
            const form = useCategoryForm()
            form.name.value = 'Vis'
-            form.categoryTypeId.value = 1
+            form.categoryTypeIds.value = [1]

            const pending = form.submitCreate()
            expect(form.submitting.value).toBe(true)
@@ -319,45 +346,52 @@ describe('useCategoryForm', () => {
    })

    describe('submitUpdate', () => {
-        it('appelle PATCH /categories/{id} uniquement avec les champs modifies', async () => {
+        it('appelle PATCH /categories/{id} avec le payload complet (name + categoryTypes)', async () => {
            mockPatch.mockResolvedValueOnce({ ...CAT, name: 'Vis V2' })
            const form = useCategoryForm()
            form.loadFrom(CAT)
-            form.name.value = 'Vis V2' // categoryTypeId inchange
+            form.name.value = 'Vis V2' // types inchanges
+
+            await form.submitUpdate(42)
+
+            // Payload complet : meme si seul le name change, on renvoie aussi
+            // les categoryTypes (PATCH full payload, cf. drawers simples).
+            expect(mockPatch).toHaveBeenCalledWith(
+                '/categories/42',
+                { name: 'Vis V2', categoryTypes: ['/api/category_types/1'] },
+                { toast: false },
+            )
+        })
+
+        it('envoie categoryTypes en IRI[] quand on ajoute un type', async () => {
+            mockPatch.mockResolvedValueOnce({ ...CAT, categoryTypes: [TYPE_VENTE, TYPE_ACHAT] })
+            const form = useCategoryForm()
+            form.loadFrom(CAT)
+            form.categoryTypeIds.value = [1, 2]

            await form.submitUpdate(42)

            expect(mockPatch).toHaveBeenCalledWith(
                '/categories/42',
-                { name: 'Vis V2' }, // pas de categoryType car non modifie
+                { name: CAT.name, categoryTypes: ['/api/category_types/1', '/api/category_types/2'] },
                { toast: false },
            )
        })

-        it('envoie categoryType en IRI quand seul le type a change', async () => {
-            mockPatch.mockResolvedValueOnce({ ...CAT, categoryType: TYPE_ACHAT })
+        it('envoie un PATCH complet meme sans modification (save a tout moment)', async () => {
+            mockPatch.mockResolvedValueOnce(CAT)
            const form = useCategoryForm()
            form.loadFrom(CAT)
-            form.categoryTypeId.value = 2
-
-            await form.submitUpdate(42)
-
-            expect(mockPatch).toHaveBeenCalledWith(
-                '/categories/42',
-                { categoryType: '/api/category_types/2' },
-                { toast: false },
-            )
-        })
-
-        it('court-circuite l appel API si aucun champ n a change', async () => {
-            const form = useCategoryForm()
-            form.loadFrom(CAT)
-            // Aucune modification — isDirty=false, patch payload vide.
+            // Aucune modification : le PATCH part quand meme avec le payload complet.

            const result = await form.submitUpdate(42)

-            expect(mockPatch).not.toHaveBeenCalled()
-            expect(result).toBeNull()
+            expect(mockPatch).toHaveBeenCalledWith(
+                '/categories/42',
+                { name: CAT.name, categoryTypes: ['/api/category_types/1'] },
+                { toast: false },
+            )
+            expect(result).toEqual(CAT)
            expect(form.submitting.value).toBe(false)
        })

@@ -370,7 +404,7 @@ describe('useCategoryForm', () => {
            await form.submitUpdate(42)

            expect(mockToastSuccess).toHaveBeenCalledWith({
-                title: 'Succès',
+                title: 'success.title',
                message: 'admin.categories.toast.updated',
            })
        })
@@ -386,8 +420,8 @@ describe('useCategoryForm', () => {
            const result = await form.submitUpdate(42)

            expect(result).toBeNull()
-            expect(form.errors.value.name).toContain('admin.categories.toast.duplicate')
-            expect(form.errors.value.name).toContain('"name":"Doublon"')
+            expect(form.errors.name).toContain('admin.categories.toast.duplicate')
+            expect(form.errors.name).toContain('"name":"Doublon"')
        })
    })

@@ -401,7 +435,7 @@ describe('useCategoryForm', () => {
            expect(mockDelete).toHaveBeenCalledWith('/categories/42', {}, { toast: false })
            expect(ok).toBe(true)
            expect(mockToastSuccess).toHaveBeenCalledWith({
-                title: 'Succès',
+                title: 'success.title',
                message: 'admin.categories.toast.deleted',
            })
        })
@@ -415,7 +449,6 @@ describe('useCategoryForm', () => {
            const ok = await form.submitDelete(42)

            expect(ok).toBe(false)
-            expect(form.errors.value._global).toBe('down')
            expect(mockToastError).toHaveBeenCalled()
        })
    })
@@ -424,15 +457,15 @@ describe('useCategoryForm', () => {
        it('vide le formulaire et les erreurs', () => {
            const form = useCategoryForm()
            form.loadFrom(CAT)
-            form.name.value = 'edit'
-            form.errors.value._global = 'erreur'
+            form.name.value = ''
+            form.validate() // peuple errors.name
            form.submitting.value = true

            form.reset()

            expect(form.name.value).toBe('')
-            expect(form.categoryTypeId.value).toBeNull()
-            expect(form.errors.value).toEqual({ name: '', categoryType: '', _global: '' })
+            expect(form.categoryTypeIds.value).toEqual([])
+            expect(form.errors).toEqual({})
            expect(form.submitting.value).toBe(false)
        })
    })
@@ -12,14 +12,14 @@
 * elles servent juste a eviter l'aller-retour reseau evitable. Le serveur
 * revalide toujours (defense en profondeur).
 *
- * Mapping erreurs API :
- *   - 409 (RG-1.07 doublon) → toast + erreur sur le champ `name`
- *   - 422 (violations API Platform) → mapping sur les champs concernes
- *   - autre → erreur globale `_global` + toast generique
+ * Erreurs par champ : delegue a `useFormErrors` (convention ERP-101). Les
+ * violations 422 sont mappees par `propertyPath` (`name`, `categoryTypes`) ;
+ * l'erreur globale (status != 422 exploitable) part en toast. Le 409 (doublon
+ * de nom GLOBAL, RG-1.07) reste un cas metier specifique : erreur inline sur
+ * `name` + toast.
 */
 import { computed, ref } from 'vue'
 import type { Category } from '~/modules/catalog/types/category'
-import { extractApiErrorMessage, extractApiViolations } from '~/shared/utils/api'

 /**
 * Erreur HTTP capturee par ofetch. On expose juste les champs utilises ici
@@ -37,33 +37,35 @@ export function useCategoryForm() {
    const { t } = useI18n()
    const toast = useToast()

+    // Etat d'erreurs par champ (indexe par propertyPath) + dispatch API 422.
+    const formErrors = useFormErrors()
+
    // State local du formulaire — pas singleton, chaque appel a useCategoryForm
    // cree son propre state (cohérent avec le pattern « un drawer = un form »).
    const name = ref('')
-    const categoryTypeId = ref<number | null>(null)
+    const categoryTypeIds = ref<number[]>([])

    // Snapshot des valeurs initiales : sert a calculer `isDirty` pour le
    // pattern view → edit du drawer (le bouton Enregistrer reste masque tant
    // que rien n'a change en mode consultation).
    const initialName = ref('')
-    const initialCategoryTypeId = ref<number | null>(null)
-
-    const errors = ref<{
-        name: string
-        categoryType: string
-        _global: string
-    }>({
-        name: '',
-        categoryType: '',
-        _global: '',
-    })
+    const initialCategoryTypeIds = ref<number[]>([])

    const submitting = ref(false)

+    // Compare deux listes d'ids sans tenir compte de l'ordre (la selection
+    // multi-types n'est pas ordonnee).
+    function sameIds(a: number[], b: number[]): boolean {
+        if (a.length !== b.length) return false
+        const sortedA = [...a].sort((x, y) => x - y)
+        const sortedB = [...b].sort((x, y) => x - y)
+        return sortedA.every((v, i) => v === sortedB[i])
+    }
+
    const isDirty = computed(
        () =>
            name.value !== initialName.value
-            || categoryTypeId.value !== initialCategoryTypeId.value,
+            || !sameIds(categoryTypeIds.value, initialCategoryTypeIds.value),
    )

    /**
@@ -72,17 +74,18 @@ export function useCategoryForm() {
     * erreurs et le snapshot initial pour repartir d'un etat propre.
     */
    function loadFrom(category: Category | null): void {
-        errors.value = { name: '', categoryType: '', _global: '' }
+        formErrors.clearErrors()
        if (category) {
+            const ids = category.categoryTypes.map(t => t.id)
            name.value = category.name
-            categoryTypeId.value = category.categoryType.id
+            categoryTypeIds.value = [...ids]
            initialName.value = category.name
-            initialCategoryTypeId.value = category.categoryType.id
+            initialCategoryTypeIds.value = [...ids]
        } else {
            name.value = ''
-            categoryTypeId.value = null
+            categoryTypeIds.value = []
            initialName.value = ''
-            initialCategoryTypeId.value = null
+            initialCategoryTypeIds.value = []
        }
    }

@@ -92,107 +95,56 @@ export function useCategoryForm() {
     * mais le serveur retrim de toute facon — pas de risque de divergence.
     */
    function validate(): boolean {
-        errors.value = { name: '', categoryType: '', _global: '' }
+        formErrors.clearErrors()
        const trimmedName = name.value.trim()

        // RG-1.02 — name obligatoire (vide / whitespace-only).
        if (trimmedName === '') {
-            errors.value.name = t('admin.categories.validation.nameRequired')
+            formErrors.setError('name', t('admin.categories.validation.nameRequired'))
        } else if (trimmedName.length < 2 || trimmedName.length > 120) {
            // RG-1.04 — longueur 2-120 apres trim.
-            errors.value.name = t('admin.categories.validation.nameLength')
+            formErrors.setError('name', t('admin.categories.validation.nameLength'))
        }

-        // RG-1.05 — categoryType obligatoire.
-        if (categoryTypeId.value === null) {
-            errors.value.categoryType = t('admin.categories.validation.typeRequired')
+        // RG-1.05 — au moins un type obligatoire.
+        if (categoryTypeIds.value.length === 0) {
+            formErrors.setError('categoryTypes', t('admin.categories.validation.typesRequired'))
        }

-        return errors.value.name === '' && errors.value.categoryType === ''
+        return !formErrors.errors.name && !formErrors.errors.categoryTypes
    }

    /**
-     * Construit le payload POST a partir du state. Le `categoryType` est
-     * envoye en IRI Hydra (`/api/category_types/{id}`) — convention API
-     * Platform pour referencer une ressource liee. Retourne un object literal
-     * compatible avec `AnyObject` de `useApi()` (un type nomme strict comme
-     * `CategoryCreateInput` ne serait pas assignable a `Record<string, unknown>`
-     * en TS strict).
+     * Construit le payload POST a partir du state. Les `categoryTypes` sont
+     * envoyes en tableau d'IRI Hydra (`/api/category_types/{id}`) — convention
+     * API Platform pour referencer une collection de ressources liees.
     */
    function buildCreatePayload(): Record<string, unknown> {
        return {
            name: name.value.trim(),
-            categoryType: `/api/category_types/${categoryTypeId.value}`,
+            categoryTypes: categoryTypeIds.value.map(id => `/api/category_types/${id}`),
        }
    }

    /**
-     * Mappe les violations 422 d'API Platform sur les champs du formulaire.
-     * Renvoie true des qu'au moins une violation a ete posee — false sinon
-     * (payload sans violations exploitables, ou tous les `propertyPath` hors
-     * du mapping connu). L'extraction Hydra (`violations` / `hydra:violations`)
-     * est centralisee dans `shared/utils/api.ts` pour rester reutilisable
-     * sur les futurs drawers de formulaire.
-     */
-    function mapServerViolations(data: unknown): boolean {
-        const violations = extractApiViolations(data)
-        if (violations.length === 0) return false
-        let mapped = false
-        for (const v of violations) {
-            if (v.propertyPath === 'name') {
-                errors.value.name = v.message
-                mapped = true
-            } else if (v.propertyPath === 'categoryType') {
-                errors.value.categoryType = v.message
-                mapped = true
-            }
-        }
-        return mapped
-    }
-
-    /**
-     * Traite une erreur API : mappe selon le status, declenche les toasts
-     * appropries. Centralise la logique entre create/update.
-     *
-     * - 409 (RG-1.07) : doublon — toast + errors.name avec libelle qui inclut
-     *   le nom soumis.
-     * - 422 : tentative de mapping fin via les violations API Platform — si au
-     *   moins une violation est mappee, pas de toast (erreur affichee inline
-     *   sous le champ concerne).
-     * - autre : message global + toast generique. Le toast natif d'useApi
-     *   est desactive (`toast: false`) pour permettre ce mapping fin ; il faut
-     *   donc en re-emettre un manuellement ici, sinon une 500 reste silencieuse.
-     *
-     * Retourne true si l'erreur a ete reconnue et traitee (409/422 mappes),
-     * false sinon (fallback generique).
+     * Traite une erreur API : 409 (doublon RG-1.07) → erreur inline sur `name`
+     * + toast ; sinon delegue a `useFormErrors.handleApiError` (422 mappe inline
+     * par champ sans toast, autre → toast de fallback). Retourne true si traitee
+     * inline (409/422 mappe), false si fallback toast.
     */
    function handleApiError(e: unknown, attemptedName: string): boolean {
        const status = (e as ApiFetchError)?.response?.status
-        const data = (e as ApiFetchError)?.response?._data

        if (status === 409) {
            const duplicateMessage = t('admin.categories.toast.duplicate', {
                name: attemptedName,
            })
-            errors.value.name = duplicateMessage
-            toast.error({
-                title: 'Erreur',
-                message: duplicateMessage,
-            })
+            formErrors.setError('name', duplicateMessage)
+            toast.error({ title: t('errors.title'), message: duplicateMessage })
            return true
        }

-        if (status === 422 && mapServerViolations(data)) {
-            return true
-        }
-
-        const extracted = extractApiErrorMessage(data)
-        errors.value._global = extracted || 'Une erreur est survenue.'
-        toast.error({
-            title: 'Erreur',
-            message: errors.value._global,
-        })
-        return false
+        return formErrors.handleApiError(e, { fallbackMessage: t('errors.generic') })
    }

    /**
@@ -203,14 +155,13 @@ export function useCategoryForm() {
    async function submitCreate(): Promise<Category | null> {
        if (!validate()) return null
        submitting.value = true
-        errors.value._global = ''
        const payload = buildCreatePayload()
        try {
            const created = await api.post<Category>('/categories', payload, {
                toast: false,
            })
            toast.success({
-                title: 'Succès',
+                title: t('success.title'),
                message: t('admin.categories.toast.created'),
            })
            return created
@@ -223,34 +174,25 @@ export function useCategoryForm() {
    }

    /**
-     * PATCH /api/categories/{id}. Envoie uniquement les champs modifies pour
-     * coller a la semantique merge-patch (Content-Type pose par useApi).
-     * Renvoie la categorie mise a jour, ou `null` en cas d'echec.
+     * PATCH /api/categories/{id}. Envoie le payload complet (name +
+     * categoryTypes), comme les autres drawers du projet : le bouton
+     * Enregistrer sauvegarde a tout moment, meme sans modification, et renvoie
+     * toujours un retour (toast succes + refresh). Renvoie la categorie mise a
+     * jour, ou `null` en cas d'echec.
     */
    async function submitUpdate(id: number): Promise<Category | null> {
        if (!validate()) return null
        submitting.value = true
-        errors.value._global = ''
-        const payload: Record<string, unknown> = {}
-        if (name.value !== initialName.value) {
-            payload.name = name.value.trim()
-        }
-        if (categoryTypeId.value !== initialCategoryTypeId.value) {
-            payload.categoryType = `/api/category_types/${categoryTypeId.value}`
-        }
-        // Garde-fou : un PATCH sans changement ne sert a rien. Theoriquement
-        // empeche par le drawer (bouton Enregistrer masque si !isDirty) mais
-        // on protege le composable contre un appel direct mal utilise.
-        if (Object.keys(payload).length === 0) {
-            submitting.value = false
-            return null
+        const payload: Record<string, unknown> = {
+            name: name.value.trim(),
+            categoryTypes: categoryTypeIds.value.map(id => `/api/category_types/${id}`),
        }
        try {
            const updated = await api.patch<Category>(`/categories/${id}`, payload, {
                toast: false,
            })
            toast.success({
-                title: 'Succès',
+                title: t('success.title'),
                message: t('admin.categories.toast.updated'),
            })
            return updated
@@ -272,11 +214,11 @@ export function useCategoryForm() {
     */
    async function submitDelete(id: number): Promise<boolean> {
        submitting.value = true
-        errors.value._global = ''
+        formErrors.clearErrors()
        try {
            await api.delete(`/categories/${id}`, {}, { toast: false })
            toast.success({
-                title: 'Succès',
+                title: t('success.title'),
                message: t('admin.categories.toast.deleted'),
            })
            return true
@@ -294,18 +236,18 @@ export function useCategoryForm() {
     */
    function reset(): void {
        name.value = ''
-        categoryTypeId.value = null
+        categoryTypeIds.value = []
        initialName.value = ''
-        initialCategoryTypeId.value = null
-        errors.value = { name: '', categoryType: '', _global: '' }
+        initialCategoryTypeIds.value = []
+        formErrors.clearErrors()
        submitting.value = false
    }

    return {
        // State
        name,
-        categoryTypeId,
-        errors,
+        categoryTypeIds,
+        errors: formErrors.errors,
        submitting,
        isDirty,
        // Methods
@@ -3,13 +3,28 @@
        <PageHeader>
            {{ t('admin.categories.title') }}
            <template #actions>
-                <MalioButton
-                    v-if="canManage"
-                    :label="t('admin.categories.newCategory')"
-                    icon-name="mdi:add-bold"
-                    icon-position="left"
-                    @click="openCreateDrawer"
-                />
+                <!-- gap-8 = 32px d'espacement entre Filtres et Ajouter (meme
+                     design que le Repertoire Clients). -->
+                <div class="flex items-center gap-8">
+                    <!-- Bouton Filtres a GAUCHE d'Ajouter. Le compteur reflete
+                         les filtres actifs. -->
+                    <MalioButton
+                        variant="tertiary"
+                        :label="filterButtonLabel"
+                        icon-name="mdi:tune"
+                        icon-position="left"
+                        icon-size="24"
+                        @click="openFilters"
+                    />
+                    <MalioButton
+                        v-if="canManage"
+                        variant="secondary"
+                        :label="t('admin.categories.newCategory')"
+                        icon-name="mdi:add-bold"
+                        icon-position="left"
+                        @click="openCreateDrawer"
+                    />
+                </div>
            </template>
        </PageHeader>

@@ -47,6 +62,60 @@
            :loading="deleting"
            @confirm="handleDelete"
        />
+
+        <!-- Drawer de filtres : etat BROUILLON, applique uniquement au clic sur
+             « Appliquer ». Meme pattern que le Repertoire Clients. Etat 100 %
+             local, jamais dans l'URL (regle ABSOLUE n°6). -->
+        <MalioDrawer
+            v-model="filterDrawerOpen"
+            drawer-class="max-w-[450px]"
+            body-class="p-0"
+            footer-class="justify-between border-t border-black p-6"
+        >
+            <template #header>
+                <h2 class="text-[24px] font-bold uppercase">{{ t('admin.categories.filters.title') }}</h2>
+            </template>
+
+            <MalioAccordion>
+                <!-- Recherche par nom (param `name`, partiel insensible a la casse). -->
+                <MalioAccordionItem :title="t('admin.categories.filters.search')" value="search">
+                    <MalioInputText
+                        v-model="draftSearch"
+                        icon-name="mdi:magnify"
+                    />
+                </MalioAccordionItem>
+
+                <!-- Type(s) : cases a cocher (multi). Une categorie remonte si
+                     elle porte AU MOINS UN des types coches (OR cote back). -->
+                <MalioAccordionItem :title="t('admin.categories.filters.types')" value="types">
+                    <div class="flex flex-col">
+                        <MalioCheckbox
+                            v-for="opt in typeFilterOptions"
+                            :id="`filter-type-${opt.value}`"
+                            :key="opt.value"
+                            :label="opt.label"
+                            :model-value="draftTypeIds.includes(opt.value)"
+                            @update:model-value="(val: boolean) => toggleType(opt.value, val)"
+                        />
+                    </div>
+                </MalioAccordionItem>
+            </MalioAccordion>
+
+            <template #footer>
+                <MalioButton
+                    variant="tertiary"
+                    :label="t('admin.categories.filters.reset')"
+                    button-class="w-m-btn-action"
+                    @click="resetFilters"
+                />
+                <MalioButton
+                    variant="primary"
+                    :label="t('admin.categories.filters.apply')"
+                    button-class="w-[170px]"
+                    @click="applyFilters"
+                />
+            </template>
+        </MalioDrawer>
    </div>
 </template>

@@ -55,7 +124,7 @@ import type { Category } from '~/modules/catalog/types/category'

 const { t } = useI18n()
 const { can } = usePermissions()
-const { fetchTypes } = useCategoriesAdmin()
+const { types, fetchTypes } = useCategoriesAdmin()
 const { submitDelete } = useCategoryForm()

 useHead({ title: t('admin.categories.title') })
@@ -74,6 +143,7 @@ const {
    fetch: fetchCategories,
    goToPage,
    setItemsPerPage,
+    setFilters,
 } = usePaginatedList<Category>({ url: '/categories' })

 const drawerOpen = ref(false)
@@ -82,21 +152,96 @@ const deleteModalOpen = ref(false)
 const categoryToDelete = ref<Category | null>(null)
 const deleting = ref(false)

-// Colonnes du datatable. Le type est embarque cote API (cf. spec-back § 3.4) —
-// on aplatit en label lisible pour l'affichage.
+// Colonnes du datatable. Les types sont embarques cote API (ManyToMany) — on
+// aplatit en libelles joints par une virgule pour l'affichage.
 const columns = [
    { key: 'name', label: t('admin.categories.table.name') },
-    { key: 'typeLabel', label: t('admin.categories.table.type') },
+    { key: 'typesLabel', label: t('admin.categories.table.types') },
 ]

 const categoryItems = computed(() =>
    categories.value.map(cat => ({
        id: cat.id,
        name: cat.name,
-        typeLabel: cat.categoryType?.label ?? '',
+        typesLabel: (cat.categoryTypes ?? []).map(ct => ct.label).join(', '),
    })),
 )

+// ── Filtres (drawer) ────────────────────────────────────────────────────────
+// Deux niveaux d'etat (pattern Repertoire Clients) :
+//  - APPLIED : pilote la liste + le compteur du bouton. Modifie uniquement au
+//    clic « Appliquer » / « Réinitialiser ».
+//  - DRAFT : edite librement dans le drawer ; recopie vers applied a la validation.
+const filterDrawerOpen = ref(false)
+
+const draftSearch = ref('')
+const draftTypeIds = ref<number[]>([])
+
+const appliedSearch = ref('')
+const appliedTypeIds = ref<number[]>([])
+
+// Options du filtre Type(s), derivees du referentiel deja charge (fetchTypes).
+const typeFilterOptions = computed(() =>
+    types.value.map(ct => ({ value: ct.id, label: ct.label })),
+)
+
+const activeFilterCount = computed(() => {
+    let count = 0
+    if (appliedSearch.value.trim() !== '') count++
+    if (appliedTypeIds.value.length > 0) count++
+    return count
+})
+
+const filterButtonLabel = computed(() => {
+    const base = t('admin.categories.filters.title')
+    return activeFilterCount.value > 0 ? `${base} (${activeFilterCount.value})` : base
+})
+
+// Recopie l'etat applique vers le brouillon puis ouvre le drawer.
+function openFilters(): void {
+    draftSearch.value = appliedSearch.value
+    draftTypeIds.value = [...appliedTypeIds.value]
+    filterDrawerOpen.value = true
+}
+
+function toggleType(id: number, selected: boolean): void {
+    draftTypeIds.value = selected
+        ? [...draftTypeIds.value, id]
+        : draftTypeIds.value.filter(t => t !== id)
+}
+
+/**
+ * Construit le payload de filtres serveur a partir de l'etat applique. Cle
+ * `typeId[]` pour que PHP la parse en tableau (OR cote back). Filtres vides omis.
+ */
+function buildFilterPayload(): Record<string, string | string[]> {
+    const payload: Record<string, string | string[]> = {}
+    if (appliedSearch.value.trim() !== '') payload.name = appliedSearch.value.trim()
+    if (appliedTypeIds.value.length > 0) payload['typeId[]'] = appliedTypeIds.value.map(String)
+    return payload
+}
+
+// « Appliquer » : recopie brouillon → applied, pousse les filtres (retombe en
+// page 1 via usePaginatedList) et ferme le drawer.
+function applyFilters(): void {
+    appliedSearch.value = draftSearch.value.trim()
+    appliedTypeIds.value = [...draftTypeIds.value]
+
+    setFilters(buildFilterPayload(), { replace: true })
+    filterDrawerOpen.value = false
+}
+
+// « Réinitialiser » : vide brouillon ET applied, recharge la liste complete.
+// Le drawer reste ouvert pour montrer le formulaire vide.
+function resetFilters(): void {
+    draftSearch.value = ''
+    draftTypeIds.value = []
+    appliedSearch.value = ''
+    appliedTypeIds.value = []
+
+    setFilters({}, { replace: true })
+}
+
 function getCategoryById(id: number): Category | undefined {
    return categories.value.find(c => c.id === id)
 }
@@ -4,15 +4,15 @@
 * Contrats API consommes :
 *   - GET /api/categories          → HydraCollection<Category>
 *   - GET /api/categories/{id}     → Category
- *   - POST /api/categories         → body { name, categoryType: IRI }
- *   - PATCH /api/categories/{id}   → body partiel { name?, categoryType?: IRI }
+ *   - POST /api/categories         → body { name, categoryTypes: IRI[] }
+ *   - PATCH /api/categories/{id}   → body partiel { name?, categoryTypes?: IRI[] }
 *   - DELETE /api/categories/{id}  → 204 (soft delete via CategoryProcessor)
 *   - GET /api/category_types      → HydraCollection<CategoryType>
 *
 * Notes :
- *   - Les IRI sont envoyes en POST/PATCH (ex. "/api/category_types/3").
- *   - `categoryType` est embarque (groupe Serializer `category:read` sur les
- *     proprietes de CategoryType, cf. spec-back § 3.4).
+ *   - Les IRI sont envoyes en POST/PATCH (ex. ["/api/category_types/3"]).
+ *   - `categoryTypes` est embarque (groupe Serializer `category:read` sur les
+ *     proprietes de CategoryType) : tableau d'objets type en lecture.
 *   - `createdBy` / `updatedBy` peuvent etre `null` (hors contexte HTTP,
 *     ON DELETE SET NULL en BDD). Affichage : libelle "Systeme" si null.
 */
@@ -43,7 +43,8 @@ export interface CategoryType {
 export interface Category {
    id: number
    name: string
-    categoryType: CategoryType
+    /** Types de la categorie (>= 1, ManyToMany embarque en lecture). */
+    categoryTypes: CategoryType[]
    /** Soft delete : null = active, valeur = supprimee logiquement le {date}. */
    deletedAt: string | null
    createdAt: string
@@ -53,12 +54,12 @@ export interface Category {
 }

 /**
- * Payload accepte en POST /api/categories. `categoryType` est envoye en
- * IRI Hydra (ex. `/api/category_types/3`).
+ * Payload accepte en POST /api/categories. `categoryTypes` est un tableau
+ * d'IRI Hydra (ex. `['/api/category_types/3', '/api/category_types/5']`).
 */
 export interface CategoryCreateInput {
    name: string
-    categoryType: string
+    categoryTypes: string[]
 }

 /**
@@ -67,5 +68,5 @@ export interface CategoryCreateInput {
 */
 export interface CategoryUpdateInput {
    name?: string
-    categoryType?: string
+    categoryTypes?: string[]
 }
@@ -0,0 +1,372 @@
+<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)]">
+        <!-- ariaLabel via v-bind objet (prop camelCase ; aria-* serait un attribut HTML). -->
+        <MalioButtonIcon
+            v-if="removable && !readonly"
+            icon="mdi:delete-outline"
+            variant="ghost"
+            button-class="absolute top-3 right-3"
+            v-bind="{ ariaLabel: t('commercial.clients.form.address.remove') }"
+            @click="$emit('remove')"
+        />
+
+        <!-- Usage de l'adresse : Select unique (plus simple pour l'utilisateur)
+             remplacant les 3 cases. Les options encodent les combinaisons valides
+             (exclusivite Prospect, RG-1.06/07/08) ; le back recoit toujours les
+             drapeaux isProspect / isDelivery / isBilling (aucune RG modifiee). -->
+        <!-- Erreur portee sur `isProspect` cote back (Callback type obligatoire +
+             exclusivite prospect) -> affichee sous le select Type d'adresse. -->
+        <MalioSelect
+            :model-value="addressType"
+            :options="addressTypeOptions"
+            :label="t('commercial.clients.form.address.addressType')"
+            :readonly="readonly"
+            :required="true"
+            :error="errors?.isProspect"
+            @update:model-value="onAddressTypeChange"
+        />
+
+        <!-- Sites Starseed : multiselect a tags (>= 1 obligatoire, RG-1.10). -->
+        <MalioSelectCheckbox
+            :model-value="model.siteIris"
+            :options="siteOptions"
+            :label="t('commercial.clients.form.address.sites')"
+            :display-tag="true"
+            :readonly="readonly"
+            :required="true"
+            :error="errors?.sites"
+            @update:model-value="(v: (string | number)[]) => update('siteIris', v.map(String))"
+        />
+
+        <MalioSelectCheckbox
+            :model-value="model.contactIris"
+            :options="contactOptions"
+            :label="t('commercial.clients.form.address.contacts')"
+            :display-tag="true"
+            :readonly="readonly"
+            @update:model-value="(v: (string | number)[]) => update('contactIris', v.map(String))"
+        />
+
+        <!-- Email(s) de facturation : visible/obligatoire seulement si Facturation
+             (RG-1.11). Le « + » revele un 2e email optionnel (max 2, pendant du
+             telephone secondaire) qui coule dans la grille. Sinon un filler comble
+             la colonne pour que Categorie reparte au debut de la ligne suivante. -->
+        <MalioInputEmail
+            v-if="isBillingEmailRequired(model)"
+            :model-value="model.billingEmail"
+            :label="t('commercial.clients.form.address.billingEmail')"
+            :required="true"
+            :readonly="readonly"
+            :lowercase="true"
+            :error="errors?.billingEmail"
+            :addable="!model.hasSecondaryBillingEmail && !readonly"
+            :add-button-label="t('commercial.clients.form.address.addBillingEmail')"
+            @update:model-value="(v: string) => update('billingEmail', v)"
+            @add="revealSecondaryBillingEmail"
+        />
+        <div v-else aria-hidden="true" />
+
+        <MalioInputEmail
+            v-if="isBillingEmailRequired(model) && model.hasSecondaryBillingEmail"
+            :model-value="model.billingEmailSecondary"
+            :label="t('commercial.clients.form.address.billingEmailSecondary')"
+            :readonly="readonly"
+            :lowercase="true"
+            :error="errors?.billingEmailSecondary"
+            @update:model-value="(v: string) => update('billingEmailSecondary', v)"
+        />
+
+        <MalioSelectCheckbox
+            :model-value="model.categoryIris"
+            :options="categoryOptions"
+            :label="t('commercial.clients.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.clients.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.clients.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). Si la BAN est
+             indisponible, bascule en saisie libre — recuperable : re-saisir le
+             code postal relance la recherche et repasse en select au succes. -->
+        <MalioSelect
+            v-if="!degraded"
+            :model-value="model.city"
+            :options="cityOptions"
+            :label="t('commercial.clients.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.clients.form.address.city')"
+            :readonly="readonly"
+            :required="true"
+            :error="errors?.city"
+            @update:model-value="(v: string) => update('city', v)"
+        />
+
+        <!-- Adresse + Adresse complementaire sur 2 colonnes : on wrappe car
+             MalioInputText/Autocomplete (inheritAttrs:false) renvoient `class`
+             sur l'input interne, pas sur la cellule de grille. Le wrapper porte
+             le col-span-2, le champ le remplit (w-full). -->
+        <div class="col-span-2">
+            <!-- Adresse : saisie assistee (BAN) en edition ; champ texte simple
+                 seulement en lecture seule (MalioInputAutocomplete ne reaffiche pas
+                 sa valeur liee, il n'afficherait rien en readonly). allow-create :
+                 si la BAN ne propose rien (ou erreur), le texte saisi est CONSERVE au
+                 blur/Entree (saisie manuelle) — sinon il serait efface. La ville reste
+                 pilotee par le code postal ; choisir une suggestion remplit rue+ville+CP. -->
+            <MalioInputAutocomplete
+                v-if="!readonly"
+                :model-value="model.street"
+                :options="addressOptions"
+                :loading="addressLoading"
+                :min-search-length="3"
+                :label="t('commercial.clients.form.address.street')"
+                :readonly="readonly"
+                :required="true"
+                :error="errors?.street"
+                :allow-create="true"
+                :no-results-text="t('commercial.clients.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.clients.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.clients.form.address.streetComplement')"
+                :readonly="readonly"
+                :error="errors?.streetComplement"
+                @update:model-value="(v: string) => update('streetComplement', v)"
+            />
+        </div>
+
+    </div>
+</template>
+
+<script setup lang="ts">
+import {
+    addressFlagsFromType,
+    addressTypeFromFlags,
+    isBillingEmailRequired,
+    type AddressType,
+} from '~/modules/commercial/utils/forms/clientFormRules'
+import { useAddressAutocomplete, type AddressSuggestion } from '~/shared/composables/useAddressAutocomplete'
+import type { CategoryOption, RefOption } from '~/modules/commercial/composables/useClientReferentials'
+import type { AddressFormDraft } from '~/modules/commercial/types/clientForm'
+
+// Masque code postal FR : 5 chiffres.
+const POSTAL_CODE_MASK = '#####'
+
+const props = defineProps<{
+    /** Brouillon de l'adresse (v-model). */
+    modelValue: AddressFormDraft
+    title: string
+    /** Categories autorisees sur une adresse (DISTRIBUTEUR/COURTIER exclus, RG-1.29). */
+    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: AddressFormDraft]
+    'remove': []
+    /** Emis une fois quand le service d'autocompletion bascule en indisponible. */
+    'degraded': []
+}>()
+
+const { t } = useI18n()
+const autocomplete = useAddressAutocomplete()
+
+const model = computed(() => props.modelValue)
+
+// Type d'adresse (Select unique) derive des drapeaux back. null tant qu'aucun
+// drapeau n'est pose -> champ vide + bouton « Valider » bloque (cf. parent).
+const addressType = computed<AddressType | null>(() => addressTypeFromFlags(model.value))
+
+const addressTypeOptions = computed<RefOption[]>(() => [
+    { value: 'prospect', label: t('commercial.clients.form.address.addressTypeProspect') },
+    { value: 'delivery', label: t('commercial.clients.form.address.addressTypeDelivery') },
+    { value: 'billing', label: t('commercial.clients.form.address.addressTypeBilling') },
+    { value: 'delivery_billing', label: t('commercial.clients.form.address.addressTypeDeliveryBilling') },
+    { value: 'broker', label: t('commercial.clients.form.address.addressTypeBroker') },
+    { value: 'distributor', label: t('commercial.clients.form.address.addressTypeDistributor') },
+])
+
+/** Applique le type choisi en repercutant les 3 drapeaux back (immutabilite). */
+function onAddressTypeChange(value: string | number | null): void {
+    if (value === null) return
+    emit('update:modelValue', { ...props.modelValue, ...addressFlagsFromType(value as AddressType) })
+}
+
+// Repli saisie libre de la VILLE quand la BAN est indisponible (recuperable :
+// remis a false des qu'une recherche de ville aboutit). N'affecte plus le champ
+// Adresse, qui reste en autocompletion et reessaie a chaque frappe.
+const degraded = ref(false)
+// Avertissement « service indisponible » envoye au parent une seule fois.
+let unavailableNotified = false
+// Villes proposees par la BAN (alimentees a la saisie du code postal).
+const banCityOptions = ref<RefOption[]>([])
+// Adresses proposees par la BAN (alimentees a la saisie d'adresse).
+const banAddressOptions = ref<RefOption[]>([])
+
+// Options ville effectives : on garantit que la ville courante figure toujours
+// dans la liste, sinon MalioSelect (qui resout le libelle depuis ses options)
+// afficherait un champ vide en lecture seule (consultation 1.11) ou en edition
+// d'une adresse existante (1.12), ou la BAN n'a pas (re)peuple les suggestions.
+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 que cityOptions pour le champ Adresse : la rue courante doit
+// toujours figurer dans les options, sinon MalioInputAutocomplete (qui resout
+// l'affichage depuis ses options) laisse le champ VIDE des que la liste de
+// suggestions BAN est vide — typiquement juste apres validation (remontage) ou
+// a l'edition d'une adresse existante (1.12), alors que la valeur est bien
+// persistee. On reinjecte donc la rue liee si la BAN ne l'a pas (re)proposee.
+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 AddressFormDraft>(field: K, value: AddressFormDraft[K]): void {
+    emit('update:modelValue', { ...props.modelValue, [field]: value })
+}
+
+/** Revele le 2e champ email de facturation (clic sur le « + »). */
+function revealSecondaryBillingEmail(): void {
+    emit('update:modelValue', { ...props.modelValue, hasSecondaryBillingEmail: true })
+}
+
+/** 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 }))
+        // Service repondu : on (re)passe la Ville en select assiste.
+        degraded.value = false
+    }
+    catch {
+        // BAN indispo : Ville en saisie libre (recuperable au prochain essai).
+        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)
+    // et on vide les suggestions devenues obsoletes.
+    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
+        // (pas de bascule definitive — c'etait le bug). Avertissement une seule fois.
+        banAddressOptions.value = []
+        notifyUnavailable()
+    }
+    finally {
+        addressLoading.value = false
+    }
+}
+
+/**
+ * Selection d'une suggestion d'adresse → remplit rue + ville + CP.
+ * Le type d'option suit le contrat MalioInputAutocomplete ({ label, value }).
+ */
+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>
@@ -0,0 +1,111 @@
+<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 obligatoire RG-1.14) ou en lecture seule.
+             ariaLabel via v-bind objet (prop camelCase ; aria-* serait un attribut HTML). -->
+        <MalioButtonIcon
+            v-if="removable && !readonly"
+            icon="mdi:delete-outline"
+            variant="ghost"
+            button-class="absolute top-3 right-3"
+            v-bind="{ ariaLabel: t('commercial.clients.form.contact.remove') }"
+            @click="$emit('remove')"
+        />
+
+        <MalioInputText
+            :model-value="model.lastName"
+            :label="t('commercial.clients.form.contact.lastName')"
+            :readonly="readonly"
+            :error="errors?.lastName"
+            @update:model-value="(v: string) => update('lastName', v)"
+        />
+        <MalioInputText
+            :model-value="model.firstName"
+            :label="t('commercial.clients.form.contact.firstName')"
+            :readonly="readonly"
+            :error="errors?.firstName"
+            @update:model-value="(v: string) => update('firstName', v)"
+        />
+        <!-- Fonction sur 2 colonnes : on wrappe car MalioInputText
+             (inheritAttrs:false) renvoie `class` sur l'input interne, pas sur la
+             cellule de grille. Le wrapper porte le col-span-2, le champ le remplit. -->
+        <div class="col-span-2">
+            <MalioInputText
+                :model-value="model.jobTitle"
+                :label="t('commercial.clients.form.contact.jobTitle')"
+                :readonly="readonly"
+                :error="errors?.jobTitle"
+                @update:model-value="(v: string) => update('jobTitle', v)"
+            />
+        </div>
+        <MalioInputEmail
+            :model-value="model.email"
+            :label="t('commercial.clients.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.clients.form.contact.phonePrimary')"
+            :mask="PHONE_MASK"
+            :readonly="readonly"
+            :error="errors?.phonePrimary"
+            :addable="!model.hasSecondaryPhone && !readonly"
+            :add-button-label="t('commercial.clients.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.clients.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 { ContactFormDraft } from '~/modules/commercial/types/clientForm'
+
+// Masque telephone FR : 5 groupes de 2 chiffres (la normalisation finale reste
+// serveur, cf. formatPhoneFR re-applique a la valeur renvoyee).
+const PHONE_MASK = '## ## ## ## ##'
+
+const props = defineProps<{
+    /** Brouillon du contact (v-model). */
+    modelValue: ContactFormDraft
+    /** Titre du bloc (ex: « Contact 1 »). */
+    title: string
+    /** Affiche l'icone de suppression (1er bloc non supprimable, RG-1.14). */
+    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: ContactFormDraft]
+    '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 ContactFormDraft>(field: K, value: ContactFormDraft[K]): void {
+    emit('update:modelValue', { ...props.modelValue, [field]: value })
+}
+
+/** Revele le 2e numero (RG-1.02/1.20 : max 1 secondaire, le « + » disparait). */
+function revealSecondaryPhone(): void {
+    emit('update:modelValue', { ...props.modelValue, hasSecondaryPhone: true })
+}
+</script>
@@ -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>
@@ -0,0 +1,109 @@
+<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)"
+        />
+        <!-- Fonction sur 2 colonnes : on wrappe car MalioInputText
+             (inheritAttrs:false) renvoie `class` sur l'input interne, pas sur la
+             cellule de grille. Le wrapper porte le col-span-2, le champ le remplit. -->
+        <div class="col-span-2">
+            <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)"
+            />
+        </div>
+        <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>
@@ -0,0 +1,226 @@
+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/clientForm'
+import ClientAddressBlock from '../ClientAddressBlock.vue'
+
+// Mocks controlables du composable BAN (hoisted) : chaque test configure le
+// comportement de searchCity / searchAddress (succes, rejet, rejet-puis-succes).
+// Par defaut ils renvoient undefined (aucune suggestion) — etat « adresse
+// persistee mais liste vide » couvert par les tests d'affichage.
+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 recues, pour
+// verifier que la rue courante figure bien dans la liste (sinon le composant
+// Malio ne peut pas resoudre/afficher la valeur liee -> champ vide).
+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(street: string | null) {
+    return mount(ClientAddressBlock, {
+        props: {
+            modelValue: { ...emptyAddress(), street },
+            title: 'Adresse',
+            categoryOptions: [],
+            siteOptions: [],
+            contactOptions: [],
+            countryOptions: [],
+        },
+        global: {
+            stubs: {
+                MalioButtonIcon: true,
+                MalioCheckbox: true,
+                MalioSelect: true,
+                MalioSelectCheckbox: true,
+                MalioInputText: true,
+                MalioInputAutocomplete: MalioInputAutocompleteStub,
+            },
+        },
+    })
+}
+
+describe('ClientAddressBlock — affichage de l\'adresse persistee', () => {
+    it('inclut la rue courante dans les options de l\'autocomplete meme sans recherche BAN', () => {
+        const wrapper = mountBlock('8 Boulevard du Port')
+
+        const el = wrapper.find('[data-testid="addr-autocomplete"]')
+        const values = JSON.parse(el.attributes('data-options') ?? '[]')
+
+        expect(values).toContain('8 Boulevard du Port')
+    })
+
+    // ERP-119 : saisie manuelle possible quand la BAN ne trouve rien -> allow-create
+    // (sans cette prop, MalioInputAutocomplete efface le texte non selectionne au blur).
+    it('active allow-create sur le champ Adresse (saisie manuelle libre)', () => {
+        const wrapper = mountBlock(null)
+
+        expect(wrapper.findComponent(MalioInputAutocompleteStub).props('allowCreate')).toBe(true)
+    })
+})
+
+/**
+ * Stub MalioInputText qui re-expose `label` + `error` recus : permet de cibler
+ * un champ par son libelle et de verifier l'erreur 422 propagee (ERP-101).
+ */
+const MalioInputTextProbe = defineComponent({
+    name: 'MalioInputTextProbe',
+    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': 'addr-text',
+            'data-label': props.label,
+            'data-error': props.error,
+        })
+    },
+})
+
+describe('ClientAddressBlock — mapping erreur par champ (ERP-101)', () => {
+    function mountWithErrors(errors: Record<string, string>) {
+        return mount(ClientAddressBlock, {
+            props: {
+                modelValue: emptyAddress(),
+                title: 'Adresse',
+                categoryOptions: [],
+                siteOptions: [],
+                contactOptions: [],
+                countryOptions: [],
+                errors,
+            },
+            global: {
+                stubs: {
+                    MalioButtonIcon: true,
+                    MalioCheckbox: true,
+                    MalioSelect: true,
+                    MalioSelectCheckbox: true,
+                    MalioInputAutocomplete: MalioInputAutocompleteStub,
+                    MalioInputText: MalioInputTextProbe,
+                },
+            },
+        })
+    }
+
+    it('affiche l\'erreur serveur sur le champ code postal via la prop errors', () => {
+        const wrapper = mountWithErrors({ postalCode: 'Code postal invalide.' })
+
+        const field = wrapper.findAll('[data-testid="addr-text"]').find(
+            el => el.attributes('data-label') === 'commercial.clients.form.address.postalCode',
+        )
+        expect(field?.attributes('data-error')).toBe('Code postal invalide.')
+    })
+
+    // ERP-119 : type d'adresse (propertyPath back `isProspect`), sites et
+    // categories sont obligatoires ; leurs violations 422 doivent s'afficher sous
+    // le champ correspondant (bindings :error de ClientAddressBlock).
+    it('affiche l\'erreur serveur sur type d\'adresse (propertyPath isProspect)', () => {
+        const wrapper = mountWithErrors({ isProspect: 'Le type d\'adresse est obligatoire.' })
+
+        const field = wrapper.findAll('malio-select-stub').find(
+            el => el.attributes('label') === 'commercial.clients.form.address.addressType',
+        )
+        expect(field?.attributes('error')).toBe('Le type d\'adresse est obligatoire.')
+    })
+
+    it('affiche les erreurs serveur sur sites et categories', () => {
+        const wrapper = mountWithErrors({
+            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.clients.form.address.sites')
+        const categoriesField = checkboxes.find(el => el.attributes('label') === 'commercial.clients.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.')
+    })
+})
+
+describe('ClientAddressBlock — recherche adresse robuste (erreur BAN)', () => {
+    beforeEach(() => {
+        searchAddressMock.mockReset()
+    })
+
+    it('n\'appelle pas la BAN en deca de 3 caracteres', async () => {
+        const wrapper = mountBlock(null)
+        const auto = wrapper.findComponent(MalioInputAutocompleteStub)
+
+        auto.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(null)
+        const auto = wrapper.findComponent(MalioInputAutocompleteStub)
+
+        // 1er essai -> erreur BAN.
+        auto.vm.$emit('search', 'boulevard du port')
+        await flushPromises()
+        expect(searchAddressMock).toHaveBeenCalledTimes(1)
+
+        // 2e essai -> DOIT relancer l'appel (c'etait le bug : plus aucune recherche).
+        auto.vm.$emit('search', 'boulevard du porte')
+        await flushPromises()
+        expect(searchAddressMock).toHaveBeenCalledTimes(2)
+
+        // L'autocompletion reste montee (aucune bascule en saisie libre).
+        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(null)
+        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)
+    })
+})
@@ -0,0 +1,64 @@
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { defineComponent, h, ref, computed } from 'vue'
+import { emptyContact } from '~/modules/commercial/types/clientForm'
+import ClientContactBlock from '../ClientContactBlock.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 attribut
+ * data-* : permet de verifier que le bloc propage bien `:errors[champ]` sur le
+ * bon champ (ERP-101 — mapping erreur 422 par champ, par ligne de collection).
+ */
+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(ClientContactBlock, {
+        props: {
+            modelValue: emptyContact(),
+            title: 'Contact 1',
+            ...(errors ? { errors } : {}),
+        },
+        global: {
+            stubs: {
+                MalioButtonIcon: true,
+                MalioInputPhone: true,
+                MalioInputText: errorProbe('contact-text'),
+                MalioInputEmail: errorProbe('contact-email'),
+            },
+        },
+    })
+}
+
+describe('ClientContactBlock — 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.' })
+
+        const email = wrapper.find('[data-testid="contact-email"]')
+        expect(email.attributes('data-error')).toBe('Adresse e-mail invalide.')
+    })
+
+    it('laisse les champs sans erreur quand errors est absent', () => {
+        const wrapper = mountBlock()
+
+        const email = wrapper.find('[data-testid="contact-email"]')
+        expect(email.attributes('data-error')).toBe('')
+    })
+})
@@ -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')
+    })
+})
@@ -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('')
+    })
+})
@@ -0,0 +1,95 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+// Mocks des composables auto-importes par Nuxt (indisponibles sous happy-dom).
+const mockGet = vi.hoisted(() => vi.fn())
+const mockPatch = vi.hoisted(() => vi.fn())
+
+vi.stubGlobal('useApi', () => ({
+    get: mockGet,
+    post: vi.fn(),
+    put: vi.fn(),
+    patch: mockPatch,
+    delete: vi.fn(),
+}))
+
+const { useClient } = await import('../useClient')
+
+const SAMPLE = { '@id': '/api/clients/42', id: 42, companyName: 'ACME', isArchived: false }
+
+describe('useClient', () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockPatch.mockReset()
+        mockGet.mockResolvedValue(SAMPLE)
+        mockPatch.mockResolvedValue({ ...SAMPLE, isArchived: true })
+    })
+
+    it('charge le detail via GET /clients/{id} en Hydra, sans toast', async () => {
+        const { client, load } = useClient(42)
+        await load()
+
+        expect(mockGet).toHaveBeenCalledWith(
+            '/clients/42',
+            {},
+            expect.objectContaining({
+                headers: { Accept: 'application/ld+json' },
+                toast: false,
+            }),
+        )
+        expect(client.value).toEqual(SAMPLE)
+    })
+
+    it('bascule loading pendant le chargement et le retombe a false', async () => {
+        const { loading, load } = useClient(42)
+        const promise = load()
+        expect(loading.value).toBe(true)
+        await promise
+        expect(loading.value).toBe(false)
+    })
+
+    it('marque error et laisse client null si le GET echoue (404...)', async () => {
+        mockGet.mockRejectedValueOnce(new Error('not found'))
+        const { client, error, load } = useClient(99)
+        await load()
+        expect(error.value).toBe(true)
+        expect(client.value).toBeNull()
+    })
+
+    it('archive() PATCHe { isArchived: true } sans toast puis RECHARGE le detail complet', async () => {
+        // 1er GET = chargement initial, 2e GET = rechargement post-archivage.
+        mockGet.mockResolvedValueOnce(SAMPLE)
+        mockGet.mockResolvedValueOnce({ ...SAMPLE, isArchived: true })
+        const { client, load, archive } = useClient(42)
+        await load()
+        await archive()
+
+        expect(mockPatch).toHaveBeenCalledWith(
+            '/clients/42',
+            { isArchived: true },
+            expect.objectContaining({ toast: false }),
+        )
+        // Le detail est re-fetch (le PATCH ne renvoie pas l'embed complet).
+        expect(mockGet).toHaveBeenCalledTimes(2)
+        expect(client.value?.isArchived).toBe(true)
+    })
+
+    it('restore() PATCHe { isArchived: false } (payload isArchived SEUL)', async () => {
+        const { load, restore } = useClient(42)
+        await load()
+        await restore()
+
+        expect(mockPatch).toHaveBeenCalledWith(
+            '/clients/42',
+            { isArchived: false },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('propage l\'erreur (ex: 409 conflit homonyme RG-1.23) au lieu de l\'avaler', async () => {
+        const conflict = { response: { status: 409 } }
+        mockPatch.mockRejectedValueOnce(conflict)
+        const { load, restore } = useClient(42)
+        await load()
+        await expect(restore()).rejects.toBe(conflict)
+    })
+})
@@ -0,0 +1,122 @@
+import { describe, it, expect, vi } from 'vitest'
+import { useFormErrors } from '~/shared/composables/useFormErrors'
+import { useClientFormErrors } from '../useClientFormErrors'
+
+// useFormErrors (auto-import) expose l'implementation reelle ; elle consomme
+// useToast + useI18n, stubbes ici.
+vi.stubGlobal('useToast', () => ({ error: vi.fn(), success: vi.fn() }))
+vi.stubGlobal('useI18n', () => ({ t: (key: string) => key }))
+vi.stubGlobal('useFormErrors', useFormErrors)
+
+/**
+ * Tests du composable partage `useClientFormErrors` — factorisation du cablage
+ * d'erreurs des ecrans client (creation/edition), suggestion de revue ERP-101.
+ * `mapRowError` ne toaste plus : il retourne un booleen et chaque page garde son
+ * propre fallback (toast.error en creation, showError en edition).
+ */
+describe('useClientFormErrors', () => {
+    it('expose les 3 etats scalaires (vides) et les 3 tableaux d\'erreurs par ligne', () => {
+        const f = useClientFormErrors()
+        expect(f.mainErrors.errors).toEqual({})
+        expect(f.informationErrors.errors).toEqual({})
+        expect(f.accountingErrors.errors).toEqual({})
+        expect(f.contactErrors.value).toEqual([])
+        expect(f.addressErrors.value).toEqual([])
+        expect(f.ribErrors.value).toEqual([])
+    })
+
+    it('mapRowError mappe une 422 sur target[index] et retourne true', () => {
+        const f = useClientFormErrors()
+        const error = {
+            response: {
+                status: 422,
+                _data: { violations: [{ propertyPath: 'email', message: 'Adresse invalide.' }] },
+            },
+        }
+        const mapped = f.mapRowError(error, f.contactErrors, 0)
+        expect(mapped).toBe(true)
+        expect(f.contactErrors.value[0]).toEqual({ email: 'Adresse invalide.' })
+    })
+
+    it('mapRowError retourne false et ne touche pas la cible pour une erreur non-422', () => {
+        const f = useClientFormErrors()
+        const error = { response: { status: 500, _data: {} } }
+        expect(f.mapRowError(error, f.ribErrors, 0)).toBe(false)
+        expect(f.ribErrors.value[0]).toBeUndefined()
+    })
+
+    it('mapRowError retourne false pour une 422 sans violation exploitable', () => {
+        const f = useClientFormErrors()
+        const error = { response: { status: 422, _data: { 'hydra:description': 'Donnees invalides.' } } }
+        expect(f.mapRowError(error, f.addressErrors, 0)).toBe(false)
+        expect(f.addressErrors.value[0]).toBeUndefined()
+    })
+})
+
+// Construit une erreur facon useApi : 422 avec violations Hydra.
+function http422(path: string, message: string) {
+    return { response: { status: 422, _data: { violations: [{ propertyPath: path, message }] } } }
+}
+
+/**
+ * `submitRows` factorise la soumission d'une collection de blocs (contacts /
+ * adresses / RIB) : on tente TOUS les blocs et on collecte les erreurs par index
+ * sans stopper au premier echec (ERP-110 / ERP-101).
+ */
+describe('useClientFormErrors.submitRows', () => {
+    it('tente TOUS les blocs et mappe les erreurs par index, sans stopper au premier echec', async () => {
+        const { contactErrors, submitRows } = useClientFormErrors()
+        const seen: number[] = []
+        const onUnmapped = vi.fn()
+
+        const saveRow = async (_row: unknown, index: number) => {
+            seen.push(index)
+            if (index === 1) throw http422('email', 'Email invalide')
+        }
+
+        const hasError = await submitRows(
+            [{ a: 0 }, { a: 1 }, { a: 2 }],
+            contactErrors,
+            saveRow,
+            onUnmapped,
+        )
+
+        expect(seen).toEqual([0, 1, 2]) // tous les blocs tentes
+        expect(hasError).toBe(true)
+        expect(contactErrors.value[1]).toEqual({ email: 'Email invalide' })
+        expect(contactErrors.value[0]).toBeUndefined()
+        expect(onUnmapped).not.toHaveBeenCalled() // 422 mappee, pas de fallback
+    })
+
+    it('delegue le fallback onUnmappedError pour une erreur non mappable et marque hasError', async () => {
+        const { ribErrors, submitRows } = useClientFormErrors()
+        const onUnmapped = vi.fn()
+
+        const hasError = await submitRows(
+            [{ a: 0 }],
+            ribErrors,
+            async () => { throw { response: { status: 500, _data: {} } } },
+            onUnmapped,
+        )
+
+        expect(hasError).toBe(true)
+        expect(onUnmapped).toHaveBeenCalledTimes(1)
+        expect(ribErrors.value[0]).toBeUndefined()
+    })
+
+    it('saute les lignes filtrees par shouldSkip et renvoie false si tout passe', async () => {
+        const { contactErrors, submitRows } = useClientFormErrors()
+        const saved: number[] = []
+
+        const hasError = await submitRows(
+            [{ skip: true }, { skip: false }],
+            contactErrors,
+            async (_row, index) => { saved.push(index) },
+            vi.fn(),
+            (row: { skip: boolean }) => row.skip,
+        )
+
+        expect(saved).toEqual([1])
+        expect(hasError).toBe(false)
+    })
+})
@@ -0,0 +1,80 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+// `useApi` est un auto-import Nuxt : on le stubbe globalement pour intercepter
+// les appels de chargement des referentiels et simuler un endpoint en echec
+// (ex: 403 sur /categories pour un role sans la permission de lecture).
+// Meme pattern que useClientsRepository.spec.ts.
+const mockGet = vi.hoisted(() => vi.fn())
+vi.stubGlobal('useApi', () => ({
+    get: mockGet,
+    post: vi.fn(),
+    put: vi.fn(),
+    patch: vi.fn(),
+    delete: vi.fn(),
+}))
+
+// Import APRES le stub pour que useApi soit bien resolu au top-level du module.
+const { useClientReferentials } = await import('../useClientReferentials')
+
+describe('useClientReferentials.loadCommon (resilience ERP-102)', () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+    })
+
+    it('un referentiel en echec (403) ne vide QUE son select, pas les autres', async () => {
+        // /categories rejette (simulateur d'un 403), tous les autres repondent.
+        mockGet.mockImplementation((url: string) => {
+            if (url === '/categories') {
+                return Promise.reject(new Error('403 Forbidden'))
+            }
+            if (url === '/sites') {
+                return Promise.resolve({ member: [{ '@id': '/api/sites/1', name: 'Chatellerault', postalCode: '86100' }] })
+            }
+            if (url === '/countries') {
+                // Pays : value === label === name (l'adresse stocke le nom).
+                return Promise.resolve({ member: [{ '@id': '/api/countries/1', code: 'FR', name: 'France' }] })
+            }
+            return Promise.resolve({
+                member: [{ '@id': '/api/x/1', code: 'X', label: 'Libelle X' }],
+            })
+        })
+
+        const refs = useClientReferentials()
+        // loadCommon ne doit JAMAIS rejeter : l'echec d'un referentiel est isole.
+        await refs.loadCommon()
+
+        // Resilience : les referentiels OK sont peuples malgre l'echec de /categories.
+        // Le libelle d'un site est son numero de departement (2 premiers chiffres du code postal).
+        expect(refs.sites.value).toEqual([{ value: '/api/sites/1', label: '86' }])
+        expect(refs.tvaModes.value).toEqual([{ value: '/api/x/1', label: 'Libelle X' }])
+        expect(refs.banks.value).toEqual([{ value: '/api/x/1', label: 'Libelle X' }])
+        // Pays : value = nom du pays (et non l'IRI).
+        expect(refs.countries.value).toEqual([{ value: 'France', label: 'France' }])
+
+        // Seul le select en echec reste vide.
+        expect(refs.categories.value).toEqual([])
+    })
+
+    it('charge tous les referentiels quand tout repond', async () => {
+        mockGet.mockImplementation((url: string) => {
+            if (url === '/categories') {
+                return Promise.resolve({
+                    member: [{ '@id': '/api/categories/1', code: 'SECTEUR', name: 'Secteur' }],
+                })
+            }
+            if (url === '/sites') {
+                return Promise.resolve({ member: [{ '@id': '/api/sites/1', name: 'Chatellerault', postalCode: '86100' }] })
+            }
+            return Promise.resolve({ member: [] })
+        })
+
+        const refs = useClientReferentials()
+        await refs.loadCommon()
+
+        expect(refs.categories.value).toEqual([
+            { value: '/api/categories/1', label: 'Secteur', code: 'SECTEUR' },
+        ])
+        // Le libelle d'un site est son numero de departement (2 premiers chiffres du code postal).
+        expect(refs.sites.value).toEqual([{ value: '/api/sites/1', label: '86' }])
+    })
+})
@@ -0,0 +1,85 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import type { HydraCollection } from '~/shared/utils/api'
+import type { Client } from '../useClientsRepository'
+
+// `useApi` est un auto-import Nuxt : on le stubbe globalement pour intercepter
+// les appels declenches par usePaginatedList (que useClientsRepository enveloppe)
+// et controler les reponses. Meme pattern que useCategoriesAdmin.spec.ts.
+const mockGet = vi.hoisted(() => vi.fn())
+vi.stubGlobal('useApi', () => ({
+    get: mockGet,
+    post: vi.fn(),
+    put: vi.fn(),
+    patch: vi.fn(),
+    delete: vi.fn(),
+}))
+
+// Import APRES le stub pour que useApi soit bien resolu au top-level du module.
+const { useClientsRepository } = await import('../useClientsRepository')
+
+/** Envelope Hydra minimale (la liste reelle des membres importe peu ici). */
+function makeHydra(total: number): HydraCollection<Client> {
+    return { totalItems: total, member: [] }
+}
+
+describe('useClientsRepository', () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        // 25 items → 3 pages a 10/page : permet de tester la navigation page 2.
+        mockGet.mockResolvedValue(makeHydra(25))
+    })
+
+    it('cible la ressource /clients en page 1 par defaut', async () => {
+        const repo = useClientsRepository()
+        await repo.fetch()
+
+        expect(mockGet).toHaveBeenLastCalledWith(
+            '/clients',
+            { page: 1, itemsPerPage: 10 },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('pousse les filtres du drawer (categories multi, sites, archives) et retombe en page 1', async () => {
+        const repo = useClientsRepository()
+        await repo.fetch()
+        await repo.goToPage(2)
+        expect(repo.currentPage.value).toBe(2)
+
+        await repo.setFilters(
+            {
+                search: 'acme',
+                'categoryCode[]': ['DISTRIBUTEUR', 'COURTIER'],
+                'siteId[]': ['1', '2'],
+                archivedOnly: true,
+            },
+            { replace: true },
+        )
+
+        expect(repo.currentPage.value).toBe(1)
+        expect(mockGet).toHaveBeenLastCalledWith(
+            '/clients',
+            {
+                search: 'acme',
+                'categoryCode[]': ['DISTRIBUTEUR', 'COURTIER'],
+                'siteId[]': ['1', '2'],
+                archivedOnly: true,
+                page: 1,
+                itemsPerPage: 10,
+            },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('repasse a une query propre apres reinitialisation des filtres', async () => {
+        const repo = useClientsRepository()
+        await repo.setFilters({ search: 'acme', archivedOnly: true }, { replace: true })
+        await repo.setFilters({}, { replace: true })
+
+        expect(mockGet).toHaveBeenLastCalledWith(
+            '/clients',
+            { page: 1, itemsPerPage: 10 },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+})
@@ -0,0 +1,95 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+// Mocks des composables auto-importes par Nuxt (indisponibles sous happy-dom).
+const mockGet = vi.hoisted(() => vi.fn())
+const mockPatch = vi.hoisted(() => vi.fn())
+
+vi.stubGlobal('useApi', () => ({
+    get: mockGet,
+    post: vi.fn(),
+    put: vi.fn(),
+    patch: mockPatch,
+    delete: vi.fn(),
+}))
+
+const { useSupplier } = await import('../useSupplier')
+
+const SAMPLE = { '@id': '/api/suppliers/85', id: 85, companyName: 'DOD59393F 862875', isArchived: false }
+
+describe('useSupplier', () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockPatch.mockReset()
+        mockGet.mockResolvedValue(SAMPLE)
+        mockPatch.mockResolvedValue({ ...SAMPLE, isArchived: true })
+    })
+
+    it('charge le detail via GET /suppliers/{id} en Hydra, sans toast', async () => {
+        const { supplier, load } = useSupplier(85)
+        await load()
+
+        expect(mockGet).toHaveBeenCalledWith(
+            '/suppliers/85',
+            {},
+            expect.objectContaining({
+                headers: { Accept: 'application/ld+json' },
+                toast: false,
+            }),
+        )
+        expect(supplier.value).toEqual(SAMPLE)
+    })
+
+    it('bascule loading pendant le chargement et le retombe a false', async () => {
+        const { loading, load } = useSupplier(85)
+        const promise = load()
+        expect(loading.value).toBe(true)
+        await promise
+        expect(loading.value).toBe(false)
+    })
+
+    it('marque error et laisse supplier null si le GET echoue (404...)', async () => {
+        mockGet.mockRejectedValueOnce(new Error('not found'))
+        const { supplier, error, load } = useSupplier(99)
+        await load()
+        expect(error.value).toBe(true)
+        expect(supplier.value).toBeNull()
+    })
+
+    it('archive() PATCHe { isArchived: true } sans toast puis RECHARGE le detail complet', async () => {
+        // 1er GET = chargement initial, 2e GET = rechargement post-archivage.
+        mockGet.mockResolvedValueOnce(SAMPLE)
+        mockGet.mockResolvedValueOnce({ ...SAMPLE, isArchived: true })
+        const { supplier, load, archive } = useSupplier(85)
+        await load()
+        await archive()
+
+        expect(mockPatch).toHaveBeenCalledWith(
+            '/suppliers/85',
+            { isArchived: true },
+            expect.objectContaining({ toast: false }),
+        )
+        // Le detail est re-fetch (le PATCH ne renvoie pas l'embed complet).
+        expect(mockGet).toHaveBeenCalledTimes(2)
+        expect(supplier.value?.isArchived).toBe(true)
+    })
+
+    it('restore() PATCHe { isArchived: false } (payload isArchived SEUL)', async () => {
+        const { load, restore } = useSupplier(85)
+        await load()
+        await restore()
+
+        expect(mockPatch).toHaveBeenCalledWith(
+            '/suppliers/85',
+            { isArchived: false },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('propage l\'erreur (ex: 403 sans permission archive, 409 conflit homonyme) au lieu de l\'avaler', async () => {
+        const forbidden = { response: { status: 403 } }
+        mockPatch.mockRejectedValueOnce(forbidden)
+        const { load, archive } = useSupplier(85)
+        await load()
+        await expect(archive()).rejects.toBe(forbidden)
+    })
+})
@@ -0,0 +1,63 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+// `useApi` est un auto-import Nuxt : on le stubbe globalement pour intercepter
+// les appels de chargement des referentiels et controler les reponses Hydra.
+const mockGet = vi.hoisted(() => vi.fn())
+vi.stubGlobal('useApi', () => ({ get: mockGet }))
+
+const { useSupplierReferentials } = await import('../useSupplierReferentials')
+
+describe('useSupplierReferentials', () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockGet.mockResolvedValue({ member: [] })
+    })
+
+    it('charge les categories filtrees sur le type FOURNISSEUR (RG-2.10)', async () => {
+        await useSupplierReferentials().loadCommon()
+
+        expect(mockGet).toHaveBeenCalledWith(
+            '/categories',
+            expect.objectContaining({ pagination: 'false', typeCode: 'FOURNISSEUR' }),
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('mappe les categories en options { value: IRI, label: name, code }', async () => {
+        mockGet.mockImplementation((url: string) => {
+            if (url === '/categories') {
+                return Promise.resolve({ member: [{ '@id': '/api/categories/9', code: 'NEGOCIANT', name: 'Négociant' }] })
+            }
+            return Promise.resolve({ member: [] })
+        })
+
+        const refs = useSupplierReferentials()
+        await refs.loadCommon()
+
+        expect(refs.categories.value).toEqual([{ value: '/api/categories/9', label: 'Négociant', code: 'NEGOCIANT' }])
+    })
+
+    it('ne charge ni distributeurs ni courtiers (absents du modele fournisseur)', async () => {
+        await useSupplierReferentials().loadCommon()
+
+        const urls = mockGet.mock.calls.map(c => c[0])
+        expect(urls).not.toContain('/clients')
+        expect(urls).toEqual(
+            expect.arrayContaining(['/categories', '/sites', '/tva_modes', '/payment_delays', '/payment_types', '/banks']),
+        )
+    })
+
+    it('reste resilient : un referentiel en echec n\'empeche pas les autres', async () => {
+        mockGet.mockImplementation((url: string) => {
+            if (url === '/categories') return Promise.reject(new Error('403'))
+            if (url === '/banks') return Promise.resolve({ member: [{ '@id': '/api/banks/1', code: 'SG', label: 'Société Générale' }] })
+            return Promise.resolve({ member: [] })
+        })
+
+        const refs = useSupplierReferentials()
+        await refs.loadCommon()
+
+        expect(refs.categories.value).toEqual([])
+        expect(refs.banks.value).toEqual([{ value: '/api/banks/1', label: 'Société Générale' }])
+    })
+})
@@ -0,0 +1,85 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import type { HydraCollection } from '~/shared/utils/api'
+import type { Supplier } from '../useSuppliersRepository'
+
+// `useApi` est un auto-import Nuxt : on le stubbe globalement pour intercepter
+// les appels declenches par usePaginatedList (que useSuppliersRepository enveloppe)
+// et controler les reponses. Meme pattern que useClientsRepository.spec.ts.
+const mockGet = vi.hoisted(() => vi.fn())
+vi.stubGlobal('useApi', () => ({
+    get: mockGet,
+    post: vi.fn(),
+    put: vi.fn(),
+    patch: vi.fn(),
+    delete: vi.fn(),
+}))
+
+// Import APRES le stub pour que useApi soit bien resolu au top-level du module.
+const { useSuppliersRepository } = await import('../useSuppliersRepository')
+
+/** Envelope Hydra minimale (la liste reelle des membres importe peu ici). */
+function makeHydra(total: number): HydraCollection<Supplier> {
+    return { totalItems: total, member: [] }
+}
+
+describe('useSuppliersRepository', () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        // 25 items → 3 pages a 10/page : permet de tester la navigation page 2.
+        mockGet.mockResolvedValue(makeHydra(25))
+    })
+
+    it('cible la ressource /suppliers en page 1 par defaut', async () => {
+        const repo = useSuppliersRepository()
+        await repo.fetch()
+
+        expect(mockGet).toHaveBeenLastCalledWith(
+            '/suppliers',
+            { page: 1, itemsPerPage: 10 },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('pousse les filtres du drawer (categories multi, sites, archives inclus) et retombe en page 1', async () => {
+        const repo = useSuppliersRepository()
+        await repo.fetch()
+        await repo.goToPage(2)
+        expect(repo.currentPage.value).toBe(2)
+
+        await repo.setFilters(
+            {
+                search: 'acme',
+                'categoryCode[]': ['NEGOCIANT', 'TRANSPORTEUR'],
+                'siteId[]': ['86', '17'],
+                includeArchived: true,
+            },
+            { replace: true },
+        )
+
+        expect(repo.currentPage.value).toBe(1)
+        expect(mockGet).toHaveBeenLastCalledWith(
+            '/suppliers',
+            {
+                search: 'acme',
+                'categoryCode[]': ['NEGOCIANT', 'TRANSPORTEUR'],
+                'siteId[]': ['86', '17'],
+                includeArchived: true,
+                page: 1,
+                itemsPerPage: 10,
+            },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('repasse a une query propre apres reinitialisation des filtres', async () => {
+        const repo = useSuppliersRepository()
+        await repo.setFilters({ search: 'acme', includeArchived: true }, { replace: true })
+        await repo.setFilters({}, { replace: true })
+
+        expect(mockGet).toHaveBeenLastCalledWith(
+            '/suppliers',
+            { page: 1, itemsPerPage: 10 },
+            expect.objectContaining({ toast: false }),
+        )
+    })
+})
@@ -0,0 +1,70 @@
+import { ref } from 'vue'
+import type { ClientDetail } from '~/modules/commercial/utils/forms/clientConsultation'
+
+/**
+ * Chargement et actions d'archivage d'un client unique (ecran « Consultation
+ * client », 1.11). Lit le detail embarque via `GET /api/clients/{id}` (contacts /
+ * adresses / ribs sous `client:item:read` / `client:read:accounting`) et expose
+ * les bascules d'archivage (PATCH `isArchived` SEUL — tout autre champ => 422).
+ *
+ * L'en-tete `Accept: application/ld+json` est impose pour obtenir le payload
+ * Hydra complet (sans lui, API Platform 4 renvoie une representation reduite).
+ *
+ * Etat 100 % local a l'instance (refs) — aucune persistance URL. Les erreurs
+ * d'archivage/restauration (notamment le 409 RG-1.23 : homonyme actif a la
+ * restauration) sont PROPAGEES a l'appelant, qui decide du toast a afficher.
+ */
+export function useClient(id: number | string) {
+    const api = useApi()
+
+    const client = ref<ClientDetail | null>(null)
+    const loading = ref(false)
+    const error = ref(false)
+
+    /** Recupere le detail complet (embed contacts/adresses/ribs + comptabilite). */
+    function fetchDetail(): Promise<ClientDetail> {
+        return api.get<ClientDetail>(
+            `/clients/${id}`,
+            {},
+            { headers: { Accept: 'application/ld+json' }, toast: false },
+        )
+    }
+
+    /** Charge le detail du client. En cas d'echec : `error = true`, `client = null`. */
+    async function load(): Promise<void> {
+        loading.value = true
+        error.value = false
+        try {
+            client.value = await fetchDetail()
+        }
+        catch {
+            error.value = true
+            client.value = null
+        }
+        finally {
+            loading.value = false
+        }
+    }
+
+    /**
+     * Bascule l'archivage (PATCH `isArchived` SEUL — tout autre champ => 422),
+     * puis RECHARGE le detail complet : la reponse du PATCH ne porte que le groupe
+     * `client:read` (ni l'embed contacts/adresses/ribs ni les libelles des
+     * referentiels comptables), un simple merge laisserait l'affichage incoherent.
+     * Toute erreur (notamment le 409 d'homonyme actif a la restauration, RG-1.23)
+     * est propagee a l'appelant AVANT le rechargement.
+     */
+    async function setArchived(isArchived: boolean): Promise<void> {
+        await api.patch(`/clients/${id}`, { isArchived }, { toast: false })
+        client.value = await fetchDetail()
+    }
+
+    return {
+        client,
+        loading,
+        error,
+        load,
+        archive: () => setArchived(true),
+        restore: () => setArchived(false),
+    }
+}
@@ -0,0 +1,94 @@
+/**
+ * Composable d'erreurs partage des ecrans client (creation + edition, M1
+ * Commercial). Factorise le cablage identique entre `clients/new.vue` et
+ * `clients/[id]/edit.vue` (suggestion de revue ERP-101) :
+ *  - un `useFormErrors` par groupe scalaire (Principal / Information /
+ *    Comptabilite) : violations 422 affichees inline sous chaque champ ;
+ *  - un tableau d'erreurs PAR LIGNE pour chaque collection (contacts /
+ *    adresses / RIB), aligne sur l'index du `v-for`.
+ *
+ * `mapRowError` ne toaste PAS lui-meme : il retourne un booleen (true = mappe
+ * inline). Chaque page conserve ainsi son propre fallback dans le `catch`
+ * (toast generique en creation, `showError` en edition) sans imposer un
+ * comportement commun.
+ */
+import { ref, type Ref } from 'vue'
+import { mapViolationsToRecord } from '~/shared/utils/api'
+
+export function useClientFormErrors() {
+    const mainErrors = useFormErrors()
+    const informationErrors = useFormErrors()
+    const accountingErrors = useFormErrors()
+    const contactErrors = ref<Record<string, string>[]>([])
+    const addressErrors = ref<Record<string, string>[]>([])
+    const ribErrors = ref<Record<string, string>[]>([])
+
+    /**
+     * Mappe l'erreur d'une ligne de collection sur le tableau cible (par index).
+     * 422 avec violations exploitables → erreurs inline sous les champs de la
+     * ligne + retourne true. Sinon → ne touche pas la cible et retourne false
+     * (le caller decide du fallback toast).
+     */
+    function mapRowError(
+        error: unknown,
+        target: Ref<Record<string, string>[]>,
+        index: number,
+    ): boolean {
+        const response = (error as { response?: { status?: number, _data?: unknown } })?.response
+        const mapped = response?.status === 422 ? mapViolationsToRecord(response._data) : {}
+        if (Object.keys(mapped).length > 0) {
+            target.value[index] = mapped
+            return true
+        }
+        return false
+    }
+
+    /**
+     * Soumet TOUS les blocs d'une collection (contacts / adresses / RIB) en
+     * collectant les erreurs par index : on n'arrete PAS au premier bloc en echec
+     * (decision ERP-110 / ERP-101). Reinitialise le tableau d'erreurs cible, tente
+     * chaque ligne via `saveRow`, mappe les 422 inline (mapRowError) ou delegue le
+     * fallback a `onUnmappedError`. `shouldSkip` permet d'ignorer les blocs vides
+     * (non remplis). Retourne true si au moins un bloc a echoue (le caller ne valide
+     * alors pas l'onglet et n'affiche pas de toast succes).
+     */
+    async function submitRows<T>(
+        rows: T[],
+        target: Ref<Record<string, string>[]>,
+        saveRow: (row: T, index: number) => Promise<void>,
+        onUnmappedError: (error: unknown, index: number) => void,
+        shouldSkip?: (row: T, index: number) => boolean,
+    ): Promise<boolean> {
+        target.value = []
+        let hasError = false
+        for (let index = 0; index < rows.length; index++) {
+            // L'index reste borne par rows.length : la ligne existe forcement.
+            const row = rows[index] as T
+            if (shouldSkip?.(row, index)) {
+                continue
+            }
+            try {
+                await saveRow(row, index)
+            }
+            catch (error) {
+                if (!mapRowError(error, target, index)) {
+                    onUnmappedError(error, index)
+                }
+                hasError = true
+            }
+        }
+
+        return hasError
+    }
+
+    return {
+        mainErrors,
+        informationErrors,
+        accountingErrors,
+        contactErrors,
+        addressErrors,
+        ribErrors,
+        mapRowError,
+        submitRows,
+    }
+}
@@ -0,0 +1,166 @@
+import { ref } from 'vue'
+
+/**
+ * Charge les referentiels (listes courtes) alimentant les selects de l'ecran
+ * « Ajouter un client » : categories, sites, modes de TVA, delais et types de
+ * reglement, banques, pays, et les listes distributeurs / courtiers.
+ *
+ * Toutes les collections sont recuperees en entier via l'echappatoire prevue
+ * `?pagination=false` (referentiels de quelques dizaines d'entrees max), avec
+ * l'en-tete `Accept: application/ld+json` impose par API Platform 4 pour obtenir
+ * l'enveloppe Hydra (`member`). Les valeurs d'option sont les IRI Hydra (`@id`)
+ * pour pouvoir etre renvoyees telles quelles dans les payloads POST/PATCH
+ * (relations ManyToOne / ManyToMany).
+ *
+ * Etat 100 % local a l'instance (refs) — aucune persistance URL.
+ */
+
+/** Option generique au format attendu par MalioSelect / MalioSelectCheckbox ({ label, value }). */
+export interface RefOption {
+    value: string
+    label: string
+}
+
+/** Option de type de reglement enrichie de son code stable (RG-1.12 / RG-1.13). */
+export interface PaymentTypeOption extends RefOption {
+    code: string
+}
+
+/** Option de categorie enrichie de son code stable (filtrage RG-1.29 cote adresse). */
+export interface CategoryOption extends RefOption {
+    code: string
+}
+
+/** Option de client (distributeur / courtier) — value = IRI du client lie. */
+export type ClientOption = RefOption
+
+interface HydraMember {
+    '@id': string
+}
+
+interface CategoryMember extends HydraMember {
+    code: string
+    name: string
+}
+
+interface SiteMember extends HydraMember {
+    name: string
+    postalCode: string
+}
+
+interface ReferentialMember extends HydraMember {
+    code: string
+    label: string
+}
+
+interface ClientMember extends HydraMember {
+    companyName: string
+}
+
+interface CountryMember extends HydraMember {
+    code: string
+    name: string
+}
+
+const LD_JSON_HEADERS = { Accept: 'application/ld+json' }
+
+export function useClientReferentials() {
+    const api = useApi()
+
+    const categories = ref<CategoryOption[]>([])
+    const sites = ref<RefOption[]>([])
+    const tvaModes = ref<RefOption[]>([])
+    const paymentDelays = ref<RefOption[]>([])
+    const paymentTypes = ref<PaymentTypeOption[]>([])
+    const banks = ref<RefOption[]>([])
+    const countries = ref<RefOption[]>([])
+    const distributors = ref<ClientOption[]>([])
+    const brokers = ref<ClientOption[]>([])
+
+    /** Recupere une collection complete (pagination desactivee) en Hydra. */
+    async function fetchAll<T extends HydraMember>(
+        url: string,
+        query: Record<string, string | string[]> = {},
+    ): Promise<T[]> {
+        const res = await api.get<{ member?: T[] }>(
+            url,
+            { pagination: 'false', ...query },
+            { headers: LD_JSON_HEADERS, toast: false },
+        )
+        return res.member ?? []
+    }
+
+    /**
+     * Charge en parallele les referentiels communs (hors distributeurs/courtiers,
+     * charges a la demande selon la relation choisie).
+     *
+     * Chargement RESILIENT (Promise.allSettled) : chaque referentiel est isole.
+     * Necessaire pour les roles metier qui n'ont pas toutes les permissions de
+     * lecture — ex. Compta a `commercial.clients.view` (donc /tva_modes, /banks...
+     * accessibles) mais PAS `catalog.categories.view` ni `sites.view` : sans
+     * isolation, le 403 sur /categories ferait echouer tout le bloc et viderait
+     * les selects comptables dont Compta a besoin sur l'ecran de modification.
+     * Un referentiel en echec reste simplement vide (l'ecran d'edition complete
+     * l'affichage des valeurs courantes depuis l'embed du detail client).
+     */
+    async function loadCommon(): Promise<void> {
+        await Promise.allSettled([
+            // Taxonomie multi-types (ERP-84) : un client ne porte que des categories
+            // de type CLIENT (pas FOURNISSEUR) -> on filtre la collection cote API.
+            fetchAll<CategoryMember>('/categories', { typeCode: 'CLIENT' })
+                .then((cats) => { categories.value = cats.map(c => ({ value: c['@id'], label: c.name, code: c.code })) }),
+            fetchAll<SiteMember>('/sites')
+                // Libelle = numero de departement (2 premiers chiffres du code
+                // postal du site), ex: 86100 -> « 86 ». Le code postal est deja
+                // expose par /sites (groupe site:read) — aucune colonne a ajouter.
+                .then((sitesList) => { sites.value = sitesList.map(s => ({ value: s['@id'], label: (s.postalCode ?? '').slice(0, 2) })) }),
+            fetchAll<ReferentialMember>('/tva_modes')
+                .then((tva) => { tvaModes.value = tva.map(t => ({ value: t['@id'], label: t.label })) }),
+            fetchAll<ReferentialMember>('/payment_delays')
+                .then((delays) => { paymentDelays.value = delays.map(d => ({ value: d['@id'], label: d.label })) }),
+            fetchAll<ReferentialMember>('/payment_types')
+                .then((types) => { paymentTypes.value = types.map(t => ({ value: t['@id'], label: t.label, code: t.code })) }),
+            fetchAll<ReferentialMember>('/banks')
+                .then((banksList) => { banks.value = banksList.map(b => ({ value: b['@id'], label: b.label })) }),
+            // Pays (ERP-116) : la valeur d'option est le NOM du pays (et non l'IRI),
+            // car l'adresse stocke `country` en chaine libre (« France »...). On
+            // conserve ainsi la compatibilite avec les adresses existantes sans FK
+            // ni migration de donnees a ce stade. value === label.
+            fetchAll<CountryMember>('/countries')
+                .then((list) => { countries.value = list.map(c => ({ value: c.name, label: c.name })) }),
+        ])
+    }
+
+    /** Liste des clients pouvant etre choisis comme distributeur (code DISTRIBUTEUR). */
+    async function loadDistributors(): Promise<void> {
+        if (distributors.value.length > 0) {
+            return
+        }
+        const clients = await fetchAll<ClientMember>('/clients', { categoryCode: 'DISTRIBUTEUR' })
+        distributors.value = clients.map(c => ({ value: c['@id'], label: c.companyName }))
+    }
+
+    /** Liste des clients pouvant etre choisis comme courtier (code COURTIER). */
+    async function loadBrokers(): Promise<void> {
+        if (brokers.value.length > 0) {
+            return
+        }
+        const clients = await fetchAll<ClientMember>('/clients', { categoryCode: 'COURTIER' })
+        brokers.value = clients.map(c => ({ value: c['@id'], label: c.companyName }))
+    }
+
+    return {
+        categories,
+        sites,
+        tvaModes,
+        paymentDelays,
+        paymentTypes,
+        banks,
+        countries,
+        distributors,
+        brokers,
+        loadCommon,
+        loadDistributors,
+        loadBrokers,
+    }
+}
@@ -0,0 +1,53 @@
+import { usePaginatedList } from '~/shared/composables/usePaginatedList'
+
+/**
+ * Site Starseed rattache a une adresse du client, tel qu'embarque en LISTE
+ * (groupe site:read) pour la colonne « Site(s) » du Repertoire (badges colores).
+ */
+export interface ClientSite {
+    id: number
+    name: string
+    color: string
+}
+
+/**
+ * Categorie rattachee au client, embarquee en LISTE (groupe category:read).
+ * Seul le `code` (stable, MAJUSCULE — ERP-78) est affiche dans la colonne
+ * « Catégories ». Les autres champs sont presents mais non utilises ici.
+ */
+export interface ClientCategory {
+    code: string
+    name?: string
+}
+
+/**
+ * Vue MINIMALE d'un client pour le Repertoire (datatable). Volontairement
+ * partielle : seuls les champs des colonnes + l'id (navigation) sont types ici.
+ * Le detail complet (onglets) est hors perimetre de cet ecran (ERP-62).
+ */
+export interface Client {
+    id: number
+    companyName: string
+    categories: ClientCategory[]
+    sites: ClientSite[]
+    /** Date ISO de derniere modification (default:read) — colonne « Dernière activité ». */
+    updatedAt: string | null
+    isArchived: boolean
+}
+
+/**
+ * Repertoire clients (ERP-62) — simple enveloppe de `usePaginatedList<Client>`
+ * sur la ressource `/clients` (RG-13 : pagination serveur obligatoire ; jamais
+ * de chargement integral en memoire).
+ *
+ * Les filtres (recherche, categories, sites, archives) sont pilotes par la page
+ * via `setFilters` du composable partage — la remise en page 1 est garantie.
+ *
+ * Volontairement PAR INSTANCE (pas de singleton module-level) : l'etat tableau
+ * est propre a l'ecran Repertoire et meurt avec lui, comme tout consommateur de
+ * `usePaginatedList` (cf. sites.vue / categories.vue). Aucun reset au logout a
+ * gerer.
+ */
+export function useClientsRepository() {
+    return usePaginatedList<Client>({ url: '/clients' })
+}
@@ -0,0 +1,71 @@
+import { ref } from 'vue'
+import type { SupplierDetail } from '~/modules/commercial/utils/forms/supplierConsultation'
+
+/**
+ * Chargement et actions d'archivage d'un fournisseur unique (ecran « Consultation
+ * fournisseur », ERP-95). Miroir de `useClient` (M1). Lit le detail embarque via
+ * `GET /api/suppliers/{id}` (contacts / adresses / ribs sous `supplier:item:read` /
+ * `supplier:read:accounting`) et expose les bascules d'archivage (PATCH `isArchived`
+ * SEUL — tout autre champ => 422).
+ *
+ * L'en-tete `Accept: application/ld+json` est impose pour obtenir le payload
+ * Hydra complet (sans lui, API Platform 4 renvoie une representation reduite).
+ *
+ * Etat 100 % local a l'instance (refs) — aucune persistance URL. Les erreurs
+ * d'archivage/restauration (notamment le 409 d'homonyme actif a la restauration)
+ * sont PROPAGEES a l'appelant, qui decide du toast a afficher.
+ */
+export function useSupplier(id: number | string) {
+    const api = useApi()
+
+    const supplier = ref<SupplierDetail | null>(null)
+    const loading = ref(false)
+    const error = ref(false)
+
+    /** Recupere le detail complet (embed contacts/adresses/ribs + comptabilite). */
+    function fetchDetail(): Promise<SupplierDetail> {
+        return api.get<SupplierDetail>(
+            `/suppliers/${id}`,
+            {},
+            { headers: { Accept: 'application/ld+json' }, toast: false },
+        )
+    }
+
+    /** Charge le detail du fournisseur. En cas d'echec : `error = true`, `supplier = null`. */
+    async function load(): Promise<void> {
+        loading.value = true
+        error.value = false
+        try {
+            supplier.value = await fetchDetail()
+        }
+        catch {
+            error.value = true
+            supplier.value = null
+        }
+        finally {
+            loading.value = false
+        }
+    }
+
+    /**
+     * Bascule l'archivage (PATCH `isArchived` SEUL — tout autre champ => 422),
+     * puis RECHARGE le detail complet : la reponse du PATCH ne porte que le groupe
+     * `supplier:read` (ni l'embed contacts/adresses/ribs ni les libelles des
+     * referentiels comptables), un simple merge laisserait l'affichage incoherent.
+     * Toute erreur (notamment le 409 d'homonyme actif a la restauration) est
+     * propagee a l'appelant AVANT le rechargement.
+     */
+    async function setArchived(isArchived: boolean): Promise<void> {
+        await api.patch(`/suppliers/${id}`, { isArchived }, { toast: false })
+        supplier.value = await fetchDetail()
+    }
+
+    return {
+        supplier,
+        loading,
+        error,
+        load,
+        archive: () => setArchived(true),
+        restore: () => setArchived(false),
+    }
+}
@@ -0,0 +1,88 @@
+/**
+ * Composable d'erreurs partage des ecrans fournisseur (creation + edition, M2
+ * Commercial). Miroir de `useClientFormErrors` (M1) :
+ *  - un `useFormErrors` par groupe scalaire (Principal / Information /
+ *    Comptabilite) : violations 422 affichees inline sous chaque champ ;
+ *  - un tableau d'erreurs PAR LIGNE pour chaque collection (contacts /
+ *    adresses / RIB), aligne sur l'index du `v-for`.
+ *
+ * `mapRowError` ne toaste PAS lui-meme : il retourne un booleen (true = mappe
+ * inline). Chaque page conserve ainsi son propre fallback dans le `catch`.
+ */
+import { ref, type Ref } from 'vue'
+import { mapViolationsToRecord } from '~/shared/utils/api'
+
+export function useSupplierFormErrors() {
+    const mainErrors = useFormErrors()
+    const informationErrors = useFormErrors()
+    const accountingErrors = useFormErrors()
+    const contactErrors = ref<Record<string, string>[]>([])
+    const addressErrors = ref<Record<string, string>[]>([])
+    const ribErrors = ref<Record<string, string>[]>([])
+
+    /**
+     * Mappe l'erreur d'une ligne de collection sur le tableau cible (par index).
+     * 422 avec violations exploitables → erreurs inline sous les champs de la
+     * ligne + retourne true. Sinon → ne touche pas la cible et retourne false.
+     */
+    function mapRowError(
+        error: unknown,
+        target: Ref<Record<string, string>[]>,
+        index: number,
+    ): boolean {
+        const response = (error as { response?: { status?: number, _data?: unknown } })?.response
+        const mapped = response?.status === 422 ? mapViolationsToRecord(response._data) : {}
+        if (Object.keys(mapped).length > 0) {
+            target.value[index] = mapped
+            return true
+        }
+        return false
+    }
+
+    /**
+     * Soumet TOUS les blocs d'une collection (contacts / adresses / RIB) en
+     * collectant les erreurs par index : on n'arrete PAS au premier bloc en echec
+     * (decision ERP-110 / ERP-101). Reinitialise le tableau d'erreurs cible, tente
+     * chaque ligne via `saveRow`, mappe les 422 inline (mapRowError) ou delegue le
+     * fallback a `onUnmappedError`. `shouldSkip` permet d'ignorer les blocs vides.
+     * Retourne true si au moins un bloc a echoue.
+     */
+    async function submitRows<T>(
+        rows: T[],
+        target: Ref<Record<string, string>[]>,
+        saveRow: (row: T, index: number) => Promise<void>,
+        onUnmappedError: (error: unknown, index: number) => void,
+        shouldSkip?: (row: T, index: number) => boolean,
+    ): Promise<boolean> {
+        target.value = []
+        let hasError = false
+        for (let index = 0; index < rows.length; index++) {
+            const row = rows[index] as T
+            if (shouldSkip?.(row, index)) {
+                continue
+            }
+            try {
+                await saveRow(row, index)
+            }
+            catch (error) {
+                if (!mapRowError(error, target, index)) {
+                    onUnmappedError(error, index)
+                }
+                hasError = true
+            }
+        }
+
+        return hasError
+    }
+
+    return {
+        mainErrors,
+        informationErrors,
+        accountingErrors,
+        contactErrors,
+        addressErrors,
+        ribErrors,
+        mapRowError,
+        submitRows,
+    }
+}
@@ -0,0 +1,132 @@
+import { ref } from 'vue'
+
+/**
+ * Charge les referentiels (listes courtes) alimentant les selects de l'ecran
+ * « Ajouter un fournisseur » : categories (type FOURNISSEUR), sites, modes de TVA,
+ * delais et types de reglement, banques. Miroir de `useClientReferentials` (M1).
+ *
+ * Toutes les collections sont recuperees en entier via l'echappatoire prevue
+ * `?pagination=false` (referentiels de quelques dizaines d'entrees max), avec
+ * l'en-tete `Accept: application/ld+json` impose par API Platform 4 pour obtenir
+ * l'enveloppe Hydra (`member`). Les valeurs d'option sont les IRI Hydra (`@id`)
+ * renvoyees telles quelles dans les payloads POST/PATCH (relations M:1 / M:N).
+ *
+ * Difference M2 : pas de distributeurs/courtiers (absents du modele fournisseur).
+ *
+ * Etat 100 % local a l'instance (refs) — aucune persistance URL.
+ */
+
+/** Option generique au format attendu par MalioSelect / MalioSelectCheckbox. */
+export interface RefOption {
+    value: string
+    label: string
+}
+
+/** Option de type de reglement enrichie de son code stable (RG-2.07 / RG-2.08). */
+export interface PaymentTypeOption extends RefOption {
+    code: string
+}
+
+/** Option de categorie enrichie de son code stable. */
+export interface CategoryOption extends RefOption {
+    code: string
+}
+
+interface HydraMember {
+    '@id': string
+}
+
+interface CategoryMember extends HydraMember {
+    code: string
+    name: string
+}
+
+interface SiteMember extends HydraMember {
+    name: string
+    postalCode: string
+}
+
+interface ReferentialMember extends HydraMember {
+    code: string
+    label: string
+}
+
+interface CountryMember extends HydraMember {
+    code: string
+    name: string
+}
+
+const LD_JSON_HEADERS = { Accept: 'application/ld+json' }
+
+export function useSupplierReferentials() {
+    const api = useApi()
+
+    const categories = ref<CategoryOption[]>([])
+    const sites = ref<RefOption[]>([])
+    const tvaModes = ref<RefOption[]>([])
+    const paymentDelays = ref<RefOption[]>([])
+    const paymentTypes = ref<PaymentTypeOption[]>([])
+    const banks = ref<RefOption[]>([])
+    const countries = ref<RefOption[]>([])
+
+    /** Recupere une collection complete (pagination desactivee) en Hydra. */
+    async function fetchAll<T extends HydraMember>(
+        url: string,
+        query: Record<string, string | string[]> = {},
+    ): Promise<T[]> {
+        const res = await api.get<{ member?: T[] }>(
+            url,
+            { pagination: 'false', ...query },
+            { headers: LD_JSON_HEADERS, toast: false },
+        )
+        return res.member ?? []
+    }
+
+    /**
+     * Charge en parallele les referentiels communs.
+     *
+     * Chargement RESILIENT (Promise.allSettled) : chaque referentiel est isole.
+     * Necessaire pour les roles metier qui n'ont pas toutes les permissions de
+     * lecture (ex. Compta a `commercial.suppliers.view` mais pas forcement
+     * `catalog.categories.view` ni `sites.view`). Un referentiel en echec reste
+     * simplement vide.
+     */
+    async function loadCommon(): Promise<void> {
+        await Promise.allSettled([
+            // Taxonomie multi-types (ERP-84) : un fournisseur ne porte que des
+            // categories de type FOURNISSEUR (RG-2.10) -> on filtre cote API.
+            fetchAll<CategoryMember>('/categories', { typeCode: 'FOURNISSEUR' })
+                .then((cats) => { categories.value = cats.map(c => ({ value: c['@id'], label: c.name, code: c.code })) }),
+            fetchAll<SiteMember>('/sites')
+                // Libelle = numero de departement (2 premiers chiffres du code
+                // postal du site), ex: 86100 -> « 86 ».
+                .then((sitesList) => { sites.value = sitesList.map(s => ({ value: s['@id'], label: (s.postalCode ?? '').slice(0, 2) })) }),
+            fetchAll<ReferentialMember>('/tva_modes')
+                .then((tva) => { tvaModes.value = tva.map(t => ({ value: t['@id'], label: t.label })) }),
+            fetchAll<ReferentialMember>('/payment_delays')
+                .then((delays) => { paymentDelays.value = delays.map(d => ({ value: d['@id'], label: d.label })) }),
+            fetchAll<ReferentialMember>('/payment_types')
+                .then((types) => { paymentTypes.value = types.map(t => ({ value: t['@id'], label: t.label, code: t.code })) }),
+            fetchAll<ReferentialMember>('/banks')
+                .then((banksList) => { banks.value = banksList.map(b => ({ value: b['@id'], label: b.label })) }),
+            // Pays (ERP-116) : la valeur d'option est le NOM du pays (et non l'IRI),
+            // car l'adresse stocke `country` en chaine libre (« France »...). On
+            // conserve ainsi la compatibilite avec les adresses existantes sans FK
+            // ni migration de donnees a ce stade. value === label. Aligne sur les
+            // clients (`useClientReferentials`) pour une liste de pays identique.
+            fetchAll<CountryMember>('/countries')
+                .then((list) => { countries.value = list.map(c => ({ value: c.name, label: c.name })) }),
+        ])
+    }
+
+    return {
+        categories,
+        sites,
+        tvaModes,
+        paymentDelays,
+        paymentTypes,
+        banks,
+        countries,
+        loadCommon,
+    }
+}
@@ -0,0 +1,54 @@
+import { usePaginatedList } from '~/shared/composables/usePaginatedList'
+
+/**
+ * Site Starseed rattache a une adresse du fournisseur, tel qu'embarque en LISTE
+ * (groupe site:read) pour la colonne « Site » du Repertoire (badges colores).
+ * Agrege des adresses cote back via Supplier::getSites() (cf. spec-back M2).
+ */
+export interface SupplierSite {
+    id: number
+    name: string
+    color: string
+}
+
+/**
+ * Categorie (type FOURNISSEUR) rattachee au fournisseur, embarquee en LISTE
+ * (groupe category:read). La colonne « Catégories » affiche le `name` (et non le
+ * `code` comme au M1 clients — decision spec-front M2 § Datatable).
+ */
+export interface SupplierCategory {
+    code: string
+    name: string
+}
+
+/**
+ * Vue MINIMALE d'un fournisseur pour le Repertoire (datatable). Volontairement
+ * partielle : seuls les champs des colonnes + l'id (navigation) sont types ici.
+ * Le detail complet (onglets) est hors perimetre de cet ecran (ERP-93).
+ */
+export interface Supplier {
+    id: number
+    companyName: string
+    categories: SupplierCategory[]
+    sites: SupplierSite[]
+    /** Date ISO de derniere modification (default:read) — colonne « Dernière activité ». */
+    updatedAt: string | null
+    isArchived: boolean
+}
+
+/**
+ * Repertoire fournisseurs (ERP-93) — simple enveloppe de `usePaginatedList<Supplier>`
+ * sur la ressource `/suppliers` (RG-13 : pagination serveur obligatoire ; jamais
+ * de chargement integral en memoire). Miroir de `useClientsRepository` (M1).
+ *
+ * Les filtres (recherche, categories, sites, inclusion des archives) sont pilotes
+ * par la page via `setFilters` du composable partage — la remise en page 1 est
+ * garantie.
+ *
+ * Volontairement PAR INSTANCE (pas de singleton module-level) : l'etat tableau
+ * est propre a l'ecran Repertoire et meurt avec lui, comme tout consommateur de
+ * `usePaginatedList`. Aucun reset au logout a gerer.
+ */
+export function useSuppliersRepository() {
+    return usePaginatedList<Supplier>({ url: '/suppliers' })
+}
@@ -0,0 +1,205 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { mount, flushPromises } from '@vue/test-utils'
+import { defineComponent, h, ref } from 'vue'
+
+// ── Auto-imports Nuxt stubbes globalement ───────────────────────────────────
+// La page ne les importe pas (auto-import) : on les expose en globals pour le
+// runtime de test (happy-dom). Meme philosophie que les autres specs commercial.
+const mockPush = vi.hoisted(() => vi.fn())
+const mockApiGet = vi.hoisted(() => vi.fn())
+const mockCan = vi.hoisted(() => vi.fn())
+const mockSetFilters = vi.hoisted(() => vi.fn())
+const mockFetch = vi.hoisted(() => vi.fn())
+const mockToastError = vi.hoisted(() => vi.fn())
+
+vi.stubGlobal('useI18n', () => ({ t: (key: string) => key }))
+vi.stubGlobal('useHead', () => undefined)
+vi.stubGlobal('useApi', () => ({ get: mockApiGet }))
+vi.stubGlobal('useRouter', () => ({ push: mockPush }))
+vi.stubGlobal('useToast', () => ({ error: mockToastError, success: vi.fn() }))
+vi.stubGlobal('usePermissions', () => ({ can: mockCan }))
+
+// Le repository est lui aussi un auto-import : on controle items + setFilters.
+vi.stubGlobal('useSuppliersRepository', () => ({
+    items: ref([
+        {
+            id: 7,
+            companyName: 'ACME',
+            categories: [{ code: 'NEG', name: 'Négociant' }],
+            sites: [{ id: 86, name: '86', color: '#123456' }],
+            updatedAt: '2026-01-15T10:00:00+00:00',
+        },
+    ]),
+    totalItems: ref(1),
+    currentPage: ref(1),
+    itemsPerPage: ref(10),
+    itemsPerPageOptions: ref([10, 25, 50]),
+    fetch: mockFetch,
+    goToPage: vi.fn(),
+    setItemsPerPage: vi.fn(),
+    setFilters: mockSetFilters,
+}))
+
+// happy-dom n'implemente pas createObjectURL : on ajoute les methodes statiques
+// sur la classe URL existante (sans la remplacer — sinon `new URL()` casse).
+globalThis.URL.createObjectURL = vi.fn(() => 'blob:fake')
+globalThis.URL.revokeObjectURL = vi.fn()
+
+// Import APRES les stubs (la page resout les auto-imports au top-level du module).
+const SuppliersIndex = (await import('../suppliers/index.vue')).default
+
+// ── Stubs de composants ──────────────────────────────────────────────────────
+const ButtonStub = defineComponent({
+    props: { label: { type: String, default: '' }, disabled: { type: Boolean, default: false } },
+    emits: ['click'],
+    setup(props, { emit }) {
+        return () => h('button', { 'data-label': props.label, onClick: () => emit('click') }, props.label)
+    },
+})
+
+const DataTableStub = defineComponent({
+    props: { items: { type: Array, default: () => [] } },
+    emits: ['row-click', 'update:page', 'update:per-page'],
+    setup(props, { emit }) {
+        return () => h('div', { 'data-testid': 'datatable' },
+            (props.items as Array<{ id: number }>).map(it =>
+                h('tr', { 'data-row-id': it.id, onClick: () => emit('row-click', it) }),
+            ),
+        )
+    },
+})
+
+const DrawerStub = defineComponent({
+    props: { modelValue: { type: Boolean, default: false } },
+    setup(_, { slots }) {
+        return () => h('div', {}, [slots.header?.(), slots.default?.(), slots.footer?.()])
+    },
+})
+
+const SlotStub = defineComponent({ setup(_, { slots }) { return () => h('div', {}, slots.default?.()) } })
+
+const PageHeaderStub = defineComponent({
+    setup(_, { slots }) { return () => h('div', {}, [slots.default?.(), slots.actions?.()]) },
+})
+
+const CheckboxStub = defineComponent({
+    props: { id: { type: String, default: '' }, modelValue: { type: Boolean, default: false } },
+    emits: ['update:model-value'],
+    setup(props, { emit }) {
+        return () => h('input', {
+            'type': 'checkbox',
+            'data-id': props.id,
+            'onChange': (e: Event) => emit('update:model-value', (e.target as HTMLInputElement).checked),
+        })
+    },
+})
+
+const InputTextStub = defineComponent({ setup() { return () => h('input') } })
+
+function mountPage() {
+    return mount(SuppliersIndex, {
+        global: {
+            stubs: {
+                PageHeader: PageHeaderStub,
+                MalioButton: ButtonStub,
+                MalioDataTable: DataTableStub,
+                MalioDrawer: DrawerStub,
+                MalioAccordion: SlotStub,
+                MalioAccordionItem: SlotStub,
+                MalioInputText: InputTextStub,
+                MalioCheckbox: CheckboxStub,
+            },
+        },
+    })
+}
+
+describe('Répertoire fournisseurs (page /suppliers)', () => {
+    beforeEach(() => {
+        mockPush.mockReset()
+        mockApiGet.mockReset().mockResolvedValue({ member: [] })
+        mockCan.mockReset().mockReturnValue(true)
+        mockSetFilters.mockReset()
+        mockFetch.mockReset()
+        mockToastError.mockReset()
+    })
+
+    it('charge la liste au montage', async () => {
+        mountPage()
+        await flushPromises()
+        expect(mockFetch).toHaveBeenCalled()
+    })
+
+    it('affiche « + Ajouter » uniquement avec la permission manage', async () => {
+        mockCan.mockImplementation((perm: string) => perm === 'commercial.suppliers.manage')
+        const wrapper = mountPage()
+        await flushPromises()
+        expect(wrapper.find('[data-label="commercial.suppliers.add"]').exists()).toBe(true)
+    })
+
+    it('masque « + Ajouter » sans la permission manage (view seul)', async () => {
+        mockCan.mockImplementation((perm: string) => perm === 'commercial.suppliers.view')
+        const wrapper = mountPage()
+        await flushPromises()
+        expect(wrapper.find('[data-label="commercial.suppliers.add"]').exists()).toBe(false)
+    })
+
+    it('navigue vers la consultation au clic sur une ligne', async () => {
+        const wrapper = mountPage()
+        await flushPromises()
+        await wrapper.find('tr[data-row-id="7"]').trigger('click')
+        expect(mockPush).toHaveBeenCalledWith('/suppliers/7')
+    })
+
+    it('charge les categories de type FOURNISSEUR pour le filtre', async () => {
+        mountPage()
+        await flushPromises()
+        expect(mockApiGet).toHaveBeenCalledWith(
+            '/categories',
+            expect.objectContaining({ pagination: 'false', typeCode: 'FOURNISSEUR' }),
+            expect.objectContaining({ toast: false }),
+        )
+    })
+
+    it('appelle l\'export XLSX sur /suppliers/export.xlsx en blob', async () => {
+        const wrapper = mountPage()
+        await flushPromises()
+        await wrapper.find('[data-label="commercial.suppliers.export"]').trigger('click')
+        await flushPromises()
+        expect(mockApiGet).toHaveBeenCalledWith(
+            '/suppliers/export.xlsx',
+            expect.any(Object),
+            expect.objectContaining({ responseType: 'blob', toast: false }),
+        )
+    })
+
+    it('repercute le filtre « Inclure les archivés » dans setFilters sans toucher l\'URL', async () => {
+        const wrapper = mountPage()
+        await flushPromises()
+
+        // Coche « Inclure les archivés » puis applique les filtres.
+        await wrapper.find('input[data-id="filter-include-archived"]').setValue(true)
+        await wrapper.find('[data-label="commercial.suppliers.filters.apply"]').trigger('click')
+
+        expect(mockSetFilters).toHaveBeenLastCalledWith(
+            { includeArchived: true },
+            { replace: true },
+        )
+        // Etat 100 % local (regle n°6) : aucune navigation/query string declenchee.
+        expect(mockPush).not.toHaveBeenCalled()
+    })
+
+    it('badge filtres actifs + Réinitialiser vide l\'etat applique', async () => {
+        const wrapper = mountPage()
+        await flushPromises()
+
+        await wrapper.find('input[data-id="filter-include-archived"]').setValue(true)
+        await wrapper.find('[data-label="commercial.suppliers.filters.apply"]').trigger('click')
+
+        // Le libelle du bouton Filtrer porte le compteur (1 filtre actif).
+        expect(wrapper.find('[data-label="commercial.suppliers.filters.title (1)"]').exists()).toBe(true)
+
+        // Réinitialiser → query propre (setFilters avec objet vide).
+        await wrapper.find('[data-label="commercial.suppliers.filters.reset"]').trigger('click')
+        expect(mockSetFilters).toHaveBeenLastCalledWith({}, { replace: true })
+    })
+})
@@ -0,0 +1,493 @@
+<template>
+    <div>
+        <!-- En-tete : retour repertoire + nom du client + actions (Modifier / Archiver|Restaurer). -->
+        <div class="flex items-center gap-3 pt-11">
+            <MalioButtonIcon
+                icon="mdi:arrow-left-bold"
+                icon-size="24"
+                variant="ghost"
+                v-bind="{ ariaLabel: t('commercial.clients.consultation.back') }"
+                @click="goBack"
+            />
+            <h1 class="text-[30px] font-semibold text-m-primary">{{ headerTitle }}</h1>
+
+            <!-- gap-12 = 48px : meme espacement que Ajouter / Filtres du repertoire. -->
+            <div class="ml-auto flex items-center gap-12">
+                <MalioButton
+                    v-if="canEdit"
+                    variant="secondary"
+                    icon-name="mdi:pencil-outline"
+                    icon-position="left"
+                    :label="t('commercial.clients.action.edit')"
+                    @click="goEdit"
+                />
+                <MalioButton
+                    v-if="showArchive"
+                    variant="secondary"
+                    icon-name="mdi:archive-arrow-down-outline"
+                    icon-position="left"
+                    :label="t('commercial.clients.action.archive')"
+                    @click="askToggleArchive"
+                />
+                <MalioButton
+                    v-if="showRestore"
+                    variant="secondary"
+                    icon-name="mdi:archive-arrow-up-outline"
+                    icon-position="left"
+                    :label="t('commercial.clients.action.restore')"
+                    @click="askToggleArchive"
+                />
+            </div>
+        </div>
+
+        <!-- Etats de chargement / introuvable. -->
+        <p v-if="loading" class="mt-12 text-center text-black/60">{{ t('commercial.clients.consultation.loading') }}</p>
+        <p v-else-if="error" class="mt-12 text-center text-m-danger">{{ t('commercial.clients.consultation.notFound') }}</p>
+
+        <template v-else-if="client">
+            <!-- ── Formulaire principal (lecture seule) ──────────────────────── -->
+            <div class="mt-[48px] grid grid-cols-3 xl:grid-cols-4 gap-x-[44px] gap-y-4">
+                <MalioInputText
+                    :model-value="client.companyName"
+                    :label="t('commercial.clients.form.main.companyName')"
+                    readonly
+                />
+                <MalioSelectCheckbox
+                    :model-value="categoryIris"
+                    :options="mainCategoryOptions"
+                    :label="t('commercial.clients.form.main.categories')"
+                    :display-tag="true"
+                    readonly
+                />
+                <!-- Relation toujours affichee (vide = « Aucun »), comme en edition. -->
+                <MalioSelect
+                    :model-value="relation.type"
+                    :options="relationOptions"
+                    :label="t('commercial.clients.form.main.relation')"
+                    :empty-option-label="t('commercial.clients.form.main.relationNone')"
+                    readonly
+                />
+                <!-- Nom du distributeur/courtier : conditionnel (libelle type-dependant,
+                     aucune valeur sans relation — meme comportement qu'en edition). -->
+                <MalioInputText
+                    v-if="relation.type"
+                    :model-value="relation.name"
+                    :label="relation.type === 'distributeur' ? t('commercial.clients.form.main.distributorName') : t('commercial.clients.form.main.brokerName')"
+                    readonly
+                />
+                <MalioCheckbox
+                    :model-value="client.triageService === true"
+                    :label="t('commercial.clients.form.main.triageService')"
+                    group-class="self-center"
+                    readonly
+                />
+            </div>
+
+            <!-- ── Onglets (navigation libre, tout en lecture seule) ─────────── -->
+            <MalioTabList v-model="activeTab" :tabs="tabs" :max-visible-tabs="5" :max-width="1100" class="mt-[60px]">
+                <!-- Onglet Information -->
+                <template #information>
+                    <div class="mt-12 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)]">
+                        <!-- pt-1/pb-1 alignent le textarea (h-full) en haut ET en bas
+                             sur les inputs (champ 40px centre dans un h-12 -> ~4px de
+                             coussin de chaque cote). -->
+                        <MalioInputTextArea
+                            :model-value="information.description"
+                            :label="t('commercial.clients.form.information.description')"
+                            resize="none"
+                            group-class="row-span-2 pt-1 pb-1"
+                            text-input="h-full text-lg"
+                            readonly
+                        />
+                        <MalioInputText
+                            :model-value="information.competitors"
+                            :label="t('commercial.clients.form.information.competitors')"
+                            readonly
+                        />
+                        <MalioDate
+                            :model-value="information.foundedAt"
+                            :label="t('commercial.clients.form.information.foundedAt')"
+                            readonly
+                        />
+                        <MalioInputText
+                            :model-value="information.employeesCount"
+                            :label="t('commercial.clients.form.information.employeesCount')"
+                            readonly
+                        />
+                        <MalioInputAmount
+                            :model-value="information.revenueAmount"
+                            :label="t('commercial.clients.form.information.revenueAmount')"
+                            readonly
+                        />
+                        <MalioInputText
+                            :model-value="information.directorName"
+                            :label="t('commercial.clients.form.information.directorName')"
+                            readonly
+                        />
+                        <MalioInputAmount
+                            :model-value="information.profitAmount"
+                            :label="t('commercial.clients.form.information.profitAmount')"
+                            readonly
+                        />
+                    </div>
+                </template>
+
+                <!-- Onglet Contact -->
+                <template #contact>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <ClientContactBlock
+                            v-for="(contact, index) in contacts"
+                            :key="contact.id ?? index"
+                            :model-value="contact"
+                            :title="t('commercial.clients.form.contact.title', { n: index + 1 })"
+                            readonly
+                        />
+                    </div>
+                </template>
+
+                <!-- Onglet Adresse -->
+                <template #address>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <ClientAddressBlock
+                            v-for="(view, index) in addressViews"
+                            :key="view.draft.id ?? index"
+                            :model-value="view.draft"
+                            :title="t('commercial.clients.form.address.title', { n: index + 1 })"
+                            :category-options="view.categoryOptions"
+                            :site-options="allSiteOptions"
+                            :contact-options="contactOptions"
+                            :country-options="countryOptions"
+                            readonly
+                        />
+                    </div>
+                </template>
+
+                <!-- Onglet Comptabilite (present uniquement si accounting.view). -->
+                <template v-if="canAccountingView" #accounting>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <div class="bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]">
+                            <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                                <MalioInputText
+                                    :model-value="accounting.siren"
+                                    :label="t('commercial.clients.form.accounting.siren')"
+                                    :mask="SIREN_MASK"
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="accounting.accountNumber"
+                                    :label="t('commercial.clients.form.accounting.accountNumber')"
+                                    readonly
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.tvaModeIri"
+                                    :options="tvaModeOptions"
+                                    :label="t('commercial.clients.form.accounting.tvaMode')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="accounting.nTva"
+                                    :label="t('commercial.clients.form.accounting.nTva')"
+                                    readonly
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.paymentDelayIri"
+                                    :options="paymentDelayOptions"
+                                    :label="t('commercial.clients.form.accounting.paymentDelay')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.paymentTypeIri"
+                                    :options="paymentTypeOptions"
+                                    :label="t('commercial.clients.form.accounting.paymentType')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                                <MalioSelect
+                                    v-if="accounting.bankIri"
+                                    :model-value="accounting.bankIri"
+                                    :options="bankOptions"
+                                    :label="t('commercial.clients.form.accounting.bank')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                            </div>
+                        </div>
+
+                        <!-- Blocs RIB (0..n), lecture seule. -->
+                        <div
+                            v-for="(rib, index) in ribs"
+                            :key="rib.id ?? index"
+                            class="bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]"
+                        >
+                            <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                                <MalioInputText
+                                    :model-value="rib.label"
+                                    :label="t('commercial.clients.form.accounting.ribLabel')"
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="rib.bic"
+                                    :label="t('commercial.clients.form.accounting.ribBic')"
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="rib.iban"
+                                    :label="t('commercial.clients.form.accounting.ribIban')"
+                                    readonly
+                                />
+                            </div>
+                        </div>
+                    </div>
+                </template>
+
+                <!-- Onglets non encore implementes : frame vide (navigation libre). -->
+                <template #transport><ComingSoonPlaceholder /></template>
+                <template #statistics><ComingSoonPlaceholder /></template>
+                <template #reports><ComingSoonPlaceholder /></template>
+                <template #exchanges><ComingSoonPlaceholder /></template>
+            </MalioTabList>
+        </template>
+
+        <!-- Modal de confirmation Archiver / Restaurer. -->
+        <MalioModal v-model="confirmOpen" modal-class="max-w-md">
+            <template #header>
+                <h2 class="text-[24px] font-bold">
+                    {{ isArchived ? t('commercial.clients.consultation.confirmRestore.title') : t('commercial.clients.consultation.confirmArchive.title') }}
+                </h2>
+            </template>
+            <p>{{ isArchived ? t('commercial.clients.consultation.confirmRestore.message') : t('commercial.clients.consultation.confirmArchive.message') }}</p>
+            <template #footer>
+                <MalioButton
+                    variant="secondary"
+                    button-class="flex-1"
+                    :label="t('commercial.clients.form.confirmDelete.cancel')"
+                    @click="confirmOpen = false"
+                />
+                <MalioButton
+                    :variant="isArchived ? 'primary' : 'danger'"
+                    button-class="flex-1"
+                    :label="t('commercial.clients.form.confirmDelete.confirm')"
+                    :disabled="toggling"
+                    @click="confirmToggleArchive"
+                />
+            </template>
+        </MalioModal>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import { useClient } from '~/modules/commercial/composables/useClient'
+import { buildClientFormTabKeys, isRibRequiredForPaymentType } from '~/modules/commercial/utils/forms/clientFormRules'
+import { readHistoryTab } from '~/shared/utils/historyTab'
+import {
+    canEditClient,
+    categoryOptionsOf,
+    contactOptionsOf,
+    mapAccountingDraft,
+    mapAddressView,
+    mapContactToDraft,
+    mapRibToDraft,
+    paymentTypeCodeOf,
+    referentialOptionOf,
+    relationOf,
+    showArchiveAction,
+    showRestoreAction,
+    type ClientDetail,
+    type SelectOption,
+} from '~/modules/commercial/utils/forms/clientConsultation'
+import { emptyAddress, emptyContact } from '~/modules/commercial/types/clientForm'
+
+// Masque d'affichage (purement visuel, la donnee reste celle du serveur).
+const SIREN_MASK = '#########'
+
+const { t } = useI18n()
+const route = useRoute()
+const router = useRouter()
+const toast = useToast()
+const { can, canAny } = usePermissions()
+const authStore = useAuthStore()
+
+// Gating de la route : la consultation exige `view`. Usine (sans view) est
+// redirige vers le repertoire (lui-meme protege). Cf. matrice § 2.7.
+if (!can('commercial.clients.view')) {
+    await navigateTo('/clients')
+}
+
+const clientId = route.params.id as string
+
+const { client, loading, error, load, archive, restore } = useClient(clientId)
+
+// ── Permissions / visibilite des actions ───────────────────────────────────
+const canAccountingView = computed(() => can('commercial.clients.accounting.view'))
+const canEdit = computed(() => canEditClient(canAny))
+const isArchived = computed(() => client.value?.isArchived === true)
+const showArchive = computed(() => showArchiveAction(can, isArchived.value))
+const showRestore = computed(() => showRestoreAction(can, isArchived.value))
+
+const headerTitle = computed(() => client.value?.companyName ?? t('commercial.clients.consultation.title'))
+
+// ── Donnees derivees du payload (lecture seule) ────────────────────────────
+const relation = computed(() => (client.value ? relationOf(client.value) : { type: null, name: null }))
+const categoryIris = computed(() => (client.value?.categories ?? []).map(c => c['@id']))
+
+const information = computed(() => ({
+    description: client.value?.description ?? null,
+    competitors: client.value?.competitors ?? null,
+    // MalioDate attend strictement YYYY-MM-DD : on tronque l'ISO datetime renvoye.
+    foundedAt: client.value?.foundedAt ? client.value.foundedAt.slice(0, 10) : null,
+    employeesCount: client.value?.employeesCount != null ? String(client.value.employeesCount) : null,
+    revenueAmount: client.value?.revenueAmount ?? null,
+    profitAmount: client.value?.profitAmount ?? null,
+    directorName: client.value?.directorName ?? null,
+}))
+
+// Chaque bloc reste visible meme vide en consultation : si la collection est
+// vide, on affiche un bloc vierge en lecture seule (pas de message « Aucun … »).
+const contacts = computed(() => {
+    const list = (client.value?.contacts ?? []).map(mapContactToDraft)
+    return list.length ? list : [emptyContact()]
+})
+// Vue par adresse : brouillon + options (sites/categories) propres a l'adresse.
+const addressViews = computed(() => {
+    const views = (client.value?.addresses ?? []).map(mapAddressView)
+    return views.length ? views : [{ draft: emptyAddress(), siteOptions: [], categoryOptions: [] }]
+})
+// Exception au placeholder ci-dessus : on n'affiche AUCUN bloc RIB quand le
+// client n'en a pas. Pas de bloc vierge fantome en consultation.
+// ERP-121 : un client peut desormais conserver des RIB « dormants » apres etre
+// repasse hors-LCR (on ne les supprime plus). En consultation, decision metier =
+// on les masque TOTALEMENT : on n'affiche les RIB que si le type de reglement
+// courant est LCR (le `code` est embarque sous client:read:accounting).
+const ribs = computed(() =>
+    isRibRequiredForPaymentType(paymentTypeCodeOf(client.value?.paymentType))
+        ? (client.value?.ribs ?? []).map(mapRibToDraft)
+        : [],
+)
+// Draft comptable (tout null si l'utilisateur n'a pas accounting.view).
+const accounting = computed(() => mapAccountingDraft(client.value ?? ({} as ClientDetail)))
+
+// ── Options des selects (construites depuis l'EMBED, jamais via un GET de
+//    referentiel : /categories et /sites sont en 403 pour les roles metier
+//    non-admin, ce qui laisserait les libelles vides). ───────────────────────
+const mainCategoryOptions = computed(() => categoryOptionsOf(client.value?.categories))
+const contactOptions = computed(() => contactOptionsOf(client.value?.contacts))
+
+// Liste COMPLETE des sites disponibles, issue de /api/me (groupe me:read — donc
+// pas de 403 pour les roles metier, contrairement a GET /sites). Libelle = numero
+// de departement (2 premiers chiffres du code postal). Permet d'afficher TOUJOURS
+// toutes les cases « Sites » (86 / 17 / 82) dans le bloc adresse, meme celles non
+// rattachees a l'adresse consultee (les rattachees restent cochees via siteIris).
+const allSiteOptions = computed<SelectOption[]>(() =>
+    (authStore.user?.sites ?? []).map(s => ({
+        value: `/api/sites/${s.id}`,
+        label: (s.postalCode ?? '').slice(0, 2),
+    })),
+)
+
+const relationOptions = computed<SelectOption[]>(() => [
+    { value: 'distributeur', label: t('commercial.clients.form.main.relationDistributor') },
+    { value: 'courtier', label: t('commercial.clients.form.main.relationBroker') },
+])
+
+// Pays (ERP-116) : options construites depuis l'EMBED des adresses (jamais via
+// GET /countries, sur le meme principe que les autres selects de consultation
+// — en 403 pour les roles metier non-admin). Valeur = nom du pays stocke tel
+// quel dans l'adresse, donc value === label ; suffit a afficher le libelle en
+// lecture seule.
+const countryOptions = computed<SelectOption[]>(() =>
+    [...new Set(
+        (client.value?.addresses ?? [])
+            .map(a => a.country)
+            .filter((c): c is string => !!c),
+    )].map(c => ({ value: c, label: c })),
+)
+
+// Selects comptables : libelle issu de l'embed (option unique ou vide).
+const tvaModeOptions = computed(() => referentialOptionOf(client.value?.tvaMode))
+const paymentDelayOptions = computed(() => referentialOptionOf(client.value?.paymentDelay))
+const paymentTypeOptions = computed(() => referentialOptionOf(client.value?.paymentType))
+const bankOptions = computed(() => referentialOptionOf(client.value?.bank))
+
+// ── Onglets : navigation LIBRE (pas de sequence forcee en consultation) ────
+// 4 onglets actifs (Information, Contact, Adresse, + Comptabilite si droit) et
+// 4 coquilles (Transport, Statistiques, Rapports, Echanges).
+const tabKeys = computed(() => buildClientFormTabKeys(canAccountingView.value, { includeEditOnlyTabs: true }))
+
+const TAB_ICONS: Record<string, string> = {
+    information: 'mdi:account-outline',
+    contact: 'mdi:account-box-plus-outline',
+    address: 'mdi:map-marker-outline',
+    transport: 'mdi:truck-delivery-outline',
+    accounting: 'mdi:bank-circle-outline',
+    statistics: 'mdi:finance',
+    reports: 'mdi:file-document-edit-outline',
+    exchanges: 'mdi:account-group-outline',
+}
+
+const tabs = computed(() => tabKeys.value.map(key => ({
+    key,
+    label: t(`commercial.clients.tab.${key}`),
+    icon: TAB_ICONS[key],
+})))
+
+// Onglet initial : repris de l'edition au retour (history.state), sinon Information.
+const activeTab = ref(readHistoryTab(tabKeys.value) ?? 'information')
+
+// ── Navigation ─────────────────────────────────────────────────────────────
+function goBack(): void {
+    router.push('/clients')
+}
+
+/** Bascule en edition en conservant l'onglet courant (via history.state). */
+function goEdit(): void {
+    router.push({ path: `/clients/${clientId}/edit`, state: { tab: activeTab.value } })
+}
+
+// ── Archivage / Restauration ────────────────────────────────────────────────
+const confirmOpen = ref(false)
+const toggling = ref(false)
+
+function askToggleArchive(): void {
+    confirmOpen.value = true
+}
+
+/**
+ * Confirme l'archivage ou la restauration (PATCH isArchived seul). Gere le 409
+ * de conflit d'homonyme actif a la restauration (RG-1.23) avec un message dedie.
+ */
+async function confirmToggleArchive(): Promise<void> {
+    if (toggling.value) return
+    toggling.value = true
+    const restoring = isArchived.value
+    try {
+        if (restoring) {
+            await restore()
+            toast.success({ title: t('commercial.clients.toast.restoreSuccess') })
+        }
+        else {
+            await archive()
+            toast.success({ title: t('commercial.clients.toast.archiveSuccess') })
+        }
+        confirmOpen.value = false
+    }
+    catch (e) {
+        const status = (e as { response?: { status?: number } })?.response?.status
+        toast.error({
+            title: t('commercial.clients.toast.error'),
+            message: restoring && status === 409
+                ? t('commercial.clients.toast.restoreConflict')
+                : t('commercial.clients.toast.error'),
+        })
+    }
+    finally {
+        toggling.value = false
+    }
+}
+
+useHead({ title: headerTitle })
+
+onMounted(load)
+</script>
@@ -0,0 +1,434 @@
+<template>
+    <div>
+        <PageHeader>
+            {{ t('commercial.clients.title') }}
+            <template #actions>
+                <!-- gap-8 = 32px d'espacement entre Filtres et Ajouter. -->
+                <div class="flex items-center gap-8">
+                    <!-- Bouton Filtres a GAUCHE d'Ajouter. Le compteur reflete les filtres actifs. -->
+                    <MalioButton
+                        v-if="canView"
+                        variant="tertiary"
+                        :label="filterButtonLabel"
+                        icon-name="mdi:tune"
+                        icon-position="left"
+                        icon-size="24"
+                        @click="openFilters"
+                    />
+                    <MalioButton
+                        v-if="canManage"
+                        variant="secondary"
+                        :label="t('commercial.clients.add')"
+                        icon-name="mdi:add-bold"
+                        icon-position="left"
+                        @click="goToCreate"
+                    />
+                </div>
+            </template>
+        </PageHeader>
+
+        <!-- Datatable branchee sur usePaginatedList via useClientsRepository :
+             pagination serveur, tri companyName ASC par defaut (cote back). -->
+        <MalioDataTable
+            :columns="columns"
+            :items="rows"
+            :total-items="totalItems"
+            :page="currentPage"
+            :per-page="itemsPerPage"
+            :per-page-options="itemsPerPageOptions"
+            row-clickable
+            table-class="table-fixed clients-table"
+            :empty-message="t('commercial.clients.empty')"
+            @row-click="onRowClick"
+            @update:page="goToPage"
+            @update:per-page="setItemsPerPage"
+        >
+            <!-- Categories : codes stables separes par une virgule (ERP-78). -->
+            <template #cell-categories="{ item }">
+                {{ formatCategories(item) }}
+            </template>
+
+            <!-- Sites : badges colores (name + color), agreges des adresses. -->
+            <template #cell-sites="{ item }">
+                <span class="flex flex-wrap gap-1">
+                    <span
+                        v-for="site in (item.sites as ClientSite[])"
+                        :key="site.id"
+                        class="inline-flex items-center rounded-full px-2 py-0.5 font-medium text-white"
+                        :style="{ backgroundColor: site.color }"
+                    >
+                        {{ site.name }}
+                    </span>
+                </span>
+            </template>
+
+            <!-- Derniere activite : date de derniere modification (updatedAt). -->
+            <template #cell-lastActivity="{ item }">
+                {{ formatLastActivity(item) }}
+            </template>
+        </MalioDataTable>
+
+        <div class="flex justify-center mt-4">
+            <MalioButton
+                v-if="canView"
+                variant="primary"
+                :label="t('commercial.clients.export')"
+                :disabled="exporting"
+                @click="exportXlsx"
+            />
+        </div>
+
+        <!-- Drawer de filtres : etat BROUILLON, applique uniquement au clic sur
+             « Appliquer ». Meme pattern que l'audit-log. Etat 100 % local, jamais
+             dans l'URL (regle ABSOLUE n°6). -->
+        <MalioDrawer
+            v-model="filterDrawerOpen"
+            drawer-class="max-w-[450px]"
+            body-class="p-0"
+            footer-class="justify-between border-t border-black p-6"
+        >
+            <template #header>
+                <h2 class="text-[24px] font-bold uppercase">{{ t('commercial.clients.filters.title') }}</h2>
+            </template>
+
+            <MalioAccordion>
+                <!-- Recherche : nom societe + contact + email (param `search`). -->
+                <MalioAccordionItem :title="t('commercial.clients.filters.search')" value="search">
+                    <MalioInputText
+                        v-model="draftSearch"
+                        icon-name="mdi:magnify"
+                    />
+                </MalioAccordionItem>
+
+                <!-- Categories : cases a cocher (multi). Valeur = code stable. -->
+                <MalioAccordionItem :title="t('commercial.clients.filters.categories')" value="categories">
+                    <div class="flex flex-col">
+                        <MalioCheckbox
+                            v-for="opt in categoryOptions"
+                            :id="`filter-category-${opt.value}`"
+                            :key="opt.value"
+                            :label="opt.label"
+                            :model-value="draftCategoryCodes.includes(opt.value)"
+                            @update:model-value="(val: boolean) => toggleCategory(opt.value, val)"
+                        />
+                    </div>
+                </MalioAccordionItem>
+
+                <!-- Sites : cases a cocher (multi). Valeur = id du site. -->
+                <MalioAccordionItem :title="t('commercial.clients.filters.sites')" value="sites">
+                    <div class="flex flex-col">
+                        <MalioCheckbox
+                            v-for="opt in siteOptions"
+                            :id="`filter-site-${opt.value}`"
+                            :key="opt.value"
+                            :label="opt.label"
+                            :model-value="draftSiteIds.includes(opt.value)"
+                            @update:model-value="(val: boolean) => toggleSite(opt.value, val)"
+                        />
+                    </div>
+                </MalioAccordionItem>
+
+                <!-- Statut : bool unique. Coche = archives uniquement, sinon actifs. -->
+                <MalioAccordionItem :title="t('commercial.clients.filters.status')" value="status">
+                    <MalioCheckbox
+                        id="filter-archived-only"
+                        :label="t('commercial.clients.filters.archivedOnly')"
+                        :model-value="draftArchivedOnly"
+                        @update:model-value="(val: boolean) => draftArchivedOnly = val"
+                    />
+                </MalioAccordionItem>
+            </MalioAccordion>
+
+            <template #footer>
+                <MalioButton
+                    variant="tertiary"
+                    :label="t('commercial.clients.filters.reset')"
+                    button-class="w-m-btn-action"
+                    @click="resetFilters"
+                />
+                <MalioButton
+                    variant="primary"
+                    :label="t('commercial.clients.filters.apply')"
+                    button-class="w-[170px]"
+                    @click="applyFilters"
+                />
+            </template>
+        </MalioDrawer>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import type { Client, ClientSite } from '~/modules/commercial/composables/useClientsRepository'
+
+interface FilterOption {
+    value: string
+    label: string
+}
+
+const { t } = useI18n()
+const api = useApi()
+const router = useRouter()
+const toast = useToast()
+const { can } = usePermissions()
+
+useHead({ title: t('commercial.clients.title') })
+
+// Bouton « Ajouter » reserve a `manage` (POST /clients garde manage seul →
+// Compta / Usine ne creent pas). « Exporter » et « Filtres » suivent `view`.
+const canManage = computed(() => can('commercial.clients.manage'))
+const canView = computed(() => can('commercial.clients.view'))
+
+const {
+    items: clients,
+    totalItems,
+    currentPage,
+    itemsPerPage,
+    itemsPerPageOptions,
+    fetch: loadClients,
+    goToPage,
+    setItemsPerPage,
+    setFilters,
+} = useClientsRepository()
+
+// Mappe les clients en objets « plats » pour MalioDataTable (items typees
+// Record<string, unknown>[]) : un objet litteral porte une signature d'index
+// implicite, contrairement a l'interface Client. Meme pattern que sites.vue.
+const rows = computed(() => clients.value.map(client => ({
+    id: client.id,
+    companyName: client.companyName,
+    categories: client.categories,
+    sites: client.sites,
+    updatedAt: client.updatedAt,
+})))
+
+const columns = [
+    { key: 'companyName', label: t('commercial.clients.column.companyName') },
+    { key: 'categories', label: t('commercial.clients.column.categories') },
+    { key: 'sites', label: t('commercial.clients.column.sites') },
+    { key: 'lastActivity', label: t('commercial.clients.column.lastActivity') },
+]
+
+/** Codes des categories du client, separes par une virgule (ERP-78). */
+function formatCategories(item: Record<string, unknown>): string {
+    const categories = (item.categories as Client['categories']) ?? []
+    return categories.map(c => c.code).join(', ')
+}
+
+/**
+ * Derniere activite : faute de suivi d'activite metier au M1, on affiche la
+ * date de derniere modification de la fiche (updatedAt, expose en liste via
+ * default:read). Format court francais jj/mm/aaaa.
+ */
+function formatLastActivity(item: Record<string, unknown>): string {
+    const value = item.updatedAt as string | null | undefined
+    if (!value) {
+        return ''
+    }
+
+    // Garde-fou date invalide : un updatedAt mal forme donnerait « Invalid Date ».
+    const date = new Date(value)
+    if (Number.isNaN(date.getTime())) {
+        return ''
+    }
+
+    return date.toLocaleDateString('fr-FR')
+}
+
+/** Clic sur une ligne → ecran Consultation (route a plat /clients/{id}). */
+function onRowClick(item: Record<string, unknown>): void {
+    router.push(`/clients/${item.id}`)
+}
+
+function goToCreate(): void {
+    router.push('/clients/new')
+}
+
+// ── Filtres (drawer) ────────────────────────────────────────────────────────
+// Deux niveaux d'etat (pattern audit-log) :
+//  - APPLIED : pilote la liste/l'export + le compteur du bouton. Modifie
+//    uniquement au clic « Appliquer » / « Réinitialiser ».
+//  - DRAFT : edite librement dans le drawer ; recopie vers applied a la validation.
+const filterDrawerOpen = ref(false)
+
+const draftSearch = ref('')
+const draftCategoryCodes = ref<string[]>([])
+const draftSiteIds = ref<string[]>([])
+const draftArchivedOnly = ref(false)
+
+const appliedSearch = ref('')
+const appliedCategoryCodes = ref<string[]>([])
+const appliedSiteIds = ref<string[]>([])
+const appliedArchivedOnly = ref(false)
+
+// Options des selects multi, chargees une fois (referentiels courts).
+const categoryOptions = ref<FilterOption[]>([])
+const siteOptions = ref<FilterOption[]>([])
+
+const activeFilterCount = computed(() => {
+    let count = 0
+    if (appliedSearch.value.trim() !== '') count++
+    if (appliedCategoryCodes.value.length > 0) count++
+    if (appliedSiteIds.value.length > 0) count++
+    if (appliedArchivedOnly.value) count++
+    return count
+})
+
+const filterButtonLabel = computed(() => {
+    const base = t('commercial.clients.filters.title')
+    return activeFilterCount.value > 0 ? `${base} (${activeFilterCount.value})` : base
+})
+
+// Recopie l'etat applique vers le brouillon puis ouvre le drawer : la
+// reouverture reflete les filtres actifs.
+function openFilters(): void {
+    draftSearch.value = appliedSearch.value
+    draftCategoryCodes.value = [...appliedCategoryCodes.value]
+    draftSiteIds.value = [...appliedSiteIds.value]
+    draftArchivedOnly.value = appliedArchivedOnly.value
+    filterDrawerOpen.value = true
+}
+
+function toggleCategory(code: string, selected: boolean): void {
+    draftCategoryCodes.value = selected
+        ? [...draftCategoryCodes.value, code]
+        : draftCategoryCodes.value.filter(c => c !== code)
+}
+
+function toggleSite(id: string, selected: boolean): void {
+    draftSiteIds.value = selected
+        ? [...draftSiteIds.value, id]
+        : draftSiteIds.value.filter(s => s !== id)
+}
+
+/**
+ * Construit le payload de filtres serveur a partir de l'etat applique. Cles
+ * `categoryCode[]` / `siteId[]` pour que PHP les parse en tableaux (OR cote back).
+ * Les filtres vides sont omis pour une query propre.
+ */
+function buildFilterPayload(): Record<string, string | string[] | boolean> {
+    const payload: Record<string, string | string[] | boolean> = {}
+    if (appliedSearch.value.trim() !== '') payload.search = appliedSearch.value.trim()
+    if (appliedCategoryCodes.value.length > 0) payload['categoryCode[]'] = [...appliedCategoryCodes.value]
+    if (appliedSiteIds.value.length > 0) payload['siteId[]'] = [...appliedSiteIds.value]
+    if (appliedArchivedOnly.value) payload.archivedOnly = true
+    return payload
+}
+
+// « Appliquer » : recopie brouillon → applied, pousse les filtres (retombe en
+// page 1 via usePaginatedList) et ferme le drawer.
+function applyFilters(): void {
+    appliedSearch.value = draftSearch.value.trim()
+    appliedCategoryCodes.value = [...draftCategoryCodes.value]
+    appliedSiteIds.value = [...draftSiteIds.value]
+    appliedArchivedOnly.value = draftArchivedOnly.value
+
+    setFilters(buildFilterPayload(), { replace: true })
+    filterDrawerOpen.value = false
+}
+
+// « Réinitialiser » : vide brouillon ET applied, recharge la liste complete.
+// Le drawer reste ouvert pour montrer le formulaire vide.
+function resetFilters(): void {
+    draftSearch.value = ''
+    draftCategoryCodes.value = []
+    draftSiteIds.value = []
+    draftArchivedOnly.value = false
+
+    appliedSearch.value = ''
+    appliedCategoryCodes.value = []
+    appliedSiteIds.value = []
+    appliedArchivedOnly.value = false
+
+    setFilters({}, { replace: true })
+}
+
+/** Charge les referentiels du drawer (categories + sites) via ?pagination=false. */
+async function loadFilterOptions(): Promise<void> {
+    const [cats, sites] = await Promise.all([
+        api.get<{ member?: Array<{ code: string, name: string }> }>(
+            '/categories',
+            // Taxonomie multi-types (ERP-84) : le filtre du repertoire client ne
+            // propose que les categories de type CLIENT (pas les FOURNISSEUR).
+            { pagination: 'false', typeCode: 'CLIENT' },
+            { headers: { Accept: 'application/ld+json' }, toast: false },
+        ),
+        api.get<{ member?: Array<{ id: number, name: string }> }>(
+            '/sites',
+            { pagination: 'false' },
+            { headers: { Accept: 'application/ld+json' }, toast: false },
+        ),
+    ])
+
+    categoryOptions.value = (cats.member ?? []).map(c => ({ value: c.code, label: c.name }))
+    siteOptions.value = (sites.member ?? []).map(s => ({ value: String(s.id), label: s.name }))
+}
+
+// ── Export XLSX ─────────────────────────────────────────────────────────────
+// Memes filtres que la vue. La colonne SIREN n'est dans le fichier que si
+// l'utilisateur a accounting.view (gere cote back).
+const exporting = ref(false)
+
+async function exportXlsx(): Promise<void> {
+    if (exporting.value) {
+        return
+    }
+    exporting.value = true
+    try {
+        // useApi type ses options en JSON ; l'export renvoie un binaire, donc on
+        // force responseType:'blob' (transmis tel quel a ofetch au runtime). Cast
+        // contenu faute d'overload blob sur le client partage — a generaliser via
+        // un ticket dedie si d'autres exports binaires arrivent.
+        const blob = await api.get<Blob>('/clients/export.xlsx', buildFilterPayload(), {
+            responseType: 'blob',
+            toast: false,
+        } as unknown as Parameters<typeof api.get>[2])
+
+        triggerDownload(blob, 'repertoire-clients.xlsx')
+    }
+    catch {
+        toast.error({
+            title: t('commercial.clients.toast.error'),
+            message: t('commercial.clients.toast.exportError'),
+        })
+    }
+    finally {
+        exporting.value = false
+    }
+}
+
+/** Declenche le telechargement d'un blob via un lien temporaire. */
+function triggerDownload(blob: Blob, filename: string): void {
+    const url = URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = filename
+    document.body.appendChild(link)
+    link.click()
+    link.remove()
+    URL.revokeObjectURL(url)
+}
+
+onMounted(() => {
+    loadClients()
+    // Echec du chargement des referentiels non bloquant : la liste s'affiche,
+    // l'utilisateur perd juste les options de filtre.
+    loadFilterOptions().catch(() => {
+        categoryOptions.value = []
+        siteOptions.value = []
+    })
+})
+</script>
+
+<style scoped>
+/*
+ * Colonne Sites uniquement (3e colonne : companyName, categories, SITES,
+ * lastActivity) : ses badges rendent la cellule trop haute. On reduit le padding
+ * vertical de SON td (16px Malio -> 8px) sans toucher les autres colonnes ni les
+ * couleurs/tailles (qui restent sur les defauts Malio).
+ */
+:deep(.clients-table tbody td:nth-child(3)) {
+    padding-top: 8px;
+    padding-bottom: 8px;
+}
+</style>
@@ -0,0 +1,946 @@
+<template>
+    <div>
+        <!-- En-tete : retour consultation + nom du fournisseur. -->
+        <div class="flex items-center gap-3 pt-11">
+            <MalioButtonIcon
+                icon="mdi:arrow-left-bold"
+                icon-size="24"
+                variant="ghost"
+                v-bind="{ ariaLabel: t('commercial.suppliers.edit.back') }"
+                @click="goBack"
+            />
+            <h1 class="text-[30px] font-semibold text-m-primary">{{ headerTitle }}</h1>
+        </div>
+
+        <!-- Etats de chargement / introuvable. -->
+        <p v-if="loading" class="mt-12 text-center text-black/60">{{ t('commercial.suppliers.edit.loading') }}</p>
+        <p v-else-if="error" class="mt-12 text-center text-m-danger">{{ t('commercial.suppliers.edit.notFound') }}</p>
+
+        <template v-else-if="supplier">
+            <!-- ── Bloc principal (pre-rempli, editable si `manage`) ──────────────
+                 Conserve en modification (miroir client) ; edite via son propre
+                 PATCH scope sur le groupe supplier:write:main. Readonly pour les
+                 roles sans `manage` (ex. Compta). Pas de contact inline (ERP-106). -->
+            <div class="mt-[48px] grid grid-cols-3 xl:grid-cols-4 gap-x-[44px] gap-y-4">
+                <MalioInputText
+                    v-model="main.companyName"
+                    :label="t('commercial.suppliers.form.main.companyName')"
+                    :required="true"
+                    :readonly="businessReadonly"
+                    :error="mainErrors.errors.companyName"
+                />
+                <MalioSelectCheckbox
+                    :model-value="main.categoryIris"
+                    :options="mainCategoryOptions"
+                    :label="t('commercial.suppliers.form.main.categories')"
+                    :display-tag="true"
+                    :readonly="businessReadonly"
+                    :required="true"
+                    :error="mainErrors.errors.categories"
+                    @update:model-value="(v: (string | number)[]) => main.categoryIris = v.map(String)"
+                />
+            </div>
+
+            <div v-if="!businessReadonly" class="mt-12 flex justify-center">
+                <MalioButton
+                    variant="primary"
+                    :label="t('commercial.suppliers.edit.save')"
+                    :disabled="mainSubmitting"
+                    @click="submitMain"
+                />
+            </div>
+
+            <!-- ── Onglets : navigation LIBRE, edition independante par onglet ──── -->
+            <MalioTabList v-model="activeTab" :tabs="tabs" :max-visible-tabs="5" :max-width="1100" class="mt-[60px]">
+                <!-- Onglet Information -->
+                <template #information>
+                    <div class="mt-12 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)]">
+                        <!-- pt-1/pb-1 alignent le textarea (h-full) sur les inputs. -->
+                        <MalioInputTextArea
+                            v-model="information.description"
+                            :label="t('commercial.suppliers.form.information.description')"
+                            resize="none"
+                            group-class="row-span-2 pt-1 pb-1"
+                            text-input="h-full text-lg"
+                            :readonly="businessReadonly"
+                            :error="informationErrors.errors.description"
+                        />
+                        <MalioInputText
+                            v-model="information.competitors"
+                            :label="t('commercial.suppliers.form.information.competitors')"
+                            :readonly="businessReadonly"
+                            :error="informationErrors.errors.competitors"
+                        />
+                        <MalioDate
+                            v-model="information.foundedAt"
+                            :label="t('commercial.suppliers.form.information.foundedAt')"
+                            :readonly="businessReadonly"
+                            :editable="true"
+                            :error="informationErrors.errors.foundedAt"
+                            @update:raw-value="(v: string) => information.foundedAtRaw = v"
+                        />
+                        <MalioInputText
+                            v-model="information.employeesCount"
+                            :label="t('commercial.suppliers.form.information.employeesCount')"
+                            :mask="EMPLOYEES_MASK"
+                            :readonly="businessReadonly"
+                            :error="informationErrors.errors.employeesCount"
+                        />
+                        <MalioInputAmount
+                            v-model="information.revenueAmount"
+                            :label="t('commercial.suppliers.form.information.revenueAmount')"
+                            :readonly="businessReadonly"
+                            :error="informationErrors.errors.revenueAmount"
+                        />
+                        <MalioInputText
+                            v-model="information.directorName"
+                            :label="t('commercial.suppliers.form.information.directorName')"
+                            :readonly="businessReadonly"
+                            :error="informationErrors.errors.directorName"
+                        />
+                        <MalioInputAmount
+                            v-model="information.profitAmount"
+                            :label="t('commercial.suppliers.form.information.profitAmount')"
+                            :readonly="businessReadonly"
+                            :error="informationErrors.errors.profitAmount"
+                        />
+                        <!-- Volume previsionnel : specifique fournisseur (entier). -->
+                        <MalioInputText
+                            v-model="information.volumeForecast"
+                            :label="t('commercial.suppliers.form.information.volumeForecast')"
+                            :mask="VOLUME_FORECAST_MASK"
+                            :readonly="businessReadonly"
+                            :error="informationErrors.errors.volumeForecast"
+                        />
+                    </div>
+                    <div v-if="!businessReadonly" class="mt-12 flex justify-center">
+                        <MalioButton
+                            variant="primary"
+                            :label="t('commercial.suppliers.edit.save')"
+                            :disabled="tabSubmitting"
+                            @click="submitInformation"
+                        />
+                    </div>
+                </template>
+
+                <!-- Onglet Contacts -->
+                <template #contacts>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <SupplierContactBlock
+                            v-for="(contact, index) in contacts"
+                            :key="contact.id ?? `new-${index}`"
+                            :model-value="contact"
+                            :title="t('commercial.suppliers.form.contact.title', { n: index + 1 })"
+                            :removable="contacts.length > 1"
+                            :readonly="businessReadonly"
+                            :errors="contactErrors[index]"
+                            @update:model-value="(v) => contacts[index] = v"
+                            @remove="askRemoveContact(index)"
+                        />
+                        <div v-if="!businessReadonly" class="flex justify-center gap-6">
+                            <MalioButton
+                                variant="secondary"
+                                icon-name="mdi:add-bold"
+                                icon-position="left"
+                                :label="t('commercial.suppliers.form.contact.add')"
+                                :disabled="!canAddContact"
+                                @click="addContact"
+                            />
+                            <MalioButton
+                                variant="primary"
+                                :label="t('commercial.suppliers.edit.save')"
+                                :disabled="tabSubmitting"
+                                @click="submitContacts"
+                            />
+                        </div>
+                    </div>
+                </template>
+
+                <!-- Onglet Adresses -->
+                <template #addresses>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <SupplierAddressBlock
+                            v-for="(address, index) in addresses"
+                            :key="address.id ?? `new-${index}`"
+                            :model-value="address"
+                            :title="t('commercial.suppliers.form.address.title', { n: index + 1 })"
+                            :category-options="mainCategoryOptions"
+                            :site-options="siteOptions"
+                            :contact-options="contactOptions"
+                            :country-options="countryOptions"
+                            :removable="addresses.length > 1"
+                            :readonly="businessReadonly"
+                            :errors="addressErrors[index]"
+                            @update:model-value="(v) => addresses[index] = v"
+                            @remove="askRemoveAddress(index)"
+                            @degraded="onAddressDegraded"
+                        />
+                        <div v-if="!businessReadonly" class="flex justify-center gap-6">
+                            <MalioButton
+                                variant="secondary"
+                                icon-name="mdi:add-bold"
+                                icon-position="left"
+                                :label="t('commercial.suppliers.form.address.add')"
+                                :disabled="!canAddAddress"
+                                @click="addAddress"
+                            />
+                            <MalioButton
+                                variant="primary"
+                                :label="t('commercial.suppliers.edit.save')"
+                                :disabled="tabSubmitting"
+                                @click="submitAddresses"
+                            />
+                        </div>
+                    </div>
+                </template>
+
+                <!-- Onglet Comptabilite (present uniquement si accounting.view ;
+                     editable uniquement si accounting.manage). -->
+                <template v-if="canAccountingView" #accounting>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <div class="bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]">
+                            <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                                <MalioInputText
+                                    v-model="accounting.siren"
+                                    :label="t('commercial.suppliers.form.accounting.siren')"
+                                    :mask="SIREN_MASK"
+                                    :readonly="accountingReadonly"
+                                    :required="true"
+                                    :error="accountingErrors.errors.siren"
+                                />
+                                <MalioInputText
+                                    v-model="accounting.accountNumber"
+                                    :label="t('commercial.suppliers.form.accounting.accountNumber')"
+                                    :readonly="accountingReadonly"
+                                    :required="true"
+                                    :error="accountingErrors.errors.accountNumber"
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.tvaModeIri"
+                                    :options="tvaModeOptions"
+                                    :label="t('commercial.suppliers.form.accounting.tvaMode')"
+                                    :readonly="accountingReadonly"
+                                    empty-option-label=""
+                                    :required="true"
+                                    :error="accountingErrors.errors.tvaMode"
+                                    @update:model-value="(v: string | number | null) => accounting.tvaModeIri = v === null ? null : String(v)"
+                                />
+                                <MalioInputText
+                                    v-model="accounting.nTva"
+                                    :label="t('commercial.suppliers.form.accounting.nTva')"
+                                    :readonly="accountingReadonly"
+                                    :required="true"
+                                    :error="accountingErrors.errors.nTva"
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.paymentDelayIri"
+                                    :options="paymentDelayOptions"
+                                    :label="t('commercial.suppliers.form.accounting.paymentDelay')"
+                                    :readonly="accountingReadonly"
+                                    empty-option-label=""
+                                    :required="true"
+                                    :error="accountingErrors.errors.paymentDelay"
+                                    @update:model-value="(v: string | number | null) => accounting.paymentDelayIri = v === null ? null : String(v)"
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.paymentTypeIri"
+                                    :options="paymentTypeOptions"
+                                    :label="t('commercial.suppliers.form.accounting.paymentType')"
+                                    :readonly="accountingReadonly"
+                                    empty-option-label=""
+                                    :required="true"
+                                    :error="accountingErrors.errors.paymentType"
+                                    @update:model-value="onPaymentTypeChange"
+                                />
+                                <MalioSelect
+                                    v-if="isBankRequired"
+                                    :model-value="accounting.bankIri"
+                                    :options="bankOptions"
+                                    :label="t('commercial.suppliers.form.accounting.bank')"
+                                    :readonly="accountingReadonly"
+                                    empty-option-label=""
+                                    :required="true"
+                                    :error="accountingErrors.errors.bank"
+                                    @update:model-value="(v: string | number | null) => accounting.bankIri = v === null ? null : String(v)"
+                                />
+                            </div>
+                        </div>
+
+                        <!-- Blocs RIB — affiches uniquement si type de reglement = LCR (RG-2.08). -->
+                        <div
+                            v-for="(rib, index) in visibleRibs"
+                            :key="rib.id ?? `new-${index}`"
+                            class="relative bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]"
+                        >
+                            <MalioButtonIcon
+                                v-if="!accountingReadonly && visibleRibs.length > 1"
+                                icon="mdi:delete-outline"
+                                variant="ghost"
+                                button-class="absolute top-3 right-3"
+                                v-bind="{ ariaLabel: t('commercial.suppliers.form.accounting.removeRib') }"
+                                @click="askRemoveRib(index)"
+                            />
+                            <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                                <MalioInputText
+                                    v-model="rib.label"
+                                    :label="t('commercial.suppliers.form.accounting.ribLabel')"
+                                    :readonly="accountingReadonly"
+                                    :required="isRibRequired"
+                                    :error="ribErrors[index]?.label"
+                                />
+                                <MalioInputText
+                                    v-model="rib.bic"
+                                    :label="t('commercial.suppliers.form.accounting.ribBic')"
+                                    :readonly="accountingReadonly"
+                                    :required="isRibRequired"
+                                    :error="ribErrors[index]?.bic"
+                                />
+                                <MalioInputText
+                                    v-model="rib.iban"
+                                    :label="t('commercial.suppliers.form.accounting.ribIban')"
+                                    :readonly="accountingReadonly"
+                                    :required="isRibRequired"
+                                    :error="ribErrors[index]?.iban"
+                                />
+                            </div>
+                        </div>
+
+                        <div v-if="!accountingReadonly" class="flex justify-center gap-6">
+                            <MalioButton
+                                v-if="isRibRequired"
+                                variant="secondary"
+                                icon-name="mdi:add-bold"
+                                icon-position="left"
+                                :label="t('commercial.suppliers.form.accounting.addRib')"
+                                :disabled="!canAddRib"
+                                @click="addRib"
+                            />
+                            <MalioButton
+                                variant="primary"
+                                :label="t('commercial.suppliers.edit.save')"
+                                :disabled="tabSubmitting"
+                                @click="submitAccounting"
+                            />
+                        </div>
+                    </div>
+                </template>
+
+                <!-- Onglets non encore implementes : frame vide (navigation libre). -->
+                <template #transport><ComingSoonPlaceholder /></template>
+                <template #statistics><ComingSoonPlaceholder /></template>
+                <template #reports><ComingSoonPlaceholder /></template>
+                <template #exchanges><ComingSoonPlaceholder /></template>
+            </MalioTabList>
+        </template>
+
+        <!-- Modal de confirmation generique (suppression contact / adresse / RIB). -->
+        <MalioModal v-model="confirmModal.open" modal-class="max-w-md">
+            <template #header>
+                <h2 class="text-[24px] font-bold">{{ t('commercial.suppliers.form.confirmDelete.title') }}</h2>
+            </template>
+            <p>{{ confirmModal.message }}</p>
+            <template #footer>
+                <MalioButton
+                    variant="secondary"
+                    button-class="flex-1"
+                    :label="t('commercial.suppliers.form.confirmDelete.cancel')"
+                    @click="confirmModal.open = false"
+                />
+                <MalioButton
+                    variant="danger"
+                    button-class="flex-1"
+                    :label="t('commercial.suppliers.form.confirmDelete.confirm')"
+                    @click="runConfirm"
+                />
+            </template>
+        </MalioModal>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, reactive, ref } from 'vue'
+import { useSupplier } from '~/modules/commercial/composables/useSupplier'
+import { useSupplierReferentials, type CategoryOption, type RefOption } from '~/modules/commercial/composables/useSupplierReferentials'
+import { useSupplierFormErrors } from '~/modules/commercial/composables/useSupplierFormErrors'
+import {
+    canEditSupplier,
+    categoryOptionsOf,
+    referentialOptionOf,
+    siteOptionsOf,
+    mapContactToDraft,
+    mapAddressToDraft,
+    mapRibToDraft,
+    type SupplierDetail,
+} from '~/modules/commercial/utils/forms/supplierConsultation'
+import {
+    buildAccountingPayload,
+    buildAddressPayload,
+    buildContactPayload,
+    buildInformationPayload,
+    buildMainPayload,
+    buildRibPayload,
+    mapAccountingFormDraft,
+    mapInformationDraft,
+    mapMainDraft,
+    resolveTabEditability,
+    type AccountingFormDraft,
+    type InformationFormDraft,
+    type MainFormDraft,
+    type SupplierEditAbilities,
+} from '~/modules/commercial/utils/forms/supplierEdit'
+import {
+    buildSupplierFormTabKeys,
+    isAddressValid,
+    isBankRequiredForPaymentType,
+    isContactBlank,
+    isContactNamed,
+    isRibBlank,
+    isRibComplete,
+    isRibRequiredForPaymentType,
+} from '~/modules/commercial/utils/forms/supplierFormRules'
+import {
+    emptyAddress,
+    emptyContact,
+    emptyRib,
+    type SupplierAddressFormDraft,
+    type SupplierContactFormDraft,
+    type SupplierRibFormDraft,
+} from '~/modules/commercial/types/supplierForm'
+import { extractApiErrorMessage } from '~/shared/utils/api'
+import { readHistoryTab } from '~/shared/utils/historyTab'
+
+// Masques de saisie (la normalisation finale reste serveur).
+const SIREN_MASK = '#########'
+const EMPLOYEES_MASK = '#######'
+// Volume previsionnel : champ texte borne aux chiffres (entier >= 0 cote back).
+const VOLUME_FORECAST_MASK = '##########'
+
+const { t } = useI18n()
+const api = useApi()
+const toast = useToast()
+const route = useRoute()
+const router = useRouter()
+const { can, canAny } = usePermissions()
+
+// Gating de la route : l'edition exige de pouvoir editer au moins un onglet
+// (`manage` OU `accounting.manage`). Usine et roles en lecture seule sont
+// rediriges vers le repertoire (lui-meme protege).
+if (!canEditSupplier(canAny)) {
+    await navigateTo('/suppliers')
+}
+
+const supplierId = route.params.id as string
+
+const { supplier, loading, error, load } = useSupplier(supplierId)
+const referentials = useSupplierReferentials()
+
+// ── Permissions / editabilite par zone (option 1 ERP-74) ────────────────────
+const abilities = computed<SupplierEditAbilities>(() => ({
+    canManage: can('commercial.suppliers.manage'),
+    canAccountingView: can('commercial.suppliers.accounting.view'),
+    canAccountingManage: can('commercial.suppliers.accounting.manage'),
+}))
+const editability = computed(() => resolveTabEditability(abilities.value))
+// Bloc principal + onglets Information / Contacts / Adresses.
+const businessReadonly = computed(() => !editability.value.businessEditable)
+const canAccountingView = computed(() => editability.value.accountingVisible)
+const accountingReadonly = computed(() => !editability.value.accountingEditable)
+
+const headerTitle = computed(() => supplier.value?.companyName ?? t('commercial.suppliers.edit.title'))
+
+// ── Brouillons editables (pre-remplis depuis le detail) ─────────────────────
+const main = reactive<MainFormDraft>(mapMainDraft({} as SupplierDetail))
+const information = reactive<InformationFormDraft>(mapInformationDraft({} as SupplierDetail))
+const accounting = reactive<AccountingFormDraft>(mapAccountingFormDraft({} as SupplierDetail))
+const contacts = ref<SupplierContactFormDraft[]>([])
+const addresses = ref<SupplierAddressFormDraft[]>([])
+const ribs = ref<SupplierRibFormDraft[]>([])
+
+// Ids des sous-ressources existantes supprimees (DELETE differe au « Valider »).
+const removedContactIds = ref<number[]>([])
+const removedAddressIds = ref<number[]>([])
+const removedRibIds = ref<number[]>([])
+
+const mainSubmitting = ref(false)
+const tabSubmitting = ref(false)
+const addressDegradedNotified = ref(false)
+
+/** Recopie le detail charge dans les brouillons editables. */
+function hydrate(detail: SupplierDetail): void {
+    Object.assign(main, mapMainDraft(detail))
+    Object.assign(information, mapInformationDraft(detail))
+    Object.assign(accounting, mapAccountingFormDraft(detail))
+    contacts.value = (detail.contacts ?? []).map(mapContactToDraft)
+    addresses.value = (detail.addresses ?? []).map(mapAddressToDraft)
+    ribs.value = (detail.ribs ?? []).map(mapRibToDraft)
+    // Chaque bloc reste visible meme vide : si une collection est vide, on amorce
+    // un bloc vierge (non persiste tant qu'incomplet — cf. submit*/canAdd*).
+    if (contacts.value.length === 0) contacts.value.push(emptyContact())
+    if (addresses.value.length === 0) addresses.value.push(emptyAddress())
+    // RIB : amorce un bloc vide seulement si le type de reglement est une LCR
+    // (sinon la section reste masquee — RG-2.08).
+    if (isRibRequired.value && ribs.value.length === 0) ribs.value.push(emptyRib())
+}
+
+// ── Options de selects (referentiels UNION valeurs courantes de l'embed) ─────
+// L'union garantit que les valeurs deja posees s'affichent meme quand le
+// referentiel complet n'est pas chargeable (roles metier sans
+// catalog.categories.view / sites.view → 403, cf. matrice § 2.7).
+function mergeOptions<T extends { value: string }>(primary: T[], extra: T[]): T[] {
+    const seen = new Set(primary.map(o => o.value))
+    return [...primary, ...extra.filter(o => !seen.has(o.value))]
+}
+
+// Categories issues de l'embed (fournisseur + adresses), role-independantes.
+const embedCategoryOptions = computed<CategoryOption[]>(() => {
+    const fromSupplier = categoryOptionsOf(supplier.value?.categories)
+    const fromAddresses = (supplier.value?.addresses ?? []).flatMap(a => categoryOptionsOf(a.categories))
+    return mergeOptions(fromSupplier, fromAddresses)
+})
+// Toutes les categories de type FOURNISSEUR sont autorisees, sur le bloc principal
+// comme sur une adresse (pas de restriction Distributeur/Courtier comme au M1 — RG-2.10).
+const mainCategoryOptions = computed(() => mergeOptions(referentials.categories.value, embedCategoryOptions.value))
+
+const embedSiteOptions = computed<RefOption[]>(() =>
+    mergeOptions([], (supplier.value?.addresses ?? []).flatMap(a => siteOptionsOf(a.sites))),
+)
+const siteOptions = computed(() => mergeOptions(referentials.sites.value, embedSiteOptions.value))
+
+// Contacts deja persistes (iri non null), rattachables a une adresse (M2M).
+const contactOptions = computed<RefOption[]>(() =>
+    contacts.value
+        .filter(c => c.iri !== null)
+        .map(c => ({
+            value: c.iri as string,
+            label: [c.firstName, c.lastName].filter(Boolean).join(' ') || (c.email ?? ''),
+        })),
+)
+
+// Pays : referentiel `country` charge via l'API (ERP-116), aligne sur l'ecran
+// client. On merge la valeur deja stockee sur chaque adresse (embed) — comme les
+// autres selects de cet ecran — pour ne pas vider le select si `/countries`
+// echoue (resilience ERP-102) ou si un pays historique n'est plus au referentiel.
+const embedCountryOptions = computed<RefOption[]>(() =>
+    mergeOptions([], (supplier.value?.addresses ?? [])
+        .map(a => a.country)
+        .filter((c): c is string => !!c)
+        .map(c => ({ value: c, label: c }))),
+)
+const countryOptions = computed<RefOption[]>(() =>
+    mergeOptions(referentials.countries.value, embedCountryOptions.value),
+)
+
+// Selects comptables : referentiel UNION valeur courante de l'embed (libelle).
+const tvaModeOptions = computed(() => mergeOptions(referentials.tvaModes.value, referentialOptionOf(supplier.value?.tvaMode)))
+const paymentDelayOptions = computed(() => mergeOptions(referentials.paymentDelays.value, referentialOptionOf(supplier.value?.paymentDelay)))
+const paymentTypeOptions = computed(() => mergeOptions(
+    referentials.paymentTypes.value.map(p => ({ value: p.value, label: p.label })),
+    referentialOptionOf(supplier.value?.paymentType),
+))
+const bankOptions = computed(() => mergeOptions(referentials.banks.value, referentialOptionOf(supplier.value?.bank)))
+
+// ── Onglets : navigation libre (3 actifs + Compta + 4 coquilles) ────────────
+const tabKeys = computed(() => buildSupplierFormTabKeys(canAccountingView.value, { includeEditOnlyTabs: true }))
+
+const TAB_ICONS: Record<string, string> = {
+    information: 'mdi:account-outline',
+    contacts: 'mdi:account-box-plus-outline',
+    addresses: 'mdi:map-marker-outline',
+    transport: 'mdi:truck-delivery-outline',
+    accounting: 'mdi:bank-circle-outline',
+    statistics: 'mdi:finance',
+    reports: 'mdi:file-document-edit-outline',
+    exchanges: 'mdi:account-group-outline',
+}
+
+const tabs = computed(() => tabKeys.value.map(key => ({
+    key,
+    label: t(`commercial.suppliers.tab.${key}`),
+    icon: TAB_ICONS[key],
+})))
+
+// Onglet initial : repris de la consultation (history.state), sinon Information.
+const activeTab = ref(readHistoryTab(tabKeys.value) ?? 'information')
+
+// ── Navigation ──────────────────────────────────────────────────────────────
+/** Retour consultation en conservant l'onglet courant (via history.state). */
+function goBack(): void {
+    router.push({ path: `/suppliers/${supplierId}`, state: { tab: activeTab.value } })
+}
+
+/**
+ * Message d'erreur a afficher : violation 422 / detail renvoye par le serveur,
+ * sinon un libelle generique. Le 409 d'unicite de nom (bloc principal) est
+ * traduit explicitement par l'appelant.
+ */
+function apiErrorMessage(e: unknown): string {
+    const data = (e as { data?: unknown })?.data
+    return extractApiErrorMessage(data) || t('commercial.suppliers.toast.error')
+}
+
+function showError(e: unknown): void {
+    toast.error({ title: t('commercial.suppliers.toast.error'), message: apiErrorMessage(e) })
+}
+
+// ── Erreurs de validation par champ (ERP-101) ───────────────────────────────
+const {
+    mainErrors,
+    informationErrors,
+    accountingErrors,
+    contactErrors,
+    addressErrors,
+    ribErrors,
+    submitRows,
+} = useSupplierFormErrors()
+
+// ── Bloc principal ───────────────────────────────────────────────────────────
+/** PATCH /suppliers/{id} — groupe supplier:write:main UNIQUEMENT (mode strict). */
+async function submitMain(): Promise<void> {
+    if (businessReadonly.value || mainSubmitting.value) return
+    mainSubmitting.value = true
+    mainErrors.clearErrors()
+    try {
+        const updated = await api.patch<SupplierDetail>(`/suppliers/${supplierId}`, buildMainPayload(main, { forUpdate: true }), {
+            headers: { Accept: 'application/ld+json' },
+            toast: false,
+        })
+        // Reaffiche les valeurs normalisees renvoyees par le serveur (UPPERCASE, RG-2.12).
+        Object.assign(main, mapMainDraft(updated))
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    catch (e) {
+        // 409 = doublon nom de societe → erreur inline + toast ; 422 → mapping
+        // inline par champ ; autre → toast de fallback. Cf. ERP-101.
+        const status = (e as { response?: { status?: number } })?.response?.status
+        if (status === 409) {
+            const message = t('commercial.suppliers.form.duplicateCompany')
+            mainErrors.setError('companyName', message)
+            toast.error({ title: t('commercial.suppliers.toast.error'), message })
+        }
+        else {
+            mainErrors.handleApiError(e, { fallbackMessage: t('commercial.suppliers.toast.error') })
+        }
+    }
+    finally {
+        mainSubmitting.value = false
+    }
+}
+
+// ── Onglet Information ───────────────────────────────────────────────────────
+/** PATCH /suppliers/{id} — groupe supplier:write:information UNIQUEMENT. */
+async function submitInformation(): Promise<void> {
+    if (businessReadonly.value || tabSubmitting.value) return
+    tabSubmitting.value = true
+    informationErrors.clearErrors()
+    try {
+        await api.patch(`/suppliers/${supplierId}`, buildInformationPayload(information), { toast: false })
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    catch (e) {
+        informationErrors.handleApiError(e, { fallbackMessage: t('commercial.suppliers.toast.error') })
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Onglet Contacts ───────────────────────────────────────────────────────────
+const canAddContact = computed(() => {
+    const last = contacts.value[contacts.value.length - 1]
+    return last === undefined || isContactNamed(last)
+})
+function addContact(): void {
+    if (canAddContact.value) contacts.value.push(emptyContact())
+}
+
+function askRemoveContact(index: number): void {
+    askConfirm(t('commercial.suppliers.form.confirmDelete.contact'), () => {
+        const removed = contacts.value[index]
+        if (removed?.id != null) removedContactIds.value.push(removed.id)
+        contacts.value.splice(index, 1)
+        contactErrors.value.splice(index, 1)
+        // Garde au moins un bloc visible (cf. amorce a l'hydratation).
+        if (contacts.value.length === 0) contacts.value.push(emptyContact())
+    })
+}
+
+/**
+ * Valide l'onglet Contacts : DELETE des contacts retires (existants), puis
+ * POST/PATCH des blocs restants sur la sous-ressource. Strictement scope a la
+ * collection contacts (endpoints supplier_contact dedies).
+ */
+async function submitContacts(): Promise<void> {
+    if (businessReadonly.value || tabSubmitting.value) return
+    tabSubmitting.value = true
+    contactErrors.value = []
+    try {
+        for (const id of removedContactIds.value) {
+            await api.delete(`/supplier_contacts/${id}`, {}, { toast: false })
+        }
+        removedContactIds.value = []
+
+        // RG-2.13 : au moins un contact requis. Si l'onglet ne contient QUE des
+        // amorces neuves vides, on les soumet -> 422 RG-2.04 inline (nom OU prenom).
+        const hasSubmittableContact = contacts.value.some(c => c.id !== null || !isContactBlank(c))
+        const hasError = await submitRows(
+            contacts.value,
+            contactErrors,
+            async (contact) => {
+                const body = buildContactPayload(contact)
+                if (contact.id === null) {
+                    const created = await api.post<{ '@id'?: string, id: number }>(
+                        `/suppliers/${supplierId}/contacts`,
+                        body,
+                        { headers: { Accept: 'application/ld+json' }, toast: false },
+                    )
+                    contact.id = created.id
+                    contact.iri = created['@id'] ?? null
+                }
+                else {
+                    await api.patch(`/supplier_contacts/${contact.id}`, body, { toast: false })
+                }
+            },
+            error => showError(error),
+            contact => hasSubmittableContact && contact.id === null && isContactBlank(contact),
+        )
+        if (hasError) return
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    catch (e) {
+        showError(e)
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Onglet Adresses ───────────────────────────────────────────────────────────
+// « + Adresse » desactive tant que la derniere adresse n'est pas valide.
+const canAddAddress = computed(() => {
+    const last = addresses.value[addresses.value.length - 1]
+    return last !== undefined && isAddressValid(last)
+})
+
+function addAddress(): void {
+    if (canAddAddress.value) addresses.value.push(emptyAddress())
+}
+
+function askRemoveAddress(index: number): void {
+    askConfirm(t('commercial.suppliers.form.confirmDelete.address'), () => {
+        const removed = addresses.value[index]
+        if (removed?.id != null) removedAddressIds.value.push(removed.id)
+        addresses.value.splice(index, 1)
+        addressErrors.value.splice(index, 1)
+        // Garde au moins un bloc visible (cf. amorce a l'hydratation).
+        if (addresses.value.length === 0) addresses.value.push(emptyAddress())
+    })
+}
+
+function onAddressDegraded(): void {
+    if (addressDegradedNotified.value) return
+    addressDegradedNotified.value = true
+    toast.warning({
+        title: t('commercial.suppliers.toast.error'),
+        message: t('commercial.suppliers.form.address.degraded'),
+    })
+}
+
+/** Valide l'onglet Adresses : DELETE des adresses retirees puis POST/PATCH. */
+async function submitAddresses(): Promise<void> {
+    if (businessReadonly.value || tabSubmitting.value) return
+    tabSubmitting.value = true
+    addressErrors.value = []
+    try {
+        for (const id of removedAddressIds.value) {
+            await api.delete(`/supplier_addresses/${id}`, {}, { toast: false })
+        }
+        removedAddressIds.value = []
+
+        const hasError = await submitRows(
+            addresses.value,
+            addressErrors,
+            async (address) => {
+                // Edition d'une adresse existante : champ requis vide envoye en `''`
+                // (NotBlank 422) au lieu d'etre omis — sinon le PATCH garderait
+                // l'ancienne valeur (faux 200). Creation (id null) : omit classique.
+                const body = buildAddressPayload(address, { forUpdate: address.id !== null })
+                if (address.id === null) {
+                    const created = await api.post<{ id: number }>(
+                        `/suppliers/${supplierId}/addresses`,
+                        body,
+                        { headers: { Accept: 'application/ld+json' }, toast: false },
+                    )
+                    address.id = created.id
+                }
+                else {
+                    await api.patch(`/supplier_addresses/${address.id}`, body, { toast: false })
+                }
+            },
+            error => showError(error),
+        )
+        if (hasError) return
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    catch (e) {
+        showError(e)
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Onglet Comptabilite ──────────────────────────────────────────────────────
+const selectedPaymentTypeCode = computed(() =>
+    referentials.paymentTypes.value.find(p => p.value === accounting.paymentTypeIri)?.code ?? null,
+)
+const isBankRequired = computed(() => isBankRequiredForPaymentType(selectedPaymentTypeCode.value))
+const isRibRequired = computed(() => isRibRequiredForPaymentType(selectedPaymentTypeCode.value))
+
+// Les blocs RIB ne sont affiches que pour une LCR (RG-2.08).
+const visibleRibs = computed(() => isRibRequired.value ? ribs.value : [])
+
+function onPaymentTypeChange(value: string | number | null): void {
+    accounting.paymentTypeIri = value === null ? null : String(value)
+    if (!isBankRequired.value) accounting.bankIri = null
+    // ERP-121 : un RIB est une coordonnee bancaire du fournisseur, decouplee du mode
+    // de reglement. Au passage hors-LCR on ne SUPPRIME plus les RIB existants : ils
+    // restent en base, simplement masques a l'ecran (visibleRibs = []), et
+    // reapparaissent tels quels si l'on repasse en LCR. Seule la corbeille d'un
+    // bloc (askRemoveRib) retire reellement un RIB.
+    if (isRibRequired.value) {
+        if (ribs.value.length === 0) ribs.value.push(emptyRib())
+    }
+    else {
+        // Hors-LCR : on nettoie seulement les erreurs inline (plus affichees).
+        ribErrors.value = []
+    }
+}
+
+// « + RIB » desactive tant que le dernier bloc RIB n'est pas complet.
+const canAddRib = computed(() => {
+    const last = ribs.value[ribs.value.length - 1]
+    return last !== undefined && isRibComplete(last)
+})
+
+function addRib(): void {
+    if (canAddRib.value) ribs.value.push(emptyRib())
+}
+
+function askRemoveRib(index: number): void {
+    askConfirm(t('commercial.suppliers.form.confirmDelete.rib'), () => {
+        const removed = ribs.value[index]
+        if (removed?.id != null) removedRibIds.value.push(removed.id)
+        ribs.value.splice(index, 1)
+        ribErrors.value.splice(index, 1)
+        // Garde au moins un bloc RIB visible (cf. amorce a l'hydratation).
+        if (ribs.value.length === 0) ribs.value.push(emptyRib())
+    })
+}
+
+/**
+ * Valide l'onglet Comptabilite : POST/PATCH des RIB sur la sous-ressource PUIS
+ * PATCH des scalaires (groupe supplier:write:accounting, exige accounting.manage
+ * cote back) PUIS DELETE des RIB explicitement retires. Les RIB crees d'abord : le
+ * back valide RG-2.08 (LCR => au moins un RIB persiste) sur le PATCH scalaires.
+ *
+ * ERP-121 : les RIB ne sont (re)soumis QUE sous LCR — hors-LCR ce sont des
+ * coordonnees dormantes conservees telles quelles, masquees a l'ecran et jamais
+ * re-ecrites. `removedRibIds` ne contient plus que les suppressions EXPLICITES
+ * (corbeille d'un bloc, toujours sous LCR). Aucun champ main/information dans le
+ * payload (mode strict RG-2.16 : sinon 403 sur tout le payload).
+ */
+async function submitAccounting(): Promise<void> {
+    if (accountingReadonly.value || tabSubmitting.value) return
+    tabSubmitting.value = true
+    accountingErrors.clearErrors()
+    try {
+        // 1) POST/PATCH des RIB d'abord — UNIQUEMENT sous LCR (erreurs inline par
+        // ligne, tous les blocs tentes). Hors-LCR (ERP-121), les RIB sont des
+        // coordonnees dormantes : rien d'editable n'est affiche, on ne les re-soumet
+        // pas. On ne saute une amorce neuve vide QUE s'il reste un autre RIB
+        // soumettable : sinon (ex. l'unique RIB existant supprime, remplace par un
+        // bloc vide), on la soumet pour declencher la 422 NotBlank inline plutot que
+        // de laisser le DELETE echouer en « dernier RIB d'une LCR » (message plat).
+        if (isRibRequired.value) {
+            const hasSubmittableRib = ribs.value.some(r => r.id !== null || !isRibBlank(r))
+            const ribHasError = await submitRows(
+                ribs.value,
+                ribErrors,
+                async (rib) => {
+                    // Edition d'un RIB existant : champ requis vide envoye en `''` (NotBlank
+                    // 422) au lieu d'etre omis (sinon le PATCH garderait l'ancienne valeur).
+                    const body = buildRibPayload(rib, { forUpdate: rib.id !== null })
+                    if (rib.id === null) {
+                        const created = await api.post<{ id: number }>(
+                            `/suppliers/${supplierId}/ribs`,
+                            body,
+                            { headers: { Accept: 'application/ld+json' }, toast: false },
+                        )
+                        rib.id = created.id
+                    }
+                    else {
+                        await api.patch(`/supplier_ribs/${rib.id}`, body, { toast: false })
+                    }
+                },
+                error => showError(error),
+                rib => hasSubmittableRib && rib.id === null && isRibBlank(rib),
+            )
+            if (ribHasError) return
+        }
+
+        // 2) PATCH des scalaires comptables (erreurs inline sur leurs champs).
+        try {
+            await api.patch(`/suppliers/${supplierId}`, buildAccountingPayload(accounting, isBankRequired.value), { toast: false })
+        }
+        catch (error) {
+            accountingErrors.handleApiError(error, { fallbackMessage: t('commercial.suppliers.toast.error') })
+            return
+        }
+
+        // 3) DELETE des RIB explicitement retires (corbeille d'un bloc) : APRES le
+        // PATCH scalaires (le guard back refuse la suppression du dernier RIB d'une
+        // LCR). ERP-121 : plus aucune suppression automatique au passage hors-LCR.
+        for (const id of removedRibIds.value) {
+            await api.delete(`/supplier_ribs/${id}`, {}, { toast: false })
+        }
+        removedRibIds.value = []
+
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    catch (e) {
+        showError(e)
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Modal de confirmation generique ──────────────────────────────────────────
+const confirmModal = reactive({
+    open: false,
+    message: '',
+    action: null as null | (() => void),
+})
+
+function askConfirm(message: string, action: () => void): void {
+    confirmModal.message = message
+    confirmModal.action = action
+    confirmModal.open = true
+}
+
+function runConfirm(): void {
+    confirmModal.action?.()
+    confirmModal.action = null
+    confirmModal.open = false
+}
+
+useHead({ title: headerTitle })
+
+onMounted(async () => {
+    // Referentiels en best-effort (echec non bloquant : l'embed alimente les
+    // libelles des valeurs courantes).
+    referentials.loadCommon().catch(() => {})
+    await load()
+    if (supplier.value) hydrate(supplier.value)
+})
+</script>
@@ -0,0 +1,468 @@
+<template>
+    <div>
+        <!-- En-tete : retour repertoire + nom du fournisseur + actions (Modifier / Archiver|Restaurer). -->
+        <div class="flex items-center gap-3 pt-11">
+            <MalioButtonIcon
+                icon="mdi:arrow-left-bold"
+                icon-size="24"
+                variant="ghost"
+                v-bind="{ ariaLabel: t('commercial.suppliers.consultation.back') }"
+                @click="goBack"
+            />
+            <h1 class="text-[30px] font-semibold text-m-primary">{{ headerTitle }}</h1>
+
+            <!-- gap-12 = 48px : meme espacement que Ajouter / Filtres du repertoire. -->
+            <div class="ml-auto flex items-center gap-12">
+                <MalioButton
+                    v-if="canEdit"
+                    variant="secondary"
+                    icon-name="mdi:pencil-outline"
+                    icon-position="left"
+                    :label="t('commercial.suppliers.action.edit')"
+                    @click="goEdit"
+                />
+                <MalioButton
+                    v-if="showArchive"
+                    variant="secondary"
+                    icon-name="mdi:archive-arrow-down-outline"
+                    icon-position="left"
+                    :label="t('commercial.suppliers.action.archive')"
+                    @click="askToggleArchive"
+                />
+                <MalioButton
+                    v-if="showRestore"
+                    variant="secondary"
+                    icon-name="mdi:archive-arrow-up-outline"
+                    icon-position="left"
+                    :label="t('commercial.suppliers.action.restore')"
+                    @click="askToggleArchive"
+                />
+            </div>
+        </div>
+
+        <!-- Etats de chargement / introuvable. -->
+        <p v-if="loading" class="mt-12 text-center text-black/60">{{ t('commercial.suppliers.consultation.loading') }}</p>
+        <p v-else-if="error" class="mt-12 text-center text-m-danger">{{ t('commercial.suppliers.consultation.notFound') }}</p>
+
+        <template v-else-if="supplier">
+            <!-- ── Formulaire principal (lecture seule) ──────────────────────── -->
+            <div class="mt-[48px] grid grid-cols-3 xl:grid-cols-4 gap-x-[44px] gap-y-4">
+                <MalioInputText
+                    :model-value="supplier.companyName"
+                    :label="t('commercial.suppliers.form.main.companyName')"
+                    readonly
+                />
+                <MalioSelectCheckbox
+                    :model-value="categoryIris"
+                    :options="mainCategoryOptions"
+                    :label="t('commercial.suppliers.form.main.categories')"
+                    :display-tag="true"
+                    readonly
+                />
+            </div>
+
+            <!-- ── Onglets (navigation libre, tout en lecture seule) ─────────── -->
+            <MalioTabList v-model="activeTab" :tabs="tabs" :max-visible-tabs="5" :max-width="1100" class="mt-[60px]">
+                <!-- Onglet Information -->
+                <template #information>
+                    <div class="mt-12 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)]">
+                        <!-- pt-1/pb-1 alignent le textarea (h-full) en haut ET en bas
+                             sur les inputs (champ 40px centre dans un h-12). -->
+                        <MalioInputTextArea
+                            :model-value="information.description"
+                            :label="t('commercial.suppliers.form.information.description')"
+                            resize="none"
+                            group-class="row-span-2 pt-1 pb-1"
+                            text-input="h-full text-lg"
+                            readonly
+                        />
+                        <MalioInputText
+                            :model-value="information.competitors"
+                            :label="t('commercial.suppliers.form.information.competitors')"
+                            readonly
+                        />
+                        <MalioDate
+                            :model-value="information.foundedAt"
+                            :label="t('commercial.suppliers.form.information.foundedAt')"
+                            readonly
+                        />
+                        <MalioInputText
+                            :model-value="information.employeesCount"
+                            :label="t('commercial.suppliers.form.information.employeesCount')"
+                            readonly
+                        />
+                        <MalioInputAmount
+                            :model-value="information.revenueAmount"
+                            :label="t('commercial.suppliers.form.information.revenueAmount')"
+                            readonly
+                        />
+                        <MalioInputText
+                            :model-value="information.directorName"
+                            :label="t('commercial.suppliers.form.information.directorName')"
+                            readonly
+                        />
+                        <MalioInputAmount
+                            :model-value="information.profitAmount"
+                            :label="t('commercial.suppliers.form.information.profitAmount')"
+                            readonly
+                        />
+                        <!-- Volume previsionnel : specifique fournisseur (entier). -->
+                        <MalioInputText
+                            :model-value="information.volumeForecast"
+                            :label="t('commercial.suppliers.form.information.volumeForecast')"
+                            readonly
+                        />
+                    </div>
+                </template>
+
+                <!-- Onglet Contacts -->
+                <template #contacts>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <SupplierContactBlock
+                            v-for="(contact, index) in contacts"
+                            :key="contact.id ?? index"
+                            :model-value="contact"
+                            :title="t('commercial.suppliers.form.contact.title', { n: index + 1 })"
+                            readonly
+                        />
+                    </div>
+                </template>
+
+                <!-- Onglet Adresses -->
+                <template #addresses>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <SupplierAddressBlock
+                            v-for="(view, index) in addressViews"
+                            :key="view.draft.id ?? index"
+                            :model-value="view.draft"
+                            :title="t('commercial.suppliers.form.address.title', { n: index + 1 })"
+                            :category-options="view.categoryOptions"
+                            :site-options="allSiteOptions"
+                            :contact-options="contactOptions"
+                            :country-options="countryOptions"
+                            readonly
+                        />
+                    </div>
+                </template>
+
+                <!-- Onglet Comptabilite (present uniquement si accounting.view). -->
+                <template v-if="canAccountingView" #accounting>
+                    <div class="mt-12 flex flex-col gap-6">
+                        <div class="bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]">
+                            <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                                <MalioInputText
+                                    :model-value="accounting.siren"
+                                    :label="t('commercial.suppliers.form.accounting.siren')"
+                                    :mask="SIREN_MASK"
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="accounting.accountNumber"
+                                    :label="t('commercial.suppliers.form.accounting.accountNumber')"
+                                    readonly
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.tvaModeIri"
+                                    :options="tvaModeOptions"
+                                    :label="t('commercial.suppliers.form.accounting.tvaMode')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="accounting.nTva"
+                                    :label="t('commercial.suppliers.form.accounting.nTva')"
+                                    readonly
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.paymentDelayIri"
+                                    :options="paymentDelayOptions"
+                                    :label="t('commercial.suppliers.form.accounting.paymentDelay')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                                <MalioSelect
+                                    :model-value="accounting.paymentTypeIri"
+                                    :options="paymentTypeOptions"
+                                    :label="t('commercial.suppliers.form.accounting.paymentType')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                                <MalioSelect
+                                    v-if="accounting.bankIri"
+                                    :model-value="accounting.bankIri"
+                                    :options="bankOptions"
+                                    :label="t('commercial.suppliers.form.accounting.bank')"
+                                    empty-option-label=""
+                                    readonly
+                                />
+                            </div>
+                        </div>
+
+                        <!-- Blocs RIB (0..n), lecture seule. -->
+                        <div
+                            v-for="(rib, index) in ribs"
+                            :key="rib.id ?? index"
+                            class="bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]"
+                        >
+                            <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                                <MalioInputText
+                                    :model-value="rib.label"
+                                    :label="t('commercial.suppliers.form.accounting.ribLabel')"
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="rib.bic"
+                                    :label="t('commercial.suppliers.form.accounting.ribBic')"
+                                    readonly
+                                />
+                                <MalioInputText
+                                    :model-value="rib.iban"
+                                    :label="t('commercial.suppliers.form.accounting.ribIban')"
+                                    readonly
+                                />
+                            </div>
+                        </div>
+                    </div>
+                </template>
+
+                <!-- Onglets non encore implementes : frame vide (navigation libre). -->
+                <template #transport><ComingSoonPlaceholder /></template>
+                <template #statistics><ComingSoonPlaceholder /></template>
+                <template #reports><ComingSoonPlaceholder /></template>
+                <template #exchanges><ComingSoonPlaceholder /></template>
+            </MalioTabList>
+        </template>
+
+        <!-- Modal de confirmation Archiver / Restaurer. -->
+        <MalioModal v-model="confirmOpen" modal-class="max-w-md">
+            <template #header>
+                <h2 class="text-[24px] font-bold">
+                    {{ isArchived ? t('commercial.suppliers.consultation.confirmRestore.title') : t('commercial.suppliers.consultation.confirmArchive.title') }}
+                </h2>
+            </template>
+            <p>{{ isArchived ? t('commercial.suppliers.consultation.confirmRestore.message') : t('commercial.suppliers.consultation.confirmArchive.message') }}</p>
+            <template #footer>
+                <MalioButton
+                    variant="secondary"
+                    button-class="flex-1"
+                    :label="t('commercial.suppliers.form.confirmDelete.cancel')"
+                    @click="confirmOpen = false"
+                />
+                <MalioButton
+                    :variant="isArchived ? 'primary' : 'danger'"
+                    button-class="flex-1"
+                    :label="t('commercial.suppliers.form.confirmDelete.confirm')"
+                    :disabled="toggling"
+                    @click="confirmToggleArchive"
+                />
+            </template>
+        </MalioModal>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import { useSupplier } from '~/modules/commercial/composables/useSupplier'
+import { buildSupplierFormTabKeys, isRibRequiredForPaymentType } from '~/modules/commercial/utils/forms/supplierFormRules'
+import { readHistoryTab } from '~/shared/utils/historyTab'
+import {
+    canEditSupplier,
+    categoryOptionsOf,
+    contactOptionsOf,
+    emptyAddress,
+    mapAccountingDraft,
+    mapAddressView,
+    mapContactToDraft,
+    mapRibToDraft,
+    paymentTypeCodeOf,
+    referentialOptionOf,
+    showArchiveAction,
+    showRestoreAction,
+    type SelectOption,
+    type SupplierDetail,
+} from '~/modules/commercial/utils/forms/supplierConsultation'
+import { emptyContact } from '~/modules/commercial/types/supplierForm'
+
+// Masque d'affichage (purement visuel, la donnee reste celle du serveur).
+const SIREN_MASK = '#########'
+
+const { t } = useI18n()
+const route = useRoute()
+const router = useRouter()
+const toast = useToast()
+const { can, canAny } = usePermissions()
+const authStore = useAuthStore()
+
+// Gating de la route : la consultation exige `view`. Usine (sans view) est
+// redirige vers le repertoire (lui-meme protege). Cf. matrice § 2.7.
+if (!can('commercial.suppliers.view')) {
+    await navigateTo('/suppliers')
+}
+
+const supplierId = route.params.id as string
+
+const { supplier, loading, error, load, archive, restore } = useSupplier(supplierId)
+
+// ── Permissions / visibilite des actions ───────────────────────────────────
+const canAccountingView = computed(() => can('commercial.suppliers.accounting.view'))
+const canEdit = computed(() => canEditSupplier(canAny))
+const isArchived = computed(() => supplier.value?.isArchived === true)
+const showArchive = computed(() => showArchiveAction(can, isArchived.value))
+const showRestore = computed(() => showRestoreAction(can, isArchived.value))
+
+const headerTitle = computed(() => supplier.value?.companyName ?? t('commercial.suppliers.consultation.title'))
+
+// ── Donnees derivees du payload (lecture seule) ────────────────────────────
+const categoryIris = computed(() => (supplier.value?.categories ?? []).map(c => c['@id']))
+
+const information = computed(() => ({
+    description: supplier.value?.description ?? null,
+    competitors: supplier.value?.competitors ?? null,
+    // MalioDate attend strictement YYYY-MM-DD : on tronque l'ISO datetime renvoye.
+    foundedAt: supplier.value?.foundedAt ? supplier.value.foundedAt.slice(0, 10) : null,
+    employeesCount: supplier.value?.employeesCount != null ? String(supplier.value.employeesCount) : null,
+    revenueAmount: supplier.value?.revenueAmount ?? null,
+    profitAmount: supplier.value?.profitAmount ?? null,
+    directorName: supplier.value?.directorName ?? null,
+    volumeForecast: supplier.value?.volumeForecast != null ? String(supplier.value.volumeForecast) : null,
+}))
+
+// Chaque bloc reste visible meme vide en consultation : si la collection est
+// vide, on affiche un bloc vierge en lecture seule (pas de message « Aucun … »).
+const contacts = computed(() => {
+    const list = (supplier.value?.contacts ?? []).map(mapContactToDraft)
+    return list.length ? list : [emptyContact()]
+})
+// Vue par adresse : brouillon + options (sites/categories) propres a l'adresse.
+const addressViews = computed(() => {
+    const views = (supplier.value?.addresses ?? []).map(mapAddressView)
+    return views.length ? views : [{ draft: emptyAddress(), siteOptions: [], categoryOptions: [] }]
+})
+// Exception au placeholder ci-dessus : on n'affiche AUCUN bloc RIB quand le
+// fournisseur n'en a pas. ERP-121 : un fournisseur peut desormais conserver des RIB
+// « dormants » apres etre repasse hors-LCR (on ne les supprime plus). En consultation,
+// decision metier = on les masque TOTALEMENT : on n'affiche les RIB que si le type de
+// reglement courant est LCR (le `code` est embarque sous supplier:read:accounting).
+const ribs = computed(() =>
+    isRibRequiredForPaymentType(paymentTypeCodeOf(supplier.value?.paymentType))
+        ? (supplier.value?.ribs ?? []).map(mapRibToDraft)
+        : [],
+)
+// Draft comptable (tout null si l'utilisateur n'a pas accounting.view).
+const accounting = computed(() => mapAccountingDraft(supplier.value ?? ({} as SupplierDetail)))
+
+// ── Options des selects (construites depuis l'EMBED, jamais via un GET de
+//    referentiel : /categories et /sites sont en 403 pour les roles metier
+//    non-admin, ce qui laisserait les libelles vides). ───────────────────────
+const mainCategoryOptions = computed(() => categoryOptionsOf(supplier.value?.categories))
+const contactOptions = computed(() => contactOptionsOf(supplier.value?.contacts))
+
+// Liste COMPLETE des sites disponibles, issue de /api/me (groupe me:read — donc
+// pas de 403 pour les roles metier, contrairement a GET /sites). Libelle = numero
+// de departement (2 premiers chiffres du code postal). Permet d'afficher TOUJOURS
+// toutes les cases « Sites » (86 / 17 / 82) dans le bloc adresse, meme celles non
+// rattachees a l'adresse consultee (les rattachees restent cochees via siteIris).
+const allSiteOptions = computed<SelectOption[]>(() =>
+    (authStore.user?.sites ?? []).map(s => ({
+        value: `/api/sites/${s.id}`,
+        label: (s.postalCode ?? '').slice(0, 2),
+    })),
+)
+
+// Pays (consultation, lecture seule) : derive des adresses du fournisseur, comme
+// l'ecran client. Le referentiel `country` (ERP-116) n'est pas charge ici, l'ecran
+// n'affiche que les valeurs deja stockees.
+const countryOptions = computed<SelectOption[]>(() =>
+    [...new Set(
+        (supplier.value?.addresses ?? [])
+            .map(a => a.country)
+            .filter((c): c is string => !!c),
+    )].map(c => ({ value: c, label: c })),
+)
+
+// Selects comptables : libelle issu de l'embed (option unique ou vide).
+const tvaModeOptions = computed(() => referentialOptionOf(supplier.value?.tvaMode))
+const paymentDelayOptions = computed(() => referentialOptionOf(supplier.value?.paymentDelay))
+const paymentTypeOptions = computed(() => referentialOptionOf(supplier.value?.paymentType))
+const bankOptions = computed(() => referentialOptionOf(supplier.value?.bank))
+
+// ── Onglets : navigation LIBRE (pas de sequence forcee en consultation) ────
+// 3 onglets actifs (Information, Contacts, Adresses, + Comptabilite si droit) et
+// 4 coquilles (Transport, Statistiques, Rapports, Echanges).
+const tabKeys = computed(() => buildSupplierFormTabKeys(canAccountingView.value, { includeEditOnlyTabs: true }))
+
+const TAB_ICONS: Record<string, string> = {
+    information: 'mdi:account-outline',
+    contacts: 'mdi:account-box-plus-outline',
+    addresses: 'mdi:map-marker-outline',
+    transport: 'mdi:truck-delivery-outline',
+    accounting: 'mdi:bank-circle-outline',
+    statistics: 'mdi:finance',
+    reports: 'mdi:file-document-edit-outline',
+    exchanges: 'mdi:account-group-outline',
+}
+
+const tabs = computed(() => tabKeys.value.map(key => ({
+    key,
+    label: t(`commercial.suppliers.tab.${key}`),
+    icon: TAB_ICONS[key],
+})))
+
+// Onglet initial : repris de l'edition au retour (history.state), sinon Information.
+const activeTab = ref(readHistoryTab(tabKeys.value) ?? 'information')
+
+// ── Navigation ─────────────────────────────────────────────────────────────
+function goBack(): void {
+    router.push('/suppliers')
+}
+
+/** Bascule en edition en conservant l'onglet courant (via history.state). */
+function goEdit(): void {
+    router.push({ path: `/suppliers/${supplierId}/edit`, state: { tab: activeTab.value } })
+}
+
+// ── Archivage / Restauration ────────────────────────────────────────────────
+const confirmOpen = ref(false)
+const toggling = ref(false)
+
+function askToggleArchive(): void {
+    confirmOpen.value = true
+}
+
+/**
+ * Confirme l'archivage ou la restauration (PATCH isArchived seul). Gere le 409
+ * de conflit d'homonyme actif a la restauration avec un message dedie.
+ */
+async function confirmToggleArchive(): Promise<void> {
+    if (toggling.value) return
+    toggling.value = true
+    const restoring = isArchived.value
+    try {
+        if (restoring) {
+            await restore()
+            toast.success({ title: t('commercial.suppliers.toast.restoreSuccess') })
+        }
+        else {
+            await archive()
+            toast.success({ title: t('commercial.suppliers.toast.archiveSuccess') })
+        }
+        confirmOpen.value = false
+    }
+    catch (e) {
+        const status = (e as { response?: { status?: number } })?.response?.status
+        toast.error({
+            title: t('commercial.suppliers.toast.error'),
+            message: restoring && status === 409
+                ? t('commercial.suppliers.toast.restoreConflict')
+                : t('commercial.suppliers.toast.error'),
+        })
+    }
+    finally {
+        toggling.value = false
+    }
+}
+
+useHead({ title: headerTitle })
+
+onMounted(load)
+</script>
@@ -0,0 +1,434 @@
+<template>
+    <div>
+        <PageHeader>
+            {{ t('commercial.suppliers.title') }}
+            <template #actions>
+                <!-- gap-8 = 32px d'espacement entre Filtres et Ajouter. -->
+                <div class="flex items-center gap-8">
+                    <!-- Bouton Filtres a GAUCHE d'Ajouter. Le compteur reflete les filtres actifs. -->
+                    <MalioButton
+                        v-if="canView"
+                        variant="tertiary"
+                        :label="filterButtonLabel"
+                        icon-name="mdi:tune"
+                        icon-position="left"
+                        icon-size="24"
+                        @click="openFilters"
+                    />
+                    <MalioButton
+                        v-if="canManage"
+                        variant="secondary"
+                        :label="t('commercial.suppliers.add')"
+                        icon-name="mdi:add-bold"
+                        icon-position="left"
+                        @click="goToCreate"
+                    />
+                </div>
+            </template>
+        </PageHeader>
+
+        <!-- Datatable branchee sur usePaginatedList via useSuppliersRepository :
+             pagination serveur, tri companyName ASC par defaut (cote back). -->
+        <MalioDataTable
+            :columns="columns"
+            :items="rows"
+            :total-items="totalItems"
+            :page="currentPage"
+            :per-page="itemsPerPage"
+            :per-page-options="itemsPerPageOptions"
+            row-clickable
+            table-class="table-fixed suppliers-table"
+            :empty-message="t('commercial.suppliers.empty')"
+            @row-click="onRowClick"
+            @update:page="goToPage"
+            @update:per-page="setItemsPerPage"
+        >
+            <!-- Categories : libelles (name) separes par une virgule (spec M2). -->
+            <template #cell-categories="{ item }">
+                {{ formatCategories(item) }}
+            </template>
+
+            <!-- Sites : badges colores (name + color), agreges des adresses. -->
+            <template #cell-sites="{ item }">
+                <span class="flex flex-wrap gap-1">
+                    <span
+                        v-for="site in (item.sites as SupplierSite[])"
+                        :key="site.id"
+                        class="inline-flex items-center rounded-full px-2 py-0.5 font-medium text-white"
+                        :style="{ backgroundColor: site.color }"
+                    >
+                        {{ site.name }}
+                    </span>
+                </span>
+            </template>
+
+            <!-- Derniere activite : date de derniere modification (updatedAt). -->
+            <template #cell-lastActivity="{ item }">
+                {{ formatLastActivity(item) }}
+            </template>
+        </MalioDataTable>
+
+        <div class="flex justify-center mt-4">
+            <MalioButton
+                v-if="canView"
+                variant="primary"
+                :label="t('commercial.suppliers.export')"
+                :disabled="exporting"
+                @click="exportXlsx"
+            />
+        </div>
+
+        <!-- Drawer de filtres : etat BROUILLON, applique uniquement au clic sur
+             « Appliquer ». Meme pattern que le repertoire clients. Etat 100 % local,
+             jamais dans l'URL (regle ABSOLUE n°6). -->
+        <MalioDrawer
+            v-model="filterDrawerOpen"
+            drawer-class="max-w-[450px]"
+            body-class="p-0"
+            footer-class="justify-between border-t border-black p-6"
+        >
+            <template #header>
+                <h2 class="text-[24px] font-bold uppercase">{{ t('commercial.suppliers.filters.title') }}</h2>
+            </template>
+
+            <MalioAccordion>
+                <!-- Recherche : nom societe + contact + email (param `search`, decision D1). -->
+                <MalioAccordionItem :title="t('commercial.suppliers.filters.search')" value="search">
+                    <MalioInputText
+                        v-model="draftSearch"
+                        icon-name="mdi:magnify"
+                    />
+                </MalioAccordionItem>
+
+                <!-- Categories : cases a cocher (multi). Valeur = code stable. -->
+                <MalioAccordionItem :title="t('commercial.suppliers.filters.categories')" value="categories">
+                    <div class="flex flex-col">
+                        <MalioCheckbox
+                            v-for="opt in categoryOptions"
+                            :id="`filter-category-${opt.value}`"
+                            :key="opt.value"
+                            :label="opt.label"
+                            :model-value="draftCategoryCodes.includes(opt.value)"
+                            @update:model-value="(val: boolean) => toggleCategory(opt.value, val)"
+                        />
+                    </div>
+                </MalioAccordionItem>
+
+                <!-- Sites : cases a cocher (multi). Valeur = id du site. -->
+                <MalioAccordionItem :title="t('commercial.suppliers.filters.sites')" value="sites">
+                    <div class="flex flex-col">
+                        <MalioCheckbox
+                            v-for="opt in siteOptions"
+                            :id="`filter-site-${opt.value}`"
+                            :key="opt.value"
+                            :label="opt.label"
+                            :model-value="draftSiteIds.includes(opt.value)"
+                            @update:model-value="(val: boolean) => toggleSite(opt.value, val)"
+                        />
+                    </div>
+                </MalioAccordionItem>
+
+                <!-- Statut : bool unique. Coche = inclut aussi les archives (sinon actifs seuls). -->
+                <MalioAccordionItem :title="t('commercial.suppliers.filters.status')" value="status">
+                    <MalioCheckbox
+                        id="filter-include-archived"
+                        :label="t('commercial.suppliers.filters.includeArchived')"
+                        :model-value="draftIncludeArchived"
+                        @update:model-value="(val: boolean) => draftIncludeArchived = val"
+                    />
+                </MalioAccordionItem>
+            </MalioAccordion>
+
+            <template #footer>
+                <MalioButton
+                    variant="tertiary"
+                    :label="t('commercial.suppliers.filters.reset')"
+                    button-class="w-m-btn-action"
+                    @click="resetFilters"
+                />
+                <MalioButton
+                    variant="primary"
+                    :label="t('commercial.suppliers.filters.apply')"
+                    button-class="w-[170px]"
+                    @click="applyFilters"
+                />
+            </template>
+        </MalioDrawer>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import type { Supplier, SupplierSite } from '~/modules/commercial/composables/useSuppliersRepository'
+
+interface FilterOption {
+    value: string
+    label: string
+}
+
+const { t } = useI18n()
+const api = useApi()
+const router = useRouter()
+const toast = useToast()
+const { can } = usePermissions()
+
+useHead({ title: t('commercial.suppliers.title') })
+
+// Bouton « Ajouter » reserve a `manage` (POST /suppliers garde manage seul →
+// Compta / Usine ne creent pas). « Exporter » et « Filtres » suivent `view`.
+const canManage = computed(() => can('commercial.suppliers.manage'))
+const canView = computed(() => can('commercial.suppliers.view'))
+
+const {
+    items: suppliers,
+    totalItems,
+    currentPage,
+    itemsPerPage,
+    itemsPerPageOptions,
+    fetch: loadSuppliers,
+    goToPage,
+    setItemsPerPage,
+    setFilters,
+} = useSuppliersRepository()
+
+// Mappe les fournisseurs en objets « plats » pour MalioDataTable (items typees
+// Record<string, unknown>[]) : un objet litteral porte une signature d'index
+// implicite, contrairement a l'interface Supplier. Meme pattern que clients.
+const rows = computed(() => suppliers.value.map(supplier => ({
+    id: supplier.id,
+    companyName: supplier.companyName,
+    categories: supplier.categories,
+    sites: supplier.sites,
+    updatedAt: supplier.updatedAt,
+})))
+
+const columns = [
+    { key: 'companyName', label: t('commercial.suppliers.column.companyName') },
+    { key: 'categories', label: t('commercial.suppliers.column.categories') },
+    { key: 'sites', label: t('commercial.suppliers.column.sites') },
+    { key: 'lastActivity', label: t('commercial.suppliers.column.lastActivity') },
+]
+
+/** Libelles des categories du fournisseur, separes par une virgule (spec M2 : name). */
+function formatCategories(item: Record<string, unknown>): string {
+    const categories = (item.categories as Supplier['categories']) ?? []
+    return categories.map(c => c.name).join(', ')
+}
+
+/**
+ * Derniere activite : faute de suivi d'activite metier au M2, on affiche la
+ * date de derniere modification de la fiche (updatedAt, expose en liste via
+ * default:read). Format court francais jj/mm/aaaa.
+ */
+function formatLastActivity(item: Record<string, unknown>): string {
+    const value = item.updatedAt as string | null | undefined
+    if (!value) {
+        return ''
+    }
+
+    // Garde-fou date invalide : un updatedAt mal forme donnerait « Invalid Date ».
+    const date = new Date(value)
+    if (Number.isNaN(date.getTime())) {
+        return ''
+    }
+
+    return date.toLocaleDateString('fr-FR')
+}
+
+/** Clic sur une ligne → ecran Consultation (route a plat /suppliers/{id}). */
+function onRowClick(item: Record<string, unknown>): void {
+    router.push(`/suppliers/${item.id}`)
+}
+
+function goToCreate(): void {
+    router.push('/suppliers/new')
+}
+
+// ── Filtres (drawer) ────────────────────────────────────────────────────────
+// Deux niveaux d'etat (pattern repertoire clients) :
+//  - APPLIED : pilote la liste/l'export + le compteur du bouton. Modifie
+//    uniquement au clic « Appliquer » / « Réinitialiser ».
+//  - DRAFT : edite librement dans le drawer ; recopie vers applied a la validation.
+const filterDrawerOpen = ref(false)
+
+const draftSearch = ref('')
+const draftCategoryCodes = ref<string[]>([])
+const draftSiteIds = ref<string[]>([])
+const draftIncludeArchived = ref(false)
+
+const appliedSearch = ref('')
+const appliedCategoryCodes = ref<string[]>([])
+const appliedSiteIds = ref<string[]>([])
+const appliedIncludeArchived = ref(false)
+
+// Options des selects multi, chargees une fois (referentiels courts).
+const categoryOptions = ref<FilterOption[]>([])
+const siteOptions = ref<FilterOption[]>([])
+
+const activeFilterCount = computed(() => {
+    let count = 0
+    if (appliedSearch.value.trim() !== '') count++
+    if (appliedCategoryCodes.value.length > 0) count++
+    if (appliedSiteIds.value.length > 0) count++
+    if (appliedIncludeArchived.value) count++
+    return count
+})
+
+const filterButtonLabel = computed(() => {
+    const base = t('commercial.suppliers.filters.title')
+    return activeFilterCount.value > 0 ? `${base} (${activeFilterCount.value})` : base
+})
+
+// Recopie l'etat applique vers le brouillon puis ouvre le drawer : la
+// reouverture reflete les filtres actifs.
+function openFilters(): void {
+    draftSearch.value = appliedSearch.value
+    draftCategoryCodes.value = [...appliedCategoryCodes.value]
+    draftSiteIds.value = [...appliedSiteIds.value]
+    draftIncludeArchived.value = appliedIncludeArchived.value
+    filterDrawerOpen.value = true
+}
+
+function toggleCategory(code: string, selected: boolean): void {
+    draftCategoryCodes.value = selected
+        ? [...draftCategoryCodes.value, code]
+        : draftCategoryCodes.value.filter(c => c !== code)
+}
+
+function toggleSite(id: string, selected: boolean): void {
+    draftSiteIds.value = selected
+        ? [...draftSiteIds.value, id]
+        : draftSiteIds.value.filter(s => s !== id)
+}
+
+/**
+ * Construit le payload de filtres serveur a partir de l'etat applique. Cles
+ * `categoryCode[]` / `siteId[]` pour que PHP les parse en tableaux (OR cote back).
+ * Les filtres vides sont omis pour une query propre.
+ */
+function buildFilterPayload(): Record<string, string | string[] | boolean> {
+    const payload: Record<string, string | string[] | boolean> = {}
+    if (appliedSearch.value.trim() !== '') payload.search = appliedSearch.value.trim()
+    if (appliedCategoryCodes.value.length > 0) payload['categoryCode[]'] = [...appliedCategoryCodes.value]
+    if (appliedSiteIds.value.length > 0) payload['siteId[]'] = [...appliedSiteIds.value]
+    if (appliedIncludeArchived.value) payload.includeArchived = true
+    return payload
+}
+
+// « Appliquer » : recopie brouillon → applied, pousse les filtres (retombe en
+// page 1 via usePaginatedList) et ferme le drawer.
+function applyFilters(): void {
+    appliedSearch.value = draftSearch.value.trim()
+    appliedCategoryCodes.value = [...draftCategoryCodes.value]
+    appliedSiteIds.value = [...draftSiteIds.value]
+    appliedIncludeArchived.value = draftIncludeArchived.value
+
+    setFilters(buildFilterPayload(), { replace: true })
+    filterDrawerOpen.value = false
+}
+
+// « Réinitialiser » : vide brouillon ET applied, recharge la liste complete.
+// Le drawer reste ouvert pour montrer le formulaire vide.
+function resetFilters(): void {
+    draftSearch.value = ''
+    draftCategoryCodes.value = []
+    draftSiteIds.value = []
+    draftIncludeArchived.value = false
+
+    appliedSearch.value = ''
+    appliedCategoryCodes.value = []
+    appliedSiteIds.value = []
+    appliedIncludeArchived.value = false
+
+    setFilters({}, { replace: true })
+}
+
+/** Charge les referentiels du drawer (categories FOURNISSEUR + sites) via ?pagination=false. */
+async function loadFilterOptions(): Promise<void> {
+    const [cats, sites] = await Promise.all([
+        api.get<{ member?: Array<{ code: string, name: string }> }>(
+            '/categories',
+            // Taxonomie multi-types (ERP-84) : le filtre du repertoire fournisseurs
+            // ne propose que les categories de type FOURNISSEUR (pas les CLIENT).
+            { pagination: 'false', typeCode: 'FOURNISSEUR' },
+            { headers: { Accept: 'application/ld+json' }, toast: false },
+        ),
+        api.get<{ member?: Array<{ id: number, name: string }> }>(
+            '/sites',
+            { pagination: 'false' },
+            { headers: { Accept: 'application/ld+json' }, toast: false },
+        ),
+    ])
+
+    categoryOptions.value = (cats.member ?? []).map(c => ({ value: c.code, label: c.name }))
+    siteOptions.value = (sites.member ?? []).map(s => ({ value: String(s.id), label: s.name }))
+}
+
+// ── Export XLSX ─────────────────────────────────────────────────────────────
+// Memes filtres que la vue. La colonne SIREN n'est dans le fichier que si
+// l'utilisateur a accounting.view (gere cote back).
+const exporting = ref(false)
+
+async function exportXlsx(): Promise<void> {
+    if (exporting.value) {
+        return
+    }
+    exporting.value = true
+    try {
+        // useApi type ses options en JSON ; l'export renvoie un binaire, donc on
+        // force responseType:'blob' (transmis tel quel a ofetch au runtime). Cast
+        // contenu faute d'overload blob sur le client partage — a generaliser via
+        // un ticket dedie si d'autres exports binaires arrivent.
+        const blob = await api.get<Blob>('/suppliers/export.xlsx', buildFilterPayload(), {
+            responseType: 'blob',
+            toast: false,
+        } as unknown as Parameters<typeof api.get>[2])
+
+        triggerDownload(blob, 'repertoire-fournisseurs.xlsx')
+    }
+    catch {
+        toast.error({
+            title: t('commercial.suppliers.toast.error'),
+            message: t('commercial.suppliers.toast.exportError'),
+        })
+    }
+    finally {
+        exporting.value = false
+    }
+}
+
+/** Declenche le telechargement d'un blob via un lien temporaire. */
+function triggerDownload(blob: Blob, filename: string): void {
+    const url = URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = filename
+    document.body.appendChild(link)
+    link.click()
+    link.remove()
+    URL.revokeObjectURL(url)
+}
+
+onMounted(() => {
+    loadSuppliers()
+    // Echec du chargement des referentiels non bloquant : la liste s'affiche,
+    // l'utilisateur perd juste les options de filtre.
+    loadFilterOptions().catch(() => {
+        categoryOptions.value = []
+        siteOptions.value = []
+    })
+})
+</script>
+
+<style scoped>
+/*
+ * Colonne Sites uniquement (3e colonne : companyName, categories, SITES,
+ * lastActivity) : ses badges rendent la cellule trop haute. On reduit le padding
+ * vertical de SON td (16px Malio -> 8px) sans toucher les autres colonnes ni les
+ * couleurs/tailles (qui restent sur les defauts Malio).
+ */
+:deep(.suppliers-table tbody td:nth-child(3)) {
+    padding-top: 8px;
+    padding-bottom: 8px;
+}
+</style>
@@ -0,0 +1,879 @@
+<template>
+    <div>
+        <!-- En-tete : retour vers le repertoire + titre. -->
+        <div class="flex items-center gap-3 pt-11">
+            <MalioButtonIcon
+                icon="mdi:arrow-left-bold"
+                icon-size="24"
+                variant="ghost"
+                v-bind="{ ariaLabel: t('commercial.suppliers.form.back') }"
+                @click="goBack"
+            />
+            <h1 class="text-[30px] font-semibold text-m-primary">{{ t('commercial.suppliers.form.title') }}</h1>
+        </div>
+
+        <!-- ── Formulaire principal (pre-onglets) ─────────────────────────────
+             Sans validation de ce bloc, les onglets restent inaccessibles. Au
+             succes du POST, les champs passent en lecture seule et on bascule
+             automatiquement sur l'onglet Information. Pas de contact inline (ERP-106). -->
+        <div class="mt-[48px] grid grid-cols-3 xl:grid-cols-4 gap-x-[44px] gap-y-4">
+            <MalioInputText
+                v-model="main.companyName"
+                :label="t('commercial.suppliers.form.main.companyName')"
+                :required="true"
+                :readonly="mainLocked"
+                :error="mainErrors.errors.companyName"
+            />
+            <MalioSelectCheckbox
+                :model-value="main.categoryIris"
+                :options="referentials.categories.value"
+                :label="t('commercial.suppliers.form.main.categories')"
+                :display-tag="true"
+                :readonly="mainLocked"
+                :required="true"
+                :error="mainErrors.errors.categories"
+                @update:model-value="(v: (string | number)[]) => main.categoryIris = v.map(String)"
+            />
+        </div>
+
+        <div v-if="!mainLocked" class="mt-12 flex justify-center">
+            <MalioButton
+                variant="primary"
+                :label="t('commercial.suppliers.form.submit')"
+                :disabled="mainSubmitting"
+                @click="submitMain"
+            />
+        </div>
+
+        <!-- ── Onglets a validation incrementale ─────────────────────────────-->
+        <MalioTabList v-model="activeTab" :tabs="tabs" class="mt-[60px]">
+            <!-- Onglet Information -->
+            <template #information>
+                <div class="mt-12 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)]">
+                    <MalioInputTextArea
+                        v-model="information.description"
+                        :label="t('commercial.suppliers.form.information.description')"
+                        resize="none"
+                        group-class="row-span-2 pt-1 pb-1"
+                        text-input="h-full text-lg"
+                        :readonly="isValidated('information')"
+                        :error="informationErrors.errors.description"
+                    />
+                    <MalioInputText
+                        v-model="information.competitors"
+                        :label="t('commercial.suppliers.form.information.competitors')"
+                        :readonly="isValidated('information')"
+                        :error="informationErrors.errors.competitors"
+                    />
+                    <MalioDate
+                        v-model="information.foundedAt"
+                        :label="t('commercial.suppliers.form.information.foundedAt')"
+                        :readonly="isValidated('information')"
+                        :editable="true"
+                        :error="informationErrors.errors.foundedAt"
+                        @update:raw-value="(v: string) => information.foundedAtRaw = v"
+                    />
+                    <MalioInputText
+                        v-model="information.employeesCount"
+                        :label="t('commercial.suppliers.form.information.employeesCount')"
+                        :mask="EMPLOYEES_MASK"
+                        :readonly="isValidated('information')"
+                        :error="informationErrors.errors.employeesCount"
+                    />
+                    <MalioInputAmount
+                        v-model="information.revenueAmount"
+                        :label="t('commercial.suppliers.form.information.revenueAmount')"
+                        :readonly="isValidated('information')"
+                        :error="informationErrors.errors.revenueAmount"
+                    />
+                    <MalioInputText
+                        v-model="information.directorName"
+                        :label="t('commercial.suppliers.form.information.directorName')"
+                        :readonly="isValidated('information')"
+                        :error="informationErrors.errors.directorName"
+                    />
+                    <MalioInputAmount
+                        v-model="information.profitAmount"
+                        :label="t('commercial.suppliers.form.information.profitAmount')"
+                        :readonly="isValidated('information')"
+                        :error="informationErrors.errors.profitAmount"
+                    />
+                    <!-- Volume previsionnel : specifique fournisseur. Champ texte
+                         masque (chiffres uniquement) ; l'entier est resolu au PATCH. -->
+                    <MalioInputText
+                        v-model="information.volumeForecast"
+                        :label="t('commercial.suppliers.form.information.volumeForecast')"
+                        :mask="VOLUME_FORECAST_MASK"
+                        :readonly="isValidated('information')"
+                        :error="informationErrors.errors.volumeForecast"
+                    />
+                </div>
+                <div v-if="!isValidated('information')" class="mt-12 flex justify-center">
+                    <MalioButton
+                        variant="primary"
+                        :label="t('commercial.suppliers.form.submit')"
+                        :disabled="tabSubmitting || supplierId === null"
+                        @click="submitInformation"
+                    />
+                </div>
+            </template>
+
+            <!-- Onglet Contacts -->
+            <template #contacts>
+                <div class="mt-12 flex flex-col gap-6">
+                    <SupplierContactBlock
+                        v-for="(contact, index) in contacts"
+                        :key="index"
+                        :model-value="contact"
+                        :title="t('commercial.suppliers.form.contact.title', { n: index + 1 })"
+                        :removable="index > 0"
+                        :readonly="isValidated('contacts')"
+                        :errors="contactErrors[index]"
+                        @update:model-value="(v) => contacts[index] = v"
+                        @remove="askRemoveContact(index)"
+                    />
+                    <div v-if="!isValidated('contacts')" class="flex justify-center gap-6">
+                        <MalioButton
+                            variant="secondary"
+                            icon-name="mdi:add-bold"
+                            icon-position="left"
+                            :label="t('commercial.suppliers.form.contact.add')"
+                            :disabled="!canAddContact"
+                            @click="addContact"
+                        />
+                        <MalioButton
+                            variant="primary"
+                            :label="t('commercial.suppliers.form.submit')"
+                            :disabled="tabSubmitting"
+                            @click="submitContacts"
+                        />
+                    </div>
+                </div>
+            </template>
+
+            <!-- Onglet Adresses -->
+            <template #addresses>
+                <div class="mt-12 flex flex-col gap-6">
+                    <SupplierAddressBlock
+                        v-for="(address, index) in addresses"
+                        :key="index"
+                        :model-value="address"
+                        :title="t('commercial.suppliers.form.address.title', { n: index + 1 })"
+                        :category-options="referentials.categories.value"
+                        :site-options="referentials.sites.value"
+                        :contact-options="contactOptions"
+                        :country-options="countryOptions"
+                        :removable="index > 0"
+                        :readonly="isValidated('addresses')"
+                        :errors="addressErrors[index]"
+                        @update:model-value="(v) => addresses[index] = v"
+                        @remove="askRemoveAddress(index)"
+                        @degraded="onAddressDegraded"
+                    />
+                    <div v-if="!isValidated('addresses')" class="flex justify-center gap-6">
+                        <MalioButton
+                            variant="secondary"
+                            icon-name="mdi:add-bold"
+                            icon-position="left"
+                            :label="t('commercial.suppliers.form.address.add')"
+                            :disabled="!canAddAddress"
+                            @click="addAddress"
+                        />
+                        <MalioButton
+                            variant="primary"
+                            :label="t('commercial.suppliers.form.submit')"
+                            :disabled="tabSubmitting"
+                            @click="submitAddresses"
+                        />
+                    </div>
+                </div>
+            </template>
+
+            <!-- Onglet Comptabilite (present uniquement si accounting.view) -->
+            <template v-if="canAccountingView" #accounting>
+                <div class="mt-12 flex flex-col gap-6">
+                    <div class="bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]">
+                        <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                            <MalioInputText
+                                v-model="accounting.siren"
+                                :label="t('commercial.suppliers.form.accounting.siren')"
+                                :mask="SIREN_MASK"
+                                :readonly="accountingReadonly"
+                                :required="true"
+                                :error="accountingErrors.errors.siren"
+                            />
+                            <MalioInputText
+                                v-model="accounting.accountNumber"
+                                :label="t('commercial.suppliers.form.accounting.accountNumber')"
+                                :readonly="accountingReadonly"
+                                :required="true"
+                                :error="accountingErrors.errors.accountNumber"
+                            />
+                            <MalioSelect
+                                :model-value="accounting.tvaModeIri"
+                                :options="referentials.tvaModes.value"
+                                :label="t('commercial.suppliers.form.accounting.tvaMode')"
+                                :readonly="accountingReadonly"
+                                empty-option-label=""
+                                :required="true"
+                                :error="accountingErrors.errors.tvaMode"
+                                @update:model-value="(v: string | number | null) => accounting.tvaModeIri = v === null ? null : String(v)"
+                            />
+                            <MalioInputText
+                                v-model="accounting.nTva"
+                                :label="t('commercial.suppliers.form.accounting.nTva')"
+                                :readonly="accountingReadonly"
+                                :required="true"
+                                :error="accountingErrors.errors.nTva"
+                            />
+                            <MalioSelect
+                                :model-value="accounting.paymentDelayIri"
+                                :options="referentials.paymentDelays.value"
+                                :label="t('commercial.suppliers.form.accounting.paymentDelay')"
+                                :readonly="accountingReadonly"
+                                empty-option-label=""
+                                :required="true"
+                                :error="accountingErrors.errors.paymentDelay"
+                                @update:model-value="(v: string | number | null) => accounting.paymentDelayIri = v === null ? null : String(v)"
+                            />
+                            <MalioSelect
+                                :model-value="accounting.paymentTypeIri"
+                                :options="referentials.paymentTypes.value"
+                                :label="t('commercial.suppliers.form.accounting.paymentType')"
+                                :readonly="accountingReadonly"
+                                empty-option-label=""
+                                :required="true"
+                                :error="accountingErrors.errors.paymentType"
+                                @update:model-value="onPaymentTypeChange"
+                            />
+                            <MalioSelect
+                                v-if="isBankRequired"
+                                :model-value="accounting.bankIri"
+                                :options="referentials.banks.value"
+                                :label="t('commercial.suppliers.form.accounting.bank')"
+                                :readonly="accountingReadonly"
+                                empty-option-label=""
+                                :required="true"
+                                :error="accountingErrors.errors.bank"
+                                @update:model-value="(v: string | number | null) => accounting.bankIri = v === null ? null : String(v)"
+                            />
+                        </div>
+                    </div>
+
+                    <!-- Blocs RIB — affiches uniquement si type de reglement = LCR (RG-2.08). -->
+                    <div
+                        v-for="(rib, index) in visibleRibs"
+                        :key="index"
+                        class="relative bg-white py-4 pl-[28px] pr-[60px] shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]"
+                    >
+                        <MalioButtonIcon
+                            v-if="!accountingReadonly && visibleRibs.length > 1"
+                            icon="mdi:delete-outline"
+                            variant="ghost"
+                            button-class="absolute top-3 right-3"
+                            v-bind="{ ariaLabel: t('commercial.suppliers.form.accounting.removeRib') }"
+                            @click="askRemoveRib(index)"
+                        />
+                        <div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
+                            <MalioInputText
+                                v-model="rib.label"
+                                :label="t('commercial.suppliers.form.accounting.ribLabel')"
+                                :readonly="accountingReadonly"
+                                :required="isRibRequired"
+                                :error="ribErrors[index]?.label"
+                            />
+                            <MalioInputText
+                                v-model="rib.bic"
+                                :label="t('commercial.suppliers.form.accounting.ribBic')"
+                                :readonly="accountingReadonly"
+                                :required="isRibRequired"
+                                :error="ribErrors[index]?.bic"
+                            />
+                            <MalioInputText
+                                v-model="rib.iban"
+                                :label="t('commercial.suppliers.form.accounting.ribIban')"
+                                :readonly="accountingReadonly"
+                                :required="isRibRequired"
+                                :error="ribErrors[index]?.iban"
+                            />
+                        </div>
+                    </div>
+
+                    <div v-if="!accountingReadonly" class="flex justify-center gap-6">
+                        <MalioButton
+                            v-if="isRibRequired"
+                            variant="secondary"
+                            icon-name="mdi:add-bold"
+                            icon-position="left"
+                            :label="t('commercial.suppliers.form.accounting.addRib')"
+                            :disabled="!canAddRib"
+                            @click="addRib"
+                        />
+                        <MalioButton
+                            variant="primary"
+                            :label="t('commercial.suppliers.form.submit')"
+                            :disabled="tabSubmitting"
+                            @click="submitAccounting"
+                        />
+                    </div>
+                </div>
+            </template>
+
+            <!-- Onglet placeholder : frame vide, passage automatique. -->
+            <template #transport><ComingSoonPlaceholder /></template>
+        </MalioTabList>
+
+        <!-- Modal de confirmation generique (suppression contact/adresse/RIB). -->
+        <MalioModal v-model="confirmModal.open" modal-class="max-w-md">
+            <template #header>
+                <h2 class="text-[24px] font-bold">{{ t('commercial.suppliers.form.confirmDelete.title') }}</h2>
+            </template>
+            <p>{{ confirmModal.message }}</p>
+            <template #footer>
+                <MalioButton
+                    variant="secondary"
+                    button-class="flex-1"
+                    :label="t('commercial.suppliers.form.confirmDelete.cancel')"
+                    @click="confirmModal.open = false"
+                />
+                <MalioButton
+                    variant="danger"
+                    button-class="flex-1"
+                    :label="t('commercial.suppliers.form.confirmDelete.confirm')"
+                    @click="runConfirm"
+                />
+            </template>
+        </MalioModal>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, reactive, ref, watch } from 'vue'
+import { useSupplierReferentials, type RefOption } from '~/modules/commercial/composables/useSupplierReferentials'
+import { useSupplierFormErrors } from '~/modules/commercial/composables/useSupplierFormErrors'
+import {
+    buildSupplierFormTabKeys,
+    SUPPLIER_FORM_PLACEHOLDER_TABS,
+    isAddressValid,
+    isBankRequiredForPaymentType,
+    isContactBlank,
+    isContactNamed,
+    isRibBlank,
+    isRibComplete,
+    isRibRequiredForPaymentType,
+    lastFillableTabKey,
+} from '~/modules/commercial/utils/forms/supplierFormRules'
+import {
+    buildAccountingPayload,
+    buildAddressPayload,
+    buildContactPayload,
+    buildInformationPayload,
+    buildMainPayload,
+    buildRibPayload,
+} from '~/modules/commercial/utils/forms/supplierEdit'
+import {
+    emptyAddress,
+    emptyContact,
+    emptyRib,
+    type SupplierAddressFormDraft,
+    type SupplierContactFormDraft,
+    type SupplierRibFormDraft,
+} from '~/modules/commercial/types/supplierForm'
+import { extractApiErrorMessage } from '~/shared/utils/api'
+
+// Masques de saisie (la normalisation finale reste serveur).
+const SIREN_MASK = '#########'
+const EMPLOYEES_MASK = '#######'
+// Volume previsionnel : champ texte borne aux chiffres (entier >= 0 cote back).
+const VOLUME_FORECAST_MASK = '##########'
+
+const { t } = useI18n()
+const api = useApi()
+const toast = useToast()
+const router = useRouter()
+const { can } = usePermissions()
+
+/** Retour vers le repertoire fournisseurs (fleche d'en-tete). */
+function goBack(): void {
+    router.push('/suppliers')
+}
+
+/**
+ * Message d'erreur a afficher dans un toast a partir d'une erreur d'API. Retourne
+ * TOUJOURS une chaine (le composant de toast plante sur `undefined`).
+ */
+function apiErrorMessage(error: unknown): string {
+    const data = (error as { data?: unknown })?.data
+    return extractApiErrorMessage(data) || t('commercial.suppliers.toast.error')
+}
+
+// ── Erreurs de validation par champ (ERP-101) ───────────────────────────────
+const {
+    mainErrors,
+    informationErrors,
+    accountingErrors,
+    contactErrors,
+    addressErrors,
+    ribErrors,
+    submitRows,
+} = useSupplierFormErrors()
+
+useHead({ title: t('commercial.suppliers.form.title') })
+
+// Gating de la route : la creation est reservee a `manage`. Compta (accounting
+// seul) et Usine sont rediriges vers le repertoire.
+if (!can('commercial.suppliers.manage')) {
+    await navigateTo('/suppliers')
+}
+
+const canAccountingView = computed(() => can('commercial.suppliers.accounting.view'))
+const canAccountingManage = computed(() => can('commercial.suppliers.accounting.manage'))
+
+const referentials = useSupplierReferentials()
+
+// ── Etat du fournisseur cree ────────────────────────────────────────────────
+const supplierId = ref<number | null>(null)
+const mainLocked = ref(false)
+const mainSubmitting = ref(false)
+const tabSubmitting = ref(false)
+
+// ── Formulaire principal ────────────────────────────────────────────────────
+const main = reactive({
+    companyName: null as string | null,
+    categoryIris: [] as string[],
+})
+
+/** POST /suppliers (groupe supplier:write:main). Au succes : verrouille + bascule Information. */
+async function submitMain(): Promise<void> {
+    if (mainSubmitting.value) return
+    mainSubmitting.value = true
+    mainErrors.clearErrors()
+    try {
+        const created = await api.post<SupplierResponse>('/suppliers', buildMainPayload(main), {
+            headers: { Accept: 'application/ld+json' },
+            toast: false,
+        })
+
+        supplierId.value = created.id
+        // Reaffiche la valeur normalisee renvoyee par le serveur (UPPERCASE, RG-2.12).
+        main.companyName = created.companyName ?? main.companyName
+
+        mainLocked.value = true
+        // Information est facultatif : on deverrouille jusqu'a Contacts (index 1).
+        unlockedIndex.value = tabIndex('contacts')
+        activeTab.value = 'information'
+        toast.success({ title: t('commercial.suppliers.toast.createSuccess') })
+    }
+    catch (error) {
+        // 409 = doublon nom de societe (RG d'unicite) → erreur inline + toast ;
+        // 422 → mapping inline par champ ; autre → toast de fallback (ERP-101).
+        const status = (error as { response?: { status?: number } })?.response?.status
+        if (status === 409) {
+            const message = t('commercial.suppliers.form.duplicateCompany')
+            mainErrors.setError('companyName', message)
+            toast.error({ title: t('commercial.suppliers.toast.error'), message })
+        }
+        else {
+            mainErrors.handleApiError(error, { fallbackMessage: t('commercial.suppliers.toast.error') })
+        }
+    }
+    finally {
+        mainSubmitting.value = false
+    }
+}
+
+// ── Onglets : ordre + gating progressif ─────────────────────────────────────
+const activeTab = ref('information')
+// Index du dernier onglet deverrouille (-1 tant que le fournisseur n'est pas cree).
+const unlockedIndex = ref(-1)
+// Onglets valides (passent en lecture seule).
+const validated = reactive<Record<string, boolean>>({})
+
+const tabKeys = computed(() => buildSupplierFormTabKeys(canAccountingView.value))
+
+// Dernier onglet REMPLISSABLE par le role : sa validation cloture l'ajout.
+const lastFillableTab = computed(() => lastFillableTabKey(tabKeys.value))
+
+// Icone (Iconify) affichee dans l'onglet, par cle.
+const TAB_ICONS: Record<string, string> = {
+    information: 'mdi:account-outline',
+    contacts: 'mdi:account-box-plus-outline',
+    addresses: 'mdi:map-marker-outline',
+    transport: 'mdi:truck-delivery-outline',
+    accounting: 'mdi:bank-circle-outline',
+}
+
+const tabs = computed(() => tabKeys.value.map((key, index) => ({
+    key,
+    label: t(`commercial.suppliers.tab.${key}`),
+    icon: TAB_ICONS[key],
+    disabled: index > unlockedIndex.value,
+})))
+
+function isValidated(key: string): boolean {
+    return validated[key] === true
+}
+
+function tabIndex(key: string): number {
+    return tabKeys.value.indexOf(key)
+}
+
+/**
+ * Marque l'onglet valide. Si c'est le dernier onglet remplissable, l'ajout est
+ * termine : toast final + redirection vers la liste, et on retourne true. Sinon,
+ * deverrouille et avance a l'onglet suivant, et retourne false.
+ */
+function completeTab(key: string): boolean {
+    validated[key] = true
+    if (key === lastFillableTab.value) {
+        toast.success({ title: t('commercial.suppliers.toast.addComplete') })
+        router.push('/suppliers')
+        return true
+    }
+    const next = tabKeys.value[tabIndex(key) + 1]
+    unlockedIndex.value = Math.max(unlockedIndex.value, tabIndex(key) + 1)
+    if (next) activeTab.value = next
+    return false
+}
+
+// Passage automatique sur les onglets coquille (Transport).
+watch(activeTab, (key) => {
+    if ((SUPPLIER_FORM_PLACEHOLDER_TABS as readonly string[]).includes(key)) {
+        const next = tabKeys.value[tabIndex(key) + 1]
+        unlockedIndex.value = Math.max(unlockedIndex.value, tabIndex(key) + 1)
+        if (next) activeTab.value = next
+    }
+})
+
+// ── Onglet Information ──────────────────────────────────────────────────────
+const information = reactive({
+    description: null as string | null,
+    competitors: null as string | null,
+    foundedAt: null as string | null,
+    // Saisie brute invalide remontee par MalioDate (cf. foundedAtRaw, MUI-44).
+    foundedAtRaw: '',
+    employeesCount: null as string | null,
+    revenueAmount: null as string | null,
+    profitAmount: null as string | null,
+    directorName: null as string | null,
+    volumeForecast: null as string | null,
+})
+
+/** PATCH /suppliers/{id} — mode strict : uniquement les champs du groupe information. */
+async function submitInformation(): Promise<void> {
+    if (supplierId.value === null || tabSubmitting.value) return
+    tabSubmitting.value = true
+    informationErrors.clearErrors()
+    try {
+        await api.patch(`/suppliers/${supplierId.value}`, buildInformationPayload(information), { toast: false })
+        if (completeTab('information')) return
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    catch (error) {
+        informationErrors.handleApiError(error, { fallbackMessage: t('commercial.suppliers.toast.error') })
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Onglet Contacts ─────────────────────────────────────────────────────────
+const contacts = ref<SupplierContactFormDraft[]>([emptyContact()])
+
+// « + Nouveau contact » desactive tant que le dernier bloc n'a ni nom ni prenom.
+const canAddContact = computed(() => {
+    const last = contacts.value[contacts.value.length - 1]
+    return last !== undefined && isContactNamed(last)
+})
+
+function addContact(): void {
+    if (canAddContact.value) contacts.value.push(emptyContact())
+}
+
+function askRemoveContact(index: number): void {
+    askConfirm(t('commercial.suppliers.form.confirmDelete.contact'), () => {
+        contacts.value.splice(index, 1)
+        contactErrors.value.splice(index, 1)
+    })
+}
+
+/** POST/PATCH des contacts sur la sous-ressource /suppliers/{id}/contacts. */
+async function submitContacts(): Promise<void> {
+    if (supplierId.value === null || tabSubmitting.value) return
+    tabSubmitting.value = true
+    try {
+        // RG-2.13 : au moins un contact requis. Si l'onglet ne contient QUE des
+        // amorces vides, on les soumet pour declencher la 422 RG-2.04 inline.
+        const hasSubmittableContact = contacts.value.some(c => c.id !== null || !isContactBlank(c))
+        const hasError = await submitRows(
+            contacts.value,
+            contactErrors,
+            async (contact) => {
+                const body = buildContactPayload(contact)
+                if (contact.id === null) {
+                    const created = await api.post<ContactResponse>(
+                        `/suppliers/${supplierId.value}/contacts`,
+                        body,
+                        { headers: { Accept: 'application/ld+json' }, toast: false },
+                    )
+                    contact.id = created.id
+                    contact.iri = created['@id'] ?? null
+                }
+                else {
+                    await api.patch(`/supplier_contacts/${contact.id}`, body, { toast: false })
+                }
+            },
+            error => toast.error({ title: t('commercial.suppliers.toast.error'), message: apiErrorMessage(error) }),
+            contact => hasSubmittableContact && contact.id === null && isContactBlank(contact),
+        )
+        if (hasError) return
+        if (completeTab('contacts')) return
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Onglet Adresses ─────────────────────────────────────────────────────────
+const addresses = ref<SupplierAddressFormDraft[]>([emptyAddress()])
+const addressDegradedNotified = ref(false)
+
+// Contacts deja crees, rattachables a une adresse (M2M, via leur IRI).
+const contactOptions = computed<RefOption[]>(() =>
+    contacts.value
+        .filter(c => c.iri !== null)
+        .map(c => ({
+            value: c.iri as string,
+            label: [c.firstName, c.lastName].filter(Boolean).join(' ') || (c.email ?? ''),
+        })),
+)
+
+// Pays : referentiel `country` charge via l'API (ERP-116), aligne sur l'ecran
+// client. France garantie en tete pour rester preselectionnable par defaut sur
+// chaque adresse meme si `/countries` echoue (resilience ERP-102).
+const countryOptions = computed<RefOption[]>(() => {
+    const list = referentials.countries.value
+    return list.some(c => c.value === 'France')
+        ? list
+        : [{ value: 'France', label: 'France' }, ...list]
+})
+
+// « + Adresse » desactive tant que la derniere adresse n'est pas valide.
+const canAddAddress = computed(() => {
+    const last = addresses.value[addresses.value.length - 1]
+    return last !== undefined && isAddressValid(last)
+})
+
+function addAddress(): void {
+    if (canAddAddress.value) addresses.value.push(emptyAddress())
+}
+
+function askRemoveAddress(index: number): void {
+    askConfirm(t('commercial.suppliers.form.confirmDelete.address'), () => {
+        addresses.value.splice(index, 1)
+        addressErrors.value.splice(index, 1)
+    })
+}
+
+/** Avertit une seule fois quand l'autocompletion d'adresse bascule en degrade. */
+function onAddressDegraded(): void {
+    if (addressDegradedNotified.value) return
+    addressDegradedNotified.value = true
+    toast.warning({
+        title: t('commercial.suppliers.toast.error'),
+        message: t('commercial.suppliers.form.address.degraded'),
+    })
+}
+
+/** POST/PATCH des adresses sur la sous-ressource /suppliers/{id}/addresses. */
+async function submitAddresses(): Promise<void> {
+    if (supplierId.value === null || tabSubmitting.value) return
+    tabSubmitting.value = true
+    try {
+        const hasError = await submitRows(
+            addresses.value,
+            addressErrors,
+            async (address) => {
+                const body = buildAddressPayload(address)
+                if (address.id === null) {
+                    const created = await api.post<{ id: number }>(
+                        `/suppliers/${supplierId.value}/addresses`,
+                        body,
+                        { headers: { Accept: 'application/ld+json' }, toast: false },
+                    )
+                    address.id = created.id
+                }
+                else {
+                    await api.patch(`/supplier_addresses/${address.id}`, body, { toast: false })
+                }
+            },
+            error => toast.error({ title: t('commercial.suppliers.toast.error'), message: apiErrorMessage(error) }),
+        )
+        if (hasError) return
+        if (completeTab('addresses')) return
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Onglet Comptabilite ─────────────────────────────────────────────────────
+const accounting = reactive({
+    siren: null as string | null,
+    accountNumber: null as string | null,
+    tvaModeIri: null as string | null,
+    nTva: null as string | null,
+    paymentDelayIri: null as string | null,
+    paymentTypeIri: null as string | null,
+    bankIri: null as string | null,
+})
+const ribs = ref<SupplierRibFormDraft[]>([])
+
+// L'onglet est editable seulement avec accounting.manage (sinon lecture seule).
+const accountingReadonly = computed(() => isValidated('accounting') || !canAccountingManage.value)
+
+// Code du type de reglement selectionne (pour RG-2.07 / RG-2.08).
+const selectedPaymentTypeCode = computed(() =>
+    referentials.paymentTypes.value.find(p => p.value === accounting.paymentTypeIri)?.code ?? null,
+)
+const isBankRequired = computed(() => isBankRequiredForPaymentType(selectedPaymentTypeCode.value))
+const isRibRequired = computed(() => isRibRequiredForPaymentType(selectedPaymentTypeCode.value))
+
+// Les blocs RIB ne sont affiches que pour une LCR (RG-2.08).
+const visibleRibs = computed(() => isRibRequired.value ? ribs.value : [])
+
+function onPaymentTypeChange(value: string | number | null): void {
+    accounting.paymentTypeIri = value === null ? null : String(value)
+    // La banque n'a de sens que pour un virement : on la vide sinon (RG-2.07).
+    if (!isBankRequired.value) accounting.bankIri = null
+    // ERP-121 : on ne jette plus la saisie RIB au passage hors-LCR. Les blocs sont
+    // masques (visibleRibs = []) mais conserves, et reapparaissent si l'on repasse
+    // en LCR. Ils ne sont persistes qu'a la validation SOUS LCR (cf. submitAccounting),
+    // donc une saisie abandonnee hors-LCR ne cree aucun RIB orphelin.
+    if (isRibRequired.value) {
+        if (ribs.value.length === 0) ribs.value.push(emptyRib())
+    }
+    else {
+        ribErrors.value = []
+    }
+}
+
+// « + RIB » desactive tant que le dernier bloc RIB n'est pas complet.
+const canAddRib = computed(() => {
+    const last = ribs.value[ribs.value.length - 1]
+    return last !== undefined && isRibComplete(last)
+})
+
+function addRib(): void {
+    if (canAddRib.value) ribs.value.push(emptyRib())
+}
+
+function askRemoveRib(index: number): void {
+    askConfirm(t('commercial.suppliers.form.confirmDelete.rib'), () => {
+        ribs.value.splice(index, 1)
+        ribErrors.value.splice(index, 1)
+        // Garde au moins un bloc RIB visible.
+        if (ribs.value.length === 0) ribs.value.push(emptyRib())
+    })
+}
+
+/**
+ * Valide l'onglet Comptabilite : POST/PATCH des RIB sur /suppliers/{id}/ribs PUIS
+ * PATCH des scalaires (groupe supplier:write:accounting). Les RIB d'abord : le back
+ * valide RG-2.08 (LCR => au moins un RIB persiste) sur le PATCH scalaires, les RIB
+ * doivent donc exister en base AVANT. Deux appels distincts (mode strict).
+ */
+async function submitAccounting(): Promise<void> {
+    if (supplierId.value === null || tabSubmitting.value) return
+    tabSubmitting.value = true
+    accountingErrors.clearErrors()
+    try {
+        // 1) POST/PATCH des RIB d'abord — UNIQUEMENT sous LCR (erreurs inline par
+        // ligne). Hors-LCR (ERP-121), une saisie RIB eventuellement restee dans le
+        // brouillon est masquee et n'est PAS persistee (pas de RIB orphelin sur un
+        // fournisseur en virement). On ne saute une amorce neuve vide QUE s'il reste
+        // un autre RIB soumettable : sinon (LCR sans aucun RIB rempli) on la soumet
+        // pour declencher la 422 NotBlank inline.
+        if (isRibRequired.value) {
+            const hasSubmittableRib = ribs.value.some(r => r.id !== null || !isRibBlank(r))
+            const ribHasError = await submitRows(
+                ribs.value,
+                ribErrors,
+                async (rib) => {
+                    const body = buildRibPayload(rib)
+                    if (rib.id === null) {
+                        const created = await api.post<{ id: number }>(
+                            `/suppliers/${supplierId.value}/ribs`,
+                            body,
+                            { headers: { Accept: 'application/ld+json' }, toast: false },
+                        )
+                        rib.id = created.id
+                    }
+                    else {
+                        await api.patch(`/supplier_ribs/${rib.id}`, body, { toast: false })
+                    }
+                },
+                error => toast.error({ title: t('commercial.suppliers.toast.error'), message: apiErrorMessage(error) }),
+                rib => hasSubmittableRib && rib.id === null && isRibBlank(rib),
+            )
+            if (ribHasError) return
+        }
+
+        // 2) PATCH des scalaires comptables (erreurs inline sur leurs champs).
+        try {
+            await api.patch(
+                `/suppliers/${supplierId.value}`,
+                buildAccountingPayload(accounting, isBankRequired.value),
+                { toast: false },
+            )
+        }
+        catch (error) {
+            accountingErrors.handleApiError(error, { fallbackMessage: t('commercial.suppliers.toast.error') })
+            return
+        }
+
+        if (completeTab('accounting')) return
+        toast.success({ title: t('commercial.suppliers.toast.updateSuccess') })
+    }
+    finally {
+        tabSubmitting.value = false
+    }
+}
+
+// ── Modal de confirmation generique ─────────────────────────────────────────
+const confirmModal = reactive({
+    open: false,
+    message: '',
+    action: null as null | (() => void),
+})
+
+function askConfirm(message: string, action: () => void): void {
+    confirmModal.message = message
+    confirmModal.action = action
+    confirmModal.open = true
+}
+
+function runConfirm(): void {
+    confirmModal.action?.()
+    confirmModal.action = null
+    confirmModal.open = false
+}
+
+// ── Types de reponse API ────────────────────────────────────────────────────
+interface SupplierResponse {
+    id: number
+    companyName: string | null
+}
+
+interface ContactResponse {
+    '@id'?: string
+    id: number
+}
+
+onMounted(() => {
+    // Echec du chargement des referentiels non bloquant : les selects restent vides.
+    referentials.loadCommon().catch(() => {})
+})
+</script>
@@ -0,0 +1,110 @@
+/**
+ * Types « brouillon » de l'ecran « Ajouter un client » (M1 Commercial).
+ *
+ * Ces interfaces decrivent l'etat LOCAL du formulaire (refs Vue), distinct des
+ * DTO de l'API : elles portent en plus des champs purement UI (`hasSecondaryPhone`)
+ * et l'`iri` Hydra des entites creees (necessaire pour rattacher une adresse a
+ * des contacts deja persistes, M2M). Partage par la page et les blocs reutilisables
+ * `ClientContactBlock` / `ClientAddressBlock` (reutilises par 1.11/1.12).
+ */
+
+/** Un contact du client (onglet Contact). */
+export interface ContactFormDraft {
+    /** Id serveur une fois le contact cree (null tant que non persiste). */
+    id: number | null
+    /** IRI Hydra du contact cree — utilise pour le rattachement M2M cote adresse. */
+    iri: string | null
+    firstName: string | null
+    lastName: string | null
+    jobTitle: string | null
+    phonePrimary: string | null
+    phoneSecondary: string | null
+    email: string | null
+    /** UI : le 2e numero a ete revele via le bouton « + ». */
+    hasSecondaryPhone: boolean
+}
+
+/** Une adresse du client (onglet Adresse). */
+export interface AddressFormDraft {
+    id: number | null
+    isProspect: boolean
+    isDelivery: boolean
+    isBilling: boolean
+    /** Adresse Courtier — type autonome exclusif. */
+    isBroker: boolean
+    /** Adresse Distributeur — type autonome exclusif. */
+    isDistributor: boolean
+    country: string
+    postalCode: string | null
+    city: string | null
+    street: string | null
+    streetComplement: string | null
+    /** IRI des categories rattachees (hors DISTRIBUTEUR/COURTIER — RG-1.29). */
+    categoryIris: string[]
+    /** IRI des sites Starseed rattaches (>= 1 obligatoire — RG-1.10). */
+    siteIris: string[]
+    /** IRI des contacts rattaches (= blocs Contact deja crees). */
+    contactIris: string[]
+    /** Email de facturation (obligatoire si isBilling — RG-1.11). */
+    billingEmail: string | null
+    /** 2e email de facturation, optionnel (max 2 — pendant du telephone secondaire). */
+    billingEmailSecondary: string | null
+    /** Drapeau UI : 2e champ email revele (comme hasSecondaryPhone). */
+    hasSecondaryBillingEmail: boolean
+}
+
+/** Un RIB du client (onglet Comptabilite). */
+export interface RibFormDraft {
+    id: number | null
+    label: string | null
+    bic: string | null
+    iban: string | null
+}
+
+/** Fabrique un contact vierge. */
+export function emptyContact(): ContactFormDraft {
+    return {
+        id: null,
+        iri: null,
+        firstName: null,
+        lastName: null,
+        jobTitle: null,
+        phonePrimary: null,
+        phoneSecondary: null,
+        email: null,
+        hasSecondaryPhone: false,
+    }
+}
+
+/** Fabrique une adresse vierge (pays prerempli « France »). */
+export function emptyAddress(): AddressFormDraft {
+    return {
+        id: null,
+        isProspect: false,
+        isDelivery: false,
+        isBilling: false,
+        isBroker: false,
+        isDistributor: false,
+        country: 'France',
+        postalCode: null,
+        city: null,
+        street: null,
+        streetComplement: null,
+        categoryIris: [],
+        siteIris: [],
+        contactIris: [],
+        billingEmail: null,
+        billingEmailSecondary: null,
+        hasSecondaryBillingEmail: false,
+    }
+}
+
+/** Fabrique un RIB vierge. */
+export function emptyRib(): RibFormDraft {
+    return {
+        id: null,
+        label: null,
+        bic: null,
+        iban: null,
+    }
+}
@@ -0,0 +1,109 @@
+/**
+ * Types « brouillon » de l'ecran « Ajouter un fournisseur » (M2 Commercial).
+ *
+ * Miroir de `types/clientForm.ts` (M1). Ces interfaces decrivent l'etat LOCAL du
+ * formulaire (refs Vue), distinct des DTO de l'API : elles portent en plus des
+ * champs purement UI (`hasSecondaryPhone`) et l'`iri` Hydra des entites creees
+ * (necessaire pour rattacher une adresse a des contacts deja persistes, M2M).
+ * Partage par la page de creation et les blocs `SupplierContactBlock` /
+ * `SupplierAddressBlock` (reutilises par la consultation/modification 95/96).
+ *
+ * Differences M2 vs M1 (cf. spec-front § « Differences notables ») :
+ *  - Adresse : type via enum exclusif `addressType` (PROSPECT/DEPART/RENDU,
+ *    RG-2.09) — pas de drapeaux isProspect/isDelivery/isBilling.
+ *  - Adresse : champs specifiques fournisseur `bennes` (nombre) et
+ *    `triageProvider` (prestation de triage). Pas d'email de facturation.
+ *  - Pas de relation Distributeur/Courtier ni de triage sur le bloc principal.
+ */
+
+/** Type d'adresse fournisseur (enum exclusif RG-2.09). */
+export type SupplierAddressType = 'PROSPECT' | 'DEPART' | 'RENDU'
+
+/** Un contact du fournisseur (onglet Contacts). */
+export interface SupplierContactFormDraft {
+    /** Id serveur une fois le contact cree (null tant que non persiste). */
+    id: number | null
+    /** IRI Hydra du contact cree — utilise pour le rattachement M2M cote adresse. */
+    iri: string | null
+    firstName: string | null
+    lastName: string | null
+    jobTitle: string | null
+    phonePrimary: string | null
+    phoneSecondary: string | null
+    email: string | null
+    /** UI : le 2e numero a ete revele via le bouton « + ». */
+    hasSecondaryPhone: boolean
+}
+
+/** Une adresse du fournisseur (onglet Adresses). */
+export interface SupplierAddressFormDraft {
+    id: number | null
+    /** Type exclusif Prospect / Depart / Rendu (RG-2.09). null tant que non choisi. */
+    addressType: SupplierAddressType | null
+    country: string
+    postalCode: string | null
+    city: string | null
+    street: string | null
+    streetComplement: string | null
+    /** IRI des categories rattachees (type FOURNISSEUR, RG-2.10). */
+    categoryIris: string[]
+    /** IRI des sites Starseed rattaches (>= 1 obligatoire — RG-2.06). */
+    siteIris: string[]
+    /** IRI des contacts rattaches (= blocs Contact deja crees). */
+    contactIris: string[]
+    /** Nombre de bennes (stepper, defaut 0). Chaine pour MalioInputNumber, convertie au payload. */
+    bennes: string | null
+    /** Prestation de triage (specifique fournisseur, portee par l'adresse — RG). */
+    triageProvider: boolean
+}
+
+/** Un RIB du fournisseur (onglet Comptabilite). */
+export interface SupplierRibFormDraft {
+    id: number | null
+    label: string | null
+    bic: string | null
+    iban: string | null
+}
+
+/** Fabrique un contact vierge. */
+export function emptyContact(): SupplierContactFormDraft {
+    return {
+        id: null,
+        iri: null,
+        firstName: null,
+        lastName: null,
+        jobTitle: null,
+        phonePrimary: null,
+        phoneSecondary: null,
+        email: null,
+        hasSecondaryPhone: false,
+    }
+}
+
+/** Fabrique une adresse vierge (pays prerempli « France », 0 benne). */
+export function emptyAddress(): SupplierAddressFormDraft {
+    return {
+        id: null,
+        addressType: null,
+        country: 'France',
+        postalCode: null,
+        city: null,
+        street: null,
+        streetComplement: null,
+        categoryIris: [],
+        siteIris: [],
+        contactIris: [],
+        bennes: '0',
+        triageProvider: false,
+    }
+}
+
+/** Fabrique un RIB vierge. */
+export function emptyRib(): SupplierRibFormDraft {
+    return {
+        id: null,
+        label: null,
+        bic: null,
+        iban: null,
+    }
+}
@@ -0,0 +1,250 @@
+import { describe, expect, it } from 'vitest'
+import {
+    canEditClient,
+    categoryOptionsOf,
+    contactOptionsOf,
+    iriOf,
+    mapAccountingDraft,
+    mapAddressToDraft,
+    mapAddressView,
+    mapContactToDraft,
+    mapRibToDraft,
+    paymentTypeCodeOf,
+    referentialOptionOf,
+    relationOf,
+    showArchiveAction,
+    showRestoreAction,
+    siteOptionsOf,
+    type ClientDetail,
+} from '../clientConsultation'
+
+describe('iriOf', () => {
+    it('retourne l\'@id d\'une relation embarquee (objet)', () => {
+        expect(iriOf({ '@id': '/api/payment_types/10', code: 'LCR' })).toBe('/api/payment_types/10')
+    })
+
+    it('retourne la chaine telle quelle si la relation est deja un IRI', () => {
+        expect(iriOf('/api/banks/3')).toBe('/api/banks/3')
+    })
+
+    it('retourne null pour une relation absente (null / undefined / skip_null_values)', () => {
+        expect(iriOf(null)).toBeNull()
+        expect(iriOf(undefined)).toBeNull()
+    })
+})
+
+describe('relationOf', () => {
+    it('detecte une relation distributeur et expose son nom', () => {
+        const client = { distributor: { '@id': '/api/clients/15', companyName: 'DISTRIB GRAND SUD-OUEST' } } as ClientDetail
+        expect(relationOf(client)).toEqual({ type: 'distributeur', name: 'DISTRIB GRAND SUD-OUEST' })
+    })
+
+    it('detecte une relation courtier et expose son nom', () => {
+        const client = { broker: { '@id': '/api/clients/16', companyName: 'CABINET LEONARD' } } as ClientDetail
+        expect(relationOf(client)).toEqual({ type: 'courtier', name: 'CABINET LEONARD' })
+    })
+
+    it('retourne type null quand aucune relation n\'est posee (cles omises)', () => {
+        expect(relationOf({} as ClientDetail)).toEqual({ type: null, name: null })
+    })
+})
+
+describe('mapContactToDraft', () => {
+    it('formate les telephones en XX XX XX XX XX et conserve l\'iri', () => {
+        const draft = mapContactToDraft({
+            '@id': '/api/client_contacts/18',
+            id: 18,
+            firstName: 'Sophie',
+            lastName: 'Léonard',
+            jobTitle: 'Gérante',
+            phonePrimary: '0549112233',
+            email: 'sophie@x.fr',
+        })
+        expect(draft.id).toBe(18)
+        expect(draft.iri).toBe('/api/client_contacts/18')
+        expect(draft.phonePrimary).toBe('05 49 11 22 33')
+        expect(draft.hasSecondaryPhone).toBe(false)
+    })
+
+    it('revele le 2e telephone quand phoneSecondary est present', () => {
+        const draft = mapContactToDraft({
+            '@id': '/api/client_contacts/19',
+            id: 19,
+            phonePrimary: '0600000000',
+            phoneSecondary: '0611111111',
+        })
+        expect(draft.hasSecondaryPhone).toBe(true)
+        expect(draft.phoneSecondary).toBe('06 11 11 11 11')
+    })
+})
+
+describe('mapAddressToDraft', () => {
+    it('extrait les iris de sites / categories / contacts (objets ou chaines)', () => {
+        const draft = mapAddressToDraft({
+            '@id': '/api/client_addresses/18',
+            id: 18,
+            country: 'France',
+            postalCode: '86100',
+            city: 'Châtellerault',
+            street: '5 rue des Courtiers',
+            billingEmail: 'factures@x.fr',
+            isProspect: false,
+            isDelivery: false,
+            isBilling: true,
+            sites: [{ '@id': '/api/sites/4', name: 'Chatellerault', color: '#056CF2' }],
+            categories: [{ '@id': '/api/categories/3', code: 'SECTEUR' }],
+            contacts: [{ '@id': '/api/client_contacts/18' }, '/api/client_contacts/20'],
+        })
+        expect(draft.siteIris).toEqual(['/api/sites/4'])
+        expect(draft.categoryIris).toEqual(['/api/categories/3'])
+        expect(draft.contactIris).toEqual(['/api/client_contacts/18', '/api/client_contacts/20'])
+        expect(draft.isBilling).toBe(true)
+        expect(draft.city).toBe('Châtellerault')
+        expect(draft.country).toBe('France')
+    })
+
+    it('tolere les sous-collections absentes (defaut tableau vide, pays France)', () => {
+        const draft = mapAddressToDraft({ '@id': '/api/client_addresses/9', id: 9 })
+        expect(draft.siteIris).toEqual([])
+        expect(draft.categoryIris).toEqual([])
+        expect(draft.contactIris).toEqual([])
+        expect(draft.country).toBe('France')
+        expect(draft.isBilling).toBe(false)
+    })
+})
+
+describe('mapRibToDraft', () => {
+    it('mappe label / bic / iban et l\'id serveur', () => {
+        const draft = mapRibToDraft({ '@id': '/api/client_ribs/3', id: 3, label: 'Compte', bic: 'BNPAFRPPXXX', iban: 'FR14...' })
+        expect(draft).toEqual({ id: 3, label: 'Compte', bic: 'BNPAFRPPXXX', iban: 'FR14...' })
+    })
+})
+
+describe('mapAccountingDraft', () => {
+    it('mappe les scalaires et resout les iris des referentiels embarques', () => {
+        const acc = mapAccountingDraft({
+            '@id': '/api/clients/1',
+            id: 1,
+            siren: '123456789',
+            accountNumber: '411000',
+            nTva: 'FR123',
+            tvaMode: { '@id': '/api/tva_modes/1' },
+            paymentDelay: { '@id': '/api/payment_delays/2' },
+            paymentType: { '@id': '/api/payment_types/10', code: 'LCR' },
+            bank: { '@id': '/api/banks/3' },
+        } as ClientDetail)
+        expect(acc).toEqual({
+            siren: '123456789',
+            accountNumber: '411000',
+            nTva: 'FR123',
+            tvaModeIri: '/api/tva_modes/1',
+            paymentDelayIri: '/api/payment_delays/2',
+            paymentTypeIri: '/api/payment_types/10',
+            bankIri: '/api/banks/3',
+        })
+    })
+
+    it('renvoie des null quand les champs comptables sont absents (sans accounting.view)', () => {
+        const acc = mapAccountingDraft({} as ClientDetail)
+        expect(acc).toEqual({
+            siren: null,
+            accountNumber: null,
+            nTva: null,
+            tvaModeIri: null,
+            paymentDelayIri: null,
+            paymentTypeIri: null,
+            bankIri: null,
+        })
+    })
+})
+
+describe('options construites depuis l\'embed (role-independantes)', () => {
+    it('categoryOptionsOf expose value=IRI, label=nom, code', () => {
+        expect(categoryOptionsOf([{ '@id': '/api/categories/3', name: 'Secteur', code: 'SECTEUR' }])).toEqual([
+            { value: '/api/categories/3', label: 'Secteur', code: 'SECTEUR' },
+        ])
+    })
+
+    it('siteOptionsOf expose value=IRI, label=nom', () => {
+        expect(siteOptionsOf([{ '@id': '/api/sites/4', name: 'Chatellerault', color: '#000' }])).toEqual([
+            { value: '/api/sites/4', label: 'Chatellerault' },
+        ])
+    })
+
+    it('contactOptionsOf compose le libelle (nom complet, sinon email)', () => {
+        expect(contactOptionsOf([
+            { '@id': '/api/client_contacts/1', id: 1, firstName: 'Jean', lastName: 'Dupont' },
+            { '@id': '/api/client_contacts/2', id: 2, email: 'a@b.fr' },
+        ])).toEqual([
+            { value: '/api/client_contacts/1', label: 'Jean Dupont' },
+            { value: '/api/client_contacts/2', label: 'a@b.fr' },
+        ])
+    })
+
+    it('referentialOptionOf : option unique depuis l\'embed, vide pour IRI nu / absent', () => {
+        expect(referentialOptionOf({ '@id': '/api/payment_types/10', label: 'LCR' })).toEqual([
+            { value: '/api/payment_types/10', label: 'LCR' },
+        ])
+        expect(referentialOptionOf('/api/banks/3')).toEqual([])
+        expect(referentialOptionOf(null)).toEqual([])
+    })
+
+    it('mapAddressView assemble brouillon + options propres a l\'adresse', () => {
+        const view = mapAddressView({
+            '@id': '/api/client_addresses/18',
+            id: 18,
+            city: 'Châtellerault',
+            sites: [{ '@id': '/api/sites/4', name: 'Chatellerault' }],
+            categories: [{ '@id': '/api/categories/3', name: 'Secteur', code: 'SECTEUR' }],
+        })
+        expect(view.draft.id).toBe(18)
+        expect(view.siteOptions).toEqual([{ value: '/api/sites/4', label: 'Chatellerault' }])
+        expect(view.categoryOptions).toEqual([{ value: '/api/categories/3', label: 'Secteur', code: 'SECTEUR' }])
+    })
+})
+
+describe('canEditClient', () => {
+    const can = (granted: string[]) => (codes: string[]) => codes.some(c => granted.includes(c))
+
+    it('visible pour manage', () => {
+        expect(canEditClient(can(['commercial.clients.manage']))).toBe(true)
+    })
+
+    it('visible pour accounting.manage (role Compta)', () => {
+        expect(canEditClient(can(['commercial.clients.accounting.manage']))).toBe(true)
+    })
+
+    it('masque sans aucune des deux permissions (role Usine)', () => {
+        expect(canEditClient(can(['commercial.clients.view']))).toBe(false)
+    })
+})
+
+describe('showArchiveAction / showRestoreAction', () => {
+    const can = (granted: string[]) => (code: string) => granted.includes(code)
+
+    it('Archiver : visible avec la permission archive ET client non archive', () => {
+        expect(showArchiveAction(can(['commercial.clients.archive']), false)).toBe(true)
+        expect(showArchiveAction(can(['commercial.clients.archive']), true)).toBe(false)
+        expect(showArchiveAction(can([]), false)).toBe(false)
+    })
+
+    it('Restaurer : visible avec la permission archive ET client archive', () => {
+        expect(showRestoreAction(can(['commercial.clients.archive']), true)).toBe(true)
+        expect(showRestoreAction(can(['commercial.clients.archive']), false)).toBe(false)
+        expect(showRestoreAction(can([]), true)).toBe(false)
+    })
+})
+
+describe('paymentTypeCodeOf (ERP-121 : RIB masques hors-LCR en consultation)', () => {
+    it('retourne le code metier quand le type de reglement est embarque', () => {
+        expect(paymentTypeCodeOf({ '@id': '/api/payment_types/1', code: 'LCR' })).toBe('LCR')
+        expect(paymentTypeCodeOf({ '@id': '/api/payment_types/2', code: 'VIREMENT' })).toBe('VIREMENT')
+    })
+
+    it('retourne null pour un IRI nu, un objet sans code, ou une relation absente', () => {
+        expect(paymentTypeCodeOf('/api/payment_types/1')).toBeNull()
+        expect(paymentTypeCodeOf({ '@id': '/api/payment_types/1' })).toBeNull()
+        expect(paymentTypeCodeOf(null)).toBeNull()
+        expect(paymentTypeCodeOf(undefined)).toBeNull()
+    })
+})
@@ -0,0 +1,338 @@
+import { describe, expect, it } from 'vitest'
+import {
+    buildAccountingPayload,
+    buildAddressPayload,
+    buildContactPayload,
+    buildInformationPayload,
+    buildMainPayload,
+    buildRibPayload,
+    mapAccountingFormDraft,
+    mapInformationDraft,
+    mapMainDraft,
+    resolveTabEditability,
+    type AccountingFormDraft,
+    type InformationFormDraft,
+    type MainFormDraft,
+} from '../clientEdit'
+import type { ClientDetail } from '../clientConsultation'
+import type { AddressFormDraft, ContactFormDraft, RibFormDraft } from '~/modules/commercial/types/clientForm'
+
+// ── Fabriques de brouillons (valeurs distinctes pour reperer les fuites) ─────
+
+function mainDraft(overrides: Partial<MainFormDraft> = {}): MainFormDraft {
+    return {
+        companyName: 'ACME',
+        categoryIris: ['/api/categories/1'],
+        relationType: null,
+        distributorIri: null,
+        brokerIri: null,
+        triageService: false,
+        ...overrides,
+    }
+}
+
+function informationDraft(overrides: Partial<InformationFormDraft> = {}): InformationFormDraft {
+    return {
+        description: 'desc',
+        competitors: 'concurrents',
+        foundedAt: '2010-05-01',
+        foundedAtRaw: '',
+        employeesCount: '42',
+        revenueAmount: '1000000',
+        profitAmount: '50000',
+        directorName: 'PDG',
+        ...overrides,
+    }
+}
+
+function accountingDraft(overrides: Partial<AccountingFormDraft> = {}): AccountingFormDraft {
+    return {
+        siren: '123456789',
+        accountNumber: 'C-001',
+        nTva: 'FR123',
+        tvaModeIri: '/api/tva_modes/1',
+        paymentDelayIri: '/api/payment_delays/1',
+        paymentTypeIri: '/api/payment_types/1',
+        bankIri: '/api/banks/1',
+        ...overrides,
+    }
+}
+
+// Champs de chaque groupe de serialisation (miroir back ClientProcessor).
+// Le contact inline (nom/prenom/telephones/email) ne fait plus partie du groupe
+// main : les coordonnees vivent desormais sur la sous-ressource ClientContact.
+const MAIN_KEYS = [
+    // relationType : champ transitoire envoye au back pour la validation croisee
+    // « relation choisie => FK obligatoire » (RG-1.03 bis, ERP-119).
+    'companyName', 'categories', 'relationType', 'distributor', 'broker', 'triageService',
+]
+const INFORMATION_KEYS = [
+    'description', 'competitors', 'foundedAt', 'employeesCount',
+    'revenueAmount', 'profitAmount', 'directorName',
+]
+const ACCOUNTING_KEYS = ['siren', 'accountNumber', 'tvaMode', 'nTva', 'paymentDelay', 'paymentType', 'bank']
+
+describe('buildMainPayload — scoping strict groupe client:write:main', () => {
+    it('n\'expose QUE les champs du groupe main (aucune fuite information/accounting)', () => {
+        expect(Object.keys(buildMainPayload(mainDraft())).sort()).toEqual([...MAIN_KEYS].sort())
+    })
+
+    it('relation distributeur : renseigne distributor, force broker a null (RG-1.03)', () => {
+        const payload = buildMainPayload(mainDraft({
+            relationType: 'distributeur',
+            distributorIri: '/api/clients/9',
+            brokerIri: '/api/clients/7',
+        }))
+        expect(payload.distributor).toBe('/api/clients/9')
+        expect(payload.broker).toBeNull()
+    })
+
+    it('relation courtier : renseigne broker, force distributor a null (RG-1.03)', () => {
+        const payload = buildMainPayload(mainDraft({
+            relationType: 'courtier',
+            distributorIri: '/api/clients/9',
+            brokerIri: '/api/clients/7',
+        }))
+        expect(payload.broker).toBe('/api/clients/7')
+        expect(payload.distributor).toBeNull()
+    })
+
+    it('sans relation : distributor et broker a null', () => {
+        const payload = buildMainPayload(mainDraft({ relationType: null }))
+        expect(payload.distributor).toBeNull()
+        expect(payload.broker).toBeNull()
+    })
+
+    it('transmet relationType au back pour la validation croisee (RG-1.03 bis)', () => {
+        expect(buildMainPayload(mainDraft({ relationType: 'distributeur' })).relationType).toBe('distributeur')
+        expect(buildMainPayload(mainDraft({ relationType: 'courtier' })).relationType).toBe('courtier')
+        expect(buildMainPayload(mainDraft({ relationType: null })).relationType).toBeNull()
+    })
+
+    // ERP-119 : companyName est requis ET adosse a une colonne NON-nullable. Si le
+    // champ est vide, on OMET la cle (au lieu d'envoyer null) pour que le back
+    // renvoie une 422 NotBlank (propertyPath companyName) et non un 400 de type.
+    it('omet companyName quand il est vide (null) -> 422 NotBlank cote back', () => {
+        expect('companyName' in buildMainPayload(mainDraft({ companyName: null }))).toBe(false)
+    })
+
+    it('omet companyName quand il est une chaine vide', () => {
+        expect('companyName' in buildMainPayload(mainDraft({ companyName: '' }))).toBe(false)
+    })
+
+    it('conserve companyName quand il est renseigne', () => {
+        expect(buildMainPayload(mainDraft({ companyName: 'ACME' })).companyName).toBe('ACME')
+    })
+})
+
+describe('buildInformationPayload — scoping strict groupe client:write:information', () => {
+    it('n\'expose QUE les champs du groupe information (aucune fuite main/accounting)', () => {
+        expect(Object.keys(buildInformationPayload(informationDraft())).sort()).toEqual([...INFORMATION_KEYS].sort())
+    })
+
+    it('convertit employeesCount en nombre et vide -> null', () => {
+        expect(buildInformationPayload(informationDraft({ employeesCount: '42' })).employeesCount).toBe(42)
+        expect(buildInformationPayload(informationDraft({ employeesCount: null })).employeesCount).toBeNull()
+        expect(buildInformationPayload(informationDraft({ employeesCount: '' })).employeesCount).toBeNull()
+    })
+
+    it('chaines vides normalisees en null', () => {
+        const payload = buildInformationPayload(informationDraft({ description: '', directorName: '' }))
+        expect(payload.description).toBeNull()
+        expect(payload.directorName).toBeNull()
+    })
+
+    it('envoie la saisie invalide (foundedAtRaw) en priorite -> le back tranchera (422)', () => {
+        // Saisie malformee : on transmet le texte brut tel quel pour declencher la
+        // 422 back sur foundedAt (validation autoritaire du format, MUI-44).
+        expect(buildInformationPayload(informationDraft({ foundedAt: null, foundedAtRaw: '32/13/2026' })).foundedAt)
+            .toBe('32/13/2026')
+        // Saisie valide : foundedAtRaw vide -> on envoie la date ISO.
+        expect(buildInformationPayload(informationDraft({ foundedAt: '2010-05-01', foundedAtRaw: '' })).foundedAt)
+            .toBe('2010-05-01')
+    })
+})
+
+describe('buildAccountingPayload — scoping strict groupe client:write:accounting', () => {
+    it('n\'expose QUE les champs du groupe accounting (aucune fuite main/information)', () => {
+        expect(Object.keys(buildAccountingPayload(accountingDraft(), true)).sort()).toEqual([...ACCOUNTING_KEYS].sort())
+    })
+
+    it('banque conservee si requise (Virement), forcee a null sinon (RG-1.12)', () => {
+        expect(buildAccountingPayload(accountingDraft(), true).bank).toBe('/api/banks/1')
+        expect(buildAccountingPayload(accountingDraft(), false).bank).toBeNull()
+    })
+})
+
+describe('buildContactPayload / buildAddressPayload / buildRibPayload', () => {
+    it('contact : telephone secondaire ignore si non revele', () => {
+        const contact: ContactFormDraft = {
+            id: 5, iri: '/api/client_contacts/5', firstName: 'A', lastName: 'B',
+            jobTitle: null, phonePrimary: '0549112233', phoneSecondary: '0600000000',
+            email: null, hasSecondaryPhone: false,
+        }
+        expect(buildContactPayload(contact).phoneSecondary).toBeNull()
+    })
+
+    it('adresse : email facturation conserve uniquement si requis (RG-1.11)', () => {
+        const address: AddressFormDraft = {
+            id: 3, isProspect: false, isDelivery: false, isBilling: true, isBroker: false, isDistributor: false, country: 'France',
+            postalCode: '86100', city: 'Châtellerault', street: '1 rue X', streetComplement: null,
+            categoryIris: ['/api/categories/2'], siteIris: ['/api/sites/1'], contactIris: [],
+            billingEmail: 'facturation@acme.fr', billingEmailSecondary: 'compta@acme.fr', hasSecondaryBillingEmail: true,
+        }
+        expect(buildAddressPayload(address, true).billingEmail).toBe('facturation@acme.fr')
+        expect(buildAddressPayload(address, false).billingEmail).toBeNull()
+        // 2e email : transmis si facturation + revele, sinon null (ERP-119).
+        expect(buildAddressPayload(address, true).billingEmailSecondary).toBe('compta@acme.fr')
+        expect(buildAddressPayload(address, false).billingEmailSecondary).toBeNull()
+        expect(buildAddressPayload({ ...address, hasSecondaryBillingEmail: false }, true).billingEmailSecondary).toBeNull()
+    })
+
+    it('rib : label / bic / iban transmis tels quels', () => {
+        const rib: RibFormDraft = { id: 1, label: 'Compte principal', bic: 'BNPAFRPP', iban: 'FR76...' }
+        expect(buildRibPayload(rib)).toEqual({ label: 'Compte principal', bic: 'BNPAFRPP', iban: 'FR76...' })
+    })
+
+    // ERP-119 : un RIB partiel (IBAN seul) doit omettre label/bic vides pour
+    // declencher la 422 NotBlank par champ, pas un 400 de type a la deserialisation.
+    it('rib partiel : omet label / bic vides, conserve iban', () => {
+        const rib: RibFormDraft = { id: null, label: null, bic: null, iban: 'FR7612345' }
+        const payload = buildRibPayload(rib)
+        expect('label' in payload).toBe(false)
+        expect('bic' in payload).toBe(false)
+        expect(payload.iban).toBe('FR7612345')
+    })
+
+    // ERP-119 : une adresse partielle omet postalCode/city/street vides (NotBlank).
+    it('adresse partielle : omet postalCode / city / street vides', () => {
+        const address: AddressFormDraft = {
+            id: null, isProspect: false, isDelivery: true, isBilling: false, isBroker: false, isDistributor: false, country: 'France',
+            postalCode: null, city: '', street: null, streetComplement: null,
+            categoryIris: ['/api/categories/2'], siteIris: ['/api/sites/1'], contactIris: [],
+            billingEmail: null, billingEmailSecondary: null, hasSecondaryBillingEmail: false,
+        }
+        const payload = buildAddressPayload(address, false)
+        expect('postalCode' in payload).toBe(false)
+        expect('city' in payload).toBe(false)
+        expect('street' in payload).toBe(false)
+        // Les champs non requis / booleens restent presents.
+        expect(payload.isDelivery).toBe(true)
+        expect(payload.sites).toEqual(['/api/sites/1'])
+    })
+})
+
+// Bug edition : en PATCH (merge), une cle de champ requis OMISE laisse la valeur
+// serveur inchangee -> faux 200 quand l'utilisateur vide le champ. En `forUpdate`,
+// on envoie `''` (chaine valide, pas de 400 de type) -> NotBlank 422 inline.
+describe('forUpdate (EDITION/PATCH) : champ requis vide -> `\'\'` au lieu d\'etre omis', () => {
+    it('buildMainPayload : companyName vide envoye en `\'\'`', () => {
+        const payload = buildMainPayload(mainDraft({ companyName: '' }), { forUpdate: true })
+        expect('companyName' in payload).toBe(true)
+        expect(payload.companyName).toBe('')
+    })
+
+    it('buildAddressPayload : postalCode / city / street vides envoyes en `\'\'`', () => {
+        const address: AddressFormDraft = {
+            id: 7, isProspect: false, isDelivery: true, isBilling: false, isBroker: false, isDistributor: false, country: 'France',
+            postalCode: '', city: null, street: '1 rue X', streetComplement: null,
+            categoryIris: ['/api/categories/2'], siteIris: ['/api/sites/1'], contactIris: [],
+            billingEmail: null, billingEmailSecondary: null, hasSecondaryBillingEmail: false,
+        }
+        const payload = buildAddressPayload(address, false, { forUpdate: true })
+        expect(payload.postalCode).toBe('')
+        expect(payload.city).toBe('')
+        // Un champ requis renseigne reste tel quel.
+        expect(payload.street).toBe('1 rue X')
+    })
+
+    it('buildRibPayload : label / bic vides envoyes en `\'\'`, iban conserve', () => {
+        const payload = buildRibPayload({ id: 4, label: '', bic: null, iban: 'FR7612345' }, { forUpdate: true })
+        expect(payload.label).toBe('')
+        expect(payload.bic).toBe('')
+        expect(payload.iban).toBe('FR7612345')
+    })
+})
+
+describe('mapMainDraft — pre-remplissage bloc principal', () => {
+    it('resout la relation et extrait les IRI (sans contact inline)', () => {
+        const client = {
+            '@id': '/api/clients/1', id: 1,
+            companyName: 'ACME', triageService: true,
+            categories: [{ '@id': '/api/categories/1', code: 'SECTEUR' }],
+            distributor: { '@id': '/api/clients/9', companyName: 'DISTRIB' },
+        } as ClientDetail
+
+        const draft = mapMainDraft(client)
+        expect(draft.companyName).toBe('ACME')
+        expect(draft.categoryIris).toEqual(['/api/categories/1'])
+        expect(draft.relationType).toBe('distributeur')
+        expect(draft.distributorIri).toBe('/api/clients/9')
+        expect(draft.brokerIri).toBeNull()
+        expect(draft.triageService).toBe(true)
+    })
+
+    it('gere les cles omises (skip_null_values) sans planter', () => {
+        const draft = mapMainDraft({ '@id': '/api/clients/2', id: 2 } as ClientDetail)
+        expect(draft.companyName).toBeNull()
+        expect(draft.categoryIris).toEqual([])
+        expect(draft.relationType).toBeNull()
+        expect(draft.triageService).toBe(false)
+    })
+})
+
+describe('mapInformationDraft — pre-remplissage onglet Information', () => {
+    it('tronque foundedAt en YYYY-MM-DD et stringifie employeesCount', () => {
+        const draft = mapInformationDraft({
+            '@id': '/api/clients/1', id: 1,
+            foundedAt: '2010-05-01T00:00:00+00:00', employeesCount: 42, revenueAmount: '1000000',
+        } as ClientDetail)
+        expect(draft.foundedAt).toBe('2010-05-01')
+        expect(draft.employeesCount).toBe('42')
+        expect(draft.revenueAmount).toBe('1000000')
+    })
+
+    it('cles omises -> null', () => {
+        const draft = mapInformationDraft({ '@id': '/api/clients/1', id: 1 } as ClientDetail)
+        expect(draft.foundedAt).toBeNull()
+        expect(draft.employeesCount).toBeNull()
+        expect(draft.description).toBeNull()
+    })
+})
+
+describe('mapAccountingFormDraft — pre-remplissage onglet Comptabilite', () => {
+    it('extrait les scalaires et les IRI des referentiels embarques', () => {
+        const draft = mapAccountingFormDraft({
+            '@id': '/api/clients/1', id: 1,
+            siren: '123456789', accountNumber: 'C-001', nTva: 'FR123',
+            tvaMode: { '@id': '/api/tva_modes/2', label: 'Normal' },
+            paymentType: '/api/payment_types/3',
+        } as ClientDetail)
+        expect(draft.siren).toBe('123456789')
+        expect(draft.tvaModeIri).toBe('/api/tva_modes/2')
+        expect(draft.paymentTypeIri).toBe('/api/payment_types/3')
+        expect(draft.bankIri).toBeNull()
+    })
+})
+
+describe('resolveTabEditability — gating par role (matrice § 2.7)', () => {
+    it('Admin : tout editable', () => {
+        expect(resolveTabEditability({ canManage: true, canAccountingView: true, canAccountingManage: true }))
+            .toEqual({ businessEditable: true, accountingVisible: true, accountingEditable: true })
+    })
+
+    it('Bureau / Commerciale (manage seul) : metier editable, Comptabilite masquee', () => {
+        expect(resolveTabEditability({ canManage: true, canAccountingView: false, canAccountingManage: false }))
+            .toEqual({ businessEditable: true, accountingVisible: false, accountingEditable: false })
+    })
+
+    it('Compta (accounting seul) : metier readonly, Comptabilite editable', () => {
+        expect(resolveTabEditability({ canManage: false, canAccountingView: true, canAccountingManage: true }))
+            .toEqual({ businessEditable: false, accountingVisible: true, accountingEditable: true })
+    })
+
+    it('Sans permission d\'edition : rien d\'editable', () => {
+        expect(resolveTabEditability({ canManage: false, canAccountingView: false, canAccountingManage: false }))
+            .toEqual({ businessEditable: false, accountingVisible: false, accountingEditable: false })
+    })
+})
@@ -0,0 +1,420 @@
+import { describe, it, expect } from 'vitest'
+import {
+    addressFlagsFromType,
+    addressTypeFromFlags,
+    applyProspectExclusivity,
+    buildClientFormTabKeys,
+    canSelectDeliveryOrBilling,
+    canSelectProspect,
+    hasAllRequiredAccountingFields,
+    hasAtLeastOneInformationField,
+    hasAtLeastOneValidContact,
+    isAddressValid,
+    isBankRequiredForPaymentType,
+    isBillingEmailRequired,
+    isBlankRow,
+    isContactBlank,
+    isContactNamed,
+    isRibBlank,
+    isRibComplete,
+    isRibRequiredForPaymentType,
+    lastFillableTabKey,
+    omitEmptyRequired,
+    showsRelationAndTriageFields,
+    type AddressFlagsDraft,
+    type AddressValidityDraft,
+    type ContactDraft,
+    type ContactFillableDraft,
+} from '../clientFormRules'
+
+/** Bloc contact totalement vide (amorce par defaut). */
+function blankContact(): ContactFillableDraft {
+    return {
+        firstName: null,
+        lastName: null,
+        jobTitle: null,
+        phonePrimary: null,
+        phoneSecondary: null,
+        email: null,
+    }
+}
+
+describe('buildClientFormTabKeys (gating onglet Comptabilite + onglets edit-only)', () => {
+    it('inclut l onglet accounting si l utilisateur a accounting.view', () => {
+        expect(buildClientFormTabKeys(true)).toContain('accounting')
+    })
+
+    it('exclut l onglet accounting sinon (Bureau / Commerciale)', () => {
+        expect(buildClientFormTabKeys(false)).not.toContain('accounting')
+    })
+
+    it('a la creation, exclut Statistiques / Rapports / Echanges', () => {
+        const keys = buildClientFormTabKeys(true)
+        expect(keys).toEqual(['information', 'contact', 'address', 'transport', 'accounting'])
+        expect(keys).not.toContain('statistics')
+        expect(keys).not.toContain('reports')
+        expect(keys).not.toContain('exchanges')
+    })
+
+    it('en modification (includeEditOnlyTabs), ajoute les onglets edit-only en fin', () => {
+        const keys = buildClientFormTabKeys(true, { includeEditOnlyTabs: true })
+        expect(keys).toEqual([
+            'information',
+            'contact',
+            'address',
+            'transport',
+            'accounting',
+            'statistics',
+            'reports',
+            'exchanges',
+        ])
+    })
+})
+
+describe('lastFillableTabKey (redirection fin d\'ajout, role-aware)', () => {
+    it('Adresse pour un role sans Comptabilite (Bureau / Commerciale)', () => {
+        expect(lastFillableTabKey(buildClientFormTabKeys(false))).toBe('address')
+    })
+
+    it('Comptabilite pour un role avec accounting.view (Admin)', () => {
+        expect(lastFillableTabKey(buildClientFormTabKeys(true))).toBe('accounting')
+    })
+
+    it('ignore les onglets placeholder (Transport en dernier ne compte pas)', () => {
+        expect(lastFillableTabKey(['information', 'contact', 'address', 'transport'])).toBe('address')
+    })
+
+    it('undefined si aucun onglet remplissable (que des placeholders)', () => {
+        expect(lastFillableTabKey(['transport', 'statistics'])).toBeUndefined()
+    })
+})
+
+describe('isContactNamed (RG-1.05)', () => {
+    it('vrai si le prenom est renseigne', () => {
+        expect(isContactNamed({ firstName: 'Alice', lastName: null })).toBe(true)
+    })
+
+    it('vrai si le nom est renseigne', () => {
+        expect(isContactNamed({ firstName: null, lastName: 'Martin' })).toBe(true)
+    })
+
+    it('faux si les deux sont vides ou espaces uniquement', () => {
+        expect(isContactNamed({ firstName: null, lastName: null })).toBe(false)
+        expect(isContactNamed({ firstName: '  ', lastName: '' })).toBe(false)
+    })
+})
+
+describe('isBlankRow (primitive : toutes les valeurs vides)', () => {
+    it('vrai si toutes les valeurs sont nulles / vides / espaces', () => {
+        expect(isBlankRow([null, undefined, '', '  '])).toBe(true)
+        expect(isBlankRow([])).toBe(true)
+    })
+
+    it('faux des qu une valeur porte un caractere non-espace', () => {
+        expect(isBlankRow([null, 'x', ''])).toBe(false)
+    })
+})
+
+describe('isRibBlank (bloc RIB totalement vide vs partiellement rempli)', () => {
+    it('vrai si label / bic / iban sont tous vides', () => {
+        expect(isRibBlank({ label: null, bic: null, iban: null })).toBe(true)
+        expect(isRibBlank({ label: '  ', bic: '', iban: null })).toBe(true)
+    })
+
+    it('faux si un IBAN seul est saisi (bloc a soumettre -> 422 NotBlank inline)', () => {
+        expect(isRibBlank({ label: null, bic: null, iban: 'FR1420041010050500013M02606' })).toBe(false)
+    })
+
+    it('faux si seul le libelle est saisi', () => {
+        expect(isRibBlank({ label: 'Compte courant', bic: null, iban: null })).toBe(false)
+    })
+})
+
+describe('isContactBlank (bloc totalement vide vs partiellement rempli)', () => {
+    it('vrai si aucun champ saisissable n est rempli', () => {
+        expect(isContactBlank(blankContact())).toBe(true)
+        expect(isContactBlank({ ...blankContact(), firstName: '  ', email: '' })).toBe(true)
+    })
+
+    it('faux si un email seul est saisi (bloc a soumettre -> 422 RG-1.05 inline)', () => {
+        expect(isContactBlank({ ...blankContact(), email: 'jean@acme.fr' })).toBe(false)
+    })
+
+    it('faux si seul un telephone, une fonction ou un nom est saisi', () => {
+        expect(isContactBlank({ ...blankContact(), phonePrimary: '0612345678' })).toBe(false)
+        expect(isContactBlank({ ...blankContact(), jobTitle: 'Directeur' })).toBe(false)
+        expect(isContactBlank({ ...blankContact(), firstName: 'Alice' })).toBe(false)
+    })
+})
+
+describe('hasAtLeastOneValidContact (RG-1.14)', () => {
+    it('faux sur une liste vide', () => {
+        expect(hasAtLeastOneValidContact([])).toBe(false)
+    })
+
+    it('faux si aucun contact n a de nom ni prenom', () => {
+        const contacts: ContactDraft[] = [
+            { firstName: null, lastName: null },
+            { firstName: '', lastName: '  ' },
+        ]
+        expect(hasAtLeastOneValidContact(contacts)).toBe(false)
+    })
+
+    it('vrai des qu un contact a un nom ou un prenom', () => {
+        const contacts: ContactDraft[] = [
+            { firstName: null, lastName: null },
+            { firstName: 'Bob', lastName: null },
+        ]
+        expect(hasAtLeastOneValidContact(contacts)).toBe(true)
+    })
+})
+
+/** Drapeaux d'adresse complets (5 types) avec surcharge partielle. */
+function flags(overrides: Partial<AddressFlagsDraft> = {}): AddressFlagsDraft {
+    return {
+        isProspect: false, isDelivery: false, isBilling: false, isBroker: false, isDistributor: false,
+        ...overrides,
+    }
+}
+
+describe('exclusivite Prospect / Livraison / Facturation (RG-1.06/07/08)', () => {
+    it('Prospect est selectionnable tant que ni Livraison ni Facturation', () => {
+        expect(canSelectProspect(flags())).toBe(true)
+        expect(canSelectProspect(flags({ isDelivery: true }))).toBe(false)
+        expect(canSelectProspect(flags({ isBilling: true }))).toBe(false)
+    })
+
+    it('Livraison / Facturation selectionnables tant que pas Prospect', () => {
+        expect(canSelectDeliveryOrBilling(flags())).toBe(true)
+        expect(canSelectDeliveryOrBilling(flags({ isProspect: true }))).toBe(false)
+    })
+
+    it('cocher Prospect efface Livraison et Facturation', () => {
+        const next = applyProspectExclusivity(flags({ isDelivery: true, isBilling: true }), 'isProspect', true)
+        expect(next).toEqual(flags({ isProspect: true }))
+    })
+
+    it('cocher Livraison efface Prospect', () => {
+        const next = applyProspectExclusivity(flags({ isProspect: true }), 'isDelivery', true)
+        expect(next).toEqual(flags({ isDelivery: true }))
+    })
+
+    it('cocher Facturation efface Prospect mais conserve Livraison', () => {
+        const next = applyProspectExclusivity(flags({ isProspect: true, isDelivery: true }), 'isBilling', true)
+        expect(next).toEqual(flags({ isDelivery: true, isBilling: true }))
+    })
+
+    it('decocher un drapeau ne reactive rien d autre', () => {
+        const next = applyProspectExclusivity(flags({ isDelivery: true, isBilling: true }), 'isBilling', false)
+        expect(next).toEqual(flags({ isDelivery: true }))
+    })
+})
+
+describe('isBillingEmailRequired (RG-1.11)', () => {
+    it('obligatoire uniquement si Facturation est coche', () => {
+        expect(isBillingEmailRequired(flags({ isBilling: true }))).toBe(true)
+        expect(isBillingEmailRequired(flags({ isDelivery: true }))).toBe(false)
+    })
+})
+
+describe('type d\'adresse (Select front) <-> drapeaux back', () => {
+    it('addressFlagsFromType mappe chaque type vers les bons drapeaux', () => {
+        expect(addressFlagsFromType('prospect')).toEqual(flags({ isProspect: true }))
+        expect(addressFlagsFromType('delivery')).toEqual(flags({ isDelivery: true }))
+        expect(addressFlagsFromType('billing')).toEqual(flags({ isBilling: true }))
+        expect(addressFlagsFromType('delivery_billing')).toEqual(flags({ isDelivery: true, isBilling: true }))
+        expect(addressFlagsFromType('broker')).toEqual(flags({ isBroker: true }))
+        expect(addressFlagsFromType('distributor')).toEqual(flags({ isDistributor: true }))
+    })
+
+    it('addressTypeFromFlags reconstruit le type (Prospect/Courtier/Distributeur autonomes, livraison+facturation groupes)', () => {
+        expect(addressTypeFromFlags(flags({ isProspect: true }))).toBe('prospect')
+        expect(addressTypeFromFlags(flags({ isDelivery: true }))).toBe('delivery')
+        expect(addressTypeFromFlags(flags({ isBilling: true }))).toBe('billing')
+        expect(addressTypeFromFlags(flags({ isDelivery: true, isBilling: true }))).toBe('delivery_billing')
+        expect(addressTypeFromFlags(flags({ isBroker: true }))).toBe('broker')
+        expect(addressTypeFromFlags(flags({ isDistributor: true }))).toBe('distributor')
+    })
+
+    it('addressTypeFromFlags retourne null quand aucun drapeau (amorce vierge -> bouton bloque)', () => {
+        expect(addressTypeFromFlags(flags())).toBeNull()
+    })
+
+    it('aller-retour type -> drapeaux -> type stable pour les 6 types', () => {
+        for (const type of ['prospect', 'delivery', 'billing', 'delivery_billing', 'broker', 'distributor'] as const) {
+            expect(addressTypeFromFlags(addressFlagsFromType(type))).toBe(type)
+        }
+    })
+})
+
+describe('regles type de reglement (RG-1.12 / RG-1.13)', () => {
+    it('banque obligatoire si VIREMENT', () => {
+        expect(isBankRequiredForPaymentType('VIREMENT')).toBe(true)
+        expect(isBankRequiredForPaymentType('LCR')).toBe(false)
+        expect(isBankRequiredForPaymentType(null)).toBe(false)
+    })
+
+    it('RIB obligatoire si LCR', () => {
+        expect(isRibRequiredForPaymentType('LCR')).toBe(true)
+        expect(isRibRequiredForPaymentType('VIREMENT')).toBe(false)
+        expect(isRibRequiredForPaymentType(null)).toBe(false)
+    })
+})
+
+describe('hasAllRequiredAccountingFields (RG-1.30)', () => {
+    const complete = {
+        siren: '123456789',
+        accountNumber: '00012345678',
+        nTva: 'FR12345678901',
+        tvaModeIri: '/api/tva_modes/1',
+        paymentDelayIri: '/api/payment_delays/1',
+        paymentTypeIri: '/api/payment_types/1',
+    }
+
+    it('vrai quand les six champs obligatoires sont remplis', () => {
+        expect(hasAllRequiredAccountingFields(complete)).toBe(true)
+    })
+
+    it('faux si un champ est manquant (null ou vide apres trim)', () => {
+        expect(hasAllRequiredAccountingFields({ ...complete, siren: null })).toBe(false)
+        expect(hasAllRequiredAccountingFields({ ...complete, accountNumber: '   ' })).toBe(false)
+        expect(hasAllRequiredAccountingFields({ ...complete, tvaModeIri: null })).toBe(false)
+        expect(hasAllRequiredAccountingFields({ ...complete, paymentTypeIri: null })).toBe(false)
+    })
+
+    it('faux quand tout est vide (onglet non rempli)', () => {
+        expect(hasAllRequiredAccountingFields({
+            siren: null,
+            accountNumber: null,
+            nTva: null,
+            tvaModeIri: null,
+            paymentDelayIri: null,
+            paymentTypeIri: null,
+        })).toBe(false)
+    })
+})
+
+describe('showsRelationAndTriageFields (affichage Relation + Triage selon categorie)', () => {
+    it('faux par defaut (aucune categorie selectionnee)', () => {
+        expect(showsRelationAndTriageFields([])).toBe(false)
+    })
+
+    it('faux si seules des categories Distributeur / Courtier sont selectionnees', () => {
+        expect(showsRelationAndTriageFields(['DISTRIBUTEUR'])).toBe(false)
+        expect(showsRelationAndTriageFields(['COURTIER'])).toBe(false)
+        expect(showsRelationAndTriageFields(['DISTRIBUTEUR', 'COURTIER'])).toBe(false)
+    })
+
+    it('vrai des qu\'une categorie ordinaire est selectionnee', () => {
+        expect(showsRelationAndTriageFields(['CLIENT'])).toBe(true)
+        expect(showsRelationAndTriageFields(['DISTRIBUTEUR', 'CLIENT'])).toBe(true)
+    })
+})
+
+describe('hasAtLeastOneInformationField (pas de validation a vide a la creation)', () => {
+    const blank = {
+        description: null,
+        competitors: null,
+        foundedAt: null,
+        employeesCount: null,
+        revenueAmount: null,
+        profitAmount: null,
+        directorName: null,
+    }
+
+    it('faux quand aucun champ n\'est rempli (onglet vierge)', () => {
+        expect(hasAtLeastOneInformationField(blank)).toBe(false)
+        expect(hasAtLeastOneInformationField({ ...blank, description: '   ' })).toBe(false)
+    })
+
+    it('vrai des qu\'un champ porte une valeur', () => {
+        expect(hasAtLeastOneInformationField({ ...blank, description: 'Acteur majeur' })).toBe(true)
+        expect(hasAtLeastOneInformationField({ ...blank, employeesCount: '42' })).toBe(true)
+        expect(hasAtLeastOneInformationField({ ...blank, foundedAt: '2020-01-01' })).toBe(true)
+    })
+})
+
+describe('isAddressValid (gating « + Adresse » + validation onglet)', () => {
+    /** Adresse de livraison valide (type + site + categorie ; pas de facturation). */
+    function validDelivery(): AddressValidityDraft {
+        return {
+            isProspect: false,
+            isDelivery: true,
+            isBilling: false,
+            isBroker: false,
+            isDistributor: false,
+            categoryIris: ['/api/client_categories/1'],
+            siteIris: ['/api/sites/1'],
+            billingEmail: null,
+        }
+    }
+
+    it('vrai quand type + >= 1 site + >= 1 categorie (sans facturation)', () => {
+        expect(isAddressValid(validDelivery())).toBe(true)
+    })
+
+    it('faux si aucun drapeau (type d\'adresse non renseigne, amorce vierge)', () => {
+        expect(isAddressValid({ ...validDelivery(), isDelivery: false })).toBe(false)
+    })
+
+    it('faux si aucun site (RG-1.10)', () => {
+        expect(isAddressValid({ ...validDelivery(), siteIris: [] })).toBe(false)
+    })
+
+    it('faux si aucune categorie', () => {
+        expect(isAddressValid({ ...validDelivery(), categoryIris: [] })).toBe(false)
+    })
+
+    it('RG-1.11 : email de facturation obligatoire quand l\'adresse est de facturation', () => {
+        const billing: AddressValidityDraft = { ...validDelivery(), isBilling: true }
+        expect(isAddressValid({ ...billing, billingEmail: null })).toBe(false)
+        expect(isAddressValid({ ...billing, billingEmail: '   ' })).toBe(false)
+        expect(isAddressValid({ ...billing, billingEmail: 'facture@acme.fr' })).toBe(true)
+    })
+})
+
+describe('isRibComplete (gating « + RIB » + RG-1.13)', () => {
+    it('vrai quand label + BIC + IBAN sont remplis', () => {
+        expect(isRibComplete({ label: 'Compte courant', bic: 'BNPAFRPP', iban: 'FR1420041010050500013M02606' })).toBe(true)
+    })
+
+    it('faux si un champ manque (null ou vide apres trim)', () => {
+        expect(isRibComplete({ label: null, bic: 'BNPAFRPP', iban: 'FR14...' })).toBe(false)
+        expect(isRibComplete({ label: 'Compte', bic: '  ', iban: 'FR14...' })).toBe(false)
+        expect(isRibComplete({ label: 'Compte', bic: 'BNPAFRPP', iban: null })).toBe(false)
+    })
+
+    it('faux pour un bloc totalement vide (amorce)', () => {
+        expect(isRibComplete({ label: null, bic: null, iban: null })).toBe(false)
+    })
+})
+
+describe('omitEmptyRequired (ERP-119 : 422 NotBlank au lieu de 400 de type)', () => {
+    it('retire les cles requises vides (null / vide / undefined)', () => {
+        const payload = omitEmptyRequired(
+            { companyName: null, label: '', iban: undefined, categories: ['/api/categories/1'] },
+            ['companyName', 'label', 'iban'],
+        )
+        expect('companyName' in payload).toBe(false)
+        expect('label' in payload).toBe(false)
+        expect('iban' in payload).toBe(false)
+        // Les cles hors liste ne sont jamais touchees.
+        expect(payload.categories).toEqual(['/api/categories/1'])
+    })
+
+    it('conserve les cles requises renseignees', () => {
+        const payload = omitEmptyRequired({ companyName: 'ACME', bic: 'BNPAFRPP' }, ['companyName', 'bic'])
+        expect(payload).toEqual({ companyName: 'ACME', bic: 'BNPAFRPP' })
+    })
+
+    it('ne retire jamais une cle hors de la liste requise, meme vide', () => {
+        const payload = omitEmptyRequired({ streetComplement: null }, ['street'])
+        expect('streetComplement' in payload).toBe(true)
+        expect(payload.streetComplement).toBeNull()
+    })
+
+    it('false / 0 ne sont pas consideres vides (booleens / nombres preserves)', () => {
+        const payload = omitEmptyRequired({ isDelivery: false, position: 0 }, ['isDelivery', 'position'])
+        expect(payload).toEqual({ isDelivery: false, position: 0 })
+    })
+})
@@ -0,0 +1,239 @@
+import { describe, expect, it } from 'vitest'
+import {
+    canEditSupplier,
+    categoryOptionsOf,
+    contactOptionsOf,
+    iriOf,
+    mapAccountingDraft,
+    mapAddressToDraft,
+    mapAddressView,
+    mapContactToDraft,
+    mapRibToDraft,
+    paymentTypeCodeOf,
+    referentialOptionOf,
+    showArchiveAction,
+    showRestoreAction,
+    siteOptionsOf,
+    type SupplierDetail,
+} from '../supplierConsultation'
+
+describe('iriOf', () => {
+    it('retourne l\'@id d\'une relation embarquee (objet)', () => {
+        expect(iriOf({ '@id': '/api/payment_types/14', code: 'LCR' })).toBe('/api/payment_types/14')
+    })
+
+    it('retourne la chaine telle quelle si la relation est deja un IRI', () => {
+        expect(iriOf('/api/banks/3')).toBe('/api/banks/3')
+    })
+
+    it('retourne null pour une relation absente (null / undefined / skip_null_values)', () => {
+        expect(iriOf(null)).toBeNull()
+        expect(iriOf(undefined)).toBeNull()
+    })
+})
+
+describe('mapContactToDraft', () => {
+    it('formate les telephones en XX XX XX XX XX et conserve l\'iri', () => {
+        const draft = mapContactToDraft({
+            '@id': '/api/supplier_contacts/39',
+            id: 39,
+            firstName: 'Marie',
+            lastName: 'Martin',
+            jobTitle: 'Responsable achats',
+            phonePrimary: '0612345678',
+            email: 'marie.martin@seed.test',
+        })
+        expect(draft.id).toBe(39)
+        expect(draft.iri).toBe('/api/supplier_contacts/39')
+        expect(draft.phonePrimary).toBe('06 12 34 56 78')
+        expect(draft.hasSecondaryPhone).toBe(false)
+    })
+
+    it('revele le 2e telephone quand phoneSecondary est present', () => {
+        const draft = mapContactToDraft({
+            '@id': '/api/supplier_contacts/40',
+            id: 40,
+            phonePrimary: '0600000000',
+            phoneSecondary: '0611111111',
+        })
+        expect(draft.hasSecondaryPhone).toBe(true)
+        expect(draft.phoneSecondary).toBe('06 11 11 11 11')
+    })
+})
+
+describe('mapAddressToDraft', () => {
+    it('mappe l\'enum addressType, les champs fournisseur et extrait les iris', () => {
+        const draft = mapAddressToDraft({
+            '@id': '/api/supplier_addresses/33',
+            id: 33,
+            addressType: 'DEPART',
+            country: 'France',
+            postalCode: '86000',
+            city: 'Poitiers',
+            street: '12 rue des Acacias',
+            bennes: 3,
+            triageProvider: true,
+            sites: [{ '@id': '/api/sites/87', name: 'Chatellerault', color: '#056CF2' }],
+            categories: [{ '@id': '/api/categories/2279', code: 'NEGOCIANT' }],
+            contacts: [{ '@id': '/api/supplier_contacts/39' }, '/api/supplier_contacts/41'],
+        })
+        expect(draft.addressType).toBe('DEPART')
+        expect(draft.siteIris).toEqual(['/api/sites/87'])
+        expect(draft.categoryIris).toEqual(['/api/categories/2279'])
+        expect(draft.contactIris).toEqual(['/api/supplier_contacts/39', '/api/supplier_contacts/41'])
+        // bennes (entier) → chaine pour MalioInputNumber.
+        expect(draft.bennes).toBe('3')
+        expect(draft.triageProvider).toBe(true)
+        expect(draft.city).toBe('Poitiers')
+        expect(draft.country).toBe('France')
+    })
+
+    it('tolere les champs absents (defauts : France, bennes « 0 », triage faux, type null)', () => {
+        const draft = mapAddressToDraft({ '@id': '/api/supplier_addresses/9', id: 9 })
+        expect(draft.addressType).toBeNull()
+        expect(draft.siteIris).toEqual([])
+        expect(draft.categoryIris).toEqual([])
+        expect(draft.contactIris).toEqual([])
+        expect(draft.country).toBe('France')
+        expect(draft.bennes).toBe('0')
+        expect(draft.triageProvider).toBe(false)
+    })
+})
+
+describe('mapRibToDraft', () => {
+    it('mappe label / bic / iban et l\'id serveur', () => {
+        const draft = mapRibToDraft({ '@id': '/api/supplier_ribs/27', id: 27, label: 'Compte principal', bic: 'BNPAFRPPXXX', iban: 'FR14...' })
+        expect(draft).toEqual({ id: 27, label: 'Compte principal', bic: 'BNPAFRPPXXX', iban: 'FR14...' })
+    })
+})
+
+describe('mapAccountingDraft', () => {
+    it('mappe les scalaires et resout les iris des referentiels embarques', () => {
+        const acc = mapAccountingDraft({
+            '@id': '/api/suppliers/85',
+            id: 85,
+            siren: '123456789',
+            accountNumber: 'F0001',
+            nTva: 'FR00123456789',
+            tvaMode: { '@id': '/api/tva_modes/30' },
+            paymentDelay: { '@id': '/api/payment_delays/11' },
+            paymentType: { '@id': '/api/payment_types/14', code: 'LCR' },
+            bank: { '@id': '/api/banks/3' },
+        } as SupplierDetail)
+        expect(acc).toEqual({
+            siren: '123456789',
+            accountNumber: 'F0001',
+            nTva: 'FR00123456789',
+            tvaModeIri: '/api/tva_modes/30',
+            paymentDelayIri: '/api/payment_delays/11',
+            paymentTypeIri: '/api/payment_types/14',
+            bankIri: '/api/banks/3',
+        })
+    })
+
+    it('renvoie des null quand les champs comptables sont absents (gating par omission, sans accounting.view)', () => {
+        const acc = mapAccountingDraft({} as SupplierDetail)
+        expect(acc).toEqual({
+            siren: null,
+            accountNumber: null,
+            nTva: null,
+            tvaModeIri: null,
+            paymentDelayIri: null,
+            paymentTypeIri: null,
+            bankIri: null,
+        })
+    })
+})
+
+describe('options construites depuis l\'embed (role-independantes)', () => {
+    it('categoryOptionsOf expose value=IRI, label=nom, code', () => {
+        expect(categoryOptionsOf([{ '@id': '/api/categories/2279', name: 'Negociant', code: 'NEGOCIANT' }])).toEqual([
+            { value: '/api/categories/2279', label: 'Negociant', code: 'NEGOCIANT' },
+        ])
+    })
+
+    it('siteOptionsOf expose value=IRI, label=nom', () => {
+        expect(siteOptionsOf([{ '@id': '/api/sites/87', name: 'Chatellerault', color: '#000' }])).toEqual([
+            { value: '/api/sites/87', label: 'Chatellerault' },
+        ])
+    })
+
+    it('contactOptionsOf compose le libelle (nom complet, sinon email)', () => {
+        expect(contactOptionsOf([
+            { '@id': '/api/supplier_contacts/1', id: 1, firstName: 'Marie', lastName: 'Martin' },
+            { '@id': '/api/supplier_contacts/2', id: 2, email: 'a@b.fr' },
+        ])).toEqual([
+            { value: '/api/supplier_contacts/1', label: 'Marie Martin' },
+            { value: '/api/supplier_contacts/2', label: 'a@b.fr' },
+        ])
+    })
+
+    it('referentialOptionOf : option unique depuis l\'embed, vide pour IRI nu / absent', () => {
+        expect(referentialOptionOf({ '@id': '/api/payment_types/14', label: 'LCR' })).toEqual([
+            { value: '/api/payment_types/14', label: 'LCR' },
+        ])
+        expect(referentialOptionOf('/api/banks/3')).toEqual([])
+        expect(referentialOptionOf(null)).toEqual([])
+    })
+
+    it('mapAddressView assemble brouillon + options propres a l\'adresse', () => {
+        const view = mapAddressView({
+            '@id': '/api/supplier_addresses/33',
+            id: 33,
+            addressType: 'RENDU',
+            city: 'Poitiers',
+            sites: [{ '@id': '/api/sites/87', name: 'Chatellerault' }],
+            categories: [{ '@id': '/api/categories/2279', name: 'Negociant', code: 'NEGOCIANT' }],
+        })
+        expect(view.draft.id).toBe(33)
+        expect(view.draft.addressType).toBe('RENDU')
+        expect(view.siteOptions).toEqual([{ value: '/api/sites/87', label: 'Chatellerault' }])
+        expect(view.categoryOptions).toEqual([{ value: '/api/categories/2279', label: 'Negociant', code: 'NEGOCIANT' }])
+    })
+})
+
+describe('canEditSupplier', () => {
+    const can = (granted: string[]) => (codes: string[]) => codes.some(c => granted.includes(c))
+
+    it('visible pour manage', () => {
+        expect(canEditSupplier(can(['commercial.suppliers.manage']))).toBe(true)
+    })
+
+    it('visible pour accounting.manage (role Compta)', () => {
+        expect(canEditSupplier(can(['commercial.suppliers.accounting.manage']))).toBe(true)
+    })
+
+    it('masque sans aucune des deux permissions (role Usine)', () => {
+        expect(canEditSupplier(can(['commercial.suppliers.view']))).toBe(false)
+    })
+})
+
+describe('showArchiveAction / showRestoreAction', () => {
+    const can = (granted: string[]) => (code: string) => granted.includes(code)
+
+    it('Archiver : visible avec la permission archive ET fournisseur non archive', () => {
+        expect(showArchiveAction(can(['commercial.suppliers.archive']), false)).toBe(true)
+        expect(showArchiveAction(can(['commercial.suppliers.archive']), true)).toBe(false)
+        expect(showArchiveAction(can([]), false)).toBe(false)
+    })
+
+    it('Restaurer : visible avec la permission archive ET fournisseur archive', () => {
+        expect(showRestoreAction(can(['commercial.suppliers.archive']), true)).toBe(true)
+        expect(showRestoreAction(can(['commercial.suppliers.archive']), false)).toBe(false)
+        expect(showRestoreAction(can([]), true)).toBe(false)
+    })
+})
+
+describe('paymentTypeCodeOf (ERP-121 : RIB masques hors-LCR en consultation)', () => {
+    it('retourne le code metier quand le type de reglement est embarque', () => {
+        expect(paymentTypeCodeOf({ '@id': '/api/payment_types/1', code: 'LCR' })).toBe('LCR')
+        expect(paymentTypeCodeOf({ '@id': '/api/payment_types/2', code: 'VIREMENT' })).toBe('VIREMENT')
+    })
+
+    it('retourne null pour un IRI nu, un objet sans code, ou une relation absente', () => {
+        expect(paymentTypeCodeOf('/api/payment_types/1')).toBeNull()
+        expect(paymentTypeCodeOf({ '@id': '/api/payment_types/1' })).toBeNull()
+        expect(paymentTypeCodeOf(null)).toBeNull()
+        expect(paymentTypeCodeOf(undefined)).toBeNull()
+    })
+})
@@ -0,0 +1,227 @@
+import { describe, it, expect } from 'vitest'
+import {
+    buildAccountingPayload,
+    buildAddressPayload,
+    buildContactPayload,
+    buildInformationPayload,
+    buildMainPayload,
+    buildRibPayload,
+    mapAccountingFormDraft,
+    mapInformationDraft,
+    mapMainDraft,
+    resolveTabEditability,
+} from '../supplierEdit'
+import type { SupplierDetail } from '~/modules/commercial/utils/forms/supplierConsultation'
+import { emptyAddress, emptyContact, emptyRib } from '~/modules/commercial/types/supplierForm'
+
+describe('buildMainPayload (groupe supplier:write:main)', () => {
+    it('envoie companyName + categories quand renseignes', () => {
+        expect(buildMainPayload({ companyName: 'ACME', categoryIris: ['/api/categories/1'] })).toEqual({
+            companyName: 'ACME',
+            categories: ['/api/categories/1'],
+        })
+    })
+
+    it('CREATION : omet companyName vide (-> 422 NotBlank, ERP-119)', () => {
+        const payload = buildMainPayload({ companyName: null, categoryIris: [] })
+        expect('companyName' in payload).toBe(false)
+        expect(payload.categories).toEqual([])
+    })
+
+    it('EDITION (forUpdate) : companyName vide envoye en `\'\'` (PATCH -> 422 NotBlank, pas un faux 200)', () => {
+        const payload = buildMainPayload({ companyName: '', categoryIris: [] }, { forUpdate: true })
+        expect('companyName' in payload).toBe(true)
+        expect(payload.companyName).toBe('')
+    })
+})
+
+describe('buildInformationPayload (groupe supplier:write:information)', () => {
+    const base = {
+        description: null, competitors: null, foundedAt: null, foundedAtRaw: '', employeesCount: null,
+        revenueAmount: null, profitAmount: null, directorName: null, volumeForecast: null,
+    }
+
+    it('convertit employeesCount et volumeForecast en nombre, null si vide', () => {
+        expect(buildInformationPayload({ ...base, employeesCount: '42', volumeForecast: '1000' })).toMatchObject({
+            employeesCount: 42,
+            volumeForecast: 1000,
+        })
+        expect(buildInformationPayload(base)).toMatchObject({ employeesCount: null, volumeForecast: null })
+    })
+
+    it('envoie la saisie invalide (foundedAtRaw) en priorite -> le back tranchera (422)', () => {
+        // Saisie malformee transmise telle quelle pour declencher la 422 back (MUI-44).
+        expect(buildInformationPayload({ ...base, foundedAt: null, foundedAtRaw: '32/13/2026' }).foundedAt)
+            .toBe('32/13/2026')
+        // Saisie valide : foundedAtRaw vide -> on envoie la date ISO.
+        expect(buildInformationPayload({ ...base, foundedAt: '2008-04-01', foundedAtRaw: '' }).foundedAt)
+            .toBe('2008-04-01')
+    })
+})
+
+describe('buildContactPayload (sous-ressource supplier_contact)', () => {
+    it('n\'envoie le 2e telephone que si revele (hasSecondaryPhone)', () => {
+        const contact = { ...emptyContact(), phonePrimary: '0102030405', phoneSecondary: '0607080910' }
+        expect(buildContactPayload({ ...contact, hasSecondaryPhone: false }).phoneSecondary).toBeNull()
+        expect(buildContactPayload({ ...contact, hasSecondaryPhone: true }).phoneSecondary).toBe('0607080910')
+    })
+})
+
+describe('buildAddressPayload (sous-ressource supplier_address — specificites M2)', () => {
+    it('envoie addressType (enum), bennes (nombre) et triageProvider', () => {
+        const address = {
+            ...emptyAddress(),
+            addressType: 'RENDU' as const,
+            postalCode: '86100', city: 'Châtellerault', street: '1 rue de la Paix',
+            siteIris: ['/api/sites/1'], categoryIris: ['/api/categories/2'],
+            bennes: '3', triageProvider: true,
+        }
+        expect(buildAddressPayload(address)).toMatchObject({
+            addressType: 'RENDU',
+            bennes: 3,
+            triageProvider: true,
+            sites: ['/api/sites/1'],
+            categories: ['/api/categories/2'],
+        })
+    })
+
+    it('bennes null quand le champ est vide', () => {
+        expect(buildAddressPayload({ ...emptyAddress(), bennes: '' }).bennes).toBeNull()
+    })
+
+    it('omet postalCode / city / street vides (-> 422 NotBlank, ERP-119)', () => {
+        const payload = buildAddressPayload({ ...emptyAddress(), addressType: 'PROSPECT' })
+        expect('postalCode' in payload).toBe(false)
+        expect('city' in payload).toBe(false)
+        expect('street' in payload).toBe(false)
+        // Les champs non requis restent presents.
+        expect('streetComplement' in payload).toBe(true)
+        expect(payload.addressType).toBe('PROSPECT')
+    })
+
+    it('omet addressType quand aucun radio n\'est choisi (-> 422 NotBlank au lieu d\'un 400 de type)', () => {
+        // emptyAddress() laisse addressType a null : la cle doit etre absente du
+        // payload pour que le back renvoie une 422 propertyPath addressType.
+        const payload = buildAddressPayload(emptyAddress())
+        expect('addressType' in payload).toBe(false)
+    })
+
+    it('EDITION (forUpdate) : un champ requis vide est envoye en `\'\'` (et NON omis) pour declencher la 422 NotBlank au PATCH', () => {
+        // Bug edition : omettre la cle d'un champ requis vide laisse le PATCH garder
+        // l'ancienne valeur (faux 200). En `forUpdate`, on envoie `''` -> NotBlank 422.
+        const payload = buildAddressPayload({ ...emptyAddress(), addressType: 'DEPART', postalCode: '' }, { forUpdate: true })
+        expect('postalCode' in payload).toBe(true)
+        expect(payload.postalCode).toBe('')
+        // Un champ requis renseigne reste tel quel.
+        expect(payload.addressType).toBe('DEPART')
+    })
+
+    it('n\'expose jamais d\'email de facturation (difference M1)', () => {
+        const payload = buildAddressPayload({ ...emptyAddress(), addressType: 'DEPART' })
+        expect('billingEmail' in payload).toBe(false)
+    })
+})
+
+describe('buildAccountingPayload (groupe supplier:write:accounting)', () => {
+    const base = {
+        siren: '123456789', accountNumber: '00012345678', nTva: 'FR123',
+        tvaModeIri: '/api/tva_modes/1', paymentDelayIri: '/api/payment_delays/1',
+        paymentTypeIri: '/api/payment_types/1', bankIri: '/api/banks/1',
+    }
+
+    it('envoie la banque seulement si requise (VIREMENT, RG-2.07)', () => {
+        expect(buildAccountingPayload(base, true).bank).toBe('/api/banks/1')
+        expect(buildAccountingPayload(base, false).bank).toBeNull()
+    })
+})
+
+describe('buildRibPayload (sous-ressource supplier_rib)', () => {
+    it('omet les champs requis vides (-> 422 NotBlank, ERP-119)', () => {
+        const payload = buildRibPayload({ ...emptyRib(), iban: 'FR1420041010050500013M02606' })
+        expect('label' in payload).toBe(false)
+        expect('bic' in payload).toBe(false)
+        expect(payload.iban).toBe('FR1420041010050500013M02606')
+    })
+})
+
+describe('mapMainDraft — pre-remplissage bloc principal (companyName + categories, pas de relation M2)', () => {
+    it('extrait companyName et les IRI de categories', () => {
+        const draft = mapMainDraft({
+            '@id': '/api/suppliers/85', id: 85,
+            companyName: 'DOD862875',
+            categories: [{ '@id': '/api/categories/2279', code: 'NEGOCIANT' }],
+        } as SupplierDetail)
+        expect(draft.companyName).toBe('DOD862875')
+        expect(draft.categoryIris).toEqual(['/api/categories/2279'])
+    })
+
+    it('gere les cles omises (skip_null_values) sans planter', () => {
+        const draft = mapMainDraft({ '@id': '/api/suppliers/2', id: 2 } as SupplierDetail)
+        expect(draft.companyName).toBeNull()
+        expect(draft.categoryIris).toEqual([])
+    })
+})
+
+describe('mapInformationDraft — pre-remplissage onglet Information (+ volumeForecast M2)', () => {
+    it('tronque foundedAt, stringifie employeesCount et volumeForecast', () => {
+        const draft = mapInformationDraft({
+            '@id': '/api/suppliers/85', id: 85,
+            foundedAt: '2008-04-01T00:00:00+02:00', employeesCount: 42, volumeForecast: 8000,
+        } as SupplierDetail)
+        expect(draft.foundedAt).toBe('2008-04-01')
+        expect(draft.employeesCount).toBe('42')
+        expect(draft.volumeForecast).toBe('8000')
+    })
+
+    it('cles omises -> null (volumeForecast inclus)', () => {
+        const draft = mapInformationDraft({ '@id': '/api/suppliers/1', id: 1 } as SupplierDetail)
+        expect(draft.foundedAt).toBeNull()
+        expect(draft.employeesCount).toBeNull()
+        expect(draft.volumeForecast).toBeNull()
+        expect(draft.description).toBeNull()
+    })
+})
+
+describe('mapAccountingFormDraft — pre-remplissage onglet Comptabilite', () => {
+    it('extrait les scalaires et les IRI des referentiels embarques', () => {
+        const draft = mapAccountingFormDraft({
+            '@id': '/api/suppliers/85', id: 85,
+            siren: '123456789', accountNumber: 'F0001', nTva: 'FR00123456789',
+            tvaMode: { '@id': '/api/tva_modes/30', label: 'France (ventes)' },
+            paymentType: '/api/payment_types/14',
+        } as SupplierDetail)
+        expect(draft.siren).toBe('123456789')
+        expect(draft.tvaModeIri).toBe('/api/tva_modes/30')
+        expect(draft.paymentTypeIri).toBe('/api/payment_types/14')
+        expect(draft.bankIri).toBeNull()
+    })
+
+    it('cles comptables absentes (gating par omission) -> scalaires/IRI null', () => {
+        const draft = mapAccountingFormDraft({ '@id': '/api/suppliers/1', id: 1 } as SupplierDetail)
+        expect(draft.siren).toBeNull()
+        expect(draft.tvaModeIri).toBeNull()
+        expect(draft.bankIri).toBeNull()
+    })
+})
+
+describe('resolveTabEditability — gating par role (matrice § 2.7)', () => {
+    it('Admin : tout editable', () => {
+        expect(resolveTabEditability({ canManage: true, canAccountingView: true, canAccountingManage: true }))
+            .toEqual({ businessEditable: true, accountingVisible: true, accountingEditable: true })
+    })
+
+    it('Bureau / Commerciale (manage seul) : metier editable, Comptabilite masquee', () => {
+        expect(resolveTabEditability({ canManage: true, canAccountingView: false, canAccountingManage: false }))
+            .toEqual({ businessEditable: true, accountingVisible: false, accountingEditable: false })
+    })
+
+    it('Compta (accounting seul) : metier readonly, Comptabilite editable', () => {
+        expect(resolveTabEditability({ canManage: false, canAccountingView: true, canAccountingManage: true }))
+            .toEqual({ businessEditable: false, accountingVisible: true, accountingEditable: true })
+    })
+
+    it('Sans permission d\'edition : rien d\'editable', () => {
+        expect(resolveTabEditability({ canManage: false, canAccountingView: false, canAccountingManage: false }))
+            .toEqual({ businessEditable: false, accountingVisible: false, accountingEditable: false })
+    })
+})
@@ -0,0 +1,190 @@
+import { describe, it, expect } from 'vitest'
+import {
+    buildSupplierFormTabKeys,
+    hasAtLeastOneValidContact,
+    isAddressValid,
+    isBankRequiredForPaymentType,
+    isBlankRow,
+    isContactBlank,
+    isContactNamed,
+    isRibBlank,
+    isRibComplete,
+    isRibRequiredForPaymentType,
+    lastFillableTabKey,
+    omitEmptyRequired,
+    type AddressValidityDraft,
+    type ContactDraft,
+    type ContactFillableDraft,
+} from '../supplierFormRules'
+
+/** Bloc contact totalement vide (amorce par defaut). */
+function blankContact(): ContactFillableDraft {
+    return {
+        firstName: null,
+        lastName: null,
+        jobTitle: null,
+        phonePrimary: null,
+        phoneSecondary: null,
+        email: null,
+    }
+}
+
+describe('buildSupplierFormTabKeys (gating onglet Comptabilite + onglets edit-only)', () => {
+    it('inclut l onglet accounting si l utilisateur a accounting.view', () => {
+        expect(buildSupplierFormTabKeys(true)).toContain('accounting')
+    })
+
+    it('exclut l onglet accounting sinon (Bureau / Commerciale)', () => {
+        expect(buildSupplierFormTabKeys(false)).not.toContain('accounting')
+    })
+
+    it('a la creation, ordre = information / contacts / addresses / transport (+ accounting si vu)', () => {
+        expect(buildSupplierFormTabKeys(true)).toEqual(['information', 'contacts', 'addresses', 'transport', 'accounting'])
+        expect(buildSupplierFormTabKeys(false)).toEqual(['information', 'contacts', 'addresses', 'transport'])
+    })
+
+    it('a la creation, exclut Statistiques / Rapports / Echanges', () => {
+        const keys = buildSupplierFormTabKeys(true)
+        expect(keys).not.toContain('statistics')
+        expect(keys).not.toContain('reports')
+        expect(keys).not.toContain('exchanges')
+    })
+
+    it('en modification (includeEditOnlyTabs), ajoute les onglets edit-only en fin', () => {
+        expect(buildSupplierFormTabKeys(true, { includeEditOnlyTabs: true })).toEqual([
+            'information', 'contacts', 'addresses', 'transport', 'accounting', 'statistics', 'reports', 'exchanges',
+        ])
+    })
+})
+
+describe('lastFillableTabKey (redirection fin d\'ajout, role-aware)', () => {
+    it('addresses pour un role sans Comptabilite (Bureau / Commerciale)', () => {
+        expect(lastFillableTabKey(buildSupplierFormTabKeys(false))).toBe('addresses')
+    })
+
+    it('accounting pour un role avec accounting.view (Admin)', () => {
+        expect(lastFillableTabKey(buildSupplierFormTabKeys(true))).toBe('accounting')
+    })
+
+    it('ignore les onglets placeholder (Transport en dernier ne compte pas)', () => {
+        expect(lastFillableTabKey(['information', 'contacts', 'addresses', 'transport'])).toBe('addresses')
+    })
+
+    it('undefined si aucun onglet remplissable (que des placeholders)', () => {
+        expect(lastFillableTabKey(['transport', 'statistics'])).toBeUndefined()
+    })
+})
+
+describe('isContactNamed (RG-2.04)', () => {
+    it('vrai si le prenom ou le nom est renseigne', () => {
+        expect(isContactNamed({ firstName: 'Alice', lastName: null })).toBe(true)
+        expect(isContactNamed({ firstName: null, lastName: 'Martin' })).toBe(true)
+    })
+
+    it('faux si les deux sont vides ou espaces uniquement', () => {
+        expect(isContactNamed({ firstName: null, lastName: null })).toBe(false)
+        expect(isContactNamed({ firstName: '  ', lastName: '' })).toBe(false)
+    })
+})
+
+describe('hasAtLeastOneValidContact (RG-2.13)', () => {
+    it('faux sur une liste vide ou sans contact nomme', () => {
+        expect(hasAtLeastOneValidContact([])).toBe(false)
+        const contacts: ContactDraft[] = [{ firstName: null, lastName: null }, { firstName: '', lastName: '  ' }]
+        expect(hasAtLeastOneValidContact(contacts)).toBe(false)
+    })
+
+    it('vrai des qu un contact a un nom ou un prenom', () => {
+        expect(hasAtLeastOneValidContact([{ firstName: null, lastName: null }, { firstName: 'Bob', lastName: null }])).toBe(true)
+    })
+})
+
+describe('isBlankRow / isContactBlank / isRibBlank (blocs vides vs partiels)', () => {
+    it('isBlankRow vrai si toutes les valeurs sont vides', () => {
+        expect(isBlankRow([null, undefined, '', '  '])).toBe(true)
+        expect(isBlankRow([null, 'x', ''])).toBe(false)
+    })
+
+    it('isContactBlank faux si un email seul est saisi (bloc a soumettre -> 422 RG-2.04 inline)', () => {
+        expect(isContactBlank(blankContact())).toBe(true)
+        expect(isContactBlank({ ...blankContact(), email: 'jean@acme.fr' })).toBe(false)
+    })
+
+    it('isRibBlank faux si un IBAN seul est saisi (bloc a soumettre -> 422 NotBlank inline)', () => {
+        expect(isRibBlank({ label: null, bic: null, iban: null })).toBe(true)
+        expect(isRibBlank({ label: null, bic: null, iban: 'FR1420041010050500013M02606' })).toBe(false)
+    })
+})
+
+describe('isRibComplete (gating « + RIB » + RG-2.08)', () => {
+    it('vrai quand label + BIC + IBAN sont remplis', () => {
+        expect(isRibComplete({ label: 'Compte courant', bic: 'BNPAFRPP', iban: 'FR1420041010050500013M02606' })).toBe(true)
+    })
+
+    it('faux si un champ manque', () => {
+        expect(isRibComplete({ label: null, bic: 'BNPAFRPP', iban: 'FR14...' })).toBe(false)
+        expect(isRibComplete({ label: 'Compte', bic: '  ', iban: 'FR14...' })).toBe(false)
+    })
+})
+
+describe('regles type de reglement (RG-2.07 / RG-2.08)', () => {
+    it('banque obligatoire si VIREMENT', () => {
+        expect(isBankRequiredForPaymentType('VIREMENT')).toBe(true)
+        expect(isBankRequiredForPaymentType('LCR')).toBe(false)
+        expect(isBankRequiredForPaymentType(null)).toBe(false)
+    })
+
+    it('RIB obligatoire si LCR', () => {
+        expect(isRibRequiredForPaymentType('LCR')).toBe(true)
+        expect(isRibRequiredForPaymentType('VIREMENT')).toBe(false)
+        expect(isRibRequiredForPaymentType(null)).toBe(false)
+    })
+})
+
+describe('isAddressValid (enum addressType, RG-2.06/2.09/2.10 ; pas d\'email facturation)', () => {
+    function validAddress(): AddressValidityDraft {
+        return {
+            addressType: 'DEPART',
+            categoryIris: ['/api/categories/1'],
+            siteIris: ['/api/sites/1'],
+        }
+    }
+
+    it('vrai quand type + >= 1 site + >= 1 categorie', () => {
+        expect(isAddressValid(validAddress())).toBe(true)
+    })
+
+    it('faux si le type d\'adresse n\'est pas renseigne (amorce vierge)', () => {
+        expect(isAddressValid({ ...validAddress(), addressType: null })).toBe(false)
+    })
+
+    it('faux si aucun site (RG-2.06)', () => {
+        expect(isAddressValid({ ...validAddress(), siteIris: [] })).toBe(false)
+    })
+
+    it('faux si aucune categorie (RG-2.10)', () => {
+        expect(isAddressValid({ ...validAddress(), categoryIris: [] })).toBe(false)
+    })
+
+    it('accepte les trois valeurs d\'enum PROSPECT / DEPART / RENDU', () => {
+        for (const type of ['PROSPECT', 'DEPART', 'RENDU'] as const) {
+            expect(isAddressValid({ ...validAddress(), addressType: type })).toBe(true)
+        }
+    })
+})
+
+describe('omitEmptyRequired (ERP-119 : 422 NotBlank au lieu de 400 de type)', () => {
+    it('retire les cles requises vides et conserve le reste', () => {
+        const payload = omitEmptyRequired(
+            { companyName: null, sites: ['/api/sites/1'] },
+            ['companyName'],
+        )
+        expect('companyName' in payload).toBe(false)
+        expect(payload.sites).toEqual(['/api/sites/1'])
+    })
+
+    it('false / 0 ne sont pas consideres vides (booleens / nombres preserves)', () => {
+        const payload = omitEmptyRequired({ triageProvider: false, bennes: 0 }, ['triageProvider', 'bennes'])
+        expect(payload).toEqual({ triageProvider: false, bennes: 0 })
+    })
+})
@@ -0,0 +1,338 @@
+/**
+ * Helpers purs de l'ecran « Consultation client » (M1 Commercial, lecture seule).
+ *
+ * Mappent le payload `GET /api/clients/{id}` (relations embarquees, cf. groupe
+ * `client:item:read` + `client:read:accounting`) vers les brouillons « plats »
+ * partages avec les blocs reutilisables `ClientContactBlock` / `ClientAddressBlock`
+ * et l'onglet Comptabilite. Ne touchent ni a l'API ni a l'etat reactif : testables
+ * unitairement (cf. clientConsultation.spec.ts).
+ *
+ * Rappels de contrat back (verifies sur l'API reelle) :
+ *  - les relations ManyToOne (distributor/broker/tvaMode/paymentType/...) sont
+ *    serialisees en OBJETS embarques (avec @id + companyName/code/label), pas en IRI nu ;
+ *  - les champs nuls sont OMIS du JSON (skip_null_values) → toujours lire avec `?? null` ;
+ *  - les champs comptables et `ribs` sont TOTALEMENT ABSENTS sans permission
+ *    accounting.view (gate serveur via ClientReadGroupContextBuilder).
+ */
+
+import { formatPhoneFR } from '~/shared/utils/phone'
+import type {
+    AddressFormDraft,
+    ContactFormDraft,
+    RibFormDraft,
+} from '~/modules/commercial/types/clientForm'
+
+/** Reference Hydra embarquee minimale (@id toujours present). */
+export interface HydraRef {
+    '@id': string
+    [key: string]: unknown
+}
+
+/** Une relation peut etre embarquee (objet), un IRI nu (chaine) ou absente. */
+export type Relation = HydraRef | string | null | undefined
+
+/** Site embarque dans une adresse (groupe site:read). */
+export interface SiteRead extends HydraRef {
+    name?: string
+    color?: string
+}
+
+/** Categorie embarquee (groupe category:read). */
+export interface CategoryRead extends HydraRef {
+    code?: string
+    name?: string
+}
+
+/** Contact embarque (groupe client_contact:read). */
+export interface ContactRead extends HydraRef {
+    id: number
+    firstName?: string | null
+    lastName?: string | null
+    jobTitle?: string | null
+    phonePrimary?: string | null
+    phoneSecondary?: string | null
+    email?: string | null
+}
+
+/** Adresse embarquee (groupe client_address:read). */
+export interface AddressRead extends HydraRef {
+    id: number
+    country?: string | null
+    postalCode?: string | null
+    city?: string | null
+    street?: string | null
+    streetComplement?: string | null
+    billingEmail?: string | null
+    billingEmailSecondary?: string | null
+    isProspect?: boolean
+    isDelivery?: boolean
+    isBilling?: boolean
+    isBroker?: boolean
+    isDistributor?: boolean
+    sites?: SiteRead[]
+    categories?: CategoryRead[]
+    // L'embed M2M des contacts d'adresse peut etre un objet (partiel) ou un IRI nu.
+    contacts?: Array<HydraRef | string>
+}
+
+/** RIB embarque (groupe client:read:accounting, present ssi accounting.view). */
+export interface RibRead extends HydraRef {
+    id: number
+    label?: string | null
+    bic?: string | null
+    iban?: string | null
+}
+
+/** Client relie (distributeur / courtier) embarque (groupe client:read). */
+export interface RelatedClientRead extends HydraRef {
+    companyName?: string | null
+}
+
+/**
+ * Detail d'un client tel que renvoye par `GET /api/clients/{id}`. Tous les
+ * champs sont optionnels : skip_null_values cote serveur et gating accounting
+ * peuvent omettre n'importe quelle cle.
+ */
+export interface ClientDetail extends HydraRef {
+    id: number
+    companyName?: string | null
+    triageService?: boolean
+    isArchived?: boolean
+    categories?: CategoryRead[]
+    distributor?: RelatedClientRead | string | null
+    broker?: RelatedClientRead | string | null
+    contacts?: ContactRead[]
+    addresses?: AddressRead[]
+    ribs?: RibRead[]
+    // Onglet Information
+    description?: string | null
+    competitors?: string | null
+    foundedAt?: string | null
+    employeesCount?: number | null
+    revenueAmount?: string | null
+    profitAmount?: string | null
+    directorName?: string | null
+    // Onglet Comptabilite (present ssi accounting.view)
+    siren?: string | null
+    accountNumber?: string | null
+    nTva?: string | null
+    tvaMode?: Relation
+    paymentDelay?: Relation
+    paymentType?: Relation
+    bank?: Relation
+}
+
+/** Etat « plat » de l'onglet Comptabilite (miroir lecture du formulaire 1.10). */
+export interface AccountingDraft {
+    siren: string | null
+    accountNumber: string | null
+    nTva: string | null
+    tvaModeIri: string | null
+    paymentDelayIri: string | null
+    paymentTypeIri: string | null
+    bankIri: string | null
+}
+
+/** Relation Distributeur/Courtier resolue pour l'affichage en lecture seule. */
+export interface ClientRelation {
+    type: 'distributeur' | 'courtier' | null
+    name: string | null
+}
+
+/** Option de select ({ value, label }) construite a partir de l'embed. */
+export interface SelectOption {
+    value: string
+    label: string
+}
+
+/** Option de categorie enrichie de son code (compatible CategoryOption des blocs). */
+export interface CategorySelectOption extends SelectOption {
+    code: string
+}
+
+/**
+ * Vue d'une adresse pour la consultation : le brouillon + ses options de select
+ * construites a partir de l'embed (sites/categories propres a CETTE adresse).
+ */
+export interface AddressView {
+    draft: AddressFormDraft
+    siteOptions: SelectOption[]
+    categoryOptions: CategorySelectOption[]
+}
+
+/** Extrait l'IRI d'une relation (objet embarque, IRI nu, ou null si absente). */
+export function iriOf(relation: Relation): string | null {
+    if (relation === null || relation === undefined) {
+        return null
+    }
+    if (typeof relation === 'string') {
+        return relation
+    }
+    return relation['@id'] ?? null
+}
+
+/**
+ * Resout la relation Distributeur/Courtier (RG-1.03 : mutuellement exclusives).
+ * Le nom est lu sur l'objet embarque (`companyName`) ; null si la relation est
+ * un IRI nu ou absente.
+ */
+export function relationOf(client: ClientDetail): ClientRelation {
+    const nameOf = (rel: RelatedClientRead | string | null | undefined): string | null =>
+        rel && typeof rel === 'object' ? (rel.companyName ?? null) : null
+
+    if (client.distributor) {
+        return { type: 'distributeur', name: nameOf(client.distributor) }
+    }
+    if (client.broker) {
+        return { type: 'courtier', name: nameOf(client.broker) }
+    }
+    return { type: null, name: null }
+}
+
+/** Mappe un contact embarque vers un brouillon (telephones formates XX XX XX XX XX). */
+export function mapContactToDraft(contact: ContactRead): ContactFormDraft {
+    const phoneSecondary = contact.phoneSecondary ?? null
+    return {
+        id: contact.id,
+        iri: contact['@id'] ?? null,
+        firstName: contact.firstName ?? null,
+        lastName: contact.lastName ?? null,
+        jobTitle: contact.jobTitle ?? null,
+        phonePrimary: contact.phonePrimary ? formatPhoneFR(contact.phonePrimary) : null,
+        phoneSecondary: phoneSecondary ? formatPhoneFR(phoneSecondary) : null,
+        email: contact.email ?? null,
+        hasSecondaryPhone: phoneSecondary !== null && phoneSecondary !== '',
+    }
+}
+
+/** Mappe une adresse embarquee vers un brouillon (IRI extraits des sous-collections). */
+export function mapAddressToDraft(address: AddressRead): AddressFormDraft {
+    return {
+        id: address.id,
+        isProspect: address.isProspect ?? false,
+        isDelivery: address.isDelivery ?? false,
+        isBilling: address.isBilling ?? false,
+        isBroker: address.isBroker ?? false,
+        isDistributor: address.isDistributor ?? false,
+        country: address.country ?? 'France',
+        postalCode: address.postalCode ?? null,
+        city: address.city ?? null,
+        street: address.street ?? null,
+        streetComplement: address.streetComplement ?? null,
+        categoryIris: (address.categories ?? []).map(c => c['@id']),
+        siteIris: (address.sites ?? []).map(s => s['@id']),
+        contactIris: (address.contacts ?? []).map(c => (typeof c === 'string' ? c : c['@id'])),
+        billingEmail: address.billingEmail ?? null,
+        billingEmailSecondary: address.billingEmailSecondary ?? null,
+        hasSecondaryBillingEmail: (address.billingEmailSecondary ?? null) !== null && address.billingEmailSecondary !== '',
+    }
+}
+
+/** Mappe un RIB embarque vers un brouillon. */
+export function mapRibToDraft(rib: RibRead): RibFormDraft {
+    return {
+        id: rib.id,
+        label: rib.label ?? null,
+        bic: rib.bic ?? null,
+        iban: rib.iban ?? null,
+    }
+}
+
+/** Mappe les champs comptables du client (scalaires + IRI des referentiels). */
+export function mapAccountingDraft(client: ClientDetail): AccountingDraft {
+    return {
+        siren: client.siren ?? null,
+        accountNumber: client.accountNumber ?? null,
+        nTva: client.nTva ?? null,
+        tvaModeIri: iriOf(client.tvaMode),
+        paymentDelayIri: iriOf(client.paymentDelay),
+        paymentTypeIri: iriOf(client.paymentType),
+        bankIri: iriOf(client.bank),
+    }
+}
+
+/**
+ * Options de categories (value=IRI, label=nom, code) construites depuis l'embed.
+ * Source role-independante : evite de dependre de `GET /categories` (403 pour les
+ * roles metier non-admin), qui laisserait les libelles vides.
+ */
+export function categoryOptionsOf(categories: CategoryRead[] | undefined): CategorySelectOption[] {
+    return (categories ?? []).map(c => ({
+        value: c['@id'],
+        label: c.name ?? c.code ?? c['@id'],
+        code: c.code ?? '',
+    }))
+}
+
+/** Options de sites (value=IRI, label=nom) construites depuis l'embed d'une adresse. */
+export function siteOptionsOf(sites: SiteRead[] | undefined): SelectOption[] {
+    return (sites ?? []).map(s => ({ value: s['@id'], label: s.name ?? s['@id'] }))
+}
+
+/** Options de contacts (value=IRI, label=nom complet ou email) depuis l'embed client. */
+export function contactOptionsOf(contacts: ContactRead[] | undefined): SelectOption[] {
+    return (contacts ?? []).map(c => ({
+        value: c['@id'],
+        label: [c.firstName, c.lastName].filter(Boolean).join(' ') || (c.email ?? c['@id']),
+    }))
+}
+
+/**
+ * Liste a une seule option (ou vide) construite depuis un referentiel embarque
+ * (TvaMode / PaymentDelay / PaymentType / Bank) pour alimenter un MalioSelect en
+ * lecture seule. Le libelle vient de l'embed (`label` ou `name`), jamais d'un
+ * `GET` de referentiel — l'affichage reste correct quel que soit le role.
+ */
+export function referentialOptionOf(relation: Relation): SelectOption[] {
+    if (!relation || typeof relation === 'string') {
+        return []
+    }
+    const label = (relation.label as string | undefined)
+        ?? (relation.name as string | undefined)
+        ?? relation['@id']
+    return [{ value: relation['@id'], label }]
+}
+
+/**
+ * Code metier d'un referentiel embarque (ex: PaymentType.code = 'LCR' / 'VIREMENT'),
+ * ou null si la relation est absente / serialisee en IRI nu. Type-safe : la branche
+ * chaine (IRI nu) et l'absence sont court-circuitees avant l'acces au code. Sert a
+ * conditionner l'affichage selon le type de reglement courant (ERP-121 : RIB masques
+ * hors-LCR en consultation).
+ */
+export function paymentTypeCodeOf(relation: Relation): string | null {
+    if (!relation || typeof relation === 'string') {
+        return null
+    }
+
+    return (relation.code as string | undefined) ?? null
+}
+
+/** Vue d'une adresse (brouillon + options de select propres a l'adresse). */
+export function mapAddressView(address: AddressRead): AddressView {
+    return {
+        draft: mapAddressToDraft(address),
+        siteOptions: siteOptionsOf(address.sites),
+        categoryOptions: categoryOptionsOf(address.categories),
+    }
+}
+
+/**
+ * Bouton « Modifier » : visible si l'utilisateur peut editer au moins un onglet
+ * — `manage` (formulaire/onglets metier) OU `accounting.manage` (le role Compta
+ * doit pouvoir ouvrir l'edition pour son onglet Comptabilite). Le readonly fin
+ * par onglet est gere sur l'ecran d'edition (1.12).
+ */
+export function canEditClient(canAny: (codes: string[]) => boolean): boolean {
+    return canAny(['commercial.clients.manage', 'commercial.clients.accounting.manage'])
+}
+
+/** Bouton « Archiver » : permission archive ET client encore actif. */
+export function showArchiveAction(can: (code: string) => boolean, isArchived: boolean): boolean {
+    return can('commercial.clients.archive') && !isArchived
+}
+
+/** Bouton « Restaurer » : permission archive ET client deja archive. */
+export function showRestoreAction(can: (code: string) => boolean, isArchived: boolean): boolean {
+    return can('commercial.clients.archive') && isArchived
+}
@@ -0,0 +1,301 @@
+/**
+ * Helpers purs de l'ecran « Modification client » (M1 Commercial, 1.12).
+ *
+ * Deux responsabilites, toutes deux testables unitairement (cf. clientEdit.spec.ts) :
+ *  1. Pre-remplissage : mapper le payload `GET /api/clients/{id}` (embed
+ *     contacts/adresses/ribs + scalaires) vers les brouillons « plats » edites
+ *     par la page et les blocs reutilisables (mappers contacts/adresses/ribs/
+ *     comptabilite reutilises depuis clientConsultation).
+ *  2. Scoping STRICT des payloads PATCH (mode strict RG-1.28 / ERP-74) : chaque
+ *     onglet n'envoie QUE les champs de SON groupe de serialisation, jamais un
+ *     payload mixte — un champ hors-permission = 403 sur l'integralite cote back.
+ *
+ * Ces helpers ne touchent ni a l'API ni a l'etat reactif.
+ *
+ * NOTE : l'onglet Information est facultatif pour tous les roles (RG-1.04
+ * « Information obligatoire pour la Commerciale » retiree cote back).
+ */
+
+import {
+    iriOf,
+    relationOf,
+    type ClientDetail,
+} from '~/modules/commercial/utils/forms/clientConsultation'
+import {
+    ADDRESS_REQUIRED_NON_NULLABLE_KEYS,
+    blankEmptyRequired,
+    MAIN_REQUIRED_NON_NULLABLE_KEYS,
+    omitEmptyRequired,
+    RIB_REQUIRED_NON_NULLABLE_KEYS,
+} from '~/modules/commercial/utils/forms/clientFormRules'
+import type { AddressFormDraft, ContactFormDraft, RibFormDraft } from '~/modules/commercial/types/clientForm'
+
+/**
+ * Etat « plat » du bloc principal (groupe client:write:main). Distinct des
+ * brouillons Contact : ces champs vivent sur le Client lui-meme (companyName,
+ * categories, relation, triage), pas sur une sous-ressource ClientContact. Les
+ * coordonnees de contact (nom, prenom, telephones, email) ne sont plus portees
+ * par le Client : elles vivent exclusivement dans l'onglet Contacts.
+ */
+export interface MainFormDraft {
+    companyName: string | null
+    /** IRI des categories rattachees (M2M). */
+    categoryIris: string[]
+    relationType: 'distributeur' | 'courtier' | null
+    distributorIri: string | null
+    brokerIri: string | null
+    triageService: boolean
+}
+
+/** Etat « plat » de l'onglet Information (groupe client:write:information). */
+export interface InformationFormDraft {
+    description: string | null
+    competitors: string | null
+    /** Date de creation de l'entreprise au format YYYY-MM-DD (MalioDate). */
+    foundedAt: string | null
+    /**
+     * Saisie brute invalide remontee par MalioDate (`@update:rawValue`) : '' tant
+     * que la saisie est valide/vide, sinon le texte tel que tape. On l'envoie au
+     * back en priorite sur `foundedAt` pour que la 422 (validation autoritaire du
+     * format, ERP-101) porte sur le champ et s'affiche inline. Cf. MUI-44.
+     */
+    foundedAtRaw: string
+    /** Nombre de salaries en chaine (saisie masquee), converti en number au PATCH. */
+    employeesCount: string | null
+    revenueAmount: string | null
+    profitAmount: string | null
+    directorName: string | null
+}
+
+/** Etat « plat » de l'onglet Comptabilite (groupe client:write:accounting). */
+export interface AccountingFormDraft {
+    siren: string | null
+    accountNumber: string | null
+    nTva: string | null
+    tvaModeIri: string | null
+    paymentDelayIri: string | null
+    paymentTypeIri: string | null
+    bankIri: string | null
+}
+
+/** Permissions de l'utilisateur courant pertinentes pour l'edition d'un client. */
+export interface ClientEditAbilities {
+    /** `commercial.clients.manage` : bloc principal + onglets metier. */
+    canManage: boolean
+    /** `commercial.clients.accounting.view` : visibilite de l'onglet Comptabilite. */
+    canAccountingView: boolean
+    /** `commercial.clients.accounting.manage` : edition de l'onglet Comptabilite. */
+    canAccountingManage: boolean
+}
+
+/** Editabilite resolue par zone d'onglet (deduite des permissions). */
+export interface TabEditability {
+    /** Bloc principal + onglets Information / Contact / Adresse editables. */
+    businessEditable: boolean
+    /** Onglet Comptabilite present (affiche). */
+    accountingVisible: boolean
+    /** Onglet Comptabilite editable. */
+    accountingEditable: boolean
+}
+
+// ── Pre-remplissage (GET detail -> brouillons) ──────────────────────────────
+
+/**
+ * Mappe le detail client vers le brouillon du bloc principal. La relation
+ * Distributeur/Courtier est resolue par exclusivite (RG-1.03) et son IRI extrait
+ * de l'embed.
+ */
+export function mapMainDraft(client: ClientDetail): MainFormDraft {
+    const relation = relationOf(client)
+
+    return {
+        companyName: client.companyName ?? null,
+        categoryIris: (client.categories ?? []).map(c => c['@id']),
+        relationType: relation.type,
+        distributorIri: iriOf(client.distributor),
+        brokerIri: iriOf(client.broker),
+        triageService: client.triageService === true,
+    }
+}
+
+/** Mappe le detail client vers le brouillon de l'onglet Information. */
+export function mapInformationDraft(client: ClientDetail): InformationFormDraft {
+    return {
+        description: client.description ?? null,
+        competitors: client.competitors ?? null,
+        // MalioDate attend strictement YYYY-MM-DD : on tronque l'ISO datetime.
+        foundedAt: client.foundedAt ? client.foundedAt.slice(0, 10) : null,
+        // Aucune saisie brute invalide au chargement (la valeur stockee est valide).
+        foundedAtRaw: '',
+        employeesCount: client.employeesCount != null ? String(client.employeesCount) : null,
+        revenueAmount: client.revenueAmount ?? null,
+        profitAmount: client.profitAmount ?? null,
+        directorName: client.directorName ?? null,
+    }
+}
+
+/** Mappe les champs comptables du detail vers le brouillon de l'onglet (scalaires + IRI). */
+export function mapAccountingFormDraft(client: ClientDetail): AccountingFormDraft {
+    return {
+        siren: client.siren ?? null,
+        accountNumber: client.accountNumber ?? null,
+        nTva: client.nTva ?? null,
+        tvaModeIri: iriOf(client.tvaMode),
+        paymentDelayIri: iriOf(client.paymentDelay),
+        paymentTypeIri: iriOf(client.paymentType),
+        bankIri: iriOf(client.bank),
+    }
+}
+
+// ── Scoping strict des payloads PATCH ────────────────────────────────────────
+
+/**
+ * Options de construction d'un payload d'ecriture.
+ *  - `forUpdate: false` (defaut, CREATION/POST) : champs requis vides OMIS -> 422
+ *    NotBlank (le back ne reçoit pas la cle, la propriete garde son defaut).
+ *  - `forUpdate: true` (EDITION/PATCH d'une ligne existante) : champs requis vides
+ *    envoyes en `''` -> 422 NotBlank (sinon une cle omise laisse la valeur serveur
+ *    inchangee, faux 200 — cf. blankEmptyRequired).
+ */
+export interface BuildPayloadOptions {
+    forUpdate?: boolean
+}
+
+/** Selectionne le finaliseur des champs requis selon création (omit) vs édition (blank). */
+function finalizeRequired<T extends Record<string, unknown>>(
+    payload: T,
+    requiredKeys: readonly string[],
+    options: BuildPayloadOptions,
+): T {
+    return options.forUpdate
+        ? blankEmptyRequired(payload, requiredKeys)
+        : omitEmptyRequired(payload, requiredKeys)
+}
+
+/**
+ * Payload du bloc principal — groupe client:write:main UNIQUEMENT. La relation
+ * Distributeur/Courtier est mutuellement exclusive (RG-1.03) : on ne renseigne
+ * que la FK correspondant au type choisi, l'autre est forcee a null.
+ */
+export function buildMainPayload(main: MainFormDraft, options: BuildPayloadOptions = {}): Record<string, unknown> {
+    // companyName omis si vide -> 422 NotBlank au lieu d'un 400 de type (ERP-119).
+    // relationType : champ transitoire (non persiste cote back) qui porte
+    // l'intention UI « ce client depend d'un distributeur / courtier ». Il sert
+    // a la validation croisee serveur (RG-1.03 bis) : si une relation est choisie,
+    // la FK correspondante devient obligatoire -> 422 sur distributor / broker.
+    // Sans equivalent derivable cote back (FK nullable), c'est la seule facon de
+    // rester sur « on soumet, le back tranche » plutot qu'une garde front-only.
+    return finalizeRequired({
+        companyName: main.companyName,
+        categories: main.categoryIris,
+        relationType: main.relationType,
+        distributor: main.relationType === 'distributeur' ? main.distributorIri : null,
+        broker: main.relationType === 'courtier' ? main.brokerIri : null,
+        triageService: main.triageService,
+    }, MAIN_REQUIRED_NON_NULLABLE_KEYS, options)
+}
+
+/** Payload de l'onglet Information — groupe client:write:information UNIQUEMENT. */
+export function buildInformationPayload(information: InformationFormDraft): Record<string, unknown> {
+    return {
+        description: information.description || null,
+        competitors: information.competitors || null,
+        // Saisie invalide (foundedAtRaw) prioritaire : on l'envoie telle quelle
+        // pour que le back renvoie une 422 sur foundedAt (cf. foundedAtRaw).
+        foundedAt: information.foundedAtRaw || information.foundedAt || null,
+        employeesCount: information.employeesCount ? Number(information.employeesCount) : null,
+        revenueAmount: information.revenueAmount || null,
+        profitAmount: information.profitAmount || null,
+        directorName: information.directorName || null,
+    }
+}
+
+/**
+ * Payload des scalaires de l'onglet Comptabilite — groupe client:write:accounting
+ * UNIQUEMENT (les RIB passent par la sous-ressource /clients/{id}/ribs). La banque
+ * n'a de sens que pour un Virement (RG-1.12) : forcee a null sinon.
+ */
+export function buildAccountingPayload(
+    accounting: AccountingFormDraft,
+    isBankRequired: boolean,
+): Record<string, unknown> {
+    return {
+        siren: accounting.siren || null,
+        accountNumber: accounting.accountNumber || null,
+        tvaMode: accounting.tvaModeIri,
+        nTva: accounting.nTva || null,
+        paymentDelay: accounting.paymentDelayIri,
+        paymentType: accounting.paymentTypeIri,
+        bank: isBankRequired ? accounting.bankIri : null,
+    }
+}
+
+/** Payload d'un contact (sous-ressource client_contact). */
+export function buildContactPayload(contact: ContactFormDraft): Record<string, unknown> {
+    return {
+        firstName: contact.firstName || null,
+        lastName: contact.lastName || null,
+        jobTitle: contact.jobTitle || null,
+        phonePrimary: contact.phonePrimary || null,
+        phoneSecondary: contact.hasSecondaryPhone ? (contact.phoneSecondary || null) : null,
+        email: contact.email || null,
+    }
+}
+
+/** Payload d'une adresse (sous-ressource client_address). */
+export function buildAddressPayload(
+    address: AddressFormDraft,
+    isBillingEmailRequired: boolean,
+    options: BuildPayloadOptions = {},
+): Record<string, unknown> {
+    // postalCode / city / street : omis a la creation, `''` en edition -> 422 NotBlank (ERP-119).
+    return finalizeRequired({
+        isProspect: address.isProspect,
+        isDelivery: address.isDelivery,
+        isBilling: address.isBilling,
+        isBroker: address.isBroker,
+        isDistributor: address.isDistributor,
+        country: address.country,
+        postalCode: address.postalCode || null,
+        city: address.city || null,
+        street: address.street || null,
+        streetComplement: address.streetComplement || null,
+        categories: address.categoryIris,
+        sites: address.siteIris,
+        contacts: address.contactIris,
+        billingEmail: isBillingEmailRequired ? (address.billingEmail || null) : null,
+        billingEmailSecondary: isBillingEmailRequired && address.hasSecondaryBillingEmail ? (address.billingEmailSecondary || null) : null,
+    }, ADDRESS_REQUIRED_NON_NULLABLE_KEYS, options)
+}
+
+/** Payload d'un RIB (sous-ressource client_rib). */
+export function buildRibPayload(rib: RibFormDraft, options: BuildPayloadOptions = {}): Record<string, unknown> {
+    // label / bic / iban : omis a la creation, `''` en edition -> 422 NotBlank au lieu
+    // d'un 400 de type (ou d'un faux 200 PATCH qui garderait l'ancienne valeur). ERP-119.
+    return finalizeRequired({
+        label: rib.label,
+        bic: rib.bic,
+        iban: rib.iban,
+    }, RIB_REQUIRED_NON_NULLABLE_KEYS, options)
+}
+
+// ── Gating par permission ────────────────────────────────────────────────────
+
+/**
+ * Resout l'editabilite par zone a partir des permissions (option 1 ERP-74,
+ * miroir UI du re-gating champ-par-champ du ClientProcessor) :
+ *  - bloc principal + Information/Contact/Adresse : editables ssi `manage` ;
+ *  - Comptabilite : visible ssi `accounting.view`, editable ssi `accounting.manage`.
+ *
+ * Produit le comportement attendu :
+ *  - Admin : tout editable.
+ *  - Bureau / Commerciale (manage, sans accounting) : metier editable, Compta masquee.
+ *  - Compta (accounting seul, sans manage) : metier readonly, Compta editable.
+ */
+export function resolveTabEditability(abilities: ClientEditAbilities): TabEditability {
+    return {
+        businessEditable: abilities.canManage,
+        accountingVisible: abilities.canAccountingView,
+        accountingEditable: abilities.canAccountingManage,
+    }
+}
@@ -0,0 +1,446 @@
+/**
+ * Regles metier pures de l'ecran « Ajouter un client » (M1 Commercial).
+ *
+ * Centralisees ici (hors composant) pour rester testables unitairement et
+ * partagees entre la page de creation et les futurs ecrans d'edition (1.11/1.12).
+ * Ces helpers ne touchent ni a l'API ni a l'etat reactif : ils prennent des
+ * brouillons « plats » et retournent des booleens / nouveaux objets.
+ *
+ * Le back reste la source de verite (les RG sont re-validees serveur) ; ces
+ * regles ne servent qu'au feedback UI immediat (gating de boutons, visibilite).
+ *
+ * NOTE : l'onglet Information est facultatif pour tous les roles. L'ancienne
+ * RG-1.04 (« Information obligatoire pour la Commerciale ») a ete retiree cote
+ * back — rien a miroiter ici.
+ */
+
+/**
+ * Onglets « coquille » (non encore implementes) : frame vide, passage
+ * automatique a l'onglet suivant (decision Tristan 28/05).
+ */
+export const CLIENT_FORM_PLACEHOLDER_TABS = ['transport', 'statistics', 'reports', 'exchanges'] as const
+
+/**
+ * Onglets affiches uniquement en MODIFICATION (selon le role), jamais a la
+ * creation : Statistiques / Rapports / Echanges. A rebrancher dans les ecrans
+ * d'edition (1.11/1.12) via l'option `includeEditOnlyTabs`.
+ */
+export const CLIENT_FORM_EDIT_ONLY_TABS = ['statistics', 'reports', 'exchanges'] as const
+
+/**
+ * Construit l'ordre des onglets du formulaire client.
+ *  - L'onglet Comptabilite n'est present que si l'utilisateur a `accounting.view`
+ *    (Bureau / Commerciale ne le voient pas).
+ *  - Les onglets edit-only (Statistiques / Rapports / Echanges) sont exclus par
+ *    defaut (creation) ; passer `includeEditOnlyTabs: true` pour les afficher en
+ *    modification.
+ * Ordre aligne sur la spec M1 § Ecran « Ajouter un client ».
+ */
+export function buildClientFormTabKeys(
+    canAccountingView: boolean,
+    options: { includeEditOnlyTabs?: boolean } = {},
+): string[] {
+    const keys = ['information', 'contact', 'address', 'transport']
+    if (canAccountingView) {
+        keys.push('accounting')
+    }
+    if (options.includeEditOnlyTabs) {
+        keys.push(...CLIENT_FORM_EDIT_ONLY_TABS)
+    }
+    return keys
+}
+
+/**
+ * Dernier onglet REMPLISSABLE d'un jeu d'onglets : le dernier qui n'est pas un
+ * placeholder (coquille). Role-aware sans regle ad hoc — il suffit de lui passer
+ * les `tabKeys` deja filtres par permission (l'onglet Comptabilite n'y figure que
+ * si accounting.view). Sa validation marque la fin de l'ajout (redirection liste).
+ */
+export function lastFillableTabKey(tabKeys: string[]): string | undefined {
+    return [...tabKeys].reverse().find(
+        key => !(CLIENT_FORM_PLACEHOLDER_TABS as readonly string[]).includes(key),
+    )
+}
+
+/**
+ * Codes de categorie « intermediaire » : un client dont la categorie est
+ * Distributeur ou Courtier n'a ni relation amont (il EST le distributeur /
+ * courtier) ni prestation de triage. Sert a conditionner l'affichage des champs
+ * « Relation » et « Prestation de triage » du formulaire principal.
+ */
+export const DISTRIBUTOR_BROKER_CATEGORY_CODES = ['DISTRIBUTEUR', 'COURTIER'] as const
+
+/**
+ * Vrai des qu'au moins une categorie « ordinaire » (autre que Distributeur /
+ * Courtier) est selectionnee. Les champs « Relation » (depend du distributeur /
+ * courtier) et « Prestation de triage » du formulaire principal sont masques par
+ * defaut et reveles uniquement dans ce cas.
+ */
+export function showsRelationAndTriageFields(selectedCategoryCodes: string[]): boolean {
+    return selectedCategoryCodes.some(
+        code => !(DISTRIBUTOR_BROKER_CATEGORY_CODES as readonly string[]).includes(code),
+    )
+}
+
+/** Sous-ensemble d'un contact necessaire aux regles de nommage (RG-1.05/1.14). */
+export interface ContactDraft {
+    firstName: string | null
+    lastName: string | null
+}
+
+/** Drapeaux d'usage d'une adresse (RG-1.06/07/08/11). */
+export interface AddressFlagsDraft {
+    isProspect: boolean
+    isDelivery: boolean
+    isBilling: boolean
+    /** Adresse Courtier — type autonome exclusif (comme isProspect). */
+    isBroker: boolean
+    /** Adresse Distributeur — type autonome exclusif (comme isProspect). */
+    isDistributor: boolean
+}
+
+/** Vrai si une chaine porte au moins un caractere non-espace. */
+function isFilled(value: string | null | undefined): boolean {
+    return value !== null && value !== undefined && value.trim() !== ''
+}
+
+/**
+ * RG-1.05 : un contact est valide des qu'il porte un nom OU un prenom.
+ */
+export function isContactNamed(contact: ContactDraft): boolean {
+    return isFilled(contact.firstName) || isFilled(contact.lastName)
+}
+
+/**
+ * RG-1.14 : l'onglet Contact ne peut etre finalise que s'il reste au moins un
+ * contact nomme (nom ou prenom).
+ */
+export function hasAtLeastOneValidContact(contacts: ContactDraft[]): boolean {
+    return contacts.some(isContactNamed)
+}
+
+/**
+ * Primitive reutilisable : vrai si TOUTES les valeurs fournies sont vides (null /
+ * undefined / espaces uniquement). Sert a detecter un bloc de collection
+ * totalement vide (amorce non remplie). Un bloc qui porte la moindre donnee
+ * n'est PAS « blank » : il doit etre soumis pour declencher sa 422 inline plutot
+ * que d'etre saute silencieusement.
+ */
+export function isBlankRow(values: (string | null | undefined)[]): boolean {
+    return values.every(value => !isFilled(value))
+}
+
+/** Champs saisissables d'un bloc contact (pour detecter un bloc totalement vide). */
+export interface ContactFillableDraft extends ContactDraft {
+    jobTitle: string | null
+    phonePrimary: string | null
+    phoneSecondary: string | null
+    email: string | null
+}
+
+/**
+ * Vrai si AUCUN champ saisissable du bloc contact n'est rempli. Distingue un bloc
+ * d'amorce vide (a ignorer au submit) d'un bloc partiellement rempli sans nom
+ * (email / telephone / fonction seul) : ce dernier doit etre soumis pour
+ * declencher la 422 RG-1.05 (« prenom ou nom obligatoire ») affichee inline.
+ */
+export function isContactBlank(contact: ContactFillableDraft): boolean {
+    return isBlankRow([
+        contact.firstName,
+        contact.lastName,
+        contact.jobTitle,
+        contact.phonePrimary,
+        contact.phoneSecondary,
+        contact.email,
+    ])
+}
+
+/** Champs saisissables d'un bloc RIB (pour detecter un bloc totalement vide). */
+export interface RibFillableDraft {
+    label: string | null
+    bic: string | null
+    iban: string | null
+}
+
+/**
+ * Vrai si AUCUN champ du bloc RIB n'est rempli. Un RIB partiellement rempli (ex.
+ * IBAN seul) n'est PAS « blank » : il doit etre soumis pour declencher les 422
+ * NotBlank (label / bic / iban) inline plutot que d'etre saute silencieusement.
+ */
+export function isRibBlank(rib: RibFillableDraft): boolean {
+    return isBlankRow([rib.label, rib.bic, rib.iban])
+}
+
+/**
+ * RG-1.13 : un RIB est complet quand ses trois champs sont remplis (label, BIC,
+ * IBAN). Predicat par-bloc partage entre le gating du bouton « + RIB » (le
+ * dernier bloc doit etre complet avant d'en ajouter un autre) et la validation
+ * de l'onglet (au moins un RIB complet si reglement LCR).
+ */
+export function isRibComplete(rib: RibFillableDraft): boolean {
+    return isFilled(rib.label) && isFilled(rib.bic) && isFilled(rib.iban)
+}
+
+/**
+ * RG-1.06/07/08 : une adresse de prospection est exclusive d'une adresse de
+ * livraison/facturation. Prospect n'est selectionnable que si ni Livraison ni
+ * Facturation ne sont coches.
+ */
+export function canSelectProspect(flags: AddressFlagsDraft): boolean {
+    return !flags.isDelivery && !flags.isBilling
+}
+
+/**
+ * RG-1.06/07/08 : Livraison et Facturation ne sont selectionnables que si
+ * Prospect n'est pas coche.
+ */
+export function canSelectDeliveryOrBilling(flags: AddressFlagsDraft): boolean {
+    return !flags.isProspect
+}
+
+/**
+ * Applique l'exclusivite Prospect / (Livraison|Facturation) au changement d'un
+ * drapeau. Cocher Prospect efface Livraison + Facturation ; cocher Livraison ou
+ * Facturation efface Prospect. Decocher n'a aucun effet de bord. Retourne un
+ * nouvel objet (pas de mutation de l'entree).
+ */
+export function applyProspectExclusivity(
+    flags: AddressFlagsDraft,
+    field: keyof AddressFlagsDraft,
+    value: boolean,
+): AddressFlagsDraft {
+    const next: AddressFlagsDraft = { ...flags, [field]: value }
+
+    if (value && field === 'isProspect') {
+        next.isDelivery = false
+        next.isBilling = false
+    }
+    else if (value && (field === 'isDelivery' || field === 'isBilling')) {
+        next.isProspect = false
+    }
+
+    return next
+}
+
+/**
+ * RG-1.11 : l'email de facturation n'est visible/obligatoire que si l'adresse
+ * est une adresse de facturation.
+ */
+export function isBillingEmailRequired(flags: AddressFlagsDraft): boolean {
+    return flags.isBilling
+}
+
+/**
+ * Type d'adresse expose a l'utilisateur (Select unique remplacant les trois
+ * cases a cocher). Sucre purement front : le back continue de recevoir les
+ * drapeaux isProspect / isDelivery / isBilling (aucune RG modifiee). Les seules
+ * combinaisons proposees respectent l'exclusivite Prospect (RG-1.06/07/08).
+ */
+export type AddressType = 'prospect' | 'delivery' | 'billing' | 'delivery_billing' | 'broker' | 'distributor'
+
+/**
+ * Mappe le type d'adresse choisi vers les cinq drapeaux back.
+ * « Adresse + Facturation » = livraison ET facturation sur la meme adresse.
+ * Courtier / Distributeur sont autonomes (un seul drapeau, exclusif du reste).
+ */
+export function addressFlagsFromType(type: AddressType): AddressFlagsDraft {
+    const none: AddressFlagsDraft = {
+        isProspect: false, isDelivery: false, isBilling: false, isBroker: false, isDistributor: false,
+    }
+    switch (type) {
+        case 'prospect':
+            return { ...none, isProspect: true }
+        case 'delivery':
+            return { ...none, isDelivery: true }
+        case 'billing':
+            return { ...none, isBilling: true }
+        case 'delivery_billing':
+            return { ...none, isDelivery: true, isBilling: true }
+        case 'broker':
+            return { ...none, isBroker: true }
+        case 'distributor':
+            return { ...none, isDistributor: true }
+    }
+}
+
+/**
+ * Reconstruit le type d'adresse a partir des drapeaux (consultation / edition
+ * d'une adresse persistee, ou amorce vierge). Retourne null si aucun drapeau
+ * n'est positionne — le Select reste alors a saisir (et bloque la validation).
+ */
+export function addressTypeFromFlags(flags: AddressFlagsDraft): AddressType | null {
+    if (flags.isProspect) return 'prospect'
+    if (flags.isBroker) return 'broker'
+    if (flags.isDistributor) return 'distributor'
+    if (flags.isDelivery && flags.isBilling) return 'delivery_billing'
+    if (flags.isDelivery) return 'delivery'
+    if (flags.isBilling) return 'billing'
+
+    return null
+}
+
+/**
+ * Sous-ensemble d'une adresse necessaire a sa validite par-bloc : drapeaux
+ * d'usage (pour le type + l'email de facturation conditionnel), sites et
+ * categories rattaches, email de facturation.
+ */
+export interface AddressValidityDraft extends AddressFlagsDraft {
+    categoryIris: string[]
+    siteIris: string[]
+    billingEmail: string | null
+}
+
+/**
+ * Validite par-bloc d'une adresse : type renseigne (RG-1.06/07/08), >= 1 site
+ * (RG-1.10), >= 1 categorie, et email de facturation rempli si l'adresse est de
+ * facturation (RG-1.11). Predicat partage entre le gating du bouton « + Adresse »
+ * (le dernier bloc doit etre valide avant d'en ajouter un autre) et la
+ * validation de l'onglet (toutes les adresses valides).
+ */
+export function isAddressValid(address: AddressValidityDraft): boolean {
+    return addressTypeFromFlags(address) !== null
+        && address.siteIris.length >= 1
+        && address.categoryIris.length >= 1
+        && (!isBillingEmailRequired(address) || isFilled(address.billingEmail))
+}
+
+/** Code stable du type de reglement « virement » (cf. PaymentType.code, RG-1.12). */
+const PAYMENT_TYPE_TRANSFER = 'VIREMENT'
+
+/** Code stable du type de reglement « lettre de change » (RG-1.13). */
+const PAYMENT_TYPE_LCR = 'LCR'
+
+/**
+ * RG-1.12 : la banque est obligatoire lorsque le type de reglement est un
+ * virement.
+ */
+export function isBankRequiredForPaymentType(code: string | null | undefined): boolean {
+    return code === PAYMENT_TYPE_TRANSFER
+}
+
+/**
+ * RG-1.13 : au moins un RIB complet est obligatoire lorsque le type de reglement
+ * est une LCR.
+ */
+export function isRibRequiredForPaymentType(code: string | null | undefined): boolean {
+    return code === PAYMENT_TYPE_LCR
+}
+
+/** Champs saisissables de l'onglet Information (tous facultatifs). */
+export interface InformationFieldsDraft {
+    description: string | null
+    competitors: string | null
+    foundedAt: string | null
+    employeesCount: string | null
+    revenueAmount: string | null
+    profitAmount: string | null
+    directorName: string | null
+}
+
+/**
+ * Vrai si au moins un champ de l'onglet Information est rempli. L'onglet est
+ * facultatif (aucun champ obligatoire), mais on n'autorise pas une validation
+ * « a vide » a la creation : sans donnee, rien a enregistrer, l'utilisateur
+ * passe directement a l'onglet Contact. (En edition, vider tous les champs reste
+ * une action legitime : ce gate n'y est pas applique.)
+ */
+export function hasAtLeastOneInformationField(information: InformationFieldsDraft): boolean {
+    return !isBlankRow([
+        information.description,
+        information.competitors,
+        information.foundedAt,
+        information.employeesCount,
+        information.revenueAmount,
+        information.profitAmount,
+        information.directorName,
+    ])
+}
+
+/** Sous-ensemble du brouillon comptable portant les six champs obligatoires. */
+export interface AccountingRequiredDraft {
+    siren: string | null
+    accountNumber: string | null
+    nTva: string | null
+    tvaModeIri: string | null
+    paymentDelayIri: string | null
+    paymentTypeIri: string | null
+}
+
+/**
+ * RG-1.30 : les six champs scalaires de l'onglet Comptabilite sont obligatoires
+ * pour valider l'onglet (SIREN, N de compte, Mode de TVA, N de TVA, Delai de
+ * reglement, Type de reglement). bank / RIB restent conditionnels (RG-1.12 /
+ * RG-1.13) et sont evalues a part. Miroir front du
+ * ClientAccountingCompletenessValidator : meme gate que les onglets Contact /
+ * Adresse (bouton « Valider » desactive tant que l'onglet n'est pas complet).
+ */
+export function hasAllRequiredAccountingFields(accounting: AccountingRequiredDraft): boolean {
+    const filled = (v: string | null): boolean => v !== null && v.trim() !== ''
+
+    return filled(accounting.siren)
+        && filled(accounting.accountNumber)
+        && filled(accounting.nTva)
+        && filled(accounting.tvaModeIri)
+        && filled(accounting.paymentDelayIri)
+        && filled(accounting.paymentTypeIri)
+}
+
+// ── Champs requis adosses a une colonne NON-nullable (ERP-119) ───────────────
+// Ces champs requis (NotBlank back) sont portes par une colonne Doctrine NON
+// nullable. Si le front envoie `null` (champ vide, desormais possible : le bouton
+// « Valider » n'est plus desactive), API Platform rejette la valeur en 400 de TYPE
+// a la deserialisation (« The type of the X attribute must be string, NULL given »)
+// AVANT le Validator -> pas de violation, donc pas d'erreur rouge cote champ.
+// La parade : OMETTRE la cle du payload quand elle est vide. Sans la cle, la
+// propriete garde son defaut null cote entite et #[Assert\NotBlank] se declenche
+// normalement -> 422 avec propertyPath, mappee en rouge sous le champ.
+// (Les champs requis a colonne NULLABLE — contacts, scalaires compta — acceptent
+// deja `null` et renvoient une 422 : inutile de les omettre.)
+export const MAIN_REQUIRED_NON_NULLABLE_KEYS = ['companyName'] as const
+export const ADDRESS_REQUIRED_NON_NULLABLE_KEYS = ['postalCode', 'city', 'street'] as const
+export const RIB_REQUIRED_NON_NULLABLE_KEYS = ['label', 'bic', 'iban'] as const
+
+/**
+ * Retire d'un payload d'ecriture les cles requises laissees vides (null / ''
+ * / undefined), pour laisser le back produire une 422 NotBlank par champ plutot
+ * qu'un 400 de type sur une colonne non-nullable. Mute et retourne le payload.
+ * A n'appliquer QU'aux cles ci-dessus (champs requis a colonne non-nullable).
+ */
+export function omitEmptyRequired<T extends Record<string, unknown>>(
+    payload: T,
+    requiredKeys: readonly string[],
+): T {
+    for (const key of requiredKeys) {
+        const value = payload[key]
+        if (value === null || value === undefined || value === '') {
+            delete payload[key]
+        }
+    }
+
+    return payload
+}
+
+/**
+ * Variante PATCH (edition d'une ligne EXISTANTE) : remplace les cles requises
+ * laissees vides par une chaine vide `''` au lieu de les OMETTRE.
+ *
+ * Pourquoi pas `omitEmptyRequired` en edition : un PATCH a semantique merge — une
+ * cle absente laisse la valeur serveur INCHANGEE. Vider un champ requis puis valider
+ * renverrait alors un 200 trompeur (l'ancienne valeur est conservee). En envoyant
+ * `''` (chaine valide), on evite le 400 de type (« must be string, NULL given ») et
+ * le Validator `NotBlank(trim)` rejette la valeur -> 422 avec propertyPath, mappee
+ * inline sous le champ. Mute et retourne le payload.
+ */
+export function blankEmptyRequired<T extends Record<string, unknown>>(
+    payload: T,
+    requiredKeys: readonly string[],
+): T {
+    for (const key of requiredKeys) {
+        const value = payload[key]
+        if (value === null || value === undefined || value === '') {
+            (payload as Record<string, unknown>)[key] = ''
+        }
+    }
+
+    return payload
+}
@@ -0,0 +1,316 @@
+/**
+ * Helpers purs de l'ecran « Consultation fournisseur » (M2 Commercial, lecture
+ * seule). Miroir de `clientConsultation.ts` (M1), adapte aux differences M2.
+ *
+ * Mappent le payload `GET /api/suppliers/{id}` (relations embarquees, cf. groupe
+ * `supplier:item:read` + `supplier:read:accounting`) vers les brouillons « plats »
+ * partages avec les blocs reutilisables `SupplierContactBlock` / `SupplierAddressBlock`
+ * et l'onglet Comptabilite. Ne touchent ni a l'API ni a l'etat reactif : testables
+ * unitairement (cf. supplierConsultation.spec.ts).
+ *
+ * Rappels de contrat back (verifies sur le JSON reel fige — ERP-92, spec-back § 4.0.bis) :
+ *  - les relations ManyToOne (tvaMode/paymentDelay/paymentType/bank) sont
+ *    serialisees en OBJETS embarques (`{id, code, label}`), pas en IRI nu ;
+ *  - les champs nuls sont OMIS du JSON (skip_null_values) → toujours lire avec `?? null` ;
+ *  - les champs comptables et `ribs` sont TOTALEMENT ABSENTS (cle omise, pas `null`)
+ *    sans permission accounting.view (gate serveur via SupplierReadGroupContextBuilder).
+ *
+ * Differences M2 vs M1 :
+ *  - Adresse via enum `addressType` (PROSPECT/DEPART/RENDU, RG-2.09) — pas de
+ *    drapeaux isProspect/isDelivery/isBilling.
+ *  - Adresse : champs specifiques fournisseur `bennes` (nombre) et `triageProvider`.
+ *    Pas d'email de facturation.
+ *  - Information : champ specifique fournisseur `volumeForecast`.
+ *  - Pas de relation Distributeur/Courtier ni de triage sur le bloc principal.
+ */
+
+import { formatPhoneFR } from '~/shared/utils/phone'
+import {
+    emptyAddress,
+    type SupplierAddressFormDraft,
+    type SupplierAddressType,
+    type SupplierContactFormDraft,
+    type SupplierRibFormDraft,
+} from '~/modules/commercial/types/supplierForm'
+
+/** Reference Hydra embarquee minimale (@id toujours present). */
+export interface HydraRef {
+    '@id': string
+    [key: string]: unknown
+}
+
+/** Une relation peut etre embarquee (objet), un IRI nu (chaine) ou absente. */
+export type Relation = HydraRef | string | null | undefined
+
+/** Site embarque dans une adresse (groupe site:read). */
+export interface SiteRead extends HydraRef {
+    name?: string
+    color?: string
+}
+
+/** Categorie embarquee (groupe category:read). */
+export interface CategoryRead extends HydraRef {
+    code?: string
+    name?: string
+}
+
+/** Contact embarque (groupe supplier_contact:read). */
+export interface ContactRead extends HydraRef {
+    id: number
+    firstName?: string | null
+    lastName?: string | null
+    jobTitle?: string | null
+    phonePrimary?: string | null
+    phoneSecondary?: string | null
+    email?: string | null
+}
+
+/** Adresse embarquee (groupe supplier_address:read). */
+export interface AddressRead extends HydraRef {
+    id: number
+    addressType?: SupplierAddressType | null
+    country?: string | null
+    postalCode?: string | null
+    city?: string | null
+    street?: string | null
+    streetComplement?: string | null
+    bennes?: number | null
+    triageProvider?: boolean
+    sites?: SiteRead[]
+    categories?: CategoryRead[]
+    // L'embed M2M des contacts d'adresse peut etre un objet (partiel) ou un IRI nu.
+    contacts?: Array<HydraRef | string>
+}
+
+/** RIB embarque (groupe supplier:read:accounting, present ssi accounting.view). */
+export interface RibRead extends HydraRef {
+    id: number
+    label?: string | null
+    bic?: string | null
+    iban?: string | null
+}
+
+/**
+ * Detail d'un fournisseur tel que renvoye par `GET /api/suppliers/{id}`. Tous les
+ * champs sont optionnels : skip_null_values cote serveur et gating accounting
+ * peuvent omettre n'importe quelle cle.
+ */
+export interface SupplierDetail extends HydraRef {
+    id: number
+    companyName?: string | null
+    isArchived?: boolean
+    categories?: CategoryRead[]
+    contacts?: ContactRead[]
+    addresses?: AddressRead[]
+    ribs?: RibRead[]
+    // Onglet Information
+    description?: string | null
+    competitors?: string | null
+    foundedAt?: string | null
+    employeesCount?: number | null
+    revenueAmount?: string | null
+    profitAmount?: string | null
+    directorName?: string | null
+    /** Volume previsionnel (entier, specifique fournisseur). */
+    volumeForecast?: number | null
+    // Onglet Comptabilite (present ssi accounting.view)
+    siren?: string | null
+    accountNumber?: string | null
+    nTva?: string | null
+    tvaMode?: Relation
+    paymentDelay?: Relation
+    paymentType?: Relation
+    bank?: Relation
+}
+
+/** Etat « plat » de l'onglet Comptabilite (miroir lecture du formulaire). */
+export interface AccountingDraft {
+    siren: string | null
+    accountNumber: string | null
+    nTva: string | null
+    tvaModeIri: string | null
+    paymentDelayIri: string | null
+    paymentTypeIri: string | null
+    bankIri: string | null
+}
+
+/** Option de select ({ value, label }) construite a partir de l'embed. */
+export interface SelectOption {
+    value: string
+    label: string
+}
+
+/** Option de categorie enrichie de son code (compatible CategoryOption des blocs). */
+export interface CategorySelectOption extends SelectOption {
+    code: string
+}
+
+/**
+ * Vue d'une adresse pour la consultation : le brouillon + ses options de select
+ * construites a partir de l'embed (sites/categories propres a CETTE adresse).
+ */
+export interface AddressView {
+    draft: SupplierAddressFormDraft
+    siteOptions: SelectOption[]
+    categoryOptions: CategorySelectOption[]
+}
+
+/** Extrait l'IRI d'une relation (objet embarque, IRI nu, ou null si absente). */
+export function iriOf(relation: Relation): string | null {
+    if (relation === null || relation === undefined) {
+        return null
+    }
+    if (typeof relation === 'string') {
+        return relation
+    }
+    return relation['@id'] ?? null
+}
+
+/** Mappe un contact embarque vers un brouillon (telephones formates XX XX XX XX XX). */
+export function mapContactToDraft(contact: ContactRead): SupplierContactFormDraft {
+    const phoneSecondary = contact.phoneSecondary ?? null
+    return {
+        id: contact.id,
+        iri: contact['@id'] ?? null,
+        firstName: contact.firstName ?? null,
+        lastName: contact.lastName ?? null,
+        jobTitle: contact.jobTitle ?? null,
+        phonePrimary: contact.phonePrimary ? formatPhoneFR(contact.phonePrimary) : null,
+        phoneSecondary: phoneSecondary ? formatPhoneFR(phoneSecondary) : null,
+        email: contact.email ?? null,
+        hasSecondaryPhone: phoneSecondary !== null && phoneSecondary !== '',
+    }
+}
+
+/**
+ * Mappe une adresse embarquee vers un brouillon (IRI extraits des sous-collections).
+ * `bennes` (entier) est converti en chaine pour MalioInputNumber (defaut « 0 »).
+ */
+export function mapAddressToDraft(address: AddressRead): SupplierAddressFormDraft {
+    return {
+        id: address.id,
+        addressType: address.addressType ?? null,
+        country: address.country ?? 'France',
+        postalCode: address.postalCode ?? null,
+        city: address.city ?? null,
+        street: address.street ?? null,
+        streetComplement: address.streetComplement ?? null,
+        categoryIris: (address.categories ?? []).map(c => c['@id']),
+        siteIris: (address.sites ?? []).map(s => s['@id']),
+        contactIris: (address.contacts ?? []).map(c => (typeof c === 'string' ? c : c['@id'])),
+        bennes: address.bennes != null ? String(address.bennes) : '0',
+        triageProvider: address.triageProvider ?? false,
+    }
+}
+
+/** Mappe un RIB embarque vers un brouillon. */
+export function mapRibToDraft(rib: RibRead): SupplierRibFormDraft {
+    return {
+        id: rib.id,
+        label: rib.label ?? null,
+        bic: rib.bic ?? null,
+        iban: rib.iban ?? null,
+    }
+}
+
+/** Mappe les champs comptables du fournisseur (scalaires + IRI des referentiels). */
+export function mapAccountingDraft(supplier: SupplierDetail): AccountingDraft {
+    return {
+        siren: supplier.siren ?? null,
+        accountNumber: supplier.accountNumber ?? null,
+        nTva: supplier.nTva ?? null,
+        tvaModeIri: iriOf(supplier.tvaMode),
+        paymentDelayIri: iriOf(supplier.paymentDelay),
+        paymentTypeIri: iriOf(supplier.paymentType),
+        bankIri: iriOf(supplier.bank),
+    }
+}
+
+/**
+ * Options de categories (value=IRI, label=nom, code) construites depuis l'embed.
+ * Source role-independante : evite de dependre de `GET /categories` (403 pour les
+ * roles metier non-admin), qui laisserait les libelles vides.
+ */
+export function categoryOptionsOf(categories: CategoryRead[] | undefined): CategorySelectOption[] {
+    return (categories ?? []).map(c => ({
+        value: c['@id'],
+        label: c.name ?? c.code ?? c['@id'],
+        code: c.code ?? '',
+    }))
+}
+
+/** Options de sites (value=IRI, label=nom) construites depuis l'embed d'une adresse. */
+export function siteOptionsOf(sites: SiteRead[] | undefined): SelectOption[] {
+    return (sites ?? []).map(s => ({ value: s['@id'], label: s.name ?? s['@id'] }))
+}
+
+/** Options de contacts (value=IRI, label=nom complet ou email) depuis l'embed fournisseur. */
+export function contactOptionsOf(contacts: ContactRead[] | undefined): SelectOption[] {
+    return (contacts ?? []).map(c => ({
+        value: c['@id'],
+        label: [c.firstName, c.lastName].filter(Boolean).join(' ') || (c.email ?? c['@id']),
+    }))
+}
+
+/**
+ * Liste a une seule option (ou vide) construite depuis un referentiel embarque
+ * (TvaMode / PaymentDelay / PaymentType / Bank) pour alimenter un MalioSelect en
+ * lecture seule. Le libelle vient de l'embed (`label` ou `name`), jamais d'un
+ * `GET` de referentiel — l'affichage reste correct quel que soit le role.
+ */
+export function referentialOptionOf(relation: Relation): SelectOption[] {
+    if (!relation || typeof relation === 'string') {
+        return []
+    }
+    const label = (relation.label as string | undefined)
+        ?? (relation.name as string | undefined)
+        ?? relation['@id']
+    return [{ value: relation['@id'], label }]
+}
+
+/**
+ * Code metier d'un referentiel embarque (ex: PaymentType.code = 'LCR' / 'VIREMENT'),
+ * ou null si la relation est absente / serialisee en IRI nu. Type-safe : la branche
+ * chaine (IRI nu) et l'absence sont court-circuitees avant l'acces au code. Sert a
+ * conditionner l'affichage selon le type de reglement courant (ERP-121 : RIB masques
+ * hors-LCR en consultation).
+ */
+export function paymentTypeCodeOf(relation: Relation): string | null {
+    if (!relation || typeof relation === 'string') {
+        return null
+    }
+
+    return (relation.code as string | undefined) ?? null
+}
+
+/** Vue d'une adresse (brouillon + options de select propres a l'adresse). */
+export function mapAddressView(address: AddressRead): AddressView {
+    return {
+        draft: mapAddressToDraft(address),
+        siteOptions: siteOptionsOf(address.sites),
+        categoryOptions: categoryOptionsOf(address.categories),
+    }
+}
+
+/**
+ * Bouton « Modifier » : visible si l'utilisateur peut editer au moins un onglet
+ * — `manage` (formulaire/onglets metier) OU `accounting.manage` (le role Compta
+ * doit pouvoir ouvrir l'edition pour son onglet Comptabilite). Le readonly fin
+ * par onglet est gere sur l'ecran d'edition (96).
+ */
+export function canEditSupplier(canAny: (codes: string[]) => boolean): boolean {
+    return canAny(['commercial.suppliers.manage', 'commercial.suppliers.accounting.manage'])
+}
+
+/** Bouton « Archiver » : permission archive ET fournisseur encore actif. */
+export function showArchiveAction(can: (code: string) => boolean, isArchived: boolean): boolean {
+    return can('commercial.suppliers.archive') && !isArchived
+}
+
+/** Bouton « Restaurer » : permission archive ET fournisseur deja archive. */
+export function showRestoreAction(can: (code: string) => boolean, isArchived: boolean): boolean {
+    return can('commercial.suppliers.archive') && isArchived
+}
+
+/** Brouillon d'adresse vierge (reexport pour la page : 1 bloc vide si aucune adresse). */
+export { emptyAddress }
@@ -0,0 +1,261 @@
+/**
+ * Helpers purs des ecrans « Ajouter » / « Modifier » un fournisseur (M2
+ * Commercial) — miroir de `clientEdit.ts` (M1). Deux responsabilites, toutes deux
+ * testables unitairement (cf. supplierEdit.spec.ts) :
+ *  1. Pre-remplissage : mapper le payload `GET /api/suppliers/{id}` (embed +
+ *     scalaires) vers les brouillons « plats » edites par la page de modification.
+ *  2. Scoping STRICT des payloads PATCH (mode strict RG-2.16 / ERP-74) : chaque
+ *     onglet n'envoie QUE les champs de SON groupe de serialisation, jamais un
+ *     payload mixte (un champ hors-permission = 403 sur l'integralite cote back).
+ *
+ * Ces helpers ne touchent ni a l'API ni a l'etat reactif.
+ */
+
+import {
+    ADDRESS_REQUIRED_NON_NULLABLE_KEYS,
+    blankEmptyRequired,
+    MAIN_REQUIRED_NON_NULLABLE_KEYS,
+    omitEmptyRequired,
+    RIB_REQUIRED_NON_NULLABLE_KEYS,
+} from '~/modules/commercial/utils/forms/supplierFormRules'
+import { iriOf, type SupplierDetail } from '~/modules/commercial/utils/forms/supplierConsultation'
+import type {
+    SupplierAddressFormDraft,
+    SupplierContactFormDraft,
+    SupplierRibFormDraft,
+} from '~/modules/commercial/types/supplierForm'
+
+/** Etat « plat » du bloc principal (groupe supplier:write:main). */
+export interface MainFormDraft {
+    companyName: string | null
+    /** IRI des categories rattachees (M2M, type FOURNISSEUR). */
+    categoryIris: string[]
+}
+
+/** Etat « plat » de l'onglet Information (groupe supplier:write:information). */
+export interface InformationFormDraft {
+    description: string | null
+    competitors: string | null
+    /** Date de creation de l'entreprise au format YYYY-MM-DD (MalioDate). */
+    foundedAt: string | null
+    /**
+     * Saisie brute invalide remontee par MalioDate (`@update:rawValue`) : '' tant
+     * que la saisie est valide/vide, sinon le texte tel que tape. On l'envoie au
+     * back en priorite sur `foundedAt` pour que la 422 (validation autoritaire du
+     * format, ERP-101) porte sur le champ et s'affiche inline. Cf. MUI-44.
+     */
+    foundedAtRaw: string
+    /** Nombre de salaries en chaine (saisie masquee), converti en number au PATCH. */
+    employeesCount: string | null
+    revenueAmount: string | null
+    profitAmount: string | null
+    directorName: string | null
+    /** Volume previsionnel (entier >= 0, specifique fournisseur) en chaine. */
+    volumeForecast: string | null
+}
+
+/** Etat « plat » de l'onglet Comptabilite (groupe supplier:write:accounting). */
+export interface AccountingFormDraft {
+    siren: string | null
+    accountNumber: string | null
+    nTva: string | null
+    tvaModeIri: string | null
+    paymentDelayIri: string | null
+    paymentTypeIri: string | null
+    bankIri: string | null
+}
+
+/** Permissions de l'utilisateur courant pertinentes pour l'edition d'un fournisseur. */
+export interface SupplierEditAbilities {
+    /** `commercial.suppliers.manage` : bloc principal + onglets metier. */
+    canManage: boolean
+    /** `commercial.suppliers.accounting.view` : visibilite de l'onglet Comptabilite. */
+    canAccountingView: boolean
+    /** `commercial.suppliers.accounting.manage` : edition de l'onglet Comptabilite. */
+    canAccountingManage: boolean
+}
+
+/** Editabilite resolue par zone d'onglet (deduite des permissions). */
+export interface TabEditability {
+    /** Bloc principal + onglets Information / Contacts / Adresses editables. */
+    businessEditable: boolean
+    /** Onglet Comptabilite present (affiche). */
+    accountingVisible: boolean
+    /** Onglet Comptabilite editable. */
+    accountingEditable: boolean
+}
+
+// ── Pre-remplissage (GET detail -> brouillons) ──────────────────────────────
+
+/** Mappe le detail fournisseur vers le brouillon du bloc principal. */
+export function mapMainDraft(supplier: SupplierDetail): MainFormDraft {
+    return {
+        companyName: supplier.companyName ?? null,
+        categoryIris: (supplier.categories ?? []).map(c => c['@id']),
+    }
+}
+
+/** Mappe le detail fournisseur vers le brouillon de l'onglet Information. */
+export function mapInformationDraft(supplier: SupplierDetail): InformationFormDraft {
+    return {
+        description: supplier.description ?? null,
+        competitors: supplier.competitors ?? null,
+        // MalioDate attend strictement YYYY-MM-DD : on tronque l'ISO datetime.
+        foundedAt: supplier.foundedAt ? supplier.foundedAt.slice(0, 10) : null,
+        // Aucune saisie brute invalide au chargement (la valeur stockee est valide).
+        foundedAtRaw: '',
+        employeesCount: supplier.employeesCount != null ? String(supplier.employeesCount) : null,
+        revenueAmount: supplier.revenueAmount ?? null,
+        profitAmount: supplier.profitAmount ?? null,
+        directorName: supplier.directorName ?? null,
+        // Volume previsionnel (entier, specifique fournisseur) en chaine pour la saisie.
+        volumeForecast: supplier.volumeForecast != null ? String(supplier.volumeForecast) : null,
+    }
+}
+
+/** Mappe les champs comptables du detail vers le brouillon de l'onglet (scalaires + IRI). */
+export function mapAccountingFormDraft(supplier: SupplierDetail): AccountingFormDraft {
+    return {
+        siren: supplier.siren ?? null,
+        accountNumber: supplier.accountNumber ?? null,
+        nTva: supplier.nTva ?? null,
+        tvaModeIri: iriOf(supplier.tvaMode),
+        paymentDelayIri: iriOf(supplier.paymentDelay),
+        paymentTypeIri: iriOf(supplier.paymentType),
+        bankIri: iriOf(supplier.bank),
+    }
+}
+
+/**
+ * Resout l'editabilite par zone a partir des permissions (option 1 ERP-74,
+ * miroir UI du re-gating champ-par-champ du SupplierProcessor) :
+ *  - bloc principal + Information/Contacts/Adresses : editables ssi `manage` ;
+ *  - Comptabilite : visible ssi `accounting.view`, editable ssi `accounting.manage`.
+ *
+ * Produit le comportement attendu :
+ *  - Admin : tout editable.
+ *  - Bureau / Commerciale (manage, sans accounting) : metier editable, Compta masquee.
+ *  - Compta (accounting seul, sans manage) : metier readonly, Compta editable.
+ */
+export function resolveTabEditability(abilities: SupplierEditAbilities): TabEditability {
+    return {
+        businessEditable: abilities.canManage,
+        accountingVisible: abilities.canAccountingView,
+        accountingEditable: abilities.canAccountingManage,
+    }
+}
+
+// ── Scoping strict des payloads PATCH/POST ──────────────────────────────────
+
+/**
+ * Options de construction d'un payload d'ecriture.
+ *  - `forUpdate: false` (defaut, CREATION/POST) : les champs requis vides sont OMIS
+ *    -> 422 NotBlank a l'insert (le back ne reçoit pas la cle).
+ *  - `forUpdate: true` (EDITION/PATCH d'une ligne existante) : les champs requis
+ *    vides sont envoyes en `''` -> 422 NotBlank (sinon une cle omise laisse la valeur
+ *    serveur inchangee, faux 200 — cf. blankEmptyRequired).
+ */
+export interface BuildPayloadOptions {
+    forUpdate?: boolean
+}
+
+/** Selectionne le finaliseur des champs requis selon création (omit) vs édition (blank). */
+function finalizeRequired<T extends Record<string, unknown>>(
+    payload: T,
+    requiredKeys: readonly string[],
+    options: BuildPayloadOptions,
+): T {
+    return options.forUpdate
+        ? blankEmptyRequired(payload, requiredKeys)
+        : omitEmptyRequired(payload, requiredKeys)
+}
+
+/**
+ * Payload du bloc principal — groupe supplier:write:main UNIQUEMENT.
+ * companyName vide -> 422 NotBlank (omis a la creation, `''` en edition — ERP-119).
+ */
+export function buildMainPayload(main: MainFormDraft, options: BuildPayloadOptions = {}): Record<string, unknown> {
+    return finalizeRequired({
+        companyName: main.companyName,
+        categories: main.categoryIris,
+    }, MAIN_REQUIRED_NON_NULLABLE_KEYS, options)
+}
+
+/** Payload de l'onglet Information — groupe supplier:write:information UNIQUEMENT. */
+export function buildInformationPayload(information: InformationFormDraft): Record<string, unknown> {
+    return {
+        description: information.description || null,
+        competitors: information.competitors || null,
+        // Saisie invalide (foundedAtRaw) prioritaire : on l'envoie telle quelle
+        // pour que le back renvoie une 422 sur foundedAt (cf. foundedAtRaw).
+        foundedAt: information.foundedAtRaw || information.foundedAt || null,
+        employeesCount: information.employeesCount ? Number(information.employeesCount) : null,
+        revenueAmount: information.revenueAmount || null,
+        profitAmount: information.profitAmount || null,
+        directorName: information.directorName || null,
+        volumeForecast: information.volumeForecast ? Number(information.volumeForecast) : null,
+    }
+}
+
+/**
+ * Payload des scalaires de l'onglet Comptabilite — groupe supplier:write:accounting
+ * UNIQUEMENT (les RIB passent par la sous-ressource /suppliers/{id}/ribs). La
+ * banque n'a de sens que pour un Virement (RG-2.07) : forcee a null sinon.
+ */
+export function buildAccountingPayload(
+    accounting: AccountingFormDraft,
+    isBankRequired: boolean,
+): Record<string, unknown> {
+    return {
+        siren: accounting.siren || null,
+        accountNumber: accounting.accountNumber || null,
+        tvaMode: accounting.tvaModeIri,
+        nTva: accounting.nTva || null,
+        paymentDelay: accounting.paymentDelayIri,
+        paymentType: accounting.paymentTypeIri,
+        bank: isBankRequired ? accounting.bankIri : null,
+    }
+}
+
+/** Payload d'un contact (sous-ressource supplier_contact). */
+export function buildContactPayload(contact: SupplierContactFormDraft): Record<string, unknown> {
+    return {
+        firstName: contact.firstName || null,
+        lastName: contact.lastName || null,
+        jobTitle: contact.jobTitle || null,
+        phonePrimary: contact.phonePrimary || null,
+        phoneSecondary: contact.hasSecondaryPhone ? (contact.phoneSecondary || null) : null,
+        email: contact.email || null,
+    }
+}
+
+/**
+ * Payload d'une adresse (sous-ressource supplier_address). postalCode / city /
+ * street omis si vides -> 422 NotBlank (ERP-119). Specifique fournisseur :
+ * `bennes` (entier, 0 par defaut) + `triageProvider` (booleen). Pas d'email de
+ * facturation (difference M1).
+ */
+export function buildAddressPayload(address: SupplierAddressFormDraft, options: BuildPayloadOptions = {}): Record<string, unknown> {
+    return finalizeRequired({
+        addressType: address.addressType,
+        country: address.country,
+        postalCode: address.postalCode || null,
+        city: address.city || null,
+        street: address.street || null,
+        streetComplement: address.streetComplement || null,
+        categories: address.categoryIris,
+        sites: address.siteIris,
+        contacts: address.contactIris,
+        bennes: address.bennes !== null && address.bennes !== '' ? Number(address.bennes) : null,
+        triageProvider: address.triageProvider,
+    }, ADDRESS_REQUIRED_NON_NULLABLE_KEYS, options)
+}
+
+/** Payload d'un RIB (sous-ressource supplier_rib). */
+export function buildRibPayload(rib: SupplierRibFormDraft, options: BuildPayloadOptions = {}): Record<string, unknown> {
+    return finalizeRequired({
+        label: rib.label,
+        bic: rib.bic,
+        iban: rib.iban,
+    }, RIB_REQUIRED_NON_NULLABLE_KEYS, options)
+}
@@ -0,0 +1,244 @@
+/**
+ * Regles metier pures de l'ecran « Ajouter un fournisseur » (M2 Commercial).
+ *
+ * Miroir de `clientFormRules.ts` (M1), centralisees ici (hors composant) pour
+ * rester testables unitairement et partagees entre la creation et les ecrans
+ * d'edition/consultation (95/96). Ces helpers ne touchent ni a l'API ni a l'etat
+ * reactif : ils prennent des brouillons « plats » et retournent des booleens.
+ *
+ * Le back reste la source de verite (les RG sont re-validees serveur, mode
+ * strict) ; ces regles ne servent qu'au feedback UI immediat (gating de boutons).
+ *
+ * Differences M2 vs M1 :
+ *  - Adresse via enum `addressType` (PROSPECT/DEPART/RENDU, RG-2.09) — pas de
+ *    drapeaux ni d'exclusivite a gerer cote front (le radio est exclusif par nature).
+ *  - Pas d'email de facturation, pas de relation Distributeur/Courtier.
+ */
+
+import type { SupplierAddressType } from '~/modules/commercial/types/supplierForm'
+
+/**
+ * Onglets « coquille » (non encore implementes) : frame vide, passage
+ * automatique a l'onglet suivant (aligne M1).
+ */
+export const SUPPLIER_FORM_PLACEHOLDER_TABS = ['transport', 'statistics', 'reports', 'exchanges'] as const
+
+/**
+ * Onglets affiches uniquement en MODIFICATION/CONSULTATION (jamais a la
+ * creation) : Statistiques / Rapports / Echanges. A rebrancher dans les ecrans
+ * 95/96 via l'option `includeEditOnlyTabs`.
+ */
+export const SUPPLIER_FORM_EDIT_ONLY_TABS = ['statistics', 'reports', 'exchanges'] as const
+
+/**
+ * Construit l'ordre des onglets du formulaire fournisseur.
+ *  - L'onglet Comptabilite n'est present que si l'utilisateur a `accounting.view`
+ *    (Bureau / Commerciale ne le voient pas).
+ *  - Les onglets edit-only sont exclus par defaut (creation) ; passer
+ *    `includeEditOnlyTabs: true` pour les afficher en modification/consultation.
+ * Ordre aligne sur la spec M2 § Ecran « Ajouter un fournisseur » (barre 5 onglets).
+ */
+export function buildSupplierFormTabKeys(
+    canAccountingView: boolean,
+    options: { includeEditOnlyTabs?: boolean } = {},
+): string[] {
+    const keys = ['information', 'contacts', 'addresses', 'transport']
+    if (canAccountingView) {
+        keys.push('accounting')
+    }
+    if (options.includeEditOnlyTabs) {
+        keys.push(...SUPPLIER_FORM_EDIT_ONLY_TABS)
+    }
+    return keys
+}
+
+/**
+ * Dernier onglet REMPLISSABLE d'un jeu d'onglets : le dernier qui n'est pas un
+ * placeholder. Role-aware sans regle ad hoc — il suffit de lui passer les
+ * `tabKeys` deja filtres par permission. Sa validation marque la fin de l'ajout.
+ */
+export function lastFillableTabKey(tabKeys: string[]): string | undefined {
+    return [...tabKeys].reverse().find(
+        key => !(SUPPLIER_FORM_PLACEHOLDER_TABS as readonly string[]).includes(key),
+    )
+}
+
+/** Sous-ensemble d'un contact necessaire aux regles de nommage (RG-2.04/2.13). */
+export interface ContactDraft {
+    firstName: string | null
+    lastName: string | null
+}
+
+/** Vrai si une chaine porte au moins un caractere non-espace. */
+function isFilled(value: string | null | undefined): boolean {
+    return value !== null && value !== undefined && value.trim() !== ''
+}
+
+/** RG-2.04 : un contact est valide des qu'il porte un nom OU un prenom. */
+export function isContactNamed(contact: ContactDraft): boolean {
+    return isFilled(contact.firstName) || isFilled(contact.lastName)
+}
+
+/**
+ * RG-2.13 : l'onglet Contacts ne peut etre finalise que s'il reste au moins un
+ * contact nomme (nom ou prenom).
+ */
+export function hasAtLeastOneValidContact(contacts: ContactDraft[]): boolean {
+    return contacts.some(isContactNamed)
+}
+
+/**
+ * Primitive reutilisable : vrai si TOUTES les valeurs fournies sont vides. Sert a
+ * detecter un bloc de collection totalement vide (amorce non remplie). Un bloc qui
+ * porte la moindre donnee n'est PAS « blank » : il doit etre soumis pour declencher
+ * sa 422 inline plutot que d'etre saute silencieusement.
+ */
+export function isBlankRow(values: (string | null | undefined)[]): boolean {
+    return values.every(value => !isFilled(value))
+}
+
+/** Champs saisissables d'un bloc contact (pour detecter un bloc totalement vide). */
+export interface ContactFillableDraft extends ContactDraft {
+    jobTitle: string | null
+    phonePrimary: string | null
+    phoneSecondary: string | null
+    email: string | null
+}
+
+/**
+ * Vrai si AUCUN champ saisissable du bloc contact n'est rempli. Distingue un bloc
+ * d'amorce vide (a ignorer au submit) d'un bloc partiellement rempli sans nom
+ * (email/telephone/fonction seul) : ce dernier doit etre soumis pour declencher la
+ * 422 RG-2.04 affichee inline.
+ */
+export function isContactBlank(contact: ContactFillableDraft): boolean {
+    return isBlankRow([
+        contact.firstName,
+        contact.lastName,
+        contact.jobTitle,
+        contact.phonePrimary,
+        contact.phoneSecondary,
+        contact.email,
+    ])
+}
+
+/** Champs saisissables d'un bloc RIB (pour detecter un bloc totalement vide). */
+export interface RibFillableDraft {
+    label: string | null
+    bic: string | null
+    iban: string | null
+}
+
+/**
+ * Vrai si AUCUN champ du bloc RIB n'est rempli. Un RIB partiellement rempli (ex.
+ * IBAN seul) n'est PAS « blank » : il doit etre soumis pour declencher les 422
+ * NotBlank inline plutot que d'etre saute silencieusement.
+ */
+export function isRibBlank(rib: RibFillableDraft): boolean {
+    return isBlankRow([rib.label, rib.bic, rib.iban])
+}
+
+/**
+ * RG-2.08 : un RIB est complet quand ses trois champs sont remplis (label, BIC,
+ * IBAN). Predicat partage entre le gating du bouton « + RIB » et la validation de
+ * l'onglet (au moins un RIB complet si reglement LCR).
+ */
+export function isRibComplete(rib: RibFillableDraft): boolean {
+    return isFilled(rib.label) && isFilled(rib.bic) && isFilled(rib.iban)
+}
+
+/**
+ * Sous-ensemble d'une adresse necessaire a sa validite par-bloc : type (enum),
+ * sites et categories rattaches.
+ */
+export interface AddressValidityDraft {
+    addressType: SupplierAddressType | null
+    categoryIris: string[]
+    siteIris: string[]
+}
+
+/**
+ * Validite par-bloc d'une adresse : type renseigne (RG-2.09), >= 1 site (RG-2.06)
+ * et >= 1 categorie (RG-2.10). Predicat partage entre le gating du bouton
+ * « + Adresse » (le dernier bloc doit etre valide avant d'en ajouter un autre) et
+ * la validation de l'onglet (toutes les adresses valides). Pas d'email de
+ * facturation cote fournisseur (difference M1).
+ */
+export function isAddressValid(address: AddressValidityDraft): boolean {
+    return address.addressType !== null
+        && address.siteIris.length >= 1
+        && address.categoryIris.length >= 1
+}
+
+/** Code stable du type de reglement « virement » (RG-2.07). */
+const PAYMENT_TYPE_TRANSFER = 'VIREMENT'
+
+/** Code stable du type de reglement « lettre de change » (RG-2.08). */
+const PAYMENT_TYPE_LCR = 'LCR'
+
+/** RG-2.07 : la banque est obligatoire lorsque le type de reglement est un virement. */
+export function isBankRequiredForPaymentType(code: string | null | undefined): boolean {
+    return code === PAYMENT_TYPE_TRANSFER
+}
+
+/** RG-2.08 : au moins un RIB complet est obligatoire lorsque le type de reglement est une LCR. */
+export function isRibRequiredForPaymentType(code: string | null | undefined): boolean {
+    return code === PAYMENT_TYPE_LCR
+}
+
+// ── Champs requis adosses a une colonne NON-nullable (ERP-119) ───────────────
+// Memes contraintes qu'au M1 : un champ requis (NotBlank) porte par une colonne
+// Doctrine NON nullable rejette `null` en 400 de TYPE avant le Validator. Parade :
+// OMETTRE la cle du payload quand elle est vide -> le back produit une 422 NotBlank
+// avec propertyPath, mappee en rouge sous le champ.
+export const MAIN_REQUIRED_NON_NULLABLE_KEYS = ['companyName'] as const
+// addressType : colonne non-nullable + NotBlank cote back. Envoyer `null` (radio
+// non choisi) provoque un 400 de TYPE a la deserialisation AVANT le Validator
+// (« must be string, NULL given ») -> pas de violation, pas d'erreur inline. On
+// omet donc la cle quand elle est vide pour obtenir une 422 NotBlank propertyPath.
+export const ADDRESS_REQUIRED_NON_NULLABLE_KEYS = ['addressType', 'postalCode', 'city', 'street'] as const
+export const RIB_REQUIRED_NON_NULLABLE_KEYS = ['label', 'bic', 'iban'] as const
+
+/**
+ * Retire d'un payload d'ecriture les cles requises laissees vides (null / '' /
+ * undefined), pour laisser le back produire une 422 NotBlank par champ plutot
+ * qu'un 400 de type sur une colonne non-nullable. Mute et retourne le payload.
+ */
+export function omitEmptyRequired<T extends Record<string, unknown>>(
+    payload: T,
+    requiredKeys: readonly string[],
+): T {
+    for (const key of requiredKeys) {
+        const value = payload[key]
+        if (value === null || value === undefined || value === '') {
+            delete payload[key]
+        }
+    }
+
+    return payload
+}
+
+/**
+ * Variante PATCH (edition d'une ligne EXISTANTE) : remplace les cles requises
+ * laissees vides par une chaine vide `''` au lieu de les OMETTRE.
+ *
+ * Pourquoi pas `omitEmptyRequired` en edition : un PATCH a semantique merge — une
+ * cle absente laisse la valeur serveur INCHANGEE. Vider un champ requis puis valider
+ * renverrait alors un 200 trompeur (l'ancienne valeur est conservee). En envoyant
+ * `''`, la propriete `?string` est bien deserialisee (pas de 400 de type, contrairement
+ * a `null` sur une colonne non-nullable), puis le Validator `NotBlank(trim)` la rejette
+ * -> 422 avec propertyPath, mappee inline sous le champ. Mute et retourne le payload.
+ */
+export function blankEmptyRequired<T extends Record<string, unknown>>(
+    payload: T,
+    requiredKeys: readonly string[],
+): T {
+    for (const key of requiredKeys) {
+        const value = payload[key]
+        if (value === null || value === undefined || value === '') {
+            (payload as Record<string, unknown>)[key] = ''
+        }
+    }
+
+    return payload
+}
@@ -9,7 +9,6 @@
                    icon-name="mdi:tune"
                    icon-position="left"
                    icon-size="24"
-                    button-class="w-[184px] justify-start gap-4 text-black"
                    @click="openFilters"
                />
            </template>
@@ -30,7 +29,7 @@
        >
            <template #cell-action="{ item }">
                <span
-                    class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium"
+                    class="inline-flex items-center rounded-full px-2 py-0.5 font-medium"
                    :class="actionBadgeClass(item.action as string)"
                >
                    {{ t(`audit.action.${item.action}`) }}
@@ -38,15 +37,14 @@
            </template>
            <template #cell-entityType="{ item }">
                <span
-                    class="text-xs"
                    :title="item.entityType as string"
                >{{ formatEntityType(item.entityType as string) }}</span>
            </template>
            <template #cell-entityId="{ item }">
-                <span class="font-mono text-xs">{{ item.entityId }}</span>
+                <span>{{ item.entityId }}</span>
            </template>
            <template #cell-summary="{ item }">
-                <span class="text-xs text-gray-600">{{ item.summary }}</span>
+                <span class="text-gray-600">{{ item.summary }}</span>
            </template>
        </MalioDataTable>

@@ -5,6 +5,7 @@
            <template #actions>
                <MalioButton
                    v-if="can('core.roles.manage')"
+                    variant="secondary"
                    :label="t('admin.roles.newRole')"
                    icon-name="mdi:add-bold"
                    icon-position="left"
@@ -28,7 +29,7 @@
            @update:per-page="setItemsPerPage"
        >
            <template #cell-code="{ item }">
-                <span class="font-mono text-xs">{{ item.code }}</span>
+                <span>{{ item.code }}</span>
            </template>
            <template #cell-permissions="{ item }">
                {{ item.permissions }}
@@ -36,7 +37,7 @@
            <template #cell-system="{ item }">
                <span
                    v-if="item.isSystem"
-                    class="inline-flex items-center rounded-full bg-blue-100 px-2.5 py-0.5 text-xs font-medium text-blue-800"
+                    class="inline-flex items-center rounded-full bg-blue-100 px-2.5 py-0.5 font-medium text-blue-800"
                >
                    {{ t('admin.roles.table.system') }}
                </span>
@@ -19,7 +19,7 @@
            <template #cell-admin="{ item }">
                <span
                    v-if="item.admin"
-                    class="inline-flex items-center rounded-full bg-purple-100 px-2.5 py-0.5 text-xs font-medium text-purple-800"
+                    class="inline-flex items-center rounded-full bg-purple-100 px-2.5 py-0.5 font-medium text-purple-800"
                >
                    {{ t('admin.users.table.admin') }}
                </span>
@@ -62,7 +62,7 @@
                    <MalioInputText
                        v-model="form.color"
                        placeholder="#RRGGBB"
-                        input-class="w-full font-mono"
+                        input-class="w-full"
                        required
                    />
                    <!-- pb-4 sur le wrapper : simule le slot message du
@@ -5,6 +5,7 @@
            <template #actions>
                <MalioButton
                    v-if="can('sites.manage')"
+                    variant="secondary"
                    :label="t('admin.sites.newSite')"
                    icon-name="mdi:add-bold"
                    icon-position="left"
@@ -33,11 +34,11 @@
                        :style="{ backgroundColor: item.color }"
                        class="inline-block size-5 rounded-full border border-neutral-200"
                    />
-                    <span class="font-mono text-xs">{{ item.color }}</span>
+                    <span>{{ item.color }}</span>
                </span>
            </template>
            <template #cell-fullAddress="{ item }">
-                <span class="line-clamp-2 text-xs text-neutral-600">
+                <span class="line-clamp-2 text-neutral-600">
                    {{ item.fullAddress }}
                </span>
            </template>
@@ -0,0 +1 @@
+export default defineNuxtConfig({})
@@ -7,7 +7,7 @@
      "name": "starseed-frontend",
      "hasInstallScript": true,
      "dependencies": {
-        "@malio/layer-ui": "^1.7.3",
+        "@malio/layer-ui": "^1.7.10",
        "@nuxt/icon": "^2.2.1",
        "@nuxtjs/i18n": "^10.2.3",
        "@nuxtjs/tailwindcss": "^6.14.0",
@@ -583,20 +583,20 @@
      "license": "MIT"
    },
    "node_modules/@emnapi/core": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz",
-      "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==",
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.11.0.tgz",
+      "integrity": "sha512-l9Oo58x0HOP5znGzVhYW9U3e5wVuA4LAZU2AGezTmkhO1CgQRFDhDg4nneHsu/t3WniXg9QrG2nIXL/ZS8ln8Q==",
      "license": "MIT",
      "optional": true,
      "dependencies": {
-        "@emnapi/wasi-threads": "1.2.1",
+        "@emnapi/wasi-threads": "1.2.2",
        "tslib": "^2.4.0"
      }
    },
    "node_modules/@emnapi/runtime": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
-      "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==",
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.11.0.tgz",
+      "integrity": "sha512-55coeOFKHv1ywEcUXJtWU5f+Jr/W5tZDvZig8DLKSwUN1JpROQ4rk/SNOQiFWmaR/VKF4zuFyW1B8JduOSv6Pg==",
      "license": "MIT",
      "optional": true,
      "dependencies": {
@@ -604,9 +604,9 @@
      }
    },
    "node_modules/@emnapi/wasi-threads": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
-      "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.2.tgz",
+      "integrity": "sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==",
      "license": "MIT",
      "optional": true,
      "dependencies": {
@@ -1866,9 +1866,9 @@
      "license": "MIT"
    },
    "node_modules/@malio/layer-ui": {
-      "version": "1.7.3",
-      "resolved": "https://gitea.malio.fr/api/packages/MALIO-DEV/npm/%40malio%2Flayer-ui/-/1.7.3/layer-ui-1.7.3.tgz",
-      "integrity": "sha512-jw3ka0Az6Jf0F9ifsooknkwXph8TNgoe6H3CjF8tbBxl8oND8HLHjlZ04ooUCoOUEIlsQ1Mm2hFFlQRCB04qdA==",
+      "version": "1.7.10",
+      "resolved": "https://gitea.malio.fr/api/packages/MALIO-DEV/npm/%40malio%2Flayer-ui/-/1.7.10/layer-ui-1.7.10.tgz",
+      "integrity": "sha512-ZWYaKvl+VpGAqeTE+4xdyKOmuRd4zwjlUYVppeIBZwGeNAK16kZnrztR+4eQmnzUqPZVybBhEBdKP9weqWHSUg==",
      "dependencies": {
        "@nuxt/icon": "^2.2.1",
        "@nuxtjs/tailwindcss": "^6.14.0",
@@ -17,7 +17,7 @@
    "test:e2e:ui": "playwright test --ui"
  },
  "dependencies": {
-    "@malio/layer-ui": "^1.7.3",
+    "@malio/layer-ui": "^1.7.10",
    "@nuxt/icon": "^2.2.1",
    "@nuxtjs/i18n": "^10.2.3",
    "@nuxtjs/tailwindcss": "^6.14.0",
@@ -23,7 +23,7 @@
                </thead>
                <tbody>
                    <tr v-for="(diff, field) in updateDiff" :key="field" class="border-t border-gray-200">
-                        <td class="px-2 py-1 font-mono">{{ field }}</td>
+                        <td class="px-2 py-1">{{ field }}</td>
                        <td class="px-2 py-1 text-red-700">{{ formatValue(diff.old) }}</td>
                        <td class="px-2 py-1 text-green-700">{{ formatValue(diff.new) }}</td>
                    </tr>
@@ -31,7 +31,7 @@
                         { added: [ids], removed: [ids] } → affiche + et - sur
                         la meme ligne pour garder une colonne field unique. -->
                    <tr v-for="(diff, field) in collectionDiff" :key="`col-${field}`" class="border-t border-gray-200">
-                        <td class="px-2 py-1 font-mono">{{ field }}</td>
+                        <td class="px-2 py-1">{{ field }}</td>
                        <td class="px-2 py-1 text-red-700">
                            <span v-if="diff.removed.length">− {{ diff.removed.join(', ') }}</span>
                            <span v-else class="text-gray-400">∅</span>
@@ -47,7 +47,7 @@

        <div v-else class="space-y-1">
            <div v-for="(value, key) in entry.changes" :key="key" class="flex gap-2">
-                <span class="font-mono text-xs text-gray-600">{{ key }}:</span>
+                <span class="text-xs text-gray-600">{{ key }}:</span>
                <span class="text-xs">{{ formatValue(value) }}</span>
            </div>
        </div>
@@ -0,0 +1,51 @@
+<template>
+    <!--
+        Placeholder generique « En cours de dev » pour les ecrans / onglets non
+        encore implementes. Composant PARTAGE (shared/components) : auto-importe
+        sans prefixe (`<ComingSoonPlaceholder>`) et reutilisable depuis n'importe
+        quel module. Affiche un gif (asset local par defaut) + un message i18n.
+    -->
+    <div class="flex min-h-[240px] flex-col items-center justify-center gap-4 rounded-md bg-white py-10">
+        <img
+            v-if="!imageFailed"
+            :src="src"
+            :alt="resolvedTitle"
+            class="max-h-[220px] w-auto rounded-md"
+            @error="imageFailed = true"
+        >
+        <!-- Repli si le gif ne charge pas (offline, CSP, asset absent) :
+             illustration emoji, le message reste affiche. -->
+        <div v-else class="text-5xl" aria-hidden="true">🚧 👨‍💻 🚧</div>
+
+        <div class="text-center">
+            <p class="text-xl font-bold text-black">{{ resolvedTitle }}</p>
+            <p class="mt-1 text-black/60">{{ resolvedSubtitle }}</p>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+const props = withDefaults(
+    defineProps<{
+        /** Source de l'image/gif affichee. Defaut : asset local `/coming-soon.gif`. */
+        src?: string
+        /** Titre. Defaut : i18n `common.comingSoon.title`. */
+        title?: string
+        /** Sous-titre. Defaut : i18n `common.comingSoon.subtitle`. */
+        subtitle?: string
+    }>(),
+    {
+        src: '/coming-soon.gif',
+        title: '',
+        subtitle: '',
+    },
+)
+
+const { t } = useI18n()
+const imageFailed = ref(false)
+
+// Les props priment sur les libelles i18n par defaut (permet a un module
+// d'override le texte sans toucher au composant).
+const resolvedTitle = computed(() => props.title || t('common.comingSoon.title'))
+const resolvedSubtitle = computed(() => props.subtitle || t('common.comingSoon.subtitle'))
+</script>
--- a/Show More
+++ b/Show More