feat(front) : ameliorations UI onglets client (compta, RIB, blocs, placeholder)
- Onglet Comptabilite : grille alignee sur les autres onglets (grid-cols-4 gap-x-[44px] gap-y-4) en creation / modification / consultation. - Bloc RIB toujours visible (au moins un bloc, meme vide) en creation, modification et consultation ; un bloc vide n'est jamais persiste. - Blocs Contact / Adresse / RIB toujours affiches meme vides en consultation et modification ; suppression des messages « Aucun ... enregistre ». - Onglets a venir (Transport, Statistiques, Rapports, Echanges) : nouveau composant partage ComingSoonPlaceholder (shared/components/ui) « En cours de dev » + gif, reutilisable par tous les modules ; remplace TabPlaceholderBlank.
This commit is contained in:
@@ -179,9 +179,6 @@
|
||||
@update:model-value="(v) => contacts[index] = v"
|
||||
@remove="askRemoveContact(index)"
|
||||
/>
|
||||
<p v-if="contacts.length === 0" class="text-center text-black/60">
|
||||
{{ t('commercial.clients.edit.emptyContacts') }}
|
||||
</p>
|
||||
<div v-if="!businessReadonly" class="flex justify-center gap-6">
|
||||
<MalioButton
|
||||
variant="secondary"
|
||||
@@ -219,9 +216,6 @@
|
||||
@remove="askRemoveAddress(index)"
|
||||
@degraded="onAddressDegraded"
|
||||
/>
|
||||
<p v-if="addresses.length === 0" class="text-center text-black/60">
|
||||
{{ t('commercial.clients.edit.emptyAddresses') }}
|
||||
</p>
|
||||
<div v-if="!businessReadonly" class="flex justify-center gap-6">
|
||||
<MalioButton
|
||||
variant="secondary"
|
||||
@@ -245,7 +239,7 @@
|
||||
<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-3 gap-x-[80px] gap-y-5">
|
||||
<div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
|
||||
<MalioInputText
|
||||
v-model="accounting.siren"
|
||||
:label="t('commercial.clients.form.accounting.siren')"
|
||||
@@ -312,7 +306,7 @@
|
||||
v-bind="{ ariaLabel: t('commercial.clients.form.accounting.removeRib') }"
|
||||
@click="askRemoveRib(index)"
|
||||
/>
|
||||
<div class="grid grid-cols-3 gap-x-[80px] gap-y-5">
|
||||
<div class="grid grid-cols-4 gap-x-[44px] gap-y-4">
|
||||
<MalioInputText
|
||||
v-model="rib.label"
|
||||
:label="t('commercial.clients.form.accounting.ribLabel')"
|
||||
@@ -350,10 +344,10 @@
|
||||
</template>
|
||||
|
||||
<!-- Onglets non encore implementes : frame vide (navigation libre). -->
|
||||
<template #transport><TabPlaceholderBlank /></template>
|
||||
<template #statistics><TabPlaceholderBlank /></template>
|
||||
<template #reports><TabPlaceholderBlank /></template>
|
||||
<template #exchanges><TabPlaceholderBlank /></template>
|
||||
<template #transport><ComingSoonPlaceholder /></template>
|
||||
<template #statistics><ComingSoonPlaceholder /></template>
|
||||
<template #reports><ComingSoonPlaceholder /></template>
|
||||
<template #exchanges><ComingSoonPlaceholder /></template>
|
||||
</MalioTabList>
|
||||
</template>
|
||||
|
||||
@@ -495,6 +489,11 @@ function hydrate(detail: ClientDetail): void {
|
||||
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*/canValidate*).
|
||||
if (contacts.value.length === 0) contacts.value.push(emptyContact())
|
||||
if (addresses.value.length === 0) addresses.value.push(emptyAddress())
|
||||
if (ribs.value.length === 0) ribs.value.push(emptyRib())
|
||||
// Charge les listes distributeur / courtier si une relation est deja posee.
|
||||
if (main.relationType === 'distributeur') referentials.loadDistributors().catch(() => {})
|
||||
if (main.relationType === 'courtier') referentials.loadBrokers().catch(() => {})
|
||||
@@ -694,6 +693,8 @@ function askRemoveContact(index: number): void {
|
||||
const removed = contacts.value[index]
|
||||
if (removed?.id != null) removedContactIds.value.push(removed.id)
|
||||
contacts.value.splice(index, 1)
|
||||
// Garde au moins un bloc visible (cf. amorce a l'hydratation).
|
||||
if (contacts.value.length === 0) contacts.value.push(emptyContact())
|
||||
})
|
||||
}
|
||||
|
||||
@@ -755,6 +756,8 @@ function askRemoveAddress(index: number): void {
|
||||
const removed = addresses.value[index]
|
||||
if (removed?.id != null) removedAddressIds.value.push(removed.id)
|
||||
addresses.value.splice(index, 1)
|
||||
// Garde au moins un bloc visible (cf. amorce a l'hydratation).
|
||||
if (addresses.value.length === 0) addresses.value.push(emptyAddress())
|
||||
})
|
||||
}
|
||||
|
||||
@@ -833,6 +836,8 @@ function askRemoveRib(index: number): void {
|
||||
const removed = ribs.value[index]
|
||||
if (removed?.id != null) removedRibIds.value.push(removed.id)
|
||||
ribs.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())
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user