feat : ERP-196 — refonte des blocs de formulaire (contact, adresse, compta) (#145)

## ERP-196 — Refonte des blocs de formulaire

Refonte visuelle des blocs répétables des formulaires (clients, fournisseurs, prestataires, transporteurs), alignée sur les blocs « ticket de pesée » : à plat (sans box-shadow), titre de bloc en noir, séparation par filet noir 1px.

### ✅ Blocs Contact
- Box-shadow / fond blanc / padding latéral retirés
- En-tête `flex justify-between` : titre noir (« Contact 1 »…) à gauche, poubelle `button-class="p-0"` à droite
- 4 colonnes, filet `border-b border-black` entre blocs (pas sous le dernier, prop `last`)
- i18n `contact.title` ajouté pour transporteurs / prestataires
- 9 pages câblées (new / edit / consultation des 4 répertoires)

### ✅ Blocs Adresse
- Même traitement (à plat, titre noir, filet sauf dernier)
- i18n `address.title` pour transporteurs / prestataires
- Transporteur : adresse unique → titre « Adresse » (sans numéro)
- 12 pages câblées

### ✅ Bloc Comptabilité
- Bloc **infos** : titre « Informations » + filet bas (uniquement si des RIB suivent)
- Blocs **RIB** : titre « RIB 1 / RIB 2… » + poubelle `p-0`, filet sauf le dernier
- i18n `accounting.infoTitle` (3 modules) + `accounting.ribTitle` (fournisseurs / prestataires)
- 9 pages câblées (clients / fournisseurs / prestataires)

### Vérifications
- Vitest : 44/44 (specs contact + adresse)
- Eslint : clean sur l'ensemble des composants et pages modifiés

### Commits
- `feat : refonte des blocs contact (ERP-196)`
- `feat : refonte des blocs adresse (ERP-196)`
- `feat : refonte du bloc comptabilité (ERP-196)`

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

frontend/modules/technique/components/ProviderContactBlock.vue

@@ -1,84 +1,93 @@
 <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) ou en lecture seule. -->
-        <MalioButtonIcon
-            v-if="removable && !readonly && !disabled"
-            icon="mdi:delete-outline"
-            variant="ghost"
-            button-class="absolute top-3 right-3"
-            v-bind="{ ariaLabel: t('technique.providers.form.contact.remove') }"
-            @click="$emit('remove')"
-        />
-
-        <MalioInputText
-            v-if="!hideEmpty || isFilled(model.lastName)"
-            :model-value="model.lastName"
-            :label="t('technique.providers.form.contact.lastName')"
-            :mask="PERSON_NAME_MASK"
-            :readonly="readonly"
-            :disabled="disabled"
-            :error="errors?.lastName"
-            @update:model-value="(v: string) => update('lastName', v)"
-        />
-        <MalioInputText
-            v-if="!hideEmpty || isFilled(model.firstName)"
-            :model-value="model.firstName"
-            :label="t('technique.providers.form.contact.firstName')"
-            :mask="PERSON_NAME_MASK"
-            :readonly="readonly"
-            :disabled="disabled"
-            :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 v-if="!hideEmpty || isFilled(model.jobTitle)" class="col-span-2">
-            <MalioInputText
-                :model-value="model.jobTitle"
-                :label="t('technique.providers.form.contact.jobTitle')"
-                :mask="FREE_TEXT_MASK"
-                :readonly="readonly"
-                :disabled="disabled"
-                :error="errors?.jobTitle"
-                @update:model-value="(v: string) => update('jobTitle', v)"
+    <!-- Bloc a plat (sans box-shadow) : un filet noir 1px le separe du suivant
+         (pas de bordure sous le dernier bloc). -->
+    <div class="pb-[20px]" :class="{ 'border-b border-black': !last }">
+        <!-- En-tete : titre du bloc (noir) a gauche, poubelle de suppression a droite. -->
+        <div class="flex items-center justify-between">
+            <h2 class="text-[20px] font-semibold text-black">{{ title }}</h2>
+            <!-- Suppression : ouvre une modal de confirmation cote parent. Masquee si
+                 non supprimable (1er bloc) ou en lecture seule. -->
+            <MalioButtonIcon
+                v-if="removable && !readonly && !disabled"
+                icon="mdi:delete-outline"
+                variant="ghost"
+                button-class="p-0"
+                v-bind="{ ariaLabel: t('technique.providers.form.contact.remove') }"
+                @click="$emit('remove')"
+            />
+        </div>
+
+        <!-- Grille 4 colonnes des champs du contact. -->
+        <div class="mt-6 grid grid-cols-4 gap-x-[44px] gap-y-4">
+            <MalioInputText
+                v-if="!hideEmpty || isFilled(model.lastName)"
+                :model-value="model.lastName"
+                :label="t('technique.providers.form.contact.lastName')"
+                :mask="PERSON_NAME_MASK"
+                :readonly="readonly"
+                :disabled="disabled"
+                :error="errors?.lastName"
+                @update:model-value="(v: string) => update('lastName', v)"
+            />
+            <MalioInputText
+                v-if="!hideEmpty || isFilled(model.firstName)"
+                :model-value="model.firstName"
+                :label="t('technique.providers.form.contact.firstName')"
+                :mask="PERSON_NAME_MASK"
+                :readonly="readonly"
+                :disabled="disabled"
+                :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 v-if="!hideEmpty || isFilled(model.jobTitle)" class="col-span-2">
+                <MalioInputText
+                    :model-value="model.jobTitle"
+                    :label="t('technique.providers.form.contact.jobTitle')"
+                    :mask="FREE_TEXT_MASK"
+                    :readonly="readonly"
+                    :disabled="disabled"
+                    :error="errors?.jobTitle"
+                    @update:model-value="(v: string) => update('jobTitle', v)"
+                />
+            </div>
+            <MalioInputEmail
+                v-if="!hideEmpty || isFilled(model.email)"
+                :model-value="model.email"
+                :label="t('technique.providers.form.contact.email')"
+                :readonly="readonly"
+                :disabled="disabled"
+                :lowercase="true"
+                :error="errors?.email"
+                @update:model-value="(v: string) => update('email', v)"
+            />
+            <MalioInputPhone
+                v-if="!hideEmpty || isFilled(model.phonePrimary)"
+                :model-value="model.phonePrimary"
+                :label="t('technique.providers.form.contact.phonePrimary')"
+                :mask="PHONE_MASK"
+                :readonly="readonly"
+                :disabled="disabled"
+                :error="errors?.phonePrimary"
+                :addable="!model.hasSecondaryPhone && !readonly"
+                :add-button-label="t('technique.providers.form.contact.addPhone')"
+                @update:model-value="(v: string) => update('phonePrimary', v)"
+                @add="revealSecondaryPhone"
+            />
+            <!-- 2e numero : revele a la demande (max 2 telephones par contact). -->
+            <MalioInputPhone
+                v-if="model.hasSecondaryPhone && (!hideEmpty || isFilled(model.phoneSecondary))"
+                :model-value="model.phoneSecondary"
+                :label="t('technique.providers.form.contact.phoneSecondary')"
+                :mask="PHONE_MASK"
+                :readonly="readonly"
+                :disabled="disabled"
+                :error="errors?.phoneSecondary"
+                @update:model-value="(v: string) => update('phoneSecondary', v)"
             />
         </div>
