Dependencies

Cada componente (criterio, grilla, gráfico, etc) puede tener algunas dependencias dentro de su comportamiento y contenido. Una dependencia puede ser lanzada dependiendo de las condiciones o eventos de los componentes.

caution

The element must have the component attribute to make it work. Si el elemento no tiene el atributo del componente, el sistema de dependencias ganó ́t funcionar correctamente.

Esqueleto de XML

<dependency initial="[initial]" source-type="[source-type]" target-type="[target-type]" 
            server-action="[server-action]" target-action="[target-action]" 
            label="[label-to-update]" value="[value]" formule="[formule]" 
            type="[type]" invert="[invert]" async="[async]" silent="[silent]">
  <dependency-element ... />
  ...
  <dependency-action .../>
  ...
</dependency>

Estructura de dependencias

Elemento	Uso	Varias instancias	Descripción
dependency	Required	No	Nodo global de la dependencia. Define los atributos de dependencia
dependency-element	Required	Si	Condición para lanzar la dependencia
dependency-action	Optional	Si	Action which will be launched if dependency conditions are valid

Atributos de dependencias

Atributo	Uso	Tipo	Descripción	Valores
initial	Opcional	Boolean	Dependencia se lanzará al cargar la página	Default value is false
source-type	Opcional	String	Fuente de dependencias (donde se tomarán los datos)	See source types. Default value is none
target-type	Opcional	String	Destino de dependencias (donde se aplicará la dependencia)	See target types. Default value is none
server-action	Opcional	String	Server action call (when source-type is query)	See server action list
target-action	Opcional	String	Target to call on the server / Name of the criterion, to get its value, when source-type is launcher
label	Opcional	String	Etiqueta a aplicar al objetivo	Note: You can use i18n files (locales)
value	Opcional	String	Valor a aplicar al objetivo
formule	Opcional	String	Formular para obtener el valor que se aplicará al objetivo
type	Opcional	String	How to evaluate the conditions	Possible values are and (default) and or.
invert	Opcional	Boolean	Invert the condition evaluation	Default value is false
async	Opcional	Boolean	Ejecutar la acción del servidor de forma asincrónica	Default value is false
silent	Opcional	Boolean	Ejecutar la acción del servidor sin mostrar la barra de carga	Default value is false

Tipo de fuente

The source-type attribute refers to the place from we are retrieving the data to apply to the component.

Value	Descripción
none	No hacer nada (no recuperar valores)
query	Ejecutar una consulta para recuperar valores
launcher	Get the values from the stored alias defined in target-action
value	Get the values from the value attribute defined on the dependency
label	Get the values from the label attribute defined on the dependency (can be a i18n local)
formule	Get the values from a evaluated formule on the formule attribute defined on the dependency
reset	Borrar el valor de destino

Note: source-type="action" is no more needed. Simplemente añada algunas acciones de dependencia a su dependencia y se lanzarán cuando las condiciones sean válidas.

Target type

The target-type attribute refers to the place where we are applying the data retrieved from the source-type or whatever we want to do with the component where the dependency is.

Action	Necesita datos	Acción inversa	Descripción
none	No	none	Se aplica a nada (valor predeterminado)
label	Yes	none	Applies the source-type retrieved value to the component label
unit	Yes	none	Applies the source-type retrieved value to the component unit label
icon	Yes	none	Applies the source-type retrieved value to the component icon
input	Yes	none	Applies the source-type retrieved value to the component value
format-number	Yes	restore number format	Applies the source-type retrieved value to the criterion number format (for numeric criteria only)
validate	Yes	none	Applies the source-type retrieved value to the criterion validation
atributo	Yes	none	Set an attribute defined on target-action with the source-type retrieved value
ver	No	hide	Mostrar el componente
ocultar	No	show	Ocultar el componente
mostrar columna	No	hide-column	Mostrar la columna (sólo en columnas)
ocultar-columna	No	show-column	Ocultar la columna (aplicable sólo en columnas)
habilitar	No	disable	Activar el componente
desactivar	No	enable	Desactivar el componente
set-requerido	No	set-optional	Establecer el criterio como requerido
establecer-opcional	No	set-required	Eliminar el criterio de validación requerido
set-solo lectura	No	set-editable	Establecer el criterio como sólo lectura
set-editable	No	set-readonly	Permite editar el criterio
configurar-visible	No	set-invisible	Establecer el componente como visible
set-invisible	No	set-visible	Establece el componente como invisible (similar a ocultar pero manteniendo el criterio oculto)
activar-autorefrescar	Yes	disable-autorefresh	Enable autorefresh and set the autorefresh timer with the source-type retrieved value
desactivar-autorefresh	Yes	enable-autorefresh	Disable autorefresh and set the autorefresh timer with the source-type retrieved value

