TREINAMENTO MÓDULO PRIME

1

Treinamento Configurador

Módulo Prime 2

Caderno 3

TREINAMENTO MÓDULO PRIME

2

Conteúdo

1 Introdução ................................................................................................ 3

A quem se orienta ..................................................................................... 3

Tópicos Abordados ................................................................................... 3

2 Ajustes no Processo .................................................................................. 4

3 Validação de Campos ................................................................................ 5

Validando E-mail ................................................................................... 5

Exercício - Validando CNPJ .................................................................... 5

4 Validação de Arquivos .............................................................................. 6

Exercício – Validando o Ofício ................................................................ 6

5 Validando Datas ........................................................................................ 7

Validando Data de Nascimento Posterior à Data Atual .............................. 7

6 Validando Grids Vazias .............................................................................. 8

7 Alteração de Campos .............................................................................. 10

Exercício - Alterando Labels .................................................................. 10

Exercício – Alterando Valores ................................................................ 10

Exercício – Alterando o tamanho dos Campos ........................................ 10

8 Assinatura Eletrônica de Documentos .................................................... 11

TREINAMENTO MÓDULO PRIME

3

1 Introdução

A quem se orienta

A pessoas que fazem mapeamentos e gestão de processos organizacionais, que irão atuar na automatização dos mesmos no Lecom BPM. Este módulo especificamente tratará de tópicos avançados na automação de processos via LecomBPM e é destinado a alunos que já cursaram o Módulo Prime 1.

Tópicos Abordados

Neste caderno, será abordado Codificação Javascript com os seguintes tópicos:

• Validação de campos (CPF, CNPJ e E-mail).

• Validação de arquivos (tamanho e extensão).

• Validação de data.

• Validação de grid vazia.

• Alteração de campos (labels, valores e tamanhos).

• Carregamento de opções de lista via JSON.

• Assinatura eletrônica de documentos.

TREINAMENTO MÓDULO PRIME

4

2 Ajustes no Processo

Este caderno dará continuidade ao que foi apresentado no caderno anterior, detalhando outras possibilidades dentro da API Javascript. Para prosseguirmos, entretanto, será necessário fazermos alguns ajustes no nosso processo, criando e configurando novos campos para aplicarmos os conhecimentos.

• Crie dois campos de linha de texto, CNPJ e NOME_EMPRESA, logo após o campo EMAIL. Estes campos devem ser obrigatórios na etapa de Preencher Dados do

Solicitante, ocultos na etapa de Preencher Dados da Solicitação, e somente-leitura em todas as outras. O campo CNPJ deve ter tamanho 20 e máscara para CNPJ. O campo

NOME_EMPRESA deve ter tamanho 50.

• Crie um campo de data, DATA_SOLICITACAO, logo após o campo DESCRICAO. Este

campo deve ser oculto na etapa de preencher dados da solicitação e somente leitura em todas as outras etapas.

• Crie um campo do tipo template, COMPROVANTE, após o campo DATA_SOLICITACAO.

Manter a configuração padrão para este campo (importar). Este campo deve ser oculto na etapa de preencher dados do solicitante, obrigatório para aprovação na etapa de

preencher dados da solicitação e somente leitura em todas as outras etapas.

• Crie também dois campos de linha de texto em uma grid: campos NOME_CONTATO (tamanho 50) e TELEFONE_CONTATO (tamanho 20, máscara de telefone); grid

CONTATOS. Os campos devem ser criados após o campo COMPROVANTE, e devem ser

ocultos na etapa de preencher dados do solicitante, obrigatórios para aprovação na etapa de preencher dados da solicitação e somente-leitura em todas as outras etapas.

Ao criar campos do tipo Grid, lembre-se de, nas opções avançadas, em Exibição, selecionar a opção Grid e preencher ou selecionar a identificação da Grid desejada.

Após criar todos os campos propostos, gere a tabela e abra uma nova solicitação com o usuário cidadão para testar os novos campos.

TREINAMENTO MÓDULO PRIME

5

3 Validação de Campos

No caderno anterior, fizemos a validação de alguns campos com base nas regras de negócio definidas, relacionadas ao tipo de solicitação e ao tamanho informados. Agora, adicionaremos validações relacionadas a valores de campos, independentemente de regras de negócio.

Validando E-mail

A primeira validação que iremos adicionar é a validação de e-mail. Da mesma maneira que o formulário se comportou quando tentamos adicionar um tipo ou tamanho inválido para a solicitação, o campo de e-mail será apagado quando o usuário tentar informar um e-mail inválido. Fazendo uso da biblioteca functions_v2, esta funcionalidade pode ser implementada em algumas linhas. Crie uma função chamada addValidacaoEmail. No corpo da função, adicione o código descrito abaixo:

Ao final, adicione a chamada da função criada no setForm, dentro do case da etapa de

Preencher Dados do Solicitante.

Exercício - Validando CNPJ

Após validarmos o e-mail, adicione a validação de CNPJ, da mesma maneira. O campo CPF do nosso serviço vem preenchido com os dados do portal de serviços, portanto não é necessário implementar a sua validação. Se desejarem, basta replicar o que foi feito para o CNPJ e e-mail.

TREINAMENTO MÓDULO PRIME

6

4 Validação de Arquivos

Em algumas situações, o solicitante / analista deve poder incluir apenas alguns determinados tipos de arquivo, ou arquivos com um tamanho máximo de alguns MB. Através de implementações Javascript, podemos bloquear arquivos que não se enquadrem nos critérios estabelecidos. Fazendo uso da biblioteca functions_v2, podemos adicionar essa restrição em uma única chamada de função. Adicione ao case da etapa de preencher dados da solicitação, na função setForm, a seguinte linha:

De acordo com a configuração acima, na etapa de Preenchimento de dados de solicitação, o campo COMPROVANTE só pode receber arquivos de até 20MB com as extensões pdf, doc e docx.

Exercício – Validando o Ofício

Adicione uma validação de arquivo para que o analista só consiga inserir ofícios de até 5MB e no formato PDF.

TREINAMENTO MÓDULO PRIME

7

5 Validando Datas

Em diversas situações, os valores informados nos campos de data precisam passar por uma determinada validação: Não podemos fazer agendamentos para datas passadas, não podemos informar fatos ocorridos em datas futuras, também não podemos informar datas inválidas, com meses, dias e anos incorretos. Para fazer estas validações, a functions_v2 possui algumas funções implementadas.

Validando Data de Nascimento Posterior à Data Atual

A validação que implementaremos é relacionada à data de nascimento: não pode ser posterior à data atual. Para isso, usaremos a função validaDataPassada, da functions_v2. Crie uma função addValidacaoDataNascimento, que vai fazer a verificação de quando o campo de Data de Nascimento for alterado para chamar a função validaDataPassada, da seguinte forma:

Após criar a função, adicione a sua chamada no setForm, no case da etapa de preencher dados do solicitante.

TREINAMENTO MÓDULO PRIME

8

6 Validando Grids Vazias

Em alguns serviços, os usuários devem informar ao menos um item em determinadas grids para poder avançar para as próximas etapas. Para adicionarmos esse tipo de validação, utilizaremos algumas funcionalidades da API que são relacionadas a grids e a função validaFormOnSubmit, que ainda não foi utilizada. Comece criando uma nova função, validarGridPreenchida. Esta função será uma função genérica, que vai receber como parâmetro o nome de uma Grid e vai nos retornar true quando houver ao menos um elemento na grid, ou false quando a grid estiver vazia.

TREINAMENTO MÓDULO PRIME

9

Vamos agora completar a função criada, obtendo o número de linhas preenchidas e fazendo a validação.

A função dataRows() retorna um array contendo as linhas de determinada grid. O valor retornado pelo dataRows pode ser utilizado para outros tipos de validação, relacionados aos dados que foram preenchidos. Utilizamos então o parâmetro length para obtermos o tamanho do array dataRows. Neste caso, validamos se o tamanho é maior que 0 ou não. Implementada a função validarGridPreenchida, vamos até a função validarFormOnSubmit para implementar a verificação: quando o usuário tentar enviar a solicitação para análise, vamos executar a função validarGridPreenchida e, caso não haja nenhuma linha na grid, vamos bloquear o envio na página e exibir uma mensagem de erro:

