Version de développement

Cette documentation décrit la version « next » (develop), non encore publiée. Pour la version stable, basculez sur « v5 » dans l'en-tête.

Personnalisation

Créer des conditions imbriquées avec le Constructeur de conditions

Le composant ConditionBuilder construit des conditions ET / OU imbriquées dans les applications Vue de Dokos et produit une expression Python.

Constructeur de conditions

Le constructeur de conditions (ConditionBuilder) est un composant Vue du paquet @framework/ui de Dodock. Il construit un arbre de conditions joint par et et ou, par exemple A et (B ou C). Il produit aussi l'expression Python équivalente.

Le composant sert aux applications Vue construites sur Dodock. Le bureau classique (formulaires et listes) ne l'utilise pas.

      
flowchart LR
  A[Groupe racine : et] --> B[Statut = « Ouvert »]
  A --> C[Groupe : ou]
  C --> D[Priorité = « Urgente »]
  C --> E[Type = « Réclamation »]

Utiliser le constructeur

Une condition a trois parties : un champ, un opérateur et une valeur. Un groupe réunit des conditions et des sous-groupes.

Chaque groupe a un seul opérateur, et ou ou, pour tous ses éléments. Pour mélanger les deux, imbriquez un groupe : A et (B ou C). La première ligne d'un groupe commence par « Où ». Seule cette ligne permet de changer l'opérateur du groupe.

Action	Libellé affiché
Ajouter une condition au groupe	Ajouter une condition
Ajouter un sous-groupe	Ajouter un groupe de conditions
Transformer une condition en groupe	Transformer en groupe, dans le menu de la ligne
Retirer les conditions d'un groupe	Dégrouper les conditions, dans le menu du groupe
Supprimer	Remove ou Supprimer le groupe

Ces libellés n'ont pas encore de traduction française.

Quand vous dégroupez un groupe, ses conditions prennent l'opérateur du groupe parent.

Si l'application active la réorganisation, faites glisser une ligne par sa poignée. Une ligne peut changer de groupe de cette façon.

Exemple

Exemple fictif : un ticket est concerné s'il est ouvert et s'il est urgent ou de type réclamation.

Groupe racine (et)
- Statut est égal à « Ouvert »
- Sous-groupe (ou)
  - Priorité est égal à « Urgente »
  - Type est égal à « Réclamation »

Avec field-prefix="doc", l'expression produite a cette forme : doc.status == "Open" and (doc.priority == "Urgent" or doc.ticket_type == "Complaint").

API du composant

import { ConditionBuilder } from "@framework/ui/ConditionBuilder";
import type { ConditionField, ConditionGroup } from "@framework/ui/ConditionBuilder";

Le composant reprend les opérateurs et les contrôles de valeur du composant Filter. Filter est la version plate, avec et seulement.

Propriétés

Propriété	Type · Valeur par défaut	Rôle
`modelValue`	`ConditionGroup \| null` · requis	L'arbre des conditions, via `v-model="tree"`. `null` représente un arbre vide.
`expression`	`string`	L'expression Python produite, via `v-model:expression="doc.condition"`. Écriture seule.
`fieldPrefix`	`string`	Préfixe de chaque nom de champ dans l'expression. Exemple : `doc` donne `doc.status`.
`doctype`	`string`	Charge les champs depuis la méta de ce type de document. Lu une seule fois : remontez le composant avec `:key` si le type change.
`fields`	`ConditionField[]`	Liste de champs fournie directement. Prioritaire sur `doctype`.
`columns`	`ConditionColumns`	Largeur des colonnes, par exemple `:columns="{ value: '1fr' }"`.
`maxDepth`	`number` · `4`	Profondeur maximale des groupes. Le groupe racine a la profondeur 0.
`newCondition`	`() => TLeaf` · condition vide	Crée une nouvelle condition. Obligatoire si le slot `#condition` remplace la ligne par défaut.
`readonly`	`boolean` · `false`	Affiche l'arbre en lecture seule. Les lignes gardent leur place dans l'ordre de tabulation.
`reorderable`	`boolean` · `false`	Active le glisser-déposer des lignes, dans un groupe et entre groupes.
`labels`	`Partial<ConditionBuilderLabels>`	Remplace les libellés par défaut.
`bordered`	`'all' \| 'root' \| 'none'` · `'all'`	Bordures des groupes.
`label`	`string`	Légende du groupe de champs.
`description`	`string`	Texte d'aide sous la légende.
`error`	`string \| Error`	Message d'erreur. Marque le contrôle comme invalide.
`required`	`boolean` · `false`	Marque le contrôle comme obligatoire.

Événements

Événement	Contenu
`update:modelValue`	Le nouvel arbre de conditions.
`update:expression`	L'expression Python produite.

Fonctions exportées

emptyTree, isGroup, setGroupConjunction, toConditionExpression, fromFrappeConditions et toFrappeConditions. Les deux dernières convertissent l'arbre depuis et vers le format de conditions de Frappe.

Exemple d'intégration

<ConditionBuilder
  v-model="tree"
  v-model:expression="doc.condition"
  doctype="HD Ticket"
  :max-depth="3"
  bordered="root"
/>

Cet exemple charge les champs du type de document « HD Ticket ». Il limite l'imbrication à trois niveaux et affiche une bordure sur le groupe racine seulement.