Note: Some target-type actions have an inverse action, which is executed when dependency conditions are not accomplished. In this case, it's NOT necessary to add another dependency with the inverse action.

Elemento de dependencias

The dependency elements are the definition of the conditions required to launch a dependency.

Esqueleto del elemento de dependencia

<dependency-element id="[id]" column="[column]" attribute="[attribute]" condition="[condition]" row="[row]"
                    id2="[id2]" column2="[column2]" attribute2="[attribute2]" event="[event]" value="[value]" 
                    optional="[optional]" cancel="[cancel]" view="[view]" alias="[alias]"/>

Atributos del elemento de dependencias

Atributo	Uso	Tipo	Descripción	Valores
id	Required	String	Component identifier
columna	Opcional	String	Identificador de columna del componente (aplicable en las rejillas)
atributo	Opcional	String	Atributo a comprobar.	See attributes below. Default value is selected
condition	Opcional	String	Condición de comparación	See dependency element conditions. Default value is is not empty
fila	Opcional	String	Número de fila de la cuadrícula para comprobar el atributo
id2	Opcional	String	Identificador de componente a comparar
columna2	Opcional	String	Identificador de columna del componente (aplicable en las rejillas)
atributo2	Opcional	String	Atributo a comprobar.
evento	Opcional	String	Evento a comprobar	See events below.
value	Opcional	String	Valor a comprobar
optional	Opcional	Boolean	Marcar el elemento como opcional. Es útil usar sus valores incluso si están vacíos	Default value is false
cancel	Opcional	Boolean	Cancelar la dependencia si este elemento no ha sido comprobado (útil para eventos obligatorios)	Default value is false
view	Opcional	String	Name of view where element is placed. Used when you need specify in what context the element on which you want to act is located.	Ex.: view = "base"
alias	Opcional	String	Nombre a aplicar al elemento de dependencia. Useful for launcher dependency targets
comprobar-valor	Opcional	Boolean	Marca los valores de este elemento (inicia la dependencia si este elemento cambia)	Default value is true

Condiciones del elemento de dependencias

• eq Values are equal
• ne Values are not equal
• contains Value1 contains value2
• not contains Value1 doesn't contain value2
• ge Value1 is greater than or equal than value2
• le Value1 is less than or equal than value2
• gt Value1 is greater than value2
• lt Value1 is less than value2
• in Value1 is in value2 list
• not in Value1 is not in value2 list
• is empty Value1 is empty
• is not empty Value1 is not empty

Attributes

Los atributos son todos los datos que se pueden obtener de un componente AWE. Dependiendo del componente, puede recuperar información distinta de cada uno:

