Deve-se adicionar o seguinte código no iframe para opção com barra de login:
<iframe id="frame" src="https://app.paineldocorretor.com.br/produto/?hash=[COLOQUE SEU HASH AQUI]&somente-conteudo=false" frameborder="0" scrolling="no" style="width: 100%; height: 700px;"></iframe>
Ou deve-se adicionar o seguinte código no iframe para opção sem barra de login:
<iframe id="frame" src="https://app.paineldocorretor.com.br/produto/?hash=[COLOQUE SEU HASH AQUI]&somente-conteudo=true" frameborder="0" scrolling="no" style="width: 100%; height: 700px;"></iframe>
Onde está [COLOQUE SEU HASH AQUI] deve ser substituído com o código informado pela Trindade para identificação da corretora ou plataforma.
NOTA: Adicione o script de redimensionamento do iframe.
Algumas ações do usuário podem causar um aumento do iframe na tela fazendo com que informações do iframe desapareçam caso o mesmo não notifique o seu site que a altura precise se alterada já que são aplicações distintas. Adicionando um script antes do fechamento da tag da página resolve este problema.
Segue o código a ser adicionado:
<script type="text/javascript" src="https://static.trindadetecnologia.com.br:8443/scripts/jquery.messagelistener.js"></script>
| Propriedade | Tipo | Valor Padrão |
|---|---|---|
| Nome | String | “” |
| String | “” | |
| FonePrincipal | String | “” |
| FoneCelular | String | “” |
| FoneComercial | String | “” |
| Cidade | String | “” |
| PlanoAnteriorNome | String | “” |
| PlanoAnteriorPedido | String | “” |
| PreferenciaHospitalar | String | “” |
| Observacao | String | “” |
| Idade | int | 0 |
| IdFonte | int | 0 |
| Modalidade | String | null |
| FaixaEtarias | Array | [] |
| IdProduto | int | null |
| IdCorretor | int | null |
2. Decorando o HTML com os atributos, você pode informar de forma explicita somente os campos fixos ou que exigem alguma codificação. Segue o exemplo abaixo:
| Campo | Atributo |
|---|---|
| Nome | data-indicacao=”Nome” |
| data-indicacao=”Email” | |
| FonePrincipal | data-indicacao=”FonePrincipal” |
| FoneCelular | data-indicacao=”FoneCelular” |
| FoneComercial | data-indicacao=”FoneComercial” |
| Cidade | data-indicacao=”Cidade” |
| PlanoAnteriorNome | data-indicacao=”PlanoAnteriorNome” |
| PlanoAnteriorPedido | data-indicacao=”PlanoAnteriorPeriodo” |
| PreferenciaHospitalar | data-indicacao=”PreferenciaHospitalar” |
| Observacao | data-indicacao=”Observacao” |
| Idade | data-indicacao=”Idade” |
| Modalidade | data-indicacao=”Modalidade” |
| Faixa 00 a 18 | data-indicacao=”Faixa00a18″ |
| Faixa 19 a 23 | data-indicacao=”Faixa19a23″ |
| Faixa 24 a 28 | data-indicacao=”Faixa24a28″ |
| Faixa 29 a 33 | data-indicacao=”Faixa29a33″ |
| Faixa 34 a 38 | data-indicacao=”Faixa34a38″ |
| Faixa 39 a 43 | data-indicacao=”Faixa39a43″ |
| Faixa 44 a 48 | data-indicacao=”Faixa44a48″ |
| Faixa 49 a 53 | data-indicacao=”Faixa49a53″ |
| Faixa 54 a 58 | data-indicacao=”Faixa54a58″ |
| Faixa 59 ou mais | data-indicacao=”Faixa59ouMais” |
Forma de envio
1. Na forma explicita: Para realizar o envio você pode simplismente chamar o método enviar() da indicação que possui dois parametros de callback (não obrigatórios) mas que podem serem informados por você que são: callbackSucesso e callbackErro. Ambos recebem um objeto de resposta que pode ser tratatado.
Exemplo simples de envio.
indicacao.enviar();
Vale lembrar que a fonte e o código hash deverá ser fornecido pela Corretora para envio da indicação via API. Os erros e mensagens de envio poderão serem acompanhados na aba de console do navegador durante os testes de envio. O ideal é implementar este código em um evento de “submit” do formulário, ou evento a sua escolha, desde que faça sentido ter o objeto montado passando as propriedades, ao menos obrigatórias.
2. Data Attributes: Utilizando Data Attributes, você deve passar as informações de hash e fonte utilizada como atributo também no formulário. Sendo assim, decore o elemento
HTML com os atributos e ao submeter seu formulário via POST para um backend ou mesmo do lado cliente o processo de validação e envio será executado. Veja os demais valores a serem adicionados.
| data-indicacao=”form” | Para reconhecer o formulário na montagem do objeto e valores necessários para envio. |
| data-indicacao-hash=”hash do cliente” | Atributo para informar o hash do cliente para envio. |
| data-indicacao-fonte=”9999″ | Código da fonte do cliente/site que será enviado junto à indicação. |
Veja como fica no HTML:
É importante observar que em ambas as formas de envio, é registrado no console do navegador os possíveis erros de não envio para API. É importante estar atento e acompanhar durante a fase de integração.
Qualquer dúvida, entre em contato com suporte@trindadetecnologia.com.br.