TOTVS Fluig

Atalhos

Árvore de páginas

Versões comparadas

Versão antiga 10

changes.mady.by.user Thiago Venturelli

Gravado em

comparado com

Nova versão 11

changes.mady.by.user Thiago Venturelli

Gravado em

Chave

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

Esta página faz parte de um conjunto de informações que foram organizadas para facilitar o seu entendimento sobre o assunto em questão. Caso você ainda não tenha lido a primeira página, recomendamos que comece por lá para ter uma visão geral do conteúdo. Isso irá ajudá-lo a compreender melhor as informações apresentadas nesta página e no restante do material. Agradecemos pela sua compreensão e esperamos que essa documentação possa ser útil para você.

Através da codificação, o usuário pode personalizar totalmente o layout e o comportamento do formulário, atendendo às necessidades específicas da empresa. Com essa flexibilidade, é possível incluir campos personalizados, integrar com outros sistemas, criar regras avançadas de validação de dados e até mesmo criar fluxos personalizados dentro do próprio formulário. A criação de formulários avançados no fluig é uma das maneiras mais eficientes de otimizar os processos de negócios e aumentar a produtividade da empresa.

Através da codificação, o usuário pode personalizar totalmente o layout e o comportamento do formulário, atendendo às necessidades específicas da empresa. Com essa flexibilidade, é possível incluir campos personalizados, integrar com outros sistemas, criar regras avançadas de validação de dados e até mesmo criar fluxos personalizados dentro do próprio formulário. A criação de formulários avançados no fluig é uma das maneiras mais eficientes de otimizar os processos de negócios e aumentar a produtividade da empresa.

"Hello World"

 Para quem está começando a aprender sobre o fluig, este é um passo fundamental e simples para entender como funciona a criação de formulários. Vamos começar?

...

Deck of Cards
idprimeiros-passos
tabLocationleft
Card
defaulttrue
idcriar-html-simples
labelCriar o html

Se você nunca fez um formulário no fluig, podemos começar simples, sem ferramentas mirabolantes, apenas o fluig e um editor de texto.


Você só precisa ter atenção a dois pontos:

  • As tags html e body são necessárias.
  • Todos os campos que serão preenchidos precisam estar dentro da tag form do html.


Bloco de código
languagexml
titlemeu-primeiro-form.html
linenumberstrue
<html>
<body>
    <form name="form" role="form">
        Oi. Informe o seu nome: <input type="text" name="name" />
    </form>
</body>
</html>
Card
idacessar-fluig
labelAcessar o fluig

Agora, acesse o o fluig com seu usuário e senha e siga esses passos:

  1. Entre página de documentos;
  2. Crie uma pasta ou escolha uma existente como a pasta “Formulários Fluig”;
  3. Clique no botão “Novo”; e
  4. Escolha a opção “Formulário Avançado”.

Card
idfazer-upload
labelFazer o Upload

Ao abrir a modal, você deve:

  1. Escolher o arquivo html criado;
  2. Definir um nome para o seu formulário

Confirme a modal e pronto, seu formulário foi criado no fluig.

Card
idabrir-formulario
labelAbrir o formulário

Agora que seu formulário já foi criado, você pode inserir um registro nele. Para isso você deve:

  1. Acessar a pasta criada com a descrição escolhida;
  2. Clicar no botão Novo;
  3. Selecionar a opção “Registro de formulário”

Card
idcriar-registro
labelCrianr um registro

O seu formulário irá abrir em uma modal. Preencha os dados e confirme e o seu registro de formulário será criado.



Acessando e editando um registro

Acessar e editar um registro é bastante parecido com a criação.

Deck of Cards
idretrieve-update
tabLocationleft
Card
defaulttrue
idacessar-registro
labelAcessar o registro

Para acessar o registro, basta:

  1. Navegar até a pasta do formulário e acessar o formulário do mesmo jeito que é feito para inserir um registro;
  2. Encontrar o registro que deseja visualizar e clicar na descrição


Card
idvisualizar-registro
labelVisualizar o registro

O fluig irá abrir uma modal com o seu formulário em modo de visualização. Este modo serve para você pode visualizar o seu registro antes da edição, então:

  1. Confira os dados para confirmar que esse é o registro que se quer alterar; e
  2. Clique no botão "Editar Formulário" para habilitar o modo de edição.

Card
ideditar-registro
labelEditar o registro

Agora em modo de edição, você pode:

  1. Alterar os dados dos campos dos formulários; e
  2. Gravar suas alterações clicando no botão "Salvar formulário".

Ou, descartar caso queira cancelar as alterações.

O que aconteceu com o meu formulário no modo em edição? 


<working in progress>

Como o formulário é exibido dentro do fluig?

Caso tenha a curiosidade de inspecionar o formulário no fluig, verá que ele é exibido dentro de um iframe. Isso garante que as funções e estilizações que do formulário não sobrescreva as do próprio fluig. E, entre outras coisas, o fluig modifica a tag form para impedir o envio diretamente pela tag e forçar o uso dos botões de confirmação da tela.

Como utilizar css no formulário

Em todos os formulário no fluig adicionamos a chamada do fluig style guide (https://style.fluig.com/). Assim você pode, mesmo sem criar uma linha de css, deixar o seu formulário mais bonito e com a mesma cara do fluig.

...

<print da criação do registro e da visualização do registro>

Cuidado: Versionamento de formulário

O fluig faz o versionamento do formulário, o que significa que cada mudança feita no formulário normalmente é registrada e salva como uma nova versão. No nosso exemplo, agora o seu formulário tem três versões: uma sem nenhuma estilização, outra usando o fluig style guide e a última com o seu próprio css. 

...