Action	Aplicar a	Descripción
visible	Todos los componentes	true if component is visible
value	Criteria	Obtiene el valor del criterio. This is the default attribute
texto	Criteria	Gets component visible value
label	Criteria	Obtiene etiqueta de componente
unit	Criteria	Obtiene etiqueta de edición de componente
editable	Criteria	true if component is editable
requerido	Criteria	true if component is required
selectedValues	Select and Suggest Multiple	Obtiene el número de los valores seleccionados del criterio de selección
totalValores	Select	Obtiene el número total de valores del criterio de selección
Fila actual	Grid	Obtiene el identificador de fila actual
valor actual	Grid	Gets column value of the current row (not the selected one). Esto es útil para actualizar los valores de fila sin una selección
preventar Fila actual	Grid	Obtiene la fila anterior a la fila actual
prevCurrentRowValue	Grid	Gets column value of the previous row to the current row
siguiente Fila actual	Grid	Obtiene la siguiente fila a la fila actual
siguiente Valor actual	Grid	Gets column value of the next row to the current row
selectedRow	Grid	Obtiene el identificador de fila seleccionado
selectedRowValue	Grid	Gets column value of the selected row.
anteFila	Grid	Obtiene la fila anterior al identificador seleccionado
prevRowValue	Grid	Gets column value of the previous row to the selected one
nextFila	Grid	Obtiene la siguiente fila al identificador seleccionado
nextRowValue	Grid	Gets column value of the next row to the selected one
selected	Grid	Número de filas seleccionadas de la cuadrícula
filas seleccionadas	Grid	Número de filas seleccionadas de la cuadrícula
modificadas Rows	Grid	Número de filas modificadas de la cuadrícula (en cuadrícula multioperativa)
totalRows	Grid	Número total de filas de la cuadrícula (registros)
hasDataColumn	Grid	true if the column defined has any data
emptyDataColumn	Grid	true if the column defined is empty
fullDataColumn	Grid	true if the column defined is full of data

Note: If you want to retrieve a selectedRowValue from a grid column which isn't editable, you must add an event launcher to make sure the dependency is being launched when selecting a row (i.e. event="select-row")

Eventos

Algunos componentes lanzan eventos en algunos casos. Puede capturar esos eventos con un elemento de dependencia para hacer que lancen la dependencia:

Event	Aplicar a	Descripción
click	Button, Context option and Charts	Lanzado al pulsar el elemento
seleccionar-fila	Grid	Se lanzó cuando una fila ha sido seleccionada
antes guardar-fila	Grid	Lanzado antes de guardar una fila
save-row	Grid	Iniciado al guardar una fila
después-guardar-fila	Grid	Iniciado después de guardar una fila
antes de cancelar fila	Grid	Ejecutado antes de cancelar guardar una fila
cancelar fila	Grid	Se lanzó al cancelar guardando una fila
pos-cancelar-fila	Grid	Ejecutado después de cancelar el guardado de una fila
delete-row	Grid	Iniciado al eliminar una fila
pos-eliminar-fila	Grid	Iniciado después de eliminar una fila
add-row	Grid	Lanzado al agregar una fila
pos-añadir-fila	Grid	Iniciado después de añadir una fila
check-records-saved	Grid	Iniciado al comprobar si los registros han sido guardados
check-records-generated	Grid	Iniciado al comprobar si se han generado registros
check-one-selected	Grid	Se lanzó al comprobar si hay una fila seleccionada
check-some-selected	Grid	Iniciado al comprobar si hay al menos una fila seleccionada
doble clic	Charts	Se lanzó al hacer clic dos veces en un punto de gráfico
context-menu	Charts	Se lanzó cuando se hace clic derecho en un punto de gráfico
zoom	Charts	Se lanzó al seleccionar un rango (zooming) en un gráfico

Acción de dependencias

Dependency actions are actions launched when a dependency has been activated and the dependency source-type is action. See actions for more information.

Ejemplos

When a button is clicked, update a criterion with a formule

<dependency initial="true" source-type="formule" target-type="input" 
            formule="'Valor' + (parseInt('[ButSetVa1]'.substr(5,1),10) + parseInt('[ButSetVa2]'.substr(5,1),10))">
  <dependency-element id="ButSetVa3" event="click" />
  <dependency-element id="ButSetVa2" />
  <dependency-element id="ButSetVa1" />
</dependency>

Validate if a column value is already at the database

<dependency source-type="query" server-action="unique" target-action="AweKeyUni">
  <dependency-element id="GrdKeyLst" column="KeyNam" attribute="currentRowValue" />
</dependency>

Enable a button when there is one row selected on a grid

<dependency target-type="enable" initial="true">
  <dependency-element id="GrdKeyLst" attribute="selectedRows" condition="eq" value="1" />
</dependency>

