Tableaux: Difference between revisions

From Documentation de la solution web de gestion OpenFlyers
Jump to navigation Jump to search
imported>Ltremblet
No edit summary
imported>Ltremblet
(Contenu remplacé par « __TOC__ =Présentation= L'objet de cette page est de présenter les '''tableaux''' de la version 4 d'OpenFlyers. =Aspect= =[[OF_Table4_... »)
Line 5: Line 5:
=[[OF_Table4_Layout|Aspect]]=
=[[OF_Table4_Layout|Aspect]]=
=[[OF_Table4_Use|Utilisation]]=
=[[OF_Table4_Use|Utilisation]]=
==Général==
Un tableau est composé des éléments suivants :
===Colonne fixe===
*La '''colonne fixe''' est située à gauche du tableau. Elle est de couleur foncée.
*Elle présente tout ou partie des éléments suivants :
**Titre du tableau
**[[#Ordonnancement|Déplacement de ligne]].
**[[#Ajout.2Fsuppression_de_ligne|Ajout/suppression de ligne]].
**Titres de lignes.
===Partie droite===
La '''partie droite''' comporte les '''colonnes de contenu''' du tableau.
''Vue d'ensemble d'un tableau :''
[[File:Table4-1-generic.png]]
==Adaptation à la taille de l'écran==
L'aspect du tableau s'adapte à la taille de l'écran sur lequel il s'affiche :
*La '''colonne fixe''' de gauche reste toujours visible.
*Les dimensions du tableau '''s'adaptent'''. Si des lignes sont plus longues que la largeur du tableau, ou si le nombre de lignes excède la hauteur de celui-ci, il est possible de faire '''coulisser''' le contenu avec les [[Wikipedia-fr:barres de défilement|barres de défilement]] afin d'accéder à toutes les données.
===Aspect initial===
Aspect initial d'un tableau dont les contenus excèdent la largeur et la hauteur de l'écran. Des '''barres de défilement''' sont présentes.
[[File:Planning4-14-coulissement.png]]
===Largeur en excès===
La '''partie droite''' du tableau (titres + cellules) coulisse sous la colonne fixe lorsqu'on utilise la '''barre de défilement horizontal'''.
[[File:Planning4-15-coulissement.png]]
===Hauteur en excès===
Les titres de colonnes – colonne fixe + partie droite – restent figés. Les '''lignes''' coulissent en-dessous de ceux-ci lorsqu'on utilise la '''barre de défilement vertical'''.
[[File:Planning4-16-coulissement.png]]
=Tableau à onglets=
*Certains tableaux comportent plusieurs sections accessibles par '''onglets'''.
*L''''onglet actif''' est matérialisé par un fond blanc.
*Cliquer sur les noms grisé sur fond écru afin d'activer les onglets correspondants.
[[File:OF4-ddt-tabs.png]]
=Tableaux à pages=
==Principe général==
*Les cellules de certains tableaux peuvent '''imbriquer''' un autre tableau sous la forme d'un lien.
*L'intérêt est de pouvoir '''modifier une liste de choix''' disponibles pour une cellule de tableau, tout en conservant un '''lien''' avec le tableau initial. Ceci garantit une''' navigation aisée''' entre différentes sources de données.
*Un tableau imbriqué peut lui-même contenir des cellules imbriquant un tableau, etc. Les niveaux d'imbrications des tableaux sont '''infinis'''.
*Le '''nombre de pages''' visibles augmente au fur et à mesure que l'utilisateur clique sur les liens ouvrant d'autres tableaux. En quelque sorte, l'utilisateur ''zoome'' à l'intérieur des données. Plus le tableau comporte de pages, plus l'utilisateur zoome loin.
==Aspect==
*Un tableau à pages est identifié par une '''zone de navigation''' située au-dessus de lui. Cette zone comporte :
**Le titre de la page courante.
**Le numéro de la page courante.
**Le nombre de pages.
**Des flèches de navigation à gauche et à droite, permettant de naviguer d'un tableau à un autre.
*Les cellules imbriquant un tableau sont identifiées par le '''pictogramme édition de tableau''' : [[File:Of4-picto-ddt-edit.png]].
==Principe général==
*La '''navigation''' entre les tableaux se fait par '''pages'''.
*La '''zone de navigation''' est située au-dessus du tableau et comporte les éléments suivants :
**Au centre : La page courante, son titre, le nombre total de pages, sont indiqués sous la forme : '''N° de la page courante/Nbre de pages + Nom de la page courante'''.
**À gauche et à droite : '''flèches''' de navigation, permettant de naviguer vers un tableau imbriqué ou de revenir au tableau principal.
==Exemple de fonctionnement==
===1re page===
*Au chargement de la page, la '''première page''' ''Types de ressources''. Elle est numérotée 1/1.
*Les '''flèches de navigation''' sont transparentes car on n'a pas encore navigué dans les autres pages.
*Un clic sur le '''pictogramme d'édition de tableau''' ''places disponibles'' permet d'accéder au tableau imbriqué.
[[File:Table4-17-pagination.png]]
===2ème page===
*Le tableau imbriqué ''places disponibles'' s'affiche et constitue la deuxième page. Le '''nombre total de pages''' passe à 2.
*La '''flèche de gauche''' devient visible. Le nom du tableau précédent est écrit à côté. Un clic sur cette zone permet de repasser à la page 1.
*Si l'on modifie les places disponible dans ce tableau, la cellule correspondante de la page 1 présentera la liste de choix mise à jour.
*Le tableau 2 comporte des cellules imbriquant elles-mêmes un tableau.
[[File:Table4-18-pagination.png]]
===3ème page===
*Un clic sur le '''pictogramme d'édition de tableau''' ''Liste'' ouvre un nouveau niveau d'imbrication : le tableau des ''Statuts''.
*Le troisième tableau ''Statuts'' s'affiche et le '''nombre total de pages''' passe à 3.
*La '''flèche de gauche''' permet de revenir au tableau 2.
[[File:Table4-19-pagination.png]]
===Retour aux pages 1 et 2===
*Le tableau comporte dorénavant 3 pages : ''Types des ressources'', ''Places disponibles'' et ''Status''.
*Il est possible de '''naviguer''' entre ces pages.
*Lorsqu'on revient à la page 1, celle-ci affiche un '''nombre total de pages''' égal à 3. La '''flèche de droite''' est visible et porte le nom du tableau de la page 2.
*Sur le même principe, la page 2 affiche un '''nombre total de page''' égal à 3. Les '''flèches de gauche et de droite''' permettent d'aller vers les pages 1 et 2.
[[File:Table4-20-pagination.png]]
[[File:Table4-21-pagination.png]]
=Ordonnancement=
*Dans certains tableaux, il est possible de changer l''''ordre des lignes''', en intervenant sur leur '''position'''.
*L'ordre défini dans un tableau a des '''conséquences sur l'affichage''' d'une autre page de l'application. Par ex. : l'ordre que définit l'utilisateur dans le ''tableau des ressources'' s'applique dans le ''planning des ressources''.
*Pour changer la '''position''' d'une ligne :
#Cliquer sur le '''pictogramme''' [[File:OF4-grab.png]].
#'''Relâcher''' que lorsque la ligne se dispose à la position souhaité.
#Un '''témoin''' sous forme d'une ligne bleu foncé indique l'emplacement de destination.
[[File:Table4-8-move.png]]
=Ajout/suppression de ligne=
Dans certains tableaux, il est possible d''''ajouter et/ou de supprimer''' des lignes. Ces actions s'effectuent grâce au '''pictogramme des options de ligne'''.
==Pictogramme des options de ligne==
*Le '''pictogramme des options de ligne''' est situé dans la colonne fixe du tableau.
*Il est représenté de cette manière : [[File:Table4-9-row-options.png]].
*Il comporte un groupe d'items s'affichant dans une [[ModalWindow4#Info-bulle|info-bulle]] en fonction des contextes ci-dessous.
==Ajout de ligne==
*'''Survoler''' le pictogramme des options de ligne.
*Une '''bulle de dialogue''' s'ouvre.
*Cliquer sur l''''item''' souhaité :
**'''Ajouter une ligne au-dessus''' : ajoute une ligne au-dessus de la ligne courante.
**'''Ajouter une ligne en-dessous''' : ajoute une ligne en-dessous de la ligne courante.
*Une '''nouvelle ligne''' est créée. Ses champs sont vides. Les [[#Champ_requis|champs requis]] sont signalés.
==Enregistrement d'une ligne==
**L''''enregistrement''' s'effectue lorsque les [[#Champ_requis|champs requis]] sont complétés.
**Si les champs requis ne sont pas complétés, le [[#Pictogramme_des_options_de_ligne|pictogramme des options de ligne]] présente au survol un seul item : '''Annuler la création de ligne''', qui permet de supprimer immédiatement la nouvelle ligne incomplète.
[[File:Table4-10-row-options-delete.png]]
==Suppression de ligne==
*'''Survoler''' le pictogramme des options de ligne.
*Une '''bulle de dialogue''' s'ouvre.
*Cliquer sur l''''item''' : '''Supprimer la ligne'''.
=Édition des données=
==Mise à jour instantanée==
La mise à jour des données d'un tableau ne nécessite aucun rechargement de page. Celle-ci est instantanée.
==Principe général==
Pour éditer des données, '''cliquer sur une cellule'''.
La cellule en cours d'édition change d'état : elle entre en mode '''focus''' et prend un contour pointillé.
[[File:Table4-16-focus.png]]
Selon le [[#Modes_d.27.C3.A9dition|mode d'édition]], d'autres changements d'états se produisent, afin d'optimiser la saisie en fonction du contenu.
La ligne en cours d'édition ou ayant subi des modifications prend un fond plus foncé.
[[File:Table4-2-edit-modify.png]]
==Navigation entre les cellules==
La touche '''tab''' permet de passer d'une cellule à une autre :
*'''tab :''' champ suivant
*'''shift + tab :''' champ précédent
==Champ requis==
*Certaines données sont '''requises''' pour que l'enregistrement d'une ligne soit effectué.
*Les champs restant incomplets ou vides sont signalés par un pictogramme représentant un [[Alert4#Alerte_sous_forme_de_pictogramme|pictogramme d'alerte]] orange :
**A la place du champ incomplet, afin de savoir quel est le champ concerné.
**Dans le cas d'un tableau à onglets, à côté de l'onglet dans lequel la ligne est incomplète, afin de repérer l'onglet contenant le champ concerné.
[[File:Table4-11-required-line.png]]
[[File:Table4-12-required-thumbnail.png]]
==Modes d'édition==
===Dans la cellule===
*'''Champ de texte :''' le champ se met en surbrillance.
[[File:Table4-3-edit-input.png]]
*'''Case à cocher :'''
[[File:Table4-4-edit-checkbox.png]]
===Dans une fenêtre de dialogue===
Afin d'éditer certains types de contenus, la saisie s'effectue dans une [[OF_ModalWindow4|fenêtre de dialogue]] :
*[[OF_ModalWindow4#Texte_long|Texte long]]
*[[OF_ModalWindow4#Choix_unique|Choix unique]]
*[[OF_ModalWindow4#Choix_multiples|Choix multiples]]
=Fonctionnalités particulières=
==Pointage==
Certains tableaux présentent un mode '''Pointage''', qui permet d'enregistrer définitivement des données. Ce mode est inactif par défaut.
''Exemples de tableaux : comptabilité, activités.''
===Inactif===
En bas de tableau, un bouton bleu '''Pointer''' est présent. On clique dessus pour entrer dans le mode '''Pointage'''.
[[File:Of4-ddt-point-1.png]]
===Actif===
*Le bouton '''Pointer''' est remplacé par un texte simple à côté duquel on trouve une icône permettant de sortir du mode ''Pointer''.
*Un bouton '''Valider''' apparaît. Il est alors dans un état ''inactif'' : bouton plat gris avec texte en gris, peu de contraste.
[[File:Of4-ddt-point-2.png]]
*La sélection d'une ou plusieurs lignes du DDT rend le bouton '''Valider''' ''actif''.
[[File:Of4-ddt-point-3.png]]
*Dans le tableau, les '''lignes sélectionnées''' deviennent légèrement plus foncées.
===Ligne non validée/validée===
*Une ligne '''non validée''' s'affiche en italique.
[[File:Table4-ddt-1-pointage.png]]
*Lorsque le pointage est effectué, chaque ligne concernée est considérée comme '''validée'''. Son texte s'affiche alors en gras.
[[File:Table4-ddt-2-pointage.png]]
==Comptabilité==
Les tableaux spécifiques à la comptabilité présentent :
*Des '''sous-totaux'''.
*Des '''excédents''' (en vert).
*Des '''déficits''' (en rouge).
[[File:Table4-13-accountancy.png]]
*La fonctionnalité de [[#Pointage|pointage]].

Revision as of 12:22, 15 October 2014

Présentation

L'objet de cette page est de présenter les tableaux de la version 4 d'OpenFlyers.

Aspect

Utilisation

Retrieved from "https://doc4-fr-mirror.openflyers.com/index.php?title=Tableaux&oldid=4408"