Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

O Formulário Mobile é gerado automaticamente pelo Fluig de acordo com um mapeamento dos campos do formulário do processo. A geração automática não traz integrações, customizações, funções Javascript's e CSS, isso deve ser feito manualmente e adequado conforme necessidade do processo. Existem diversas particularidades para o desenvolvimento e customização de formulário Mobile, todos eles serão tradados no decorrer desta documentação.

 

Recomendações para Processos com Formulário

...

Mobile

  1. Inicie o desenvolvimento pelo formulário mais restritivo:O Formulário Mobile é mais restritivo que o Formulário Web, por isso é recomendado que o desenvolvimento seja iniciado por ele. Quando você conseguir colocar todas as informações necessárias pro processo no Formulário Mobile, o mapeamento para Web será muito mais fácil, uma vez que o tamanho de tela é muito maior.

    Obs.: É possível fazer de forma contrária, porém o trabalho normalmente é maior.

  2. Formulário Responsivo: Hoje no mercado existe os mais variados tipos de tamanhos de telas e resoluções, por isso qualquer formulário desenvolvido para Mobile deve ser responsivo, ou seja, deve se ajustar a qualquer tamanho de tela.

  3. Estética:A aparência visual e design do html devem ser atraentes para os usuários, conseguimos isso através de CSS ou jQueryMobile que será explicado nas próximas sessões.

  4. Usabilidade: O Formulário deve ser fácil de usar, contendo apenas o campos importantes para tarefas ou processo.

  5. Área de clique: Os elementos do HTML devem estar bem posicionados de forma que facilite a área de clique, pois hoje existem dispositivos que as telas são muito pequenas.Segue um exemplo:

  6. Posicionamento das ações: As ações mais importantes devem estar posicionadas onde o usuário consegue alcançar mais facilmente, conforme a figura:

  7. Customizações: As customizações devem ser feitas dentro dos eventos do processo ou formulário na Web, todos os eventos que são aplicados nos formulários Web também são aplicados nos formulários Mobile.
  8. Arquivos anexos: Os arquivos anexos do formulário Web não são carregados para o formulário Mobile, por isso o CSS e as funções Javascript's devem ser implementadas dentro do hmtl Mobile.
  9. Acesso a serviços internos e externos: Qualquer acesso a webservices ou outros serviços interno ou externo deve ser feito via javascript. Recomendamos o uso de jQuery Soap para Webservices.
  10. Nem todas informações precisam estar no Mobile: O grande limitador do Mobile é o tamanho de tela, por isso mapeie os campos que são mais importantes para que tenham prioridade no formulário. Existem campos que são informativos e não tem grande utilidade no processo ou tarefas, esses podem ser eliminados do Formulário Mobile.
  11. Formulário Mobile suporta os tipos: text, textArea, radio, select, combobox e checkbox.

...

Exemplos: Formulários Pai Filho + Eventos.

 

Exemplo

HTML
<!DOCTYPE html>

<html>

    <head>

    	<meta http-equiv="X-UA-Compatible" content="IE=edge" />

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <meta name="description" content="Fluig - Iniciar Solicitações" />

        <meta name="keywords" content="Portal, ECM, Social, TOTVS, WCM, WEB, Management" />

        <meta name="author" content="VP Fluig" />

        <title>Fluig - Iniciar Solicitações</title>

        <link rel="shortcut icon" type="image/x-icon" href="/portal/resources/images/favicon.ico" />

<!-- Variável utilizada pelas APIS do portal carregadas antes da configuração do WCMAPI -->


<script type="text/javascript">


	window.wcmlocation = "pt_BR";


</script>





<link type="text/css" rel="stylesheet" href="/portal/resources/merged/wcm_global.css"/><link type="text/css" rel="stylesheet" href="/layoutdefaultecm/resources/css/wcm_widget.css"/><link type="text/css" rel="stylesheet" href="/layoutdefaultecm/resources/css/wcm_tabela.css"/><link type="text/css" rel="stylesheet" href="/portal/resources/components/datatable/datatable.css"/><link type="text/css" rel="stylesheet" href="/portal/resources/components/tabview/tabview.css"/><link type="text/css" rel="stylesheet" href="/portal/resources/css/treeview/jquery.treeview.css"/><link type="text/css" rel="stylesheet" href="/portal/resources/components/treeview/treeview.css"/><link type="text/css" rel="stylesheet" href="/portal/resources/components/message/message.css"/><link type="text/css" rel="stylesheet" href="/portal/resources/components/treetable/jquery.treetable.css"/><link type="text/css" rel="stylesheet" href="/portal/resources/components/treetable/jquery.treetable.theme.default.css"/><link type="text/css" rel="stylesheet" href="/socialalert/resources/socialalert.css"/><link type="text/css" rel="stylesheet" href="/socialchat/resources/css/chat-client.css"/><link type="text/css" rel="stylesheet" href="/globalalertpopover/resources/css/alertpopover.css"/><link type="text/css" rel="stylesheet" href="/application-global-search-suggest-widget/resources/css/suggestsearch.css"/><link type="text/css" rel="stylesheet" href="/sociallogin/resources/css/login.css"/><link type="text/css" rel="stylesheet" href="/menu/resources/css/mainmenu.css"/><link type="text/css" rel="stylesheet" href="/socialsearch/resources/socialsearch.css"/><link type="text/css" rel="stylesheet" href="/usepolicyapi/resources/css/usepolicy.css"/>





<script type="text/javascript" src="/portal/resources/js/api_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/js/wcm_global_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/layoutdefaultecm/resources/js/wcm_widgets_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/js/jqgrid/jquery.jqGrid.min.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/components/datatable/datatable_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/components/tabview/tabview_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/js/treeview/jquery.treeview.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/js/cookie/jquery.cookie.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/components/treeview/treeview_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/components/message/message_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/components/treetable/jquery.treetable_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/socialalert/resources/socialalert_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/social/resources/js/api_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/social/resources/js/socialglobal_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/socialchat/resources/js/chat-client_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/socialchat/resources/js/minidb-min_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/portal/resources/components/mustache/mustache-min_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/social/resources/lib/popoverjs/jquery.popover.min_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/globalalertpopover/resources/js/alertcentralbs_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/globalalertpopover/resources/js/alertpopover_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/application-global-search-suggest-widget/resources/js/suggestsearch_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/ecm_resources/resources/ecm-plugins_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/globalsearch/resources/js/api_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/sociallogin/resources/js/login_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/menu/resources/js/jquery.slidearrow_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/menu/resources/js/widget-menu_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/socialsearch/resources/socialsearch_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/usepolicyapi/resources/js/usepolicy_pt_BR.js" charset="utf-8"></script><script type="text/javascript" src="/usepolicy/resources/js/api_pt_BR.js" charset="utf-8"></script> 





<script type="text/javascript" src="/portal/resources/js/editpage.js"></script>





<script type="text/javascript">


var postLoading = {


		fns: [],


		add: function(newFn) {


			this.fns.push(newFn);


			


			//se postLoading ja rodou, executa a funcao agora mesmo


			if(this.alreadyRan) {


				newFn();


			}


		}


};


</script>        

        <style>

	        	.wcm-menu-background{

	        		background-color : rgb(61, 60, 61) !important;

	        	}




	        	.wcm-menu-indicator-background{

	        		border-top-color : rgb(61, 60, 61) !important;

	        		border-bottom-color : rgb(61, 60, 61) !important;

	        	}




	        	.wcm-menu-more-indicator-background-top{

	        		border-right-color : rgb(61, 60, 61) !important;

	        	}




	        	.wcm-menu-more-indicator-background-bottom{

	        		border-top-color : rgb(61, 60, 61) !important;

	        	}




        	.wcm-background{

        			background-color : rgba(0, 0, 0, 0) !important;




        	}

      		

       		.wcm-header-background{

	        		background-color : rgb(255, 255, 255) !important;        		

       		}

       		

        </style>

        

        <link type="text/css" rel="stylesheet" href="/social/resources/css/socialGlobal.css">

        

    </head>




    <body>

    	<input type="hidden" id="wcm-edit-mode" value="false"/>

    	<link rel="apple-touch-icon" href="/portal/resources/images/ecm_logo.png">

<link rel="apple-touch-startup-image" href="/portal/resources/images/ecm_logo.png">

<link id="linkIcone" rel="shortcut icon" type="image/x-icon" href="/portal/resources/images/favicon.ico" />

<link href="http://fluig.totvs.com/themeecmdefault/resources/css/wcm_style.css" rel="stylesheet" type="text/css" />

<link href="http://fluig.totvs.com/themeecmdefault/resources/css/wcm_style_blue.css" rel="stylesheet" type="text/css" class="myStyles" />




<!-- layout ECM-DEFAULT -->




<!-- WCM Wrapper content -->

<div class="wcm-wrapper-content">




	<!-- Chat -->

	<div id="SlotChat" slot="true" class="slotint">

				





<div id="_instance_2692_" appCode="socialchat">





	<div id="wcm_widget_2692" class="wcm_widget">


		<!-- Não mostra engrenagem em modo de edição -->		





        <div class="wcm_corpo_widget_single">











            	


        </div>


	</div>


</div>








	</div>




    <!-- Header -->

          <div id="wcm_header" class="wcm-header-background wcm-header">




          	<!-- Grouper left -->

              <div class="header-grouper-left">

	               <!-- Container logo -->

	               <a href="http://fluig.totvs.com/portal/home" class="wcm_logo" title="Fluig">

						<img src="http://fluig.totvs.com/portal/resources/images/10097/logo_image.png"></img>

	               </a>

              </div>




		<!-- Grouper right -->

		<div class="header-grouper-right">




               <!-- Container busca -->

			<div id="SlotInstantSearch" slot="true" class="slotint slot-header-actions">

				





<div id="_instance_2697_" appCode="suggestsearch">





	<div id="wcm_widget_2697" class="wcm_widget">


		<!-- Não mostra engrenagem em modo de edição -->		





        <div class="wcm_corpo_widget_single">


<form>

	<div id="SuggestSearch_2697" class="suggest-search wcm-widget-class clearfix super-widget" data-params="SearchSuggest.instance({})">

		<div class="suggest-search-tool">

			<input name="searchInputText" data-search-input-text class="search-input-text" type="text"

				placeholder="O que deseja encontrar?" autocomplete="off" value=""/>

			<input id="btnSearchsuggest" data-btnSearchsuggest class="search-input-button" type="submit" value=""/>

		</div>

		<div id="searchResultsDropdown" class="search-dropdown"></div>

	</div>

</form>

            	


        </div>


	</div>


</div>








			</div>

			

			<!-- Container alerta global-->

			<div id="SlotGlobalAlert" slot="true" class="slotint slot-header-actions">

				





<div id="_instance_2699_" appCode="alertpopover">





	<div id="wcm_widget_2699" class="wcm_widget">


		<!-- Não mostra engrenagem em modo de edição -->		





        <div class="wcm_corpo_widget_single">








