Fluxo de Processos

1. Geral

Nesta documentação, você aprenderá a criar um CRM no Mitra, utilizando como referência o template de projeto "Fluxo de Processos". Este material aprofunda os conceitos de modal de detalhes, board, tela de análise simples e tela mobile.

Para aproveitar ao máximo este guia, recomendamos revisar as documentações de Cadastro Básico e Cadastro Detalhado, onde são explicadas as etapas fundamentais para a criação de um CRUD com Detalhes. Com esse conhecimento, você estará preparado para aprofundar-se nos conceitos mais complexos apresentados aqui.

2. Videoaulas de Referência

Esta documentação foi desenvolvida com base em três vídeos da série "CRM", que estão disponíveis a seguir:

  • Parte 1

  • Parte 2

  • Parte 3

3. Passo a Passo para Criar um CRM

Partindo do princípio que você já tenha aprendido a criar um CRUD e seu detalhamento, vamos aprender agora a configurar um CRM do zero.

3.1. Primeiro Passo

Crie um novo projeto e importe para o seu banco de dados os dados da planilha disponibilizada a seguir:

Para mais detalhes sobre a configuração da importação de arquivos CSV, consulte a documentação de Conexões ou a seção de FAQs sobre Importação de Dados CSV.

3.2. Segundo Passo

No menu de Interface, crie uma nova tela, atribua um nome e selecione o modelo "Kanban e Botão". Esses modelos prontos facilitam a construção da interface, proporcionando uma estrutura visual intuitiva e funcional.

3.3. Terceiro Passo

Configure a VIEW de SQL do componente Board utilizando a seguinte consulta SQL:

SELECT ID, 
  DESCR_PROSPECT AS 'Prospect',
  DESCR_EXECUTIVO AS 'Executivo',
  CONCAT(DESCR_TEMPERATURA, 
        CASE WHEN ID_TEMPERATURA = -999 THEN '#F6546A'
        WHEN ID_TEMPERATURA = -998 THEN '#8444FF'
        WHEN ID_TEMPERATURA = -997 THEN '#F7931A' END) AS 'Temperatura',
  ID_ETAPA AS 'Etapa', 
  VALOR_NEGOCIACAO AS 'Valor Negociação'
FROM CAD_NEGOCIACOES
WHERE (ID_STATUS_NEGOCIACAO = -999 OR ID_ETAPA = 6) 
      AND ID > 0
      AND (ID_EXECUTIVO = :ID_EXECUTIVO OR :ID_EXECUTIVO = 'Todos')

Essa consulta retorna os dados das negociações filtradas de acordo com os seguintes critérios:

  • A coluna Temperatura exibe uma tag que combina a descrição da temperatura com uma cor específica, definida na consulta.

  • São exibidos apenas os registros com status aberto ou aqueles pertencentes à etapa positivado, que pode incluir status fechado.

  • O filtro ID > 0 garante que o registro nativo do Mitra "Sem negociação" não seja exibido.

  • A consulta também filtra os dados pelo executivo selecionado. Caso nenhum executivo tenha sido selecionado, a variável assume o valor "Todos", permitindo que todas as negociações sejam exibidas.

Configure também a opção Personalizar do Board, selecionando as colunas correspondentes para exibição.

Se tiver dúvidas sobre a configuração, consulte a documentação específica do componente, que apresenta um guia passo a passo sobre o processo: Board.

3.4. Quarto Passo

Adicione um seletor de Executivo na tela para permitir a filtragem das negociações por executivo. Esse seletor permitirá que o usuário visualize apenas as negociações associadas a um executivo específico ou, caso nenhum seja selecionado, exiba todas as negociações disponíveis.

3.5. Quinto Passo

Crie um Formulário de Negociações e vincule-o ao botão presente no modelo da tela, permitindo a criação de uma nova negociação.

Ao configurar o formulário, atente-se aos seguintes pontos:

  • Status da Negociação: Toda nova negociação deve ser criada com o status Aberta.

  • Etapa Inicial: A negociação deve ser automaticamente vinculada à primeira etapa, Lead In.

Além disso, crie um Formulário de Prospect e configure-o para que seja possível adicionar um novo prospect diretamente no momento da criação de uma negociação, facilitando o processo.

3.6. Sexto Passo

Crie um Modal de Detalhes de Negociações e vincule-o como uma interação do Board, permitindo que os usuários visualizem informações detalhadas sobre cada negociação ao clicar no item correspondente.

Em seguida, adicione uma aba do tipo Timeline dentro do modal de detalhes. Ao criar essa aba, o Mitra gera automaticamente uma tabela no banco de dados para armazenar os itens que serão registrados na timeline. Essa tabela é chamada Item de Negociações e contém os seguintes atributos:

  • Tabela: Item de Negociações

    • ID

    • Descrição

    • Título (Item de Negociações)

    • Descrição (Item de Negociações)

    • FK de Negociações (Chave estrangeira vinculando o item à negociação correspondente)

Além da tabela, o Mitra também gera automaticamente um Formulário de Item de Negociações, facilitando a criação de novos itens na timeline.

3.7. Sétimo Passo

