Personnalisation de l'interface

Identité visuelle

Dokos propose dans ses Paramètres ( Paramètre de la barre de navigation ) de personnaliser l'interface pour l'adapter au mieux à vos besoins.

• Remplacez le logo Dokos par le vôtre
• Ajoutez un widget d'annonce pour diffuser des messages à toute l'équipe

Tableaux de bord et statistiques

Dokos propose de nombreux outils de visualisation :

• Cartes statistiques (près de 100 préexistantes)
• Graphiques de tableau de bord
• Cartes de résumé (particulièrement utiles pour les moyennes et grandes entreprises)

Types de documents personnalisés

Dokos vous offre la possibilité de créer vos propres types de documents adaptés à vos besoins spécifiques. Par exemple :

• Un document "annonce" pour publier des offres
• Un formulaire web pour permettre des réservations
• Des documents interconnectés pour suivre votre processus métier

À noter : Les personnalisations que vous effectuez (ajout/suppression de champs) ne seront jamais écrasées lors des mises à jour.

Totaux et montants sur les liens du tableau de bord

Exemple — Maison Verte SARL Sur la fiche client de Maison Verte SARL, le tableau de bord affiche non seulement le nombre de factures de vente, mais aussi le total facturé (4 800,00 €) et le montant encore dû (1 200,00 €). Le commercial voit en un coup d'œil la situation financière du client sans ouvrir chaque facture.

Le tableau de bord d'une fiche (client, fournisseur, article…) affiche des liens vers les documents liés avec, en option, des totaux monétaires calculés à la volée. Cette configuration est réservée aux administrateurs et développeurs : elle se définit dans le fichier de configuration du tableau de bord du type de formulaire concerné.

"summary_fields": {
    "Sales Invoice": {
        "field": "net_total",
        "label": _("Total Billed"),
        "fieldtype": "Currency",
        "open_field": "outstanding_amount",
        "open_label": _("Outstanding"),
        "open_filters": {"docstatus": 1, "outstanding_amount": [">", 0]},
    },
}

Icônes sur les types de formulaires

Exemple — Dupont Conseil L'administrateur de Dupont Conseil crée un type de formulaire personnalisé "Dossier client" et lui attribue l'icône folder. Partout où un lien vers ce formulaire apparaît dans l'interface — champs de recherche, listes liées, résultats de recherche globale — une petite icône dossier s'affiche à gauche pour distinguer visuellement ce type de document.

Chaque type de formulaire dans Dokos peut recevoir une icône issue de la bibliothèque d'icônes Frappe. Cette icône s'affiche à gauche des champs de saisie qui pointent vers ce formulaire, aidant les utilisateurs à identifier le type de document associé sans lire le nom complet.

Modification en masse dans les tables enfants

Exemple — Maison Verte SARL Un gestionnaire saisit un bon de commande pour Maison Verte SARL avec vingt lignes d'articles. Il réalise que la date de livraison prévue est incorrecte sur dix d'entre elles. Au lieu de corriger chaque ligne une par une, il coche les dix lignes concernées, clique sur Modifier, saisit la nouvelle date une seule fois, et toutes les lignes sélectionnées sont mises à jour instantanément.

Lorsqu'un formulaire contient une table enfant (lignes d'articles, plannings, etc.), il est possible de modifier plusieurs lignes simultanément. Cette fonctionnalité évite les saisies répétitives et réduit les risques d'erreur.

Comment l'utiliser

1. Ouvrez le document concerné (bon de commande, facture, feuille de temps…).
2. Dans la table enfant, cochez les cases à gauche des lignes à modifier.
3. Un bouton Modifier (icône crayon) apparaît dans la barre d'outils de la table.
4. Cliquez sur Modifier : une fenêtre s'ouvre avec les champs modifiables.
5. Renseignez uniquement les champs à changer — les champs laissés vides ne seront pas affectés.
6. Cliquez sur Mettre à jour : toutes les lignes sélectionnées sont mises à jour dans le formulaire.
7. Enregistrez le document pour valider les changements.