<div id="alert_popover_2699" class="wcm-widget-class super-widget global-alert-popover" data-params="AlertPopover.instance({})">

	<div id="global-alert-popover" class="popover-icon clearfix">

		<a class="popover-icon-link clearfix" href="http://fluig.totvs.com/portal/p/10097/globalalertview">

			<span class="byyou-icon byyou-icon-alert"></span>

			<span class="alert-number unread-alert-counter">&nbsp;</span>

		</a>

	</div>

	

	<script type="text/template" class="tpl_notification_list">




	{{^hasNotifications}}

		<div class="system-message-warning popover-message-no-alerts">Sem notificações.</div>

	{{/hasNotifications}}




	{{#notifications}}

	<div class="popover-alert {{^read}}popover-alert-new{{/read}} clearfix" data-alert-id="{{id}}" data-mark-read>




		<div class="clearfix">

			{{#hasSenders}}

				<figure class="popover-user-img fl">

					<img src="/social/api/rest/social/image/thumb/{{getLastSenderLogin}}" />

				</figure>

			{{/hasSenders}}

			{{^hasSenders}}

					<img class="popover-user-img fl" src="{{getEventIcon}}" />

			{{/hasSenders}}

			<span class="popover-alert-info fl">

				<span class="popover-alert-content">

					{{#getSenders}}

					<a class="popover-link totvs-link-default" href="{{getSenderLink}}">{{user.fullName}}</a>,

					{{/getSenders}}




					{{#hasMorePeople}}

						e mais <a class="popover-link totvs-link-default" 

						data-object-id="{{object.objectId}}" data-timeline-link-supported 

						data-users="{{#getAdditionalPeople}}{{user.login}},{{/getAdditionalPeople}}">{{getNumAdditionalPeople}} 

						pessoas</a>&nbsp;

					{{/hasMorePeople}}

				

					<span>

						{{getEvent}}




						{{#object}}

							{{typeDescription}} 

							<a class="popover-link totvs-link-default" href="{{defaultURL}}{{link}}">"{{description}}"</a> 

							{{objectDetail}}

						{{/object}}

					</span>




					{{#place}}

						em

						<a class="popover-link totvs-link-default" href="{{defaultURL}}{{link}}">{{description}}</a>

						{{objectDetail}}

					{{/place}}

				

				</span>

				<span class="popover-alert-date alert-date" data-ts="{{remainingTS}}">Há {{remainingTime}}</span>

			</span>

		</div>




		{{#hasActionsNotification}}

			<div class="popover-alert-actions clearfix">

	

				{{#hasNotificationsSingleActions}}

					{{#getActionsNotification}}

						<input class="{{getClassButtonType}} mini" type="button" value="{{description}}" data-actions-notification="{{id}}"

							data-notification-action-type="{{type}}" data-notification-action-url="{{url}}" />

					{{/getActionsNotification}}

				{{/hasNotificationsSingleActions}}

	

				{{#hasNotificationsGroupActions}}

					<div class="button-subitems clearfix">

						<button class="totvs-btn-action mini button-options">

							<span class="button-subitems-label">Ações</span>

							<span class="byyou-controller byyou-controller-bottom2 icon-small"></span>

						</button>

						<ul class="action-options">

							{{#getActionsNotification}}

								<li class="action-options-item">

									<a href="#" class="totvs-btn-link" data-actions-notification="{{id}}" 

										data-notification-action-type="{{type}}" data-notification-action-url="{{url}}">{{description}}</a>

								</li>

							{{/getActionsNotification}}

						</ul>

					</div>

				{{/hasNotificationsGroupActions}}




				{{#getExecutedActionsNotification}}

					<div class="action-made fr">{{descriptionAfterExec}}</div>

				{{/getExecutedActionsNotification}}

			</div>

		{{/hasActionsNotification}}




	</div>

	{{/notifications}}

	</script>

</div>




            	


        </div>


	</div>


</div>








			</div>




			<!-- Container login -->

			<div id="SlotLogin" slot="true" class="slotint slot-header-actions">

				





<div id="_instance_2698_" appCode="sociallogin">





	<div id="wcm_widget_2698" class="wcm_widget">


		<!-- Não mostra engrenagem em modo de edição -->		





        <div class="wcm_corpo_widget_single">





<div id="sociallogin_2698" class="wcm-widget-class wcm_login wcm-widget-login super-widget" data-params="SocialLogin.instance()">

	<div class="login-wrapper clearfix">		

		<!-- Menu user actions -->

		<div class="container-image-wrapper" data-login-image-wrapper>

			<div class="bg-menu-header login-image-wrapper wcm-header-background wcm-luminosity-border wcm-clear-backgroundimage">

				<img class="login-image-user" id="user-menu-picture">

			</div>

			<!-- Menu flutuante user actions -->

                <div class="menu-user-actions system-float-box top-right container-box-actions">

                    <ul class="login-list">

                        <li class="login-list-itens first"><strong>Minhas conexões</strong></li>

                        <li class="login-box-line"></li>

                        <li data-social-alias="alberto.freitas" data-social-type="following" data-login-relation-list-itens class="login-list-itens login-relation-list-itens">Seguindo | 260</li>

                        <li data-social-alias="alberto.freitas" data-social-type="followers" data-login-relation-list-itens class="login-list-itens login-relation-list-itens">Seguidores | 226</li>

                        <li data-social-alias="alberto.freitas" data-social-type="communities" data-login-relation-list-itens class="login-list-itens login-relation-list-itens last">Comunidades | 67</li>

                    </ul>

                </div>

		</div>

		<!-- Menu wcm login -->

		<div class="container-login-wrapper" data-login-name-wrapper>

			<div class="container-login-arrow wcm-luminosity-border-right"></div>

			<div class="bg-menu-header login-name-wrapper wcm-header-background wcm-luminosity-border wcm-clear-backgroundimage">

				<span class="login-name-user wcm-luminosity-header-color">Alberto</span>

				<span class="login-name-user wcm-luminosity-header-color">Placido de Freitas Neto</span>

				<div class="container-login-config wcm-luminosity-header-background-image"></div>

			</div>

			<!-- Menu flutuante wcm login -->

			<div class="wcm-login-config system-float-box top-right container-box-actions">

				<ul class="login-list">

                            <li class="login-list-itens"><strong>Configurações</strong>

                                <ul class="sub-list">

                                    <li class="login-list-itens login-config-list-itens" data-login-config-list-itens data-page-alias="wcmuserpreferences">Editar perfil</li>

                                </ul>

                            </li>

                            <li class="login-box-line"></li>

                            <li class="login-list-itens login-config-list-itens" data-login-config-list-itens data-page-alias="language">Idioma</li>

                            <li class="login-list-itens login-config-list-itens" data-login-config-list-itens data-page-alias="pagehelp">Ajuda</li>




						<li class="login-list-itens login-config-list-itens last" data-login-config-list-itens data-page-alias="logoff">Sair</li>

				</ul>

			</div>			

		</div>		

	</div>

</div>




            	


        </div>


	</div>


</div>








			</div>




		</div>




          </div>




	<!-- Menu esquerdo -->

	<nav class="wcm-navigation wcm-menu-background">

       	<div id="SlotMenu" slot="true" class="slotint">

	       	 	





<div id="_instance_2694_" appCode="menu">





	<div id="wcm_widget_2694" class="wcm_widget">


		<!-- Não mostra engrenagem em modo de edição -->		





        <div class="wcm_corpo_widget_single">


<div id="wcmmenu_2694" class="blue wcm-menu-content wcm-widget-class" data-params="WCMMenu(		{instanceId: 2694, isPortalAdmin: 'false'}

)" >

	<div class="wcm-menu">

		<ul id="wcm-menu-list" style="list-style: none; margin: 0px; padding: 0px;">

			<li class="wcm-menu-more">

			    <a class="wcm-luminosity-menu-color wcm-luminosity-menu-background-image" href="#" style="background-image: url('/portal/resources/images/mainmenu/icon_mais_light.png');">

			    	Mais

			    </a>

			    <div class="wcm-menu-more-container wcm-menu-more-background">

			    	<div class="wcm-menu-more-indicator-top-line">&nbsp;</div>

			    	<div class="wcm-menu-more-indicator-top wcm-menu-more-indicator-background-top">&nbsp;</div>

			    	<div class="wcm-menu-more-indicator-bottom-line">&nbsp;</div>

			    	<div class="wcm-menu-more-indicator-bottom wcm-menu-more-indicator-background-bottom">&nbsp;</div>

			    	<ul class="wcm-menu-more-content"></ul>

			    </div>

			</li>

		</ul>

	</div>

</div>

            	


        </div>


	</div>


</div>








	    </div>

    </nav>




	<!-- Wrapper -->

	<div class="wcm-all-content">

           <div id="wcm-content" class="clearfix wcm-background">







			<div id="wcm_widget" class="wcm_widget_full clearfix">

			    <div id="SlotA" slot="true" decorator="true" editableSlot="true">

			        	





<div id="_instance_2691_" appCode="ecm_processstart">





	<div id="wcm_widget_2691" class="wcm_widget">


		<!-- Não mostra engrenagem em modo de edição -->		





        <div class="wcm_corpo_widget_single">


<div id="2691_EcmProcessStart" class="blue">


	<link rel="stylesheet" id="ecm-plugins-css" type="text/css" href="/ecm_resources/resources/ecm-plugins.css" />


	<link rel="stylesheet" type="text/css" href="/ecm_processstart/resources/css/view.css" />


	<link rel="stylesheet" type="text/css" href="/ecm_processstart/resources/css/treetable.css" />


	


	<script type="text/javascript" src="/ecm_resources/resources/ecm-plugins_pt_BR.js"></script>





    <script type="text/javascript" src="/ecm_processstart/resources/js/view_pt_BR.js"></script>


    <script type="text/javascript" src="/ecm_processstart/resources/js/favorites_pt_BR.js"></script>


    <script type="text/javascript" src="/ecm_processstart/resources/js/treetable_pt_BR.js"></script>   





	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/joint.raphael_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/joint_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/joint.arrows_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/joint.dia_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/joint.dia.serializer_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/wkfDragend_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/webkitdragdrop_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/wkfGraphicalObjectMethods_pt_BR.js" type="text/javascript"></script>


	<script src="/ecm-widget-processdefinition/resources/js/workflowmodeling/wkfObjectsFactory_pt_BR.js" type="text/javascript"></script>





	<div>


			


		<div id="page-title">Iniciar Solicitações</div>


		<div style="width:48%; float:left; margin:20px 0px 10px  10px ;">


			


			<div class="ui-jqgrid ui-widget ui-widget-content ui-corner-all"  dir="ltr" >


			


			<div id="ecm-processStart-treetable">


				<table id="process-table" class="treetable">


					<div id="process-table-top">


        				<span id="process-table-top-text">Processos disponíveis</span>


        			</div>	


        			<thead>


          				<tr>


          					<th id="process-table-header" style="padding-left:20px">Descrição </th>


            				<th id="process-table-header">Link</th>


            				<th id="process-table-header">Favorito</th>


          				</tr>


        			</thead>


        			<tbody id="table-body"></tbody>


        		</table>


			</div>


			</div>	 


		</div>


		<div style="width:48%; float:left; margin:20px 0px 10px  10px ;">			


				<table id="ecm-processfavorites-grid"></table>


				<div id="ecm-processfavorites-page"><span id="ecm-processfavorites-page-title">Processos favoritos</span></div>


			


		</div>


	</div>


	


	


</div>


            	


        </div>


	</div>


</div>








			    </div>

			</div>










                <!-- Footer -->

                <div id="wcm_footer">

                 <div id="wcm_footer_interna_logo">

                     <span id="ecm-version">

                     	<span class="ecm-data-version">Fluig 1.2.7 - EP2 - </span> <span class="ecm-data-revision">37</span>

                     	- Usuário: Alberto Placido de Freitas Neto

                     </span>

                     

					<!-- Container use policy -->

					<div id="SlotUsePolicy" slot="true" class="slotint">

						





<div id="_instance_2696_" appCode="usepolicy">





	<div id="wcm_widget_2696" class="wcm_widget">


		<!-- Não mostra engrenagem em modo de edição -->		





        <div class="wcm_corpo_widget_single">








<div id="use_policy_2696" class="wcm-widget-class super-widget clearfix widget-use-policy widget-use-policy-view" data-params="SocialUsePolicy.instance({alias: ''})">

	<!-- Modal de visualizar documentos -->

	<div class="view-document-modal">

		<iframe width="100%" height="99%" class="iframe-view-document" frameborder="0"></iframe>

	</div>

	<a class="totvs-link-default" data-view-use-policy>Política de uso</a>

</div>




            	


        </div>


	</div>


</div>








					</div>

                     

                 </div>

            	</div>

           </div>

    </div>

</div>

    	  	




<script type="text/javascript">

WCMAPI.serverURL = "http://fluig.totvs.com";WCMAPI.contextPath = "/portal";WCMAPI.protectedContextPath = "/portal/p";WCMAPI.serverContextURL = "/portal";WCMAPI.colorMenu = "rgb(61, 60, 61)";WCMAPI.colorBackground = "rgba(0, 0, 0, 0)";WCMAPI.imageBackground = "false";WCMAPI.imageLogo = "true";WCMAPI.spaceId = "0";WCMAPI.themeId = "0";WCMAPI.pageId = "36";WCMAPI.pageCode = "pageprocessstart";WCMAPI.pageType = "0";WCMAPI.pageLayout = "0";WCMAPI.parentPageCode = "principalprocess";WCMAPI.friendlyURL = "";WCMAPI.locale = "pt_BR";WCMAPI.localeDisplayName = "português (Brasil)";<!--WCMAPI.isSAMLEnabled = "true";-->	

		WCMAPI.isSAMLEnabled = true;

		WCMAPI.idpHomePageURL = "https://totvs.fluigidentity.com/cloudpass";

WCMAPI.tenantCode = "10097";WCMAPI.organizationId = "10097";WCMAPI.userId = "2467";WCMAPI.userCode = "15309636";		if (WCMAPI.userCode == '') {

WCMAPI.userCode = "alberto.freitas";		}

WCMAPI.user = "Alberto Placido de Freitas Neto";WCMAPI.userLogin = "alberto.freitas";WCMAPI.userEmail = "[email protected]";WCMAPI.userIsLogged = true;

	if(postLoading.fns.length) {

		for(var i=0; i < postLoading.fns.length; i++) {

			postLoading.fns[i]();

		}

	}




	postLoading.alreadyRan = true;




	function loadWidgets() {

		WCMAPI.loadWidgets();

	}




	loadWidgets();




	$.ajaxSetup({

		complete: function() {




			if($('.wcm-widget-class').length) {

				loadWidgets();

			}

		}

	});




</script>




        <!-- Garante que todos os elementos da página foram renderizados -->

        <script type="text/javascript">

            $(document).ready(function() {

            	

            	/*

                var rootIds = ["slotFull1", "slotFull2", "slotFull3"];

                var idArray = ["slot1_txtarea_top", "slot1_txtarea_bottom",

		                       "slot2_txtarea_top", "slot2_txtarea_bottom",

		                       "slot3_txtarea_top", "slot3_txtarea_bottom"];




                    WCM.layout.populateTextFields ( false, idArray );

                    WCM.layout.hiddenEmptySlotFields ( rootIds );

                

                */




                initTheme();

                $('.wcm-all-content').css('visibility','visible');




            });




        	function initTheme() {

        	

        		refreshMoreMenu($('.wcm-menu-background').css('background-color'));

				refreshLuminosityMenu(false, 'wcm-menu-background');

        		refreshHeaderLuminosityTags(false);




            	$('#wcm_breadcrumbs li a').each(function() {

                	$(this).attr('href','#');

                });




            	// Adicionando evento do resize para jqgrid

            	$(window).unbind('resize', resizeAllGrids);

            	$(window).bind('resize', resizeAllGrids).resize();

            };

            

            function refreshHeaderLuminosityTags(showAnimate){

            	var rgbLight = 'rgb(255,255,255)';

	        	var rgbDark = 'rgb(0,0,0)';

            	var rgbaLight = 'rgba(255,255,255,.4)';

	        	var rgbaDark = 'rgba(0,0,0,.4)';

	        	var headerLuminosity = new TAGColour('wcm-header-background').getLuminosity();

				

		        var tagsLuminosityBorder = $('.wcm-luminosity-border');

		        var tagsLuminosityBorderRight = $('.wcm-luminosity-border-right');

		        var tagsLuminosityHeaderColor = $('.wcm-luminosity-header-color');

		        var tagsLuminosityHeaderBackgroundImage = $('.wcm-luminosity-header-background-image');

				

				if(headerLuminosity == 'dark'){

					tagsLuminosityBorder.animate({borderColor: rgbaLight}, showAnimate ? "slow" : 0);

					tagsLuminosityBorderRight.animate({borderRightColor: rgbaLight}, showAnimate ? "slow" : 0);

					tagsLuminosityHeaderColor.animate({color: rgbLight}, showAnimate ? "slow" : 0);

					refreshLuminosityImages(tagsLuminosityHeaderBackgroundImage, 'light', 'dark', showAnimate);

				}else{

					tagsLuminosityBorder.animate({borderColor: rgbaDark}, showAnimate ? "slow" : 0);

					tagsLuminosityBorderRight.animate({borderRightColor: rgbaDark}, showAnimate ? "slow" : 0);

					tagsLuminosityHeaderColor.animate({color: rgbDark}, showAnimate ? "slow" : 0);

					refreshLuminosityImages(tagsLuminosityHeaderBackgroundImage, 'dark', 'light', showAnimate);

				}

            }

            

            function refreshLuminosityImages(jTag, newLuminosity, oldLuminosity, showAnimate){

				if(jTag){

					for(var i = 0; i < jTag.length; i++){

						var jTagImage = $(jTag[i]);

						var newUrlImage = jTagImage.css('background-image').replace(oldLuminosity, newLuminosity);

						jTagImage.css('opacity',0).css('background-image', newUrlImage).animate({opacity : 1}, showAnimate ? "slow" : 0);

					}

				}

            }

            

            function resizeAllGrids(){

            	if (grid = $('.ui-jqgrid-btable:visible')) {

                    grid.each(function(index) {

                        gridId = $(this).attr('id');

                        gridParentWidth = $('#gbox_' + gridId).parent().width();

                        $('#' + gridId).setGridWidth(gridParentWidth);

                    });




                    $('.ui-jqgrid-pager-clone').each(function(){

                    	var idClone = $(this).attr('id');

                    	var idOriginal = idClone.substring(0, idClone.length - 6);

                    	$(this).width($('#'+idOriginal).width());

                    });

                }

            };

			

			function refreshLuminosityMenu(showAnimate, tag){

				var rgbLight = 'rgb(215,215,215)';

	        	var rgbDark = 'rgb(0,0,0)';

				var menuLuminosity = new TAGColour(tag).getLuminosity();

				var tagsLuminosityMenuColor = $('.wcm-luminosity-menu-color');

				var tagsLuminosityHeaderBackgroundImage = $('.wcm-luminosity-menu-background-image');

			

				if(menuLuminosity == 'dark'){

					tagsLuminosityMenuColor.animate({color: rgbLight}, showAnimate ? "slow" : 0);

					refreshLuminosityImages(tagsLuminosityHeaderBackgroundImage, 'light', 'dark', showAnimate);

				}else{

					tagsLuminosityMenuColor.animate({color: rgbDark}, showAnimate ? "slow" : 0);

					refreshLuminosityImages(tagsLuminosityHeaderBackgroundImage, 'dark', 'light', showAnimate);

				}

			}




            function refreshMoreMenu(colorMenu) {

			    var arrayRbg = extractRGBColor(colorMenu);

				var rgbColor = new RGBColour(arrayRbg[0],arrayRbg[1],arrayRbg[2]);

				var hslColor = rgbColor.getHSL();

				var endColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l);

				var startColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l + 4);

				var shadowColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l - 8);

				

				if(hslColor.l > 95){

					shadowColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l - 25);

				}else if(hslColor.l > 90){

					shadowColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l - 20);

				}else if(hslColor.l > 85){

					shadowColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l - 15);

				}else if(hslColor.l < 1){

					startColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l + 9);

					shadowColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l + 46);

				}else if(hslColor.l < 5){

					startColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l + 7);

					shadowColor = new HSLColour(hslColor.h,hslColor.s,hslColor.l + 20);

				}

				

				var jWcmMenuMoreBackground = $('.wcm-menu-more-background');

				

				jWcmMenuMoreBackground.css('background' , 'linear-gradient(to right,'+ startColor.getCSSHexadecimalRGB() +' 0%,'+ startColor.getCSSHexadecimalRGB() +' 30%,'+ endColor.getCSSHexadecimalRGB() +' 70%,'+ endColor.getCSSHexadecimalRGB() +' 100%)');

				$('.wcm-menu-more-indicator-background-top').css('border-right-color' , startColor.getCSSHexadecimalRGB());

				$('.wcm-menu-more-indicator-background-bottom').css('border-top-color' , startColor.getCSSHexadecimalRGB());

				

				jWcmMenuMoreBackground.css('box-shadow' , '1px 1px 7px 0px ' + shadowColor.getCSSHexadecimalRGB());

				$('.wcm-menu-more-indicator-top-line').css('box-shadow' , '-1px 0px 4px 0px ' + shadowColor.getCSSHexadecimalRGB());

				$('.wcm-menu-more-indicator-bottom-line').css('box-shadow' , '2px -2px 4px 0px ' + shadowColor.getCSSHexadecimalRGB());




				var jWcmSubmenuBackground = $('.submenu');

				jWcmSubmenuBackground.css('background' , 'linear-gradient(to right,'+ startColor.getCSSHexadecimalRGB() +' 0%,'+ startColor.getCSSHexadecimalRGB() +' 30%,'+ endColor.getCSSHexadecimalRGB() +' 70%,'+ endColor.getCSSHexadecimalRGB() +' 100%)');

				jWcmSubmenuBackground.css('box-shadow' , '1px 1px 7px 0px ' + shadowColor.getCSSHexadecimalRGB());

            };

            

            function extractRGBColor(color){

				return color.substring(color.indexOf('(') + 1, color.indexOf(')')).split(',');

			};					

        </script>

			<script type="text/javascript"> 

				var N=navigator.appName, ua=navigator.userAgent, tem;

				var M=ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i);

				if(M && (tem= ua.match(/version\/([\.\d]+)/i))!= null) M[2]= tem[1];

				M=M? [M[1], M[2]]: [N, navigator.appVersion, '-?'];

				var browserName = M[0];

				var browserVersion = jQuery.browser.version;

				browserVersion = browserVersion.split('.')[0];

				browserVersion = parseInt(browserVersion);

												

				if(!((browserName === "Chrome" && browserVersion >= 28)||(browserName === "Firefox" && browserVersion >= 22)||(WCMAPI.isIe() && browserVersion >= 9))){

					WCMAPI.openValidateNavigation();

				}

			</script>

			

            <script type="text/javascript">

                var accountGoogle = "UA-44660509-1";

                var accountGoogleFluig = "UA-48421702-1";

                var domain = 'byyou.com';

                var _gaq = _gaq || [];

                _gaq.push(['_setAccount', accountGoogleFluig]);

                _gaq.push(['_trackPageview']);

                _gaq.push(['_setDomainName', domain]);




                if (accountGoogle != '' && accountGoogle != accountGoogleFluig) {

                    _gaq.push(['b._setAccount', accountGoogle]);

                    _gaq.push(['b._trackPageview']);

                }

                (function() {

                    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;

                    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

                    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);

                })();

            </script>

        

        <!--[if lte IE 9]>

		<script>

		    var links = $('link[rel="stylesheet"]'),

			  urls = [],

			  coef = 15,

			  numLists = Math.ceil(links.length / coef),

			  arrs = [],

			  currArr;




			//se tiver mais do que 30 estilos, continua

			if(links.length >= 30) {

			  links.each(function(idx, link) {

				urls.push(link.href);

			});




			links.remove();




			for(var i = 0; i < numLists; i++) {

				currArr = urls.splice(0, coef);

				//arrs.push(currArr);




				var style = "<style type='text/css'>";

				for(var j = 0; j < currArr.length; j++) {

					style += '@import url("' + currArr[j] + '");\n ';

				}




				style += '</style>';




				$('head').append(style);

			  }

			}

		</script>

		<![endif]-->

	</body>

</html>