fix(transport) : name de radio unique par bloc prix (useId) — plus de groupe partagé entre blocs (ERP-170)

This commit is contained in:
2026-06-17 11:44:41 +02:00
parent 7adf3a511a
commit d5a01ac85f
@@ -17,7 +17,7 @@
<div class="flex h-12 items-center gap-6"> <div class="flex h-12 items-center gap-6">
<MalioRadioButton <MalioRadioButton
:model-value="model.direction" :model-value="model.direction"
name="price-direction" :name="`price-direction-${uid}`"
value="CLIENT" value="CLIENT"
:label="t('transport.carriers.form.price.directionClient')" :label="t('transport.carriers.form.price.directionClient')"
:disabled="readonly" :disabled="readonly"
@@ -26,7 +26,7 @@
/> />
<MalioRadioButton <MalioRadioButton
:model-value="model.direction" :model-value="model.direction"
name="price-direction" :name="`price-direction-${uid}`"
value="FOURNISSEUR" value="FOURNISSEUR"
:label="t('transport.carriers.form.price.directionSupplier')" :label="t('transport.carriers.form.price.directionSupplier')"
:disabled="readonly" :disabled="readonly"
@@ -112,7 +112,7 @@
<div class="flex h-12 items-center gap-4"> <div class="flex h-12 items-center gap-4">
<MalioRadioButton <MalioRadioButton
:model-value="model.containerType" :model-value="model.containerType"
name="price-container" :name="`price-container-${uid}`"
value="BENNE" value="BENNE"
:label="t('transport.carriers.containerType.BENNE')" :label="t('transport.carriers.containerType.BENNE')"
:disabled="readonly" :disabled="readonly"
@@ -121,7 +121,7 @@
/> />
<MalioRadioButton <MalioRadioButton
:model-value="model.containerType" :model-value="model.containerType"
name="price-container" :name="`price-container-${uid}`"
value="FOND_MOUVANT" value="FOND_MOUVANT"
:label="t('transport.carriers.containerType.FOND_MOUVANT')" :label="t('transport.carriers.containerType.FOND_MOUVANT')"
:disabled="readonly" :disabled="readonly"
@@ -137,7 +137,7 @@
<div class="flex h-12 items-center gap-4"> <div class="flex h-12 items-center gap-4">
<MalioRadioButton <MalioRadioButton
:model-value="model.pricingUnit" :model-value="model.pricingUnit"
name="price-unit" :name="`price-unit-${uid}`"
value="FORFAIT" value="FORFAIT"
:label="t('transport.carriers.form.price.pricingForfait')" :label="t('transport.carriers.form.price.pricingForfait')"
:disabled="readonly" :disabled="readonly"
@@ -146,7 +146,7 @@
/> />
<MalioRadioButton <MalioRadioButton
:model-value="model.pricingUnit" :model-value="model.pricingUnit"
name="price-unit" :name="`price-unit-${uid}`"
value="TONNE" value="TONNE"
:label="t('transport.carriers.form.price.pricingTonne')" :label="t('transport.carriers.form.price.pricingTonne')"
:disabled="readonly" :disabled="readonly"
@@ -181,7 +181,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed, ref, watch } from 'vue' import { computed, ref, useId, watch } from 'vue'
import type { CarrierPriceFormDraft } from '~/modules/transport/types/carrierForm' import type { CarrierPriceFormDraft } from '~/modules/transport/types/carrierForm'
interface SelectOption { interface SelectOption {
@@ -212,6 +212,11 @@ const emit = defineEmits<{
const { t } = useI18n() const { t } = useI18n()
const api = useApi() const api = useApi()
// Identifiant unique par instance : les groupes de radios (sens / contenant / tarif)
// doivent avoir un `name` PROPRE à chaque bloc prix, sinon plusieurs blocs partagent
// le même groupe HTML et leurs radios se désélectionnent mutuellement.
const uid = useId()
const model = computed(() => props.modelValue) const model = computed(() => props.modelValue)
const priceStateOptions = computed<SelectOption[]>(() => [ const priceStateOptions = computed<SelectOption[]>(() => [