| **Cod.** | **Mensagem** | **Descrição** |
| 400 | BadRequest | Houve algum erro inesperado pela API, verifica se em alguma programação existe um erro de sintaxe ou algo parecido. |
| 401 | Unauthorized | Possíveis causas: - Provavelmente o usuário API que você está tentando executar não tem permissão para essa execução. - O Accesstoken que você está usando para executar a API está vencido. O AccessToken tem uma duração máxima de 1 hora, após esse período é necessário cria-lo novamente. - Ou você estar tentando executar uma API que não está configurada |
| 404 | Not Found | Api não encontrada |
| 405 | Method Not Allowed | Possíveis causas: - Provavelmente o usuário API que você está tentando executar não tem permissão para essa execução. - O Accesstoken que você está usando para executar a API está vencido. O AccessToken tem uma duração máxima de 1 hora, após esse período é necessário cria-lo novamente. - Ou você estar tentando executar uma API que não está configurada |
| 200 | Ok | Deu tudo certo. |
- ****hostname:**** substitua pela sua URL do seu agilityflow
- ****accessToken\_Credential:**** aqui você coloca as credenciais (usuário da API) para execução
- ****apiID:**** id da api
- ****apiParameterBODY:**** json com as informações que você deseja enviar para API
```JavaScript
var http = require("https");
//config
var hostname = 'demo123.agilityflow.io'; //substitua pela sua URL do seu agilityflow
var accessToken_Credential = { username: 'teste', key: 'teste' }; //aqui você coloca as credenciais (usuário da API) para execução
var apiID = 'e8b5b751-774d-4283-855c-fafb8e11236d'; //id da api
var apiParameterBODY = { nome: 'JOSE DA SILVA', email: 'josedasilva@email.com.br', cel: '1199887766' } //body json com as informações que você deseja enviar para API
//recuperar o access token
function ExecuteRecuperarAccessToken(){
var options = {
hostname: hostname,
// port: 443,
path: '/api/accesstoken',
method: 'POST',
headers: {
"Content-Type": "application/json",
"cache-control": "no-cache"
}
};
var req = http.request(options, function (res) {
var chunks = [];
res.on("data", function (chunk) {
chunks.push(chunk);
});
res.on("end", function () {
var body = Buffer.concat(chunks);
var obj = JSON.parse(body);
if(obj.success){
console.log("Recuperou o Access Token",obj.accessToken);
ExecuteAPI(obj.accessToken)
}else
LogErro("execução do access token", body.toString());
});
});
req.write(JSON.stringify(accessToken_Credential));
req.end();
}
//execute a API
function ExecuteAPI(accessToken){
var options = {
hostname: hostname,
// port: 443,
path: '/api/data/'+apiID,
method: 'POST',
headers: {
"Authorization": "Bearer " + accessToken,
"Content-Type": "application/json",
"cache-control": "no-cache"
}
};
var req_api = http.request(options, function (res_api) {
var chunks_api = [];
res_api.on("data", function (chunk) {
chunks_api.push(chunk);
});
res_api.on("end", function () {
var body = Buffer.concat(chunks_api);
var obj = JSON.parse(body);
if(obj.success){
console.log("Execução realizada com sucesso:" + body.toString());
}else
LogErro("execução da api", body.toString());
});
});
req_api.write(JSON.stringify(apiParameterBODY));
req_api.end();
}
function LogErro(local,log){
console.log('==================================================================================')
console.log('E R R O - ' + local)
console.log('----------------------')
console.log(log);
console.log('==================================================================================')
}
ExecuteRecuperarAccessToken();
```
### Exemplo em PHP de POST
Suponhamos que temos uma API no agilityflow que cadastra um cliente, as informações que a API espera é "NOME", "EMAIL" e "CEL" (celular).
O código abaixo demonstra como é feita a chamada da API através do PHP.
```PHP
nome = $nome ;
$novoLead->email = $email ;
$novoLead->cel = $_POST['cel'];
$novoLead_string = json_encode($novoLead);
//////////////////////////////////// 01. BUSCAR O ACCESS TOKEN
$curl = curl_init();
curl_setopt_array($curl, array(
CURLOPT_URL => "https://XXXXXXXXXXXXXXX.agilityflow.io/api/accesstoken",
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => "",
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 30,
//------------- SLL
CURLOPT_SSL_VERIFYPEER => 0,
CURLOPT_SSL_VERIFYHOST => 0,
//--------------------------
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => "POST",
CURLOPT_POSTFIELDS => "{\"username\": \"cadastrar_teste_1\",\"key\": \"cadastrar_teste_1\"}",
CURLOPT_HTTPHEADER => array(
"Content-Type: application/json",
"cache-control: no-cache"
),
));
$response = curl_exec($curl);
$err = curl_error($curl);
curl_close($curl);
if ($err) {
echo '{"success": "false", "msg": "Não conseguimos finalizar seu cadastro. Por favor tente novamente. (0)" }';
exit(0);
}
$json_RESPONSE_ACCESS_TOKEN = json_decode($response);
if (!isset($json_RESPONSE_ACCESS_TOKEN->accessToken)){
echo '{"success": "false", "msg": "Não conseguimos finalizar seu cadastro. Por favor tente novamente. (1)" }';
exit(0);
}
//////////////////////////////////// 02. EXECUTA O POST
$curl = curl_init();
curl_setopt_array($curl, array(
CURLOPT_URL => "https://XXXXXXXXXXXXXXX.agilityflow.io/api/data/b3bf7ce3-f226-4500-83cd-2873b050c742",
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => "",
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 30,
//------------- SLL
CURLOPT_SSL_VERIFYPEER => 0,
CURLOPT_SSL_VERIFYHOST => 0,
//--------------------------
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => "POST",
CURLOPT_POSTFIELDS => $novoLead_string,
CURLOPT_HTTPHEADER => array(
"Authorization: bearer ".$json_RESPONSE_ACCESS_TOKEN->accessToken,
"Cache-Control: no-cache",
"Content-Type: application/json"
),
));
$response = curl_exec($curl);
$err = curl_error($curl);
curl_close($curl);
if ($err) {
echo '{"success": "false", "msg": "Não conseguimos finalizar seu cadastro. Por favor tente novamente. (2)" }';
exit(0);
}
$json_RESPONSE_SUCCESS = json_decode($response);
if (!isset($json_RESPONSE_SUCCESS->success)){
echo '{"success": "false", "msg": "Não conseguimos finalizar seu cadastro. Por favor tente novamente. (3)" }';
exit(0);
}
if ($json_RESPONSE_SUCCESS->success == false){
echo '{"success": "false", "msg": "Não conseguimos finalizar seu cadastro. Por favor tente novamente. (4)" }';
exit(0);
}
echo '{"success": "true", "msg": "Obrigado, recebemos seus dados aqui e já já nos falamos..." }';
```
### Exemplo POST via o software "POSTMAN"
Importe o JSON abaixo no seu Postman para executar os exemplos abaixo.
```JSON
{
"info": {
"_postman_id": "39445fe2-1bea-46b2-9045-b32337b10030",
"name": "Agilityflow API",
"schema": "https://schema.getpostman.com/json/collection/v2.1.0/collection.json"
},
"item": [
{
"name": "1. Obter Accesstoken",
"request": {
"method": "POST",
"header": [
{
"key": "Content-Type",
"value": "application/json"
}
],
"body": {
"mode": "raw",
"raw": "{\"username\": \"NOME_DO_USUARIO_API__COM_PERMISSAO_NESSA_API\",\"key\": \"CHAVE_DE_SEGURANÇA_DO_USUARIO_API__COM_PERMISSAO_NESSA_API\"}"
},
"url": {
"raw": "https://XXXXXXXXXXXXXXXXX.agilityflow.io/api/accesstoken?",
"protocol": "https",
"host": [
"XXXXXXXXXXXXXXXXX",
"agilityflow",
"io"
],
"path": [
"api",
"accesstoken"
],
"query": [
{
"key": "",
"value": "",
"disabled": true
},
{
"key": "",
"value": "",
"disabled": true
}
]
}
},
"response": []
},
{
"name": "2. Post API",
"request": {
"method": "POST",
"header": [
{
"key": "Authorization",
"value": "Bearer eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy5taWNyb3NvZnQuY29tL3dzLzIwMDgvMDYvaWRlbnRpdHkvY2xhaW1zL3VzZXJkYXRhIjoiOTdmZTM1NmItMDA5OC00ZTlhLTkwNTUtODMwMTA3YzM5NjA1IiwibmFtZWlkIjoibG9jYWxob3N0IiwibmJmIjoxNTY0NDI4NTk5LCJleHAiOjE1NjQ0Mjg2NTksImlhdCI6MTU2NDQyODU5OX0.ul7Emi7KDepfmRwWO91RQcTZQrc8r3xlMKJnLYcduEKeNRDGC7F15_-YojHfm1ogM32LjUV76MWxNXTLeJTrLw"
},
{
"key": "Content-Type",
"name": "Content-Type",
"value": "application/json",
"type": "text"
}
],
"body": {
"mode": "raw",
"raw": "{\n\n\t\t\t\"id\": \"345b65d7-4c99-426c-95fc-1dd8de76cc9d\",\n\t\t\t\"nome\": \"_123458910Cargo LEGALLLLL \"\n\t\n}"
},
"url": {
"raw": "https://XXXXXXXXXXXXXXXXX.agilityflow.io/api/data/b3bf7ce3-f226-4500-83cd-2873b050c742",
"protocol": "https",
"host": [
"XXXXXXXXXXXXXXXXX",
"agilityflow",
"io"
],
"path": [
"api",
"data",
"b3bf7ce3-f226-4500-83cd-2873b050c742"
]
}
},
"response": []
}
]
}
```
Após a importação no Postman você precisará seguir alguns passos:
**Passo 1**
No Postman, abra o exemplo **"1. Obter Accesstoken"**
**Passo 2**
Você precisará fazer algumas mudanças.
**(1)** Troque o **XXXXXX**.agilityflow.io pelo seu subdomínio no agilityflow;
**(2)** Na aba "body", Troque o usuário e chave de segurança da API que você criou. como na imagem abaixo:
**Passo 3 - Obter Access token para execução da API**
Por segurança, antes de cada execução de API é necessário que você gere um token para validação do usuário.
Então, agora execute essa API.
Copie o código retornado no JSON na propriedade "accessToken", usaremos esse código a seguir.
**Passo 4**
No Postman, abra o exemplo **"2. Post API"**
**Passo 5**
Você precisará fazer algumas mudanças.
**(1)** Troque o **XXXXXX**.agilityflow.io pelo seu subdomínio no agilityflow;
**(2)** Na aba "headers", clique no VALUE da Key "Authorization" e cole o código "accessToken" que geramos nos passos acima, após a palavra "Bearer ". Então o valor deverá ficar "**Bearer Accesstoken\_que\_você\_colou**".
**(3)** Troque o Id da API "/data/**b3bf7ce3-f226-4500-83cd-2873b050c742"** de exemplo pelo id da API que você acabou de criar no Agilityflow.
**(4)** Na aba "body" você pode trocar os valores que você deseja inserir ou atualizar:
Então, agora execute essa API e entre no seu log de API do agilityflow para acompanhar e verificar se deu certo
# Variáveis de ambiente
Nessa tela de variáveis de ambiente você definirá informações (variáveis globais) que ficarão disponíveis em diversas partes do seu sistema.
Suponha que você queira que a Data de Nascimento do usuário logado esteja disponível para acesso via Javascript nos seus formulários ou você quer usar essa informação em algum parâmetro de entrada de uma Query, em relatórios ou dashboards.
Para isso basta criar uma variável do tipo "SQL Simples (Valor único)"; defina o nome para a variável, nesse caso, utilize "**var\_dataNascimento";** marque como **SIM** a opção "Essa é uma Informação relacionada ao usuário logado e o valor pode variar de acordo com cada usuário".
No **botão "Query Sql**", defina a query Sql para buscar a **Data de Nascimento** do usuário logado. Exemplo da query:
```SQL
select top 1 usu_dt_nasc as Value from tbl_usuario where id = @var_usuarioLogadoId and deletado = false
```
Salve e pronto. A partir de agora essa variável estará disponível em todo o seu ambiente. Para recuperar os valores da variável veja os itens mais abaixo.
**Importante:** os valores das variáveis de ambiente, ficam em **cache,** esse cache é renovado a cada 1 hora. Assim melhora a performance e evita excessos de consultas ao banco de dados. O cache é automaticamente renovado quando o usuário faz login e quando no formulário de criação da Variável de Ambiente você clica em "salvar".
**Atenção**: Nunca coloque dados sensíveis ou sigilosos em uma variável de ambiente.
#### Para recuperar os valores da variável de ambiente Seguindo o exemplo acima, suponhamos que você queira agora recuperar o valor via Javascript.Caso queira utilizar a variável em alguma situação específica ou em alguma parte do sistema que ela ainda não esteja disponível, fale com nossa equipe que estaremos prontos para te ajudar.
A forma correta seria via: ### Em Javascript Suponhamos que a variável criada tem o nome "var\_dataNascimento". Utilize a função abaixo, ela retornará o valor da variável. Recuperar o Valor: ```JavaScript var var_dataNascimento = GetEnvironmentVariable("var_dataNascimento") ``` Recuperar a Descrição (texto), no caso de variáveis do Tipo "Query com Id + Descrição": ```JavaScript var var_dataNascimento = GetEnvironmentVariable_Text("var_dataNascimento") ``` ### Em uma Query SQL Suponhamos que a variável criada tem o nome "var\_dataNascimento". Utilize o nome da variável como parâmetro de sua Query, como no exemplo abaixo. ```SQL select usu_nome from tbl_usuario where usu_dt_nasc = @var_dataNascimento and deletado = false ``` ### Em C# (na área de Regras de Negócio do Formulario) Suponhamos que a variável criada tem o nome "var\_dataNascimento". Utilize a função abaixo, ela retornará o valor da variável. Recuperar o Valor: ```JavaScript FormContext.GetEnvironmentVariable("var_dataNascimento") ``` Recuperar a Descrição (texto), no caso de variáveis do Tipo "Query com Id + Descrição": ```JavaScript FormContext.GetEnvironmentVariable_Text("var_dataNascimento") ``` ### Em C# (nos componentes em cshtml) Suponhamos que a variável criada tem o nome "var\_dataNascimento". Utilize a função abaixo, ela retornará o valor da variável. Recuperar o Valor: ```JavaScript PageContext.GetEnvironmentVariable("var_dataNascimento") ``` Recuperar a Descrição (texto), no caso de variáveis do Tipo "Query com Id + Descrição": ```JavaScript PageContext.GetEnvironmentVariable_Text("var_dataNascimento") ``` ### Em C# (nas API) Suponhamos que a variável criada tem o nome "var\_dataNascimento". Utilize a função abaixo, ela retornará o valor da variável. Recuperar o Valor: ```JavaScript ApiContext.GetEnvironmentVariable("var_dataNascimento") ``` Recuperar a Descrição (texto), no caso de variáveis do Tipo "Query com Id + Descrição": ```JavaScript ApiContext.GetEnvironmentVariable_Text("var_dataNascimento") ``` # Change Request Permite enviar algumas funcionalidades de um ambiente para outro. Essa função é utilizada quando se tem mais de um ambiente, e usa-se o conceito de ambiente de desenvolvimento e outro como ambiente de produção. É possível selecionar os formulários e tabelas associativas ([Tabela Relacional N:N](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/tabela-relacional-%28nn%29 "Tabela Relacional (N:N)")) que devem ser enviados a outros ambientes. Além disso, é possível incluir scripts customizados para serem executados antes e depois da transferência dos objetos.Ao transferir os formulários, apenas a estrutura é transferida e não o conteúdo.
# Visual Code Editor O agilityflow permite editar os formulários muito mais do que as configurações pré-definidas do formulário estabelecidas pelo sistema. Para fazer isso, é necessário utilizar o Visual Code Editor. Nele, é possível modificar o formulário de 4 maneiras: ### Style (CSS) É possível utilizar todos os recursos do CSS para fazer as modificações do formulário. ### Javascript O javascript também está disponível para ser modificado. Além disso, já existem algumas facilidades criadas pelo agilityflow, que ficam disponíveis para uso. ### C# (Server Side) Inclua aqui, C# que atuarão no formulário. ### Componentes CsHtml Qualquer conteúdo Html pode ser criado atráves desses componentes. Entretanto, esses componentes precisam ser posicionados na [tela de cadastro](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/montar-e-organizar-a-tela-de-cadastro "Montar e organizar a tela de cadastro") do formulário. # Formulário - customizar com HTML, C#, CSS e Javascript O agilityflow também pode ser customizado através da Linguagem Html, CSS, Javascript e C# (csharp). O html do agilityflow é baseado no Razor do framework .Net, isso é, você pode além de customizar com HTML, utilizar código C# (razor) para dar mais flexibilidade e poder ao seu componente Html. #### O que e onde customizar? Acesse a parte de Desenvolvimento do Formulário que você deseja customizar, para isso, entre na área de customização de um formulário e clique na opção Visual Code Editor, como na imagem abaixo:  No Visual Code editor, no menu esquerdo, serão apresentados as seguintes opções: - **Style (CSS):** opção para customizar o CSS de todo o formulário. - **Javascript:** opção para customizar o Javascript de todo o formulário. - **Componente CsHtml:** opção para criar novos componentes em HTML  ### Style (CSS) Nessa área, você pode criar customizações via linguagem CSS para todo o formulário, o seu uso é livre.Levar em consideração o tratamento em CSS para a responsividade da plataforma em outros device, Mobile, Computador Desktop, Tablet, etc.
### Javascript: Nessa área, você pode criar customizações via linguagem Javascript para todo o formulário, o seu uso é livre. Você pode utilizar jquery e outras bibliotecas já declaradas no código-fonte por padrão (veja lista mais abaixo). Exemplo de utilização: No código javascript abaixo, a regra impede que um formulário de projetos que esteja com o status "inativo", seja salvo: ```JavaScript var projeto = { init: function () { projeto._setEvents(); //registrar os eventos que são inerentes a esse bloco de código }, _setEvents: function () { //ao fazer o submit do formulário executa a função de validação de status $('#formulario').on('submit', function (e) { projeto.validarStatus(); }) }, validarStatus: function () { //recupera através de jquery o valor do campo "Status do Projeto" var status_projeto = $("#status_projeto").val(); //verifica se o tipo de envio que o formulário está requisitando no submit //é do tipo "SALVAR" e se o status é "inativo" //caso seja, inválida o submit e apresenta uma aviso para o usuário if (Form.getFormActionOnSubmit() == ACTION_SALVAR && status_projeto == "inativo") { //inválida o submit e apresenta uma aviso para o usuário Form.invalidateForm({ msg: 'Um projeto inativo não pode ser salvo.' }); } } } projeto.init(); //iniciando e configurando ``` Abaixo estão listadas algumas funções nativas do agility**Flow** para javascript: #### **Como utilizar funções Javascript dentro de um CSHTML**Caso você utilize Javascript dentro de um componente HTML (CSHTML), é necessário que o código esteja dentro da função **DOM.ready (como no exemplo abaixo)** para garantir que o seu código só execute após todo o carregamento de todos as funções Javascript
Recomendamos que dentro do arquivo CSHTML só tenha a "chamadas" para as funções que estejam programadas dentro do arquivo específico para o código Javascript.
```JavaScript ``` #### **Funções Javascript Nativas** ##### Recuperar data do servidor: ```JavaScript GetDateNow() ```A data e hora são obtidas dos servidores do Agilityflow, para assim garantir a confiabilidade da data e hora
**Atenção:** Lembre-se que no Javascript o retorno do método ".getMonth()" de um objeto **Date**, não refere-se ao mês e sim a Índice daquele mês no array de meses, sendo assim, o retorno desse método sempre será entre os valores **0 até 11** e não de 1 a 12
Exemplo de como configurar o valor inicial de um campo com a data atual. Para esse exemplo, encare que o ID do campo que estamos preenchendo com a data atual é "data". ```JavaScript var exemplo1 = { init: function () { exemplo1.setToday(); }, //coloca a data atual no campo de data setToday: function () { if ($('#data').val() != "") return; //data do servidor para garantir que seja uma data válida var date = GetDateNow(); var day = date.getDate().toString().padLeft(2, '0'); var year = date.getFullYear(); var monthIndex = date.getMonth() monthIndex++; if (monthIndex > 12) monthIndex = 1; $('#data').val(day.toString().padLeft(2, '0') + '/' + monthIndex.toString().padLeft(2, '0') + '/' + year); } } exemplo1.init(); ``` ##### Comparar uma data com a data atual (Hoje):Essa comparação desconsidera a HORA
A função é: **formContext.datetime.validation.compareToday(comparador, data)** Os possíveis comparadores são:| **Tipo** | Opção 1 (qualquer uma das opções) | Opção 2 (qualquer uma das opções) |
**maior que** | > | greater |
**maior ou igual** | >= | greater-or-equal |
**menor** | < | less |
**menor ou igual** | <= | less-or-equal |
**igual** | == | equal |
Essa comparação desconsidera a HORA
A função é: **formContext.datetime.validation.compare(data1, comparador, data2)** Os possíveis comparadores são:| **Tipo** | Opção 1 (qualquer uma das opções) | Opção 2 (qualquer uma das opções) |
**maior que** | > | greater |
**maior ou igual** | >= | greater-or-equal |
**menor** | < | less |
**menor ou igual** | <= | less-or-equal |
**igual** | == | equal |
| **Parâmetro opcional** | **Valor padrão** | **Opções de valores** | **Descrição** |
| setOnlyIfFieldValueIsEmpty | false | true ou false | Caso seja "**true**" a função só preencherá o valor do campo se o campo ainda **NÃO** estiver preenchido. Caso seja "**false**" a função preenche ou substitui o valor do campode qualquer maneira. |
| **Parâmetro opcional** | **Valor padrão** | **Opções de valores** | **Descrição** |
| setOnlyIfFieldValueIsEmpty | false | true ou false | Caso seja "**true**" a função só preencherá o valor do campo se o campo ainda **NÃO** estiver preenchido. Caso seja "**false**" a função preenche ou substitui o valor do campode qualquer maneira. |
| **Objeto** | **Nome / evento** | **Exemplo de uso** |
| Tabela de Dados do Formulário Filho. Que fica no Formulário Pai. | before-data-load / **Dispara antes de carregar os dados na tabela** | //id = id da tabela filha $('#id').on('before-data-load', function (e) { console.log('evento disparado antes de carregar os dados') }); |
| Tabela de Dados do Formulário Filho. Que fica no Formulário Pai. | data-loaded / **Dispara depois de carregar os dados na tabela** | //id = id da tabela filha $('#id').on('data-loaded', function (e, result\_json) { console.log('evento disparado depois de carregar os dados') console.log('result\_json',result\_json) }); |
| bootstrap-daterangepicker/daterangepicker.js |
| bootstrap-daterangepicker/moment.min.js |
| bootstrap-select/bootstrap-select.js |
| bootstrap/bootstrap.js |
| guid.js |
| jquery.inputmask/4.0.0-beta.19/jquery.inputmask.bundle.js |
| jquery.mask.js |
| jquery.maskMoney.js |
| jquery.validate.js |
| jquery.webui-popover.js |
| jquery/jquery.js |
@parteDoDia,
```
##### Passo 2 - Definir o CSS
Entre na área de CSS e cole o código abaixo:
```CSS
.painel-msg-customizada{
display: block;
text-align: left;
padding-top: 10px;
}
.painel-msg-customizada span{
color: #0281ff;
display: block;
font-size: 17px;
font-weight: 500;
border-bottom: solid 2px #a4d2ff;
margin-bottom: 15px;
}
```
##### Passo 3 - Posicionar o html no formulário
Salve tudo no Visual Code Editor e posicione esse componente html, como descrito [aqui](http://wiki.agilityflow.io/link/78#bkmrk-depois-de-criado-o-c).
##### Passo 4 - Salvar e publicar o formulário
Salve e publico o novo formulário.
Agora acesse esse formulário, o resultado deve ser igual ao print abaixo:
#### C# no componente CSHTML
Se você precisar de alguma informação do formulário, utilize a opção abaixo
##### C# - Propriedades
| string FormId | Id do registro, pode ser em branco ou nulo qdo for um rascunho |
| bool IsRascunho {get;} | Retorna true caso a linha seja um Rascunho |
| string DraftId | Id do rascunho |
| string GetValue(string idColuna) | retorna o valor do campo |
| int? GetInt(string idColuna) | Retorna o valor do campo no tipo INT (inteiro), caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000 |
| decimal? GetDecimal(string idColuna) | Retorna o valor do campo no tipo Decimal, caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000.99 |
| DateTime? GetDateTime(string idColuna) | Retorna o valor do campo no tipo DateTime |
Guid? GetGuid(string idColuna) | Retorna o valor do campo no tipo Guid |
string GetText(string idColuna) | No caso de campos que são Lista Dinanica, exemplo Combo, Auto completo, radio etc. No Json de Campos Preenchidos no Formulario, só terá o Value dos campos Esse método retornará o Texto desse campo. Exemplo: Existe no formulário um campo chamado 'Produto', com o id definido como 'produto'. Esse campo é do tipo 'AutoComplete' e listará os 'Produtos' por 'Nome'. Quando o usuário salvar o formulário, no Json de envio não retornará o Nome do Produto, apenas o Id do produto selecionado (Esse id estará no formato de um GUID). Para recuperar o Nome do produto, vc precisará executar esse método da seguinte forma:
var nomeProduto = PageContext.GetText("produto") |
| **Variável** | **Tipo** | |
| (**deprecated)** Model.FormularioCamposPreenchidos | (**deprecated)** dynamic (Json) | (**deprecated**: utilizar o método PageContext.GetValue descrito mais acima)
Retorna um json com os campos preenchidos no formulário, exemplo:
{
"campo1": "xxxxx",
"campo2": "yyyyy",
"campo3": "zzzzz",
}
Para resgatar a informação do campo1, utilize:
```C#
@{
var campo1 = Model.FormularioCamposPreenchidos["campo1"];
}
@campo1
```
Para resgatar o id do formulário, utilize:
```C#
@{
var idFormulario_Forma1 = Model.Id;
var idFormulario_Forma2 = Model.FormularioCamposPreenchidos["id"];
}
@idFormulario_Forma1
@idFormulario_Forma2
```
|
| (**deprecated)** Model.Id OU Model.FormularioCamposPreenchidos\["id"\]; | (**deprecated)** Guid OU string | (**deprecated)**
Para resgatar o id do formulário, utilize:
```C#
@{
var idFormulario_Forma1 = Model.Id;
var idFormulario_Forma2 = Model.FormularioCamposPreenchidos["id"];
}
@idFormulario_Forma1
@idFormulario_Forma2
```
|
| Model.FormularioTemporarioId | Guid | Para resgatar o id temporario do formulário, utilize:
```C#
@{
var formularioTemporarioId = Model.FormularioTemporarioId;
}
@formularioTemporarioId
```
|
| (**deprecated)** Model.RascunhoId | (**deprecated)** Guid | (**deprecated)** Para resgatar o id do rascunho, caso seja um |
| Model.EstruturaFormularioId | Guid | Para resgatar o id da ESTRUTURA do formulário |
| **Quando estiver dentro do Formulário Filho:** Model.FormularioIdPai | Guid | Para resgatar o id do formulário pai, quando estiver dentro de um formulário filho, utilize:
```C#
@{
var formularioIdPai= Model.FormularioIdPai;
}
@formularioIdPai
```
|
| **Quando estiver dentro do Formulário Filho:** Model.FormularioTemporarioIdPai | Guid | Para resgatar o id temporário do formulário pai, quando estiver dentro de um formulário filho, utilize:
```C#
@{
var formularioTemporarioIdPai= Model.FormularioTemporarioIdPai;
}
@formularioTemporarioIdPai
```
|
| **Quando estiver dentro do Formulário Filho:** Model.EstruturaFormularioIdPai | Guid | Para resgatar o id temporário do formulário pai, quando estiver dentro de um formulário filho, utilize:
```C#
@{
var estruturaFormularioIdPai= Model.EstruturaFormularioIdPai;
}
@estruturaFormularioIdPai
```
|
WFS.Common.AppSettings.StaticFilePath | string | Retorna a url dos arquivos estaticos do agilityflow, exemplo, .js, .css, etc..
caso queira importar um arquivo JS que já exista na biblioteca de arquivos estaticos do agilityflow
<script src="**@WFS.Common.AppSettings.StaticFilePath**/js/xxxxx/yyyyyy.js?**@WFS.Common.AppSettings.StaticFileVersion**"></script> |
WFS.Common.AppSettings.StaticFileVersion | string | Utilize essa variável para limpar o cache do seu arquivo estático, sendo assim coloque ela como parametro de querystring do seu arquivo, exemplo:
caso queira importar um arquivo JS que já exista na biblioteca de arquivos estaticos do agilityflow
<script src="@WFS.Common.AppSettings.StaticFilePath/js/xxxxx/yyyyyy.js?**@WFS.Common.AppSettings.StaticFileVersion**"></script> |
@msg
```
#### C# no componente CSHTML - Testar se é um rascunho
```C#
@{
var msg = "";
var rascunhoId = Model.RascunhoId;
if(rascunhoId.IsNullOrEmpty()){
msg = "é um Rascunho";
}else{
msg = "NÃO é um Rascunho";
}
}
@msg
```
### Criar uma Tabela de dados customizada através de programação: Query SQL, C#, HTML e CSS:
Abaixo está um exemplo de criação de uma tabela de dados buscando as informações através de uma Query SQL e apresentando no Html:
Para customizar o CSS e Javascript da tabela de dados, utilize áreas de customização já citadas nos itens acima
```C#
Tasks
Add task| Status | Team | Description | CreatedDate | ModifiedDate |
|---|---|---|---|---|
| @currentStep | @dr["Team"].ToString() | @dr["TaskDescription"].ToString() | @dr["CreatedDate"].ToString() | @dr["ModifiedDate"].ToString() |
Apenas campos do tipo "Lista de seleção (Combo)" e "Pesquisa com auto completar" poderão disparar o recarregamento do Componente Cshtml
##### Exemplo para recarregar o componente cshtml Suponhamos que você crie um formulário que contenha 2 campos, o **primeiro** é um combo de **Perfil de Acesso** no sistema e o **segundo** campo é um componente CsHtml que contenha uma **tabela que mostre todos os usuários** que possuam o perfil selecionado no **primeiro** campo de **Perfil de Acesso**. Então, todas vez que o campo **Perfil de acesso** for alterado, a tabela de usuários deve ser recarregada para mostrar só os usuários relacionados ao novo perfil alterado. Para esse exemplo, crie um novo formulário. Nesse novo formulário, crie um combo chamado **Perfil** e abaixo crie um componente CShtml que apresente uma tabela com todos os usuários do perfil selecionado (copiar e colar código abaixo no novo componente). Código para o Componente Cshtml que listará os usuários ```C#Usuários com esse perfil:
| Nome | |
|---|---|
| @dr["Nome"].ToString() | @dr["Email"].ToString() |
Caso a informação a ser adicionada ou atualizada seja um número, enviar sem separador de milhar e o separador de decimal deve ser "." (ponto), exemplo: para o valor de nove mil e quinhentos, deve ser enviado 9500.00. Para facilitar utilize a função **PageContext.FormatNumberToString\_EnglishFormat(999999.99, 2);**
```C# @{ //id da tabela var tableid_relacaoFormularioPaiFilhoId = Guid.Parse("0dd874a9-9c39-4e4f-acc3-02015a60f6bb"); //table id DO FORMULÁRIO FILHO //info do formulario filho var campos_e_valores = new DataDictionary(); campos_e_valores["nome_filho"] = "Exemplo 01 - " + DateTime.Now; campos_e_valores["valor_numerico"] = PageContext.FormatNumberToString_EnglishFormat(999999.99, 2); //testa se é um form NOVO e se NÂO é RASCUNHO pois nesse exemplo quero inserir apenas para formulário NOVOS que não sejam RASCUNHOs var isNovo = Model.Id.IsNullOrEmpty(); var isRascunho = !Model.RascunhoId.IsNullOrEmpty(); if(isNovo && !isRascunho){ //adiciona na tabela filha //retorna o id do rascunho desse formlario filho, pois o ID final só será gerado ao Salvar o Formulario PAi var formRascunhoId = PageContext.AddChildForm( tableid_relacaoFormularioPaiFilhoId, campos_e_valores); //atualiza o item que acabamos de adicionar, apenas para demonstração Guid? idFormularioFilho = null; campos_e_valores["nome_filho"] = "Exemplo Atualizado 0123456789 - " + DateTime.Now; PageContext.UpdateChildForm( //se ainda não foi salvo pela primeira vez, o item só terá o Id do Rascunho rascunhoId, //se já foi salvo pela primeira vez, o item já terá o Id //então passa aqui o id (nesse exemplo estamos passando null para atualizar apenas o idFormularioFilho, tableid_relacaoFormularioPaiFilhoId, campos_e_valores); } } ``` #### C# - Obter o total de itens em uma tabela de formulário filho: ```C# @{ //relacaoFormularioPaiFilhoId não é o id do formulario filho e sim o id do campo que gera ao adicionar o formulario filho ao formulario pai var relacaoFormularioPaiFilhoId = Guid.Parse("f43330be-0467-7fee-1168-28c9e6d185f0"); //trocar esse id var total = await PageContext.CountChildFormsAsync(relacaoFormularioPaiFilhoId); } ``` #### C# - Enviar e Recuperar parâmetros extras na requisição ajax no partial view (cshtml) Enviando um parâmetro extra via javascript ```JavaScript var idsItensPrecosCompostos = formContext.childForm.datatable.getAllChildIds('251c66c9-cb26-f3a8-d014-8a1dd4a6b6aa') formContext.loadViewComponent("calcular_valor_custo_preco_composto", { extraData: { idsItensPrecosCompostos: JSON.stringify(idsItensPrecosCompostos) } , onSuccess: function (response) { console.log(response) } }) ``` Recuperando um parâmetro extra via C# no CShtml. Nesse exemplo, dentro do partial view "**calcular\_valor\_custo\_preco\_composto**", colocaremos esse código ```C# @{ var json_idsItensPrecosCompostos = Request["idsItensPrecosCompostos"]; }@json_idsItensPrecosCompostos
```
#### C# e Javascript - Trabalhando com Json
1\. Enviando um parâmetro no formato JSON via Javascript. Para isso no código abaixo transformamos um Array em JSON usando o JSON.stringify(...)
```JavaScript
var idsItensPrecosCompostos = formContext.childForm.datatable.getAllChildIds('251c66c9-cb26-f3a8-d014-8a1dd4a6b6aa')
formContext.loadViewComponent("calcular_valor_custo_preco_composto", {
extraData: { idsItensPrecosCompostos: JSON.stringify(idsItensPrecosCompostos) } ,
onSuccess: function (response) {
console.log(response)
}
})
```
2\. Recuperando um parâmetro JSON via C# e convertendo em Objeto Json
Você poderá utilizar qualquer função que faça parte das Bibliotecas
| Newtonsoft.Json |
| Newtonsoft.Json.Linq |
É possível também re-ordenar os cards dentro de uma mesma coluna, mudando assim a ordem em que os cards são exibidos.
#### Rascunhos Os rascunhos podem ser exibidos em dois locais: ##### Na coluna a qual o registro pertence Caso o registro já possua o campo da coluna preenchido, ele será exibido na coluna respectiva, com uma marcação de rascunho, como mostra a figura abaixo:  ##### Na coluna Rascunhos Não Salvos Caso não seja possível definir a coluna, o registro será mostrado em uma coluna chamada "Rascunhos Não Salvos".  #### Coluna "Não Definido" Os registros que já foram salvos, mas o campo usado para definir as colunas do quadro não tenha sido preenchido, serão colocados em uma coluna chamada "Não Definido".  #### Adicionar Lista Essa opção cria novas colunas na visualização. Na prática, é adicionado um registro na tabela dinâmica que o campo usado como base para colunas utiliza. #### Configurar Ações É possível criar ações pré-definidas, como explicadas [aqui](http://wiki.agilityflow.io/link/69#bkmrk-%E2%A0-0 "Ações Customizadas (Menu Interno)"). #### Filtro Os filtros funcionam da mesma [forma](http://wiki.agilityflow.io/link/55#bkmrk-consultar-os-registr "Consultar os Registros") que na visualização padrão. ### Criando um quadro A criação do quadro pode ser através do [devcenter](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/chapter/devcenter---customizar-o-agilityflow "Devcenter - Customizar o Agilityflow"), na opção Quadros (kanban), ou dentro do próprio formulário (caso o usuário tenha permissão) clicando no canto superior esquerdo onde é mostrada o tipo de listagem, e em seguida em "Criar Quadro":  Em seguida, é necessário informar qual o formulário será usado como origem dos dados.  Ao selecionar o formulário, outras opções serão apresentadas para configurar o novo quadro:  #### Campos de apresentação do card Devido ao espaço limitado desse método, não é possível exibir todos os campos como na forma de listagem padrão. A exibição é limitada a dois campos, que serão apresentados como título e descrição. Abaixo, um exemplo de um cartão com os dois campos  ##### Título do card É o campo que será usado como título do card. Esse campo é mostrado em negrito, no topo. ##### Descrição do card É o campo que virá abaixo do título. ### Divisão das colunas/listas do quadro O método Kanban utiliza colunas para separar e exibir os registros. Nessa opção, é possível definir o critério em que as colunas serão baseadas. ##### As colunas serão baseadas nas etapas do fluxo do formulário? Quando o formulário informado na origem dos dados for um fluxo com etapas, essa opção estará disponível e as colunas serão as etapas do fluxo. Caso queira outro campo, é possível selecionar a opção "Não". Outros campos aparecerão para definir as colunas. ##### As colunas serão baseadas em um campo existente no formulário? Deixar como sim padrão. ##### As colunas serão baseadas em qual campo Selecione o campo do formulário utilizado para a definição das colunas. Nessa opção, apenas os campos com origem em uma lista dinâmica são permitidos, tais como [Lista de Seleção](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/lista-de-sele%C3%A7%C3%A3o-%28combo%29 "Lista de seleção (Combo)"), [Lista com Autocompletar](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/pesquisa-com-auto-completar "Pesquisa com auto completar") e [Radio](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/lista-aberta-com-escolha-%C3%BAnica-%28radio%29 "Lista aberta com escolha única (Radio)"). #### Outras configurações ##### Nome do quadro Defina um nome para o quadro.Como é possível ter vários quadros pro mesmo formulário, é importante a definição de um nome que explique o propósito do quadro
##### Ao clicar no card deverá abrir inicialmente a aba São duas opções: formulário e [acompanhamento](http://wiki.agilityflow.io/books/manual-do-usu%C3%A1rio/page/acompanhamento "Acompanhamento"). ##### Permitir o usuário criar outras listas/colunas (mostrar botão: "adicionar lista") O botão adicionar lista fica na extrema direita, no final do quadro, e permite que o usuário crie novas colunas no Kanban. Ao clicar em adicionar lista, na prática, abre o formulário para a criação de um novo registro no formulário usado como fonte pelo campo informado na definição das colunas do quadro.Seja cuidadoso na criação de um quadro kanban. Após a configuração inicial, não é possível alterá-lo. Caso seja necessário, será preciso criar um novo quadro.
# Listagem do Formulário - customizar com HTML, C#, CSS e Javascript O agilityflow permite customização através da Linguagem Html, CSS, Javascript e C# (csharp). O html do agilityflow é baseado no Razor do framework .Net, isso é, você pode além de customizar com HTML, utilizar código C# (razor) para dar mais flexibilidade e poder ao seu componente Html. ### Customizar a Listagem Acesse a parte de Desenvolvimento do Formulário que você deseja customizar, para isso, entre na área de customização de um formulário e clique na opção Visual Code Editor, como na imagem abaixo:  Nessa área você poderá customizar a parte de Cadastro e de Listagem utilizando, Javascript, CSS e CSHTML (Razor C# + Html):  Para essa documentação vamos nos preocupar com a área de "List Page". Nessa área podemos customizar toda página de Listagem Principal de dados, como no exemplo abaixo.  Voltando a área de desenvolvimento, no menu de customização da List Page, teremos sempre 2 arquivos padrões: **CSS** e **Javascript**. O **CSS** é sempre colocado no topo da página, dentro da tag <HEAD> do Html O **Javascript** é sempre colocado no final da página, antes do fechamento do </Body> ### Customizar com CSS Todo código CSS da página de Listagem Principal do Formulário, deve ficar no arquivo CSS da List Page.  Nessa área, você pode criar customizações via linguagem CSS para toda a listagem e o seu uso é livre.Levar em consideração o tratamento em CSS para a responsividade da plataforma em outros device, Mobile, Computador Desktop, Tablet, etc.
##### **CSS no Formulário Filho** O CSS feito para a página de Listagem Principal está colocado apenas no **List Page** do próprio formulário filho, dessa forma ele não será adicionado ao Formulário Pai, então para usar CSS nas tabelas que estão dentro de um formulário Pai, você deve entrar dentro da área de desenvolvimento do Formulário Pai abrir o arquivo **CSS** e ao invés de colocar no CSS da aba **List Page**, coloque **o código** na aba **Form Page** do formulário pai. ### Customizar com Javascript Todo código Javascript da página de Listagem Principal do Formulário, deve ficar no arquivo Javascript da List Page.  O agilityflow possui uma extensa biblioteca de funções prontas para customização em Javascript que você pode utilizar para diminuir o seu tempo de desenvolvimento. Além disso nessa parte você está livre para criar funções e regras da forma que for mais conveniente. O agilityflow disponibiliza uma biblioteca principal em Javascript para a tela de Listagem Princpal. Essa biblioteca está disponível no objeto "**listContext**" e abaixo estão descritos as propriedades e métodos pré-programados para facilitar na utilização:Para utilizar qualquer método ou propriedade listadas abaixo, sempre utilizar antes a nomenclatura "listContext.". Exemplo: **listContext.Metodo()** ou **listContext.Propriedade**
##### **Javascript - Bloquear e Desbloquear a abertura do lightbox do Formularío ao clicar na linha do grid**void blockLinkOpening() | para bloquear a abertura do link ao clicar na linha do grid |
| void unlockLinkOpening() | para desbloquear o bloqueio a abertura do link ao clicar na linha do grid |
currentLanguage.isEnglish() | retorna true se for inglês |
currentLanguage.isPortuguese() | retorna true se for português |
currentLanguage.isSpanish() | returna true se for espanhol |
currentLanguage.getIIF_TextFromCurrentLanguage(text_ptBR, text_ENG ,text_ESP) | dependendo do idioma, retorna o texto passado em 1 dos 3 parâmetros |
currentLanguage.getNumberDecimalSeparator() | Se NAO for Brasil, retorna ".", pois o formato do número é assim: 999,999,999.999 Se for Brasil, retorna ",", pois o formato do número é assim: 999.999.999,999 |
| number.convertString\_toNumber(strValueToConvert, \[optional\]qtdCasasDecimais) | ```JavaScript
//Converte número formatado no idioma atual para um formato numérico javascript, limpo sempre com ponto como separador decimal //se for ingles substitui virgula por nada e mantem o ponto como separador decimal var z = listContext.number.convertString_toNumber("100,999.53"); console.log(z); //result: 100999.53 //se for portugues substitui ponto por nada e virgula por ponto como separador decimal var z = listContext.number.convertString_toNumber("100.999,53"); console.log(z); //result: 100999.53 ``` |
| number.convertNumber\_toStringFormatted(numberToConvert,qtdCasasDecimais) | ```JavaScript
//formata o numero, dependendo do idioma var z = listContext.number.convertNumber_toStringFormatted(100999.50); console.log(z); //result: 100,999.50 ou 100.999,50 dependendo do idioma ``` |
| number.getNumberDecimalSeparator() | Se NAO for Brasil, retorna ".", pois o formato do número é assim: 999,999,999.999 Se for Brasil, retorna ",", pois o formato do número é assim: 999.999.999,999 |
| datetime.getDateNow() | data atual, retorna objeto Date do Javascript |
| datetime.getFormattedDateTime() | retorna data no formato 'DD/MM/YYYY' |
| datetime.getFormattedDate() | retorna 'DD/MM/YYYY HH:mm' |
| datetime.getLastDayOfCurrentMonth() | último dia do mês atual, retorno será 'DD/MM/YYYY' |
| datetime.getLastDayOfMonth(data) | último dia do mês da data passada como parâmetro passar a data ano formato 'DD/MM/YYYY' retorno será 'DD/MM/YYYY' |
| datetime.validation.isCurrentMonthAndYear(data) | verifica se a data é do mês e ano corrente passar data no formato 'DD/MM/YYYY' | ||||||||||||||||||
| datetime.validation.compare(date1,compare,date2) | Comparação entre 2 datas Passar as datas (date1 e date2) no formato 'DD/MM/YYYY' O parâmetro **compare** pode ser:
| ||||||||||||||||||
| datetime.validation.compareToday(compare,date2) | Comparação entre a data passado por parametro com a data atual Passar as data (date2) no formato 'DD/MM/YYYY' O parâmetro **compare** pode ser:
|
| datetime.add.day(data, days) | Adicionar **dias** a uma data passar data no formato 'DD/MM/YYYY' retorno será 'DD/MM/YYYY' |
| datetime.add.month(data, months) | Adicionar **meses** a uma data passar data no formato 'DD/MM/YYYY' retorno será 'DD/MM/YYYY' |
| datetime.add.year(data, years) | Adicionar **anos** a uma data passar data no formato 'DD/MM/YYYY' retorno será 'DD/MM/YYYY' |
| datetime.add.hour(data, hours) | Adicionar **horas** a uma data passar data no formato 'DD/MM/YYYY HH:mm' retorno será 'DD/MM/YYYY HH:mm' |
| datetime.add.minute(data, minutes) | Adicionar **minutos** a uma data passar data no formato 'DD/MM/YYYY HH:mm' retorno será 'DD/MM/YYYY HH:mm' |
isMobile | retorna true caso seja mobile |
Atenção: o objeto **listContext** não está presente no Formulário Pai, ver detalhes mais abaixo para o uso das funções semelhantes
As funções e biblioteca citadas acima não estão presentes da mesma forma no caso de tabelas/listagens filhas e que estarão dentro de um formulário Pai. A mudança mais impactante é que o listContext não está presente, sendo assim você deve utilizar as funções Javascript descritas nesse [link na documentação](https://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/formul%C3%A1rio---desenvolver-um-html-e-customizar-o-c-css-e-javascript "Formulário - Desenvolver um HTML e customizar o C#, CSS e Javascript") do `formContext` e `formcontext.childform` que são funçoes da tela de Formulário ##### **Javascript - Bibliotecas de terceiros** Abaixo estão listadas as biblioteca javascript que já estão importadas na página do formulário:| jquery v1.11.3 |
| bootstrap |
| moment |
| guid |
| jquery.inputmask/4.0.0-beta.19 |
| bootstrap-daterangepicker |
**O arquivo de customização sempre deve ter o mesmo nome do ID do campo/coluna no formulário**
Para esse exemplo, considere um Formulário chamado "**Exemplo de Listagem Customizada**" com o seguintes campos:| **Nome** | **Id do campo** | **Tipo de Campo** |
| Data e Hora | data\_e\_hora | Campo com máscara Data e Hora |
| Decimal com 2 Casas | decimal\_2casas | Campo Número - Decimal com 2 casas |
| Decimal com 3 Casas | decimal\_3casas | Campo Número - Número Decimal com 3 casas |
| Campo de Texto | ||
| Nome | nome | Campo de Texto |
| Idade | idade | Campo Número - Inteiro |
Foram adicionados campos **NUMÉRICOS e de DATA** para mostrar como você pode utilizar esse tipo de informação para fazer condicionais com essas informações.
Agora entra na área de listagem e coloque os seguintes campos:  Repare que na listagem eu adicionei os campos de Log, "Data criação" e "Criado Por". Esses são campos gerados automaticamente pelo Agilityflow, e você também pode utilizar essas informações na customização das colunas. Agora volte para a área de customização:  Agora precisamos criar os arquivos de customização para cada coluna. Crie através do botão NOVO CSHTML um arquivo para cada coluna que incluímos na listagem. Para isso, utilize o id da coluna como o nome do arquivo. Suas configurações devem estar como na imagem abaixo:  Antes de mostrar cada exemplo, abaixo descrevemos alguns métodos e propriedades disponíveis no contexto de cada customização de coluna, para que você consiga entender o que podemos fazer. #### Propriedade e Métodos C# disponíveis no contexto do CSHTML da Coluna O agilityflow disponibiliza uma biblioteca **C#** de contexto para a customização das colunas. Essa biblioteca está disponível no objeto "**ColumnContext**" e abaixo estão descritos as propriedades e métodos pré-programados para facilitar na utilização:Para utilizar qualquer método ou propriedade listadas abaixo, sempre utilizar antes a nomenclatura "ColumnContext.". Exemplo: **ColumnContext.Metodo()** ou **ColumnContext.Propriedade**
##### C# - Propriedades| string FormId | Id do registro, pode ser em branco ou nulo qdo for um rascunho |
| bool IsRascunho {get;} | Retorna true caso a linha seja um Rascunho |
| string DraftId | Id do rascunho |
| int RowIndex {get;} | Retorna a posição da Linha na tabela, começando do 0 |
| string GetText(string idColuna) | Retorna uma string com o **texto** da coluna passada no parâmetro *Essa função já traz o campo formatado com a máscara que está definida no Formulário. Por exemplo, caso seja um campo decimal, ele já trará o valor formatado de acordo com o idioma 10.000,00 ou 10.000,00 (caso você precise utilizar esse valor em alguma soma ou condicional ,utilize o método GetDecimal ao invés de GetText)* |
| string GetValue(string idColuna) | retorna o **ID** ao invés do Texto. \* Apenas para campos que sejam uma Lista Dinâmica, Lista Estática, Checkbox ou um campo que tenha como apresentação um Texto de outra Base de Dados mas por trás esse campo é um ID. \* caso não encontre ou o valor seja nulo retorna em branco ao invés de null |
| int? GetInt(string idColuna) | Retorna o valor da coluna no tipo INT (inteiro), caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000 |
| decimal? GetDecimal(string idColuna) | Retorna o valor da coluna no tipo Decimal, caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000.99 |
| DateTime? GetDateTime(string idColuna) | Retorna o valor da coluna no tipo DateTime para valores que estão no formato de data dd/MM/yyyy ou dd/MM/yyyy hh:mm |
**DICA: Nos métodos acima só estarão disponíveis informações dos campos que foram marcados para aparecer na listagem. Caso você precise usar uma informação mas não quer que ela se torne uma coluna da lista, adicione ela como disponível na listagem e marque ela como invisível. Veja mais [detalhes aqui](https://wiki.agilityflow.io/link/98#bkmrk-como-utilizar-a-info)**
##### C# - Customização visual da coluna ou linha| void SetCelColor(string color) | **Pinta o fundo da célula da coluna** Algumas cores já estão predefinidas seguindo padrão de tonalidade do agilityflow. Essas cores são: "red", "green", "yellow", "blue". Caso você julgue necessário você também pode utilizar cores no formato hexadecimal if(dt\_data\_e\_hora < DateTime.Now){ @ColumnContext.SetRowColor("red") //se em até 5 dias for ficar atrasado, coloca em amarelo a célula }else if(dt\_data\_e\_hora < DateTime.Now.AddDays(5)){ @ColumnContext.SetCelColor("yellow") } **importante usar o @ na frente** |
| void SetRowColor(string color) | **Pinta o fundo da linha da linha** Algumas cores já estão predefinidas seguindo padrão de tonalidade do agilityflow. Essas cores são: "red", "green", "yellow", "blue". Caso você julgue necessário você também pode utilizar cores no formato hexadecimal if(dt\_data\_e\_hora < DateTime.Now){ @ColumnContext.SetRowColor("red") //se em até 5 dias for ficar atrasado, coloca em amarelo a célula }else if(dt\_data\_e\_hora < DateTime.Now.AddDays(5)){ @ColumnContext.SetCelColor("yellow") } **importante usar o @ na frente** |
| void SetContextVariable(string key, string value) | Colocar uma variável e seu valor no contexto da listagem |
| string GetContextVariable(string key) | Recupera o valor de uma variável que esteja no contexto da listagem |
***Se você está utilizando o método GetText(..) para buscar uma coluna numérica, esse metódo já retornará o número formatado e não será necessário nenhuma formatação adicional. Se você está utilizando o método GetDecimal(..) ele não virá formatado pois ele retorna o tipo DECIMAL do C#, sendo assim, se você precisa do dado formatado você pode utilizar o GetText(..)***
| string FormatDecimalToString(object numDecimal, string mascaraTipo = "dec2") | formata object 999999999.55 para o formato da mascara de acordo com o idioma. \- se for ingles, será 999,999,999.55 \- se for portugues, será 999.999.999,55 |
| string FormatNumberToString\_EnglishFormat(object num, \[optional\]int? qtdCasasDecimais) | converte decimal para string, porém sempre a string vem no formato Inglês. coloca a a mesma qtd de casas decimais, caso o parâmetro qtdCasasDecimais estivar em branco |
| string GetUsuarioLogadoNome() | retorna o nome do usuário logado |
| string GetUsuarioLogadoPrimeiroNome() | retorna o primeiro nome do usuário logado |
| string GetUsuarioLogadoPrimeiroESegundoNome() | retorna o primeiro e o segundo nome do usuário logado |
| string GetUsuarioLogadoEmail() | retorna o e-mail do usuário logado |
| Guid GetUsuarioLogadoId() | retorna o id do usuário logado |
CurrentLanguage.IsEnglish() | retorna true se for inglês |
CurrentLanguage.IsPortuguese() | retorna true se for português |
CurrentLanguage.IsSpanish() | returna true se for espanhol |
CurrentLanguage.GetIIF_TextFromCurrentLanguage(text_ptBR, text_ENG ,text_ESP) | dependendo do idioma, retorna o texto passado em 1 dos 3 parâmetros |
| string GetUrlBase() | Retorna a URL base onde o agilityflow está instalado |
| string GetEnvironmentVariable(string nomeDaVariavel) | Retorna o valor de uma variável de ambiente **Não é perimitir utilizar esse metodo nesse contexto** |
| string GetEnvironmentVariable\_Text(string nomeDaVariavel) | Retorna o texto de uma variável de ambiente **Não é perimitir utilizar esse metodo nesse contexto** |
| Button |  | ```pt ``` |
| Small Text |  | ```pt
|
| Tag Red |  | ```pt
|
| Tag Outline Red |  | ```pt
|
| Tag Yellow |  | ```pt
|
| Tag Outline Yellow |  | ```pt
|
| Tag Blue |  | ```pt
|
| Tag Outline Blue |  | ```pt
|
| Tag Green |  | ```pt
|
| Tag Outline Green |  | ```pt
|
| Tag gray |  | ```pt
|
| Tag Outline gray |  | ```pt
|
| Avatar |  | ```pt
|
| Avatar |  | ```pt
|
| Rating |  | ```pt
|
| Rating |  | ```pt
|
| Rating Red |  | ```pt
|
| Rating Blue |  | ```pt
|
| Rating Green |  | ```pt
|
| Rating Gray |  | ```pt
|
| Rating Ball |  | ```pt
|
| Rating Ball |  | ```pt
|
| Rating Ball Red |  | ```pt
|
| Rating Ball Blue |  | ```pt
|
| Rating Ball Green |  | ```pt
|
| Rating Ball Gray |  | ```pt
|
| Break Line | ```pt
``` | |
| Line |  | ```pt
``` |
@ColumnContext.GetInt("decimal_3casas")
@ColumnContext.GetDecimal("decimal_3casas")
@{ if(ColumnContext.GetDecimal("decimal_3casas") > 10000){
**Dica:** Apenas campos que estão marcados para serem colunas da lista podem ser acessados através do método `ColumnContext.GetText(...),`sendo assim se você quer acessar uma informação através do `GetText `mas não quer que essa informação seja uma coluna, deixe ela invisível para os usuários, seguindo o procedimento abaixo.
Seguindo nosso exemplo, na coluna **NOME** da listagem, eu quero concatenar o Nome e a Idade do usuário, porém como eu não coloquei a Idade para ser visível na lista, ela não estará acessível se eu não seguir esses passos:Passo 1. Adicione a coluna NOME na listagem do formulário Cliente
Passo 2. Adicione a coluna IDADE na listagem do formulário Cliente
Passo 3. Desmarque na coluna IDADE as opções "Visível no Mobile" e "Visível no Desktop"
Pronto, agora a coluna idade ficará disponível para ser acessar pelo contexto: `ColumnContext.GetText("idade")```
mas não será uma coluna da Listagem.
#### Adicionar um botão na listagem
No arquivo de customização **"email",** vamos criar uma regrinha:
\- Vamos mostrar o valor do campo E-mail
\- Vamos adicionar um botão que quando o usuário clicar apresentará a msg "Mensagem de Exemplo"
\- Para esse exemplo, vamos precisar fazer uso do arquivo padrão "Javascript" do List Page
No arquivo de customização de **"email",** cole o código abaixo
```C#
@ColumnContext.GetText("email")
``` No arquivo Javascript da List Page, cole o código abaixo  ```JavaScript $(document).on('click', '.btn-exemplo-botao', function (e) { //bloqueia a abertura da tela de visualização do formulário listcontext.blockLinkOpening(); //aqui você pode colocar seu código //apresenta uma mensagem alert('Mensagem de Exemplo') //desbloqueia a abertura da tela de visualização do formulário listcontext.unlockLinkOpening(false); }) ``` ##### **Formulário Filho:** No caso dessa tabela também estar dentro de um **Formulário Pai**, algumas coisas mudam: O Javascript feito acima está colocado apenas no **List Page da página de Listagem**, dessa forma ele não será adicionado ao Formulário Pai, então você deve entrar dentro da área de desenvolvimento do Formulário Pai abrir o arquivo **Javascript** e ao invés de colocar o código no Javascript da aba List Page, coloque ocódigo **abaixo** na aba **Form Page** do formulário pai. 
No caso de Formulário Filho dentro de um formulário Pai, não existirá no Javascript a biblioteca listContext pois essa biblioteca só está presenta na tela de lista. Nesse caso precisaremos usar o formContext mas como estamos falando de um Formulário Filho, as funções referente a ele está dentro de `formContext.childForm.xxxx()`
Código para o mesmo funcionamento do botão mas agora no formulário Pai. **Observe que no código abaixo, além da mudança de local do Javascript, o `listContext.` foi substituido por `formContext.childForm`** ```JavaScript $(document).on('click', '.btn-exemplo-botao', function (e) { //bloqueia a abertura da tela de visualização do formulário formcontext.childForm.blockLinkOpening(); //aqui você pode colocar seu código //apresenta uma mensagem alert('Mensagem de Exemplo') //desbloqueia a abertura da tela de visualização do formulário formcontext.childForm.unlockLinkOpening(false); }) ``` Resultado:  Quando o usuário, clicar no botão "Botão" ele receberá essa mensagem:  #### Como utilizar uma Variável de Contexto ou Variável Global para interagir e armazenar informações entre todas as linhas e colunas da mesma listagem Para esse exemplo demonstraremos o uso dos métodos `ColumnContext.GetGlobalVariable("variavel");` e ColumnContext.SetGlobalVariable("variavel", "valor"); No arquivo de customização **"nome",** vamos criar uma regrinha: \- Vamos mostrar o valor do campo Nome, concatenado com a palavra "Nome:" \- Vamos somar a idade da linha anterior com a linha atual, até a última linha ser a soma total das idades \- Vamos mostrar uma frase mostrando a posição da linha (RowIndex) concatenada com a idade total somada até aquele momento ```C# @{ //recupera o total já gravado em uma variavel global var str_idade_total = ColumnContext.GetGlobalVariable("idade"); //pega a idade referente a essa linha na tabela //já puxa a idade no formato INT (número inteiro) para ser possível //fazer a soma total sem precisar de conversão de número var idade = @ColumnContext.GetInt("idade"); //se a idade não tiver sido preenchida no formulário, então considera ela como zero if(idade == null) { idade = 0; } //se a idade total já estiver sido preenchida, então, soma com a idade dessa linha //caso contrário ignora pois será o primeiro registro da linha e não precisará ser feito nenhuma soma if(!string.IsNullOrEmpty(str_idade_total)){ idade = Convert.ToInt32(str_idade_total) + idade; } //coloca novamente a soma das idades totais na Variável Global, para ser recuparada na próxima linha str_idade_total = idade.ToString(); ColumnContext.SetGlobalVariable("idade", str_idade_total); } Nome: @ColumnContext.GetText("nome")Até o RowIndex @ColumnContext.RowIndex a Idade era de @str_idade_total anos ``` #### Customizar e acessar as colunas de Log: Data de criação, Data de Alteração, Criado por e Alterado por. Para recuperar os campos de Log na listagem através do `GetText(...)` ou `GetDateTime(...)` utilizar os ids padrões de cada campo:
| **Nome** | **ID** |
| Data de criação | log\_data\_criacao |
| Data de Alteração | log\_data\_alteracao |
| Criado por | log\_usu\_criacao |
| Alterado por | log\_usu\_alteracao |
Levar em consideração o tratamento em CSS para a responsividade da plataforma em outros device, Mobile, Computador Desktop, Tablet, etc.
### Customizar com Javascript Todo código Javascript da datatable, deve ficar no arquivo Javascript.  ### Customizar com Html e/ou C# rie através do botão NOVO CSHTML um arquivo para cada coluna que incluímos na tabela de dados. Para isso, utilize o id da coluna como o nome do arquivo. Suas configurações devem estar como na imagem abaixo:  Antes de mostrar cada exemplo, abaixo descrevemos alguns métodos e propriedades disponíveis no contexto de cada customização de coluna, para que você consiga entender o que podemos fazer. #### Propriedade e Métodos C# disponíveis no contexto do CSHTML da Coluna O agilityflow disponibiliza uma biblioteca **C#** de contexto para a customização das colunas. Essa biblioteca está disponível no objeto "**ColumnContext**" e abaixo estão descritos as propriedades e métodos pré-programados para facilitar na utilização:Para utilizar qualquer método ou propriedade listadas abaixo, sempre utilizar antes a nomenclatura "ColumnContext.". Exemplo: **ColumnContext.Metodo()** ou **ColumnContext.Propriedade**
##### C# - Propriedades| int RowIndex {get;} | Retorna a posição da Linha na tabela, começando do 0 |
| string GetText(string idColuna) | Retorna uma string com o **texto** da coluna passada no parâmetro |
| string GetValue(string idColuna) | Retorna uma string com o **texto** da coluna passada no parâmetro |
| int? GetInt(string idColuna) | Retorna o valor da coluna no tipo INT (inteiro), caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000 |
| decimal? GetDecimal(string idColuna) | Retorna o valor da coluna no tipo Decimal, caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000.99 |
| DateTime? GetDateTime(string idColuna) | Retorna o valor da coluna no tipo DateTime para valores que estão no formato de data dd/MM/yyyy ou dd/MM/yyyy hh:mm |
| void SetCelColor(string color) | **Pinta o fundo da célula da coluna** Algumas cores já estão predefinidas seguindo padrão de tonalidade do agilityflow. Essas cores são: "red", "green", "yellow", "blue". Caso você julgue necessário você também pode utilizar cores no formato hexadecimal if(dt\_data\_e\_hora < DateTime.Now){ @ColumnContext.SetRowColor("red") //se em até 5 dias for ficar atrasado, coloca em amarelo a célula }else if(dt\_data\_e\_hora < DateTime.Now.AddDays(5)){ @ColumnContext.SetCelColor("yellow") } **importante usar o @ na frente** |
| void SetRowColor(string color) | **Pinta o fundo da linha da linha** Algumas cores já estão predefinidas seguindo padrão de tonalidade do agilityflow. Essas cores são: "red", "green", "yellow", "blue". Caso você julgue necessário você também pode utilizar cores no formato hexadecimal if(dt\_data\_e\_hora < DateTime.Now){ @ColumnContext.SetRowColor("red") //se em até 5 dias for ficar atrasado, coloca em amarelo a célula }else if(dt\_data\_e\_hora < DateTime.Now.AddDays(5)){ @ColumnContext.SetCelColor("yellow") } **importante usar o @ na frente** |
| void SetContextVariable(string key, string value) | Colocar uma variável e seu valor no contexto da listagem |
| string GetContextVariable(string key) | Recupera o valor de uma variável que esteja no contexto da listagem |
| string FormatDecimalToString(object numDecimal, string mascaraTipo = "dec2") | formata object 999999999.55 para o formato da mascara de acordo com o idioma. \- se for ingles, será 999,999,999.55 \- se for portugues, será 999.999.999,55 |
| string FormatNumberToString\_EnglishFormat(object num, \[optional\]int? qtdCasasDecimais) | converte decimal para string, porém sempre a string vem no formato Inglês. coloca a a mesma qtd de casas decimais, caso o parâmetro qtdCasasDecimais estivar em branco |
| string GetUsuarioLogadoNome() | retorna o nome do usuário logado |
| string GetUsuarioLogadoPrimeiroNome() | retorna o primeiro nome do usuário logado |
| string GetUsuarioLogadoPrimeiroESegundoNome() | retorna o primeiro e o segundo nome do usuário logado |
| string GetUsuarioLogadoEmail() | retorna o e-mail do usuário logado |
| Guid GetUsuarioLogadoId() | retorna o id do usuário logado |
CurrentLanguage.IsEnglish() | retorna true se for inglês |
CurrentLanguage.IsPortuguese() | retorna true se for português |
CurrentLanguage.IsSpanish() | returna true se for espanhol |
CurrentLanguage.GetIIF_TextFromCurrentLanguage(text_ptBR, text_ENG ,text_ESP) | dependendo do idioma, retorna o texto passado em 1 dos 3 parâmetros |
| string GetUrlBase() | Retorna a URL base onde o agilityflow está instalado |
| string GetEnvironmentVariable(string nomeDaVariavel) | Retorna o valor de uma variável de ambiente **Não é perimitir utilizar esse metodo nesse contexto** |
| string GetEnvironmentVariable\_Text(string nomeDaVariavel) | Retorna o texto de uma variável de ambiente **Não é perimitir utilizar esse metodo nesse contexto** |
| Button |  | ```pt ``` |
| Small Text |  | ```pt
|
| Tag Red |  | ```pt
|
| Tag Outline Red |  | ```pt
|
| Tag Yellow |  | ```pt
|
| Tag Outline Yellow |  | ```pt
|
| Tag Blue |  | ```pt
|
| Tag Outline Blue |  | ```pt
|
| Tag Green |  | ```pt
|
| Tag Outline Green |  | ```pt
|
| Tag gray |  | ```pt
|
| Tag Outline gray |  | ```pt
|
| Avatar |  | ```pt
|
| Avatar |  | ```pt
|
| Rating |  | ```pt
|
| Rating |  | ```pt
|
| Rating Red |  | ```pt
|
| Rating Blue |  | ```pt
|
| Rating Green |  | ```pt
|
| Rating Gray |  | ```pt
|
| Rating Ball |  | ```pt
|
| Rating Ball |  | ```pt
|
| Rating Ball Red |  | ```pt
|
| Rating Ball Blue |  | ```pt
|
| Rating Ball Green |  | ```pt
|
| Rating Ball Gray |  | ```pt
|
| Break Line | ```pt
``` | |
| Line |  | ```pt
``` |
@ColumnContext.GetInt("decimal_3casas")
@ColumnContext.GetDecimal("decimal_3casas")
@{ if(ColumnContext.GetDecimal("decimal_3casas") > 10000){
``` No arquivo Javascript da List Page, cole o código abaixo  ```JavaScript $(document).on('click', '.btn-exemplo-botao', function (e) { //aqui você pode colocar seu código //apresenta uma mensagem alert('Mensagem de Exemplo') }) ``` Quando o usuário, clicar no botão "Botão" ele receberá essa mensagem:  #### Como utilizar uma Variável de Contexto ou Variável Global para interagir e armazenar informações entre todas as linhas e colunas da mesma listagem Para esse exemplo demonstraremos o uso dos métodos `ColumnContext.GetGlobalVariable("variavel");` e ColumnContext.SetGlobalVariable("variavel", "valor"); No arquivo de customização **"nome",** vamos criar uma regrinha: \- Vamos mostrar o valor do campo Nome, concatenado com a palavra "Nome:" \- Vamos somar a idade da linha anterior com a linha atual, até a última linha ser a soma total das idades \- Vamos mostrar uma frase mostrando a posição da linha (RowIndex) concatenada com a idade total somada até aquele momento ```C# @{ //recupera o total já gravado em uma variavel global var str_idade_total = ColumnContext.GetGlobalVariable("idade"); //pega a idade referente a essa linha na tabela //já puxa a idade no formato INT (número inteiro) para ser possível //fazer a soma total sem precisar de conversão de número var idade = @ColumnContext.GetInt("idade"); //se a idade não tiver sido preenchida no formulário, então considera ela como zero if(idade == null) { idade = 0; } //se a idade total já estiver sido preenchida, então, soma com a idade dessa linha //caso contrário ignora pois será o primeiro registro da linha e não precisará ser feito nenhuma soma if(!string.IsNullOrEmpty(str_idade_total)){ idade = Convert.ToInt32(str_idade_total) + idade; } //coloca novamente a soma das idades totais na Variável Global, para ser recuparada na próxima linha str_idade_total = idade.ToString(); ColumnContext.SetGlobalVariable("idade", str_idade_total); } Nome: @ColumnContext.GetText("nome")
Até o RowIndex @ColumnContext.RowIndex a Idade era de @str_idade_total anos ``` #### Customizar e acessar as colunas de Log: Data de criação, Data de Alteração, Criado por e Alterado por. Para recuperar os campos de Log na listagem através do `GetText(...)` ou `GetDateTime(...)` utilizar os ids padrões de cada campo:
| **Nome** | **ID** |
| Data de criação | log\_data\_criacao |
| Data de Alteração | log\_data\_alteracao |
| Criado por | log\_usu\_criacao |
| Alterado por | log\_usu\_alteracao |
Na maioria dos casos, você não precisa alterar o nome sugerido pelo sistema.
Diferentemente do campo "Nome de Apresentação", esse campo não fica visível para o usuário. > Para que serve o campo Coluna Banco de dados (SQL)? Esse campo vai ser utilizado ao criar reports e dashboards. É através dele, que poderemos extrair informações e expor usando esses recursos do sistema. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) ### Preenchimento Padrão O preenchimento padrão, permite ao sistema, sugerir o preenchimento do campo. Isso é útil, quando o usuário, na maioria das vezes, vai preencher esse campo da mesma forma. Isso economiza o tempo do usuário no preenchimento das informações. Mesmo que haja definido um preenchimento padrão, o campo fica disponível para que o usuário altere esse valor. #### Preencher Quando Nessa opção, o usuário define em que momento o sistema faz o preenchimento padrão do campo. São duas opções: ##### No carregamento inicial (On PageLoad) Ao abrir o formulário, o campo já é preenchido automaticamente. ##### Na alteração do valor de um determinado campo (On Change) O campo não é preenchido com o valor padrão, até que um campo seja alterado. É possível definir qual campo ao ser alterado, será o gatilho para o preenchimento padrão. #### Valor Padrão É o valor que será preenchido por padrão nesse campo. ### Máscara É a forma que o sistema utiliza para mostrar ao usuário, o conteúdo do campo de texto. Isso facilita a visualização da informação por parte do usuário. Por exemplo, é muito fácil ver o telefone "(11) 98765-4321" do que "11987654321". #### Tipo de máscara Existe uma série de máscaras disponíveis no agilityflow. ##### Número > Como criar um campo numérico? Um número não deixa de ser um texto. Portanto, para criar um campo numérico basta criar um campo textbox e aplicar uma máscara de número. - Tipo de Número - Inteiro: o campo não aceita "," ou "." no seu conteúdo. Ao digitar um desses símbolos, o sistema ignora a digitação. Por exemplo, digitando "1,5", o sistema ignora a vírgula e preenche "15". Caso o usuário cole o valor "1,5541", o sistema ignora a vírgula e o conteúdo à direita da vírgula, aceitando o valor "1". - Moeda (Real): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (1 casa decimal): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (2 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (3 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (4 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (5 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; ##### CPF Insere "." e "-" de acordo com o CPF brasileiro. Esse campo, apenas separa os dígitos e não faz validação se o CPF é válido ou não. Pra isso, é necessário incluir uma [validação](#bkmrk-%E2%A0-8). ##### CNPJ Insere "." e "-" de acordo com o CNPJ brasileiro. Esse campo, apenas separa os dígitos e não faz validação se o CNPJ é válido ou não. Pra isso, é necessário incluir uma [validação](#bkmrk-%E2%A0-8). ##### CEP Insere "-", separando o número de acordo com o formato do CEP brasileiro.Para buscar o CEP automaticamente na base dos correios e preencher os campos de endereço, **[verifique o tutorial aqui nesse link](https://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/buscar-o-cep-nos-correios-e-preencher-os-campos-de-endere%C3%A7o-automaticamente)**
##### Máscara Customizada A máscara customizada, permite o usuário crie sua própria máscara. O agilityflow, utiliza a biblioteca Inputmask do javascript, criada por Robin Herbots. A documentação completa pode ser acessada no [github](https://github.com/RobinHerbots/Inputmask). Você só precisa ler essa documentação, caso opte por fazer uma customização avançada. ##### Tipo de Customização - Básica: é um forma fácil de criar uma máscara não existente no agilityflow. A sintaxe utilizada é a seguinte: 9: caractere numérico (de "0" a "9"); a: caractere alfabético (de "a" a "z"); A: caractere alfabético (de "A" a "Z"); \*: caractere alfanumérico (todos acima); \[\]: quando usado, identifica um caractere opcional; \\\\: Par usar um dos caracteres acima como caractere e não como sintaxe; Exemplos:| **Máscara** | **Entrada** | **Resultado** |
| (99) 9999\[9\]-9999 | 12123451234 | (12) 12345-1234 |
| (99) 9999\[9\]-9999 | 121234-1234 | (12) 1234-1234 |
| \[9-\]AAA-999 | 5ahg123 | 5-AHG-123 |
| \[9-\]aaa-999 | ahg123 | ahg123 |
| +999-\\\\9 | 123 | +123-9 |
| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript Caso a customização desejada, não esteja disponível, ainda assim é possível programá-la utilizando javascript. Para mais detalhes, acesse o [capítulo](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/customiza%C3%A7%C3%A3o-javascript "Customização javascript") sobre essa opção. # Label Dinâmica Label Dinâmica é um campo de texto não editável, que é preenchido através de outro campo. Esse campo é muito útil, quando se tem um campo de lista de seleção (ou pesquisa com auto-completar) com uma fonte dinâmica e há a necessidade mostrar outros campos do formulário usado como fonte por esse campo. No exemplo abaixo, o formulário tem uma lista de seleção de clientes. Os outros dois campos, são label dinâmicas com informações do formulário de cliente. [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/label_dinamica.gif) Ao mudar o campo de lista de seleção, a label dinâmica é preenchida automaticamente. ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) ### Preenchimento da Label Dinâmica Aqui, estão as opções principais de configurações para a label dinâmica. #### Preencher a label dinâmica ao alterar o campo Nessa opção, apenas os campos Lista de Seleção com lista dinâmica, ou o campo Pesquisa com Auto Completar serão mostrados aqui. É esse campo que, ao ser alterado, preencherá a label dinâmica. #### Campo de apresentação (Base de dados) É o campo do formulário usado como fonte na lista de seleção (ou pesquisa com auto completar) será usado para o preenchimento. ### Regras de Visibilidade e desativação Usando essas opções, é possível tornar um campo visível, invisível, ativo ou inativo, e definir quando uma dessas ações deve ocorrer. É possível adicionar várias regras para cada campo. #### Descrição É um texto que ajuda a identificar a regra que se está criando. Muito útil quando existem múltiplas regras. #### Ação ##### Visível O campo é mostrado na tela, caso esteja inserido para tal, nas configurações de tela. ##### Invisível O campo é não é mostrado na tela, mesmo que esteja inserido para tal, nas configurações de tela. #### A partir da etapa / Até a etapa Em formulários com etapas, é possível estabelecer que uma regra será aplicada em alguma(s) etapa(s). Para isso, basta selecionar as etapas nos campos "a partir da etapa" e "até a etapa", para definir em que momento do fluxo essa regra vai ser aplicada. #### Quando Define em que momento a ação deve acontecer. ##### Sempre É o padrão do formulário. ##### Condicional - Tipo de condição Para fazer um validação condicional, estão disponíveis as seguintes condições: - Se o campo: compara um campo com um valor, ou com outro campo. Abaixo, uma tabela com os operadores disponíveis para as comparações:| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. # Upload Esse campo é utilizado para o envio de arquivos. ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) ### Validação Nessa parte, é possível configurar validações dos dados inseridos pelo usuário, garantindo um padrão de preenchimento. #### Obrigatório Caso marcado como "sim", não permite o salvamento do fomulário sem o preenchimento desse campo. Ao marcar como "sim" essa opção, são abertos duas outras opções: ##### Obrigatório mesmo que por algum motivo o campo esteja marcado como invisível? Use essa opção para fazer um campo definido como obrigatório, deixar sua obrigatoriedade caso ele esteja [invisível](#bkmrk-%E2%A0-8). ##### Obrigatório a partir da etapa Para os formulários com fluxo de etapas, é possível atrelar a obrigatoriedade de um campo à etapa em que se encontra o fluxo. #### Extensão Permitida É possível adicionar uma lista branca, com as extensões permitidas. #### Extensão não permitida É possível adicionar uma lista negra, com as extensões não permitidas. #### Validação Customizada ##### Tipo de Validação - Upload de no máximo X itens: é possível definir um limite de arquivos; - Upload no mínimo X itens: é possível definir um mínimo de arquivos; - Upload exatamente X itens: é possível definir uma quantidade específica de arquivos; ##### Validar a partir da etapa Em formulários com etapas, é possível estabelecer que uma validação será aplicada em alguma(s) etapa(s). Para isso, basta selecionar a etapa no campo "validar a partir da etapa". ### Regras de Visibilidade e desativação Usando essas opções, é possível tornar um campo visível, invisível, ativo ou inativo, e definir quando uma dessas ações deve ocorrer. É possível adicionar várias regras para cada campo. #### Descrição É um texto que ajuda a identificar a regra que se está criando. Muito útil quando existem múltiplas regras. #### Ação ##### Ativar Deixa o campo disponível para inserção de dados. É o estado padrão do campo. ##### Inativar Deixa o campo indisponível para inserção de dados. ##### Visível O campo é mostrado na tela, caso esteja inserido para tal, nas configurações de tela. ##### Invisível O campo é não é mostrado na tela, mesmo que esteja inserido para tal, nas configurações de tela. #### A partir da etapa / Até a etapa Em formulários com etapas, é possível estabelecer que uma regra será aplicada em alguma(s) etapa(s). Para isso, basta selecionar as etapas nos campos "a partir da etapa" e "até a etapa", para definir em que momento do fluxo essa regra vai ser aplicada. #### Quando Define em que momento a ação deve acontecer. ##### Sempre É o padrão do formulário. ##### Condicional- Tipo de condição
Para fazer um validação condicional, estão disponíveis as seguintes condições:
- Se o campo: compara um campo com um valor, ou com outro campo.
Abaixo, uma tabela com os operadores disponíveis para as comparações:
# Lista de seleção (Combo)
Esse campo, permite que o usuário escolha uma opção pré-determinada.
#### [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/lista_para_selecao.gif)
### Grupo de informações
Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação.
### Nome de Apresentação
Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário.
### Coluna Banco de dados (SQL)
Esse é o nome interno, usado pelo sistema, a ser criado no banco de dados do agilityflow. É uma informação técnica e esse campo é preenchido automaticamente pelo sistema.
| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada.Na maioria dos casos, você não precisa alterar o nome sugerido pelo sistema.
Diferentemente do campo "Nome de Apresentação", esse campo não fica visível para o usuário. > Para que serve o campo Coluna Banco de dados (SQL)? Esse campo vai ser utilizado ao criar reports e dashboards. É através dele, que poderemos extrair informações e expor usando esses recursos do sistema. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) --- ### Origem dos Dados Como existe uma lista de opções pré-determinadas, é necessário definir a origem dos dados. #### Origem dos Itens São duas as possibilidades: **1. Lista Dinâmica** (Utilização recomendada) **:** Nessa opção, os dados têm como origem um outro formulário. Ao selecionar esse outro formulário, é necessário informar qual o campo desse formulário será exibido. **2. Lista Estática:** O usuário insere as opções nas configurações do campo. Com isso, o usuário que acessa o formulário não pode criar novas opções. Ao criar as opções, além do nome, é possível definir a ordem em que aparecerão na lista de seleção. Outra opção, é o Id Customizado (Banco de Dados). Essa opção, normalmente não precisa ser preenchido. Entretanto, em alguns casos, esse id pode ser customizado. Isso pode ser útil, para a criação de dashboard e reports, para montar mais facilmente as *queries*.Sugerimos que o campo de Lista de seleção (combo) não seja usado quando há muitas itens pois todas as opções desse campo são lidas quando a página é carregada. Se houver muitos itens, o carregamento da página pode ser afetado. Para esses casos, usar o campo [**Pesquisa com auto completar.**](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/pesquisa-com-auto-completar "Pesquisa com auto completar")
#### **Configuração de uma Lista Dinâmica** Abaixo estão descritos os campos básicos de preenchimento para definição de uma lista dinâmica. Abra a tela de edição do campo e clique na aba **Origem dos Dados**  ##### **Campos para preenchimento:** ##### Origem dos dados Defina como "Lista Dinâmica" ##### Quando os dados serão carregados? Quando a lista é dinâmica, é possível definir algumas opções relativas ao carregamento da lista. Esse carregamento pode ocorrer de duas maneiras. **No carregamento inicial (On PageLoad):** Assim que o formulário é carregado, as opções da lista de seleção também são carregados imediatamente. **Na alteração do valor de um determinado campo (On Change):** As opções só serão carregadas quando um determinado campo mudar. Isso é útil, para uma lista de seleção selecionar níveis de outra lista de seleção. Ex: seleciona-se primeiro o estado e só depois, é selecionada a cidade. Esse campo Lista de Cidade, apenas é carregado quando o outro campo Lista de Estados é alterado. Para isso, é necessário também adicionar uma[ condição na base de dados](#h_50356803591550685996742). ##### Qual será a Base de dados É o formulário que servirá de fonte para a Lista Dinâmica. ##### Campo de apresentação (Base de dados) Essa é a informação que será apresentada para o usuário na apresentação do combo. Esse campo é referente ao formulário que foi selecionado no campo [Qual será a Base de dados](#h_695508394161550686141083). ##### Ordenar os itens pelo campo A ordenação padrão do itens do combo é alfabética. Entretanto há casos onde queremos alterar essa ordem. Para isso, podemos utilizar um segundo campo como critério de ordenação, que não o campo de exibição. Como exemplo, vamos usar um formulário que só tem o campo nome, e os seguintes dados?| **Prioridade** |
| Alta |
| Baixa |
| Média |
| **Prioridade** | **Ordem** |
| Alta | 3 |
| Baixa | 2 |
| Média | 1 |
| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript Caso a customização desejada, não esteja disponível, ainda assim é possível programá-la utilizando javascript. Para mais detalhes, acesse o [capítulo](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/customiza%C3%A7%C3%A3o-javascript "Customização javascript") sobre essa opção. # Pesquisa com auto completar Esse campo, é muito similar ao campo [Lista de Seleção](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/lista-de-sele%C3%A7%C3%A3o-%28combo%29 "Lista de seleção (Combo)") e permite que o usuário escolha uma opção pré-determinada. Abaixo é possível comparar ambos campos, com a mesma fonte dinâmica de dados: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/lista_auto_completar.gif) ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Coluna Banco de dados (SQL) Esse é o nome interno, usado pelo sistema, a ser criado no banco de dados do agilityflow. É uma informação técnica e esse campo é preenchido automaticamente pelo sistema.Na maioria dos casos, você não precisa alterar o nome sugerido pelo sistema.
Diferentemente do campo "Nome de Apresentação", esse campo não fica visível para o usuário. > Para que serve o campo Coluna Banco de dados (SQL)? Esse campo vai ser utilizado ao criar reports e dashboards. É através dele, que poderemos extrair informações e expor usando esses recursos do sistema. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) --- ### Origem dos Dados Como existe uma lista de opções pré-determinadas, é necessário definir a origem dos dados. #### Origem dos Itens São duas as possibilidades: **1. Lista Dinâmica** (Utilização recomendada) **:** Nessa opção, os dados têm como origem um outro formulário. Ao selecionar esse outro formulário, é necessário informar qual o campo desse formulário será exibido. **2. Lista Estática:** O usuário insere as opções nas configurações do campo. Com isso, o usuário que acessa o formulário não pode criar novas opções. Ao criar as opções, além do nome, é possível definir a ordem em que aparecerão na lista de seleção. Outra opção, é o Id Customizado (Banco de Dados). Essa opção, normalmente não precisa ser preenchido. Entretanto, em alguns casos, esse id pode ser customizado. Isso pode ser útil, para a criação de dashboard e reports, para montar mais facilmente as *queries*. #### **Configuração de uma Lista Dinâmica ** Abaixo estão descritos os campos básicos de preenchimento para definição de uma lista dinâmica. Abra a tela de edição do campo e clique na aba **Origem dos Dados**  ##### **Campos para preenchimento:** ##### Origem dos dados Defina como "Lista Dinâmica" ##### Quando os dados serão carregados? Quando a lista é dinâmica, é possível definir algumas opções relativas ao carregamento da lista. Esse carregamento pode ocorrer de duas maneiras. **No carregamento inicial (On PageLoad):** Assim que o formulário é carregado, as opções da lista de seleção também são carregados imediatamente. **Na alteração do valor de um determinado campo (On Change):** As opções só serão carregadas quando um determinado campo mudar. Isso é útil, para uma lista de seleção selecionar níveis de outra lista de seleção. Ex: seleciona-se primeiro o estado e só depois, é selecionada a cidade. Esse campo Lista de Cidade, apenas é carregado quando o outro campo Lista de Estados é alterado. Para isso, é necessário também adicionar uma[ condição na base de dados](#h_50356803591550685996742). ##### Qual será a Base de dados É o formulário que servirá de fonte para a Lista Dinâmica. ##### Campo de apresentação (Base de dados) Essa é a informação que será apresentada para o usuário na apresentação do combo. Esse campo é referente ao formulário que foi selecionado no campo [Qual será a Base de dados](#h_695508394161550686141083). ##### Ordenar os itens pelo campo A ordenação padrão do itens do combo é alfabética. Entretanto há casos onde queremos alterar essa ordem. Para isso, podemos utilizar um segundo campo como critério de ordenação, que não o campo de exibição. Como exemplo, vamos usar um formulário que só tem o campo nome, e os seguintes dados?| **Prioridade** |
| Alta |
| Baixa |
| Média |
| **Prioridade** | **Ordem** |
| Alta | 3 |
| Baixa | 2 |
| Média | 1 |
O vídeo abaixo mostra a configuração da lista de seleção, mas também se aplica para o campo Pesquisa com Auto completar. O processo de configuração e o comportamento é idêntico.
| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript Caso a customização desejada, não esteja disponível, ainda assim é possível programá-la utilizando javascript. Para mais detalhes, acesse o [capítulo](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/customiza%C3%A7%C3%A3o-javascript "Customização javascript") sobre essa opção. # Checkbox (Único) Esse campo permite o usuário responder a uma pergunta cuja resposta tem duas opções. ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Texto ao lado do Checkbox Nesse campo, é possível definir o texto quando o campo está marcado, e quando o campo está desmarcado. O texto escolhido quando o campo está marcado, será mostrado na tela, enquanto o texto do campo quando está desmarcado, apenas será mostrado na listagem e no filtro de dados.  #### Quando marcado Texto a ser exibido ao lado do campo. Quando estiver marcado, esse texto será mostrado na listagem de dados.  #### Quando desmarcado Esse texto não será exibido quando estiver desmarcado, mas será mostrado na listagem de dados.  ### Coluna Banco de dados (SQL) Esse é o nome interno, usado pelo sistema, a ser criado no banco de dados do agilityflow. É uma informação técnica e esse campo é preenchido automaticamente pelo sistema.Na maioria dos casos, você não precisa alterar o nome sugerido pelo sistema.
Diferentemente do campo "Nome de Apresentação", esse campo não fica visível para o usuário. > Para que serve o campo Coluna Banco de dados (SQL)? Esse campo vai ser utilizado ao criar reports e dashboards. É através dele, que poderemos extrair informações e expor usando esses recursos do sistema. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) ### Validação Nessa parte, é possível configurar validações dos dados inseridos pelo usuário, garantindo um padrão de preenchimento. > Como deixar um campo obrigatório? #### Obrigatório Caso marcado como "sim", não permite o salvamento do fomulário sem o preenchimento desse campo. Ao marcar como "sim" essa opção, são abertos duas outras opções: ##### Obrigatório mesmo que por algum motivo o campo esteja marcado como invisível? Use essa opção para fazer um campo definido como obrigatório, deixar sua obrigatoriedade caso ele esteja [invisível](#bkmrk-%E2%A0-8). ##### Obrigatório a partir da etapa Para os formulários com fluxo de etapas, é possível atrelar a obrigatoriedade de um campo à etapa em que se encontra o fluxo. ### Regras de Visibilidade e desativação Usando essas opções, é possível tornar um campo visível, invisível, ativo ou inativo, e definir quando uma dessas ações deve ocorrer. É possível adicionar várias regras para cada campo. #### Descrição É um texto que ajuda a identificar a regra que se está criando. Muito útil quando existem múltiplas regras. #### Ação ##### Ativar Deixa o campo disponível para inserção de dados. É o estado padrão do campo. ##### Inativar Deixa o campo indisponível para inserção de dados. ##### Visível O campo é mostrado na tela, caso esteja inserido para tal, nas configurações de tela. ##### Invisível O campo é não é mostrado na tela, mesmo que esteja inserido para tal, nas configurações de tela. #### A partir da etapa / Até a etapa Em formulários com etapas, é possível estabelecer que uma regra será aplicada em alguma(s) etapa(s). Para isso, basta selecionar as etapas nos campos "a partir da etapa" e "até a etapa", para definir em que momento do fluxo essa regra vai ser aplicada. #### Quando Define em que momento a ação deve acontecer. ##### Sempre É o padrão do formulário. ##### Condicional - Tipo de condição Para fazer um validação condicional, estão disponíveis as seguintes condições: - Se o campo: compara um campo com um valor, ou com outro campo. Abaixo, uma tabela com os operadores disponíveis para as comparações:| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript Caso a customização desejada, não esteja disponível, ainda assim é possível programá-la utilizando javascript. Para mais detalhes, acesse o [capítulo](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/customiza%C3%A7%C3%A3o-javascript "Customização javascript") sobre essa opção. # Lista aberta com escolha única (Radio) Esse campo é muito similar ao tipo [Lista de Seleção](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/lista-de-sele%C3%A7%C3%A3o-%28combo%29 "Lista de seleção (Combo)"), mudando apenas a forma como é apresentado. Abaixo, um exemplo do campo radio (Lista aberta com escolha única):  ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Coluna Banco de dados (SQL) Esse é o nome interno, usado pelo sistema, a ser criado no banco de dados do agilityflow. É uma informação técnica e esse campo é preenchido automaticamente pelo sistema.Na maioria dos casos, você não precisa alterar o nome sugerido pelo sistema.
Diferentemente do campo "Nome de Apresentação", esse campo não fica visível para o usuário. > Para que serve o campo Coluna Banco de dados (SQL)? Esse campo vai ser utilizado ao criar reports e dashboards. É através dele, que poderemos extrair informações e expor usando esses recursos do sistema. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) --- ### Origem dos Dados Como existe uma lista de opções pré-determinadas, é necessário definir a origem dos dados. #### Origem dos Itens São duas as possibilidades: **1. Lista Dinâmica** (Utilização recomendada) **:** Nessa opção, os dados têm como origem um outro formulário. Ao selecionar esse outro formulário, é necessário informar qual o campo desse formulário será exibido. **2. Lista Estática:** O usuário insere as opções nas configurações do campo. Com isso, o usuário que acessa o formulário não pode criar novas opções. Ao criar as opções, além do nome, é possível definir a ordem em que aparecerão na lista de seleção. Outra opção, é o Id Customizado (Banco de Dados). Essa opção, normalmente não precisa ser preenchido. Entretanto, em alguns casos, esse id pode ser customizado. Isso pode ser útil, para a criação de dashboard e reports, para montar mais facilmente as *queries*. #### **Configuração de uma Lista Dinâmica** Abaixo estão descritos os campos básicos de preenchimento para definição de uma lista dinâmica. Abra a tela de edição do campo e clique na aba **Origem dos Dados**  ##### **Campos para preenchimento:** ##### Origem dos dados Defina como "Lista Dinâmica" ##### Quando os dados serão carregados? Quando a lista é dinâmica, é possível definir algumas opções relativas ao carregamento da lista. Esse carregamento pode ocorrer de duas maneiras. **No carregamento inicial (On PageLoad):** Assim que o formulário é carregado, as opções da lista de seleção também são carregados imediatamente. **Na alteração do valor de um determinado campo (On Change):** As opções só serão carregadas quando um determinado campo mudar. Isso é útil, para uma lista de seleção selecionar níveis de outra lista de seleção. Ex: seleciona-se primeiro o estado e só depois, é selecionada a cidade. Esse campo Lista de Cidade, apenas é carregado quando o outro campo Lista de Estados é alterado. Para isso, é necessário também adicionar uma[ condição na base de dados](#h_50356803591550685996742). ##### Qual será a Base de dados É o formulário que servirá de fonte para a Lista Dinâmica. ##### Campo de apresentação (Base de dados) Essa é a informação que será apresentada para o usuário na apresentação do combo. Esse campo é referente ao formulário que foi selecionado no campo [Qual será a Base de dados](#h_695508394161550686141083). ##### Ordenar os itens pelo campo A ordenação padrão do itens do combo é alfabética. Entretanto há casos onde queremos alterar essa ordem. Para isso, podemos utilizar um segundo campo como critério de ordenação, que não o campo de exibição. Como exemplo, vamos usar um formulário que só tem o campo nome, e os seguintes dados?| **Prioridade** |
| Alta |
| Baixa |
| Média |
| **Prioridade** | **Ordem** |
| Alta | 3 |
| Baixa | 2 |
| Média | 1 |
O vídeo abaixo mostra a configuração da lista de seleção, mas também se aplica para o campo Lista aberta com escolha única (Radio). O processo de configuração e o comportamento é idêntico.
| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript Caso a customização desejada, não esteja disponível, ainda assim é possível programá-la utilizando javascript. Para mais detalhes, acesse o [capítulo](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/customiza%C3%A7%C3%A3o-javascript "Customização javascript") sobre essa opção. # Fórmula Com o campo de fórmula, é possível fazer cálculos com valores dos campos disponíveis no formulário, além de utilizar valores fixos na composição da fórmula. O campo de fórmula faz dois tipos de cálculos: com campos numéricos e com campos com data/hora. É na definição do campo que seleciona-se o tipo de cálculo. ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Coluna Banco de dados (SQL) Esse é o nome interno, usado pelo sistema, a ser criado no banco de dados do agilityflow. É uma informação técnica e esse campo é preenchido automaticamente pelo sistema.Na maioria dos casos, você não precisa alterar o nome sugerido pelo sistema.
Diferentemente do campo "Nome de Apresentação", esse campo não fica visível para o usuário. > Para que serve o campo Coluna Banco de dados (SQL)? Esse campo vai ser utilizado ao criar reports e dashboards. É através dele, que poderemos extrair informações e expor usando esses recursos do sistema. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) ### Máscara É a forma que o sistema utiliza para mostrar ao usuário, o conteúdo do campo de texto. Isso facilita a visualização da informação por parte do usuário. Por exemplo, é muito fácil ver o telefone "(11) 98765-4321" do que "11987654321". #### Tipo de máscara Existe uma série de máscaras disponíveis no agilityflow. ##### Número > Como criar um campo numérico? Um número não deixa de ser um texto. Portanto, para criar um campo numérico basta criar um campo textbox e aplicar uma máscara de número. - Tipo de Número - Inteiro: o campo não aceita "," ou "." no seu conteúdo. Ao digitar um desses símbolos, o sistema ignora a digitação. Por exemplo, digitando "1,5", o sistema ignora a vírgula e preenche "15". Caso o usuário cole o valor "1,5541", o sistema ignora a vírgula e o conteúdo à direita da vírgula, aceitando o valor "1". - Moeda (Real): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (1 casa decimal): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (2 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (3 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (4 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; - Decimal (5 casas decimais): coloca vírgula, deixando o campo com duas casas decimais; ### Definição da Fórmula São as configurações para os cálculos. #### Tipo de Cálculo Ao escolher o tipo, serão mostrados os campos disponíveis para serem usados. ##### Fórmula Numérica é possível fazer as 4 operações aritméticas (soma, subtração, divisão e multiplicação) nesse campo. Para isso, basta selecionar um ou mais campos com a máscara do tipo numérico e escrever a fórmula.Para fórmula com datas, só é possível fazer a operação de subtração.
#### Fórmula É a composição da fórmula. Basta começar a digitar o nome dos campos que estão mostrados logo abaixo e compor a fórmula. Esses campos são mostrados, de acordo com a máscara dos demais campos disponíveis do formulário. Além dos campos, é possível fazer a utilização dos operadores matemáticos. [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/composicao_formula.gif) ### Regras de Visibilidade e desativação Usando essas opções, é possível tornar um campo visível, invisível, ativo ou inativo, e definir quando uma dessas ações deve ocorrer. É possível adicionar várias regras para cada campo. #### Descrição É um texto que ajuda a identificar a regra que se está criando. Muito útil quando existem múltiplas regras. #### Ação ##### Visível O campo é mostrado na tela, caso esteja inserido para tal, nas configurações de tela. ##### Invisível O campo é não é mostrado na tela, mesmo que esteja inserido para tal, nas configurações de tela. #### A partir da etapa / Até a etapa Em formulários com etapas, é possível estabelecer que uma regra será aplicada em alguma(s) etapa(s). Para isso, basta selecionar as etapas nos campos "a partir da etapa" e "até a etapa", para definir em que momento do fluxo essa regra vai ser aplicada. #### Quando Define em que momento a ação deve acontecer. ##### Sempre É o padrão do formulário. ##### Condicional - Tipo de condição Para fazer um validação condicional, estão disponíveis as seguintes condições: - Se o campo: compara um campo com um valor, ou com outro campo. Abaixo, uma tabela com os operadores disponíveis para as comparações:| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript Caso a customização desejada, não esteja disponível, ainda assim é possível programá-la utilizando javascript. Para mais detalhes, acesse o [capítulo](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/customiza%C3%A7%C3%A3o-javascript "Customização javascript") sobre essa opção. # Campo com Múltipla Escolha Apesar do visual um pouco diferente, tem comportamento similar ao campo [checkbox](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/checkbox-%28%C3%BAnico%29 "Checkbox (Único)"), mas permite a escolha de mais de uma opção. ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Coluna Banco de dados (SQL) Esse é o nome interno, usado pelo sistema, a ser criado no banco de dados do agilityflow. É uma informação técnica e esse campo é preenchido automaticamente pelo sistema.Na maioria dos casos, você não precisa alterar o nome sugerido pelo sistema.
Diferentemente do campo "Nome de Apresentação", esse campo não fica visível para o usuário. > Para que serve o campo Coluna Banco de dados (SQL)? Esse campo vai ser utilizado ao criar reports e dashboards. É através dele, que poderemos extrair informações e expor usando esses recursos do sistema. ### Informações de ajuda Nesse campo é possível incluir um texto que ajudará o usuário a preenche-lo. Abaixo, um exemplo de dois campos: um campo sem informações de ajuda e outro com esse campo configurado: [](http://wiki.agilityflow.io/uploads/images/gallery/2019-02-Feb/informacoes_ajuda.gif) --- ### Origem dos Dados Como existe uma lista de opções pré-determinadas, é necessário definir a origem dos dados. #### Origem dos Itens São duas as possibilidades: **1. Lista Dinâmica** (Utilização recomendada) **:** Nessa opção, os dados têm como origem um outro formulário. Ao selecionar esse outro formulário, é necessário informar qual o campo desse formulário será exibido. **2. Lista Estática:** O usuário insere as opções nas configurações do campo. Com isso, o usuário que acessa o formulário não pode criar novas opções. Ao criar as opções, além do nome, é possível definir a ordem em que aparecerão na lista de seleção. Outra opção, é o Id Customizado (Banco de Dados). Essa opção, normalmente não precisa ser preenchido. Entretanto, em alguns casos, esse id pode ser customizado. Isso pode ser útil, para a criação de dashboard e reports, para montar mais facilmente as *queries*. #### **Configuração de uma Lista Dinâmica** Abaixo estão descritos os campos básicos de preenchimento para definição de uma lista dinâmica. Abra a tela de edição do campo e clique na aba **Origem dos Dados**  ##### **Campos para preenchimento:** ##### Origem dos dados Defina como "Lista Dinâmica" ##### Quando os dados serão carregados? Quando a lista é dinâmica, é possível definir algumas opções relativas ao carregamento da lista. Esse carregamento pode ocorrer de duas maneiras. **No carregamento inicial (On PageLoad):** Assim que o formulário é carregado, as opções da lista de seleção também são carregados imediatamente. **Na alteração do valor de um determinado campo (On Change):** As opções só serão carregadas quando um determinado campo mudar. Isso é útil, para uma lista de seleção selecionar níveis de outra lista de seleção. Ex: seleciona-se primeiro o estado e só depois, é selecionada a cidade. Esse campo Lista de Cidade, apenas é carregado quando o outro campo Lista de Estados é alterado. Para isso, é necessário também adicionar uma[ condição na base de dados](#h_50356803591550685996742). ##### Qual será a Base de dados É o formulário que servirá de fonte para a Lista Dinâmica. ##### Campo de apresentação (Base de dados) Essa é a informação que será apresentada para o usuário na apresentação do combo. Esse campo é referente ao formulário que foi selecionado no campo [Qual será a Base de dados](#h_695508394161550686141083). ##### Ordenar os itens pelo campo A ordenação padrão do itens do combo é alfabética. Entretanto há casos onde queremos alterar essa ordem. Para isso, podemos utilizar um segundo campo como critério de ordenação, que não o campo de exibição. Como exemplo, vamos usar um formulário que só tem o campo nome, e os seguintes dados?| **Prioridade** |
| Alta |
| Baixa |
| Média |
| **Prioridade** | **Ordem** |
| Alta | 3 |
| Baixa | 2 |
| Média | 1 |
O vídeo abaixo mostra a configuração da lista de seleção, mas também se aplica para o campo Campo com Múltipla Escolha. O processo de configuração e o comportamento é idêntico.
| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript Caso a customização desejada, não esteja disponível, ainda assim é possível programá-la utilizando javascript. Para mais detalhes, acesse o [capítulo](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/customiza%C3%A7%C3%A3o-javascript "Customização javascript") sobre essa opção. # Botão Customizado Caso seja necessário uma ação no formulário que não exista no agilityflow, é possível criar um botão. Esse botão, executa um código [javascript](#bkmrk-customiza%E3%A7%E3%A3o-javas) personalizado, que deve ser criado pelo usuário. Para a configuração desse campo, é necessário conhecimento de [javascript](#bkmrk-customiza%E3%A7%E3%A3o-javas), já que qualquer ação com esse botão é 100% customizada. ### Grupo de informações Dentro das configurações, é possível alterar o [grupo de informação](http://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/divis%C3%A3o-e-agrupamento-dos-campos "Divisão e agrupamento dos campos") ao qual o campo foi atribuído no momento da criação. ### Nome de Apresentação Mostra o nome de apresentação informado no momento da criação. Esse é o nome que será mostrado na tela para o usuário. ### Regras de Visibilidade e desativação Usando essas opções, é possível tornar um campo visível, invisível, ativo ou inativo, e definir quando uma dessas ações deve ocorrer. É possível adicionar várias regras para cada campo. #### Descrição É um texto que ajuda a identificar a regra que se está criando. Muito útil quando existem múltiplas regras. #### Ação ##### Ativar Deixa o campo disponível para inserção de dados. É o estado padrão do campo. ##### Inativar Deixa o campo indisponível para inserção de dados. ##### Visível O campo é mostrado na tela, caso esteja inserido para tal, nas configurações de tela. ##### Invisível O campo é não é mostrado na tela, mesmo que esteja inserido para tal, nas configurações de tela. #### A partir da etapa / Até a etapa Em formulários com etapas, é possível estabelecer que uma regra será aplicada em alguma(s) etapa(s). Para isso, basta selecionar as etapas nos campos "a partir da etapa" e "até a etapa", para definir em que momento do fluxo essa regra vai ser aplicada. #### Quando Define em que momento a ação deve acontecer. ##### Sempre É o padrão do formulário. ##### Condicional - Tipo de condição Para fazer um validação condicional, estão disponíveis as seguintes condições: - Se o campo: compara um campo com um valor, ou com outro campo. Abaixo, uma tabela com os operadores disponíveis para as comparações:| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. ### Customização Javascript A parte mais importante do botão customizado é a programação em javascript. É com ela que o botão será capaz de executar alguma ação no formulário. Com a customização em Javascript, as possibilidade são inúmeras. Qualquer que seja o código javascript, ele pode ser usado aqui. #### Exemplo de código > Posso abrir o WhatsApp pelo agilityflow? No exemplo abaixo, o botão customizado está configurado para abrir o WhatsApp Web e iniciar uma conversa com o número cadastrado no formulário. ```JavaScript var fone = $("#telefone").val(); if (fone !== null) fone = fone.replaceAll(/\(/,"").replaceAll(/\)/,"").replaceAll(/-/,"").replaceAll(/ /,""); window.open("https://web.whatsapp.com/send?phone="+fone); ``` ##### Explicando o código ```JavaScript var fone = $("#telefone").val(); ``` Obtém-se o valor do campo telefone, e o armazena na variável chamada *fone*. Note que esse nome é exatamente o nome definidos na configuração [Coluna Banco de dados (SQL)](http://wiki.agilityflow.io/link/38#bkmrk-%E2%A0-0 "Coluna Banco de dados (SQL)"). ```JavaScript if (fone !== null) fone = fone.replaceAll(/\(/,"").replaceAll(/\)/,"").replaceAll(/-/,"").replaceAll(/ /,""); ``` Nesse ponto, checa se o valor é nulo. Caso não seja, limpa o número, removendo parêntesis e hifens.Abre-se uma nova janela, passando o valor da variável *fone* na URL.
[](https://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/label-din%C3%A2mica/edit?content-id=bkmrk-ao-mudar-o-campo-de-&content-text=Ao%20mudar%20o%20campo%20de%20lista%20de%20sele%C3%A7%C3%A3o%2C%20a%20label%20din%C3%A2 "Editar conteúdo")
| **Comparação por valor** | **Comparação por outro campo** |
| For igual a | É igual ao campo |
| For maior ou igual a | É diferente do campo |
| For menor ou igual a | |
| For maior que | |
| For menor que | |
| For diferente de | |
| Conter | |
| Não conter |
É possível adicionar mais de um condição na mesma regra.
- Se é um novo formulário: regra será aplicada quando uma nova entrada no formulário estiver sendo criada. - Se é edição de formulário: regra será aplicada quando uma entrada no formulário estiver sendo alterada. # Programação Informações aprofundadas sobre o uso de JavaScript, C# e Query (SQL) no agilityflow. # SQL Server (Query) - Dicas e Funções (Versões Mais Antigas do Agilityflow)**IMPORTANTE**: Essa documentação é referente as versões antes de 2024 que são mais antigas do agilityflow e que utilizam o Banco de Dados **SQL SERVER.** O agilityflow nas últimas versões está utilizando **POSTGRESQL** .
No agilityflow você pode buscar os dados utilizando SQL, através de queries. As queries devem ser compatíveis com **SQL Server.** Além disso existem alguns padrões que você deve seguir para obter um melhor resultado no agilityflow. Abaixo estão alguns detalhes importantes. ### Tratamento de Registros Deletados**IMPORTANTE:** É de extrema importância o tratamento de registros deletados, usando as regras abaixo. Já está no nosso Roadmap o tratamento automático dos deletados, enquanto isso, o tratamento se torna obrigatório pelo desenvolvedor.
Para manter a integridade dos dados, o agilityflow nunca apaga um registro de uma tabela. Apenas o marca como deletado. Portanto, para qualquer query, é preciso excluir os deletados da lista. Essa marcação é feita com campo deletado. Se o valor for 0, significa que ele não foi deletado e está visível no sistema. Caso esteja 1, significa que o registro já foi excluído e não é possível mais vê-lo na listagem principal do sistema. **Exemplo 1, sem o tratamento de deletados:** ```SQL select usu_nome, usu_email from tbl_usuario ``` **Resultado**:  **Exemplo 2, com o tratamento de deletados:** ```SQL select usu_nome, usu_email from tbl_usuario where deletado = 0 ``` **Resultado**:  ### Campo do tipo Datetime (Data e Hora) Sempre que um campo de texto com máscara do tipo data é criado, o sistema cria uma cópia com o mesmo nome seguido de "**\_\_datetime\_\_**" essa informação é gravada em uma coluna no banco de dados do tipo **datetime**, ao invés de varchar. Esses campos são criados para facilitar o uso tipado do dado nas queries #### **Exemplo de campo Datetime** Por exemplo, se o campo se chama "data\_e\_hora", haverá um outro chamado "data\_e\_hora\_\_datetime\_\_" e o conteúdo estará no formato padrão do sql server, **YYYY-MM-DD hh:mm:ss** O campo "data\_e\_hora" estará sempre como varchar e o "data\_e\_hora\_\_datetime\_\_" estará como datetime  ### Campo do tipo Numérico (decimal, float, double, int, number) Sempre que um campo de texto com máscara do tipo número é criado, o sistema cria uma cópia com o mesmo nome seguido de "**\_\_number\_\_**" essa informação é gravada em uma coluna no banco de dados do tipo **numeric(18,6),** ao invés de varchar. Esses campos são criados para facilitar o uso tipado do dado nas queries #### **Exemplo de campo numérico** Por exemplo, se o campo se chama "numero\_exemplo", haverá um outro chamado "numero\_exemplo\_\_number\_\_" e o conteúdo estará no formato padrão do sql server. O campo "numero\_exemplo" estará sempre como varchar e o "numero\_exemplo\_\_number\_\_" estará como numeric(18,6)  ### Formatação de números #### Nome da Função `format(number,format,idioma)` ##### Parâmetro: **number** Pode ser um número inteiro ou um decimal ##### Parâmetro: **format** Aqui você passa a formatação que deve ser retornada: 'n0' = retorna o número sem nenhuma casa decimal 'n1' = retorna o número com 1 casa decimal 'n2' = retorna o número com 2 casas decimais 'n3' = retorna o número com 3 casas decimais 'n4' = retorna o número com 4 casas decimais 'n5' = retorna o número com 5 casas decimais 'n6' = retorna o número com 6 casas decimais ##### Parâmetro: **idioma** - **@sysCurrentLanguage** Aqui você precisa passar o idioma do usuário logado, pois alguns idiomas invertem o . (ponto) e a , (virgula) do número. O agilityflow guarda o idioma do usuário dentro da variável @sysCurrentLanguage então apenas passe no parâmetro esse variável. #### Exemplo de utilização Abaixo o número será formato para 5 casas decimais, no padrão do idioma do usuário logado. `select FORMAT(5800000.888, 'n5', @sysCurrentLanguage)` #### Retorno para o usuário que está logado no agilityflow em português ou espanhol| 5.800.000,88800 |
| 5,800,000.88800 |
**IMPORTANTE**: Essa documentação é referente as versões pós 2023 do agilityflow que utilizam o Banco de Dados **Postgresql.** O agilityflow nas últimas versões está utilizando **POSTGRESQL** .
No agilityflow você pode buscar os dados utilizando SQL, através de queries. As queries devem ser compatíveis com **SQL Server.** Além disso existem alguns padrões que você deve seguir para obter um melhor resultado no agilityflow. Abaixo estão alguns detalhes importantes. ### Tratamento de Registros Deletados**IMPORTANTE:** É de extrema importância o tratamento de registros deletados, usando as regras abaixo. Já está no nosso Roadmap o tratamento automático dos deletados, enquanto isso, o tratamento se torna obrigatório pelo desenvolvedor.
Para manter a integridade dos dados, o agilityflow nunca apaga um registro de uma tabela. Apenas o marca como deletado. Portanto, para qualquer query, é preciso excluir os deletados da lista. Essa marcação é feita com campo deletado. Se o valor for **FALSE**, significa que ele não foi deletado e está visível no sistema. Caso esteja **TRUE**, significa que o registro já foi excluído e não é possível mais vê-lo na listagem principal do sistema. **Exemplo 1, sem o tratamento de deletados:** ```SQL select usu_nome, usu_email from tbl_usuario ``` **Resultado**:  **Exemplo 2, com o tratamento de deletados:** ```SQL select usu_nome, usu_email from tbl_usuario where deletado = false ``` **Resultado**:  ### Campo do tipo Date, Timestamp e Datetime (Data e Hora) Sempre que um campo de texto com máscara do tipo data é criado, o sistema cria uma cópia com o mesmo nome seguido de "**\_\_datetime\_\_**" essa informação é gravada em uma coluna no banco de dados do tipo **"date"** quando for uma coluna sem hora ou "timestamp without time zone"** quando for uma coluna com hora , ao invés de varchar. Esses campos são criados para facilitar o uso tipado do dado nas queries #### **Exemplo de campo Datetime** Por exemplo, se o campo se chama "data\_e\_hora", haverá um outro chamado "data\_e\_hora\_\_datetime\_\_" e o conteúdo estará no formato padrão do sql server, **YYYY-MM-DD hh:mm:ss** O campo "data\_e\_hora" estará sempre como varchar e o "data\_e\_hora\_\_datetime\_\_" estará como timestamp **data\_e\_hora | data\_e\_hora\_\_datetime\_\_** 2027-01-31 23:5959 2027-01-31 23:5959 2027-01-31 23:5959 2027-01-31 23:5959 2027-01-31 23:5959 2027-01-31 23:5959 ### Campo do tipo Numérico (decimal, float, double, int, number) Sempre que um campo de texto com máscara do tipo número é criado, o sistema cria uma cópia com o mesmo nome seguido de "**\_\_number\_\_**" essa informação é gravada em uma coluna no banco de dados do tipo **numeric(18,6),** ao invés de varchar. Esses campos são criados para facilitar o uso tipado do dado nas queries #### **Exemplo de campo numérico** Por exemplo, se o campo se chama "numero\_exemplo", haverá um outro chamado "numero\_exemplo\_\_number\_\_" e o conteúdo estará no formato padrão do sql server. O campo "numero\_exemplo" estará sempre como varchar e o "numero\_exemplo\_\_number\_\_" estará como numeric(18,6) **numero\_exemplo | numero\_exemplo\_\_number\_\_** 999.99 999.99 123.89 123.89 ### Formatação de números #### Nome da Função `format_number(number,format,idioma)` ##### Parâmetro: **number** Pode ser um número inteiro ou um decimal ##### Parâmetro: **format** Aqui você passa a formatação que deve ser retornada: '0' = retorna o número sem nenhuma casa decimal '1' = retorna o número com 1 casa decimal '2' = retorna o número com 2 casas decimais '3' = retorna o número com 3 casas decimais '4' = retorna o número com 4 casas decimais '5' = retorna o número com 5 casas decimais '6' = retorna o número com 6 casas decimais ##### Parâmetro: **idioma** - **@sysCurrentLanguage** Aqui você precisa passar o idioma do usuário logado, pois alguns idiomas invertem o . (ponto) e a , (virgula) do número. O agilityflow guarda o idioma do usuário dentro da variável @sysCurrentLanguage então apenas passe no parâmetro esse variável. #### Exemplo de utilização Abaixo o número será formato para 5 casas decimais, no padrão do idioma do usuário logado. `select format_number(5800000.888, '5', @sysCurrentLanguage)` #### Retorno para o usuário que está logado no agilityflow em português ou espanhol| 5.800.000,88800 |
| 5,800,000.88800 |
IMPORTANTE: as variáveis e métodos descritos aqui só funcionarão na programação C# na **Regra de Negócio** do formulário. Para a programação C# nas **APIs** [clique aqui.](https://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/programa%C3%A7%C3%A3o-em-c---na-api-de-integra%C3%A7%C3%A3o "Programação em C# - Na API de integração")
O agilityflow permite a customização em C#, além de já disponibilizar diversas bibliotecas e funções para facilitar sua programação, incluindo acesso a dados, validações, envio de e-mail, notificação, entre outras. Abaixo mostramos alguns exemplos, se o material abaixo não for suficiente , entre em contato com nossa equipe. ##### C# - Propriedades| **Variável** | **Tipo** | |
| IsNovoFormulario | bool | retorna true, caso seja um novo formulário, e false caso contrário. |
| IdFormulario | Guid | retorna o ID do formulário |
| CurrentStatusFluxo | StatusFluxo? (Enum) | Variável disponível apenas para Workflow Nessa ENUM será retornado o Status do fluxo. As opções podem ser: - **StatusFluxo.Pendente -** Enquanto o fluxo ainda estiver pendente em alguma das etapas. - **StatusFluxo.Aprovado -** Depois do fluxo encerrado e completamente aprovado - **StatusFluxo.Reprovado -** Depois do fluxo encerrado e completamente reprovado Exemplo de utilização: `if(CurrentStatusFluxo == StatusFluxo.Aprovado){ //restante do código}` |
| (**deprecated)** FormularioCamposPreenchidos | (**deprecated)** dynamic (Json) | (**deprecated**: utilizar o método FormContext.GetValue descrito mais abaixo) retorna um json com os campos do preenchidos no formulário, exemplo: { "campo1": "xxxxx", "campo2": "yyyyy", "campo3": "zzzzz", } Para resgatar a informação do campo1, utilize: `var campo1 = FormularioCamposPreenchidos["campo1"];` |
| **Método** | **Retorno** | |
| **FormContext.SetValue(**string idCampo, string value) | void | Esse método preencherá um campo com um novo **Valor** (passado por paramêtro)
Para valores que são **Datas**, utilizar o padrão dd/MM/aaaa HH:mm:ss:
Exemplo: ***31/12/2010 22:55***
```C#
var data_e_hora = "31/01/2023 22:55";
FormContext.SetValue("data_e_hora",data_e_hora);
```
Para valores **Numéricos**, o número deve estar no formato com ponto no separador decimal e sem utilização de virgulas.
Exemplo para 2 milhões e 50 centavos**:**
***2000000.50***
```
var moeda = "2000000.50";
FormContext.SetValue("moeda",moeda);
```
[Veja exemplo](https://wiki.agilityflow.io/link/82#bkmrk-atualizar-um-outro-f)
|
| **FormContext**.**GetValue**(string idCampo) | string | Esse método retornará o **Valor** de um determinado campo |
| **FormContext.GetText(**string idCampo**)** | string | Esse método retornará o **Texto** de um determinado campo, utilizado apenas se o campo for um campo de **lista dinâmica**, exemplo: Combo, Auto complete, Campo de Múltipla escolha, radio etc. [Veja exemplo](#bkmrk-para-recuperar-o-tex) |
| **FormContext.GetInt**(string idColuna) | int? | Retorna o valor da coluna no tipo INT (inteiro), caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000 [Veja exemplo](https://wiki.agilityflow.io/link/82#bkmrk-atualizar-um-outro-f) |
| **FormContext.GetDecimal**(string idColuna) | decimal? | Retorna o valor da coluna no tipo Decimal, caso esse campo no formulário seja um número, se o valor for 10.000,99 Será retornado: 10000.99 [Veja exemplo](https://wiki.agilityflow.io/link/82#bkmrk-atualizar-um-outro-f) |
| **FormContext.GetDateTime**(string idColuna) | DateTime? | Retorna o valor da coluna no tipo DateTime para valores que estão no formato de data dd/MM/yyyy ou dd/MM/yyyy hh:mm [Veja exemplo](https://wiki.agilityflow.io/link/82#bkmrk-atualizar-um-outro-f) |
| **Método** | **Retorno** | |
| **FormContext**.**GetDrafJsontById**(string draftid) ou **FormContext**.**GetDrafJsontById**(Guid?draftid) | dynamic | ``` `var str_preco_de_venda = "";var str_quantidade = "";var temRascunho = false;var rascunho_json = PageContext.GetDraftJsontById(str_draftid);if(rascunho_json != null){ temRascunho = true; str_preco_de_venda = rascunho_json.preco_de_venda; str_quantidade = rascunho_json.quantidade;}` ``` |
| **Método** | **Retorno** | |
| **await FormContext**.**GetDataTableAsync**(string sql, params DbParameter\[\] parameters) | DataTable | Permite retornar informações dos bancos de dados através de uma query. [Veja exemplo](#bkmrk-recuperando-dados-do "Veja exemplo") |
| **Método** | **Retorno** | |
| **await FormContext.SaveEntityAsync**(Guid estruturaformularioid\_ASerCriadoOuAtualizado, DataDictionary campos\_e\_valores) | Guid | Salva (Insere e Atualiza) as informações de um formulário no bancos de dados. Para atualizar um registro, no parâmetro **campos\_e\_valores**, apenas adicione um parâmetro chamado "**id**" com o id do elemento que você deseja atualizar. Obs: Para cadastrar valores numéricos, o números devem estar no formato com ponto no separador decimal: 999999.99 sem utilização de virgulas. [Veja exemplo](https://wiki.agilityflow.io/link/82#bkmrk-salvando-os-dados-re "Veja exemplo") |
| **await FormContext.ApproveEntityAsync(**Guid estruturaformularioid\_ASerAprovado, DataDictionary campos\_e\_valores) | Guid | Avança uma etapa em um formulário com Workflow. As regras de usuário aprovador, permissão de aprovação e responsabilidade por uma etapa devem ser validadas antes desse método ser executado. Obs: Para cadastrar valores numéricos, o números devem estar no formato com ponto no separador decimal: 999999.99 sem utilização de virgulas. [Veja exemplo](https://wiki.agilityflow.io/link/82#bkmrk-aprovando-uma-etapa-) |
| **await FormContext.DeleteEntityAsync(Guid formularioid)** | void | Deletar um um registro |
| **Método** | **Retorno** | |
| **FormContext.WarningMessage**(string message) | void | Apresenta um aviso para o usuário [veja detalhes aqui](https://wiki.agilityflow.io/link/82#bkmrk-a-execu%E3%A7%E3%A3o-do-c%E3%B3d) |
| **Método** | **Retorno** | |
| **FormContext.**GetUsuarioLogadoNome(); | string | Nome Completo do usuário logado |
| **FormContext.**GetUsuarioLogadoPrimeiroNome(); | string | Primeiro nome do usuário logado |
| **FormContext.**GetUsuarioLogadoPrimeiroESegundoNome(); | string | Primeiro e Segundo nome do usuário logado |
| **FormContext.**GetUsuarioLogadoEmail(); | string | E-mail do usuário logado |
| **FormContext.**GetUsuarioLogadoId(); | Guid | Id do usuário logado |
| **Método** | **Retorno** | |
| **FormContext.GetEnvironmentVariable**(string nomeVariavel) ou **FormContext.GetEnvironmentVariable\_Text**(string nomeVariavel) \*\* | string | Recupera o Valor de uma variável de ambiente. \*\* Recupera a Descrição (texto), no caso de variáveis do Tipo "Query com Id + Descrição": |
***Se você está utilizando o método GetValue(..) para buscar o valor de um campo numérico, esse método já retornará o número formatado e não será necessário nenhuma formatação adicional. Se você está utilizando o método GetDecimal(..) ele não virá formatado pois ele retorna o tipo DECIMAL do C#, sendo assim, se você precisa do dado formatado você pode utilizar o GetText(..)***
| string **FormContext.FormatDecimalToString**(object numDecimal, string mascaraTipo = "dec2") | formata object 999999999.55 para o formato da mascara de acordo com o idioma. \- se for ingles, será 999,999,999.55 \- se for portugues, será 999.999.999,55 |
| string **FormContext.FormatNumberToString\_EnglishFormat**(object num, \[optional\]int? qtdCasasDecimais) | converte decimal para string, porém sempre a string vem no formato Inglês. coloca a a mesma qtd de casas decimais, caso o parâmetro qtdCasasDecimais estivar em branco |
| **Método** | **Retorno** | |
| **FormContext.Log**(string log, string logTipo) | void | Cria um log na tabela de log geral, o log pode ser consultado entrando na Área de Customização e clicando na opção "Log Geral >> consultar Log" |
| **Método** | **Retorno** | |
| **FormContext.GetUrlBase()** | Retorna a URL base da sua aplicação exemplo: [https://suaempresa.agilityflow.io/](https://suaempresa.agilityflow.io/) \*A url sempre virá com uma barra no final **/** |
Caso você queira atualizar informações do próprio formulário que está sendo salvo, utilize a função SetValue, descrita mais acima nos métodos da Classe FormContext
##### Aprovar um outro formulário através do método ApproveEntityAsync \* Para cadastrar valores numéricos, o números devem estar no formato com ponto no separador decimal: 999999.99 sem utilização de virgulas. ```C# //guarda em uma variável o ID da E S T R U T U R A do formulário de pessoa var idEstruturaFormulario_PESSOA = Guid.Parse("0b56b66a-4f6f-4ded-ad04-016d7c0724e1"); var values = new DataDictionary(); values.Add("nome", FormContext.GetValue("nome")); values.Add("email", FormContext.GetValue("email")); //salva a informação no banco de dados await FormContext.ApproveEntityAsync(idEstruturaFormulario_PESSOA, values); ``` ##### Salvando um outro formulário com Tabela Associativa através do método SaveEntityAsync \* Para cadastrar valores numéricos, o números devem estar no formato com ponto no separador decimal: 999999.99 sem utilização de virgulas. ```C# //guarda em uma variável o ID da E S T R U T U R A do formulário de pessoa var idEstruturaFormulario_PESSOA = Guid.Parse("0b56b66a-4f6f-4ded-ad04-016d7c0724e1"); var values = new DataDictionary(); values.Add("nome", json["nome"].ToString()); values.Add("email", json["email"].ToString()); //no caso do campo do formulário ser uma tabela associativa (tabela relacional N:N) var idCampoTabelaAssociativa = "70b6f362-2587-4fd2-a2fb-148bd0caf437"; //itens da tabela associativa que serão adicionados var idItem1 = "51cf02f1-3787-4dca-8a2c-e219a5ce1298"; var idItem2 = "f999f103-c775-4245-92d3-034cb3ded5e4"; var idItem3 = "XXXXf103-c775-4245-92d3-034cb3ded5e4"; var idItem4 = "YYYYf103-c775-4245-92d3-034cb3ded5e4"; var idsJuntos_ConcatenadosComVirgula = idItem1 + "," + idItem2 + "," + idItem3 + "," + idItem4 + ","; //adiciona values.Add(idCampoTabelaAssociativa, idItem1); //adiciona idItem1 values.Add(idCampoTabelaAssociativa, idItem2); //adiciona idItem2 values.Add(idCampoTabelaAssociativa, idItem3); //adiciona idItem3 values.Add(idCampoTabelaAssociativa, idItem4); //adiciona idItem4 values.Add("tabela_associativa_added-"+idCampoTabelaAssociativa,idsJuntos_ConcatenadosComVirgula);// itens concatenados com virgula values.Add("tabela_associativa_removed-"+idCampoTabelaAssociativa,"");//em branco values.Add("tabela_associativa_colunas_adicionais-"+idCampoTabelaAssociativa,"");//em branco //--------------------------------------- //salva a informação no banco de dados await FormContext.SaveEntityAsync(idEstruturaFormulario_PESSOA, values); ``` ##### Para recuperar o Texto de um campo que seja uma Lista Dinâmica (Combo, Auto completar, Múltipla seleção, Radio): Suponhamos que você tenha um formulário de Pedido e nesse formulário você tenha um campo chamado 'Produto'. Esse campo é do tipo 'Pesquisa com Auto Completar' e listará os 'Produtos' por 'Nome'. Quando o usuário salvar o formulário, no Json de envio não retornará o Nome do Produto, apenas o Id do produto selecionado (Esse id estará no formato de um GUID). Para recuperar o Nome do produto, você precisará executar o método **GetText** da seguinte forma: ```C# var nomeProduto = FormContext.GetText("produto"); ``` ##### Recuperar os valores das "Variáveis de Ambiente" Para saber mais sobre variáveis de ambiente entre em [Variáveis de ambiente](https://wiki.agilityflow.io/link/88#bkmrk-page-title) ```JavaScript var valorDaVariavel = FormContext.GetEnvironmentVariable("var_nomeDaVariavel"); ``` Recuperar a Descrição (texto), no caso de variáveis do Tipo "Query com Id + Descrição": ```JavaScript var textDaVariavel = FormContext.GetEnvironmentVariable_Text("var_nomeDaVariavel"); ``` ##### Enviar Mensagem para o usuário: A execução do código abaixo apresentará uma mensagem para o usuário ```C# FormContext.WarningMessage("Exemplo de mensagem para o usuário"); ```O código C# se encerrará no exato momento em que for chamado o método para apresentação de mensagem.
Retorno da mensagem  #### Envio de e-mail Responsável pelo envio de e-mail| **Método** | **Retorno** | |
| **EmailSender.SendToGrupoUsuario**(Guid grupoUsuarioId, string subject, string htmlContent) | void | Enviar um e-mail para um determinado Grupo de Usuario |
| **EmailSender.SendEmail**(string toEmail, string subject, string htmlContent) | void | Enviar um e-mail |
| **EmailSender.SendEmail**(string toEmail, string subject, string htmlContent, string ccEmail**)** | void | Enviar um e-mail, com copia (CC) |
Teste para envio de e-mail para um Grupo de Usuário no AgilityFlow!"; EmailSender.SendToGrupoUsuario(grupoUsuarioId, assunto, html); ``` ##### Enviar e-mail ```C# var htmlContent = "Olá, teste envio de e-mail."; var emailTo = "john@email.com"; var subject = "Subject do E-mail"; EmailSender.SendEmail(emailTo, subject, htmlContent); ``` # Programação em C# - Na API de integração (POST) As informações descritas abaixo referem-se as APIs de **POST**
IMPORTANTE: as variáveis e métodos descritos aqui só funcionarão na programação C# na **API de integração**. Para a programação C# nas Regras de Negócio de um formulário [clique aqui](https://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/programa%C3%A7%C3%A3o-em-c---na-regra-de-neg%C3%B3cio "Programação em C# - Na Regra de Negócio")
O agilityflow permite a customização da API em C#, além de já disponibilizar diversas bibliotecas e funções para facilitar sua programação, incluindo acesso a dados, validações, envio de e-mail, notificação, entre outras.Para cada requisição na API é criada uma transação de banco de dados, essa transação é única em toda execução da API e é gerenciada automaticamente pelo Agilityflow, caso você prefira, você pode fazer esse gerenciamento seguindo esses passos, [veja mais detalhes aqui](https://wiki.agilityflow.io/link/90#bkmrk-%E2%A0-15)
Abaixo mostramos alguns exemplos, se o material abaixo não for suficiente , entre em contato com nossa equipe. #### Variáveis disponíveis| **Variável** | **Tipo** | |
| content | string | Conteúdo enviado no Body da API
No caso se ser enviado uma string com o JSON, por exemplo no formato:
{ nome: 'José', email: 'jose@xxxx.com'}
Você pode converter essa string para JSON e utilizá-la como object
`var json = Newtonsoft.Json.JsonConvert.DeserializeObject |
| **Método** | **Retorno** | |
| **HasProperty**(dynamic json, string nomePropriedade) | bool (true or false) | Testa se o JSON tem uma determinada propriedade. Por exemplo, a sua API espera receber o JSON no formato: { nome: 'José', email: 'jose@xxxx.com'} Porém recebe o JSON formato: { nomecompleto: 'José da Silva', idade: '21'} Como a propriedade NOME e EMAIL não existem no JSON recebido, o seu programa pode dar erro. Para evitar o erro, utilize o método HasProperty(...) Como no exemplo abaixo: `if (json != null)` `{` `if (JsonHelper.HasProperty(json, "nome") && JsonHelper.HasProperty(json, "email") ){` `var nome = json["nome"].ToString();` `var email= json["email"].ToString();` `}` `}` |
| `Newtonsoft.Json.JsonConvert.DeserializeObject | dynamic | converte o conteúdo string para json
`var content = "{ nome: 'José', email: 'jose@xxxx.com'}";`
`var json = Newtonsoft.Json.JsonConvert.DeserializeObject |
| **Método** | **Retorno** | |
| **await ApiContext.GetDataTableAsync**(string sql, params DbParameter\[\] parameters) | DataTable | Recuperar informações dos bancos de dados através de uma query sql. [Veja exemplo](https://wiki.agilityflow.io/link/90#bkmrk-recuperando-dados-do "Veja exemplo") |
| **await ApiContext.SaveEntityAsync**(Guid estruturaformularioid\_ASerCriadoOuAtualizado, DataDictionary campos\_e\_valores) | Guid | Salva as informações de um formulário no bancos de dados. Obs: Para cadastrar valores numéricos, o números devem estar no formato com ponto no separador decimal: 999999.99 sem utilização de virgulas. Caso seja necessário, utilizar o .ToString() para formatar um campo decimal, não use. Utilize a conversão usando o string.Format, como no exemplo abaixo: `string.Format(new System.Globalization.CultureInfo("en-gb"), "{0:F2}", json["valor"]);` [Veja exemplo](https://wiki.agilityflow.io/link/90#bkmrk-salvando-os-dados-re "Veja exemplo") |
| **await ApiContext.ApproveEntityAsync**(Guid estruturaformularioid\_ASerAprovado, DataDictionary campos\_e\_valores) | Guid | Avança uma etapa em um formulário com Workflow. As regras de usuário aprovador, permissão de aprovação e responsabilidade por uma etapa devem ser validadas antes desse método ser executado. Obs: Para cadastrar valores numéricos, o números devem estar no formato com ponto no separador decimal: 999999.99 sem utilização de virgulas. Caso seja necessário, utilizar o .ToString() para formatar um campo decimal, não use. Utilize a conversão usando o string.Format, como no exemplo abaixo: `string.Format(new System.Globalization.CultureInfo("en-gb"), "{0:F2}", json["valor"]);` [Veja exemplo](https://wiki.agilityflow.io/link/90#bkmrk-aprovando-uma-etapa-) |
| **await ApiContext.DeleteEntityAsync(Guid formularioId)** | void | deletar um formulario |
| **ApiContext.GetEnvironmentVariable**(string nomeVariavel) ou **ApiContext.GetEnvironmentVariable\_Text**(string nomeVariavel) \*\* | string | Recupera o Valor de uma variável de ambiente. \*\* Recupera a Descrição (texto), no caso de variáveis do Tipo "Que |
| **await ApiContext.LogAsync(string log, string logTipo)** | void | Cria um log na tabela de log geral, o log pode ser consultado entrando na Área de Customização e clicando na opção "Log Geral >> consultar Log" \*\* Além do Log Padrão da API que o sistema gera, você pode gerar esses Logs customizados para o seu próprio controle. |
| **await ApiContext.DbTransaction\_BeginTransactionAsync()** **await ApiContext.DbTransaction\_CommitAsync()** **await ApiContext.DbTransaction\_RollbackAsync()** | void | Para gerenciar a transação de banco de dados manualmente. Leia os detalhes [aqui mais abaixo ](https://wiki.agilityflow.io/link/90#bkmrk-%E2%A0-15) |
| **ApiContext.GetUrlBase()** | void | Retorna a URL base da sua aplicação exemplo: [https://suaempresa.agilityflow.io/](https://suaempresa.agilityflow.io/) \*A url sempre virá com uma barra no final **/** |
| **Método** | **Retorno** | |
| **EmailSender.SendToGrupoUsuario**(Guid grupoUsuarioId, string subject, string htmlContent) | void | Enviar um e-mail para um determinado Grupo de Usuario |
| **EmailSender.SendEmail**(string toEmail, string subject, string htmlContent) | void | Enviar um e-mail |
| **EmailSender.SendEmail(**string toEmail, string subject, string htmlContent, string ccEmail) | void | Enviar um e-mail, com copia (CC) |
Teste para envio de e-mail para um Grupo de Usuário no AgilityFlow!"; EmailSender.SendToGrupoUsuario(grupoUsuarioId, assunto, html); ``` ##### Enviar e-mail ```C# var htmlContent = "Olá, teste envio de e-mail."; var emailTo = "john@email.com"; var subject = "Subject do E-mail"; EmailSender.SendEmail(emailTo, subject, htmlContent); ``` #### Método principal para utilização da Programação em C# na api de post A única regra é que o método se chame Execute, não tenha parâmetros de entrada e o retorno seja void. Exemplo: ```C# public void Execute(){ //aqui você pode programar } ``` #### Gerenciar as transações de Banco de dados manualmente Caso você escolha por gerenciar as transactions de banco de dados manualmente, você precisará obrigatoriamente utilizar as 3 funções abaixo:
Atenção: Configuração recomendada apenas para especialista.
1. **ApiContext.DbTransaction\_BeginTransaction()** Para abrir uma transação, antes de iniciar as alterações no banco de dados 2. **ApiContext.DbTransaction\_Commit()** Para finalizar e confirmar com sucesso as alterações no banco de dados 3. **ApiContext.DbTransaction\_Rollback()** Para finalizar e desfazer as alterações no banco de dados Exemplo de uso:Atenção: Utilize as transactions sempre dentro de TRY e CATCH
Podem ser abertas uma ou mais transações na mesma API. Você ficará responsável por todas as aberturas e encerramentos das transações criadas.
```C# public async Task RunAsync(){ //converte o conteúdo enviado no body da API para JSON var json = Newtonsoft.Json.JsonConvert.DeserializeObject**Recomendação importante:** Após finalizar a configuração do AD no Agilityflow. Faça o teste em uma guia anônima do seu navegador antes de fazer o logout da sua sessão atual do Agilityflow. Assim você conseguirá fazer as mudanças necessárias no Agilityflow caso sua configuração não esteja correta. Caso você faça o logout, entre em contato conosco para auxiliarmos no passo a passo.
### Pré-requisitos - Uma instância do Active Directory instalada no seu servidor. Você pode seguir as etapas fornecidas [neste artigo](https://docs.microsoft.com/pt-br/windows-server/identity/ad-ds/deploy/install-active-directory-domain-services--level-100-) para configurar e instalar o AD no seu servidor - Garantir que todos os usuários do AD tenham o atributo de endereço de e-mail preenchido. O Agilityflow utiliza o **e-mail** e o **login** do usuário como identificador para autenticação. Portanto, além do login, é necessário que o usuário tenha o endereço de e-mail preenchido no Active Directory. Caso você receba do Agilityflow a mensagem “**O usuário 'xxxx' não tem o e-mail cadastrado no AD.** ”, verifique se o endereço de e-mail está configurado para esse usuário no Active Directory, se não estiver, fale com o seu administrador de rede. Abaixo estão descritos os procedimentos para configuração do e-mail do usuário no AD. Para preencher o e-mail do usuário no AD: acesse o seu Active Directory, no painel esquerdo clique em **Users**, agora no painel da direita, clique com o botão direito no usuário que deseja alterar o e-mail, clique em "**Properties**" e no campo "**E-mail**" inclua o e-mail do usuário. As imagens abaixo ilustram esse passo a passo: Selecione o usuário:  Altere o e-mail:  Clique em OK e o e-mail estará incluído nesse usuário. Esse procedimento será necessário para todos os usuários que não estão com e-mail configurado no AD. #### PASSO 1: Instalando o Internet Information Services (IIS) O Internet Information Server (Gerenciador do IIS) deve ser configurado no seu Windows Server para hospedar o arquivo de script ASP Clássico, que acessará as informações do usuário no Active Directory.O IIS Server deve estar instalado no mesmo domínio do Active Directory que contém os usuários.
Você pode seguir as etapas fornecidas [neste artigo](https://docs.microsoft.com/en-us/iis/get-started/whats-new-in-iis-8/installing-iis-8-on-windows-server-2012) para instalar o IIS no Windows Server 2012. Escolha as opções a seguir ao instalar a função IIS no servidor. - **Web Server (IIS)** - **Security** - **Windows Authentication** - **Application Development** - **ASP** - **Management Tools** - **IIS Management Console** Você precisa do **Windows Authentication** e também do **ASP** no seu servidor para hospedar e rodar o script ASP clássico que forneceremos a seguir e que será o responsável pelo login dos usuários do Active Directory no Agilityflow. Portanto, se você já instalou o IIS, verifique se esses recursos estão instalados. #### PASSO 2: Editando o arquivo de script ASP clássico 1\. Baixe os arquivos default.asp e config.asp que estão disponíveis na área de configuração do seu ambiente no agilityflow. Os arquivos para download você encontra nesse link: [https://<SEU\_AMBIENTE>.agilityflow.io/configuration](https://**Recomendação importante:** Após finalizar a configuração do AD no Agilityflow. Faça o teste em uma guia anônima do seu navegador antes de fazer o logout da sua sessão atual do Agilityflow. Assim você conseguirá fazer as mudanças necessárias no Agilityflow caso sua configuração não esteja correta. Caso você faça o logout, entre em contato conosco para auxiliarmos no passo a passo.
# Configurar integração com o ADFS (Active Directory Federation Services) O agilityflow oferece suporte Single Sign-on (SSO) por meio do SAML 2.0. O ADFS é um serviço fornecido pela Microsoft como uma função padrão do Windows Server que fornece um login da Web usando as credenciais existentes do Active Directory. Com essa configuração você pode utilizar os seus usuários do Active Directory para login no agilityflow, assim o usuário da rede será usado no single sign-on do agilityflow.**Recomendação importante:** Após finalizar a configuração do ADFS no agilityflow. Faça o teste em uma guia anônima do seu navegador antes de fazer o logout da sua sessão atual do agilityflow. Assim você conseguirá fazer as mudanças necessárias no agilityflow caso sua configuração não esteja correta. Caso você faça o logout, entre em contato conosco para auxiliarmos no passo a passo.
### Pré-requisitos 1. Uma instância do Active Directory instalada no seu servidor. Você pode seguir as etapas fornecidas [neste artigo](https://docs.microsoft.com/pt-br/windows-server/identity/ad-ds/deploy/install-active-directory-domain-services--level-100-) para configurar e instalar o AD no seu servidor. 2. Uma instância do ADFS instalada no seu servidor. Você pode seguir as etapas fornecidas [neste artigo](https://docs.microsoft.com/en-us/previous-versions/dynamicscrm-2016/deployment-administrators-guide/gg188612(v=crm.8)) para configurar e instalar o ADFS no seu servidor 3. Garantir que todos os usuários do AD tenham o atributo de endereço de e-mail preenchido. O agilityflow utiliza o **e-mail** e o **login** do usuário como identificador para autenticação. Portanto, além do login, é necessário que o usuário tenha o endereço de e-mail preenchido no Active Directory. Então, caso você receba do agilityflow a mensagem “**O usuário 'xxxx' não tem o e-mail cadastrado no AD.** ”, verifique se o endereço de e-mail está configurado para esse usuário no Active Directory, se não estiver, fale com o seu administrador de rede. Abaixo estão descritos os procedimentos para configuração do e-mail do usuário no AD. Para preencher o e-mail do usuário no AD: acesse o seu Active Directory, no painel esquerdo clique em **Users**, agora no painel da direita, clique com o botão direito no usuário que deseja alterar o e-mail, clique em "**Properties**" e no campo "**E-mail**" inclua o e-mail do usuário. As imagens abaixo ilustram esse passo a passo: Selecione o usuário:  Altere o e-mail:  Clique em OK e o e-mail estará incluído nesse usuário. Esse procedimento será necessário para todos os usuários que não estão com e-mail configurado no AD. ### PASSO 1: Configurar o ADFS Neste ponto, você deve estar pronto para configurar a conexão do ADFS com sua conta do agilityflow. A conexão entre o ADFS e o agilityflow é definida usando um Relying Party Trust (RPT). Abra o **AD FS Management**, no menu da esquerda, abra a guia **Trust Relationships**, clique com o botão direito em **Relying Party Trusts** e então clique em **Add Relying Party Trust**  1\. Isso inicia o assistente de configuração do Relying Party Trust. Clique em **Start**.  2\. No passo **Select Data Source**, selecione a última opção: **Enter Data About the Party Manually.**  3\. No passo **Specify Display Name**, insira um nome para esse Relying Party Trust. Informe o nome **agilityflow**.  4\. No passo **Choose Profile**, mantenha a opção **ADFS FS profile**  5\. No passo **Configure Certificate**, mantenha as configurações da forma que estão e clique em **Next**.  6\. No passo **Configure URL**, marque a opção **Enable support for the SAML 2.0 WebSSO protocol** e em **Relying party SAML 2.0 SSO service URL** informe **https://<SEU\_AMBIENTE>.agilityflow.io/adfs/**  7\. No passo **Configure identifiers** informe **https://<SEU\_AMBIENTE>.agilityflow.io/adfs/** em **Relying party trust identifier** e clique em **Add**, na sequencia, clique em **Next.**  8\. No passo **Configure Multi-factor Authentication Now?**, mantenha as configurações da forma que estão e clique em **Next.**  9\. No passo **Choose Issuance Authorization Rules**, mantenha a opção **Permit all users to access the relying party** marcada e clique em **Next.**  10\. No passo **Ready to Add Trust,** mantenha as configurações da forma que estão e clique em **Next.**  11\. No passo **Finish,** mantenha marcada a opção **Open the Edit Claim Rules dialog for this relying party trust when the wizard closes** e clique em **Close**;  12\. Na nova janela que abrirá, clique em **Add rule**  13\. No passo **Choose Rule Type,** no campo **Claim rule Template** selecione a opção **Send LDAP Attributes as Claims** e clique em **Next.**  14\. No passo **Configura Claim Rule** preencha da seguinte forma: Em **Claim rule name** informe "**LDAP E-mail, Username".** Em **Attribute store** selecione **Active Directory.** Na tabela **Mapping of LDAP attributes to outgoing claim types** preencha da seguinte forma:| **LDAP Attribute** | **Outgoing claim type** |
| SAM-Account-Name | Name ID |
| E-Mail-Addresses | E-Mail Address |
**Recomendação importante:** Após finalizar a configuração do ADFS no agilityflow. Faça o teste em uma guia anônima do seu navegador antes de fazer o logout da sua sessão atual do agilityflow. Assim você conseguirá fazer as mudanças necessárias no agilityflow caso sua configuração não esteja correta. Caso você faça o logout, entre em contato conosco para auxiliarmos no passo a passo.
Acesse via browser a sua instância do agilityflow. 1. Vá para o menu Customizar agilityflow → Single Sign-On, AD e ADFS, será aberta a seguinte tela: 2. Na aba "**Autenticação de usuário (Login) / Single Sign-On"** no campo **Tipo de Autenticação** selecione **"ADFS"** 3. No campo "**URL para realizar o login**" - Digite a URL do seu servidor ADFS que o agilityflow chamará quando os usuários tentarem fazer login. Essa URL geralmente termina em **IdpInitiatedSignOn.aspx**. Por exemplo, se o link de início for **https://www.seudominio.com/adfs/ls/**, a página de login será ****https://www.seudominio.com/adfs/ls/IdpInitiatedSignOn.aspx.**** 4. No campo "**Url para realizar o logoff**" insira a mesma URL que você inseriu no campo "**Trusted URL**", [descrito aqui nesse tópico ](http://wiki.agilityflow.io/link/83#bkmrk-em%E2%A0endpoint-type%E2%A0e)essa é a URL que o agilityflow chamará para o usuário fazer logout do ADFS. Essa URL geralmente termina em "**?wa=wsignout1.0**". Por exemplo, se o link de início for **https://www.seudominio.com/adfs/ls**, a página de logout será ****[https://www.seudominio.com/adfs/ls?wa=wsignout1.0](https://www.seudominio.com/adfs/ls?wa=wsignout1.0)**** 5. Para o preenchimento do campo **Certificado (X. 509),** você precisará voltar ao seu servidor ADFS e seguir o seguintes passos: 1. Abra o seu Windows Server, abra **Administrative Tools** no menu Iniciar do Windows ou em **Control Panel** e abra o aplicativo **AD FS Management.** 2. No menu da esquerda, abra a guia **Service** → **Certificates** 3. No painel da direita, clique duas vezes no certificado Token-signing que você deseja usar.  4. Clique na aba **Details** e clique em **Copy to File**  5. Clique em **Next** no assistente de exportação e selecione a opção **Base-64 encoded** **X.509 (.CER)**  6. Salve o arquivo de certificado em seu sistema de arquivos local 7. Abra o certificado que você acabou de salvar em um editor de texto. 8. Apague do conteúdo do certificado as linhas inicias e linhas finais Linha inicial para apagar **"-----BEGIN CERTIFICATE-----"** Linha final para apagar **"-----END CERTIFICATE-----"** Essas informações não podem constar no campo **Certificado (X. 509)** do agilityflow 9. Depois de apagar as duas linhas citadas acima, copie o conteúdo desse certificado que deve ser algo como esse abaixo: 10. Agora volte na sua instância do agilityflow e cole o conteúdo desse certificado no campo de texto ****Certificado (X. 509).****  Salve e pronto, as configurações foram finalizadas. Se você enfrentar algum problema durante a configuração, entre em contato conosco.**Recomendação importante:** Após finalizar a configuração do ADFS no agilityflow. Faça o teste em uma guia anônima do seu navegador antes de fazer o logout da sua sessão atual do agilityflow. Assim você conseguirá fazer as mudanças necessárias no agilityflow caso sua configuração não esteja correta. Caso você faça o logout, entre em contato conosco para auxiliarmos no passo a passo.
# Outras Dicas # Buscar o CEP nos Correios e preencher os campos de endereço automaticamente Para facilitar o preenchimento dos campos de endereço é possível configurar para que o campo de CEP dispare uma consulta na base dos Correios e preencha os campos de endereço. #### Informações que são possíveis preencher automaticamente através do CEP: - Rua, - Bairro, - Cidade, - Estado, - Sigla do Estado, - DDD da região, - Número De - Até (Intervalo numérico da região) ### Configuração: 1\. Através do menu principal do sistema, entre na área de customização e configuração do Agilityflow 2\. Na área de customização, edite o formulário que deseja configurar a busca pelo CEP 3\. Já dentro do formulário acesse a área de customização em Javascript, como na imagem abaixo   4\. Cole a função Javascript e altere apenas os parâmetros que estão **em amarelo** no código abaixo. Na tabela um pouco mais abaixo os parâmetros estão descritos com mais detalhes ```JavaScript formContext.buscaCEP.configurar( 'id_campo_cep', { uf_sigla: 'id_do_campo_uf_sigla', uf_nome: 'id_do_campo_uf_nome', logradouro: 'id_do_campo_logradouro', bairro: 'id_do_campo_bairro', cidade: 'id_do_campo_cidade', numero_de_ate: 'id_do_campo_numero_de_ate', ddd_da_regiao: 'id_do_campo_ddd_da_regiao' } ); ``` Parâmetros da função| **Parametro** | **Retorno de exemplo** | ||
| "**id\_campo\_cep**" | obrigatório | Esse é o **campo principal**, troque esse parâmetro pelo id do campo que será digitado o CEP | |
| uf\_sigla | pode estar em branco | Troque esse parâmetro pelo id do campo que deve ser preenchido a **SIGLA do Estado** | SP |
| uf\_nome | pode estar em branco | Troque esse parâmetro pelo id do campo que deve ser preenchido com o nome completo do **Estado** | São Paulo |
| logradouro | pode estar em branco | Troque esse parâmetro pelo id do campo que deve ser preenchido com o **Logradouro (Avenida, Rua etc..)** | Avenida Paulista |
| bairro | pode estar em branco | Troque esse parâmetro pelo id do campo que deve ser preenchido com o **Bairro** | Bela Vista |
| cidade | pode estar em branco | Troque esse parâmetro pelo id do campo que deve ser preenchido com a **Cidade** | São Paulo |
| numero\_de\_ate | pode estar em branco | Troque esse parâmetro pelo id do campo que deve ser preenchido com a **Número** **Importante**: esse campo não deve ter máscara numérica, pois ele retorna um intervalo De XXX até YYY | de 1047 a 1865 - lado ímpar |
| ddd\_da\_regiao | pode estar em branco | Troque esse parâmetro pelo id do campo que deve ser preenchido com o **DDD** da região, por exemplo, no caso de São Paulo, ele retornará 11 | 11 |
**Importante:** o agilityflow não remove nenhum contato da sua lista do Google Contatos e não atualiza nenhum contato que não tenha sido gerado pela nossa base de dado
# Bulk Update - Atualização de dados em Massa Com o exemplo abaixo é possível atualizar varios dados de um ou mais forms com apenas 1 clique. ##### Criar um form com as informações que estarão no **Where** do Bulk Update e também os campos que deverão ser atualizados. Exemplo:  ##### Criar uma regra de negócio ao "Salvar" da seguinte forma:  ##### Abaixo está o código C# para colocar no item de programação da Regra de Negócio(acima) responsável por executar o Bulk Update (Atualização em massa):**IMPORTANTÍSSIMO**: os scripts do SqlScript, atualizam o registro na RAIZ, isso é, **direto no banco de dados**, sendo assim, não executa nenhuma trigger, regra de negocio, controle de alteração, log de alteração etc.. que esteja vinculado(a) aos dados que estão sendo atualizados. **TENHA CUIDADO.**
**ATENÇÃO**: as informações dos formulários são sempre gravados em 2 tabelas. (1) tbl\_formulario e (2) a tabela "oficial" de cada estrutura de formulário, então é OBRIGATÓRIO, atualizar os dados nas 2 estruturas conforme exemplo abaixo. Na tbl\_formulario é criado um JSON com todos os dados, então o que vc precisa atualizar é a propriedade dentro do json do formulario que fica na coluna tbl\_formulario **frm\_json (o exemplo abaixo mostra como fazer essa atualização)**
```C# public async Task ExecuteAsync() { var where_status = FormContext.GetValue("where_status"); var organization = FormContext.GetValue("organization"); var update_to_status = FormContext.GetValue("update_to_status"); var update_to_substatus = FormContext.GetValue("update_to_substatus"); /* * O AgilityFlow grava todas as informações em JSON na tabela TBL_FORMULARIO * e também grava na tabela única da entidade. * Para fazer o bulk update, é necessário atualizar as 2 tabelas. * Importante também registrar que esse procedimento não executará nenhuma regra de negócio da aplicação. */ // SQL update para atualizar o JSON na tbl_formulario var sql_tbl_form = @$" UPDATE tbl_formulario SET frm_json = jsonb_set( jsonb_set(frm_json::jsonb, '{{status}}', to_jsonb(@update_to_status)), '{{sub_status}}', to_jsonb(@update_to_substatus) ) WHERE frm_id IN ( SELECT id FROM x_tbl_message_queue WHERE organization = @organization AND status = @where_status );"; // SQL update para atualizar na tabela única da entidade var sql_tbl_message = @$" UPDATE x_tbl_message_queue SET status = @update_to_status, sub_status = @update_to_substatus WHERE organization = @organization AND status = @where_status;"; var sql = $"{sql_tbl_form} {sql_tbl_message}"; // Criando os parâmetros explicitamente var parameters = new DbParameter[] { new NpgsqlParameter("@update_to_status", update_to_status), new NpgsqlParameter("@update_to_substatus", update_to_substatus), new NpgsqlParameter("@organization", organization), new NpgsqlParameter("@where_status", where_status) }; await FormContext.SqlScript.ExecuteAsync(sql, parameters); } ``` # Timezone (Fuso Horario do sistema)A plataforma pode ser configurada para visualizar as **horas em qualquer Timezone**
O **servidor** está configurado **SEMPRE** para **UTC**. O **banco de dados** grava todas as informações **SEMPRE** como **UTC**. A plataforma pode ser configurada para visualizar as horas em qualquer Timezone (a nível de tenant). Cada usuario pode ter o seu próprio Timezone para visualizaão dos dados e a plataforma também terá um timezone padrão. Por exemplo. Se sua equipe está em São Paulo - Brasil e outra em NY - Estados Unidos, vc pode configurar uma timezone padrão para a plataforma, exemplo, America/Sao\_Paulo e também pode configurar para que cada usuario visualize a hora de acordo com sua localidade. Independente da forma que visualizará a informação será salva no banco de dados como UTC. Importante dizer é que no **C#**, em caso de uso do `DateTime.Now` ou derivados. A data sempre estará em UTC. Para converter, use a extensão `.ToUserTimeZone` Exemplo: ```C# //exemplo: retorna 22/07/2024 22:37:00 var utcDate = DateTime.Now; //exemplo: caso o TimeZone do user seja America/Sao_Paulo (-3) retornaria 22/07/2024 19:37:00 var userTimezoneDate = DateTime.Now.ToUserTimeZone(); ``` #### Api e Api UserNas execuções de API sempre prevalecerá o Timezone definido no momento do cadastrado no User API
Em caso de Api, você pode definir o Timezone da execução no cadastro do **Usuario de API,** será esse timezone que o sistema considerará ao executar uma API **Acesse o Cadastro de Usuário de Api (Api User) e defina o timezone como na imagem abaixo:**  #### Programação na API com C# (Custom code) Na Api **C#**, em caso de uso do `DateTime.Now` ou derivados. A data sempre estará em UTC. Para converter para a Timezone do User que está executando a API, utilize a extensão `.ToUserTimeZone` como no exemplo abaixo. ```C# //exemplo: retorna 22/07/2024 22:37:00 var utcDate = DateTime.Now; //exemplo: caso o TimeZone do user seja America/Sao_Paulo (-3) retornaria 22/07/2024 19:37:00 var userTimezoneDate = DateTime.Now.ToUserTimeZone(); ``` No método C# `ApiContext.SaveEntityAsync`, o sistema automaticamente irá converter as datas recebidas por parametro para UTC no momento de salvar no banco de dados, então é importante que a API receba a data no Timezone definido nas configurações do Usuário de API. Exemplo: Se vc tem uma entidaide chamada Tarefa, e nessa tarefa você tem um campo de Data de entrega que vc gostaria que fosse a data 27/12/2024 23:55:55 no horario de São Paulo. 1\. Você deve configurar o seu **Usuario de API** para ter o TimeZone de **São Paulo.** 2\. Você deve mandar a data com o horario **27/12/2024 23:55:55** 3\. Você não deve se preocupar com a conversão para UTC ao salvar no banco de dados, pois a conversão será feita automaticamente pelo sistema. # Alterar via C# o valor de um campo ao salvar um formulário Caso vc precise aplicar algumas regras como mudar o valor de um campo via C# ao salvar um formulário, você pode aplicar as seguintes regras: Crie uma regra como na imagem abaixo  Dentro da regra, adicione uma opção de Programação via C# como na imagem abaixo  Esse é um código de exemplo: ```C# // Declaração padrão do método assíncrono chamado ExecuteAsync public async Task ExecuteAsync(){ // Verifica se NAO é um formulario novo if(!IsNovoFormulario){ // Declaração de uma variável chamada new_sub_status e atribui a ela o valor enviado pelo usuario naquele momento var new_sub_status = FormContext.GetValue("sub_status"); // Declaração de uma variável chamada old_sub_status e inicializa com uma string vazia que colocaremos a informação antiga que ja constava do banco de dados var old_sub_status = ""; // Cria uma lista de parâmetros para a consulta SQL (Postgresql) var paramsQuery = new ListAo enviar uma mensagem de Warning usando o FormContext.WarningMessage("Mensagem de exemplo") o sistema interrompe o salvamento
Crie uma regra como na imagem abaixo  Dentro da regra, adicione uma opção de Programação via C# como na imagem abaixo ![]() ```C# public async Task ExecuteAsync(){ FormContext.WarningMessage("Mensagem de exemplo"); } ``` # Erro: Can't write CLR type System.String with handler type UuidHandler Alguns campos no Postgresql são do tipo UUID, como LIsta Dinamica, Autocomplete, Radio button, entre outros. Se vc tentar enviar um valor em branco ou diferente de um UUID para esse tipo de campo pode aparecer essa mensagem. Obrigatoriamente enviar um valor no formato UUID / GUID Sugestão: Se for por exemplo pra deixar um status em branco. Cria um status "\[em branco\]" na tabela de relacionamento e usa o ID desse novo status para salvar no campo UUID # Evento javascript após o subsmit post do formulario (onAfterPostEvent) Esse evento dispara sempre após o submit de um formulário. **Nome do evento:** onAfterPostEvent #### Como escutar o evento de retorno de um submit no form? ```JavaScript //ouvindo o evento de retorno document.addEventListener('onAfterPostEvent', function(event) { //para validar se foi sucesso ou falha, usar a seguinte variavel console.log('success', event.detail.success); //enviamos mais alguns detalhes console.log('response', event.detail.response); //formAction, com essa variavel é possivel saber se foi um post para salvar, deletar, descartar rascunho, salvar rascunho etc.. //olhar todas as opções de formAction na documentação mais abaixo console.log('formAction', event.detail.formAction); }); ``` #### Como forçar o salvamento e escutar o evento de retorno de um submit no form? ```JavaScript function ForceSaveForm(){ //ouvindo o evento de retorno document.addEventListener('onAfterPostEvent', function(event) { //para validar se foi sucesso ou falha, usar a seguinte variavel console.log('success', event.detail.success); //enviamos mais alguns detalhes console.log('response', event.detail.response); //formAction, com essa variavel é possivel saber se foi um post para salvar, deletar, descartar rascunho, salvar rascunho etc.. //olhar todas as opções de formAction na documentação mais abaixo console.log('formAction', event.detail.formAction); }); //solicitar o salvamento do iframe pai //ESSA FUNÇÃO SÓ É NECESSARIO CASO VOCÊ QUERIA FORÇAR O SALVAR formContext.form.save(); } ``` #### Como forçar o salvamento e escutar o evento de retorno de um submit no form pai? ```JavaScript function SaveParentForm(){ //recuperando o iframe pai var iframePai = getIframePaiIntance() //ouvindo o evento de retorno iframePai.document.addEventListener('onAfterPostEvent', function(event) { //para validar se foi sucesso ou falha, usar a seguinte variavel console.log('success', event.detail.success); //enviamos mais alguns detalhes console.log('response', event.detail.response); //formAction, com essa variavel é possivel saber se foi um post para salvar, deletar, descartar rascunho, salvar rascunho etc.. //olhar todas as opções de formAction na documentação mais abaixo console.log('formAction', event.detail.formAction); }); //solicitar o salvamento do iframe pai //ESSA FUNÇÃO SÓ É NECESSARIO CASO VOCÊ QUERIA FORÇAR O SALVAR iframePai.formContext.form.save(); } ``` #### O parametro numérico "formAction" que retorna no evento pode ser:- ACTION\_SALVAR = 1;
- ACTION\_SALVAR\_RASCUNHO = 2;
- ACTION\_DESCARTAR\_RASCUNHO = 3;
- ACTION\_APROVAR = 4;
- ACTION\_REPROVAR = 5;
- ACTION\_RETORNAR = 6;
- ACTION\_DELETAR = 7;
- ACTION\_SALVAR\_FORMULARIO\_FILHO = 8;
- ACTION\_DELETAR\_FORMULARIO\_FILHO = 9;
- ACTION\_DESCARTAR\_ALTERACOES\_FORMULARIO\_FILHO = 10;
- ACTION\_SOLICITAR\_TROCA\_APROVADOR\_ETAPA\_DINAMICA = 11;
- ACTION\_SALVAR\_DEFINICAO\_APROVADOR\_ETAPA\_DINAMICA = 12;
# Forçar o salvamento de um Form
#### Como forçar o salvamento no submit do form
```JavaScript
function forceSaveForm(){
//solicitar o salvamento
formContext.form.save();
}
```
#### Como forçar o salvamento no submit do form **pai**
```JavaScript
function forceSaveParentForm(){
var iframePai = getIframePaiIntance()
//solicitar o salvamento do iframe pai
iframePai.formContext.form.save();
}
```
#### Como forçar o salvamento e escutar o evento de retorno
```JavaScript
function forceSaveForm(){
//ouvindo o evento de retorno
document.addEventListener('onAfterPostEvent', function(event) {
//para validar se foi sucesso ou falha, usar a seguinte variavel
console.log('success', event.detail.success);
//enviamos mais alguns detalhes
console.log('response', event.detail.response);
//formAction, com essa variavel é possivel saber se foi um post para salvar, deletar, descartar rascunho, salvar rascunho etc..
//olhar todas as opções de formAction na documentação mais abaixo
console.log('formAction', event.detail.formAction);
});
//solicitar o salvamento do iframe pai
formContext.form.save();
}
```
#### O parametro numérico "formAction" que retorna no evento são:
- ACTION\_SALVAR = 1;
- ACTION\_SALVAR\_RASCUNHO = 2;
- ACTION\_DESCARTAR\_RASCUNHO = 3;
- ACTION\_APROVAR = 4;
- ACTION\_REPROVAR = 5;
- ACTION\_RETORNAR = 6;
- ACTION\_DELETAR = 7;
- ACTION\_SALVAR\_FORMULARIO\_FILHO = 8;
- ACTION\_DELETAR\_FORMULARIO\_FILHO = 9;
- ACTION\_DESCARTAR\_ALTERACOES\_FORMULARIO\_FILHO = 10;
- ACTION\_SOLICITAR\_TROCA\_APROVADOR\_ETAPA\_DINAMICA = 11;
- ACTION\_SALVAR\_DEFINICAO\_APROVADOR\_ETAPA\_DINAMICA = 12;
# Listagem: Como habiltar para atualizar a cada X segundos (Auto Refresh, Atualização Automática, Atualização Recorrente)
Para habilitar a atualização recorrente a cada X segundo utilize a função javascript abaixo dentro do formulário:
```JavaScript
listContext.table.setRecurrentRefresh(15);
```
#####
ou
```JavaScript
listContext.table.setAutoRefresh(15);
```
#####
##### Exemplo de como ficaria a configuração para atualizar a cada 15 segundos na listagem de um Formulário
# Ativar e Inativar campos do formulario via Javascript
As funçoes abaixo te auxiliam a inativar e ativar os campos de um formulario:
**Inativar um campo:**
`formcontext.field.disable("idDoCampo")`
**Ativar um campo:**
`formcontext.field.enable("campo")`
**Inativar mais de um campo:**
`formcontext.field.disable(["campo","campo","campo"])`
**Ativar mais de um campo:**
`formcontext.field.enable(["campo","campo","campo"])`
**Inativar todos os campos:**
`formcontext.field.disableAll()`
**Ativar todos os campos:**
`formcontext.field.enableAll()`
As funçoes abaixo te auxiliam a esconder e mostrar os campos de um formulario:
**Esconder um campo:**
`formcontext.field.hide("idDoCampo")`
**Mostrar um campo:**
`formcontext.field.show("campo")`
**Esconder mais de um campo:**
`formcontext.field.hide(["campo","campo","campo"])`
**Mostrar mais de um campo:**
`formcontext.field.show(["campo","campo","campo"])`
**Esconder todos os campos:**
`formcontext.field.hideAll()`
**Mostrar todos os campos:**
`formcontext.field.showAll()`
As funções abaixo te auxiliam a esconder e mostrar e remover o toolbar de botões de um formulario:
O toolbar é é essa area onde estão os boõtes do formulário, como na imagem abaixo onde aparecem os Botões Salvar, Salvar em Rascunho e Consultar.
**Para Esconder a barra de botões:**
`formcontext.form.toolbar.hide()`
**Para Mostrar a barra de botões:**
`formcontext.form.toolbar.show()`
**Para Remover a barra de botões:**
`formcontext.form.toolbar.remove()`
# Colocar ou Retirar a Obrigatoriedade de um Campo no Formulário via JavaScript
Nesta seção, você aprenderá a marcar um campo como obrigatório e a remover ou restaurar essa obrigatoriedade conforme necessário, utilizando JavaScript.
É importante para todo o campo que você deseja trabalhar com obrigatoriedade, que ele esteja por padrão marcado como obrigatório no formulário, sendo assim, acesse as configurações do formulario, acesse o campo e o marque como Obrigatório na seção de validação.
#### Pré requisito para uso das funções descritas aqui nesse documento: Para todo o campo que você deseja trabalhar com obrigatoriedade condicional, que ele esteja por padrão marcado como obrigatório no formulário, sendo assim, acesse as configurações do formulario, acesse o campo e o marque como Obrigatório na seção de validação. ### **Como funciona?** Para atingir o objetivo de tirar ou remover a obrigatoriedade em deteminada situação, vou deve usar as funções abaixo, lembrando que por padrão o campo deve estar inicialmente marcado como Obrigatório #### Removendo a Obrigatoriedade de um Campo Se houver a necessidade de remover a obrigatoriedade de um campo em determinadas situações, você pode utilizar a função `ignoreRequired` do objeto `formContext.field.required`. Esta função desativa temporariamente a obrigatoriedade de um campo. Exemplo de uso no Javascript: `formContext.field.required.ignoreRequired("campoTexto");` Neste exemplo, o campo de texto identificado por `"campoTexto"` deixará de ser obrigatório. #### #### Restaurando a Obrigatoriedade de um Campo Se, em algum momento, precisar restaurar a obrigatoriedade de um campo, utilize a função `unsetIgnoreRequired` do mesmo objeto. Isso faz com que o campo volte a ser obrigatório.Exemplo de uso no Javascript:
`formContext.field.required.unsetIgnoreRequired("campoTexto");`
Essa funçao javascript deve ser utilizado dentro de um formulario na customização de código em Javascript.
## Objetivo O objetivo dessas funções é ajudar a identificar o estado atual do formulário e executar ações específicas com base em seu estado. Os estados podem ser: - **Novo Formulário**: O formulário acabou de ser criado e nunca foi salvo. - **Rascunho**: O formulário foi salvo como rascunho e pode estar em edição. - **Edição de um Rascunho**: O formulário está sendo editado e é uma versão salva anteriormente como rascunho. ## Funções Utilizadas ### `formContext.form.isNew()` Essa função retorna um valor booleano que indica se o formulário atual é **novo**. - **true**: Se o formulário é novo (nunca foi salvo). - **false**: Se o formulário já foi salvo previamente. ### `formContext.form.isDraft()` Essa função também retorna um valor booleano e indica se o formulário está em **estado de rascunho**. - **true**: Se o formulário é um rascunho. - **false**: Se o formulário não é um rascunho. ## Exemplo de Uso Aqui está um exemplo prático de como utilizar as funções `isNew()` e `isDraft()`: ```JavaScript var isNewForm = formContext.form.isNew(); var isDraftForm = formContext.form.isDraft(); if(isNewForm){ console.log('This is a new form'); } if(isDraftForm){ console.log('This is a draft form'); } if(isNewForm && !isDraftForm){ console.log('This is a new form and not a draft form'); } if(!isNewForm && isDraftForm){ console.log('This is an edition form and a draft form'); } if(!isNewForm && !isDraftForm){ console.log('This is an edition form and not a draft form'); } ``` ### Explicação do Código 1. **Verificando se é um Novo Formulário:** ```JavaScript if (isNewForm) { console.log('This is a new form'); } ``` Aqui, se a função `isNew()` retornar `true`, significa que o formulário é novo e nunca foi salvo. O código exibe a mensagem "This is a new form". 2. **Verificando se é um Rascunho:** ```JavaScript if (isDraftForm) { console.log('This is a draft form'); } ``` Se a função `isDraft()` retornar `true`, significa que o formulário está em estado de rascunho. O código exibe a mensagem "This is a draft form". 3. **Verificando se o Formulário é Novo e Não é um Rascunho:** ```JavaScript if (isNewForm && !isDraftForm) { console.log('This is a new form and not a draft form'); } ``` Essa condição verifica se o formulário é novo (`isNewForm === true`) e não está em estado de rascunho (`isDraftForm === false`). Neste caso, o código exibe "This is a new form and not a draft form". 4. **Verificando se o Formulário é uma Edição de um Rascunho:** ```JavaScript if (!isNewForm && isDraftForm) { console.log('This is an edition form and edition of a draft form'); } ``` Essa condição verifica se o formulário já foi salvo antes (`isNewForm === false`) e está em estado de rascunho (`isDraftForm === true`). Ou seja, é uma edição de um formulário previamente salvo como rascunho. 5. **Verificando se o Formulário é uma Edição (sem rascunho):** ```JavaScript if (!isNewForm && !isDraftForm) { console.log('This is an edition form and not a draft form'); } ``` Essa condição verifica se o formulário já foi salvo antes (`isNewForm === false`) e não está em estado de rascunho (`isDraftForm === false`). Ou seja, é uma edição de um formulário e nao está salvo como rascunho. ## ## Resumo Essas duas funções são essenciais para verificar o estado atual de um formulário, e a partir delas, você pode: - Saber se o formulário é novo e nunca foi salvo. - Determinar se o formulário foi salvo como rascunho. - Diferenciar entre novos formulários, rascunhos, edições e edições de rascunhos. Com base nessas informações, você pode executar ações específicas, como mostrar mensagens, habilitar/desabilitar funcionalidades, ou realizar diferentes tipos de validações. # Como permitir um usuário Gerenciar Usuário, Perfil e Grupo de Usuario não tendo o perfil MASTER Crie um perfil com as funcionalidades abaixo e associe o perfil ao usuario que terá essa permissão: - Funcionalidades Por PErfil de Acesso - Grupo de Usuario - Perfil de acesso - Usuário  Ao logar, o usuario com esse perfil associado visualizará as opções de Gerenciamento de Usuario, Perfil e Grupo de usuario dentro do Menu Segurança e Acesso, como na imagem abaixo:  # Como customizar a mensagem de sucesso ou falha após o submit post do Formulário (via javascript) Acesse a customização de um formulário. Ao acessar, entre na Aba "Configurações", em seguida, expanda "Outras Configurações" e defina um nome para a função javascript que será executada após o post. O nome da função javascript deve ser preenchida no campo "**Executar a função Javascript abaixo após salvar ou executar qualquer ação bem-sucedida no formulário:"** como mostra em azul na imagem abaixo.  zoom do campo da imagem anterior:  No exemplo, foi definido o nome "executeAfterPost" para o nome da função javascript. Abaixo segue um exemplo da função e a explicação comentada em cada linha.**ATENÇÃO**: nessa função é necessário testar se o formAction é a opção salvar. o formAction é retornado como parametro da função. Para checar utilize a função js **formContext.form.action.isSave(formAction)**
```JavaScript function executeAfterPost(formId, response, formAction) { //verifica se é o formAction de Salvar (essa função pode ser chamada em varios formAction, por isso é imoprtante checar se é salvar) if (formContext.form.action.isSave(formAction)) { //testar se deu sucesso no envio do form if(response.success){ //funçao para desabilitar a mensagem nativa do sistema formContext.form.disableNativeSuccessMsg(); //colocar a msg de sucesso formContext.msg.success('Salvouu legal com sucesso', 'Sucesso'); } } } ``` # Estrutura de Armazenamento dos campos no banco de dados No sistema, os campos são armazenados em dois locais diferentes, em um JSON com todos os campos juntos e na tabela da entidade. 1. **JSON do Formulário** - O sistema gera um JSON contendo todos os dados de cada formulário, incluindo os campos numéricos, inteiros e de data e hora, e armazena esse JSON na tabela `tbl_formulario`. - Esse JSON serve como um registro completo das informações enviadas pelo usuário, sendo útil também para auditoria de dados. 2. **Tabela da Entidade - Campo VARCHAR** - Este campo armazena o valor recebido em "string", sem conversões. O tipo VARCHAR foi mantido por questões de compatibilidade com o sistema legado. 3. **Tabela da Entidade - Campos tipados** - Campos booleanos, são gravados como smallint (0 ou 1), com exceção do campo "deletado", esse esta gravado como true or false - Campos com tipos específicos, como numéricos, inteiros e de data e hora, têm uma coluna adicional que armazena o valor tipado e convertido: - **Numéricos e Inteiros**: Os campos numéricos possuem o sufixo `__number__` e os inteiros seguem a mesma estrutura, facilitando operações e consultas. Exemplo: `campo__number__`. O tipo do campo é numeric no postgresql - **Data e Hora (Datetime)**: Os campos de data e hora possuem o sufixo `__datetime__`. Exemplo: `campo__datetime__`. o tipo do campo é `date` para campos que sõ tem Data e `timestamp` para campos com date e hora ### Observações Importantes - **Exibição de Dados**: Na listagem, é sempre utilizado o campo com o sufixo tipado (`__number__` ou `__datetime__`), pois ele contém o valor devidamente convertido, garantindo precisão nas operações. - **Máscara de Formatação no Formulário**: No formulário de entrada de dados, uma máscara em JavaScript é aplicada ao `campo`, formatando o valor conforme o padrão do JSON. Essa máscara pode causar discrepâncias se houver uma incompatibilidade entre os formatos de entrada e o armazenamento no PostgreSQL. ### Possíveis Problemas e Soluções - **Diferença no Valor Armazenado**: Para valores numéricos, caso o valor enviado pela API contenha vírgulas (por exemplo, "3,31"), pode ocorrer uma interpretação incorreta durante a conversão para o formato numérico, transformando o valor `3,31` em `331`. - **Recomendações**: Nas Apis, e regras, sempre manter o padrao no formato ingles 99999.99 com ponto. Sugere-se validar e formatar os dados enviados para garantir que o sistema receba sempre o formato correto. A padronização dos dados de entrada evita diferenças entre os valores no campo VARCHAR e nos campos tipados com sufixo. # Executar uma Api do proprio agilityflow dentro de um Form ou dentro de uma outra Api ### No FormContext #### Chamando uma Api Post e **não** aguardando a resposta **(Assincronamente)**. ```C# public async Task ExecuteAsync(){ await FormContext.InternalApi.ExecutePostAsynchronouslyAsync("rest-api/teste", new { valorr= 334455.66, email="exemplo@email.com.br" }, new ExecutePostAsynchronouslyOptions() { AuthUser = "MUDAR AQUI PELO API USER LOGIN", AuthKey = "MUDAR AQUI PELO API USER KEY", }); } ``` #### Chamando uma Api Post e aguardando a resposta **(Sincronamente)**. ```C# public async Task ExecuteAsync(){ var result = await FormContext.InternalApi.ExecutePostSynchronouslyAsync("rest-api/teste", new { valorr= 33445566.77, email="exemplo@email.com.br" }, new ExecutePostSynchronouslyOptions() { AuthUser = "MUDAR AQUI PELO API USER LOGIN", AuthKey = "MUDAR AQUI PELO API USER KEY", }); //verificar se foi sucesso ou nao var isSuccess = result.IsSuccess; //se quiser o retorno no formato string var str = result.GetString(); //se quiser o retorno no formato Json var json = result.GetJson(); FormContext.Log($"isSuccess: {isSuccess} | - str: {str}" ,"debug"); } ``` ### No PageContext #### Chamando uma Api Post e **não** aguardando a resposta **(Assincronamente)**. ```C# public async Task ExecuteAsync(){ await PageContext.InternalApi.ExecutePostAsynchronouslyAsync("rest-api/teste", new { valorr= 334455.66, email="exemplo@email.com.br" }, new ExecutePostAsynchronouslyOptions() { AuthUser = "MUDAR AQUI PELO API USER LOGIN", AuthKey = "MUDAR AQUI PELO API USER KEY", }); } ``` #### Chamando uma Api Post e aguardando a resposta **(Sincronamente)**. ```C# public async Task ExecuteAsync(){ var result = await PageContext.InternalApi.ExecutePostSynchronouslyAsync("rest-api/teste", new { valorr= 33445566.77, email="exemplo@email.com.br" }, new ExecutePostSynchronouslyOptions() { AuthUser = "MUDAR AQUI PELO API USER LOGIN", AuthKey = "MUDAR AQUI PELO API USER KEY", }); //verificar se foi sucesso ou nao var isSuccess = result.IsSuccess; //se quiser o retorno no formato string var str = result.GetString(); //se quiser o retorno no formato Json var json = result.GetJson(); FormContext.Log($"isSuccess: {isSuccess} | - str: {str}" ,"debug"); } ``` ### ### ### No ApiContext**IMPORTANTE**: Caso o usuário da API que está consumindo esta outra API tenha acesso a ambas, não será necessário fornecer os parâmetros AuthUser e AuthKey.
#### Chamando uma Api Post e **não** aguardando a resposta **(Assincronamente)**. ```C# public async Task RunAsync(){ await ApiContext.InternalApi.ExecutePostAsynchronouslyAsync("rest-api/teste", new { valorr= 334455.66, email="exemplo@email.com.br" }, new ExecutePostAsynchronouslyOptions() { /* ATENÇÃO: Caso o usuário da API que está consumindo esta outra API tenha acesso a ambas, não será necessário fornecer os parâmetros AuthUser e AuthKey.*/ AuthUser = "MUDAR AQUI PELO API USER LOGIN", AuthKey = "MUDAR AQUI PELO API USER KEY", }); } ``` #### Chamando uma Api Post e aguardando a resposta **(Sincronamente)**. ```C# public async Task RunAsync(){ var result = await ApiContext.InternalApi.ExecutePostSynchronouslyAsync("rest-api/teste", new { valorr= 33445566.77, email="exemplo@email.com.br" }, new ExecutePostSynchronouslyOptions() { /* ATENÇÃO: Caso o usuário da API que está consumindo esta outra API tenha acesso a ambas, não será necessário fornecer os parâmetros AuthUser e AuthKey.*/ AuthUser = "MUDAR AQUI PELO API USER LOGIN", AuthKey = "MUDAR AQUI PELO API USER KEY", }); //verificar se foi sucesso ou nao var isSuccess = result.IsSuccess; //se quiser o retorno no formato string var str = result.GetString(); //se quiser o retorno no formato Json var json = result.GetJson(); FormContext.Log($"isSuccess: {isSuccess} | - str: {str}" ,"debug"); } ``` # Forçar via Javascript o Salvamento do Formulário #### Forçar o salvamento via Javascript: `formContext.form.save()` #### #### Forçar o salvamento via Javascript: `formContext.parentWindow.formContext.form.save()formContext.form.save()` # Manipular o formulário "pai", dentro de um formulário filho No formContext do javascript existe uma propriedade chamada `parentWindow` ou `parentFrame`: `formContext.parentWindow` Dessa forma você terá acesso a todas os javascript e objetos do formulário pai. Por exemplo, para buscar um campo do formulario pai: `var value = formContext.parentWindow.formContext.field.getValue("campoid")` Para salvar o formulário pai via javascript: `formContext.parentWindow.formContext.form.save()` # Evento javascript ondataloaded na Lista Dinamica No exemplo abaixo considere uma Lista Dinamica com o id "orcamento": ```javascript $('#orcamento').on('ondataloaded', function (data) { var orcamento = formContext.field.getValue('orcamento'); if (orcamento == "") { } }); ``` # Como criar itens / tarefas automaticamente nos Checklists dos formulários? Com esse exemplo, vc será capaz de criar itens / tarefas na aba Checklists dos formulários. Como na imagem abaixo: [](https://wiki.agilityflow.io/uploads/images/gallery/2025-01/image.png) Nesse exemplo, vamos inserir registros em 2 tabelas. 1. **tbl\_formulario\_checklist** Essa tabela tabela conteém o nome do checklist e a relação com o formulario que será apresentado 2. **tbl\_formulario\_checklist\_item** Essa tabela contém todas os itens de um checklist No exemplo, eu criei 2 forms, sendo o form **Inspeção** um Workflow e o **Inspeção Itens** sendo filho do **Inspeção**| Inspeção | Form onde ao salvar será criada as task | x\_inspection |
| Inspeção Itens | Form onde está tudo que foi inspecionado. Os itens que estiverem PENDING, será gerado uma tarefa no checklist do form ao aprovar. | x\_inspection\_item |
IMPORTANTE: a class não pode ser instanciada diretamente, ex: new MyClass() utilize CreateInstanceMyClass() que é gerado automaticamente
IMPORTANTE: a class não pode ter construtor definido
### Como definir e instanciar uma classe C# que está definida no Global Code? Entre em **Global Code** na área de configuração, na aba C# GlobalClass e clique em Novo C#. Crie um C# chamado "Document" [](https://wiki.agilityflow.io/uploads/images/gallery/2025-02/RjTimage.png) No código C#, copie e cole o código abaixo, repare que foi criado manualmente o metodo fora da classe chamado CreateDocument com 2 parametros que instancia a classe Document, através dele criaremos a instancia quando formos usar a classe Document, mas o Agilityflow também gera um metodo padrão chamado **CreateInstanceDocument** sem parametro para gerar a instancia, caso você precise.Importante: para toda classe criada no agilityflow, o sistema gera automaticamente um metodo de criação da instancia dessa classe com o nome CreateInstanceXXXXX onde o XXXX é o nome da classe, se for uma classe chamada Document, ele cria **Document CreateInstanceDocument()**, sempre sem parametros de entrada
```c# //crie uma classe public class Document{ public string Title {get;set;} public string Description {get;set;} public async TaskImportante: para toda classe criada no agilityflow, o sistema gera automaticamente um metodo de criação da instancia dessa classe com o nome CreateInstanceXXXXX onde o XXXX é o nome da classe, se for uma classe chamada Document, ele cria **Document CreateInstanceDocument()**
```c# @{ //instanciando uma class q foi declarada dentro do Global dinamicamente var documentClass01 = GlobalClass.CreateInstanceDocument(); var json = JsonConvert.SerializeObject( new { documentClass01 }); } @json ``` ##### **Opção 02:** Chamando o metodo nativo do agiltyflow para instanciar classes: ```c# @{ //instanciando uma class q foi declarada dentro do Global dinamicamente var documentClass02 = GlobalClass.CreateInstance("Document"); var json = JsonConvert.SerializeObject( new { documentClass02 }); } @json ``` ##### **Opção 03:** Caso você crie um metodo manualmente que intancie a classe**,** exemplo o metodo criado no exemplo anterior **CreateDocument (**que você mesmo criou) : ```c# @{ //instanciando uma class q foi declarada dentro do Global dinamicamente var documentClass01 = GlobalClass.CreateDocument("string title", "string description"); var json = JsonConvert.SerializeObject( new { documentClass01 }); } @json ``` ## Regras e Limitações: - Para toda classe criada no agilityflow, o sistema gera automaticamente um metodo de criação da instancia dessa classe como nome CreateInstanceXXXXX onde o XXXX é o nome da classe, se for uma classe chamada Document, ele cria **Document CreateInstanceDocument()**, porém sempre sem parametros de entrada, você pode gerar manualmente um **metodo com o mesmo nome mas com outros parametros de entrada, exemplo Document CreateDocument(string title, string description )** A classe não deve ter construtor, para instanciar, utilize o metodo **CreateInstance<MyClass>()** - Fora da área do C# do Global Code, você não tem acesso ao "Tipo" da classe que você criar. Então fora do seu class c# de Global Code você nao vai conseguir usar esse "Tipo",ex: como **ToList<MyClass>()** ou por exemplo em uma referencia implicita no foreach,: - ```c# //forma ERRADA se estiver FORA e consumindo o GlobalCode, (se estiver dentro do GlobalCode, você pode referenciar normalmente) //referenciar explicitamente o UserClass no foreach var userExamples = await GlobalClass.ListUserExamplesAsync(); foreach(UserClass user in userExamples){IMPORTANTE: a class não pode ser instanciada diretamente, ex: new MyClass() utilize CreateInstanceMyClass() que é gerado automaticamente
IMPORTANTE: a class não pode ter construtor definido
### Como definir e instanciar uma classe C# ?Importante: para toda classe criada no agilityflow, o sistema gera automaticamente um metodo de criação da instancia dessa classe com o nome CreateInstanceXXXXX onde o XXXX é o nome da classe, se for uma classe chamada Document, ele cria **Document CreateInstanceDocument()**, sempre sem parametros de entrada
```c# //crie uma classe public class Document{ public string Title {get;set;} public string Description {get;set;} public async TaskImportante: para toda classe criada no agilityflow, o sistema gera automaticamente um metodo de criação da instancia dessa classe com o nome CreateInstanceXXXXX onde o XXXX é o nome da classe, se for uma classe chamada Document, ele cria **Document CreateInstanceDocument()**
```c# @{ //instanciando uma class q foi declarada dentro do CustomPage dinamicamente var documentClass01 = CustomPageClass.CreateInstanceDocument(); var json = JsonConvert.SerializeObject( new { documentClass01 }); } @json ``` ##### **Opção 02:** Chamando o metodo nativo do agiltyflow para instanciar classes: ```c# @{ //instanciando uma class q foi declarada dentro do CustomPage dinamicamente var documentClass02 = CustomPageClass.CreateInstance("Document"); var json = JsonConvert.SerializeObject( new { documentClass02 }); } @json ``` ##### **Opção 03:** Caso você crie um metodo manualmente que intancie a classe**,** exemplo o metodo criado no exemplo anterior **CreateDocument\_01 (**que você mesmo criou) :O método **CreateDocument\_01 você que precisaria criar (exemplo criado acima)**
```c# @{ //instanciando uma class q foi declarada dentro do CustomPage dinamicamente var documentClass01 = CustomPageClass.CreateDocument_01("string title", "string description"); var json = JsonConvert.SerializeObject( new { documentClass01 }); } @json ``` ## Regras e Limitações: - Para toda classe criada no agilityflow, o sistema gera automaticamente um metodo de criação da instancia dessa classe como nome CreateInstanceXXXXX onde o XXXX é o nome da classe, se for uma classe chamada Document, ele cria **Document CreateInstanceDocument()**, porém sempre sem parametros de entrada, você pode gerar manualmente um **metodo com o mesmo nome mas com outros parametros de entrada, exemplo Document CreateDocument(string title, string description )** A classe não deve ter construtor, para instanciar, utilize o metodo **CreateInstance<MyClass>()** - Fora da área do C# do Custom Page, você não tem acesso ao "Tipo" da classe que você criar. Então fora do seu class c# de Custom Page você nao vai conseguir usar esse "Tipo",ex: como **ToList<MyClass>()** ou por exemplo em uma referencia implicita no foreach,: - ```c# //forma ERRADA se estiver FORA e consumindo o CustomPage, (se estiver dentro do CustomPage, você pode referenciar normalmente) //referenciar explicitamente o UserClass no foreach var userExamples = await CustomPageClass.ListUserExamplesAsync(); foreach(UserClass user in userExamples){---
## Constantes
### `emptyGuid`
Uma string que representa um GUID vazio:
```
var emptyGuid = "00000000-0000-0000-0000-000000000000";
```
---
## Estrutura Principal
### `customPageContext`
Objeto que gerencia funções relacionadas ao contexto da página.
#### `parentFrame`
Identifica e armazena a referência do iframe pai.
```
customPageContext.parentFrame
```
#### `isMobile()`
Retorna `true` se o dispositivo for móvel.
```
customPageContext.isMobile();
```
#### `redirectTo(url)`
Redireciona a página para a URL informada.
```
customPageContext.redirectTo('https://example.com');
```
#### `openLightBox(link, tamanholightbox, titulo)`
Abre um lightbox com a URL especificada.
```
customPageContext.openLightBox('/pagina.html', 'm', 'Exemplo');
```
---
## **Carregamento de Componentes CSHTML**
Funções para carregar componentes de forma dinâmica:
```
customPageContext.loadCsHtmlComponent(componentName, options);
customPageContext.loadHtmlComponent(componentName, options);
customPageContext.loadPartialView(componentName, options);
customPageContext.loadViewComponent(componentName, options);
customPageContext.loadAjax(componentName, options);
customPageContext.loadAjaxComponent(componentName, options);
```
Veja um exemplo de uso para Inserir, Atualizar ou deletar um registro em um Formulário, [clicando aqui](https://wiki.agilityflow.io/books/manual-de-customiza%C3%A7%C3%A3o/page/custom-page-como-inserir-atualizar-e-deletar-um-registro-em-um-determinado-form-estando-em-um-custom-page)
Exemplo passando parâmetros para o cshtml:
```javascript
function loadPartialToUpdateRegister() {
var cshtmlPartialName = "[coloque aqui o nome do partial cshtml que vc fez as regras de atualizar]";
customPageContext.loadCsHtmlComponent(cshtmlPartialName,
{
placeholderId: 'result_cshtml', //parametro opcional, se o cshtml retornar algum html e vc quiser, vc pode colocar o retorno dentro de algum placeholder, div, etc..
extraData: {
idRegistro: $('#guidRegistro').val(),
nome: $('#nome').val(),
email: $('#email').val()
},
onSuccess: function (result) {
customPageContext.msg.success("Executado com sucesso", "Confirmação");
},
onError: function (error) {
customPageContext.msg.error("Execução não realizada", "Erro");
console.log('error', error)
}
}
)
}
```
---
## **Carregamento de Arquivos JavaScript**
### `addJavascriptFile(options)`
Adiciona um arquivo JavaScript à página de forma assíncrona e executa um callback após o carregamento.
- **Parâmetros:**
- `options` (Object): Objeto com as propriedades:
- `file_url` (String): URL do arquivo JavaScript.
- `callback_onload` (Function): Função a ser executada após o carregamento do arquivo.
- **Exemplo:**
```
customPageContext.addJavascriptFile({
file_url: "https://www.exemplo.com/script.js",
callback_onload: function() {
console.log("Script carregado!");
}
});
```
## **Manipulação de URLs**
### `url.getBaseUrl()`
Retorna a URL base do sistema.
- **Retorno:**
- String com a URL base.
- **Exemplo:**
```
console.log("URL base:", customPageContext.url.getBaseUrl());
```
---
### `url.getStaticFileUrl()`
Retorna a URL base para arquivos estáticos.
- **Retorno:**
- String com a URL de arquivos estáticos.
- **Exemplo:**
```
console.log("URL de arquivos estáticos:", customPageContext.url.getStaticFileUrl());
```
---
## **Idioma Atual**
### `currentLanguage.get()`
Retorna o idioma atual do sistema.
- **Retorno:**
- String com o código do idioma (ex: `'pt-BR'`, `'en-US'`).
- **Exemplo:**
```
console.log("Idioma atual:", customPageContext.currentLanguage.get());
```
---
### `currentLanguage.isEnglish()`
Verifica se o idioma atual é inglês.
- **Retorno:**
- `true` se for inglês.
- `false` caso contrário.
- **Exemplo:**
```
if (customPageContext.currentLanguage.isEnglish()) {
console.log("Idioma atual é inglês.");
}
```
---
### `currentLanguage.getIIF_TextFromCurrentLanguage(text_ptBR, text_ENG, text_ESP)`
Retorna o texto correspondente ao idioma atual.
- **Parâmetros:**
- `text_ptBR` (String): Texto em português.
- `text_ENG` (String): Texto em inglês.
- `text_ESP` (String): Texto em espanhol.
- **Retorno:**
- String com o texto no idioma atual.
- **Exemplo:**
```
const texto = customPageContext.currentLanguage.getIIF_TextFromCurrentLanguage("Olá", "Hello", "Hola");
console.log(texto); // Retorna "Olá" se o idioma for português.
```
---
## **Mensagens**
O módulo `customPageContext.msg` fornece funções para exibir e ocultar mensagens de alerta, erro, sucesso e aviso no sistema. Abaixo estão as funcionalidades disponíveis.
---
### **Ocultar Mensagens**
### `hide(forcarFechar)`
Oculta todas as mensagens exibidas.
- **Parâmetros:**
- `forcarFechar` (Boolean): Força o fechamento das mensagens.
- **Exemplo:**
```
customPageContext.msg.hide(true); // Oculta todas as mensagens, forçando o fechamento.
```
---
### **Exibir Mensagens**
### `show(type, msg, title, options)`
Exibe uma mensagem de alerta, erro, sucesso ou aviso.
- **Parâmetros:**
- `type` (String): Tipo da mensagem. Valores possíveis:
- `'warning'`: Mensagem de aviso.
- `'error'`: Mensagem de erro.
- `'success'`: Mensagem de sucesso.
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais para personalização da mensagem.
- **Exemplo:**
```
customPageContext.msg.show("success", "Operação realizada com sucesso!", "Sucesso", { timeout: 5000 });
```
---
### `warning(msg, title, options)`
Exibe uma mensagem de aviso.
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
customPageContext.msg.warning("Atenção: Este campo é obrigatório.", "Aviso");
```
---
### `error(msg, title)`
Exibe uma mensagem de erro.
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- **Exemplo:**
```
customPageContext.msg.error("Ocorreu um erro ao salvar o formulário.", "Erro");
```
---
### `success(msg, title, options)`
Exibe uma mensagem de sucesso.
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
customPageContext.msg.success("Formulário salvo com sucesso!", "Sucesso", { timeout: 3000 });
```
---
### **Funções Legadas de Mensagens**
As funções abaixo são mantidas para compatibilidade com versões anteriores, mas é recomendado utilizar as funções acima (`show`, `warning`, `error`, `success`).
### `hideMsgs()`
Oculta todas as mensagens exibidas.
- **Exemplo:**
```
customPageContext.msg.hideMsgs();
```
---
### `showMsgWarning(msg, title, options)`
Exibe uma mensagem de aviso (legado).
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
customPageContext.msg.showMsgWarning("Atenção: Este campo é obrigatório.", "Aviso");
```
---
### `showMsgError(msg, title)`
Exibe uma mensagem de erro (legado).
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- **Exemplo:**
```
customPageContext.msg.showMsgError("Ocorreu um erro ao salvar o formulário.", "Erro");
```
---
### `showMsgSuccess(msg, title, options)`
Exibe uma mensagem de sucesso (legado).
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
customPageContext.msg.showMsgSuccess("Formulário salvo com sucesso!", "Sucesso", { timeout: 3000 });
```
---
### **Exemplos de Uso de Mensagem**
##### Exibindo uma mensagem de sucesso:
```
customPageContext.msg.success("Dados salvos com sucesso!", "Sucesso", { timeout: 5000 });
```
##### Exibindo uma mensagem de erro:
```
customPageContext.msg.error("Erro ao processar a solicitação.", "Erro");
```
##### Ocultando todas as mensagens:
```
customPageContext.msg.hide(true);
```
## **Manipulação de Números**
### `number.convertString_toNumber(strValueToConvert, qtdCasasDecimais)`
Converte uma string formatada em número.
- **Parâmetros:**
- `strValueToConvert` (String): Valor em formato de string.
- `qtdCasasDecimais` (Number): Quantidade de casas decimais.
- **Retorno:**
- Número convertido.
- **Exemplo:**
```
const numero = customPageContext.number.convertString_toNumber("1.000,50", 2);
console.log(numero); // Retorna 1000.50
```
---
### `number.convertNumber_toStringFormatted(numberToConvert, qtdCasasDecimais)`
Converte um número em uma string formatada de acordo com o idioma.
- **Parâmetros:**
- `numberToConvert` (Number): Número a ser convertido.
- `qtdCasasDecimais` (Number): Quantidade de casas decimais.
- **Retorno:**
- String formatada.
- **Exemplo:**
```
const texto = customPageContext.number.convertNumber_toStringFormatted(1000.50, 2);
console.log(texto); // Retorna "1.000,50" em português.
```
---
## **Manipulação de Datas**
### `isCurrentMonthAndYear(data)`
Verifica se a data fornecida pertence ao mês e ano atuais.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY`.
- **Retorno:**
- `true` se a data for do mês e ano atuais.
- `false` caso contrário.
- **Exceções:**
- Lança um `TypeError` se a data estiver em um formato inválido.
- **Exemplo:**
```
customPageContext.datetime.validation.isCurrentMonthAndYear("25/10/2023"); // Retorna true se outubro de 2023 for o mês e ano atuais.
```
---
### `compare(date1, compare, date2)`
Compara duas datas com base no operador especificado.
- **Parâmetros:**
- `date1` (String): Primeira data no formato `DD/MM/YYYY`.
- `compare` (String): Operador de comparação. Valores possíveis:
- `'greater'` ou `'>'`
- `'greater-or-equal'` ou `'>='`
- `'less'` ou `'<'`
- `'less-or-equal'` ou `'<='`
- `'equal'` ou `'=='`
- `date2` (String): Segunda data no formato `DD/MM/YYYY`.
- **Retorno:**
- `true` ou `false`, dependendo da comparação.
- **Exceções:**
- Lança um `TypeError` se as datas estiverem em formato inválido ou se o operador de comparação não for reconhecido.
- **Exemplo:**
```
customPageContext.datetime.validation.compare("25/10/2023", "greater", "20/10/2023"); // Retorna true.
```
---
### `compareDatetime(datetime1, compare, datetime2)`
Compara duas datas e horários com base no operador especificado.
- **Parâmetros:**
- `datetime1` (String): Primeira data e horário no formato `DD/MM/YYYY HH:mm`.
- `compare` (String): Operador de comparação. Valores possíveis:
- `'greater'` ou `'>'`
- `'greater-or-equal'` ou `'>='`
- `'less'` ou `'<'`
- `'less-or-equal'` ou `'<='`
- `'equal'` ou `'=='`
- `datetime2` (String): Segunda data e horário no formato `DD/MM/YYYY HH:mm`.
- **Retorno:**
- `true` ou `false`, dependendo da comparação.
- **Exceções:**
- Lança um `TypeError` se os dados estiverem em formato inválido ou se o operador de comparação não for reconhecido.
- **Exemplo:**
```
customPageContext.datetime.validation.compareDatetime("25/10/2023 14:30", "greater", "25/10/2023 12:00"); // Retorna true.
```
---
### `compareToday(compare, date2)`
Compara a data atual com uma data fornecida.
- **Parâmetros:**
- `compare` (String): Operador de comparação. Valores possíveis:
- `'greater'` ou `'>'`
- `'greater-or-equal'` ou `'>='`
- `'less'` ou `'<'`
- `'less-or-equal'` ou `'<='`
- `'equal'` ou `'=='`
- `date2` (String): Data no formato `DD/MM/YYYY`.
- **Retorno:**
- `true` ou `false`, dependendo da comparação.
- **Exemplo:**
```
customPageContext.datetime.validation.compareToday("less", "30/10/2023"); // Retorna true se a data atual for menor que 30/10/2023.
```
---
## **Adição de Tempo**
### `day(data, days)`
Adiciona dias a uma data.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY` ou `DD/MM/YYYY HH:mm`.
- `days` (Number): Número de dias a serem adicionados.
- **Retorno:**
- Data resultante no mesmo formato da entrada.
- **Exemplo:**
```
customPageContext.datetime.add.day("25/10/2023", 5); // Retorna "30/10/2023".
```
---
### `month(data, months)`
Adiciona meses a uma data.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY` ou `DD/MM/YYYY HH:mm`.
- `months` (Number): Número de meses a serem adicionados.
- **Retorno:**
- Data resultante no mesmo formato da entrada.
- **Exemplo:**
```
customPageContext.datetime.add.month("25/10/2023", 2); // Retorna "25/12/2023".
```
---
### `year(data, years)`
Adiciona anos a uma data.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY` ou `DD/MM/YYYY HH:mm`.
- `years` (Number): Número de anos a serem adicionados.
- **Retorno:**
- Data resultante no mesmo
---
### `hour(data, hours)`
Adiciona horas a uma data e horário.
- **Parâmetros:**
- `data` (String): Data e horário no formato `DD/MM/YYYY HH:mm`.
- `hours` (Number): Número de horas a serem adicionadas.
- **Retorno:**
- Data e horário resultante no formato `DD/MM/YYYY HH:mm`.
- **Exemplo:**
```
customPageContext.datetime.add.hour("25/10/2023 14:30", 3); // Retorna "25/10/2023 17:30".
```
---
### `minute(data, minutes)`
Adiciona minutos a uma data e horário.
- **Parâmetros:**
- `data` (String): Data e horário no formato `DD/MM/YYYY HH:mm`.
- `minutes` (Number): Número de minutos a serem adicionados.
- **Retorno:**
- Data e horário resultante no formato `DD/MM/YYYY HH:mm`.
- **Exemplo:**
```
customPageContext.datetime.add.minute("25/10/2023 14:30", 15); // Retorna "25/10/2023 14:45".
```
---
## **Obtenção de Datas**
### `getLastDayOfCurrentMonth()`
Retorna o último dia do mês atual.
- **Retorno:**
- Data no formato `DD/MM/YYYY`.
- **Exemplo:**
```
customPageContext.datetime.getLastDayOfCurrentMonth(); // Retorna "31/10/2023" se outubro for o mês atual.
```
---
### `getLastDayOfMonth(data)`
Retorna o último dia do mês da data fornecida.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY`.
- **Retorno:**
- Data no formato `DD/MM/YYYY`.
- **Exemplo:**
```
customPageContext.datetime.getLastDayOfMonth("25/10/2023"); // Retorna "31/10/2023".
```
---
## **Data e Horário Atuais**
### `getDateNow()`
Retorna a data e horário atuais.
- **Retorno:**
- Objeto `Date` representando a data e horário atuais.
- **Exemplo:**
```
customPageContext.datetime.getDateNow(); // Retorna a data e horário atuais.
```
---
### `getFormattedDateTime()`
Retorna a data e horário atuais formatados.
- **Retorno:**
- String no formato `DD/MM/YYYY HH:mm`.
- **Exemplo:**
```
customPageContext.datetime.getFormattedDateTime(); // Retorna "25/10/2023 14:30".
```
---
### `getFormattedDate()`
Retorna a data atual formatada.
- **Retorno:**
- String no formato `DD/MM/YYYY`.
- **Exemplo:**
```
customPageContext.datetime.getFormattedDate(); // Retorna "25/10/2023".
```
# [Custom Page] Como apresentar mensagens para o usuario
\#CustomPage
Abaixo exemplos em javascript para apresentação de mensanges para o usuário
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-02/BIkimage.png)
```javascript
function alerta() {
alert('mensagem de alerta 1');
}
```
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-02/zcUimage.png)
```javascript
function confirma() {
if (confirm("confirma msm?")) {
alert('confirmado');
} else {
alert('nao confirmado');
}
}
```
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-02/MsHimage.png)
```javascript
//função para apresentar uma mensage de sucesso
function showSuccess() {
customPageContext.msg.success("msg", "msg title");
}
```
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-02/qHMimage.png)
```javascript
//função para apresentar uma mensage de atenção
function showWarning() {
customPageContext.msg.warning("msg", "msg title");
}
```
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-02/RQdimage.png)
```javascript
//função para apresentar uma mensage de erro
function showError() {
customPageContext.msg.error("msg", "msg title");
}
```
Abaixo um exemplo para forçar esconder uma mensagem
```javascript
function hideMsgs() {
customPageContext.msg.hideMsgs();
}
```
# [Custom Page] Como buscar a data atual
Em Javascript
```javascript
function logdate() {
alert(GetDateNow())
}
```
Em C#
```c#
DateTime.Now.ToUserTimeZone()
```
# [Custom Page] Como abrir outra página ou um lightbox / modal a partir do Custom Page
\#CustomPage
Para abrir um lightbox usando Javascript:
```javascript
function openLightBox(tamanho, titulo) {
customPageContext.openLightBox('about:blank', tamanho, titulo)
}
//Abrir lightbox tela cheia
openLightBox('fullscreen');
//Abrir lightbox tamanho grande
openLightBox('g');
//Abrir lightbox tamanho médio
openLightBox('m');
//Abrir lightbox tamanho pequeno
openLightBox('p');
```
Para redirecionar para outra página usando Javascript:
```javascript
customPageContext.redirectTo(url);
```
", userNames)) ``` # [Global Code] Como declarar uma variável publica em todo o sistema No C# do Global Code: ```c# //usando a keyword PUBLIC + tipo + nome da varaiavel que quer criar public string EssaEhUmaVariavelGlobal = "legal"; ``` Nas demais classes C# ou cshtml do sistema que queiram consumir essa variavel: ```c# string valorDaVariavel_EssaEhUmaVariavelGlobal = GlobalClass.EssaEhUmaVariavelGlobal; ``` # [Custom Page] Como inserir, atualizar e deletar um registro em um determinado Form estando em um Custom Page ## Para Inserir (Insert) #### Insert usando C# ```c# public class ExemploMinhaClasseCsharp{ public async Task
Com essa opção você pode ter acesso ao contexto do form pai que abriu o form atual por exemplo.
Sendo assim você poderia utilizar todas as funções disponíveis no form pai, exemplo:
```javascript
formContext.parentFrame.formContext.field.getValue("xxx")
```
### `isMobile()`
Verifica se o dispositivo é móvel.
- **Retorno:**
- `true` se for um dispositivo móvel.
- `false` caso contrário.
- **Exemplo:**
```
if (formContext.isMobile()) {
console.log("Dispositivo móvel detectado.");
}
```
---
### `isPublicPortal()`
Verifica se o formulário está sendo exibido em um portal público.
- **Retorno:**
- `true` se for um portal público.
- `false` caso contrário.
- **Exemplo:**
```
if (formContext.isPublicPortal()) {
console.log("Formulário em portal público.");
}
```
---
### `isPublicForm()`
Verifica se o formulário é público (mesma lógica de `isPublicPortal`).
- **Retorno:**
- `true` se for um formulário público.
- `false` caso contrário.
- **Exemplo:**
```
if (formContext.isPublicForm()) {
console.log("Formulário público detectado.");
}
```
---
## **Redirecionamento**
### `redirectTo(url)`
Redireciona para uma URL especificada.
- **Parâmetros:**
- `url` (String): URL para redirecionamento.
- **Exemplo:**
```
formContext.redirectTo("https://www.exemplo.com");
```
---
## **Abrir Lightbox**
### `openLightBox(link, tamanholightbox, titulo)`
Abre uma lightbox com o conteúdo da URL especificada.
- **Parâmetros:**
- `link` (String): URL a ser carregada na lightbox.
- `tamanholightbox` (String): Tamanho da lightbox. Valores possíveis: `'p'`, `'m'`, `'g'`, `'fullscreen'`, `'fullscreen-headerless'`.
- `titulo` (String): Título da lightbox.
- **Exemplo:**
```
formContext.openLightBox("https://www.exemplo.com", "m", "Título da Lightbox");
```
---
## **Carregamento de Arquivos JavaScript**
### `addJavascriptFile(options)`
Adiciona um arquivo JavaScript à página de forma assíncrona e executa um callback após o carregamento.
- **Parâmetros:**
- `options` (Object): Objeto com as propriedades:
- `file_url` (String): URL do arquivo JavaScript.
- `callback_onload` (Function): Função a ser executada após o carregamento do arquivo.
- **Exemplo:**
```
formContext.addJavascriptFile({
file_url: "https://www.exemplo.com/script.js",
callback_onload: function() {
console.log("Script carregado!");
}
});
```
---
## **Busca de CEP**
### `buscaCEP.configurar(idCampoCep, idCamposPreenchiveis, callbacks)`
Configura a busca de CEP para campos específicos.
- **Parâmetros:**
- `idCampoCep` (String): ID do campo de CEP.
- `idCamposPreenchiveis` (String): ID dos campos a serem preenchidos com os dados do CEP.
- `callbacks` (Object): Callbacks para eventos relacionados à busca de CEP.
- **Exemplo:**
```
formContext.buscaCEP.configurar("cep", "endereco", {
onSuccess: function(data) {
console.log("CEP encontrado:", data);
}
});
```
---
## **Carregamento de Componentes CSHTML**
### `loadCsHtmlComponent(componentName, options)`
Carrega um componente CSHTML via AJAX.
- **Parâmetros:**
- `componentName` (String): Nome do componente.
- `options` (Object): Opções adicionais para o carregamento.
- **Exemplo:**
```javascript
function loadPartial() {
var cshtmlPartialName = "[coloque aqui o nome do partial cshtml que vc fez as regras de atualizar]";
formContext.loadCsHtmlComponent(cshtmlPartialName,
{
placeholderId: 'result_cshtml', //parametro opcional, se o cshtml retornar algum html e vc quiser, vc pode colocar o retorno dentro de algum placeholder, div, etc..
extraData: {
idRegistro: $('#guidRegistro').val(),
nome: $('#nome').val(),
email: $('#email').val()
},
onSuccess: function (result) {
formContext.msg.success("Executado com sucesso", "Confirmação");
},
onError: function (error) {
formContext.msg.error("Execução não realizada", "Erro");
console.log('error', error)
}
}
)
}
```
---
## **Manipulação de URLs**
### `url.getBaseUrl()`
Retorna a URL base do sistema.
- **Retorno:**
- String com a URL base.
- **Exemplo:**
```
console.log("URL base:", formContext.url.getBaseUrl());
```
---
### `url.getStaticFileUrl()`
Retorna a URL base para arquivos estáticos.
- **Retorno:**
- String com a URL de arquivos estáticos.
- **Exemplo:**
```
console.log("URL de arquivos estáticos:", formContext.url.getStaticFileUrl());
```
---
## **Idioma Atual**
### `currentLanguage.get()`
Retorna o idioma atual do sistema.
- **Retorno:**
- String com o código do idioma (ex: `'pt-BR'`, `'en-US'`).
- **Exemplo:**
```
console.log("Idioma atual:", formContext.currentLanguage.get());
```
---
### `currentLanguage.isEnglish()`
Verifica se o idioma atual é inglês.
- **Retorno:**
- `true` se for inglês.
- `false` caso contrário.
- **Exemplo:**
```
if (formContext.currentLanguage.isEnglish()) {
console.log("Idioma atual é inglês.");
}
```
---
### `currentLanguage.getIIF_TextFromCurrentLanguage(text_ptBR, text_ENG, text_ESP)`
Retorna o texto correspondente ao idioma atual.
- **Parâmetros:**
- `text_ptBR` (String): Texto em português.
- `text_ENG` (String): Texto em inglês.
- `text_ESP` (String): Texto em espanhol.
- **Retorno:**
- String com o texto no idioma atual.
- **Exemplo:**
```
const texto = formContext.currentLanguage.getIIF_TextFromCurrentLanguage("Olá", "Hello", "Hola");
console.log(texto); // Retorna "Olá" se o idioma for português.
```
---
## **Mensagens**
O módulo `formContext.msg` fornece funções para exibir e ocultar mensagens de alerta, erro, sucesso e aviso no sistema. Abaixo estão as funcionalidades disponíveis.
---
### **Ocultar Mensagens**
### `hide(forcarFechar)`
Oculta todas as mensagens exibidas.
- **Parâmetros:**
- `forcarFechar` (Boolean): Força o fechamento das mensagens.
- **Exemplo:**
```
formContext.msg.hide(true); // Oculta todas as mensagens, forçando o fechamento.
```
---
### **Exibir Mensagens**
### `show(type, msg, title, options)`
Exibe uma mensagem de alerta, erro, sucesso ou aviso.
- **Parâmetros:**
- `type` (String): Tipo da mensagem. Valores possíveis:
- `'warning'`: Mensagem de aviso.
- `'error'`: Mensagem de erro.
- `'success'`: Mensagem de sucesso.
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais para personalização da mensagem.
- **Exemplo:**
```
formContext.msg.show("success", "Operação realizada com sucesso!", "Sucesso", { timeout: 5000 });
```
---
### `warning(msg, title, options)`
Exibe uma mensagem de aviso.
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
formContext.msg.warning("Atenção: Este campo é obrigatório.", "Aviso");
```
---
### `error(msg, title)`
Exibe uma mensagem de erro.
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- **Exemplo:**
```
formContext.msg.error("Ocorreu um erro ao salvar o formulário.", "Erro");
```
---
### `success(msg, title, options)`
Exibe uma mensagem de sucesso.
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
formContext.msg.success("Formulário salvo com sucesso!", "Sucesso", { timeout: 3000 });
```
---
### **Funções Legadas de Mensagens**
As funções abaixo são mantidas para compatibilidade com versões anteriores, mas é recomendado utilizar as funções acima (`show`, `warning`, `error`, `success`).
### `hideMsgs()`
Oculta todas as mensagens exibidas.
- **Exemplo:**
```
formContext.msg.hideMsgs();
```
---
### `showMsgWarning(msg, title, options)`
Exibe uma mensagem de aviso (legado).
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
formContext.msg.showMsgWarning("Atenção: Este campo é obrigatório.", "Aviso");
```
---
### `showMsgError(msg, title)`
Exibe uma mensagem de erro (legado).
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- **Exemplo:**
```
formContext.msg.showMsgError("Ocorreu um erro ao salvar o formulário.", "Erro");
```
---
### `showMsgSuccess(msg, title, options)`
Exibe uma mensagem de sucesso (legado).
- **Parâmetros:**
- `msg` (String): Texto da mensagem.
- `title` (String): Título da mensagem.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
formContext.msg.showMsgSuccess("Formulário salvo com sucesso!", "Sucesso", { timeout: 3000 });
```
---
### **Exemplos de Uso de Mensagem**
##### Exibindo uma mensagem de sucesso:
```
formContext.msg.success("Dados salvos com sucesso!", "Sucesso", { timeout: 5000 });
```
##### Exibindo uma mensagem de erro:
```
formContext.msg.error("Erro ao processar a solicitação.", "Erro");
```
##### Ocultando todas as mensagens:
```
formContext.msg.hide(true);
```
## **Manipulação de Números**
### `number.convertString_toNumber(strValueToConvert, qtdCasasDecimais)`
Converte uma string formatada em número.
- **Parâmetros:**
- `strValueToConvert` (String): Valor em formato de string.
- `qtdCasasDecimais` (Number): Quantidade de casas decimais.
- **Retorno:**
- Número convertido.
- **Exemplo:**
```
const numero = formContext.number.convertString_toNumber("1.000,50", 2);
console.log(numero); // Retorna 1000.50
```
---
### `number.convertNumber_toStringFormatted(numberToConvert, qtdCasasDecimais)`
Converte um número em uma string formatada de acordo com o idioma.
- **Parâmetros:**
- `numberToConvert` (Number): Número a ser convertido.
- `qtdCasasDecimais` (Number): Quantidade de casas decimais.
- **Retorno:**
- String formatada.
- **Exemplo:**
```
const texto = formContext.number.convertNumber_toStringFormatted(1000.50, 2);
console.log(texto); // Retorna "1.000,50" em português.
```
---
## **Manipulação de Datas**
### `isCurrentMonthAndYear(data)`
Verifica se a data fornecida pertence ao mês e ano atuais.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY`.
- **Retorno:**
- `true` se a data for do mês e ano atuais.
- `false` caso contrário.
- **Exceções:**
- Lança um `TypeError` se a data estiver em um formato inválido.
- **Exemplo:**
```
formContext.datetime.validation.isCurrentMonthAndYear("25/10/2023"); // Retorna true se outubro de 2023 for o mês e ano atuais.
```
---
### `compare(date1, compare, date2)`
Compara duas datas com base no operador especificado.
- **Parâmetros:**
- `date1` (String): Primeira data no formato `DD/MM/YYYY`.
- `compare` (String): Operador de comparação. Valores possíveis:
- `'greater'` ou `'>'`
- `'greater-or-equal'` ou `'>='`
- `'less'` ou `'<'`
- `'less-or-equal'` ou `'<='`
- `'equal'` ou `'=='`
- `date2` (String): Segunda data no formato `DD/MM/YYYY`.
- **Retorno:**
- `true` ou `false`, dependendo da comparação.
- **Exceções:**
- Lança um `TypeError` se as datas estiverem em formato inválido ou se o operador de comparação não for reconhecido.
- **Exemplo:**
```
formContext.datetime.validation.compare("25/10/2023", "greater", "20/10/2023"); // Retorna true.
```
---
### `compareDatetime(datetime1, compare, datetime2)`
Compara duas datas e horários com base no operador especificado.
- **Parâmetros:**
- `datetime1` (String): Primeira data e horário no formato `DD/MM/YYYY HH:mm`.
- `compare` (String): Operador de comparação. Valores possíveis:
- `'greater'` ou `'>'`
- `'greater-or-equal'` ou `'>='`
- `'less'` ou `'<'`
- `'less-or-equal'` ou `'<='`
- `'equal'` ou `'=='`
- `datetime2` (String): Segunda data e horário no formato `DD/MM/YYYY HH:mm`.
- **Retorno:**
- `true` ou `false`, dependendo da comparação.
- **Exceções:**
- Lança um `TypeError` se os dados estiverem em formato inválido ou se o operador de comparação não for reconhecido.
- **Exemplo:**
```
formContext.datetime.validation.compareDatetime("25/10/2023 14:30", "greater", "25/10/2023 12:00"); // Retorna true.
```
---
### `compareToday(compare, date2)`
Compara a data atual com uma data fornecida.
- **Parâmetros:**
- `compare` (String): Operador de comparação. Valores possíveis:
- `'greater'` ou `'>'`
- `'greater-or-equal'` ou `'>='`
- `'less'` ou `'<'`
- `'less-or-equal'` ou `'<='`
- `'equal'` ou `'=='`
- `date2` (String): Data no formato `DD/MM/YYYY`.
- **Retorno:**
- `true` ou `false`, dependendo da comparação.
- **Exemplo:**
```
formContext.datetime.validation.compareToday("less", "30/10/2023"); // Retorna true se a data atual for menor que 30/10/2023.
```
---
## **Adição de Tempo**
### `day(data, days)`
Adiciona dias a uma data.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY` ou `DD/MM/YYYY HH:mm`.
- `days` (Number): Número de dias a serem adicionados.
- **Retorno:**
- Data resultante no mesmo formato da entrada.
- **Exemplo:**
```
formContext.datetime.add.day("25/10/2023", 5); // Retorna "30/10/2023".
```
---
### `month(data, months)`
Adiciona meses a uma data.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY` ou `DD/MM/YYYY HH:mm`.
- `months` (Number): Número de meses a serem adicionados.
- **Retorno:**
- Data resultante no mesmo formato da entrada.
- **Exemplo:**
```
formContext.datetime.add.month("25/10/2023", 2); // Retorna "25/12/2023".
```
---
### `year(data, years)`
Adiciona anos a uma data.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY` ou `DD/MM/YYYY HH:mm`.
- `years` (Number): Número de anos a serem adicionados.
- **Retorno:**
- Data resultante no mesmo
---
### `hour(data, hours)`
Adiciona horas a uma data e horário.
- **Parâmetros:**
- `data` (String): Data e horário no formato `DD/MM/YYYY HH:mm`.
- `hours` (Number): Número de horas a serem adicionadas.
- **Retorno:**
- Data e horário resultante no formato `DD/MM/YYYY HH:mm`.
- **Exemplo:**
```
formContext.datetime.add.hour("25/10/2023 14:30", 3); // Retorna "25/10/2023 17:30".
```
---
### `minute(data, minutes)`
Adiciona minutos a uma data e horário.
- **Parâmetros:**
- `data` (String): Data e horário no formato `DD/MM/YYYY HH:mm`.
- `minutes` (Number): Número de minutos a serem adicionados.
- **Retorno:**
- Data e horário resultante no formato `DD/MM/YYYY HH:mm`.
- **Exemplo:**
```
formContext.datetime.add.minute("25/10/2023 14:30", 15); // Retorna "25/10/2023 14:45".
```
---
## **Obtenção de Datas**
### `getLastDayOfCurrentMonth()`
Retorna o último dia do mês atual.
- **Retorno:**
- Data no formato `DD/MM/YYYY`.
- **Exemplo:**
```
formContext.datetime.getLastDayOfCurrentMonth(); // Retorna "31/10/2023" se outubro for o mês atual.
```
---
### `getLastDayOfMonth(data)`
Retorna o último dia do mês da data fornecida.
- **Parâmetros:**
- `data` (String): Data no formato `DD/MM/YYYY`.
- **Retorno:**
- Data no formato `DD/MM/YYYY`.
- **Exemplo:**
```
formContext.datetime.getLastDayOfMonth("25/10/2023"); // Retorna "31/10/2023".
```
---
## **Data e Horário Atuais**
### `getDateNow()`
Retorna a data e horário atuais.
- **Retorno:**
- Objeto `Date` representando a data e horário atuais.
- **Exemplo:**
```
formContext.datetime.getDateNow(); // Retorna a data e horário atuais.
```
---
### `getFormattedDateTime()`
Retorna a data e horário atuais formatados.
- **Retorno:**
- String no formato `DD/MM/YYYY HH:mm`.
- **Exemplo:**
```
formContext.datetime.getFormattedDateTime(); // Retorna "25/10/2023 14:30".
```
---
### `getFormattedDate()`
Retorna a data atual formatada.
- **Retorno:**
- String no formato `DD/MM/YYYY`.
- **Exemplo:**
```
formContext.datetime.getFormattedDate(); // Retorna "25/10/2023".
```
## **Manipulação de Campos**
O módulo `formContext.field` fornece funções para manipular campos em formulários, como verificar assinaturas, controlar campos obrigatórios, gerenciar selects, ocultar/exibir campos, habilitar/desabilitar campos e definir/obter valores. Abaixo estão as funcionalidades disponíveis.
---
### **Campo de Assinatura**
### `signature.isDefined(campokey)`
Verifica se uma assinatura foi preenchida em um campo específico.
- **Parâmetros:**
- `campokey` (String): ID do campo de assinatura.
- **Retorno:**
- `true` se a assinatura foi preenchida.
- `false` caso contrário.
- **Exemplo:**
```
if (formContext.field.signature.isDefined("assinatura")) {
console.log("Assinatura preenchida.");
}
```
---
### **Campos Obrigatórios**
### `required.ignoreRequired(campokey)`
Ignora a validação de campo obrigatório para um campo específico.
- **Parâmetros:**
- `campokey` (String): ID do campo.
- **Exemplo:**
```
formContext.field.required.ignoreRequired("campo1"); // Ignora a validação de campo obrigatório para "campo1".
```
---
### `required.unsetIgnoreRequired(campokey)`
Remove a configuração de ignorar validação de campo obrigatório para um campo específico.
- **Parâmetros:**
- `campokey` (String): ID do campo.
- **Exemplo:**
```
formContext.field.required.unsetIgnoreRequired("campo1"); // Remove a configuração de ignorar validação para "campo1".
```
---
### **Campos Select Personalizados**
### `customSelect.setDefaultStyle(selector)`
Aplica o estilo padrão do sistema a um select personalizado.
- **Parâmetros:**
- `selector` (String): Seletor do campo select.
- **Exemplo:**
```
formContext.field.customSelect.setDefaultStyle("meuSelect"); // Aplica o estilo padrão ao select com ID "meuSelect".
```
---
### **Manipulação de Itens em Campos Select Personalizados**
### `select.items.disable(campokey, valuesToDisable)`
Desabilita itens específicos em um campo select.
- **Parâmetros:**
- `campokey` (String): ID do campo select.
- `valuesToDisable` (String ou Array): Valor(es) do(s) item(ns) a ser(em) desabilitado(s).
- **Exemplo:**
```
formContext.field.select.items.disable("meuSelect", "valor1"); // Desabilita o item com valor "valor1".
formContext.field.select.items.disable("meuSelect", ["valor1", "valor2"]); // Desabilita os itens com valores "valor1" e "valor2".
```
---
### `select.items.enable(campokey, valuesToDisable)`
Habilita itens específicos em um campo select.
- **Parâmetros:**
- `campokey` (String): ID do campo select.
- `valuesToDisable` (String ou Array): Valor(es) do(s) item(ns) a ser(em) habilitado(s).
- **Exemplo:**
```
formContext.field.select.items.enable("meuSelect", "valor1"); // Habilita o item com valor "valor1".
formContext.field.select.items.enable("meuSelect", ["valor1", "valor2"]); // Habilita os itens com valores "valor1" e "valor2".
```
---
### `select.items.disableAll(campokey)`
Desabilita todos os itens de um campo select.
- **Parâmetros:**
- `campokey` (String): ID do campo select.
- **Exemplo:**
```
formContext.field.select.items.disableAll("meuSelect"); // Desabilita todos os itens do select.
```
---
### `select.items.enableAll(campokey)`
Habilita todos os itens de um campo select.
- **Parâmetros:**
- `campokey` (String): ID do campo select.
- **Exemplo:**
```
formContext.field.select.items.enableAll("meuSelect"); // Habilita todos os itens do select.
```
---
### **Visibilidade de Campos**
### `hide(campokey)`
Oculta um campo específico.
- **Parâmetros:**
- `campokey` (String ou Array): ID do campo ou lista de IDs.
- **Exemplo:**
```
formContext.field.hide("campo1"); // Oculta o campo com ID "campo1".
formContext.field.hide(["campo1", "campo2"]); // Oculta os campos com IDs "campo1" e "campo2".
```
---
### `show(campokey)`
Exibe um campo específico.
- **Parâmetros:**
- `campokey` (String ou Array): ID do campo ou lista de IDs.
- **Exemplo:**
```
formContext.field.show("campo1"); // Exibe o campo com ID "campo1".
formContext.field.show(["campo1", "campo2"]); // Exibe os campos com IDs "campo1" e "campo2".
```
---
### `hideAll()`
Oculta todos os campos do formulário.
- **Exemplo:**
```
formContext.field.hideAll(); // Oculta todos os campos.
```
---
### `showAll()`
Exibe todos os campos do formulário.
- **Exemplo:**
```
formContext.field.showAll(); // Exibe todos os campos.
```
---
### **Habilitação/Desabilitação de Campos**
### `disable(campokey)`
Desabilita um campo específico.
- **Parâmetros:**
- `campokey` (String ou Array): ID do campo ou lista de IDs.
- **Exemplo:**
```
formContext.field.disable("campo1"); // Desabilita o campo com ID "campo1".
formContext.field.disable(["campo1", "campo2"]); // Desabilita os campos com IDs "campo1" e "campo2".
```
---
### `enable(campokey)`
Habilita um campo específico.
- **Parâmetros:**
- `campokey` (String ou Array): ID do campo ou lista de IDs.
- **Exemplo:**
```
formContext.field.enable("campo1"); // Habilita o campo com ID "campo1".
formContext.field.enable(["campo1", "campo2"]); // Habilita os campos com IDs "campo1" e "campo2".
```
---
### `disableAll()`
Desabilita todos os campos do formulário.
- **Exemplo:**
```
formContext.field.disableAll(); // Desabilita todos os campos.
```
---
### `enableAll()`
Habilita todos os campos do formulário.
- **Exemplo:**
```
formContext.field.enableAll(); // Habilita todos os campos.
```
---
### **Definição e Obtenção de Valores de Campos**
### `setValue(campoKey, value, options)`
Define o valor de um campo.
- **Parâmetros:**
- `campoKey` (String): ID do campo.
- `value` (String): Valor a ser definido.
- `options` (Object): Opções adicionais.
- **Exemplo:**
```
formContext.field.setValue("campo1", "Valor exemplo"); // Define o valor do campo "campo1".
```
---
### `getValue(campoKey)`
Obtém o valor de um campo.
- **Parâmetros:**
- `campoKey` (String): ID do campo.
- **Retorno:**
- Valor do campo.
- **Exemplo:**
```
const valor = formContext.field.getValue("campo1"); // Obtém o valor do campo "campo1".
```
---
### `getText(campoKey)`
Obtém o texto exibido de um campo.
- **Parâmetros:**
- `campoKey` (String): ID do campo.
- **Retorno:**
- Texto do campo.
- **Exemplo:**
```
const texto = formContext.field.getText("campo1"); // Obtém o texto do campo "campo1".
```
---
### `getInt(campoKey)`
Obtém o valor de um campo como número inteiro.
- **Parâmetros:**
- `campoKey` (String): ID do campo.
- **Retorno:**
- Valor inteiro.
- **Exemplo:**
```
const valorInteiro = formContext.field.getInt("campo1"); // Obtém o valor inteiro do campo "campo1".
```
---
### `getDecimal(campoKey)`
Obtém o valor de um campo como número decimal.
- **Parâmetros:**
- `campoKey` (String): ID do campo.
- **Retorno:**
- Valor decimal.
- **Exemplo:**
```
const valorDecimal = formContext.field.getDecimal("campo1"); // Obtém o valor decimal do campo "campo1".
```
---
### `getFloat(campoKey)`
Obtém o valor de um campo como número de ponto flutuante.
- **Parâmetros:**
- `campoKey` (String): ID do campo.
- **Retorno:**
- Valor de ponto flutuante.
- **Exemplo:**
```
const valorFloat = formContext.field.getFloat("campo1"); // Obtém o valor de ponto flutuante do campo "campo1".
```
---
### `getNumber(campoKey)`
Obtém o valor de um campo como número (inteiro ou decimal, dependendo da máscara do campo).
- **Parâmetros:**
- `campoKey` (String): ID do campo.
- **Retorno:**
- Valor numérico.
- **Exemplo:**
```
const valorNumerico = formContext.field.getNumber("campo1"); // Obtém o valor numérico do campo "campo1".
```
## **Manipulação do Formulário**
O objeto `formContext.form` gerencia diversas funcionalidades relacionadas ao formulário, incluindo salvamento, rascunhos, ações e manipulação da toolbar.
#### **Estrutura do Objeto formContext.form**
- `formContext.form`: Contém funcionalidades relacionadas ao formulário.
- `save()`: Salva o formulário.
- `saveDraft()`: Salva o formulário como rascunho.
- `undoDraft()`: Desfaz um rascunho.
- `getFormActionOnSubmit()`: Obtém o tipo de envio do formulário.
- `invalidateForm(options)`: Inválida o submit do formulário.
- `toolbar`: Manipula a toolbar do formulário.
- `disableNativeSuccessMsg()`: Desabilita mensagens nativas de sucesso.
- `forceToSetStateFormToChanged()`: Força o status do formulário para "alterado".
- `isNew()`: Verifica se o formulário é novo.
- `isDraft()`: Verifica se o formulário é um rascunho.
- `action`: Define os tipos de ações possíveis no formulário.
### **Funções e Exemplos de Uso do formContext.form**
### `save()`
Salva o formulário.
```
formContext.form.save();
```
### `saveDraft()`
Salva o formulário como rascunho.
```
formContext.form.saveDraft();
```
### `undoDraft()`
Desfaz um rascunho.
```
formContext.form.undoDraft();
```
### `getFormActionOnSubmit()`
Obtém o tipo de envio do formulário.
```
var action = formContext.form.getFormActionOnSubmit();
console.log(action);
```
### `invalidateForm(options)`
Inválida o submit do formulário.
```
formContext.form.invalidateForm({ message: "Erro ao enviar!" });
```
### `toolbar.hide()`
Esconde a toolbar.
```
formContext.form.toolbar.hide();
```
### `toolbar.show()`
Exibe a toolbar.
```
formContext.form.toolbar.show();
```
### `toolbar.remove()`
Remove a toolbar.
```
formContext.form.toolbar.remove();
```
### `disableNativeSuccessMsg()`
Desabilita mensagens nativas de sucesso.
```
formContext.form.disableNativeSuccessMsg();
```
### `forceToSetStateFormToChanged()`
Força o status do formulário para "alterado".
```
formContext.form.forceToSetStateFormToChanged();
```
### `isNew()`
Verifica se o formulário é novo.
```
if (formContext.form.isNew()) {
console.log("Formulário novo");
}
```
### `isDraft()`
Verifica se o formulário é um rascunho.
```
if (formContext.form.isDraft()) {
console.log("Formulário em rascunho");
}
```
### Funções e Exemplos de Uso do formContext.form.action
### `action.isSave(formAction)`
Verifica se a ação é de salvar.
```
if (formContext.form.action.isSave(1)) {
console.log("Ação de salvar detectada");
}
```
### `action.isSaveDraft(formAction)`
Verifica se a ação é de salvar como rascunho.
```
if (formContext.form.action.isSaveDraft(2)) {
console.log("Ação de salvar rascunho");
}
```
### `action.isDiscardDraft(formAction)`
Verifica se a ação é de descartar o rascunho.
```
if (formContext.form.action.isDiscardDraft(3)) {
console.log("Ação de descartar rascunho");
}
```
### `action.isApproveFromWorkflow(formAction)`
Verifica se a ação é de aprovar no workflow.
```
if (formContext.form.action.isApproveFromWorkflow(4)) {
console.log("Ação de aprovação no workflow");
}
```
### `action.isRejectFromWorkflow(formAction)`
Verifica se a ação é de rejeitar no workflow.
```
if (formContext.form.action.isRejectFromWorkflow(5)) {
console.log("Ação de rejeição no workflow");
}
```
### `action.isReturnFromWorkflow(formAction)`
Verifica se a ação é de retorno no workflow.
```
if (formContext.form.action.isReturnFromWorkflow(6)) {
console.log("Ação de retorno no workflow");
}
```
### `action.isDelete(formAction)`
Verifica se a ação é de deleção.
```
if (formContext.form.action.isDelete(7)) {
console.log("Ação de deleção detectada");
}
```
### `action.isSaveChildForm(formAction)`
Verifica se a ação é de salvar um formulário filho.
```
if (formContext.form.action.isSaveChildForm(8)) {
console.log("Ação de salvar formulário filho");
}
```
### `action.isDeleteChildForm(formAction)`
Verifica se a ação é de deletar um formulário filho.
```
if (formContext.form.action.isDeleteChildForm(9)) {
console.log("Ação de deletar formulário filho");
}
```
---
## **Manipulação do Formulário Filho (Child Form)** `formContext.childForm`
### `datatable.refresh(tableid_relacaoFormularioPaiFilhoId)`
Atualiza a tabela do formulário filho que está no formulário pai.
#### Exemplo de Uso:
```
formContext.childForm.datatable.refresh("tabela123");
```
---
### `datatable.totalRows(tableid_relacaoFormularioPaiFilhoId)`
Retorna o número total de linhas da tabela do formulário filho.
#### Exemplo de Uso:
```
var total = formContext.childForm.datatable.totalRows("tabela123");
console.log("Total de linhas:", total);
```
---
### `datatable.getAllChildIds(tableid_relacaoFormularioPaiFilhoId)`
Retorna todos os IDs dos formulários filhos presentes na tabela.
#### Exemplo de Uso:
```
var ids = formContext.childForm.datatable.getAllChildIds("tabela123");
console.log("IDs dos formulários filhos:", ids);
```
---
### `datatable.getAllChildIdsOrdered(tableid_relacaoFormularioPaiFilhoId)`
Retorna todos os IDs dos formulários filhos respeitando a ordenação atual.
#### Exemplo de Uso:
```
var orderedIds = formContext.childForm.datatable.getAllChildIdsOrdered("tabela123");
console.log("IDs ordenados:", orderedIds);
```
---
### `datatable.getResultJson(tableid_relacaoFormularioPaiFilhoId)`
Retorna um JSON com os resultados apresentados na tabela do formulário filho.
#### Exemplo de Uso:
```
var result = formContext.childForm.datatable.getResultJson("tabela123");
console.log("Resultados da tabela:", result);
```
---
### `datatable.setOrder(tableid_relacaoFormularioPaiFilhoId, items_sorted)`
Reordena os itens da tabela filha conforme a lista ordenada de IDs.
#### Exemplo de Uso:
```
var sortedItems = [
{ formid: "123", draftid: "" },
{ formid: "456", draftid: "" },
{ formid: "789", draftid: "" }
];
formContext.childForm.datatable.setOrder("tabela123", sortedItems);
```
---
### `blockLinkEditOpening()`
Bloqueia a abertura do link ao clicar na linha do grid.
#### Exemplo de Uso:
```
formContext.childForm.blockLinkEditOpening();
```
---
### `unlockLinkEditOpening()`
Desbloqueia a abertura do link ao clicar na linha do grid.
#### Exemplo de Uso:
```
formContext.childForm.unlockLinkEditOpening();
```
## **Painéis** `formContext.panel`
O módulo `formContext.panel` fornece funções para manipular painéis (grupo de informações), como exibir, ocultar e controlar o estado de colapso (aberto/fechado). Abaixo estão as funcionalidades disponíveis.
---
### **Exibir e Ocultar Painéis**
### `hide(panelId)`
Oculta um painel específico.
- **Parâmetros:**
- `panelId` (String): ID do painel a ser ocultado.
- **Exemplo:**
```
formContext.panel.hide("painel1"); // Oculta o painel com ID "painel1".
```
---
### `show(panelId)`
Exibe um painel específico.
- **Parâmetros:**
- `panelId` (String): ID do painel a ser exibido.
- **Exemplo:**
```
formContext.panel.show("painel1"); // Exibe o painel com ID "painel1".
```
---
### **Expandir e Recolher Painéis**
O módulo `collapse` permite controlar o estado de colapso (aberto/fechado) de um painel.
### `collapse.toggle(panelId)`
Alterna o estado de colapso de um painel (abre se estiver fechado e fecha se estiver aberto).
- **Parâmetros:**
- `panelId` (String): ID do painel.
- **Exemplo:**
```
formContext.panel.collapse.toggle("painel1"); // Alterna o estado de colapso do painel com ID "painel1".
```
---
### `collapse.isCollapsed(panelId)`
Verifica se um painel está colapsado (fechado).
- **Parâmetros:**
- `panelId` (String): ID do painel.
- **Retorno:**
- `true` se o painel estiver colapsado.
- `false` se o painel estiver expandido.
- **Exemplo:**
```
const estaColapsado = formContext.panel.collapse.isCollapsed("painel1");
if (estaColapsado) {
console.log("O painel está fechado.");
} else {
console.log("O painel está aberto.");
}
```
---
### `collapse.close(panelId)`
Fecha (colapsa) um painel.
- **Parâmetros:**
- `panelId` (String): ID do painel.
- **Exemplo:**
```
formContext.panel.collapse.close("painel1"); // Fecha o painel com ID "painel1".
```
---
### `collapse.open(panelId)`
Abre (expande) um painel.
- **Parâmetros:**
- `panelId` (String): ID do painel.
- **Exemplo:**
```
formContext.panel.collapse.open("painel1"); // Abre o painel com ID "painel1".
```
---
### **Exemplos de Uso de funções de painéis**
### Ocultando e exibindo um painel:
```
formContext.panel.hide("painel1"); // Oculta o painel.
formContext.panel.show("painel1"); // Exibe o painel.
```
### Alternando o estado de colapso de um painel:
```
formContext.panel.collapse.toggle("painel1"); // Alterna entre aberto e fechado.
```
### Verificando se um painel está colapsado:
```
if (formContext.panel.collapse.isCollapsed("painel1")) {
console.log("O painel está fechado.");
} else {
console.log("O painel está aberto.");
}
```
### Fechando e abrindo um painel:
```
formContext.panel.collapse.close("painel1"); // Fecha o painel.
formContext.panel.collapse.open("painel1"); // Abre o painel.
```
# [Custom Page] Como Chamar um Método Global no Custom Page?
Em C#, utilize a classe **GlobalClass,** como no exemplo abaixo:
```c#
//pra chamar um metodo global por exemplo
await GlobalClass.ExecuteExampleAsync()
```
# Como Obter Parâmetros da Query String com JavaScript
## Introdução
A query string é a parte da URL que contém parâmetros, geralmente utilizados para passar informações entre páginas. No JavaScript, podemos extrair esses parâmetros utilizando a API `URLSearchParams`.
## Exemplo de URL
Vamos considerar a seguinte URL:
```
http://seusubdominio.agilifytlow.io?o=valor
```
Neste caso, o parâmetro `o` possui o valor `valor`.
## Código JavaScript
Podemos obter o valor do parâmetro `o` com o seguinte código:
```javascript
// Captura os parâmetros da query string
const urlParams = new URLSearchParams(window.location.search);
// Obtém o valor do parâmetro 'o'
const oValue = urlParams.get('o');
// Exibe o valor no console
console.log(oValue);
```
## Explicação do Código
1. `window.location.search` retorna a parte da URL após o `?`, ou seja, a query string (`?o=valor`).
2. `new URLSearchParams(window.location.search)` cria um objeto que permite manipular e acessar os parâmetros da query string.
3. `urlParams.get('o')` obtém o valor do parâmetro `o`, retornando `'valor'`.
4. `console.log(oValue);` exibe o valor capturado no console do navegador.
## Aplicações Comuns
- Captura de dados para preencher formulário
- Personalização de conteúdo baseado em parâmetros da URL
- Redirecionamentos e filtragens dinâmicas com base em parâmetros
## Tratamento de Parâmetros Opcionais
Caso o parâmetro não esteja presente na URL, `urlParams.get('o')` retornará `null`. Para evitar erros, podemos adicionar um valor padrão, nesse caso, deixamos em branco usando o '':
```javascript
const oValue = urlParams.get('o') || '';
console.log(oValue);
```
## Conclusão
A API `URLSearchParams` fornece uma maneira simples e eficiente de manipular parâmetros da querystring em JavaScript. Isso permite maior flexibilidade no desenvolvimento de aplicações web dinâmicas.
# Como escutar o evento javascript que ocorre antes de preencher uma tabela filha e depois de preencher
### Evento before-data-load que ocorre antes de carragar os dados na tabela filha
```javascript
//escutando o evento pós carregamento: before-data-load
//remover os botões de actions da table filha com id 3240ec20-313b-921e-c587-ea979a720690 por exemplo
$('#3240ec20-313b-921e-c587-ea979a720690').on('before-data-load', function (e) {
console.log("evento que ocorre antes de carregar a tabela, before-data-load);
});
```
### Evento data-loaded que ocorre antes de carragar os dados na tabela filha
```javascript
//escutando o evento pós carregamento: data-loaded
//remover os botões de actions da table filha com id 3240ec20-313b-921e-c587-ea979a720690 por exemplo
$('#3240ec20-313b-921e-c587-ea979a720690').on('data-loaded', function (e, result_json) {
console.log("evento que ocorre depois de carregar a tabela, data-loaded);
$('.grid-result .action-buttons').remove();
});
```
# Como remover os botões de editar e remover de cada linha de uma tabela filha e também o botão de adicionar um novo registro filho
## Para remover o botão de adicionar novo registro na tabela filha
##
#### **Javascript**: No form pai, coloque o código javacript abaixo, trocando o id do botão de adicionar da tabela filha que gostaria de remover
```javascript
$(document).on("ready", function () {
//troca o id abaixo pelo id do botão que de adicionar form filho
$("#btn-formulario-relacionado-3240ec20-313b-921e-c587-ea979a720690").remove();
});
```
#### **Css**: esconda o botão visualmente
No exemplo abaixo forçamos via css que o botão nem seja apresentado, caso o script javascript nao rode à tempo
```javascript
#btn-formulario-relacionado-3240ec20-313b-921e-c587-ea979a720690{
display: none;
}
```
## Para Remover o editar e remover de cada linha da tabela filha:
#### **Javascript**: No form pai, coloque o código javacript abaixo, trocando o Id para o id da tabela filha que gostaria de remover os actions buttons
```javascript
//remover os actions da table filha só por garantia
$('#trocar_aqui_para_o_guid_tabela_filha').on('data-loaded', function (e, result_json) {
$('.grid-result .action-buttons').remove();
});
```
#### **Css**: Deixe visualmente a coluna onde os actions buttons eram apresentados menores
No exemplo abaixo colocamos uma largura de 30px para qualquer tabela de formulário filho e também forçamos via css que os actions buttons nem seja apresentados, caso o script javascript nao rode à tempo
```javascript
.grid-result .action-buttons {
display: none !important;
}
.grid-result colgroup col:first-child {
width: 30px !important;
}
```
# Como validar se um e-mail está no formato válido?
### **Configurar o GlobalClass**
#####
##### Na GlobalClass, crie um arquivo C#, chamado EmailValidator ou algo similar
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-03/image.png)
##### Coloque dentro do C# criado a seguinte classe
```c#
public class EmailValidator{
public bool IsValidEmail(string email)
{
if (string.IsNullOrWhiteSpace(email))
return false;
string pattern = @"^[^@\s]+@[^@\s]+\.[^@\s]+$";
return System.Text.RegularExpressions.Regex.IsMatch(email, pattern, System.Text.RegularExpressions.RegexOptions.IgnoreCase);
}
}
```
### **Configurar a regra no Formulário**
Dentro do Businnes Rules de um formulário que você tenha um campo de e-mail que gostaria de validar, crie uma regra de negocio chamada Email Validator ou algo similar.
Para esse exemplo, estamos considerando que você tem um campo chamado "**email**" nesse formulário.
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-03/aaIimage.png)
Arraste a business rules criada para ser executada no evento de "Salvar" do formulário.
Dentro da businesse rules, arraste um componente de Promograçao em C# e cole o seguinte código:
Esse código chama a utiliza a GlobalClass EmailValidator e o metodo criado IsValidEmail para validar se o e-mail é valido.
```c#
public async Task ExecuteAsync(){
var email = FormContext.GetValue("email");
var emailValidator = GlobalClass.CreateInstanceEmailValidator();
if(!emailValidator.IsValidEmail(email)){
FormContext.WarningMessage("Informe um e-mail válido");
}
}
```
# Configuração de perfil de acesso para visualizar o Custom Menu. Quem poderá ver o item do menu?
**⚠ **Se o usuário não possuir permissão para a funcionalidade, o item de menu não será exibido para ele, mesmo que esteja configurado no Custom Menu.****
### **Configurou o item no menu mas ele ainda nao aparece para um determinado usuário?** **Esse artigo explica como resolver as regras de controle de acesso.** ### **Como funciona o controle de acesso aos itens do menu?** Na tela de Custom Menu, você pode definir quais itens de menu estarão disponíveis para os usuários do sistema. No entanto, é importante entender que a simples adição de um item ao menu **não garante que o usuário terá acesso a ele**. #### **Como funciona o controle de acesso?** O sistema verifica se o usuário tem permissão para visualizar e acessar cada item do menu com base no **Perfil de Acesso** associado a ele. Isso significa que: 1. **Cada item de menu está vinculado a uma funcionalidade específica do sistema**. 2. **Os usuários só verão os itens de menu para os quais possuem acesso à funcionalidade correspondente**. 3. **O acesso às funcionalidades é controlado dentro do Perfil de Acesso vinculado ao usuário logado**. #### **O que fazer para que um usuário veja um item no menu?** Para garantir que um usuário tenha acesso ao item de menu desejado, siga estes passos: 1. **Confirme o Perfil de Acesso do usuário logado:** Identifique qual Perfil de Acesso está sendo usado pelo usuário que deve visualizar o menu. 2. **Habilite a Funcionalidade:** Acesse a configuração do Perfil de Acesso e conceda permissão à funcionalidade associada ao item de menu. ⚠ **Se o usuário não possuir permissão para a funcionalidade, o item de menu não será exibido para ele, mesmo que esteja configurado no Custom Menu.** Caso tenha dúvidas, consulte a equipe responsável pela administração de perfis e permissões no sistema. # Como destacar informações importantes, como alertas, sucessos, erros no corpo de um Formulário? Adicione avisos coloridos no Formulário. A imagem abaxio exemplifica 4 formas de colocar avisos coloridos: [](https://wiki.agilityflow.io/uploads/images/gallery/2025-03/cdnimage.png) ## Introdução Este guia explica como adicionar avisos coloridos (amarelo, azul, verde e vermelho) em um formulário usando HTML e classes CSS. Os avisos são úteis para destacar informações importantes, como alertas, sucessos, erros e informações. ## Passo a Passo ### 1. Na customização do Form, crie um componente `cshtml` Crie um componente `cshtml` para definir os avisos coloridos. Você pode nomear o arquivo como `AvisosColoridos`.
Essa versão de um aviso de warning
Essa versão de um aviso de informação
Essa versão de um aviso de sucesso
Essa versão de um aviso de erro
Essa opção não copia os registos dos formulários filhos ou tabelas. Caso seja necessário, utilize a técnica demonstrada no tópico abaixo nesse mesmo artigo.
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-04/image.png) ## **Cópia Completa, considerando tabelas filhas** #### **Crie e configure o botão para copiar** 1. **Entre no formulário que você deseja colocar o botão de "Copiar"** 2. **Crie um botão chamado "Copiar", marque para que esse botão** 3. **Marque para esse botão ser mostrado na barra de botões do formulario** 4. **[](https://wiki.agilityflow.io/uploads/images/gallery/2025-04/Vvbimage.png)** 5. **Marque para esse botão Não ser mostrado dentro do formulario** 6. **Deixa o botão fora do layout do formulario, ele nao precisa ser arrastado para dentro do formularío, caso esteja, remova** 7. **no clique do botão em javascript, confiure para chamar a função js: copiarRegistro()** [](https://wiki.agilityflow.io/uploads/images/gallery/2025-04/Fm8image.png) ### No Visual Code Editor do Formulário Adicione o Javascript abaixo ```javascript function copiarRegistro() { //só deixa copiar caso nao seja um form novo if (formContext.form.isNew()) { pageMsg.formContext.msg.showMsgWarning("Salve o formulário antes de copiar", "Falha ao copiar") return; } //chama o cshtml "CopiarRegistro" que fará a copia formContext.loadAjax("CopiarRegistro", { onSuccess: function (response) { //em caso de sucesso, mostra a msg de sucesso e já redireciona o usuario para a proxima pagina pageMsg.showMsgSuccess("Orçamento Duplicado", "Sucesso"); //em caso de sucesso, redireciona para a url que foi criado //importante mudar aqui para o id da estrutura do formulario correto window.parent.location = window.parent.base_url + "fluxo/index/74ad209b-ee6a-4ae3-9920-2caad2bc7451/" + response.trim() ; }, onError: function (err) { pageMsg.formContext.msg.showMsgWarning("Falha: " + err, "Falha ao copiar") console.error("Erro ao carregar o registro:", err); } }); } ``` Crie um cshtml chamado **CopiarRegistro** [](https://wiki.agilityflow.io/uploads/images/gallery/2025-04/6psimage.png) Cole o código cshtml / C# abaixo: ```c# @{ /* NESSE EXEMPLO, ESTOU COPIANDO O FORMULARIO ORÇAMENTO E OS ORÇAMENTO ITEM QUE É FILHO DE ORÇAMENTO */ //MUDAR AQUI PARA OS IDS DAS ESTRUTURA DOS FORMULARIOS var idEstruturaFormularioOrcamento = Guid.Parse("74ad209b-ee6a-4ae3-9920-2caad2bc7451"); var idEstruturaFormularioItemOrcamento = Guid.Parse("0c114359-8cb1-4d42-85b4-9882417c386a"); //CRIAR O DICTIONARY COM OS DADOS DO FORM PAI, ORÇAMENTO var values = new DataDictionary(); values.Add("numero",PageContext.GetValue("numero")); values.Add("cliente",PageContext.GetValue("cliente")); //SALVAR O ORÇAMENTO E RECUPERA O ID CRIADO var orcamentoId = await PageContext.SaveEntityAsync(idEstruturaFormularioOrcamento, values); var paramsQueryItemOrcamento = new List| Campo | Descrição |
|---|---|
| `fca_id` | ID do campo específico de upload (\*\*\* veja na imagem abaixo como pegar esse iD) |
| `frm_id` | ID do formulário preenchido (registro do formulário) |
| `deletado` | Define se o arquivo foi excluído logicamente. Use `false` para considerar apenas arquivos ativos. |
| Regra | Descrição |
|---|---|
| ✅ Incluir as tags `{{pagination-clause}}`, `{{orderby}}` e `{{pagination-column}` na query | Elas serão substituídas automaticamente no runtime |
| ✅ Garantir que a query nunca retorne mais do que a configuração `page size` (qtd de registros esperado) | O sistema lançará erro se exceder |
| ✅ Adicionar `deletado = false` em **todas as tabelas** utilizadas | Obrigatório |
| ❌ Nunca usar `ORDER BY`, `LIMIT`, `OFFSET` diretamente na query sem `[disable(auto-pagination)]` | Vai lançar erro |
| ❌ Não usar `INSERT`, `UPDATE`, `DELETE` | Apenas SELECTs são permitidos |
[](https://wiki.agilityflow.io/uploads/images/gallery/2025-12/image.png)
# Como adicionar e atualizar itens em uma tabela de formulário filho
# Como adicionar e atualizar itens em uma tabela de formulário filho
Este guia explica como **inserir e atualizar registros em uma tabela de formulário filho** a partir de um **formulário pai**, utilizando **JavaScript + componente CsHtml (partial)**.
O exemplo usa dados fictícios apenas para demonstrar o funcionamento.
---
## Visão geral da solução
O fluxo funciona assim:
1. Criamos um **Formulário Filho** (referenciando o pai).
2. Criamos um **Formulário Pai** e associamos o formulário filho como uma tabela.
3. No formulário pai, criamos um **botão** que chama um método JavaScript no onclick.
4. Esse método JavaScript carrega um **componente CsHtml** (partial).
5. Dentro do CsHtml, executamos um loop para **inserir registros na tabela do formulário filho**.
6. Após a execução, a tabela é **atualizada automaticamente na tela**.
---
## 1. Criar o Formulário Pai
Primeiro, crie um **formulário pai** contendo os campos que você julgar necessário.
- Valor da Operação
- Repsonsável pela operação
## 2. Criar o Formulário Filho
Em seguida, crie um **formulário filho** contendo os campos que serão inseridos na tabela.
Exemplo de campos:
- Tipo de recebível
- Cedente
- Sacado
- Quantidade de parcelas
- Data de vencimento
- Valor nominal
- **id\_pai (IMPORTANTE, aqui você cria o campo que vai associar o form pai e filho) \*\*\***
\*\*\* detalhes de como fazer a relação Pai e Filho podem ser encontrado em outros docs na Wiki do agilityflow
---
## 2. Associar o Formulário Pai ao Filho
No formulário pai:
- Associe o formulário filho como uma tabela
- Garanta que ele esteja configurado como **tabela de formulário filho**
**Recupere o Id dessa tabela, no nosso exemplo é: "`0e7f3b2f-dd68-a2d4-fe4e-b68e1c3957ef"`**
**Usaremos mais abaixo, algo assim:**
**`var tableid_recebivel = Guid.Parse("0e7f3b2f-dd68-a2d4-fe4e-b68e1c3957ef"); `**
---
## 3. Criar o componente CsHtml (partial)
Agora criamos o **componente CsHtml** que será carregado pelo JavaScript, crie com o nome **import\_fake**
Esse componente será responsável por:
- Inserir registros no formulário filho
- Retornar o controle para o JavaScript
---
## 4. Lógica do CsHtml para inserir registros
Dentro do CsHtml, usamos C# para inserir os dados.
Neste exemplo:
- Só inserimos se o formulário for **novo**
- Ignoramos formulários em **rascunho**
- Criamos **10 registros fictícios** apenas para demonstração
Exemplo:
```c#
@{
//id da tabela
var tableid_recebivel = Guid.Parse("0e7f3b2f-dd68-a2d4-fe4e-b68e1c3957ef"); //table id DO FORMULÁRIO FILHO
//testa se é um form NOVO e se NÂO é RASCUNHO pois nesse exemplo quero inserir apenas para formulário NOVOS que não sejam RASCUNHOs
var isNovo = Model.Id.IsNullOrEmpty();
var isRascunho = !Model.RascunhoId.IsNullOrEmpty();
if(isNovo && !isRascunho){
for (var i = 0;i<10;i++){
var parcelas = Random.Shared.Next(1, 19);
//info do formulario filho
var campos_e_valores = new DataDictionary();
campos_e_valores["tipo_de_recebivel"] = "e253f97a-8315-4ed9-b5f8-9820f7152a60";
campos_e_valores["cedente"] = "335e3af4-f97d-4cf4-9b5c-faf5d14c726d";
campos_e_valores["sacado"] = "12a5c07d-d955-4dc2-85cf-55b20d889761";
campos_e_valores["qtd_de_parcelas"] = parcelas.ToString();
campos_e_valores["data_de_vencto"] = DateTime.Now.AddMonths(1).ToUserTimeZone().ToString();
campos_e_valores["valor_nominal"] = "35000";
//adiciona na tabela filha
//retorna o id do rascunho desse formlario filho, pois o ID final só será gerado ao Salvar o Formulario PAi
var formRascunhoId = await PageContext.AddChildFormAsync( tableid_recebivel, campos_e_valores);
}
}
}
```
---
## 5. Criar o botão no Formulário Pai
No formulário pai, crie um botão com um **onclick** chamando uma função JavaScript.
Exemplo:
Esse botão será responsável por iniciar o processo de inserção.
---
## 6. JavaScript do Formulário Pai
No JavaScript do formulário pai, carregamos o **componente CsHtml** usando `loadCsHtmlComponent`.
Esse componente cshtml executará a lógica de inserção e ao retornar faremos via Javacript o "refresh" da tabela para que os dados inseridos apareçam
Exemplo:
```javascript
function import_fake() {
formContext.loadCsHtmlComponent("import_fake", {
onSuccess: function (result) {
// formContext.msg.success("Executado com sucesso", "Confirmação");
var tableid_recebivel = "0e7f3b2f-dd68-a2d4-fe4e-b68e1c3957ef"
formContext.childForm.datatable.refresh(tableid_recebivel);
}
});
}
```
Pontos importantes:
- O `onSuccess` é executado após o CsHtml terminar.
- O `datatable.refresh` garante que os novos registros apareçam na tela.
## 7. O que acontece internamente
- Cada chamada de `AddChildFormAsync` cria um **registro no formulário filho**
- O ID final do registro só será gerado quando o **formulário pai for salvo**
- O retorno do método é o **ID do rascunho**, usado internamente pelo sistema
---
## 8. Atualizando os dados da tabela
Após o CsHtml finalizar:
- O JavaScript executa `datatable.refresh`
- A tabela do formulário filho é recarregada
- Os registros recém-inseridos aparecem imediatamente na tela
---
## Observações importantes
- Este exemplo usa dados **fictícios**
- Sempre valide se o formulário não está em rascunho
- Para atualizações, a lógica pode ser adaptada para:
- Buscar registros existentes
- Alterar valores
- Inserir apenas registros que não existam
### Se você precisar atualizar um registro basta seguir o código usando o **PageContext.UpdateChildForm como no exemplo abaixo:**
```c#
@{
//id da tabela
var tableid_relacaoFormularioPaiFilhoId = Guid.Parse("0dd874a9-9c39-4e4f-acc3-02015a60f6bb"); //table id DO FORMULÁRIO FILHO
//info do formulario filho
var campos_e_valores = new DataDictionary();
campos_e_valores["nome_filho"] = "Exemplo 01 - " + DateTime.Now;
campos_e_valores["valor_numerico"] = PageContext.FormatNumberToString_EnglishFormat(999999.99, 2);
//testa se é um form NOVO e se NÂO é RASCUNHO pois nesse exemplo quero inserir apenas para formulário NOVOS que não sejam RASCUNHOs
var isNovo = Model.Id.IsNullOrEmpty();
var isRascunho = !Model.RascunhoId.IsNullOrEmpty();
if(isNovo && !isRascunho){
//adiciona na tabela filha
//retorna o id do rascunho desse formlario filho, pois o ID final só será gerado ao Salvar o Formulario PAi
var formRascunhoId = PageContext.AddChildForm( tableid_relacaoFormularioPaiFilhoId, campos_e_valores);
//atualiza o item que acabamos de adicionar, apenas para demonstração
Guid? idFormularioFilho = null;
campos_e_valores["nome_filho"] = "Exemplo Atualizado 0123456789 - " + DateTime.Now;
PageContext.UpdateChildForm(
//se ainda não foi salvo pela primeira vez, o item só terá o Id do Rascunho
rascunhoId,
//se já foi salvo pela primeira vez, o item já terá o Id
//então passa aqui o id (nesse exemplo estamos passando null para atualizar apenas o
idFormularioFilho,
tableid_relacaoFormularioPaiFilhoId,
campos_e_valores);
}
}
```