TREINAMENTO MÓDULO PRIME

10

7 Alteração de Campos

Podemos realizar alguns tipos de alterações em campos através da API Javascript. Os três tipos de alteração que abordaremos são: Label, valor preenchido e tamanho no formulário.

Exercício - Alterando Labels

A label pode ser alterada selecionando o campo desejado com o comando Form.fields(“CAMPO”) e então usando o comando .label(“Novo valor da Label”); Ex.: Form.fields(“CAMPO”).label(“Novo valor da Label”); Vamos exercitar a alteração do label de um campo da seguinte forma: Nas etapas de Preencher Dados de Solicitante e Preencher Dados de Solicitação, vamos criar uma função Javascript que altere a label do campo LBL_ANALISE para “Ajustes Necessários”.

Exercício – Alterando Valores

Da mesma forma, podemos alterar o valor de um campo através do comando .value(); Ex.: Form.fields(“CAMPO”).value(“Novo valor do campo”); Vamos exercitar a alteração de valor de um campo setando no carregamento da etapa de Preencher Dados de Solicitação o valor “Kg” no campo Unidade caso este campo não esteja preenchido.

Exercício – Alterando o tamanho dos Campos

É possível alterarmos o tamanho que os campos aparecem no formulário, alterando suas propriedades via JQuery. Para isso, é necessário executarmos o seguinte código: $("#input__NOME_CAMPO").removeClass("atual").addClass("nova"); As classes atual e nova podem ser de 3 tipos:

• m3: representam campos pequenos, de ¼ do tamanho horizontal do formulário;

• m6: representam campos médios, de ½ do tamanho horizontal do formulário;

• m12: representam campos grandes, do tamanho total horizontal do formulário;

Para alterarmos então o tamanho do campo, é necessário removermos a classe relativa ao tamanho atual e adicionarmos a nova classe desejada. Crie uma função que transforme o campo Tipo de solicitação para ocupar o tamanho total do formulário, e os campos tamanho da solicitação e unidade para ocuparem metade do tamanho horizontal. Esta função pode ser chamada em todas as etapas, independentemente de os campos estarem presentes ou não.

TREINAMENTO MÓDULO PRIME

11

8 Assinatura Eletrônica de Documentos

É possível adicionarmos a opção para que um documento seja assinado eletronicamente pela plataforma da Lecom. Para possibilitar a assinatura, faça o download do arquivo indicado abaixo:

assinatura_js.zip

Antes de configurar o arquivo na plataforma, devemos alterar dois aspectos:

• O nome do arquivo para assinatura_INICIAIS.js;

• Na primeira linha do arquivo, deve ficar indicado o nome do campo que contém o

documento que será assinado. No nosso caso, manteremos o campo “OFICIO”.

Terminadas as configurações do arquivo, é necessário realizar o seu upload na plataforma LecomBPM. Para isso, siga os mesmos passos indicados no caderno anterior. Finalizado o upload, vamos configurar o carregamento deste arquivo na etapa. É interessante ressaltar que, ao contrário do arquivo de scripts padrão da etapa, o script de assinatura eletrônica de documentos deve ser carregado somente na etapa onde a assinatura será realizada. No nosso caso, o script deve ser carregado na etapa Inserir Ofício. Executando a etapa, surge um novo botão ao lado dos botões de upload, edição ou deletar arquivo. O botão azul é o botão que realiza a assinatura. Ao clicar pela primeira vez, o BPM fará uma busca em seu computador para verificar se o assinador digital Lecom está executando. Se não for possível localizar o assinador executando, será exibida uma mensagem com um link para fazer o download do instalador.

Caso o assinador Lecom esteja executando, será exibida uma janela para que o usuário selecione o certificado digital que ele deseja utilizar para assinar o documento.

TREINAMENTO MÓDULO PRIME

12

Selecionado o certificado, clique em OK para que o documento seja assinado.