Adicione os botões "Ganhar Negociação" e "Perder Negociação" no Modal de Detalhes, personalize-os e configure as ações correspondentes. Por fim, ative a opção "Fechar modal de detalhes ao recarregar" para que o modal seja fechado automaticamente após a atualização.

  • Ao ganhar uma negociação, o modal será fechado, o status será atualizado para Fechada, e o card da negociação será movido para a etapa Positivado.


  • Ao perder uma negociação, o modal será fechado, o status será atualizado para Fechada, e o card desaparecerá da tela, pois não atenderá ao filtro de negociações Abertas ou Positivadas.

3.8. Oitavo Passo

Caso queira impedir que os usuários arrastem manualmente os cards para a etapa Positivado e garantir que os cards Positivados não possam ser movidos para outras etapas, configure as restrições de movimentação dos cards em cada etapa. Dessa forma, a transição para Positivado será permitida apenas pelo botão "Ganhar Negociação", mantendo a integridade do fluxo de negócios.

3.9. Nono Passo

Nesse exemplo, cada item será tratado como uma tarefa, portanto, adicione os seguintes dados no seu database:

Crie uma tabela de Status Item:

  • Tabela: Status Item

    • ID

    • Descrição

Adicione novos atributos na tabela Item de Negociações

  • Tabela: Item de Negociações

    • Data Agendamento (Date)

    • Status Item (FK)

Agora, o objetivo é criar um status dinâmico, que combine o Status Item e a Data.

  • Se o status for "Pendente", o retorno deve ser o status + data de agendamento.

  • Se o status for "Concluído", o retorno deve indicar que a tarefa foi concluída + a data de conclusão (Use o atributo nativo do Mitra que guarda a data da última alteração).

  • Se o item não tiver data de agendamento, o retorno deve ser "Sem pendência".

Para isso, crie um atributo dinâmico e configure-o com a seguinte consulta SQL:

SELECT ID, 
CASE WHEN DATA_AGENDAMENTO IS NULL THEN 'Sem pendência'
WHEN ID_STATUS_ITEM = -999 THEN 
  CONCAT('Tarefa pendente para o dia ', DATE_FORMAT(DATA_AGENDAMENTO,'%d/%m/%Y'))
WHEN ID_STATUS_ITEM = 1 THEN 
  CONCAT('Tarefa concluída no dia ', DATE_FORMAT(DATA_ULT_ALTERACAO_ITEM_DE_NEGOCIACOES,
    '%d/%m/%Y %T')) END AS VALUE
FROM

Sua consulta deve retornar o ID do Item e o valor que será guardado no atributo dinâmico.

Para mais detalhes sobre a configuração de atributos dinâmicos, consulte a seção 3.1.1 da documentação Database.

3.10. Décimo Passo

Configure o Formulário de Item de Negociações para exibir o campo Data de Agendamento e definir automaticamente o Status Item como "Pendente" para novos registros. Após essa configuração, adicione o atributo dinâmico à timeline do Modal de Detalhes, garantindo que o status dinâmico atualizado de cada item seja exibido corretamente.

3.11. Décimo Primeiro Passo

Adicione um botão no Modal de Detalhes para concluir o item, garantindo que ele permaneça habilitado enquanto o item estiver pendente e seja desabilitado após a conclusão.

Para isso, inclua um atributo numérico chamado "Bloquear" na tabela Item de Negociações, onde o valor 0 manterá o botão ativo e 1 o desativará.

Em seguida, configure uma ação no Mitra que altere o status do item para "Concluído" e atualize o atributo Bloquear para 1, impedindo novas modificações.

Por fim, associe essa ação ao botão criado, garantindo que sua funcionalidade esteja corretamente vinculada ao fluxo de atualização do item.

3.12. Décimo Segundo Passo

Agora é o momento de criar os detalhes extras, como a tela de análise. Para isso, inicie criando uma nova tela em branco.

Embora configurar componentes via SQL seja uma opção eficiente, o Mitra oferece uma funcionalidade de drag and drop que simplifica ainda mais a criação de análises. Basta arrastar os dados desejados e os componentes necessários, e o sistema automaticamente gera uma VIEW de Análise para cada componente, como demonstrado no vídeo a seguir:

Além disso, na seção de BI, você pode utilizar o Drill Anywhere, que permite navegar livremente entre diferentes pontos da análise. Para mais detalhes, consulte a documentação de Relatórios e Dashboards no Mitra.

3.13. Décimo Terceiro Passo

Agora é o momento de criar o modelo para a tela mobile. Para isso, crie uma nova tela do tipo mobile e selecione o modelo "Kanban e Botão".

Em seguida, copie a VIEW de SQL criada na tela web e cole-a na view do Board da tela mobile. Depois, configure as opções de personalização do Board para ajustar a exibição conforme necessário.

3.14. Resultado Final

Com esses treze passos, seu CRM estará pronto! Seguindo esse fluxo, você aprenderá a configurar o template "Fluxo de Processos" no Mitra de forma simples e eficiente.

Se deseja aprender a publicar seu projeto, confira a seção de FAQs sobre Publicação, Login e Navegação, além da documentação geral de Publicação para mais detalhes.

Procurar

Procurar