style(front) : mise en forme des modales de pesée (ERP-189)
- Modale pesée manuelle : titre UPPERCASE, marges 24px haut / 28px latéral / 12px titre-bordure / 36px bordure-formulaire, bordure insérée sous le header, champs resserrés (gap-2), Annuler retiré, Enregistrer centré. - Modale pesée bascule : question portée par le titre (corps sans texte), Annuler retiré, Valider centré. - Marge bottom de 24px sous le bouton dans les deux modales. - Nettoyage des clés i18n devenues inutiles (cancel / confirmMessage).
This commit is contained in:
@@ -112,22 +112,16 @@
|
||||
</template>
|
||||
|
||||
<!-- ── Modal « Confirmation pesée bascule » (RG-5.06) ──────────────────-->
|
||||
<MalioModal v-model="autoModal.open" modal-class="max-w-md">
|
||||
<!-- La question est portée par le titre ; pas de texte de corps. Bouton
|
||||
« Valider » seul, centré (l'annulation se fait via la croix). -->
|
||||
<MalioModal v-model="autoModal.open" modal-class="max-w-md" footer-class="justify-center pb-6">
|
||||
<template #header>
|
||||
<h2 class="text-[24px] font-bold">{{ t('logistique.weighingTickets.form.weighbridge.confirmTitle') }}</h2>
|
||||
</template>
|
||||
<p>{{ t('logistique.weighingTickets.form.weighbridge.confirmMessage') }}</p>
|
||||
<p v-if="autoModal.error" class="mt-4 text-m-danger">{{ autoModal.error }}</p>
|
||||
<p v-if="autoModal.error" class="text-m-danger">{{ autoModal.error }}</p>
|
||||
<template #footer>
|
||||
<MalioButton
|
||||
variant="secondary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.weighbridge.cancel')"
|
||||
@click="autoModal.open = false"
|
||||
/>
|
||||
<MalioButton
|
||||
variant="primary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.weighbridge.validate')"
|
||||
:disabled="autoModal.loading"
|
||||
@click="confirmAuto"
|
||||
@@ -136,11 +130,20 @@
|
||||
</MalioModal>
|
||||
|
||||
<!-- ── Modal « Pesée manuelle » ────────────────────────────────────────-->
|
||||
<MalioModal v-model="manualModal.open" modal-class="max-w-md">
|
||||
<!-- Marges : titre UPPERCASE à 24px du haut (pt-6), 28px horizontaux (mx-7 header
|
||||
/ px-7 body+footer), bordure à 12px sous le titre (pb-3) et insérée (mx-7,
|
||||
ne touche pas les bords), formulaire à 36px sous la bordure (pt-9). -->
|
||||
<MalioModal
|
||||
v-model="manualModal.open"
|
||||
modal-class="max-w-md"
|
||||
header-class="mx-7 px-0 pt-6 pb-3 border-b border-black"
|
||||
body-class="px-7 pt-9"
|
||||
footer-class="px-7 justify-center pb-6"
|
||||
>
|
||||
<template #header>
|
||||
<h2 class="text-[24px] font-bold">{{ t('logistique.weighingTickets.form.manual.title') }}</h2>
|
||||
<h2 class="text-[24px] font-bold uppercase">{{ t('logistique.weighingTickets.form.manual.title') }}</h2>
|
||||
</template>
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col gap-2">
|
||||
<!-- Poids : champ texte verrouillé sur les chiffres (comme le formulaire). -->
|
||||
<MalioInputText
|
||||
v-model="manualModal.weight"
|
||||
@@ -157,15 +160,8 @@
|
||||
/>
|
||||
</div>
|
||||
<template #footer>
|
||||
<MalioButton
|
||||
variant="secondary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.manual.cancel')"
|
||||
@click="manualModal.open = false"
|
||||
/>
|
||||
<MalioButton
|
||||
variant="primary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.manual.save')"
|
||||
:disabled="manualModal.loading"
|
||||
@click="confirmManual"
|
||||
|
||||
@@ -114,24 +114,18 @@
|
||||
</div>
|
||||
|
||||
<!-- ── Modal « Confirmation pesée bascule » (RG-5.06) ──────────────────-->
|
||||
<MalioModal v-model="autoModal.open" modal-class="max-w-md">
|
||||
<!-- La question est portée par le titre ; pas de texte de corps. Bouton
|
||||
« Valider » seul, centré (l'annulation se fait via la croix). -->
|
||||
<MalioModal v-model="autoModal.open" modal-class="max-w-md" footer-class="justify-center pb-6">
|
||||
<template #header>
|
||||
<h2 class="text-[24px] font-bold">{{ t('logistique.weighingTickets.form.weighbridge.confirmTitle') }}</h2>
|
||||
</template>
|
||||
<p>{{ t('logistique.weighingTickets.form.weighbridge.confirmMessage') }}</p>
|
||||
<!-- Erreur de pont indisponible affichée INLINE dans la modal + invite
|
||||
à la pesée manuelle (RG-5.06). -->
|
||||
<p v-if="autoModal.error" class="mt-4 text-m-danger">{{ autoModal.error }}</p>
|
||||
<p v-if="autoModal.error" class="text-m-danger">{{ autoModal.error }}</p>
|
||||
<template #footer>
|
||||
<MalioButton
|
||||
variant="secondary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.weighbridge.cancel')"
|
||||
@click="autoModal.open = false"
|
||||
/>
|
||||
<MalioButton
|
||||
variant="primary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.weighbridge.validate')"
|
||||
:disabled="autoModal.loading"
|
||||
@click="confirmAuto"
|
||||
@@ -140,11 +134,20 @@
|
||||
</MalioModal>
|
||||
|
||||
<!-- ── Modal « Pesée manuelle » ────────────────────────────────────────-->
|
||||
<MalioModal v-model="manualModal.open" modal-class="max-w-md">
|
||||
<!-- Marges : titre UPPERCASE à 24px du haut (pt-6), 28px horizontaux (mx-7 header
|
||||
/ px-7 body+footer), bordure à 12px sous le titre (pb-3) et insérée (mx-7,
|
||||
ne touche pas les bords), formulaire à 36px sous la bordure (pt-9). -->
|
||||
<MalioModal
|
||||
v-model="manualModal.open"
|
||||
modal-class="max-w-md"
|
||||
header-class="mx-7 px-0 pt-6 pb-3 border-b border-black"
|
||||
body-class="px-7 pt-9"
|
||||
footer-class="px-7 justify-center pb-6"
|
||||
>
|
||||
<template #header>
|
||||
<h2 class="text-[24px] font-bold">{{ t('logistique.weighingTickets.form.manual.title') }}</h2>
|
||||
<h2 class="text-[24px] font-bold uppercase">{{ t('logistique.weighingTickets.form.manual.title') }}</h2>
|
||||
</template>
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col gap-2">
|
||||
<!-- Poids : champ texte verrouillé sur les chiffres (comme le formulaire). -->
|
||||
<MalioInputText
|
||||
v-model="manualModal.weight"
|
||||
@@ -161,15 +164,8 @@
|
||||
/>
|
||||
</div>
|
||||
<template #footer>
|
||||
<MalioButton
|
||||
variant="secondary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.manual.cancel')"
|
||||
@click="manualModal.open = false"
|
||||
/>
|
||||
<MalioButton
|
||||
variant="primary"
|
||||
button-class="flex-1"
|
||||
:label="t('logistique.weighingTickets.form.manual.save')"
|
||||
:disabled="manualModal.loading"
|
||||
@click="confirmManual"
|
||||
|
||||
Reference in New Issue
Block a user