# Spec : Formula Builder interactif pour la référence auto **Date** : 2026-03-31 **Scope** : Frontend uniquement (pas de changement backend) **Fichier impacté** : `frontend/app/components/model-types/ModelTypeForm.vue` ## Problème L'utilisateur doit taper manuellement les noms exacts des custom fields dans la formule (`{serie}{diametre}{type}`) et re-lister les champs requis séparés par des virgules. C'est sujet aux erreurs de typo et peu ergonomique. ## Solution Remplacer la section "Génération de référence automatique" du `ModelTypeForm` par un formula builder interactif. ### Composants UI #### 1. Chips de champs disponibles - Afficher une rangée de boutons-chips avec les noms des custom fields définis dans `pieceStructure.customFields` - Cliquer sur un chip insère `{nom_du_champ}` dans l'input formule à la position du curseur - Si `pieceStructure.customFields` est vide, afficher un message "Aucun champ personnalisé défini" #### 2. Input formule - Input texte classique (comme aujourd'hui) mais avec les chips comme aide à la saisie - L'utilisateur peut aussi taper du texte libre (séparateurs `-`, `/`, préfixes `SNU `, etc.) - Le format stocké reste `{nom_du_champ}` — aucun changement de format backend #### 3. Suppression du champ "Champs requis" - Le champ `requiredFieldsForReference` est calculé automatiquement au submit en extrayant tous les `{...}` de la formule - Suppression de l'input "Champs requis" et de la variable `requiredFieldsInput` - La logique : tous les champs présents dans la formule sont requis. Si un champ n'a pas de valeur → pas de référence générée #### 4. Aperçu live - Conserver l'aperçu existant mais l'améliorer : remplacer les placeholders par des valeurs d'exemple en majuscules - Exemples par type de champ : `text` → `VALEUR`, `number` → `123`, `select` → `OPTION`, `boolean` → `OUI`, `date` → `2026-01-01` ### Comportement - **Insert au curseur** : quand l'utilisateur clique un chip, le placeholder est inséré à `selectionStart` de l'input, pas à la fin - **Formule vide** : si la formule est vide, pas de référence auto (comportement actuel conservé) - **Readonly** : les chips sont désactivés en mode readonly (comme l'input) - **Pas de custom fields** : si aucun champ n'est défini dans la structure, la section reste visible mais les chips sont remplacés par un message informatif. L'utilisateur peut quand même taper une formule manuellement (cas edge) ### Format de sortie (inchangé) ```typescript { referenceFormula: "SNU {serie}-{diametre}/{type}" | null, requiredFieldsForReference: ["serie", "diametre", "type"] | null // auto-calculé } ``` ### Pas de changement - Backend (`ReferenceAutoGenerator`, `ReferenceAutoSubscriber`, entités) : aucun changement - Format de stockage de la formule : identique (`{placeholder}` strings) - API : identique