Skip to content

Instantly share code, notes, and snippets.

@gabizinha12
Created Mar 17, 2021
Embed
What would you like to do?
<%- contentFor('HeaderCss') %>
<%- contentFor('title') %> Cadastrar grupo
<%- contentFor('breadcrumb') %>
<div class="col-sm-8">
<div class="page-title-box">
<h4 class="font-size-18">Cadastrar grupo</h4>
<ol class="breadcrumb mb-0">
<li class="breadcrumb-item">
<a href="javascript: void(0);">Página Inicial</a>
</li>
<li class="breadcrumb-item"><a href="javascript: void(0);">Listar grupos</a></li>
<li class="breadcrumb-item active">Cadastrar grupo</li>
</ol>
<%- contentFor('body') %>
<div class="container">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<form action="/clients/create-group" method="POST">
<div class="form-group row">
<label for="name" class="col-sm-2 col-form-label">Nome</label>
<div class="col-sm-10">
<input class="form-control" type="text" name="name" id="name" />
</div>
</div>
<div class="phone-list">
<div class="form-group row">
<label for="phone"
class="col-sm-2 col-form-label">Telefone</label>
<div class="col-sm-5 phone-input">
<!-- <input type="text" name="phones"
class="form-control phone-input" placeholder=""
id="phones" value="+55" /> -->
<button type="button" class="btn btn-primary btn-phone">
<span class="ti-plus mx-auto"></span>
</button>
</div>
</div>
</div>
<div class="form-group row">
<label for="comment"
class="col-sm-2 col-form-label">Comentário</label>
<div class="col-sm-10">
<input class="form-control" type="text" id="comment"
name="comment" />
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Selecione o canal</label>
<div class="col-sm-10">
<select class="custom-select" name="channel" id="channel">
<% for(var i=0; i < channels.length; i++) { %>
<option value="<%= channels[i].id %>">
<%= channels[i].name %>
</option>
<% } %>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Mensageiro</label>
<div class="col-sm-9">
<select class="custom-select" name="selectedMessenger"
id="selectedMessenger">
<% for(var i=0; i < channels.length; i++) { %>
<% if(channels[i].transports.length==0 ) { %>
<option value=""
class="transports channel-<%= channels[i].id %>"
style="display: none;" disabled>
Não há
mensageiros disponí­veis para esse
canal</option>
<% } %>
<% for(var j=0; j <
channels[i].transports.length; j++) { %>
<% if(channels[i].transports[j] !="widget"
&& channels[i].transports[j]
!="whatsapp" ) { %>
<option
class="transports channel-<%= channels[i].id %>"
value="<%= channels[i].transports[j] %>"
style=>
<% if(channels[i].transports[j]=="external"
||
channels[i].transports[j]=="wa_dialog"
) { %>
WhatsApp
<% } else
if(channels[i].transports[j]
!='WhatsApp' ) {%>
Não há mensageiros
<% } %>
</option>
<% } %>
<% } %>
<% } %>
</select>
</div>
</div>
<% if(group_user.name=='Administrator' ||
group_user.name=='Administrator System' ) { %>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Atribuir diálogo</label>
<div class="col-sm-4">
<select class="custom-select" name="attribuitionType"
id="attribuitionType">
<option value="operator"
onclick="document.getElementById('operators-div').style.display='block'; document.getElementById('operators-groups').style.display='none';"
selected="selected" selected>Á um operador
</option>
<option value="group"
onclick="document.getElementById('operators-div').style.display='none'; document.getElementById('operators-groups').style.display='block';">
Á um grupo de operadores
</option>
</select>
</div>
<div class="col-sm-4" id="operators-div">
<select class="custom-select" name="operator">
<% for(var i=0; i < operators.length; i++) { %>
<option value="<%= operators[i].id %>">
<%= operators[i].first_name %>
<% if(operators[i].last_name !=null) { %>
<%= operators[i].last_name %>
<% } %>
</option>
<% } %>
</select>
<div class="col-sm-7" id="operators-groups"
style="display: none;">
<select class="custom-select" name="operatorGroup"
id="operatorGroup">
<% for(var i=0; i < operatorsGroups.length; i++) {
%>
<option value="<%= operatorsGroups[i].id %>">
<%= operatorsGroups[i].name %>
</option>
</select>
<%}%>
</div>
</div>
<input type='hidden' id="group-id" value="<%= group_user.id %>">
<% } %>
<div class="form-group d-flex ">
<label for="mensagem" class="ml-3 mr-2">Mensagem</label>
<textarea class="form-control col-sm-5 mt-3 mr-5"
cols="30" rows="3" style="margin-left:103px;"
placeholder="O envio de mensagens é opcional"></textarea>
</div>
</div>
<div class="custom-control custom-checkbox"
style="margin-top: 30px;">
<input class="custom-control-input" type="checkbox"
id="verifyPhone" name="verifyPhone">
<label class="custom-control-label" for="verifyPhone">Verificar
a existencia de
WhatsApp para o
número informado antes de criar o cliente</label>
</div>
<div style="margin-right: 988px;">
<button type="submit" class='btn btn-primary'
style="margin-top: 56px;">Salvar</button>
</div>
</form>
</div>
</div>
</div>
<!-- end col -->
</div>
</div>
</div>
</div>
<%- contentFor('FooterJs') %>
<%- contentFor('BottomJs') %>
<script src="/public/js/intlTelInput.min.js"></script>
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script src="/public/js/intlTelInput-jquery.min.js"></script>
<script>
function changeTransports() {
all = document.getElementsByClassName('transports');
channel = document.getElementById('channel').value
for (var i = 0; i < all.length; i++) {
if (all[i].classList.contains('channel-' + channel)) {
document.getElementById("selectedMessenger").selectedIndex = i;
all[i].style.display = 'block';
} else {
all[i].style.display = 'none';
}
}
return false
};
$(document).ready(function () {
channel = document.getElementById('channel').value
all = document.getElementsByClassName('channel-' + channel);
for (var i = 0; i < all.length; i++) {
all[i].style.display = 'block'
}
});
document.getElementById("channel").addEventListener("change", changeTransports)
// var input = document.querySelector("#phones");
// window.intlTelInput(input, ({}));
// $("#phones").intlTelInput({
// initialCountry: "br",
// nationalMode: false,
// preferredCountries: ["br", "us", "gb"],
// separeDialCode: true,
// autoPlaceholder: "polite"
// });
$(window).load(function () {
var intervalFunc = function () {
$('#file-name').html($('#file-type').val());
$('#file-name2').value = ($('#file-type').val());
};
$('#browse-click').on('click', function () { // use .live() for older versions of jQuery
$('#file-type').click();
setInterval(intervalFunc, 1);
return false;
});
});
$(function (e) {
e.pre
$(document.body).on('click', '.btn-remove-phone', function () {
$(this).closest('.phone-input').remove();
});
$('.btn-phone').click(function () {
var index = $('.phone-input').length + 1;
$('.phone-list').append('' +
'<div class="phone-list">' +
'<div class= "form-group row phone-input">' +
'<div class="col-sm-10">' +
'<input type="text" class="form-control col-sm-4 mb-4 float-right" name="phone" placeholder="+554499999999" value="55"/>' +
'<button class="btn btn-danger btn-remove-phone ml-2 mt-1 ti-trash float-right mr-2" type="button"></button>' +
'</div>'
);
$('.phone-list').click(function (e) {
e.stopImmediatePropagation()
})
});
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment