feat : grise les champs en consultation et onglets validés (readonly → disabled) (ERP-193)

This commit is contained in:
2026-06-19 09:48:49 +02:00
parent 07f5a95a6b
commit cdcc7d1e75
21 changed files with 321 additions and 228 deletions
@@ -7,6 +7,7 @@
:options="countryOptions"
:label="t('transport.carriers.form.address.country')"
:readonly="readonly"
:disabled="disabled"
:required="true"
:error="errors?.country"
@update:model-value="(v: string | number | null) => update('country', String(v ?? 'France'))"
@@ -18,6 +19,7 @@
:label="t('transport.carriers.form.address.postalCode')"
:mask="POSTAL_CODE_MASK"
:readonly="readonly"
:disabled="disabled"
:required="true"
:error="errors?.postalCode"
@update:model-value="onPostalCodeChange"
@@ -30,6 +32,7 @@
:options="cityOptions"
:label="t('transport.carriers.form.address.city')"
:readonly="readonly"
:disabled="disabled"
empty-option-label=""
:required="true"
:error="errors?.city"
@@ -40,6 +43,7 @@
:model-value="model.city"
:label="t('transport.carriers.form.address.city')"
:readonly="readonly"
:disabled="disabled"
:required="true"
:error="errors?.city"
@update:model-value="(v: string) => update('city', v)"
@@ -52,13 +56,14 @@
texte saisi est conserve si la BAN ne propose rien (saisie manuelle). -->
<div class="col-span-2">
<MalioInputAutocomplete
v-if="!readonly"
v-if="!readonly && !disabled"
:model-value="model.street"
:options="addressOptions"
:loading="addressLoading"
:min-search-length="3"
:label="t('transport.carriers.form.address.street')"
:readonly="readonly"
:disabled="disabled"
:required="true"
:error="errors?.street"
:allow-create="true"
@@ -72,6 +77,7 @@
:model-value="model.street"
:label="t('transport.carriers.form.address.street')"
:readonly="readonly"
:disabled="disabled"
:required="true"
:error="errors?.street"
@update:model-value="(v: string) => update('street', v)"
@@ -82,6 +88,7 @@
:model-value="model.streetComplement"
:label="t('transport.carriers.form.address.streetComplement')"
:readonly="readonly"
:disabled="disabled"
:error="errors?.streetComplement"
@update:model-value="(v: string) => update('streetComplement', v)"
/>
@@ -107,6 +114,8 @@ const props = defineProps<{
/** Pays disponibles (France par defaut). */
countryOptions: RefOption[]
readonly?: boolean
/** Bloc desactive (champs grises, consultation — distinct de readonly). */
disabled?: boolean
/** Erreurs serveur 422 de cette ligne, indexees par champ (ERP-101). */
errors?: Record<string, string>
}>()
@@ -3,7 +3,7 @@
<!-- Suppression : ouvre une modal de confirmation côté parent. Masquée si
non supprimable (1er bloc) ou en lecture seule. -->
<MalioButtonIcon
v-if="removable && !readonly"
v-if="removable && !readonly && !disabled"
icon="mdi:delete-outline"
variant="ghost"
button-class="absolute top-3 right-3"
@@ -15,6 +15,7 @@
:model-value="model.lastName"
:label="t('transport.carriers.form.contact.lastName')"
:readonly="readonly"
:disabled="disabled"
:error="errors?.lastName"
@update:model-value="(v: string) => update('lastName', v)"
/>
@@ -22,6 +23,7 @@
:model-value="model.firstName"
:label="t('transport.carriers.form.contact.firstName')"
:readonly="readonly"
:disabled="disabled"
:error="errors?.firstName"
@update:model-value="(v: string) => update('firstName', v)"
/>
@@ -32,6 +34,7 @@
:model-value="model.jobTitle"
:label="t('transport.carriers.form.contact.jobTitle')"
:readonly="readonly"
:disabled="disabled"
:error="errors?.jobTitle"
@update:model-value="(v: string) => update('jobTitle', v)"
/>
@@ -40,6 +43,7 @@
:model-value="model.email"
:label="t('transport.carriers.form.contact.email')"
:readonly="readonly"
:disabled="disabled"
:lowercase="true"
:error="errors?.email"
@update:model-value="(v: string) => update('email', v)"
@@ -50,6 +54,7 @@
:label="t('transport.carriers.form.contact.phonePrimary')"
:mask="PHONE_MASK"
:readonly="readonly"
:disabled="disabled"
:error="errors?.phonePrimary"
:addable="!model.hasSecondaryPhone && !readonly"
:add-button-label="t('transport.carriers.form.contact.addPhone')"
@@ -63,6 +68,7 @@
:label="t('transport.carriers.form.contact.phoneSecondary')"
:mask="PHONE_MASK"
:readonly="readonly"
:disabled="disabled"
:error="errors?.phoneSecondary"
@update:model-value="(v: string) => update('phoneSecondary', v)"
/>
@@ -83,6 +89,8 @@ const props = defineProps<{
removable?: boolean
/** Bloc en lecture seule (onglet validé). */
readonly?: boolean
/** Bloc desactive (champs grises, consultation — distinct de readonly). */
disabled?: boolean
/** Erreurs serveur 422 de cette ligne, indexées par champ (ERP-101). */
errors?: Record<string, string>
}>()
@@ -2,7 +2,7 @@
<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 côté parent. -->
<MalioButtonIcon
v-if="removable && !readonly"
v-if="removable && !readonly && !disabled"
icon="mdi:delete-outline"
variant="ghost"
button-class="absolute top-3 right-3"
@@ -20,7 +20,7 @@
:name="`price-direction-${uid}`"
value="CLIENT"
:label="t('transport.carriers.form.price.directionClient')"
:disabled="readonly"
:disabled="readonly || disabled"
group-class="mt-0"
@update:model-value="onDirectionChange"
/>
@@ -29,7 +29,7 @@
:name="`price-direction-${uid}`"
value="FOURNISSEUR"
:label="t('transport.carriers.form.price.directionSupplier')"
:disabled="readonly"
:disabled="readonly || disabled"
group-class="mt-0"
@update:model-value="onDirectionChange"
/>
@@ -46,6 +46,7 @@
empty-option-label=""
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.client"
@update:model-value="onClientChange"
/>
@@ -56,6 +57,7 @@
empty-option-label=""
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.clientDeliveryAddress"
@update:model-value="(v: string | number | null) => update('clientDeliveryAddressIri', v === null ? null : String(v))"
/>
@@ -66,6 +68,7 @@
empty-option-label=""
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.departureSite"
@update:model-value="(v: string | number | null) => update('departureSiteIri', v === null ? null : String(v))"
/>
@@ -80,6 +83,7 @@
empty-option-label=""
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.supplier"
@update:model-value="onSupplierChange"
/>
@@ -90,6 +94,7 @@
empty-option-label=""
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.supplierSupplyAddress"
@update:model-value="(v: string | number | null) => update('supplierSupplyAddressIri', v === null ? null : String(v))"
/>
@@ -100,6 +105,7 @@
empty-option-label=""
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.deliverySite"
@update:model-value="(v: string | number | null) => update('deliverySiteIri', v === null ? null : String(v))"
/>
@@ -115,7 +121,7 @@
:name="`price-container-${uid}`"
value="BENNE"
:label="t('transport.carriers.containerType.BENNE')"
:disabled="readonly"
:disabled="readonly || disabled"
group-class="mt-0"
@update:model-value="(v: string | number | boolean | null) => update('containerType', v === null ? null : String(v))"
/>
@@ -124,7 +130,7 @@
:name="`price-container-${uid}`"
value="FOND_MOUVANT"
:label="t('transport.carriers.containerType.FOND_MOUVANT')"
:disabled="readonly"
:disabled="readonly || disabled"
group-class="mt-0"
@update:model-value="(v: string | number | boolean | null) => update('containerType', v === null ? null : String(v))"
/>
@@ -140,7 +146,7 @@
:name="`price-unit-${uid}`"
value="FORFAIT"
:label="t('transport.carriers.form.price.pricingForfait')"
:disabled="readonly"
:disabled="readonly || disabled"
group-class="mt-0"
@update:model-value="(v: string | number | boolean | null) => update('pricingUnit', v === null ? null : String(v))"
/>
@@ -149,7 +155,7 @@
:name="`price-unit-${uid}`"
value="TONNE"
:label="t('transport.carriers.form.price.pricingTonne')"
:disabled="readonly"
:disabled="readonly || disabled"
group-class="mt-0"
@update:model-value="(v: string | number | boolean | null) => update('pricingUnit', v === null ? null : String(v))"
/>
@@ -162,6 +168,7 @@
:label="t('transport.carriers.form.price.price')"
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.price"
@update:model-value="(v: string) => update('price', v)"
/>
@@ -173,6 +180,7 @@
empty-option-label=""
:required="true"
:readonly="readonly"
:disabled="disabled"
:error="errors?.priceState"
@update:model-value="(v: string | number | null) => update('priceState', v === null ? null : String(v))"
/>
@@ -200,6 +208,8 @@ const props = defineProps<{
siteOptions: SelectOption[]
removable?: boolean
readonly?: boolean
/** Bloc desactive (champs grises, consultation — distinct de readonly). */
disabled?: boolean
/** Erreurs serveur 422 de cette ligne, indexées par champ (ERP-101). */
errors?: Record<string, string>
}>()
@@ -40,7 +40,7 @@
:label="t('transport.carriers.form.main.certificationType')"
empty-option-label=""
:required="true"
:readonly="certificationReadonly"
:disabled="certificationReadonly"
:error="mainErrors.errors.certificationType"
@update:model-value="(v: string | number | null) => setCertification(v === null ? null : String(v))"
/>
@@ -50,7 +50,7 @@
:label="t('transport.carriers.form.main.discharge')"
accept="application/pdf,image/*"
:required="true"
:readonly="dischargeUploading"
:disabled="dischargeUploading"
:clearable="true"
:error="mainErrors.errors.dischargeDocument"
@update:model-value="(v: string) => dischargeFileName = v"
@@ -45,14 +45,14 @@
<template v-else-if="carrier">
<!-- Bloc principal (lecture seule) même disposition que l'ajout -->
<div class="mt-[48px] grid grid-cols-3 xl:grid-cols-4 gap-x-[44px] gap-y-4">
<MalioInputText :model-value="main.name" :label="t('transport.carriers.form.main.name')" readonly />
<MalioInputText :model-value="main.name" :label="t('transport.carriers.form.main.name')" disabled />
<!-- Cas LIOT : seul le champ immatriculations. -->
<MalioInputText
v-if="isLiot"
:model-value="main.liotPlates"
:label="t('transport.carriers.form.main.liotPlates')"
readonly
disabled
/>
<!-- Cas standard : certification + décharge (col 3 réservée) + affrètement (col 4). -->
@@ -60,7 +60,7 @@
<MalioInputText
:model-value="certificationLabel"
:label="t('transport.carriers.form.main.certificationType')"
readonly
disabled
/>
<!-- Colonne 3 réservée à la décharge (si AUTRE), sinon vide (xl). -->
@@ -68,7 +68,7 @@
v-if="main.certificationType === 'AUTRE'"
:model-value="dischargeLabel"
:label="t('transport.carriers.form.main.discharge')"
readonly
disabled
/>
<div v-else class="hidden xl:block"></div>
@@ -78,14 +78,14 @@
id="carrier-view-chartered"
:label="t('transport.carriers.form.main.isChartered')"
:model-value="main.isChartered"
readonly
disabled
:reserve-message-space="false"
/>
</div>
<!-- Champs d'affrètement (ligne 2) si affrété. -->
<template v-if="main.isChartered">
<MalioInputText :model-value="indexationDisplay" :label="t('transport.carriers.form.main.indexationRate')" readonly />
<MalioInputText :model-value="indexationDisplay" :label="t('transport.carriers.form.main.indexationRate')" disabled />
<!-- Contenant : radios désactivés (lecture seule), aligné sur l'ajout / la modif. -->
<div>
<div class="flex h-12 items-center gap-4">
@@ -94,7 +94,7 @@
name="carrier-view-container"
value="BENNE"
:label="t('transport.carriers.containerType.BENNE')"
readonly
disabled
group-class="mt-0"
/>
<MalioRadioButton
@@ -102,12 +102,12 @@
name="carrier-view-container"
value="FOND_MOUVANT"
:label="t('transport.carriers.containerType.FOND_MOUVANT')"
readonly
disabled
group-class="mt-0"
/>
</div>
</div>
<MalioInputText :model-value="main.volumeM3" :label="t('transport.carriers.form.main.volumeM3')" readonly />
<MalioInputText :model-value="main.volumeM3" :label="t('transport.carriers.form.main.volumeM3')" disabled />
</template>
</template>
</div>
@@ -121,7 +121,7 @@
<CarrierAddressBlock
:model-value="address"
:country-options="countryOptionsFor(address.country)"
readonly
disabled
/>
</div>
</template>
@@ -132,7 +132,7 @@
v-for="(contact, index) in contacts"
:key="index"
:model-value="contact"
readonly
disabled
/>
</div>
</template>
@@ -23,7 +23,7 @@
@update:model-value="(v: string) => main.name = sanitizeFreeText(v)"
:label="t('transport.carriers.form.main.name')"
:required="true"
:readonly="mainLocked"
:disabled="mainLocked"
:error="mainErrors.errors.name"
/>
@@ -34,7 +34,7 @@
:label="t('transport.carriers.form.main.liotPlates')"
:hint="t('transport.carriers.form.main.liotPlatesHint')"
:required="true"
:readonly="mainLocked"
:disabled="mainLocked"
:error="mainErrors.errors.liotPlates"
/>
@@ -46,7 +46,7 @@
:label="t('transport.carriers.form.main.certificationType')"
empty-option-label=""
:required="true"
:readonly="certificationReadonly"
:disabled="certificationReadonly"
:error="mainErrors.errors.certificationType"
@update:model-value="(v: string | number | null) => main.certificationType = v === null ? null : String(v)"
/>
@@ -62,7 +62,7 @@
:label="t('transport.carriers.form.main.discharge')"
accept="application/pdf,image/*"
:required="true"
:readonly="mainLocked || dischargeUploading"
:disabled="mainLocked || dischargeUploading"
:clearable="true"
:error="mainErrors.errors.dischargeDocument"
@update:model-value="(v: string) => dischargeFileName = v"
@@ -79,7 +79,7 @@
id="carrier-is-chartered"
:label="t('transport.carriers.form.main.isChartered')"
:model-value="main.isChartered"
:readonly="mainLocked"
:disabled="mainLocked"
:reserve-message-space="false"
@update:model-value="(val: boolean) => main.isChartered = val"
/>
@@ -99,7 +99,7 @@
icon-name="mdi:percent"
icon-position="right"
:required="true"
:readonly="mainLocked"
:disabled="mainLocked"
:error="mainErrors.errors.indexationRate"
@update:model-value="onIndexationInput"
/>
@@ -113,7 +113,7 @@
name="carrier-main-container"
value="BENNE"
:label="t('transport.carriers.containerType.BENNE')"
:readonly="mainLocked"
:disabled="mainLocked"
group-class="mt-0"
@update:model-value="(v: string | number | boolean | null) => main.containerType = v === null ? null : String(v)"
/>
@@ -122,7 +122,7 @@
name="carrier-main-container"
value="FOND_MOUVANT"
:label="t('transport.carriers.containerType.FOND_MOUVANT')"
:readonly="mainLocked"
:disabled="mainLocked"
group-class="mt-0"
@update:model-value="(v: string | number | boolean | null) => main.containerType = v === null ? null : String(v)"
/>
@@ -135,7 +135,7 @@
:model-value="main.volumeM3"
:label="t('transport.carriers.form.main.volumeM3')"
:required="true"
:readonly="mainLocked"
:disabled="mainLocked"
:error="mainErrors.errors.volumeM3"
@update:model-value="(v: string) => main.volumeM3 = sanitizeDecimal(v)"
/>
@@ -175,7 +175,7 @@
<CarrierAddressBlock
:model-value="address"
:country-options="countryOptions"
:readonly="isQualimat || isValidated('addresses')"
:disabled="isQualimat || isValidated('addresses')"
:errors="addressErrors"
@update:model-value="(v) => address = v"
@degraded="onAddressDegraded"
@@ -202,7 +202,7 @@
:key="index"
:model-value="contact"
:removable="isRowRemovable(contacts, index)"
:readonly="isValidated('contacts')"
:disabled="isValidated('contacts')"
:errors="contactErrors[index]"
@update:model-value="(v) => contacts[index] = v"
@remove="askRemoveContact(index)"
@@ -238,7 +238,7 @@
:supplier-options="supplierOptions"
:site-options="siteOptions"
:removable="!isValidated('prices')"
:readonly="isValidated('prices')"
:disabled="isValidated('prices')"
:errors="priceErrors[index]"
@update:model-value="(v) => prices[index] = v"
@remove="askRemovePrice(index)"