Change the numeric format when a criterion value is 4decimales

<dependency source-type="formule" target-type="format-number" initial="true" 
            formule="{vMin: '-999999', mDec: [NumHid], aSign:' JPY', pSign:'s', aPad:true}">
  <dependency-element id="Txt" condition="eq" value="4decimales" />
</dependency>

Change the validation of a time criterion

<dependency source-type="value" target-type="validate" value="{textLE:['TimReq']}">
  <dependency-element id="CalReq" condition="eq" name="Cal" />
  <dependency-element id="Cal" condition="eq" name="CalReq" />
</dependency>

Launch two actions when a criterion value changes

<dependency initial="true">
  <dependency-element id="CalReq" />
  <dependency-action type="server" server-action="data" target-action="ProAllLst" target="SelReq" />
  <dependency-action type="server" server-action="data" target-action="ProAllLst" target="SelMulReq" />
</dependency>

Make a criterion not visible (but keeping the place) when a criterion value is oculta

<dependency target-type="set-invisible" initial="true">
  <dependency-element id="Txt" condition="eq" value="oculta" />
</dependency>         

Make a criterion editable (not readonly) when a criterion value is edita

<dependency target-type="set-editable" initial="true">
  <dependency-element id="Txt" condition="eq" value="edita" />
</dependency>

Fill a criterion unit label with the result of a query when a checkbox gets checked

<dependency source-type="query" target-type="unit" server-action="data" target-action="ModSel">
  <dependency-element id="ChkBoxVa2" condition="eq" value="1" />
</dependency>

Show a component when the column value of the selected row of a grid is not equal to awemadora02

<dependency target-type="show" initial="true">
  <dependency-element id="GrdSta" column="Als" attribute="selectedRowValue" condition="ne" value="awemadora02"/>
  <dependency-element id="GrdSta" event="select-row"/>
</dependency>

Use a dependency just in the selected row

<dependency initial="true" target-type="enable">
  <dependency-element id="GridName" attribute="selectedRow" condition="eq" id2="GridName" attribute2="currentRow"/>
</dependency>

Note: If you want to retrieve a selected row value from a grid column which isn't editable, you must add an event launcher to make sure the dependency is being launched when selecting a row (i.e. event="select-row")

Validate a criterion using a Java method

Dependency

<criteria label="PARAMETER_TEXT" id="TxtVal" variable="TxtVal" component="text">
  <dependency source-type="query" server-action="validate" target-action="ValidateBankAccount">
    <dependency-element id="TxtVal"/>
  </dependency>
</criteria>

Query

<query id="ValidateBankAccount" service="ValidateBankAccount">
  <variable id="BankAccount" type="STRING" name="TxtVal" />
</query>

Service

<service id="ValidateBankAccount">
  <java classname="com.almis.awe.test.Validation" method="validateBankAccount">
    <service-parameter type="STRING" name="BankAccount" />
  </java>
</service>

Java method

public class Validation {

  // PATTERNS
  private static final String BANK_ACOUNT = "^[0-9]{4}\\-[0-9]{4}\\-[0-9]{2}\\-[0-9]{10}$";
  private static final Pattern BANK_ACCOUNT_PATTERN = Pattern.compile(BANK_ACOUNT, 0);

  public ServiceData validateBankAccount(String bankAccount) throws AWException {
    ServiceData check = new ServiceData();
    Matcher matchAccount = BANK_ACCOUNT_PATTERN.matcher(bankAccount);
    if (!matchAccount.matches()) {
      check.setType(AnswerType.WARNING);
      check.setMessage(LocalSingleton.getInstance().getLocal("ERROR_MESSAGE_WRONG_BANK_ACCOUNT", bankAccount));
    }
    return check;
  }
}

Añadir una clase a un elemento HTML cuando ocurre un evento

A veces necesitamos mostrar un consejo en la pantalla para notar a los usuarios que algo ha sucedido en el back-end como una nueva entrada en la base de datos o similar. Vamos a explicar cómo agregar dos nombres de clase ("animado" y "faa-slow" para ajustar la velocidad animada) a un elemento HTML para animar un icono de campana y mostrar un número sobre el icono que representa una serie de errores en la aplicación. Al pulsar este botón, la campana detiene la animación y muestra un diálogo con una cuadrícula que muestra los detalles del error.

