CeRTAE ProtoExt¶
CeRTAE ProtoExt est une application web qui propose une approche basée sur la méthode DATARUN. Cette approche consiste à réaliser les interfaces d’une application par la construction de vues à partir d’un modèle de données standard.
Cette documentation présente un guide pour les utilisateurs de cette application.
Table de matière¶
La structure de l’interface¶
Organisation de l’interface¶
Figure 1 : Organisation de l’interface de l’application.
L’interface de l’application ProtoExt est organisée en plusieurs zones, qui sont :
La grille principale¶
La grille principale, au centre de l’interface, sert à afficher le contenu des objets sélectionnés dans le menu principal.
Figure 4 : grille principale de l’application.
Les onglets¶
Figure 5 : exemple d’onglets.
Les onglets correspondent à la liste des objets ouverts à partir du menu principal. Chaque fois qu’un objet est ouvert, un nouvel onglet apparaîtra. Vous pouvez vous déplacer d’un contenu à l’autre en cliquant sur son onglet. La grille principale affichera le contenu de l’onglet sélectionné.
Plusieurs onglets peuvent être ouverts en même temps, mais il est déconseillé d’ouvrir plus de six à la fois, car cela pourrait avoir un effet sur la mémoire et ralentir l’application.
La grille¶
Figure 8 : contenu de la grille
Le centre de la grille principale sert à afficher le contenu de l’objet de l’onglet actif.
Vous pouvez naviguer entre les pages et personnaliser le nombre de résultats par page à partir de la barre en dessous de la grille.
La barre d’états¶
Figure 11 : Barre d’états.
La barre d’états est divisée en deux parties :
la barre de message :¶
L’application du prototypeur communique avec l’utilisateur par l’entremise de la barre de messages pour confirmer une opération ou envoyer un message d’erreur. Les messages d’erreur sont affichés en utilisant une police en couleur rouge.
Figure 12 : exemple de message
Dans la figure ci-dessus, le message montre l’exécution de l’opération « doModelPrototype ».
Figure 13 : exemple de message d’erreur.
Exemple de message d’erreur : problème de communication avec le serveur.
Les boutons :¶
Figure 14 : Boutons de la barre d’états.
- Le premier bouton permet de fermer tous les onglets ouverts et vider la mémoire cache.
- Le deuxième bouton affiche le nom de l’utilisateur, vous pouvez cliquer sur la flèche noire de ce bouton pour accéder au bouton de fermeture de session.
La configuration de l’application¶
Formulaire¶
À partir de cette option, vous pouvez personnaliser le formulaire qui s’affiche pour le menu d’édition.
Figure 24 : Option formulaire du menu configuration.
La fenêtre du formulaire est organisée en trois grandes sections :
Les éléments du formulaire :
Figure 25 : la fenêtre des éléments du formulaire.
Les éléments du formulaire (côté haut-gauche de la fenêtre) affichent dans une arborescence les champs actifs sur les formulaires d’édition.
À partir de cette fenêtre, il est possible de personnaliser l’affichage et l’ordre d’apparition de champs sur le formulaire. L’ordre d’apparition de champs est défini selon la position de l’objet dans l’arborescence. Il est possible aussi de regrouper les champs à l’intérieur des contenants de type « Fieldset » ou « HTMLset ».
les icônes de cette fenêtre sont :
- : pour enregistrer les modifications du formulaire.
- : pour rafraîchir l’aperçu du formulaire (côté droit de la fenêtre)
- : pour supprimer un objet dans l’arborescence.
- : pour cacher la fenêtre des éléments du formulaire de l’interface.
- : icône attribuée aux champs.
- : icône attribuée aux contenants de type fieldset et HTMLset.
Les outils du formulaire :
Figure 26 : les outils du formulaire.
La fenêtre des outils (Tools) du formulaire (côté bas-gauche de la fenêtre, donne accès aux outils permettant de créer et de personnaliser un formulaire. Les outils sont organisés dans une arborescence où ils se retrouvent les champs, les contenants et les détails pour une vue.
L’onglet des propriétés (Properties) donne accès aux propriétés de personnalisation de l’objet sélectionné dans la fenêtre des éléments.
Pour l’onglet Outils :
- Fields ( Champs ) :
Le dossier Fields contient la liste complète des champs pour l’objet sélectionné ( un projet, un modèle, une entité, une propriété, une relation ou une vue). Dans le cas d’une vue, les champs correspondent aux propriétés ou attributs des entités crées par l’utilisateur. On y retrouve aussi des champs crées par l’application du prototypeur comme la date de la dernière modification, le nombre de l’équipe ou groupe à qui appartient le projet, etc.
- Containers ( Contenants ):
Le dossier Containers est composé de deux types de contenants qui servent à regrouper plusieurs champs dans le formulaire.
- Un contenant de type Fieldset crée un contour autour des champs.
- Un contenant de type HTMLset c’est un éditeur de texte HTML. Le contenant HTMLset s’utilise pour les champs de type de base « texte » que stockent des chaînes de 65, 535 caractères maximum.
- Details ( Détails ) :
Le dossier Détails contient les détails configurés pour les projets, les modèles, les entités, les propriétés et les relations. Quand un détail est ajouté au formulaire, ce détail s’affiche dans la forme d’une grille.
Note
voir annexe pour la signification des champs de l’onglet Propriétés.
- L’aperçu du formulaire :
L’espace réservé à l’aperçu du formulaire (côté droit de la fenêtre) permet de prévisualiser les modifications appliquées au formulaire. Les modifications sont affichées en temps réel, cela veut dire que si vous changez l’ordre des champs ou que vous regroupez plusieurs champs dans un fieldset, vous verrez dans l’espace de l’aperçu le résultat final quasi instantanément.
Personnaliser les formulaires¶
Personnaliser un contenant de type Fieldset :
Figure 27 : Personnaliser un contenant de type Fieldset.
- Sélectionnez le fieldset à personnaliser de l’arborescence.
- Cliquez sur l’onglet « Properties » de la fenêtre Outils du formulaire.
- Éditez les valeurs des propriétés en double-cliquant sur les champs pour les modifier. Enregistrez les changements au formulaire en cliquant sur le bouton Enregistrer formulaire.
Ajouter des éléments au formulaire :
Figure 28 : Ajouter des éléments au formulaire.
- Ajouter un champ dans un fieldset :
- Cliquez sur l’onglet Tools de la fenêtre Outils du formulaire.
- Cliquez sur le plus « + » situé du côté gauche du dossier « Fields » pour visualiser la liste de champs disponibles.
- Sélectionnez de la liste le champ à ajouter au fieldset.
- Glissez et déposez le champ à l’intérieur du fieldset.
- Enregistrez les changements au formulaire en cliquant sur le bouton .
- Ajouter un contenant fieldset ou HTMLset :
- Cliquez sur l’onglet Tools de la fenêtre Outils du formulaire.
- Cliquez sur le plus « + » situé du côté gauche du dossier « Containers » pour visualiser la liste de contenants disponibles.
- Sélectionnez de la liste le type de contenant à ajouter à l’arborescence.
- Glissez et déposez le contenant à l’endroit désiré de l’arborescence. Notez qu’il est possible d’insérer un contenant à l’intérieur d’un autre contenant.
- Enregistrez les changements au formulaire en cliquant sur le bouton .
- Ajouter un détail à l’arborescence :
Les détails prennent automatiquement la forme d’une grille (comme la grille principale de l’application). La grille n’est pas personnalisable à partir de la fenêtre formulaire.
- Cliquez sur l’onglet Tools de la fenêtre Outils du formulaire.
- Cliquez sur le plus « + » situé du côté gauche du dossier « Details » pour visualiser la liste de détails disponibles.
- Sélectionnez de la liste le détail à ajouter à l’arborescence.
- Glissez et déposez le contenant à l’endroit désiré de l’arborescence.
- Enregistrez les changements au formulaire en cliquant sur le bouton .
Personnaliser les champs du formulaire :
Figure 29 : personnaliser les champs.
- Sélectionnez le champ à personnaliser.
- Cliquez sur l’onglet Properties de la fenêtre Outils du formulaire.
- Éditez les valeurs des propriétés et enregistrez les changements au formulaire en cliquant sur le bouton .
Note
voir annexe pour la signification des champs de l’onglet Propriétés.
- Changer l’ordre d’apparition des champs du formulaire :
- sélectionnez le champ;
- glissez-le jusqu’au l’emplacement désiré dans le même contenant;
- vous pouvez déplacer un champ d’un contenant à l’autre de la même façon.
Champs¶
L’option champs permet d’activer/désactiver les champs de la définition de la Méta. Toutes les vues ont un sous-ensemble de champs activés par défaut, mais il est possible de les activer ou les désactiver dans la définition de la Méta. Les absorptions des champs qui se retrouvent dans les entités qui ont une relation avec l’entité principale (qui prend le rôle de parent) se font dans cette même fenêtre. Il est possible aussi d’activer des champs de type gestion comme la date de la dernière modification, la date de création ou modifié par.
Figure 30 : option champs du menu de configuration.
Activer ou désactiver les champs de la Méta¶
Figure 31 : liste de champs.
- Pour activer ou désactiver les champs, cochez ou décochez la case située à gauche du champ.
- L’icône du dossier représente un autre objet en relation avec l’objet courant et signifie que d’autres champs se trouvent à l’intérieur de ce dossier.
- Pour montrer les champs d’un dossier, cliquez sur le triangle blanc situé à gauche de l’icône dossier.
- Dans la Figue 31, la meta pour l’entité contient le nom (code) du modèle à qui elle appartient.
- Enregistrez les changements en cliquant sur le bouton avant de quitter la fenêtre.
- Vous pouvez ajouter un nouveau champ, en cliquant sur le bouton en haut du formulaire.
- Cochez ce champ et enregistrer pour l’activer dans la meta.
Détails¶
L’option Détails permet d’activer/désactiver les détails de la définition de la meta. Un détail est un sous-ensemble d’attributs d’une entité enfant.
Figure 32 : option détails du menu.
La navigation se fait à partir d’une entité enfant en cliquant sur un des détails disponibles dans l’entité parente.
Dans toutes le vues, tous les détails sont activés par défaut, mais il est possible de les activer ou les désactiver dans la définition de la meta.
Les détails d’une entité sont accessibles à partir de la barre navigation (Figure 23).
Figure 33 : détails d’une vue affichés dans la barre de navigation.
Configuration¶
L’option configuration donne accès au sous-ensemble de propriétés de personnalisation de base. Cette option est visible pour les utilisateurs qui ont des droits d’accès limités à l’application.
Figure 35 : option configuration du menu.
Afficher ou cacher des colonnes de la grille¶
Figure 36 : afficher/cacher les champs
- Cliquez sur la propriété « listDisplay » de la liste.
- Pour afficher ou cacher des champs de la grille, cochez ou décochez la case située à gauche du nom du champ.
- Enregistrez les changements en cliquant sur le bouton .
Changer l’ordre d’apparition des colonnes sur la grille¶
Figure 37 : changer l’ordre d’apparition des champs
- Cliquez sur la propriété « listDisplay » de la liste.
- Glissez et déposez le champ vers le haut ou vers le bas.
- Enregistrez les changements en cliquant sur le bouton .
Définir différentes configurations de colonnes¶
ListDisplaySet : à vérifier le fonctionnement.
Définir les critères de recherche pour la fonction rechercher¶
- Cliquez sur la propriété « filtersSet » de la liste.
- Cliquez sur le bouton pour ajouter un nouveau filtre.
- Entrez le nom de la colonne.
- Enregistrez les changements en cliquant sur le bouton .
- Pour supprimer un tri sélectionnez-le et cliquez sur le bouton .
Définir les critères de tri pour la fonction classer¶
- Cliquez sur la propriété « SortersSet » de la liste.
- Cliquez sur le bouton pour ajouter un nouveau tri.
- Entrez le nom de la colonne.
- Enregistrez les changements en cliquant sur le bouton .
- Pour supprimer un tri sélectionnez-le et cliquez sur le bouton .
Méta¶
Cette option permet la configuration de la Méta.
Figure 38 : option Méta du menu.
Si vous cliquez sur une composante de la Méta (côté gauche de la Figure 38), les propriétés s’affichent sur le côté droit.
Configuration de la Méta¶
Pour changer, la configuration de la Méta :
- Sélectionnez la Méta (le dossier racine).
- La liste des propriétés s’affiche à droite.
- Changer les propriétés voulues, certaines sont non modifiables.
- Cliquez sur pour enregistrer.
Note
voir annexe pour la signification des propriétés.
Configuration des champs¶
Pour changer la configuration d’un champ :
- Double-cliquez sur fieldsBase ou fieldsAdmin pour afficher leurs contenus:
- fieldsBase : contient les attributs de base de l’entité.
- fieldsAdm : contient les clés étrangères de l’entité.
- Sélectionnez le champ à modifier.
- La liste des propriétés s’affiche à droite.
- Changer les propriétés voulues, certaines sont non modifiables.
- Cliquez sur pour enregistrer.
Note
voir annexe pour la signification des propriétés.
Configuration des actions¶
actions : contient les actions définies sur l’objet courant (qui sont les actions de la fonction actions du menu des fonctions).
En cliquant sur cette composante, le bouton d’ajout apparait, mais pour le moment les actions doivent être définies dans le modèle django.
Double-cliquez sur ce dossier pour afficher la liste des actions de l’objet.
Note
voir annexe pour la signification des propriétés.
Configuration des détails¶
detailsConfig : liste des objets auxquels on peut naviguer à partir de l’objet courant (voir détails).
Note
voir annexe pour la signification des champs.
Configuration des templates HTML¶
sheetConfig : permet de définir des templates HTML.
Pour définir un nouveau template :
- cliquez sur sheetConfig;
- cliquez sur puis entrer le nom du nouveau template;
- ou double-cliquez sur sheetConfig pour accéder aux templates définis;
- sélectionnez le template;
- la liste des propriétés s’affiche à droite;
- modifiez le template en modifiant les propriétés;
- cliquez sur pour enregistrer;
- pour supprimer un template, Sélectionnez-le et cliquez sur ;
- cliquez sur pour enregistrer.
Note
voir annexe pour la signification des propriétés.
Configuration de la grille¶
gridConfig : à partir de cette option vous pouvez configurer la grille principale.
Cliquez sur gridConfig pour accéder à ses propriétés ;
- la liste des propriétés s’affiche à droite;
- changer les propriétés voulues, certaines sont non modifiables;
- cliquez sur pour enregistrer.
Note
voir annexe pour la signification des propriétés.
Double-cliquez sur gridConfig pour à accéder aux sous-options :
- listDisplay : sert à personnaliser l’affichage et l’ordre d’apparition de champs sur la grille.
- baseFilter : permet de définir des filtres de bases qui peuvent être utilisés pour la fonction Rechercher.
- initialFilter : permet de définir le filtre initial qui est utilisé pour la grille par défaut.
- initialSort : permet de configurer l’ordre d’apparition (ascendante ou descendante) pour un champ de la grille. Quand la grille est chargée, elle affiche son contenu ordonné par le champ configuré avec initialSort. Les valeurs possibles sont: ASC ou DESC.
- searchFields : sert à choisir les champs qui seront pris en compte au moment de faire une recherche sur le contenu de la grille. Cette propriété est utilisée avec la propriété « searchable » d’un champ.
- sortFields : sert à choisir les champs qui seront pris en compte au moment de faire le classement du contenu de la grille. Cette propriété est utilisée avec la propriété « sortable » d’un champ.
- hiddenFields : sélectionnez les champs pour les cacher de la grille. Notez que cette fonctionnalité cache un champ à l’affichage, elle ne l’efface pas de l’application.
- readOnlyFields : sélectionnez les champs pour les rendre non modifiables par l’utilisateur.
Pour listDisplay, searchFields, sortFields, hiddenFields et readOnlyFields :
- sélectionnez l’une de ces options;
- activer ou desactiver les champs;
- cliquez sur pour enregistrer.
Pour baseFilter, initialFilter et initialSort :
- sélectionnez l’une de ces options;
- le bouton s’affiche en haut à côté du ;
- cliquez sur ce bouton et entrez le nom de la colonne à ajouter aux filtres ou aux tris;
- cliquez sur pour enregistrer;
- pour supprimer un filtre ou un tri, sélectionner-le et cliquez sur ;
- cliquez sur pour enregistrer.
Pour gridSets : même rôle que l’option configuration.
Configuration des formulaires¶
formConfig : personnalise la présentation du formulaire. Le formulaire peut être personnalisé à partir de deux endroits: formConfig dans l’option Méta ou dans l’option formulaire du menu de configuration. On vous recommande de vous servir de l’option formulaire parce qu’elle est plus conviviale pour la personnalisation.
Configuration des propriétés des utilisateurs¶
usrDefProps : propriétés définies par l’utilisateur.
Note
voir annexe pour la signification des propriétés.
Configuration par les simples utilisateurs¶
custom : voir l’option configuration.
Configuration des règles d’affaires¶
businessRules : option non fonctionnelle pour le moment. Elle sera utilisée pour définir les règles d’affaires à partir de l’application.
Prototypage¶
Démarche et pratiques du prototypage¶
La conception du MCD (modèle conceptuel de données) est une phase préliminaire au processus de prototypage. Une fois réalisée, il suffit de suivre les étapes suivantes, pour créer votre prototype :
Enregistrement du modèle¶
Pour enregistrer un nouveau modèle dans l’application, vous devez le créer ou l’importer.
Importation d’un modèle existant¶
- À partir de l’onglet Projet, créer ou sélectionner un projet existant;
- Cliquer sur Actions du menu de fonctions;
- Choisr une des deux options (doImportSchema ou doImportOMS) selon le modèle à importer.
Création d’un nouveau modèle¶
Les pages suivantes expliquent étape par étape la procédure de création d’un nouveau modèle :
La première étape pour construire un prototype consiste à créer un nouveau projet qui contiendra le modèle conceptuel de données. Le modèle de données peut aussi être créé à l’intérieur d’un projet existant. Un projet peut contenir un ou plusieurs modèles.
Si vous utilisez un projet existant, vous pouvez passer à l’étape suivante : créer un modèle .
Figure 39 : créer un projet.
- À partir du menu principal, cliquez deux fois sur Projet dans le dossier Pototype pour ouvrir l’onglet Projet.
- Cliquez sur le bouton Ajouter.
- Dans le formulaire ouvert, remplissez :
- le nom du projet (information obligatoire);
- la description du projet (information optionnelle).
- Cliquez sur le bouton Enregistrer de la fenêtre.
Quand vous cliquez sur le bouton Enregistrer, la grille « Modèle filtré par ” ” » située après le nom du projet affiche les contrôles d’édition (voir figure 40). Il est possible d’ajouter un modèle à partir de cette grille en cliquant sur le bouton Ajouter du menu d’édition.
C’est une de deux façons d’ajouter un modèle dans un projet. Passez à l’étape « créer un modèle » pour continuer avec la démarche.
Figure 40 : ajout du modèle à partir du projet.
La deuxième étape pour construire notre prototype est la création du modèle. Vous pouvez créer un modèle dans un nouveau projet ou le créer à l’intérieur d’un projet existant. Un modèle de données peut être rattaché à un seul projet, mais un projet peut contenir plusieurs modèles.
Il y a deux façons de créer un nouveau modèle que nous allons explorer ci-bas :
Figure 42 : créer un modèle détails.
- À partir du formulaire du projet, cliquez sur le bouton Ajouter de la grille « Modèles du projet ».
- Un nouveau formulaire (comme celui de la figure 42) s’affichera dans l’interface.
- Dans le formulaire, remplissez :
- le nom du modèle (information obligatoire)
- la description du modèle (information optionnelle).
- Cliquez sur le bouton Enregistrer de la fenêtre.
Notez dans les deux façons présentées ici, quand vous cliquez sur le bouton Enregistrer, la grille « Entité filtrés par ” ” » située après le nom du projet affiche les contrôles d’édition (voir figure 43). À partir de cette grille, il est possible d’ajouter des entités en cliquant sur le bouton Ajouter du menu d’édition.
Ceci est une de deux façons d’ajouter des entités dans un projet. Passez à l’étape créer une entité pour continuer avec la démarche.
Figure 43 : ajout d’une entité à partir du modèle.
La troisième étape de la construction de notre prototype est la création des entités.
Il y a deux façons de créer les entités d’un modèle que nous allons explorer ci-bas :
Figure 45 : ajouter une entité détails
- À partir du formulaire du modèle, cliquez sur le bouton Ajouter de la grille « entités du modèle ».
- Un nouveau formulaire (comme celui de la figure 45) s’affichera dans l’interface.
- Dans le formulaire, remplissez :
- le nom de l’entité (information obligatoire).
- la description de l’entité (information optionnelle).
- Cliquez sur le bouton Enregistrer de la fenêtre.
Notez dans les deux façons présentées dans ce texte que quand vous cliquez sur le bouton Enregistrer, la grille « Propriétés filtrés par ” ” » située après le nom du modèle affiche les contrôles d’édition (voir figure 46). À partir de cette grille, il est possible d’ajouter les propriétés d’une entité en cliquant sur le bouton Ajouter du menu d’édition.
Ceci est une de deux façons d’ajouter les propriétés d’une entité. Passez à l’étape créer une propriété. : pour continuer avec la démarche.
Figure 46 : ajout d’une propriété à partir de l’entité.
La quatrième étape pour construire notre prototype est la création des propriétés des entités.
Il y a deux façons de créer les propriétés d’une entité que nous allons explorer ci-bas :
Figure 48 : créer une propriété détails.
- À partir du formulaire de l’entité, cliquez sur le bouton Ajouter de la grille « propriétés filtrées par ” ” » ;
- Un nouveau formulaire (comme celui de la figure à gauche) s’affichera dans l’interface ;
- Dans le formulaire, remplissez les parties comme dans la partie précédente.
- Cliquez sur le bouton Enregistrer de la fenêtre.
Notez dans la deuxième façon présentée dans ce texte que quand vous cliquez sur le bouton Enregistrer, la grille « Relation filtrées par ” “» située en bas de la grille « Propriétés filtrées par ” “» affiche les contrôles d’édition (voir figure 49). À partir de cette grille, il est possible de créer les relations entre les entités en cliquant sur le bouton Ajouter du menu d’édition.
Ceci est une de deux façons de créer les relations entre les entités. Passez à l’étape créer les relations entre les entités pour continuer avec la démarche.
Figure 49 : ajout d’une relation à partir de la propriété.
La cinquième étape pour construire un prototype consiste à créer les relations entre les entités du modèle. Les relations peuvent être créées à partir de l’entité enfant vers l’entité parente ou vice-versa. Les clés étrangères sont générées automatiquement par l’application du prototypeur au moment de créer la relation entre deux entités.
De la même manière que dans les étapes précédentes, il y a deux façons de créer les relations entre les entités.
Figure 51 : créer une relation.
- À partir du formulaire de l’entité, cliquez sur le bouton Ajouter de la grille « relations filtrées par ” ” ».
- Un nouveau formulaire (comme celui de la figure à gauche) s’affichera dans l’interface.
- Dans le formulaire, remplissez les informations comme dans la partie précédente.
- Cliquez sur le bouton Enregistrer de la fenêtre.
Maintenant que votre modèle est complet, nous allons voir comment générer le prototype et alimenter le modèle.
Génération du modèle conceptuel graphique¶
L’application vous permet de visualiser le modèle entré sous forme graphique :
À partir de l’onglet Modèle, sélectionnez le modèle à générer.
Cliquez sur le bouton Actions du menu des fonctions.
Cliquez sur l’option doModelGraph . Un message de confirmation de l’opération sera affiché sur la barre de message.
Le modèle graphique généré est ouvert dans un nouvel onglet de votre fureteur sous forme d’un fichier PDF.
Figure 52 : fonction Exécuter et son sous-menu.
L’action doModelGraph génère le modèle conceptuel graphique pour un modèle sélectionné.
Formalisme du modèle graphique¶
Figure 53 : formalisme du modèle graphique.
- Clé primaire : la police du texte est grasse et sa couleur est noire. Exemples dans la figure : numero_ligne, numero_produit et date_expedition.
- Clé étrangère : la police du texte est italique et sa couleur est gris pâle. Le nom de son entité enfant apparait du côté droit du nom de la clé (exemple : li_prt -> produit ou cde_fact -> facture).
- Clé étrangère dépendante (obligatoire) : la police du texte est grasse et sa couleur est noire. Le nom de son entité enfant apparait du côté droit du nom de la clé (exemple : li_cde -> commande).
- Clé étrangère requise (obligatoire) : la police du texte est grasse et sa couleur est gris pâle. Le nom de son entité enfant apparait du côté droit du nom de la clé (exemple : pdt_fam -> famille).
- Propriété : la police du texte est en italique et sa couleur est gris pâle (exemples dans la figure : prix_vente, qte_vendue et prix_production).
- Propriété requise (obligatoire) : la police du texte est grasse et sa couleur est gris pâle (exemples : nom_produit et numero_commande).
- Relation dépendante (obligatoire) : la flèche est pleine.
- Entité parent : la flèche pointe vers l’entité parent.
Générer le prototype¶
Avant de commencer à enregistrer des informations dans votre modèle, il faut générer le prototype correspondant.
Vous pouvez générer un prototype pour un modèle au complet ou pour certaines de ses entités.
Générer un prototype pour un modèle :¶
Figure 54 : fonction Actions et son sous-menu pour le modèle.
L’action doModelPrototype génère le prototype pour un modèle sélectionné.
- À partir de l’onglet Modèle, sélectionnez le modèle à générer.
- Cliquez sur le bouton Actions du menu des fonctions.
- Cliquez sur l’option doModelPrototype. Un message de confirmation de l’opération sera affiché sur la barre de message.
- Réinitialiser le menu principal en cliquant sur le bouton pour faire apparaître les vues récemment créées. Le nouveau prototype est placé dans AutoMenu –> ProtoOptions –> nom_du_projet –> nom_du_modèle.
Note
Les nouvelles vues sont générées automatiquement à l’intérieur de l’arborescence AutoMenu -> ProtoOptions. Notez que les vues des prototypes antérieures sont aussi affichées avec les vues récemment créées. Une vue est créée pour chaque entité dans le modèle de données. Vous aurez le même nombre de vues que des entités. Les noms des vues sont composés du nom du modèle suivi d’un tiret (-) et du nom de l’entité qu’elle représente.
- Les vues dans l’arborescence AutoMenu -> ProtoOptions sont de vues générées automatiquement, si vous effectuez des modifications sur ces vues, la prochaine fois que le menu principal sera rafraîchi, les vues retourneront à leur valeur par défaut. Pour garder les modifications des vues, il est nécessaire de créer un nouveau dossier sur l’arborescence du menu principal. Si vous avez déjà créé un dossier pour le projet, glissez la nouvelle vue à l’intérieur de ce dossier. Dans le cas contraire, passez aux prochaines étapes.
- Cliquez sur le bouton Nouveau dossier du menu principal. Entrez le nom du nouveau dossier, par exemple le nom du projet. Le nouveau dossier apparaîtra à la fin de la liste des vues générées dans AutoMenu -> ProtoOptions.
- Procédez à glisser-déposer à l’intérieur de ce dossier chacune de vues appartenant à ce projet. Sélectionnez une vue à la fois.
- Quand toutes les vues seront à l’intérieur du dossier, glissez et déposez le dossier vers l’arborescence du menu principal. Par exemple, après la composante relation. Assurez-vous que le dossier se retrouve à l’extérieur de l’arborescence AutoMenu.
- Sélectionnez AutoMenu et cliquez sur le bouton Supprimer noeud du menu principal. Ceci effacera l’arborescence d’AutoMenu (la suppression n’est pas définitive, pour récupérer cette arborescence cliquez sur le bouton réinitialiser du menu principal).
- Pour terminer, cliquez sur le bouton Enregistrer du menu principal.
Avertissement
Si vous n’enregistrez pas les modifications du menu, elles seront perdues à la fermeture de l’application du prototypeur.
Créer ou copier une vue pour une entité (concept):¶
Il existe trois façons pour créer une nouvelle vue :
avec l’action doEntityPrototype :
Figure 55 : fonction Actions et son sous-menu pour l’entité.
L’action doEntityPrototype génère le prototype pour une entité sélectionnée.
- À partir de l’onglet Entité, sélectionnez l’entité à générer.
- Cliquez sur le bouton Actions du menu des fonctions.
- Entrer un nom pour cette vue du prototype ;
- Cliquez sur l’option doEntityPrototype. Un message de confirmation de l’opération sera affiché sur l’interface la barre de message.
- Réinitialiser le menu pour faire apparaître la vue récemment créée.
Note
Les nouvelles vues sont générées automatiquement à l’intérieur de l’arborescence AutoMenu -> ProtoOptions. Notez que les vues des prototypes antérieures sont aussi affichées avec les vues récemment créées. Une vue est créée pour chaque entité dans le modèle de données. Vous aurez le même nombre de vues que des entités. Les noms des vues sont composés du nom du modèle suivi d’un tiret (-) et du nom de l’entité qu’elle représente.
- Les vues dans l’arborescence AutoMenu -> ProtoOptions sont de vues générées automatiquement, si vous effectuez des modifications sur ces vues, la prochaine fois que le menu principal sera rafraîchi, les vues retourneront à leur valeur par défaut. Pour garder les modifications des vues, il est nécessaire de créer un nouveau répertoire sur l’arborescence du menu principal. Si vous avez déjà créé un dossier pour le projet, glissez la nouvelle vue à l’intérieur de ce dossier. Dans le cas contraire, passez aux prochaines étapes.
- Cliquez sur le bouton Nouveau dossier du menu principal. Entrez le nom du nouveau dossier, par exemple le nom du projet. Le nouveau dossier apparaîtra à la fin de la liste des vues générées.
- Procédez à glisser-déposer à l’intérieur du dossier chacune de vues appartenant à ce projet. Sélectionnez une vue à la fois.
- Quand toutes les vues seront à l’intérieur du dossier, glissez et déposez le dossier vers l’arborescence du menu principal. Par exemple, après la composante relation. Assurez-vous que le dossier se retrouve à l’extérieur de l’arborescence AutoMenu.
- Sélectionnez AutoMenu et cliquez sur le bouton Supprimer noeud du menu principal. Ceci effacera l’arborescence d’AutoMenu (la suppression n’est pas définitive, pour récupérer cette arborescence cliquez sur le bouton réinitialiser du menu principal).
- Pour terminer, cliquez sur le bouton Enregistrer du menu principal.
Avertissement
Si vous n’enregistrez pas les modifications du menu, elles seront perdues à la fermeture de l’application du prototypeur.
- à partir du Menu principal :
À partir du menu principal, sélectionnez le dossier où vous voulez placer la nouvelle vue, cliquez sur pour créer une nouvelle vue.
Remplir les champs avec :
- text : le nom de la vue;
- option : cherchez l’entité à partir de la liste des options;
- iconCls : nom de l’icône;
- qtip : pour créer un tooltip (infobulle).
- qtitle : pour le titre à afficher lorsque la vue est ouverte dans la grille principale.
Les deux premiers champs sont obligatoires, les autres sont optionnels.
- par la copie d’une vue existante :
Vous pouvez copier une vue existante avec ses configurations, à partir du menu des configurations :
- double-cliquez sur la vue à copier pour l’ouvrir dans un onglet;
- sélectionner Configuration => Méta;
- cliquez sur le nom de la vue en haut de l’arborescence de la méta pour afficher les options à droite;
- dans l’option viewCode, entrez le nouveau nom de la vue;
- cliquez sur le bouton enregistrer;
- le nom complet sera affiché en haut de la fenêtre de configuration de la Méta (exemple ProtoLib.userFiles.nomDeLaVue);
- réinitialiser le menu pour faire apparaître la vue récemment créée;
- la nouvelle vue sera placée dans un dossier donné par le nom complet dans AutoMenu => ProtoViews. Pour notre exemple, la vue sera placée dans AutoMenu => ProtoViews => ProtoLib => userFiles => ViewCode;
- déplacer la vue hos dossier AutoMenu avant de quitter et enregistrer pour ne pas perdre vos modifications, car le dossier AutoMenu est généré automatiquement.
Alimenter la base de données :¶
- Sélectionnez une vue ;
- cliquez sur ajouter ;
- remplir les champs requis et enregistrer.
Le Workflow¶
De façon pratique, le workflow sert à décrire le circuit de validation, les tâches à répartir entre les différents acteurs d’un processus, les délais, les modes de validation, et à fournir à chacun des acteurs les informations nécessaires à l’exécution de sa tâche. [1]
Dans notre application, un workflow permet aux administrateurs la validation des ajouts et modifications faits par les utilisateurs.
Activer le Workflow¶
Pour activer le Workflow sur une entité, il faut que la classe dans le modèle ait un attribut _workflow (non configurable à partir de l’application) ;
Vérifier les Workflows en attente¶
Deux façons pour vérifier et accepter les workflows en attente de validation :
La fonction Filtres : disponible à partir du menu des fonctions pour les vues qui ont un attribut workflow.
Vous pouvez accepter ou refuser la modification par le biais des boutons Accepter ou Refuser de la fonction Actions sur le même menu.
L’action doWFlowResume : disponible à partir du menu des fonctions pour les vues Wflow Admin Resume de l’application protoLib.
Pour cette dernière, vous devez avoir les droits pour l’application protoLib et ajouter un nouvel enregistrement dans la table ParametersBase, avec les paramètres suivants :
- parameterKey : wflow;
- parameterTag : I;
- parameterValue : nom_du_modèle.nom_de_l_entité.
L’action doWflowResume permet de voir tous les workflows sur toutes les entités/vues tandis que la fonction Filtres permet de voir seulement les workflow sur la vue ouverte.
[1] | wikipedia |
Applications¶
ProtoLib¶
Cette application définit les concepts additionnels pour compléter la structure de Django pour les besoins génériques de l’application, dont, la sécurité. Elle permet de gérer les propriétés dynamiques du prototypage et offre les services de soutien à la gestion générique des vues.
TeamHierarchy¶
La classe TeamHierachy définit la hiérarchie des groupes des utilisateurs.
Les attributs de cette classe sont :
- code : nom du groupe (clé primaire);
- description : une description du groupe (optionnelle);
- parentNode : clé étrangère vers le groupe parent du nouveau groupe (non obligatoire);
- site : site du groupe (optionnel).
UserProfile¶
La classe UserProfile définit le profil des utilisateurs.
Les attributs de cette classe sont :
- user : clé étrangère obligatoire vers un utilisateur (user de django)
- userTeam : clé étrangère vers un groupe de TeamHierarchy (optionnelle);
- langage : par défaut la langue de l’application est le français. Les langues disponibles sont :français : fr, anglais : en, espagnol :es.
- userTree : les équipes auxquelles appartient l’utilisateur.
ProtoModel¶
Cette classe est une classe abstraite, elle implantée par plusieurs autres classes. Ses attributs seront automatiquement mis à jour par l’application.
Les attributs de cette classe sont :
- smOwningUser : utilisateur propriétaire de l’objet;
- smOwningTeam : le groupe auquel appartient l’utilisateur;
- smCreatedBy : utilisateur qui a créé l’objet;
- smModifiedBy : le dernier utilisateur qui a modifié l’objet;
- smRegStatus :
- smWflowStatus : statut de workflow (I : à verifier, OK : accepté, R : refusé);
- smCreatedOn : date de création de l’objet;
- smModifiedOn : date de la dernière modification de l’objet;
- _protoObj :
ProtoDefinition¶
Cette table stocke la définition des PCIs et des menus pour chaque vue :
Les attributs de cette classe sont :
- code : nom de l’objet (obligatoire);
- description : description (optionnel);
- metaDefinition : contient la définition de la Méta;
- active : booléen qui indique si l’objet est actif ou non;
- overWrite : booléen qui était utilisé pour des fins de tests (non utile actuellement).
CustomDefinition¶
Cette classe hérite de la classe ProtoModel. Elle contient la définition du menu pour chaque groupe.
Les attributs de cette classe sont :
- code : nom de l’objet (obligatoire);
- description : description (optionnel);
- metaDefinition : contient la définition de la Méta;
- active : booléen qui indique si l’objet est actif ou non;
- overWrite : booléen qui était utilisé pour des fins de tests (non utile actuellement).
UserFiles¶
La classe UserFile sert à définir les documents des utilisateurs (fonctionnement pas encore testé).
Les attributs de cette classe sont :
- docfile : champs de type Field qui définit le fichier.
DiscreteValue¶
La classe DiscretValue permet de définir des valeurs discrètes où la définition d’une table n’est pas vraiment utile.
Les attributs de cette classe sont :
- code : la valeur de l’objet (obligatoire);
- value : la valeur de l’objet (obligatoire);
- description : description (optionnelle)
- title : clé étrangère vers un autre objet DiscreteValue.
ParametersBase¶
Cette classe hérite de la classe ProtoModel, elle sert à configurer des paramètres de Bases. Pour le moment, elle permet seulement l’activation de workflow pour les entités qui ont cet attribut.
Pour activer le workflow, initialiser les paramètres avec :
- parameterKey : wflow
- parameterTag : I
- parameterValue : nom_du_modèle.nom_de_l_entité
PtFunction¶
Cette classe sera utilisée pour créer des fonctions à partir de l’application. Ce qui permettra de définir les règles d’affaires à partir de l’application (pas encore fonctionnelle).
Les attributs de cette classe sont :
- code : nom de la fonction obligatoire;
- modelName : nom du modèle obligatoire;
- arguments : liste des paramètres séparés par des virgules;
- functionBody : corps de la fonction;
- tag : le tag de la fonction;
- description : description de la fonction (optionnelle).
WflowAdminResume¶
Cette classe hérite de la classe ProtoModel. Elle contient le dernier résumé des nouvelles qui requièrent une action de l’administrateur.
Les attributs de cette classe sont :
- viewEntity : nom de l’entité sur laquelle le workflow est activé;
- activityCount : nombre de workflows en attente sur l’entité (rempli automatiquement).
WflowUserReponse¶
Cette classe hérite de la classe ProtoModel. Elle contient les résultats des actions de l’administrateur :
Les attributs de cette classe sont :
- viewEntity : nom de l’entité sur laquelle le workflow est activé;
- wfAction : action (accepter ou refuser);
- strKey : la raison de refus;
- adminMsg : message de l’administrateur qui sera envoyé à l’utilisateur.
Prototype¶
Cette application définit les concepts pour créer un prototype.
Project¶
La classe qui représente un projet, elle hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- code : nom du projet obligatoire;
- description : optionnelle.
Les attributs ci-dessous sont optionnels et définit les paramètres pour la base de données du projet :
- dbEngine : type de la base de données;
- dbName : nom de la base de données;
- dbUser : nom d’utilisateur de la BD;
- dbPassword : mot de passe pour la BD;
- dbHost : nom de l’hôte;
- dbPort : numéro de port.
Model¶
La classe qui représente un modèle, elle hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- project : nom du projet auquel appartient le modèle;
- code : nom du modèle (obligatoire);
- category : catégorie du modèle (optionnelle);
- modelPrefix : préfixe à ajouter au nom du modèle (optionnel);
- description : optionnelle.
Entity¶
La classe qui représente une entité (concept), elle hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- model : nom du modèle auquel appartient l’entité
- code : nom de l’entité;
- dbName : nom de l’entité dans la BD;
- description : optionnelle.
Property¶
La classe qui représente les propriétés d’une entité, elle hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- entity : nom du modèle à laquelle appartient l’entité;
- code : nom de la propriété;
- baseType : type de base de la propriété. Par défaut c’est string;
- prpLength : pour définir une longueur pour le champ;
- prpScale : nombre de positions après la virgule pour un chiffre;
- vType : type de validation;
- prpDefault : valeur par défaut (peut varier selon les cas);
- prpChoices : liste de choix pour les propriétés dont le baseType est combo;
- isSensitive : booléen qui indique si oui ou non la propriété requiert un niveau de sécurité plus élevé;
- description : description optionnelle;
- notes :
- isPrimary : booléen qui indique si oui ou non la propriété est une clé primaire;
- isLookUpResult : booléen qui indique si oui ou non la propriété est visible dans les résultats de la fonction rechercher;
- isNullable : booléen qui indique que la propriété peut être nulle ou non;
- isRequired : booléen qui indique que la propriété est requise ou non;
- isReadOnly : booléen qui indique que la propriété est en lecture seule (non modifiable à partir de l’application);
- isEssential : booléen qui indique si la propriété doit sortir dans la vue;
- isForeign : booléen qui indique si oui ou non la propriété est une clé étrangère;
- crudType : liste de choix pour type d’édition (editable, screenOnly, storeOnly, etc...);
- dbName : nom de la propriété dans la BD.
Relationship¶
Cette classe hérite les propriétés de la classe Property. Elle définit les relations entre les concepts (entités). Ses attributs sont :
- refEntity : nom de l’entité enfant;
- relatedName : nom de la relation ;
- baseMin : cardinalité (baseMin >= refMin);
- baseMax : cardinalité (baseMax <= refMax);
- refMin : référence minimale pour la relation (0 : pour une relation 0 N);
- refMax : référence maximale pour la relation (N : pour une relation 0 N);
- onRefDelete :
- typeRelation :
PropertyEquivalence¶
Cette classe indique l’équivalence entre deux propriétés. Elle hérite les propriétés de la classe ProtoModel. Ses attributs sont :
- sourceProperty : la première propriété (obligatoire).
- targetProperty : la deuxième propriété (obligatoire).
- description : description (optionnelle).
Prototype¶
Cette classe hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- entity : nom de l’entité ;
- code : nom du prototype ;
- description : description optionnelle ;
- notes :
- metaDefinition : la Méta.
ProtoTable¶
Cette classe hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- entity : nom de l’entité ;
- info :
- objects :
Diagram¶
Cette classe définit les diagrammes d’un projet, elle hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- project : clé étrangère du projet représenté par le diagramme;
- code : nom du diagramme (obligatoire);
- description : description (optionnelle);
- notes : notes (optionnelle);
- title : titre du diagramme (optionnelle);
- prefix :
- graphLevel : entier qui indique le niveau de représentation ( ‘all’, ‘essential’, ‘required’ , ‘primary’, ‘title’, etc. )
- grphMode : entier qui indique le mode de représentation ( record, htmlTable, graph );
- graphForm : entier qui indique le formalisme de représentation (ObjetRealational, ER, DataRun);
- showPrpType : si vrai, affiche le type de la propriété;
- showBorder : si vrai, affiche le borders;
- showFKey : affiche les clés étrangères.
- info :
- objects :
DiagramEntity¶
Cette classe définit les diagrammes d’une entité, elle hérite les propriétés de la classe ProtoModel dans le modèle ProtoLib. Ses attributs sont :
- diagram : nom du diagramme auquel appartient le diagramme DigramEntity.
- entity : entité représentée par le diagramme;
- info :
- objects :
Annexes¶
Index des champs¶
Champs : | Signification : |
---|---|
autoscroll : | si vrai, défilement automatique du formulaire. |
afterCellUpdate : | règle d’affaires à exécuter après la mise à jour d’une cellule. |
afterRowDelete : | règle d’affaires à exécuter après la suppression d’une ligne. |
afterSave : | règle d’affaires à exécuter après une sauvegarde. |
border : | bordure du formulaire en pixels. |
beforeCellEdit : | règle d’affaires à exécuter avant la suppression d’une cellule. |
beforeCellUpdate : | règle d’affaires à exécuter avant la mise à jour d’une cellule. |
beforeOpSave : | règle d’affaires avant l’enregistrement de l’opération. |
beforeRowDelelte : | règle d’affaires à exécuter avant la suppression d’une ligne. |
beforeRowInsert : | règle d’affaires à exécuter avant l’ajout d’une ligne. |
beforeValidate : | règle d’affaires avant la validation de l’opération. |
collapsible : | transforme le contenant en un contenant pliable/dépliable. Un bouton avec un triangle noir apparaitra dans la place où se trouve le contenant. |
collapsed : | spécifie si à l’ouverture du formulaire le contenant sera par défaut plié ou déplié. |
cellLink : | la cellule est un lien (True, False). |
choices : | liste de choix possible pour la propriété. |
conceptDetail : | le nom de l’entité détail. |
cpFromField : | |
cpFromZoom : | |
crudType : | liste de choix pour la propriété (crud : create, read, update, delete). |
dblClick : | règle d’affaires pour le double clique. |
description : | courte description. |
detailField : | |
detailName : | nom de l’attribut dans le modèle. |
detailTitleField : | |
detailTitleLabel : | |
detailTitleLabel : | booléen qui sert à activer ou désactiver la fonctionnalité d’exportation en format CSV. |
fieldLabel : | étiquette du champ dans le formulaire ou la grille. |
fkField : | |
fkId : | |
flex : | valeur numérique (pourcentage %) que définit la largeur des colonnes de la grille principale. Flex fait un calcul par rapport à la taille de l’écran et ajuste la largeur de la colonne en conséquence. Pour y accéder cliquez deux fois sur le champ valeur de cette propriété. |
Format : | |
fsLayout : | structure du formulaire (fluid, 1, 2 ou 3 colonnes). |
getLinkFilter : | règle d’affaires pour récupérer une requête. |
header : | l’entête de cette propriété dans la grille principale. |
height : | hauteur en pixels. |
hidden : | propriété cachée. |
hideLabel : | si vrai, les étiquettes seront cachées du formulaire. |
hideRowNumbers : | booléen qui sert à afficher ou cacher les numéros de lignes sur la grille. |
helpPath : | un lien (par exemple vers un wiki sur la propriété). |
idProperty : | propriété qui est la clé primaire (souvent c’est le id). |
issRowLoad : | règle d’affaires lors d’un chargement d’une instance. |
jsonField : | definit un champ au format JSON. |
localSort : | |
labelAlign : | alignement des étiquettes dans le formulaire. |
labelWidth : | largeur des étiquettes dans le formulaire. |
metaversion : | la version de la Méta (non modifiable à partir de l’application). |
masterField : | |
masterTitleField : | |
menuText : | le titre dans l’entête de la grille. |
maxWidth : | largeur maximale en pixels. |
maxHeight : | hauteur maximale en pixels. |
minWidth : | largeur minimale en pixels. |
minHeight : | hauteur minimale en pixels. |
name : | nom de la propriété dans le modèle (non modifiable). |
pageSize : | nombre de résultats par page par défaut c’est 50. |
pciStyle : | le style de la PCI (grid pour grille, form pour formulaire et tree pour le menu principal) |
pciType : | |
protoEntity : | le nom de l’entité dans la table protoTable. |
protoEntityId : | l’id de l’entité dans la table protoTable. |
physicalName : | |
primary : | la propriété est une clé primaire. |
prpDefault : | valeur par défaut. |
prpLength : | longueur du champ. |
prpScale : | nombre de positions après la virgule pour un chiffre. |
returnField : | champ non utilisé à effacer de l’interface ; |
readOnly : | si vrai, la propriété non modifiable par l’utilisateur. |
required : | si vrai, la propriété est obligatoire. |
reposition : | règle d’affaires pour le déplacement des instances dans la grille principale. |
sheetSelector : | le sheet (template) à utiliser. |
shortTitle : | titre à afficher sur la grille. |
updateTime : | date de la dernière mise à jour. |
userVersion : | si l’utilisateur veut définir des versions pour ses prototypes sur application. |
viewCode : | nom de la vue. Si vide vue principale. |
viewEntity : | nom de la classe dans le modèle (non modifiable à partir de l’application). |
viewIcon : | nom de l’icône utilisé. |
searchable : | si oui, les valeurs de cette propriété peut être recherchée (à partir de la fonction rechercher). |
sortable : | si oui, la grille principale peut être triée par ce champ (à partir de la fonction classer). |
title : | ajoute un titre au contour du fieldset. |
tooltip : | infobulle : chaîne de caractères qui crée un message dans la forme d’une infobulle quand la souris passe sur le champ. Utilisé pour offrir plus des informations concernant le champ. Pour y accéder, double-cliquer sur le champ valeur de cette propriété. |
type : | type du champ. |
validationComplete : | règle d’affaires pour la validation complète des modifications. |
vType : | type de validation pour le type du champ. |
wordWrap : | valeur booléenne qui permet de visualiser le contenu du champ en plusieurs lignes. Propriété utilisée avec les propriétés de type texte ou de type string (quand la chaîne est très longue). Pour y accéder, double-cliquez sur le champ valeur de cette propriété. |
xtype : | |
zoomFilter : | |
zoomModel : | |
zoomMultiple : | |
zoomConfigure : | |
zoomreturn : | |
__ptType : | type de l’objet (PCI, fieldsBase, fieldAdm, etc...) |