feat(front) : util httpExternal + autocomplete adresse BAN (ERP-66) (#52)

## ERP-66 — Utilitaires adresse/téléphone + autocomplétion BAN

### feat
- **httpExternal** : client dédié aux API publiques externes (URL absolue, sans cookie de session, timeout). Seul point d'entrée autorisé pour un `$fetch` externe (règle frontend n°4).
- **useAddressAutocomplete** : implémentation BAN (api-adresse.data.gouv.fr) — recherche ville (`type=municipality`) et adresse, mapping GeoJSON, throw en cas d'erreur/timeout (mode dégradé côté composant). La recherche d'adresse n'impose **pas** `type=housenumber` (sinon 0 résultat tant qu'aucun numéro n'est saisi) — spec-front mise à jour.
- Tests Vitest : httpExternal, useAddressAutocomplete, cas limites `formatPhoneFR`.

### fix
- **ClientAddressBlock** : la rue courante est toujours réinjectée dans les options de `MalioInputAutocomplete` (computed, miroir de `cityOptions`). Corrige le champ Adresse qui se vidait après validation / à l'édition d'une adresse existante (valeur pourtant persistée). Test de montage ajouté.
- **useClientReferentials** : libellé des sites = numéro de département (2 premiers chiffres du code postal, déjà exposé par `/sites`) au lieu du nom.

### Vérifs
- ESLint ✅ · Vitest 196/196 ✅
- Changements 100% frontend (+ doc spec).

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

frontend/modules/commercial/components/ClientAddressBlock.vue

@@ -201,7 +201,8 @@ const model = computed(() => props.modelValue)
 const degraded = ref(false)
 // Villes proposees par la BAN (alimentees a la saisie du code postal).
 const banCityOptions = ref<RefOption[]>([])
-const addressOptions = 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)
@@ -214,6 +215,20 @@ const cityOptions = computed<RefOption[]>(() => {
     }
     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[] = []
@@ -280,7 +295,7 @@ async function onAddressSearch(query: string): Promise<void> {
         const postalCode = (model.value.postalCode ?? '').replace(/\D/g, '') || undefined
         const suggestions = await autocomplete.searchAddress(query, postalCode)
         lastAddressSuggestions = suggestions
-        addressOptions.value = suggestions.map(s => ({ value: s.street, label: s.label }))
+        banAddressOptions.value = suggestions.map(s => ({ value: s.street, label: s.label }))
     }
     catch {
         enterDegraded()

frontend/modules/commercial/components/TabPlaceholderBlank.vue

@@ -1,14 +0,0 @@
-<template>
-    <!--
-        Placeholder des onglets non encore implementes (Transport, Statistiques,
-        Rapports, Echanges). Frame vide blanche : aucun champ, aucun bouton,
-        aucun message « En cours » (decision Tristan 28/05). L'orchestrateur passe
-        automatiquement a l'onglet suivant — ce composant n'est qu'une coquille
-        visuelle reutilisee par 1.11/1.12.
-    -->
-    <div class="min-h-[240px] rounded-md bg-white" />
-</template>
-
-<script setup lang="ts">
-// Composant purement presentationnel : aucune prop, aucun event.
-</script>

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

@@ -0,0 +1,76 @@
+import { describe, it, expect, vi } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { defineComponent, h, ref, computed } from 'vue'
+import { emptyAddress } from '~/modules/commercial/types/clientForm'
+import ClientAddressBlock from '../ClientAddressBlock.vue'
+
+// Le composable BAN est mocke : aucun appel reseau, aucune suggestion chargee.
+// On reproduit ainsi l'etat « adresse persistee, mais liste de suggestions
+// vide » (remontage apres validation / edition d'une adresse existante).
+vi.mock('~/shared/composables/useAddressAutocomplete', () => ({
+    useAddressAutocomplete: () => ({
+        searchCity: vi.fn(),
+        searchAddress: vi.fn(),
+    }),
+}))
+
+// 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 },
+    },
+    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')
+    })
+})