Como Preencher Campos de Formulário no Fluig Usando JavaScript

Quando trabalhamos com o Fluig TOTVS, muitas vezes precisamos preencher automaticamente campos de formulário com informações do usuário logado, como nome, código e login. Isso facilita o processo de interação do usuário com o sistema e automatiza tarefas repetitivas.

Neste post, vamos demonstrar como preencher campos de um formulário HTML com informações do usuário utilizando o objeto WCMAPI do Fluig. O WCMAPI é uma API interna do Fluig que permite acesso a várias funcionalidades, incluindo detalhes sobre o usuário logado.

Estrutura do Formulário HTML

Primeiro, temos um exemplo de formulário simples, onde três campos estão ocultos e um campo de texto é exibido para mostrar o nome do usuário:

<form name="form" role="form">
    <input type="hidden" name="usuario_codigo" id="usuario_codigo" />
    <input type="hidden" name="usuario_login" id="usuario_login" />
    <div class="row">
        <div class="col-md-12">
            <label for="requerente" style="margin-top:10px;">Requerente</label>
            <input type="text" class="form-control" placeholder="Requerente" name="requerente" id="requerente">
        </div>
    </div>
</form>

Neste formulário:

• usuario_codigo armazena o código do usuário logado.
• usuario_login armazena o login do usuário.
• requerente é um campo de texto que exibirá o nome do usuário.

Preenchendo os Campos com JavaScript

Agora, usamos o seguinte script em JavaScript para preencher esses campos automaticamente:

console.log(WCMAPI);
var user = WCMAPI.user;      // Obtém o nome do usuário logado
var userCode = WCMAPI.userCode; // Obtém o código do usuário
var userId = WCMAPI.userId;   // Obtém o login do usuário

// Exibindo as informações no console para depuração
console.log("Usuário user >>> " + user);
console.log("Usuário userCode >>> " + userCode);
console.log("Usuário userId >>> " + userId);

// Preenchendo os campos do formulário com as informações do usuário
document.getElementById("requerente").value = user;
document.getElementById("usuario_codigo").value = userCode;
document.getElementById("usuario_login").value = userId;

Explicação do Código

1. Objeto WCMAPI: O Fluig fornece o objeto WCMAPI que contém várias propriedades e métodos úteis. Nesse caso, estamos utilizando três propriedades:

• WCMAPI.user: Retorna o nome do usuário logado.
• WCMAPI.userCode: Retorna o código único do usuário.
• WCMAPI.userId: Retorna o login do usuário.

1. Preenchendo os Campos: Utilizamos o document.getElementById() para localizar os campos do formulário pelos seus IDs (requerente, usuario_codigo e usuario_login) e atribuir os valores correspondentes a partir do WCMAPI.
2. Depuração: Os console.log() ajudam a verificar no console se os valores estão sendo obtidos corretamente.

Conclusão

Com esse simples código JavaScript, você pode automatizar o preenchimento de campos de formulário no Fluig, utilizando os dados do usuário logado. Isso facilita a interação do usuário com o sistema e garante uma experiência mais ágil e intuitiva.

Essa abordagem pode ser adaptada para diferentes cenários dentro do Fluig, bastando modificar os campos e os valores que deseja preencher automaticamente.