-        <MalioInputEmail
-            v-if="!hideEmpty || isFilled(model.email)"
-            :model-value="model.email"
-            :label="t('technique.providers.form.contact.email')"
-            :readonly="readonly"
-            :disabled="disabled"
-            :lowercase="true"
-            :error="errors?.email"
-            @update:model-value="(v: string) => update('email', v)"
-        />
-        <MalioInputPhone
-            v-if="!hideEmpty || isFilled(model.phonePrimary)"
-            :model-value="model.phonePrimary"
-            :label="t('technique.providers.form.contact.phonePrimary')"
-            :mask="PHONE_MASK"
-            :readonly="readonly"
-            :disabled="disabled"
-            :error="errors?.phonePrimary"
-            :addable="!model.hasSecondaryPhone && !readonly"
-            :add-button-label="t('technique.providers.form.contact.addPhone')"
-            @update:model-value="(v: string) => update('phonePrimary', v)"
-            @add="revealSecondaryPhone"
-        />
-        <!-- 2e numero : revele a la demande (max 2 telephones par contact). -->
-        <MalioInputPhone
-            v-if="model.hasSecondaryPhone && (!hideEmpty || isFilled(model.phoneSecondary))"
-            :model-value="model.phoneSecondary"
-            :label="t('technique.providers.form.contact.phoneSecondary')"
-            :mask="PHONE_MASK"
-            :readonly="readonly"
-            :disabled="disabled"
-            :error="errors?.phoneSecondary"
-            @update:model-value="(v: string) => update('phoneSecondary', v)"
-        />
     </div>
 </template>
 
@@ -93,8 +102,12 @@ const PHONE_MASK = '## ## ## ## ##'
 const props = defineProps<{
     /** Brouillon du contact (v-model). */
     modelValue: ProviderContactFormDraft
+    /** Titre du bloc (ex: « Contact 1 »). */
+    title: string
     /** Affiche l'icone de suppression (1er bloc non supprimable). */
     removable?: boolean
+    /** Dernier bloc de la liste : supprime le filet de separation bas. */
+    last?: boolean
     /** Bloc en lecture seule (onglet valide). */
     readonly?: boolean
     /** Bloc desactive (champs grises, consultation — distinct de readonly). */