Tutorial: Aplicación de pestaña con grid y gráfico

En este ejemplo veremos una aplicación tipo pestaña, donde puede abrir otras aplicaciones en la misma página. Para este ejemplo se utilizarán 4 aplicaciones: 1 formulario, 2 grid y la aplicación de pestaña.

1 Creando un gráfico

En esta aplicación, se mostrará un gráfico de barras de ventas por empleados.

1.1 – Cree una nueva aplicación Gráfica basada en la tabla de orders.

1.2 – Accede a la opción “Gráficas” en el menú de la aplicación.

1.3 – Seleccione las siguientes dimensiones y métricas:

1.4 – En “Gráfica”, seleccione el tipo deseado.

1.5 – Genere el código fuente haciendo clic en el botón Generar código fuente en la barra de herramientas de ScriptCase.

2 Creación de la Grid de empleado

En esta aplicación, mostraremos la información de los empleados de la empresa.

2.1 – Cree una nueva aplicación de consulta basada en la tabla de employees.

2.2 – En las opciones de “Módulos del Grid”, marque solo el módulo Grid. Utilice la orientación “Diapositiva” y para mostrar solo 1 línea por página.

2.3 – En Layout >> Bloques, agregue un nuevo bloque a la aplicación.

2.4 – En “Editar campos”, arrastre los campos a la posición deseada en los bloques y elimine el resto de los campos de la pantalla.

2.5 – Generar el código fuente de la aplicación.

3 Creación de la Grid de contabilización

En esta aplicación, mostraremos un resumen de ventas por categorías.

3.1 – Crear una nueva aplicación Grid

Utilice el siguiente SQL:

SELECT accountid, sum(valuerelease) as valuerelease

FROM releases

GROUP BY accountid

3.2 – En las opciones de “Módulos del Grid”, marque solo el módulo Grid.

3.3 – Generar el código fuente de la aplicación.

4 Creación de la aplicación de pestaña

La aplicación Pestaña se utiliza para mostrar varias aplicaciones en secuencia y es muy similar a una aplicación de menú.

4.1 – Cree una nueva aplicación tipo pestaña.

4.2 – En el ítem “Configuración de carpetas” crearemos las pestañas que se visualizarán en la aplicación.

4.3 – Para agregar una nueva pestaña, en la propiedad Etiqueta, escriba el nombre para mostrar de la pestaña y haga clic en el botón “Agregar”.

4.4 – Repita el último procedimiento para crear 2 carpetas más.

4.5 – Ahora es necesario conectar las aplicaciones a las carpetas creadas. Haga clic en el elemento “Configuración de la aplicación”.

4.6 – Con la primera carpeta seleccionada, haga clic en el botón Agregar. En la siguiente pantalla, elija la consulta creada en el paso 2 y haga clic en el botón Continuar.

4.7 – Pase los parámetros de acuerdo con la figura siguiente y haga clic en el botón Guardar

4.8 – Seleccione la segunda carpeta y elija el gráfico creado en el paso 1. Haga clic en el botón Continuar.

4.9 – Configure de acuerdo con la figura siguiente y haga clic en el botón Guardar.

4.10 – Seleccione la tercera carpeta y elija la consulta creada en el paso 3. Haga clic en el botón Continuar.

4.11 – Configure de acuerdo con la figura siguiente y haga clic en el botón Guardar.

4.12 – Para finalizar Ejecute la aplicación.

Compartir este tutorial

Tutoriales en la misma categoria

Columnas fijas en el resumen

En este ejemplo, veremos la opción de fijar columnas en el Resumen de las aplicaciones Grid. De es...

Tutorial: Gestión de archivos en la nube

Algunos de los servicios de almacenamiento de datos están listos para leer y almacenar de forma se...

Responsive Calendar

In this tutorial we will create a responsive calendar application Calendar in Browser M...

Cómo enviar un correo electrónico con archivo adjunto

En este tutorial, envíe un correo electrónico con archivo adjunto utilizando la macro sc_mail_sen...

Comentar este post