Ver código fuente

<keywords content="keywords"> 
celular,celulares,teléfonos,telefono,smartphones,smartphone,móvil,blackberry,iphone,aprobar,rechazar
</keywords> 



<div align="center">
{| class="MsoNormalTableAlert" border="1" cellspacing="0" cellpadding="0" width="600"
|-
| valign="top" width="100%" | 
<span>'''Alerta:''' La integración presentada en este artículo aplica únicamente para las versiones 9.1.x. En Bizagi GO, los teléfonos inteligentes y dispositivos móviles soportan   nativamente la interfaz del Portal de Trabajo.</span>
|}
</div>


= Cómo integrar Bizagi con teléfonos inteligentes  =

Encontramos frecuentemente como necesidad en los procesos, que éstos requieren de acciones concretas como aprobaciones de personas con altos cargos, cuyas tareas pueden convertirse en cuellos de botella porque éstas no permancen todo el tiempo al frente de sus estaciones de trabajo. 

Ante esto, Bizagi soporta el trabajo con teléfonos inteligentes. Esto permite a los usuarios participar en los procesos y aprobar las solicitudes de una manera eficiente desde correos desde sus celulares, sin tener que loggearse a la aplicación web. 

&nbsp; 

[[Image:Blackberry Notification.png|center|319x544px]] 

&nbsp; 

El siguiente artículo describe cómo crear en un proceso Bizagi una opción que permita aprobar o rechazar casos desde un teléfono inteligente. La integración que se menciona es posible gracias a la capa SOA de Bizagi y mediante el uso de notificaciones de correo vía SMTP. 

Para este ejemplo específico, se ajustó el proceso de Solicitud de Viaje (del Process Central gratuito) de manera que la actividad de aprobar la solicitud de viaje por parte del jefe ("Approve travel request") pueda ser llevada a cabo a través de su teléfono móvil. 

El siguiente diagrama representa la arquitectura de la cómo operaría la solución: 

<br> 

<br> 

[[Image:SmartphoneArquitecture.png|center|550px]] 

Por medio del proceso en Bizagi(1), se envía un notificación de correo electrónico vía SMTP al jefe (2). <br> 

Éste abre su mensaje desde su teléfono inteligente (3) y hace clic en el enlace correspondiente para aprobar o rechazar la solicitud.<br> 

El enlace activa la aplicación web (4) que invoca los servicios web para realizar la actividad en el proceso de Bizagi.<br> 

<br> 

Para llevar a cabo esta integración, siga los 5 pasos que se describen de guía con respecto al modelo de proceso de solicitud de viaje. 

<br> 

== Importar el modelo de solicitud de viaje.<br>  ==

Instale la plantilla del proceso de solicitud de viajes desde la opción del Process Central Gratuito, directamente desde Bizagi Studio. 

<span>Mayor información al respecto sobre esta opción [[Process Templates|aquí]].</span><br> 

[[Image:Travel Request.jpg|center|Travel Request Process Model]]<br> 

Recuerde que esta solución puede ser trabajada también con cualquier otro proceso.<br> 

<br> 

== Adaptar el modelo de datos<br>  ==

Adapte el modelo de datos para este proceso, editando la entidad de proceso "TravelRequest", de manera que se adicionen los nuevos atributos para el control y la operación de la la aprobación por medio del enlace.<br> 

Para realizar esto, haga clic en la vista de módulos de Bizagi studio y seleccione el módulo de entidades. Expanda los ítems de la entidad TravelRequest que se encuentra bajo las entidades Maestras.<br> 

<br>[[Image:TravelRequestEntityEdit.jpg|center|700px]]<br> 

Dé clic derecho sobre el item de atributos de la entidad TravelRequest. Seleccione editar la lista de atributos y agregue los 3 nuevos atributos:&nbsp;<br> 

<br> 

*''ApproveLink y RejectLink''&nbsp; como atributos de tipo texto. Cada uno de ellos tendrá como función almacenar el enlace con el parámetro correspondiente a la decisión de aprobar o rechazar la solcitud de viaje. Se debe garantizar que estos atributos soporten la longitud de caracteres del enlace. <br>

[[Image:TravelRequestNewStringAttributes.jpg|center|700px]] 

<br> 

*''DecisionGuids'' como un atributo de tipo collección de entidad maestra. Esto crea la nueva entidad DecisionGuids igualmente cuyo objetivo es almacenar la información relacionada a los casos y a la decisión de aprobación. Esto se usa para unificar un Guid como parámetro seguro en la invocación del servicio web.

