Linha Logix

Páginas filhas
  • 4.1. Criação de processos

Versões comparadas

Versão antiga 34

changes.mady.by.user Usuário desconhecido (rubens.santos)

Gravado em

comparado com

Nova versão Atual

changes.mady.by.user Leticia de Liz Engelke

Gravado em

Chave

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

...

Índice

No Fluig é possível utilizar processos que efetuam integração com o Logix.

...

 Estes processos

...

são criados utilizando o Fluig Studio, para saber mais sobre esta ferramenta consulta a documentação em: Fluig Studio.

...

 Abaixo pode ser encontrado a documentação para a criação de um processo utilizando

...

eventos padrões disponíveis

...

.

...

Para utilizar os estilos e eventos padrões disponíveis é necessário primeiramente que no formulário HTML do processo sejam referenciadas as bibliotecas JavaScript jQuery na versão 1.8.3 e jQueryUI na versão 1.9.2 (para mais informações visite http://jquery.com/ e http://jqueryui.com/).

...

Índice
maxLevel2
outlinetrue
exclude1


Script padrão Logix

Para os workflows que necessitem execução de zoom Logix é necessário incluir ao final do HTML o script wfLogixUtil.js e exportar o arquivo Javascript junto ao formulário.

Bloco de código
themeEclipse
languagehtml/xml
<head>
<body>
    <!-- Código HTML -->
  <!-- Biblioteca JavaScript do Fluig/ECM -->
    <script src="wfLogixUtil.js"></script>
</body>


Estilo padrão

Os estilos dos formulários HTML devem seguir o padrão do guia de estilo do Fluig encontrado no link http://style.fluig.com.


Zooms

Para atribuir zooms aos campos é necessário incluir no elemento o atributo data com as informações do zoom no formato JSON string.

Classes CSS

Atualmente existem uma séries de classes CSS que podem ser utilizadas através do arquivo de estilos padrão para estilizar e agrupar os elementos do formulário HTML.

Bloco de código
themeEclipse
languagejavascript
{
    "zoom": {
<script
type=
"
text/javascript
name":
src="../vcXMLRPC.js"></script>
"zoom_item",
        "selection": [
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script> <script type="text/javascript" src="wfLogixUtil.js"></script> <!-- Código HTML --> </head>
Âncora
CLASSES_CSSCLASSES_CSS
Float
sideleft

Índice
exclude1

Float
sideright
Deck of Cards
idCLASSES_CSS
historyfalse
effectTypefade
Card
labelAGRUPADORES
effectTypefade

Utilize as classes de agrupadores para organizar os campos em tela.

 

.fw-model

Agrupa em um elemento div todos os outros elementos do formulário HTML.

  ["cod_item_compon","cod_item"],
            ["den_item","den_item_reduz"]
        ],
        "whereclause": {
            "fn": "setWhereClause",
            "args": ["item"]
        }
    }
}

As informações que devem ser atribuídas para o correto funcionamento do zoom são:

  • name: nome do zoom cadastrado no metadado Logix.
  • selection:
    • lista com os campos que serão carregados ao selecionar o registro no zoom, o primeiro item é o nome do campo do formulário e o segundo é o nome do campo no zoom do qual o primeiro item receberá o valor.
  • whereclause:
    • fn: função JavaScript que será executada quando o zoom for acionado para retornar o filtro SQL a ser considerado na apresentação dos registros do zoom.
    • args: lista com valores que serão passados como parâmetros para a função definida no atributo fn.

Nota

Além das informações do zoom acima é necessário incluir nos elementos o atributo data-input-zoom
para que seja possível identificar quais campos possuirão zoom.


Exemplo
Bloco de código
themeEclipse
languagehtml/xml
<div>
    <label for="cod_item_compon">Componente atual:</label>
    <input type="text" name="cod_item_compon" data='{"zoom":{"name":"zoom_item","selection":[["cod_item_compon","cod_item"],["den_item","den_item_reduz"]],"whereclause":{"fn":"setWhereClause","args":["item"]}}}' data-input-zoom>
</div>


Zoom em formulários Pai x Filho

Em formulários Pai Filho os campos filhos são criados dinamicamente e consequentemente o comportamento destes campos não segue o mesmo padrão dos outros campos do formulário. Para solucionar este problema é recomendável seguir os passos abaixo:

1. Criar o botão e evento de inclusão de campos filhos manualmente

    • Para isto deve-se incluir no elemento de tabela do formulário o atributo noaddbutton com o valor true;
    • Na ação do botão, informar o evento addItem enviando por parâmetro o nome da tabela filha.


Exemplo
Bloco de código
themeEclipse
languagehtml/xml
<form method
<div>
    <input type="
post"> <!-- INICIO DO CONTEUDO DO FORMULARIO -->   <div class="fw-model ui-widget-content"> <!-- Elementos do formulário HTML, campos, seletores, grupos, etc. --> </div>   <!-- FIM DO CONTEUDO DO FORMULARIO
button" onclick="addItem('itens');" value="Adicionar item"/>
</div>

<table noaddbutton="true" tablename="itens">
    <!-- Código HTML -->
</
form>

 

.fw-box

Agrupa em um elemento div os elementos de uma determinada tabela ou seção (um agrupamento para mestre e outro para detalhe por exemplo).

 
table>


2. Criar o evento JavaScript para incluir e alterar o estilos dos campos filhos

    • Para incluir novos itens filhos, utilizar a função padrão wdkAddChild passando por parâmetro o nome definido no atributo tablename;
    • O evento wdkAddChild irá criar os itens filhos e retornar o número da linha criada;
    • Após, executar a função initLogixHtml passando um objeto com o número da linha e o nome da tabela definido no atributo tablename.


Exemplo
Bloco de código
themeEclipse
language
html/xml
<form method="post">
	<!-- INICIO DO CONTEUDO DO FORMULARIO -->
 
	<div class="fw-model ui-widget-content">
		<div id="MESTRE" class="fw-box" style="height: 60%; width: 100%;">
			<!-- Elementos do formulário HTML, campos, seletores, grupos, etc. -->
		</div>

		<div id="DETALHE" class="fw-box" style="height: 40%; width: 100%;">
			<!-- Tabelas ou grades com informações em listas -->
		</div>
	</div>
 
	<!-- FIM DO CONTEUDO DO FORMULARIO -->
</form>

Anexos

javascript
function addItem(tablename) {
    var row = wdkAddChild(tablename);
    initLogixHtml({ "tablename": tablename, "row": row });
}

Seguindo os passos acima, os itens filhos irão se comportar normalmente assim como o restante dos campos do formulário.

 

Defindo o código da empresa

Para utilizar as rotinas do Logix a partir do workflow é necessário que haja o código da empresa que será utilizada na rotina. Para isso, deve criar um campo no formulário onde será informado o código da empresa e incluir para este campo o atributo data-cod-empresa. O valor informado no campo que possuir este atributo será considerado o código da empresa na rotina durante a execução.

Exemplo
Bloco de código
themeEclipse
languagehtml/xml
<div>
    <label for="cod_empresa">Empresa:</label>
	<input type="text" name="cod_empresa" data='{"zoom":{"name":"zoom_empresa","selection":[["cod_empresa","cod_empresa"],["den_empresa","den_empresa"]]}}' data-cod-empresa data-input-zoom>
</div>


Anexos