Histórico da Página
| HTML |
|---|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<div class="top">
<div class="header">
<center> <img class="img" src="https://tdn.totvs.com/download/attachments/732664978/log.png?version=1&modificationDate=1673393212156&api=v2" alt=""> </center>
</div>
</div>
<div class="content">
<div class="date"> <br>
<div>JAN</div>
<div class="day">6</div>
</div>
<div class="article"> <br>
<h1> ✒️ Regras com multiníveis de ocultação e edição condicionais na tela de Atividades</h1>
<br>
<span class="badge badge-melhoria">MELHORIA</span>
<br> <br>
<table>
<colgroup>
<col span="2" class="day">
<col>
<col>
<col>
<col>
<col>
<col>
<col>
</colgroup>
<thead>
<tr>
<th scope="row">Produto</th>
<td>TOTVS CRM Gestão de Clientes</td>
</tr>
<tr>
<th scope="row">Módulo</th>
<td>Personalização </td>
</tr>
<tr>
<th scope="row">Ambiente</th>
<td>Funcionalidades </td>
</tr>
<tr>
<th scope="row">Identificador</th>
<td>ME260120221312<td>ME260520220839b </td>
</tr>
<tr>
<th scope="row">Ticket/Issue</th>
<td>DTCRMSC<td>DTCRMSD-17321104 </td>
</tr>
<tr>
</table>
<br>
<p> As equipes de vendas estão sempre sobrecarregadas com o número de atividades que precisam fazer. O problema é que, às vezes, acabam preenchendo campos que não são relevantes para suas atividades ou esquecendo de preencher campos importantes. Tudo isso acaba causando mais trabalho para a equipe de vendas, que já tem muito o que fazer. Pensando nisso, agora é possível condicionar a exibição e edição de atividades a partir de regras. Este documento o guiará pelo processo de uso da melhoria. </p>
<div class="pause" id="i">📍 Onde pode ser encontrado?</div>
<p>
<ol>
<li> Módulo Personalização </li>
<li> Funcionalidades </li>
<li> Activities </li>
<li> Card formulário </li>
</ol>
</p>
<div class="pause">🔍 O que mudou?</a></div>
<p> Agora, o mapeamentoDisponibilizamos uma seção no recurso de camposfuncionalidades serápara realizadoque pelaseja ferramentapossível terceiracadastrar, consultandoeditar ae APIremover doregras serviço de personalização (BTB). Se houver alguma alteração no contrato da API, que impacte o mapeamento, como por exemplo, remoção de campos personalizados no TOTVS CRM, o usuário deve ser alertado, para que, se necessário, sejam realizados ajustes. Deve ser possível, também, definir se leads já inseridos no TOTVS CRM, independentemente da fonte, serão atualizados ou não.</p> <br>
<div> <img class="img3" src="https://tdn.totvs.com/download/attachments/733190964/DOC14.png?version=2&modificationDate=1673744136269&api=v2" alt="Image" height="80%" width="100%"> </div>exibição e/ou edição condicionadas a uma expressão de validação. As ações possíveis para alteração dos estados dos elementos quando a regra condicional for atendida são: <br> <br>
<strong> Ocultar - </strong> Faz com que o elemento seja ocultado no formulário <br><br>
<strong> Visível - </strong> O elemento selecionado será visível no formulário <br><br>
<strong>Tornar editável - </strong> O elemento poderá ser editado em tela <br><br>
<strong>Tornar somente leitura - </strong> Faz com que o elemento não possa ser editado, ou seja, permitirá somente leitura da informação presente no atributo. <br><br>
Exemplo de uma ocultação à partir de uma regra condicional:<br>
Quando o tipo de atividade for "e-mail", quero que oculte o elemento de tela "Local". Para todos os outros tipos de atividades, estes campos devem ser exibidos normalmente. </p>
<p> Após configurado o mapeamento, o usuário estará apto a enviar os Leads selecionados da ferramenta para o TOTVS CRM. Se os leads enviados forem identificados pelas regras de duplicidade ativa, estes devem ser identificados como "Leads já enviados na ferramenta terceira". Uma vez que configurado para atualização de registros já existentes, o TOTVS CRM deverá atualizar o cadastro, conforme o registro da ferramenta terceira, do contrário, deverá retornar que o registro é duplicado. </p> <br> <div> <div class="box info-box">
<i class="fa fa-info-circle"> </i>
<strong>Info</strong>
<p>A regra condicional aplica mudança de comportamento nos fomulários da web e mobile.
</div><div> <img class="img3" src="https://tdn.totvs.com/download/attachments/733190964733191203/DOC13gif%20regras%20%281%29.pnggif?version=21&modificationDate=16737442917941673805185471&api=v2" alt="Image" height="80%" width="100%"> </div>
<br>
<p>O<div> mecanismo desenvolvido permite que várias ferramentas possam se integrar com o TOTVS CRM, com isso, o card de captura de leads foi atualizado, e a partir de agora você encontrará ele da seguinte maneira no Marketplace:</p>
<img class="img3" src="https://tdn.totvs.com/download/attachments/733191203/gif%20regras%202%20%282%29.gif?version=1&modificationDate=1673807513697&api=v2" alt="Image" height="80%" width="100%"> </div>
<br>
<p> Com a regra aplicada, você pode editar, excluir e caso necessário até desabilitar. </p> <br> <div><div> <img class="img3" src="https://tdn.totvs.com/download/attachments/733190964733191203/gif%20integracaogif%20regras%203.gif?version=1&modificationDate=16737455558071673808144650&api=v2" alt="Image" height="80%" width="100%"> </div>
<p>Adicionamos novos <p>ícones Ode geradorstatus de tokenvisualização dee acessoedição, doque usuáriomostram éinstantaneamente oquais meiocampos idealsão paraobjetos considerarde configuraçõesregras importantescondicionais. Ele considera seus parâmetros do perfil de acesso e todas as outras informações relacionadas. </p>
<div> <img Estes ícones são exibidos na seção de personalização do formulário — possibilitando ter um panorama de status e ação realizada através de regras.
<div> <center><img class="img3" src="https://tdn.totvs.com/download/attachments/733190964/gif%202%20integra%C3%A7%C3%A3o%20%281%29.gif733191203/Sem-t%C3%ADtulo-1.png?version=1&modificationDate=16737937028831673811615851&api=v2" alt="Image" height="80%60%" width="100%60%"> </center> </div>
<
<br>
</div> |
| HTML |
|---|
<style>
#title-text {
display: none !important;} @import "compass/css3"; @import "compass/css3";
* {
box-sizing: border-box;
font-family: lato;
}
blockquote {
margin: 3%;
border-left: 10px solid #363636;
padding: 2%;
color: #222;
background: #fff;
font-style: italic;
line-height: 130%;
}
.top {
width: 100%;
background: #363636;
}
.img {
image-resolution: 5px 5px 9px;
image-rendering: auto;
image-orientation:0deg
}
.header {
max-width: 1200px;
width: 98%;
height: 7em;
margin: 0px auto;
overflow: hidden;
h1 {
text-align: center;
font-weight: bold;
color: #fff;
padding: 20px;
font-size: 22px;
div {
margin: 0;
font-weight: normal;
font-size: 1.8em;
}
}
.author {
font-size: 0.8em;
font-weight: normal;
border-top: 1px dashed #555;
border-bottom: 1px dashed #555;
max-width: 160px;
text-align: center;
margin: -1em auto 0 auto;
padding: 0.3em;
text-transform: uppercase;
color: #ccc;
}
}
.content {
max-width: 750px;
margin:0px auto;
padding: 0;
}
.date {
float: left;
width: 10%;
color: #444;
text-align: center;
div {
margin: 0;
line-height: 50%;
}}
.day {
float: left;
margin-top: 0.1em;
width: 100%;
color: #FEAC0E;
font-size: 200%;
}
}
.date-line {
display: none;
}
.article {
width: 90%;
margin: 0 0 6em 0;
float: left;
padding: 0 1.3em 0 1.3em;
border-left: 5px solid #FEAC0E;
background: rgb(247, 247, 252);
}
h2 {
font-weight: normal;
font-size: 22px;
font-weight: bold;
color: #555555;
margin: 0;
}
h3 {
font-weight: normal;
font-size: 16px;
color: #888;
font-style: italic;
margin: 0 0 1em 0;
}
p {
margin: 0;
padding-top: 8px;
color: #555;
text-align: justify;
font-size: 16px;
line-height: 150%;
}
li{
font-size: 16px;
color: #555555;
}
div{
font-style: 16px;
color: #555;
}
.firstpara {
text-indent: 0;
font-size: 16px;
}
.pause {
margin: 2em auto 2em auto;
color: #555555;
width: 60%;
padding: 10px;
text-align: center;
font-size: 20px;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.firstcharacter {
float: left;
font-size: 16px;
font-weight: bold;
color: #555;
line-height: 0.6em;
padding-top: 0.12em;
padding-right: 0.1em;
padding-left: 0;
}
}
.footer {
max-width: 1200px;
width: 98%;
height: 50px;
margin: 0px auto;
overflow: hidden;
border-top: 1px solid #ccc;}
.copy {
float: right;
font-style: italic;
color: #888;
padding: 1% 1% 0 0;
}
}
.prev a,
.next a {
position: fixed;
top: 9.6em;
padding: 1em;
background: #f1f1f1;
border: 1px solid #ccc;
border-radius: 5px;
}
.prev a:hover,
.next a:hover {
background: #fff;
}
.prev a {
left: 0.7em;
}
.next a {
right: 0.7em;
}
@media only screen and (max-width: 450px) {
.content {
margin-top: 2em;
}
.social {
display: none;
}
.date {
display: none;
}
.date-line {
display: inline;
}
.article {
width: 100%;
margin: 0 auto 2em auto;
border-left: none;
padding-bottom: 2em;
border-bottom: 1px solid #ccc;
p {
font-size: 1.2em;
}
}
.header {
height: auto;
position: fixed;
top: 0;
padding: 0;
margin: 0;
background: rgb(34, 16, 171)
h1 {
text-align: center;
width: 100%;
margin: 0;
color: #f1f1f1;
span {
font-size: 80%;
}
}
.author {
display: none;
}
}
.footer {
text-align: center;
padding: 3%;
height: 40px;
.copy {
float: none;
}
}
.prev a,
.next a {
position: relative;
margin-bottom: 2em;
text-align: center;
top: 0;
}
.prev a {
float: left;
width: 40%;
}
.next a {
float: right;
width: 40%;
}s
.table {
font-family: lato;
background-color: #fff;
}
#wrapper {
display: flex;
flex-direction: column;
gap: 2px;
position: absolute;
inset: 0;
justify-content: center;
align-items: center;
}}
.flexWrap {
display: flex;
gap: 2px;
width: 110px;
}
#disclaimer {
font-family: sans-serif;
color: #333333;
position: fixed;
top: 5%;
right: 5%;
width: 5%;
}
.badge-primary {
color: #8686FF;
background-color: #F3F3FF;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
.badge-secondary{
color: #ebeef0;
background-color: #2abe74;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold
}
.badge-novo {
color: #fff;
background-color: #20d691;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
.badge-danger{
color: #ebeef0;
background-color: #e93e9c;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
.badge-manutencao {
color: #FFF;
background-color: #efc307;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold;
}
.badge-melhoria {
color: #FFF;
background-color: #6f60f6;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold;
}
.badge-light {
color: #8686FF;
background-color: #F3F3FF
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold;
}
.badge-dark {
color: #ebeef0;
background-color: #064118;
border-radius: 10px;
padding: 6px 7px;
font-size: 9px;
font-weight: bold }
body {
font-family: lato;
}
table {
border-collapse: collapse;
}
th {
text-align: left;
background-color: #363636;
color: #fff;
}
caption {
font-size: 1.5rem;
text-align: left;
padding-bottom: 1rem;
}
td, th {
padding: 0.5rem;
border: 3px solid #fff;
}
tbody tr:nth-child(odd),
tfoot tr:nth-child(even) {
background-color: #fff;
}
tfoot tr td:first-child {
border: none;
background-color: white;
}
tfoot {
border-top: 5px solid #fff;
}
.img2 {
width:50%;
height:auto;
padding:2%;
margin-bottom:4%;
align-content: center;
display: block;
margin-left: auto;
margin-right: auto }
#f7f7fc;
}
}
container{
width: 50%;
}
.borderbox{
border: 1px dashed #ebebeb;
width:45%;
margin: 50px auto;
border-radius: 8px;
border-width:2px;
}
.box{
position:relative;
width:auto;
height:auto;
margin: 50px auto;
padding: 20px;
box-shadow: 0px 1px 8px 1px #ebebeb;
border-radius: 8px;
}
.sucess-box{
border-left: solid 5px #3FC43C;
background-color: #fff;
} .info-box{
border-left: solid 5px #585EC2;
background-color: #fff;
}
.warning-box{
border-left: solid 5px #EFA162;
background-color: #fff;
}
.error-box{
border-left: solid 5px #F32D70;
background-color: #fff;
}
.fa{
padding-right:10px;
}
.fa-check-circle{
color: #3FC43C;
}
.fas fa-info-circle
{
color: #585EC2;
}
.warning-box .fa-exclamation-triangle{
color: #EFA162;
}
.error-box .fa-exclamation-triangle{
color: #E63470;
}
p{
padding:0px 28px;
}
.time{
color:#9b9b9b;
}
.fa-close{
color:#BCC4CD;
}
.close{
position:absolute;
top: 20px;
right:20px;
}
.link1,
.link2,
.link3,
.link4{
opacity:0;
margin-left:20px;
text-decoration:none;
}
.link1{
color:#3FC43C;
}
.link2{
color:#585EC2;
}
.link3{
color:#EFA162;
}
.link4{
color:#E63470;
}
.box:hover a{
opacity:1;
}
</style> |
| HTML |
|---|
<div class="speech-row">
<div class="speech-img"><a href="https://totvscst.zendesk.com/hc/pt-br/#home" target="_blank"><img src="https://tdn.totvs.com/download/attachments/731900022/01.png?version=1&modificationDate=1673107757259&api=v2" alt="Assistente virtual"></a></div>
<div class="speech-bubble"><b>Olá!👋</b> Sou a Carolina, assistente virtual da TOTVS. Ainda tem dúvidas? Acesse a central de ajuda e explore todos os conteúdos oferecidos pela TOTVS CRM - Gestão de Clientes! </div>
</div> |
| HTML |
|---|
<style> body {
margin: 0; // 1
font-family: lato;
font-size: 16px;
font-weight: $font-weight-base;
line-height: $line-height-base;
color: #555555
text-align: left; // 3
background-color: $body-bg; // 2
}
.speech-bubble {
max-width: 300px;
font-family: lato;
color: #555555;
font-size: 16px;
margin: 1rem;
padding: 1rem;
position: relative;
border: 2px solid #FEAC0E;
background: #fff;
border-radius: 0.4em;
}
.speech-row {
display: flex;
justify-content: center;
}
img {
overflow-clip-margin: content-box;
overflow: clip;
}
.speech-img img {
border-radius: 50%;
}
img {
vertical-align: middle;
border-style: none;
}
.speech-img {
align-self: center;
max-width: 100%;
height: auto;
}
*,
::after,
::before {
box-sizing: border-box;
}
img {
overflow-clip-margin: content-box;
overflow: clip;
}
.speech-bubble:before,
.speech-bubble:after {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 0;
height: 0;
border: 20px solid transparent;
border-right-color: #FEAC0E;
border-left: 0;
margin-top: -20px;
margin-left: -20px;
}
.speech-bubble:after {
border-right-color: #fff;
margin-left: -18px;
z-index: 1;
}
</style> |
Visão Geral
Import HTML Content
Conteúdo das Ferramentas
Tarefas