[[Image:DecisionGuids1.jpg|center|700px]] 

<br> 

La nueva entidad debe tener los atributos como se enseñan a continuación:<br> 

[[Image:WorkItemGuid 1.jpg|center|700px]] 

<br> 

[[Image:WorkItemGuid 2.jpg|center|700px]] 

ReferenceGuid debe ser un atributo de tipo texto de longitud 36. UserUsername y UserDomain fueron configurados con longitud 20 para este ejemplo. Haga clic en finalizar en las 2 ventanas de propiedades de las entidades. 

== Crear una expresión para asignar la información de los enlaces<br>  ==

Cree una accion de actividad para asignar el valor de los 2 atributos que almacenarán los enlaces (''ApproveLink'' y ''RejectLink''), escogiendo el paso 4 del asistente ([[Business Rules#Expressions|reglas de negocio]]). <br> 

Una vez allí, cree una expresión que se ejecute al salir de la actividad de registro de la solicitud de viaje (''register travel request'').<br> 

[[Image:RuleExpression1.jpg|center|700px]]<br> 

El código de la expresión estará encargado de construir el enlace a la aplicación web con el parámetro de información necesario para la invocación del servicio web de ''performActivity''. Para este ejemplo, éste es el código: 

[[Image:SetLinkRule.jpg|center|700px]]<br> 

Se aprecia que la variable ''v_url'' debe tener la URL de referencia a la aplicación web donde se montará en el IIS y que también se puede configurar en el paso 5.<br> 

La construcción de estos links, debe incluir el parámetro Guid como un token válido para una invocación segura.<br> 

<br> 

El siguiente es el código de la expresión:<br> 
<pre>var g1 = Guid.NewGuid();
var g2 = Guid.NewGuid();
var acceptGuid = g1.ToString();
var rejectGuid = g2.ToString();
var v_url = "http://[your_iis_server]/SmartphoneBizagiApplication/Default.aspx";
&lt;TravelRequest.ApproveLink&gt; = v_url + "?do=" + acceptGuid;
&lt;TravelRequest.RejectLink&gt; = v_url + "?do=" + rejectGuid;
</pre><pre>var acceptGuidRow = Me.addRelation("TravelRequest.DecisionGuids");

acceptGuidRow.setXPath("ReferenceGuid", acceptGuid);
acceptGuidRow.setXPath("CaseReference", v_caseId);
acceptGuidRow.setXPath("DecisionId", 1);
acceptGuidRow.setXPath("UserDomain", &lt;TravelRequest.Applicant.idBossUser.domain&gt;);
acceptGuidRow.setXPath("UserUsername", &lt;TravelRequest.Applicant.idBossUser.userName&gt;);


var rejectGuidRow = Me.addRelation("TravelRequest.DecisionGuids");
rejectGuidRow.setXPath("ReferenceGuid", rejectGuid);
rejectGuidRow.setXPath("CaseReference", v_caseId);
rejectGuidRow.setXPath("DecisionId", 2);
rejectGuidRow.setXPath("UserDomain", &lt;TravelRequest.Applicant.idBossUser.domain&gt;);
rejectGuidRow.setXPath("UserUsername", &lt;TravelRequest.Applicant.idBossUser.userName&gt;);



</pre> 
== Crear una notificación de correo electrónico que incluya los enlaces<br>  ==

Cree una accion de actividad para definir una notificación de correo electrónico que será enviada al Entrar la actividad de aprobación de solicitud de viaje&nbsp;(approve travel request).<br> 

Para ello, nuevamente escoja el paso 4 del asistente (reglas de negocio) y seleccione un nuevo correo electrónico.<br> 

<br> 

<br> 

[[Image:ApproveTravelRequest E-mail SubjectBody.jpg|center|700px]]<br> 

El destinatario de la notificación debe ser el jefe, y el cdeberá incluir los atributos (ApproveLink y RejectLink) de la manera como se muestra a continuación:<br> 
<pre>Para aprobar la solicitud, 
haga clic &lt;a href=&lt;TravelRequest.ApproveLink&gt; target="_blank"&gt;aquí&lt;/a&gt;
Para rechazar la solicitud, 
haga clic &lt;a href=&lt;TravelRequest.RejectLink&gt; target="_blank"&gt;aquí&lt;/a&gt;</pre> 
== Crear la aplicación web de invocación de los servicios web <br>  ==

Cree la aplicación web que recibirá el token para invocar el método [[PerformActivity|''performActivity'']] de los servicios web de su proceso Bizagi de solicitud de viaje. <br> 

Dado que este ejemplo fue trabajado con Microsoft Visual Studio 2008, la solución que contiene la aplicación web será mencionada como "SmartphoneBizagiApplication". 

<br> 

<span><span>Cree un nuevo proyecto en Visual Studio. Seleccione como tipo "ASP. Net Web Application".&nbsp; 
</span></span> 

[[Image:VS WebApplicationSolution.jpg|center|550px]] <br> 

Para esta aplicación SmartphoneBizagiApplication, se configuraron 2 referencias web (web references) en el proyecto de la manera: 

http://[your_Bizagi_server]/[your_Bizagi_project]/webservices/workflowenginesoa.asmx 

http://[your_Bizagi_server]/[your_Bizagi_project]/webservices/entitymanagersoa.asmx 

<br>Por lo tanto, cree las 2 refrencias web de acuerdo a los web services publicados por su proyecto.&nbsp;&nbsp;<br> 

[[Image:VS WebReferenceAdd.jpg|center|550px]]<br>[[Image:VS WebReferenceEMS.jpg|center|550px]] <br> 
<div align="center">
{| width="432" cellspacing="0" cellpadding="0" border="1" class="MsoNormalTableAlert"
|-
| width="100%" valign="top" | 
'''<span lang="ES-CO">Alerta: </span>'''<span lang="ES-CO">Recuerde que lo indicado es un ejemplo y que para seguir prácticas seguras y recomendadas, el acceso a estos servicios web debe estar restringido y controlado en su servidor IIS de acuerdo a sus políticas de seguridad. </span> 

|}
</div> 
<br> 

Dado que se crea un enlance en el proceso de Bizagi, el token para invocar los servicios web debe ser pasado como un parámetro en la URL (a través del método get de HTML).<br>Para obtener el valor desde la aplicación SmartphoneWebApplication's, incluya en el método Page_Load de la clase Default.aspx.cs el código para leer el parámetro: <br><br>Default.aspx.cs: 

[[Image:VS Defaultaspx Smartphone.jpg|center|550px]]<br> 

La invocación de los servicios web como tal, se realiza en una clase diferente que llamaremos WSController.cs. 

Para crear esta clase, adicione un nuevo item en su proyecto: 

[[Image:VS NewClass AddItem.jpg|400px]]<br> 

[[Image:VS NewClass WSController.jpg]]<br> 

<br> 

La clase WSController.cs utiliza el método [[GetEntities|getEntities]] para obtener la información asociada al token y válida para el caso. Posteriormente, se invoca el método performActivity para completar la aprobación o rechazo de la solicitud. 

<br> 

[[Image:WSController.jpg|center]] 

Nótese que el valor del taskName es constante dado que en este ejemplo se utilizó la actividad de Approve travel request activity, que tiene como taskName= "Task11". 

[[Image:ApproveTravelRequestTaskName.jpg|center]] 

Descargue el proyecto Visual Studio [[Media:HowToUseBizagiMobilePhones.rar|<u>'''aquí'''</u>]]. 

<br> 

Index1.htm y Index2.htm son sólamente páginas html que se cargan para mostrar al usuario que la solicitud ha sido procesada. Para este ejemplo, Index1 se carga si ocurre un error mientras que Index2 despliega un mensaje de operación exitosa. 

<br> 

Finalmente, monte estos archivos en su servidor IIS como una aplicación para que pueda ser accesada desde el enlace (como http://[your_Bizagi_server]/[your_iis_application]/Default.aspx). 

Para lograrlo, copie primero el folder del proyecto en Visual Studio en la carpeta C:\inetpub\wwwroot\ de su servidor IIS. 

Seguidamente, abra el administrador de IIS desde el comando Ejecutar como se muestra a continuación:<br> 

<br> 

[[Image:Inetmgr.jpg|center]]

De clic derecho sobre la carpeta copiada y seleccione la opción convertir en aplicación.<br> <br> [[Image:IIS convertToApplication.jpg|center]] 

<br> 

Hemos finalizado el cómo, y en este punto su proceso de solicitud de viaje está listo para permitir al usuario jefe aprobar o rechazar el caso desde su teléfono inteligente! <br> <br>&nbsp;

<comments/>