Pages d'interface

Vue d'ensemble

Dokos distingue traditionnellement deux types de pages : les formulaires (qui affichent les données d'un document précis) et les listes (qui présentent une collection de documents d'un même type). Pour répondre aux besoins d'interfaces plus libres — tableaux de bord personnalisés, assistants de saisie, écrans de synthèse — le framework propose désormais un troisième type : les pages d'interface.

Une page d'interface est une page de bureau (desk page) dont le rendu est entièrement confié à la bibliothèque Frappe UI. Vous pouvez ainsi assembler une écran sur mesure à partir de composants web, en bénéficiant de la réactivité de Vue.js et de l'écosystème Frappe UI.

      
flowchart LR
    A[Type de page] --> B[Formulaire]
    A --> C[Liste]
    A --> D[Page d'interface — Frappe UI]
    D --> E[Composants Vue.js]
    D --> F[Données Dokos]
    D --> G[Mise en page libre]

    

Créer une page d'interface

Étape 1 — Déclarer une nouvelle page

1. Ouvrez le menu Développeur → Liste → Page ou recherchez « Page » dans la barre de recherche globale.
2. Cliquez sur Ajouter Page.
3. Renseignez un nom de page explicite, par exemple « Tableau de bord logistique ».
4. Choisissez Frappe UI dans le champ Type de page.
5. Enregistrez.

Étape 2 — Définir le titre de la page

Le champ Titre de la page permet d'indiquer le libellé affiché dans l'en-tête du navigateur. Si ce champ est laissé vide, Dokos utilisera automatiquement le nom de la page. Le titre est désormais correctement encodé afin de respecter les caractères accentués et les symboles.

Étape 3 — Assembler l'écran

Une fois la page enregistrée comme page d'interface, vous pouvez « fabriquer » (craft) l'écran directement depuis l'éditeur de page. L'éditeur met à disposition l'ensemble des composants Frappe UI : boutons, cartes, tableaux, champs de saisie, etc.

💡 Astuce — La page d'interface est un point d'entrée idéal pour des tableaux de bord métier qui ne correspondent à aucun type de document existant.

Accéder à la page

Les pages d'interface apparaissent dans le menu latéral, sous le nom de page que vous avez défini. Elles sont également accessibles via une URL de la forme /app/[nom-de-page].

Par exemple, la page « Tableau de bord logistique » sera disponible à l'adresse /app/tableau-de-bord-logistique.

Limitations et bonnes pratiques

• Les pages d'interface sont conçues pour des écrans libres ; elles ne remplacent pas les formulaires standards lorsque vous devez gérer un cycle de vie de document (soumission, annulation, versioning).
• Le code de la page est isolé (island) afin de garantir que ses dépendances JavaScript ne polluent pas le reste du bureau.
• Privilégiez des pages courtes et ciblées plutôt qu'une seule page d'interface géante.

Références techniques

:::dokos Les pages d'interface reposent sur le mécanisme d'islands du framework. Une page déclarée avec le type « Frappe UI » est automatiquement construite comme une île (island) lors du bundling. Cela signifie que ses assets sont compilés séparément et chargés à la demande, ce qui améliore les performances de l'application. :::