Guía de uso

Introducción

Esta librería de componentes estará orientada a desarrollar sistemas (o parte de ellos) manipulando la capa de visualización a través de la capa de datos.

Capa de datos

La capa de datos deberá seguir un comportamiento establecido por la documentación de esta librería. Si se siguen las opciones y reglas definidas, la capa de visualización construirá las interfaces necesarias para la construcción de un sistema con los componentes que la integran.

Capa de visualización

La capa de visualización estará estructurada en dos partes: lógica e interfaz.

La parte lógica será la encargada de:

1. obtener la información de la capa de datos.
2. validar la información obtenida.
3. manipular la información obtenida de manera que sea útil para la interfaz.
4. contener propiedades, variables internas y métodos de utilidad.

La parte interfaz será la encargada de:

1. renderizar el componente alimentándose de las propiedades provistas por la parte lógica.
2. funcionar como ejemplo para el caso que se desee reemplazar esta parte.
3. incluir comentarios en el código que colaboren con el reemplazo de esta parte.

Requerimientos

Para utilizar correctamente la librería, usted deberá proveerle una API con un endpoint /icl/exec/:{fcn_name} exclusivo para el uso de la librería (no debe usarse por fuera de ICL), ya que la misma cuenta con interceptores que podrían alterar el funcionamiento normal en el proyecto cliente. Dicho endpoint debe contar con metodos GET y POST, y deberá ejecutar en la BD, la función pasada como parámetro en la URL. También deberá enviar como parámetros a la BD todo lo enviado en el body o query string de dicha función.

También debe tenerse en cuenta que para funcionar correctamente ICL necesita que su proyecto tenga instalado vuetify y que este cuente con un tema light que debe tener definidos los colores:

• Primary
• Secondary
• Tertiary
• Fourth
• textPrimary
• textSecondary
• textTertiary

Al mismo tiempo en la configuración de vuetify, se debe establecer la propiedad customProperties en true

Ejemplo:

  const vuetify = new Vuetify({
  theme: {
    options:{
      customProperties: true
    }
    dark: false,
    themes: {
      light: {
        primary: '#1976D2',
        secondary: '#5BC0EB',
        fourth: '#458985',
        tertiary: '#777777',
        disabled: '#C6C6C6',
        error: '#B2121A'
      },
    }
  }
})