Definition of the screen elements

Primero debemos definir el elemento HTML en la pantalla xml, en este caso un elemento "info-button" con un atributo "icon" con un valor "bello" y un atributo "unit". Este último atributo representará el número de errores en la aplicación.

  <info-button style="nav-icon-btn-danger" title="BUTTON_NOTIFICATIONS" icon="bell" id="Warnings" unit="">
    ...
  </info-button>

El siguiente paso es agregar la acción para detener la animación de la campana (quitar el nombre de la clase) y mostrar el diálogo.

  <info-button style="nav-icon-btn-danger" title="BUTTON_NOTIFICATIONS" icon="bell" id="Warnings" unit="">
    <button-action type="remove-class" target-action="animated faa-slow" target="#Warnings .fa-bell" />
    <button-action type="dialog" target="MessageWarnings" />
  </info-button>

La primera acción del botón elimina los nombres de las clases "animadas" y "faa-slow" del elemento HTML apuntado en el atributo "target", en este caso el elemento con el nombre de clase "fa-bell" dentro del elemento con el id "Advertencias".

La segunda acción del botón abre el diálogo con el id "MessageWarnings".

Estas acciones se activan cuando el usuario hace clic en el botón.

Ahora debemos agregar las dependencias requeridas para mostrar los números de errores y agregar los nombres de clase "animados" y "faa-slow". Estas acciones deben ejecutarse cuando los usuarios entren en la pantalla o inicien sesión en la aplicación para que podamos añadir una acción aditiva.

<info-button style="nav-icon-btn-danger" title="BUTTON_NOTIFICATIONS" icon="bell" id="Warnings" unit="">
  <button-action type="remove-class" target-action="animated faa-slow" target="#Warnings .fa-bell" />
  <button-action type="dialog" target="MessageWarnings" />
  <dependency source-type="launcher" target-type="unit" target-action="notification" initial="true">
    <dependency-element id="NotificationNumber" alias="notification"/>
  </dependency>
  <dependency>
   <dependency-element id="NotificationNumber" attribute="value" condition="ne" value="0" />
   <dependency-action type="add-class" target-action="animated faa-slow" target="#Warnings .fa-bell" />
  </dependency>
</info-button>

La primera dependencia es un tipo de "lanzador" que se ejecuta cuando el usuario entra en la pantalla donde este elemento se define gracias al atributo "inicial" establecido en "verdadero". La dependencia, apunta al atributo "unit" del botón info-button y depende de un elemento con un id "NotificationNumber" representado en la etiqueta "dependency-element". Este nuevo elemento se creará en los siguientes pasos.

La segunda dependencia es un tipo de "acción". Esta acción se activará cuando el valor del "elemento de dependencia" (el elemento con un identificador de "NotificationNumber") no sea igual (ne) a cero. Esto se representa con los siguientes atributos: attribute="value" condition="ne" value="0". La acción para esta dependencia es un tipo "add-class", así que cuando se ejecuta esta acción, se añadirá un nombre de clase a un elemento. Esta acción apunta al elemento con el nombre de la clase "fa-bell" dentro del elemento con el id "Advertencias" (atributo "target" en la etiqueta de dependencia-acción), por lo que este elemento recibirá el nombre de la clase descrito en el atributo "target-action" ("animado faa-slow").

Ahora vamos a definir el elemento de dependencia "NotificationNumber". Este elemento será un criterio oculto y tiene un atributo de "carga inicial" definido a "valor" y una "acción objetiva" que apunta a una consulta que debe definirse en "Consultas. ml" en AWE.

<criteria id="NotificationNumber" component="hidden" initial-load="value" target-action="getNotificationErrors" />

Y por último, pero no menos importante, la definición del diálogo.

