Árbol de páginas

Versiones comparadas

Clave

  • Se ha añadido esta línea.
  • Se ha eliminado esta línea.
  • El formato se ha cambiado.

...

El layout general para el área de gestión tiene un comportamiento líquido ocupando toda el área disponible de la pantalla. Se distribuirá en las siguientes áreas de navegación y visualización de información:

Image RemovedImage Added

Cabecera

Área siempre visible en pantalla, se divide en tres áreas según su ubicación horizontal:

  • Logomarca: Compuesta por el símbolo de Hércules + Logo de la universidad. Se ubica siempre a la izquierda de la cabecera.
  • Selector Título de módulo: Elemento de interacción desplegable que permite seleccionar un módulo para operar con él. Se muestra siempre ocupando la posición central de la cabecera.rotulado que indica con texto el módulo actual seleccionado.
  • Herramientas de usuario: Agrupación de iconos que darán acceso a determinadas funcionalidades ligadas al usuario, por definir, entre ellas ya  modo de propuesta:
    • Analítica de datos
    • Mi perfil
    • ConfiguraciónAcceso directo de creación de entidades cross-módulo: Mostrará un listado de enlaces a las páginas de creación a las que tiene acceso el usuario, agrupadas en columnas por módulo. Se mostrará en rollover. Esta funcionalidad es una nueva propuesta que debe ser verificada.
    • Tareas / To Do's
    • Avisos y alertas 
    • Analítica de datos
    • Mi perfil
    • ConfiguraciónSelector de módulo: Funcionalidad que mostrará un área para la selección del módulo para aquellos roles que dispongan del acceso a varios módulos de gestión. Se presentará de forma diferenciada al resto de elementos iconográficos que representan las herramientas.

Área de trabajo

Ocupa el espacio inferior de la pantalla bajo la cabecera y está destinada a mostrar el módulo seleccionado y activo. El área de trabajo podrá ser dividida en función de las necesidades funcionales de cada módulo. Estas divisiones se definen a nivel estructural en:

  • Sidenav izquierdo: Menú de navegación que da acceso a las entidades principales del módulo y permite la navegación entre entidades principales. 
  • Espacio de trabajo: Espacio central en el que se desarrolla el trabajo de manejo del sistema a través de entidades de formularios, listados y resto de componentes necesarios. En este área de trabajo se identifican como elementos tipificados:
    • Breadcrumb: Migas de pan que indican la ubicación de la pantalla en relación a la secuencia de navegación del módulo.
    • Titulo de página / Sección: Elemento de título
    • Pestañas / TabsMenú lateral: Componente de navegación horizontal vertical que permite navegar entre agrupaciones de campos de la entidad, listados o entidades secundarias.
    • Contenido: Área para la visualización y manejo de formularios, listados y componentes.
    • Acciones: Espacio para la ubicación de enlaces a acciones principales del contenido de la entidad principal seleccionada (Guardar, Cancelar, etc) 
    Sidenav derecho: Menú de navegación entre subentidades externas vinculadas a la entidad actual.

Elementos y componentes

Cabecera

...

Elemento de identidad situado en la parte izquierda de la cabecera que mostrará el logomarca de Hércules y el logotipo de la universidad.

Selector de módulos

Rótulo principal


Image AddedImage Removed


Será un componente elemento de tipo desplegable rotulado que permitirá seleccionar identificará el módulo activo entre los módulos a los que tiene acceso el usuario y que recargará todo el área de trabajo.

Herramientas de usuario



Será un listado horizontal de iconos que dará acceso a diversas herramientas del SGI


Selector de módulo


Image Added


Elemento de interacción que se situará en el extremo derecho de la cabecera y que dará acceso a la selección de módulos para aquellos roles de usuario que dispongan de varios módulos de gestión asociados.

Área de trabajo

Sidenav izquierdo

Menú


Image Added

Se contempla un menú vertical que ocupará el sidenav izquierdo. Cada elemento de menú será presentado por un icono, un texto descriptivo de la función/sección y un icono que da acceso a la función de desplegable, mostrando las subfunciones/subsecciones del elemento de menú de primer nivel. El submenú que se despliega tras esta interacción mostrará un listado de subelementos de menú con un texto descriptivo clickable que dará acceso a la subfunción/subsección y un icono de alta de nuevo registro asociado a la entidad relacionada. Las acciones de navegación de este menú cargarán el contenido en el Espacio de trabajo.

...

  • el estado de modificación del contenido de la pestaña y si ese contenido se ha guardado. Es decir, si un usuario modifica el valor de algún campo de un formulario en una pestaña o crea y/o modifica algún registro de una entidad subrogada que se muestra como listado en el contenido de una pestaña, se mostrará este icono de aviso de modificación de datos, para que el usuario sea consciente de que debe realizar un guardado general de la entidad principal. 
  • el estado de validación de los datos, que indicaría si los datos de esta pestaña presentan errores de validación tras el intento de guardado de la entidad
Menú vertical 

Image Added


Bajo el titular puede existir un componente de navegación vertical presentado en formato de menú desplegable. Este componente posibilitará la navegación entre grupos de campos de una entidad, si su número o complejidad así lo requieren, así como entre listados y entidades dependientes o subrogadas a la entidad principal.

Cada elemento de menú incluirá un texto descriptivo y podrá tener un estado (activo / inactivo) en función de si el contenido de esa pestaña está en el foco de interacción del usuario. 

Cada elemento de este menú podrá ser desplegable, con la posibilidad de mostrar, tras interactuar en el área de despliegue, nuevos elemento de menú correspondientes a una segunda agrupación de campos, listados o entidades secundarias vinculadas.

Adicionalmente un elemento de menú podrá mostrar un icono en su parte derecha, que podrá indicar dos estados:

  • el estado de modificación del contenido de la pestaña y si ese contenido se ha guardado. Es decir, si un usuario modifica el valor de algún campo de un formulario en una pestaña o crea y/o modifica algún registro de una entidad subrogada que se muestra como listado en el contenido de una pestaña, se mostrará este icono de aviso de modificación de datos, para que el usuario sea consciente de que debe realizar un guardado general de la entidad principal. 
  • el estado de validación de los datos, que indicaría si los datos de esta pestaña presentan errores de validación tras el intento de guardado de la entidad
Listados y tablas


En el espacio de trabajo se visualizarán listados de registros y tablas. Estos listados podrán presentar los siguientes componentes o funciones:

...

  • Tooltip de área de acciones inferior: Se mostrará a la derecha de los botones de acción principal en la Área de acciones y mostrará un icono de aviso y un texto informativo.

Sidenav derecho

...