Bon à savoir : Sur un document déjà soumis, seuls les champs autorisés à la modification après soumission apparaissent dans la fenêtre de modification en masse.

Activer ou désactiver cette option

Par défaut, la modification en masse est activée sur toutes les tables enfants. Un administrateur peut la désactiver champ par champ depuis Personnaliser le formulaire :

1. Allez dans Personnaliser le formulaire (menu Configuration ou barre de recherche).
2. Sélectionnez le type de formulaire concerné (ex. Bon de commande).
3. Repérez le champ de type Table correspondant à la table enfant.
4. Décochez l'option Autoriser la modification en masse.
5. Cliquez sur Mettre à jour.

Largeur des colonnes dans la vue liste

Exemple — Bureau Moderne La responsable achats de Bureau Moderne consulte la liste des bons de commande. La colonne "Fournisseur" est trop étroite et tronque les noms. Elle fait glisser le bord de la colonne vers la droite pour l'élargir : la largeur est sauvegardée automatiquement et restera en place à chaque prochaine ouverture de la liste.

Dans toutes les vues liste de Dokos, vous pouvez ajuster la largeur de chaque colonne selon vos préférences. Ces réglages sont personnels et persistent d'une session à l'autre.

Trois façons d'ajuster les largeurs

      
flowchart LR
    A[Largeur définie\nsur le champ] -->|priorité basse| B[Paramètres\nde la vue liste]
    B -->|priorité moyenne| C[Glisser-déposer\ndans l'en-tête]
    C -->|priorité haute| D[Largeur affichée]

    

1. Glisser-déposer directement dans l'en-tête de liste

C'est la méthode la plus rapide pour un ajustement ponctuel :

1. Positionnez le pointeur sur le séparateur vertical entre deux en-têtes de colonne — une fine poignée apparaît.
2. Cliquez et faites glisser vers la gauche ou la droite pour modifier la largeur.
3. Relâchez : la nouvelle largeur est enregistrée automatiquement dans les Paramètres de la vue liste.

Bon à savoir : Les poignées de redimensionnement sont toujours légèrement visibles au repos. Survolez la ligne d'en-têtes pour les faire apparaître toutes en même temps. Survolez directement une poignée pour la mettre en évidence.

2. Paramètres de la vue liste

Pour régler les largeurs de plusieurs colonnes à la fois :

1. Cliquez sur le menu ⋮ (en haut à droite de la liste) puis sur Paramètres de la vue liste.
2. Dans le dialogue, la colonne Largeur (px) apparaît à côté de chaque champ affiché.
3. Saisissez la valeur souhaitée en pixels (minimum 50 px, maximum 400 px).
4. Cliquez sur Enregistrer.

3. Définition sur le champ (administrateurs)

Un administrateur peut définir une largeur par défaut directement sur un champ depuis Personnaliser le formulaire. Cette valeur s'applique à tous les utilisateurs qui n'ont pas encore défini leur propre réglage.

Contraintes

Masquer des colonnes dans la vue liste d'une grille par script

Exemple — Maison Verte SARL Sur le bon de commande de Maison Verte SARL, la grille des articles affiche par défaut la colonne "Taux unitaire". Un développeur souhaite la masquer uniquement dans cette grille, sans affecter d'autres formulaires utilisant le même type de ligne d'article. Grâce à set_column_disp_in_list_view, la colonne disparaît de la vue liste de cette grille uniquement, et reste visible partout ailleurs.

Dans un formulaire Dokos, une grille (table enfant) peut afficher ses lignes sous deux formes : la vue liste (lecture seule, affichage condensé des lignes) et la vue édition (formulaire d'une ligne). Il est parfois utile de masquer une colonne dans la vue liste d'une grille précise, sans impacter les autres grilles qui partagent le même type de document enfant.

cur_frm.fields_dict["nom_de_la_table"].grid.set_column_disp_in_list_view(fieldname, show);

// Dans le script client du bon de commande
frappe.ui.form.on("Sales Order", {
    refresh(frm) {
        frm.fields_dict["items"].grid.set_column_disp_in_list_view("rate", false);
    }
});