<dialog id="MessageWarnings" modal="true" style="modal-lg" label="SCREEN_TEXT_WARNINGS" icon="exclamation-triangle" help="HELP_SCREEN_TEXT_PRINT_EMAIL">
  <tag type="div" style="modal-body row">
    <window label="BUTTON_NOTIFICATIONS" icon="bell" expandible="vertical">
      <grid id="GridMessageWarning" style="height-lg" max="50" server-action="data-silent" target-action="getErrorMessageInfo" autoload="true" autorefresh="30">
        ...
        columns definition
        ...
      </grid>
    </window>
  </tag>
</dialog>

En este punto hemos creado todos los elementos necesarios en la pantalla. El siguiente paso es definir las consultas que extraen los datos de la base de datos.

Queries

En el archivo "Queries.xml" debemos definir las siguientes etiquetas:

<query id="getErrorMessageInfo" service="getErrorMessageInfo"/>

<query id="getNotificationErrors" service="getErrorMessageInfo">
  <field id="errors" alias="value" />
  <field id="errors" alias="label" />
</query>

La primera consulta apunta a un servicio llamado "getErrorMessageInfo" definido en el archivo "Services.xml" en AWE. Esta consulta será lanzada por la cuadrícula creada en el diálogo.

La segunda consulta apunta al mismo servicio y espera dos valores uno para un campo "valor" y otro para un campo "etiqueta". Esta consulta será lanzada por los criterios ocultos.

Service

Una vez que las consultas están definidas y apuntan a un servicio, debemos crear este servicio. En el archivo "Services.xml" debemos definir las siguientes etiquetas:

<service id="getErrorMessageInfo">
  <java classname="com.isban.smgmi.web.controller.ErrorMessageController" method="getErrorMessageInfo">
  </java>
</service>

Este servicio ejecuta el método "getErrorMessageInfo" en la clase "com.isban.smgmi.web.controller.ErrorMessageController".

Java

En el Controlador debemos crear el método "getErrorMessageInfo" y devolver un objeto ServiceData. Este controlador debe llamar a una clase Manager.

public class ErrorMessageController extends AWEController {
  public ServiceData getErrorMessageInfo() throws AWException {

    // Get event manager
    ErrorMessageManager errorMessageManager = new ErrorMessageManager();

    return errorMessageManager.getErrorMessageInfo();
  }
}

En la definición de Gestor debemos crear una acción de llenado del cliente para cargar datos en la cuadrícula de diálogo y una acción de cliente seleccionada para cargar datos en criterios ocultos.

public class ErrorMessageManager extends AWEManager {

  /**
   * Get error info
   * 
   * @return
   * @throws AWException
   */
  public ServiceData getErrorMessageInfo() throws AWException {
    ...
          ClientAction fillErrorGrdAction = new ClientAction("fill");
          fillErrorGrdAction.setSilent("true");
          fillErrorGrdAction.setTarget("GridMessageWarning");

          DataList errorGrdParametersDatalist = new DataList();
          Integer rowIndex = 0;
          for (ErrorBean error : errorList) {
            HashMap<String, CellData> parametersRow = new HashMap<String, CellData>();
            parametersRow.put("id", new CellData(rowIndex));

            ...
            // add columns data
            ...

            errorGrdParametersDatalist.getRows().add(parametersRow);
            rowIndex++;
          }
          // Set records
          errorGrdParametersDatalist.setRecords(rowIndex);

          fillErrorGrdAction.addParameter("datalist", errorGrdParametersDatalist);

          // Notification Number
          ClientAction selectCrtNotificationNumberAction = new ClientAction("select");
          selectCrtNotificationNumberAction.setTarget("NotificationNumber");
          selectCrtNotificationNumberAction.setSilent("true");

          errorListSize = errorList.size();
          ArrayNode notifNumberArrayNode = JsonNodeFactory.instance.arrayNode();
          notifNumberArrayNode.add(String.valueOf(errorListSize));
          selectCrtNotificationNumberAction.addParameter("values", new CellData(notifNumberArrayNode));

          // Adds clients actions
          serviceData.addClientAction(selectCrtNotificationNumberAction);
          serviceData.addClientAction(fillErrorGrdAction);
    ...
  }