Asten Processos - Melhorias visuais

Novas funções LUA para alteração de campos

Novas ações disponíveis para manipulação dos campos funcionais. As novas funções estão disponíveis através do insight (Ctrl + F), são elas:

• changeActionLabel: permite alterar o rótulo de um campo
• changeActionHint: permite personalizar o hint de um campo

changeActionLabel

Sintaxe da função: changeActionLabel(cod_acao, valor)

Abaixo encontra-se um exemplo de uma caixa de texto configurada no processo. Atualmente o nome informado no campo "Descrição do campo" é o valor que será adotado como rótulo no momento da exibição na web.

Após chamada a função abaixo a aplicação web irá sobrescrever o rótulo existente no modelador.

changeActionLabel(154161904, 'Informe seu nome completo')

Alguns tipos de componentes não serão afetados por essa sobrescrita, exemplo: rótulo, botão, estruturas HTML, entre outros.

changeActionHint

Sintaxe da função: changeActionHint(cod_acao, valor)

Possui a mesma finalidade a função changeActionLabel porém afetada a propriedade hint do campo.

Após chamada a função abaixo a aplicação web irá sobrescrever o rótulo existente no modelador.

Caso seja necessário apagar o conteúdo do hint basta passar o segundo argumento da função como vazio.

changeActionHint(154221058, 'Qualquer coisa é bem vinda <i class="fa fa-smile-o"></i>')

Novas funcionalidades para Grade Responsiva

Espaçamento

O objetivo é permitir a criação de blocos que atuem como espaçamento, permitindo assim a criação de lacunas que destinam-se a separar e alinhar os campos de formulário.

O espaçamento assim como os campos de formulário dentro da grade responsiva, possuem pontos de quebra que permitem para diferentes resoluções determinar se esse espaçamento estará visível ou não.

A criação desses blocos é controlado pelo próprio modelador de formulário, dependendo do container (linha, coluna, guia, etc) selecionado. Sendo assim a opção para criação do espaçamento só estará disponível se o container atender os requisitos para comportar o bloco de espaçamento.

Uma vez criado o bloco ele será representado dentro do container assim como os demais campos, todavia na pre-visualização é possível observar a alocação de espaço configurado através dos pontos de quebra do mesmo. 

É possível observar na imagem acima que o espaçamento foi configurado para estar visível apenas em altas resoluções, sendo assim no momento que estivermos em baixa resolução o mesmo permanecerá oculto.

Customização de Estilos

Permite personalizar questões como: espaçamento, alinhamento, altura dinâmica e mínima para os campos do formulário. Essas configurações podem ser encontradas através do botão CSS presente em cada campo no modelador de formulários responsivo (caso o campo tenha suporte).

Cada tipo de campo possui suporte a tipos diferentes de configurações, seguem abaixo a descrição de cada tipo:

Espaçamento

Permite definir em pixels o espaçamento no interior do container do componente visando facilitar o alinhamento desse com outros campos do formulário. As imagens abaixo ilustram a diferença visível ao se trabalhar com essas propriedades

Dimensões

Aplicável apenas aos componentes do tipo: tabela avançada e tabela vertical. Permite definir a altura do componente de forma dinâmica, dessa forma o componente irá se ajustar baseado na quantidade de dados em listagem e não mais estará restrito a uma altura fixa.

As propriedades de altura mínima e máxima tornam-se opcionais no momento que a propriedades "Altura automática" encontrar-se habilitada. Visualmente o resultado é o ilustrado nas imagens abaixo.

Flutuação

Aplicável aos componentes: caixa de verificação e rótulo. Permite alinhar o componente à direita (right) ou esquerda (left) dentro do seu container. 

Visualmente o resultado é o seguinte: