RW
ricardo wellausen

L G P D Consent Management - Copy this React, Tailwind Component to your project

Detalhamento da Tela: LGPD (Lei Geral de Proteção de Dados) A tela LGPD será usada para gerenciar e configurar o termo de consentimento que será enviado aos clientes. O termo pode ser personalizado ou preenchido automaticamente com um modelo padrão. 1. Estrutura Geral da Tela Título da Página: "Gerenciamento do Termo de Consentimento (LGPD)". Descrição Subtítulo: "Configure o termo de consentimento da LGPD que será enviado aos seus clientes para coleta de aprovação." 2. Componentes da Tela 2.1. Campo de Texto Personalizável Descrição: Um campo grande para que a corretora possa escrever ou editar o texto do termo de consentimento. Comportamento: Aceita texto simples ou código HTML para personalização avançada. 2.2. Botão "Mensagem Padrão" Descrição: Insere automaticamente um texto pré definido no campo de texto. Texto Padrão: <p> "Conforme a Lei Geral de Proteção de Dados (LGPD), solicitamos sua autorização para coletar, armazenar e processar seus dados pessoais para fins de análise e contato comercial. Garantimos a proteção e a confidencialidade das suas informações." </p> Comportamento: Substitui o conteúdo atual do campo de texto com o texto padrão. Exibe uma mensagem de confirmação antes de sobrescrever, caso o campo já tenha conteúdo. 2.3. Botão "Salvar" Descrição: Salva o conteúdo do termo no banco de dados para uso posterior. Comportamento: Ao clicar em salvar: Valida o campo para garantir que não está vazio. Envia o conteúdo do termo ao backend via API para armazenamento. Exibe uma mensagem de sucesso ou erro. 2.4. Opções de Envio Descrição: Controle para decidir como o termo será enviado ao cliente: Via E mail. Via SMS (opcional, se houver integração). Link para celular. Comportamento: Após salvar o termo, permite configurar o método de envio. 3. Layout da Tela Estrutura Principal 1. Título e Subtítulo: Exibidos no topo da tela, centralizados. 2. Campo de Texto: Um editor de texto grande ocupando a maior parte da tela. Botões de controle abaixo ou ao lado. 3. Botões: "Mensagem Padrão" à esquerda. "Salvar" à direita. Cores e Estilo Fundo: Branco, com bordas arredondadas e sombras suaves no editor. Botões: Azul para "Salvar". Cinza para "Mensagem Padrão". 4. Fluxo de Uso 1. O usuário acessa a tela LGPD pelo menu lateral. 2. Digita ou edita o conteúdo do termo no campo de texto. 3. Opcionalmente, clica em "Mensagem Padrão" para preencher o campo com o texto pré definido. 4. Clica em "Salvar" para armazenar o termo. 5. Após salvar, configura o método de envio do termo para os clientes. 5. Comportamentos Específicos 5.1. Validação do Campo O botão "Salvar" só fica habilitado se o campo de texto não estiver vazio. Exibe um erro ao tentar salvar com o campo vazio. 5.2. Substituição com Mensagem Padrão Exibe um modal de confirmação antes de sobrescrever o conteúdo existente com o texto padrão: "Tem certeza de que deseja substituir o conteúdo atual pelo texto padrão?" 5.3. Feedback Visual Exibe mensagens após salvar: Sucesso: "Termo salvo com sucesso." Erro: "Erro ao salvar o termo. Tente novamente." 6. Funcionalidades Futuras 1. Pré visualização: Um botão "Pré visualizar" que exibe como o termo será apresentado ao cliente. 2. Histórico de Alterações: Permite acessar versões anteriores do termo. 3. Rastreamento de Aceite: Um painel para verificar quem já aceitou o termo e quem ainda está pendente.

Prompt
Component Preview

About

LGPDConsentManagement - Manage LGPD consent terms with customizable text, default message insertion, and multiple sending options. Bu. Copy component code!

Share

Last updated 1 month ago