feat: montre au repos qu'un champ est extrait et modifiable

Le pointillé qui signale un champ modifiable n'apparaissait qu'au survol. Il
faut désormais le chercher à la souris pour savoir si un nombre se corrige —
supportable tant que la page n'affiche que de l'extraction, plus du tout dès
qu'une valeur déduite s'affiche à côté. Le pointillé reste donc visible au
repos : son absence devient le signal qu'un nombre ne se modifie pas.

L'infobulle disait « Cliquer pour modifier », ce qui décrit le geste mais tait
l'essentiel : d'où vient le nombre. Elle dit maintenant qu'il est extrait du
compte rendu, et distingue le champ vide — rien n'a été extrait, il reste à
saisir — du champ renseigné.

Le composant ne sert qu'aux trois sections de la page d'édition, toutes
alimentées par l'extraction : l'affirmation vaut partout où il est employé.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
2026-07-31 08:12:22 +02:00
parent 8d869a3dde
commit 7b033a0184

View File

@@ -4,15 +4,20 @@
:class="{ 'w-full': fullWidth }"
>
<!-- Mode lecture -->
<!--
Le pointille reste visible au repos : sur une page ou cohabitent des
valeurs extraites et des valeurs deduites, son absence est ce qui signale
qu'un montant n'est pas modifiable.
-->
<span
v-if="!isEditing"
@click="startEditing"
class="cursor-pointer border-b border-dashed border-transparent hover:border-gray-500 hover:bg-gray-700/60 px-1 py-0.5 rounded transition-colors min-w-[2rem]"
class="cursor-pointer border-b border-dashed border-gray-600 hover:border-gray-400 hover:bg-gray-700/60 px-1 py-0.5 rounded-t transition-colors min-w-[2rem]"
:class="[
displayClass,
{ 'text-gray-500 italic': isEmpty }
]"
:title="'Cliquer pour modifier'"
:title="titreSurvol"
>
{{ displayValue }}
</span>
@@ -101,6 +106,14 @@ const displayValue = computed(() => {
return props.modelValue
})
// Ce composant n'édite que des champs issus de l'extraction : le survol le dit,
// pour qu'on ne confonde jamais une valeur lue dans le PDF avec une valeur déduite.
const titreSurvol = computed(() =>
isEmpty.value
? "Aucune valeur extraite du compte rendu — cliquer pour la saisir"
: 'Valeur extraite du compte rendu — cliquer pour la modifier'
)
const inputType = computed(() => {
if (props.type === 'currency' || props.type === 'number') return 'number'
if (props.type === 'date') return 'date'