Créer un écran à partir d'une requête
Vous avez une requête <base>_get (et idéalement ses voisines _put / _post / _delete) — l'Assistant CRUD est le moyen le plus rapide de les produire. Vous câblez maintenant un écran par-dessus pour que les utilisateurs voient et modifient les lignes.
Cette page parcourt les onglets Général et Requêtes du Concepteur d'écran. Colonnes, dialogue, actions et hooks arrivent dans les pages suivantes.
Étape 1 — Enregistrer l'application, si besoin
Sur Paramètres → Écrans, la barre de portée liste chaque application (= connecteur) qui possède déjà au moins un écran. Si le connecteur sur lequel vous voulez ajouter un écran n'y figure pas :
- Cliquer sur ＋ Ajouter des écrans pour un connecteur.
- Sélectionner le connecteur dans la liste déroulante (seuls les connecteurs sans espace de nommage Écrans apparaissent — une fois enregistré, le connecteur devient une puce d'application).
- La puce apparaît en haut ; la liste d'écrans en dessous est vide.
Si le connecteur est déjà une puce, il suffit de cliquer dessus.
Étape 2 — Ajouter un écran
Sous la liste vide, cliquer sur le bouton ＋ Ajouter un écran. La page demande un identifiant d'écran — lettres, chiffres, traits de soulignement, débutant par une lettre. Conventions :
| Motif | Exemple |
|---|---|
| Reprendre le nom de base de la table. | customers pour un écran sur customers_get. |
| Reprendre l'objet JD Edwards. | F0005 pour la table UDC JDE. |
<entité>_<finalité> pour les écrans qui ne se mappent pas 1-1 sur une table. | customer_balance_report, invoice_send_dialog. |
L'identifiant est stable — c'est le segment d'URL (/screen/<app>/<id>), la clé de dictionnaire ([screens.<app>.<id>]) et la cible des références entre fichiers. Le renommage ultérieur passe par le bouton Renommer de la carte, qui propage le changement à travers les écrans / menus / dictionnaire.
L'écran vide apparaît dans la liste ; cliquer dessus pour ouvrir le Concepteur d'écran.
Étape 3 — L'onglet Général
Le concepteur s'ouvre sur Général. Cet onglet est l'endroit où l'on câble l'identité, la surcharge du connecteur et les indicateurs de comportement.
Champ par champ
| Champ | Notes |
|---|---|
| Connecteur | Par défaut Utiliser le connecteur de l'application — <app>. À définir explicitement uniquement quand l'écran lit/écrit via un connecteur différent de celui qui donne son nom à l'application (rare mais légitime — ex. une application crm qui lit ses tables de reporting via un connecteur reporting). |
| Libellé | Texte court affiché dans les menus et listes. Retombe sur description, puis id. |
| Description | Texte plus long affiché comme titre de page. |
| auto_load | Quand activé, la grille exécute la requête de lecture dès l'ouverture de l'écran. Quand désactivé, l'utilisateur clique sur Exécuter pour récupérer les données. À désactiver uniquement pour les écrans qui exigent des paramètres de filtre ou pour des requêtes véritablement coûteuses. |
| editable | Quand activé, la grille gère l'édition de cellules en ligne — cliquer une cellule, taper, Entrée ; Enregistrer valide via update_query. Quand désactivé, l'utilisateur édite uniquement via le dialogue. |
| uploadable | Quand activé, un bouton Importer Excel / CSV apparaît dans la barre d'outils de la grille. Nécessite key_columns pour savoir quelles lignes sont des mises à jour et lesquelles sont des insertions. |
| audit_table | Définit un nom de table (convention : AUD_<TABLE>) pour y dupliquer chaque écriture réussie. Chaque ligne reçoit AUD_ACTION (INSERT/UPDATE/DELETE), AUD_USER (le nom de l'appelant), AUD_DATE (horodatage serveur). Vide = pas d'audit. |
| max_rows | Plafond sur le résultat de la requête de lecture. Vide utilise la valeur par défaut du connecteur / pool (typiquement 1000). |
| key_columns | Colonnes qui identifient une ligne de façon unique — pilote la correspondance mise à jour-ou-insertion de l'import Excel et le verrouillage du mode édition du dialogue. Laisser vide pour dériver des colonnes dont l'indicateur key est activé (le chemin recommandé — voir Colonnes). |
| initial_group_by | Un ou plusieurs noms de colonnes — la grille regroupe par celles-ci à la première ouverture. L'utilisateur peut dégrouper / regrouper depuis le contrôle Grouper. |
| treeview | À renseigner quand les lignes forment une hiérarchie parent/enfant — ex. arbres de menus, organigrammes. Ajoute une bascule Arborescence aux côtés de Tableau / Graphique. Voir Concepts → Écrans pour la référence complète. |
| chart_id | Un identifiant de graphique enregistré (depuis [charts.*]) — pré-remplit la bascule Graphique. Vide utilise un défaut local à la session. |
Quand une ligne est cliquée
La liste déroulante propose un des trois comportements :
| Mode | Effet |
|---|---|
| Ne rien faire (ou retomber sur le dialogue propre à l'écran) | Défaut. Si l'écran a son propre dialog, cliquer sur une ligne l'ouvre en mode édition. Sinon le clic n'a pas d'effet. |
| Ouvrir un écran voisin comme boîte de dialogue | Les colonnes de la ligne se lient à la requête de lecture d'un autre écran (on choisit la cible + les liaisons). Le dialogue de l'écran voisin s'ouvre en modale. Utile pour le maître-détail sans dupliquer le balisage du dialogue. |
| Ouvrir une route dans un nouvel onglet du navigateur | Une route SPA — échappatoire pour les pages React écrites à la main. Utiliser des marqueurs {column_name} pour interpoler les colonnes de la ligne (encodées URL). Exemple : /nomaflow/runs/{id}. |
Quand route et Ouvrir un écran voisin sont tous deux renseignés, la route gagne — la route explicite porte une intention plus spécifique.
Étape 4 — L'onglet Requêtes
Basculer sur Requêtes. C'est là que l'écran apprend quelles requêtes déclencher en lecture et à chaque écriture.
| Champ | Obligatoire | Notes |
|---|---|---|
| Requête de lecture | Oui | Le SELECT qui remplit la grille. La liste déroulante s'alimente depuis la liste des requêtes du connecteur sélectionné. |
| Requête de mise à jour | Non | La requête en écriture déclenchée par l'Enregistrer du dialogue en mode édition et le bouton Enregistrer de la grille. Convention : <base>_put. |
| Requête d'insertion | Non | La requête en écriture déclenchée par l'Enregistrer du dialogue en mode ajout. Convention : <base>_post. |
| Requête de suppression | Non | La requête en écriture déclenchée par le bouton Supprimer du dialogue (ou la suppression par ligne dans la grille). Convention : <base>_delete. |
L'icône crayon (✎) sur chaque ligne ouvre la requête dans une modale latérale — les retouches rapides à une requête ne demandent pas de quitter le Concepteur d'écran. La modale enregistre directement dans connectors.toml ; le rechargement se fait automatiquement.
Sélectionner depuis la sortie de l'Assistant CRUD
Si vous avez généré les quatre requêtes via l'Assistant CRUD, elles sont déjà dans la liste déroulante — customers_get, customers_put, customers_post, customers_delete. Les câbler dans l'ordre et l'écran a un CRUD complet.
Pour les écrans en lecture seule (rapports, tableaux de bord, vues d'audit), laisser les trois champs d'écriture vides. La grille fonctionne quand même ; le dialogue (s'il existe) est en lecture seule ; les boutons ＋ Ajouter / 🗑 Supprimer disparaissent.
Étape 5 — Enregistrer et voir le résultat
Cliquer sur Enregistrer dans l'en-tête de la modale. L'écran est enregistré, le rechargement à chaud se déclenche, et :
- Une nouvelle entrée de menu pour cet écran peut être ajoutée (voir la section Menus à venir).
- L'écran est accessible directement à
/screen/<app>/<id>. - Un utilisateur disposant de la permission
sql:<connector>:<read_query>voit la grille.
Pièges courants à ce stade
| Erreur | Symptôme | Correction |
|---|---|---|
read_query non renseigné. | L'enregistrement échoue à la validation. | Sélectionnez-en une — la requête de lecture est la seule requête obligatoire. |
update_query renseigné mais key_columns vide ET aucun indicateur key sur une colonne. | L'Enregistrer du dialogue en mode édition exécute l'UPDATE sans clause :NAME_ORIGINAL et met à jour la mauvaise ligne. | Renseignez key_columns ou marquez les colonnes clés dans l'onglet Colonnes. |
editable = true mais pas de update_query. | La grille affiche l'éditeur de cellule mais le bouton Enregistrer échoue. | Câblez la update_query. |
uploadable = true mais pas de key_columns. | L'importeur ne peut pas distinguer mise à jour et insertion. | Renseignez key_columns. |
| Surcharge de connecteur pointant sur un pool sur lequel l'utilisateur n'a pas de permission. | Les utilisateurs connectés obtiennent une grille vide sans erreur visible. | Changez la surcharge ou accordez la permission sql: adéquate à l'utilisateur. |
| Même identifiant d'écran réutilisé entre applications. | Le lien croisé screen:<app>:<id> est par application, donc les collisions entre applications passent. Mais au sein de la même application, le validateur refuse les doublons. | Choisir des identifiants uniques par application. |
Étapes suivantes
- Colonnes — configurer chaque colonne une seule fois pour la grille et le dialogue.
- Constructeur de dialogue — le concepteur visuel pour le formulaire d'ajout/modification.
- Actions et cycle de vie — boutons de barre d'outils, menus contextuels, hooks on_load / on_save / on_insert.