Opciones de personalización y avanzadas

<< Clic para mostrar Tabla de Contenidos >>

Navegación:  Bizagi Studio > Bizagi desde aplicaciones externas > Integración con portales > Bizagi Web parts para SharePoint > Bizagi Web parts para SharePoint online > Usar las Web parts >

Opciones de personalización y avanzadas

Introducción

El siguiente artículo describe cómo utilizar opciones adicionales cuando se escoje integrar Bizagi en SharePoint a través de las diferentes opciones de las Web parts, como se describe en Usando las Web parts.

 

Estas opciones de las Web parts específicas permiten a los diseñadores Web de SharePoint potenciar una mayor flexibilidad que soporte:

Personalizar dónde cada una de las Web parts se muestran (de aquellas que componen al Portal de trabajo).

Decidir si ciertas opciones están disponibles y se muestran para esa página de SharePoint en particular (p.e usted podría decidir presentar el inbox desde cierta página a manera de resumen sin presentar todas las opciones que trae el Portal de trabajo).

 

SPWB_SP2010_intranetInbox

 

Nótese que en este ejemplo, el inbox presenta 5 casos por página.

 

Web parts específicas

Para este acercamiento, usted debe escoger si incluir de manera separada cada sección de información y porciones que Bizagi presenta en su Portal de trabajo.

Estas secciones de información, a través de las Web parts específicas, son: Activity Form, Inbox, Case summary, Start Process list, Start Process button, y se describen a continuación.

 

SPonline_015

 

Al incluir la totalidad de estas Web parts, usted podrá construir el Portal de trabajo de Bizagi de manera manual (en vez de directamente usar la Web part del Portal de trabajo, la cuál ya contempla estas otras Web parts).

Si por el contrario si desea incluir de manera automática el Portal de trabajo como un todo, consulte The Work portal Web part.

 

1. My Inbox

Esta Web part muestra la lista de trabajo pendiente de un usuario (su Inbox).

En esta Web part, el usuario tendrá una vista filtrada de sus tareas activas (de acuerdo a la fecha esperada de completitud de las tareas de los procesos).

 

07MyInbox

 

Nótese que el Inbox de Bizagi se presenta en 2 diferentes posibles vistas: detalle o cuadrícula, y que incluso, los usuarios podrán alternar entre ambas:

 

07MyInbox2

 

Tenga en cuenta que esta Web part contiene algunos parámetros de los cuales se espera cierta configuración más completa (como se describe en la siguiente sección).

 

2. Activity form (forma de actividad)

Esta Web part permite a los usuarios trabajar en los casos que tengan pendientes o en nuevos.

Cada vez que se crea un nuevo caso, esta Web part carga automáticamente la información de la forma asignada a esa tarea pendiente del caso.

 

08ActivityForm

 

Tenga en cuenta que esta Web part contiene algunos parámetros de los cuales se espera cierta configuración más completa (como se describe en la siguiente sección).

 

3. Case summary (resumen del caso)

Esta Web part permite a los usuarios finales ver la forma de resumen de un caso, para decidir si el o ella desean trabajar en las actividades pendientes del caso (por ejemplo, dando clic en el botón de Trabajar sobre él).

Es realmente útil cuando un usuario necesita primero verificar la información relevante y así poder decidir si trabajar sobre un caso.

Esta información se presenta por defecto hacia la parte derecha del Inbox cuando se visualizan casos a manera de detalle (o también se enseña cuando se da clic sobre el botón de Ver resumen si se tiene la vista a modo de cuadrícula).

 

15Summary

 

Haciendo clic en Trabajar sobre él lanzará la Web part de Activity form en una ventana emergente.

Tenga en cuenta que esta Web part contiene algunos parámetros de los cuales se espera cierta configuración más completa (como se describe en la siguiente sección).

 

4. Start process list (lista para inicio de procesos)

Esta Web part permite a los usuarios iniciar instancias de proceso (crear nuevos casos).

Esto enseña la lista disponible de procesos junto con la opción de buscar o filtrar de acuerdo a los procesos recientes.

Es realmente útil cuando un usuario cuenta con múltiples opciones de procesos que puede iniciar, de lo contrario podrá ser mejor usar el botón de Start Process button.

 

Seleccionar y dar clic en un proceso específico, accionará al Activity form en una ventana emergente para desplegar la forma de la primera actividad del proceso.

 

09Startprocesslist

 

Tenga en cuenta que esta Web part contiene algunos parámetros de los cuales se espera cierta configuración más completa (como se describe en la siguiente sección).

 

5. Start process button

Esta Web part permite a los usuarios iniciar instancias de proceso (crear nuevos casos), mediante un solo clic.

Esto enseña un botón el cual es un atajo para inmediatamente accionar al Activity form en una ventana emergente para desplegar la forma de la primera actividad del proceso.

Este botón cuenta con una etiqueta personalizable que permite que se presenten más de un botón para cada uno de los diferentes procesos que se pueden iniciar (se puede tener más de una Web part de este tipo).

 

Considere que si son muchos los procesos que se pueden iniciar, es posible que sea mejor utilizar la Web part Start Process list.

 

10Startprocesbutton

Tenga en cuenta que esta Web part contiene algunos parámetros de los cuales se espera cierta configuración más completa (como se describe en la siguiente sección).

 

note_pin

To configure this Web part, it is recommended to sign in with a user that has the proper rights in Bizagi to access processes.

 

Interacción entre Web parts

El siguiente diagrama ilustra cómo interactúan las Web parts separadamente (las dependencias que tienen entre sí):

 

 

Interaction

 

 

Nótese por ejemplo que la Activity form se visualiza luego de activarse desde : el Start process button, el Start process list, el Case summary, o incluso el Inbox.

 

Existen diferentes maneras de presentar las Web parts que estén enlazadas con otras: por medio de una ventana emergente, en la ventana originadora o en otra página diferente.

Ventana emergente (Pop up): La Web part invocada aparece como ventana modal más pequeña, emergente dentro del iframe de la Web part que la invoca.

Ventana originadora (Parent pop up): La Web part invocada aparece como ventana modal más pequeña, dentro de la Web part originadora.

Otra página (Other page): La Web part invocada aparece en una página nueva.

 

Para configurar que la opción de la Ventana originadora funcione correctamente, usted necesita incluir el siguiente script dentro de la página:

 

<script type="text/javascript" src="../BizagiAdd-in/Scripts/bizagi.addin.controller.js"></script>

 

Para hacerlo, dé clic en Adicionar Web part (Add a Web Part) dentro del editor de la página y seleccione Script Editor desde la categoría Media and Content para adicionar la Web part.

 

SPonline_016

 

Seguidamente, dé clic en Edit Snippet.

 

SPonline_017

 

SharePoint mostrará un diálogo, en donde deberá pegar la línea anterior donde se  importa el script, luego dé clic en Insertar (Insert).

 

SPonline_018

 

note_pin

Actualmente, es común que las páginas de sitios de SharePoint no soporten scripts de terceros en su contenido, por lo que es ideal usar la opción de páginas de SharePoint.

 

Ejemplo

SharePoint Online ofrece 2 tipos de páginas web: páginas que son para Web parts y las tradicionales páginas de sitio (Site Page). La diferencia principal entre ambos tipos es que las páginas de sitio ahora son responsive y por lo tanto, compatibles con dispositivos móviles.

Ambos tipos soportan las Web parts, aunque para las páginas de sitio éstas son llamadas App parts. En general, estas Web parts mantienen las mismas características y propiedades sin importar el tipo de página donde se ubiquen.

 

Este ejemplo enseña cómo adicionar las Web parts sobre ambos tipos de páginas.

 

Configurar Web parts sobre una página de Web parts

Para adicionar Web parts a una página, tenga presente que usted podrá hacerlo desde ceros en páginas en blanco. Si usted crea estas nuevas páginas, las Web parts que se recomiendan a incluir deben contener el layout "Header, Left column, Body":

 

SPonline_019

 

Adicionar Web parts se lleva a cabo al dar clic en la sección que le permite escoger las partes a partir de la categoría Apps:

 

SPonline_020

 

 

Para configurar las Web parts de Bizagi, dé clic en el ícono en la lista desplegable y en Edit Web part:

 

SPonline_021

 

Luego, configure las propiedades de la Web part dentro del panel que aparce al lado derecho de la página en modo edición.

 

La siguiente tabla lista las propiedades de configuración para estas Web parts:

 

GRUPO DE PROPIEDADES

PROPIEDAD

DESCRIPCIÓN

APLICA A

Bizagi Server (propiedades del servidor)

Bizagi Server URL (URL del servidor de Bizagi)

Define la ubicación del Portal de trabajo de Bizagi.

Importante: La URL debe darse por el protocolo https y finalizar sin el caracter de slash. Por ejemplo:

https://www.mydomain.com/bizagiproject

Todos

Bizagi Configuration (propiedades de configuración)

Adjust buttons to content (Ajustar los botones al contenido)

Le permite definir cómo se enseñan los botones de la actividad. Si se habilita, los botones se enseñarán en la parte inferior de la Web part. De lo contrario se enseñarán en la parte inferior pero dentro de la forma.

Activity form

idWfClass

Define el ID del proceso para el cuál se iniciará un nuevo caso.

 

Activity form, Start process button

Graphic Query Behavior (Comportamiento de la consulta gráfica)

Especifica cómo se mostrará la consulta gráfica:

Ventana emergente (Pop-up): Abre el contenido en una ventana modal dentro del canvas de la Web part.

Ventana originadora (Parent Pop-up): Abre el contenido en una ventana modal desde la ventana padre. Para usar esta opción es necesario entender la interacción entre Web parts.

Otra página diferente (Other page): Abre el contenido en una nueva página.

Case summary, Inbox

Render Behavior (Comportamiento del render)

Define cómo los enlaces o botones se mostrarán: Pop-up, parent pop-up o other page, tal como se explican anteriormente.

Case summary, Inbox, Start process button,  Start process list

Render Page URL (URL de página del render)

Asigna la URL donde se presenta dicha acción de los enlaces o botones cuando se selecciona other page para la propiedad Render Behavior.

Case summary, Inbox, Start process button,  Start process list

idCase

Representa una instancia de proceso.

Case summary

idWorkitem

Representa un element ID selected to display.

Case summary

Default view (vista por defecto)

Personaliza cómo el inbox se mostrará. Existen 2 tipos de valores posibles para esta presentación: Details (detalle) y grid (cuadrícula).

Inbox

Page Size (tamaño de página)

Especifica el número de registros que se enseñan cuando la vista por defecto (Default view) es dada como cuadrícula.

Inbox

Show View Toggle

Permite escoger si se presenta un botón para alternar entre la vista modo detalle y modo cuardrícula.

Inbox

Summary Behavior

Define cómo los se mostrará la información de resumen: Pop-up, parent pop-up o other page, tal como se explican anteriormente.

Inbox

Summary Page URL

Establece la URL donde las acciones del botón y enlace serán visualizados cuando se seleccione other page para la propiedad Summary Behavior.

Inbox

Button CSS Style

Interpreta el estilo CSS que tomará el diseño del botón.

Start process button,  Start process list

Button Name

Asigna el nombre al botón para fácil identificación.

Start process button

Label Text

Asigna la etiqueta visual que se presenta para el botón.

Start process list

Appearance,

Layout and

Advanced (Apariencia, layout y avanzados)

(Propiedades usuales de SharePoint)

Las propiedades de estos grupos son estándar en SharePoint.

Al utilizar las Web parts de Bizagi, puede optar por configurar de ellos, propiedades como: su título, ancho y alto, y si el título y los bordes se muestran o no ("Chrome type").

Por ejemplo, seleccione Chrome type = None para especificar que no se muestre título y borde.

Todos

 

Cuando haya configurado la Web part, guarde los cambios en la página.

Tenga en cuenta que deberá configurar cada una de las Web parts incluidas, y luego hacer check-in y publicar los cambios.

 

Configurar Web parts sobre una página de sitio

Para configurar las Web parts en una página de sitio, dé clic en el ícono de Add new y luego seleccione la parte que desee insertar. para ilustrar este ejemplo, se seleccionará Bizagi Inbox.

 

SPonline_025

 

Una vez adicionada, dé clic en el ícono de editar para continuar con el detalle de su configuración.

 

SPonline_026

 

Digite la URL aseggurándose de usar el protocolo https y sin el caracter slash al final.

 

SPonline_027

Luego de configurar las partes, dé clic en Aplicar (Apply) y quedará listas para ser usadas.

 

note_pin

Las App parts cuentan con la misma configuración (propiedades) de las Web parts.

Actualmente, es común que las páginas de sitios de SharePoint no soporten scripts de terceros en su contenido, por lo que es ideal usar la opción de páginas de SharePoint.

 

Visualización final

En el ejemplo a continuación, se visualiza el uso de 4 Web parts de Bizagi: 3 Start process buttons, y un Inbox:

 

SPWB_SP2010_intranetInbox_exp

 

En este punto, se ha configurado las Web parts a través de opciones personalizadas!