Browse Source

print + recuperar

pull/25/head
Guilherme Guia 1 year ago
parent
commit
03fde016e2
  1. 5
      app/view/content.php
  2. 10
      public/css/styles.css
  3. BIN
      public/images/reply.png
  4. 3
      public/js/config.js
  5. 76
      public/js/main.js
  6. 29
      public/js/requests.js
  7. 128
      public/js/util.js

5
app/view/content.php

@ -57,6 +57,11 @@
<img class="chat-window-menu-icon" src="<?= $files ?>/images/cross-circle.svg" /> <img class="chat-window-menu-icon" src="<?= $files ?>/images/cross-circle.svg" />
<span class="chat-window-menu-span"> Finalizar</span> <span class="chat-window-menu-span"> Finalizar</span>
</div> </div>
<div class="chat-window-header-right-commands btn-info" id="recuperaratendimento" title="Recuperar atendimento">
<img class="chat-window-menu-icon" src="<?= $files ?>/images/reply.png" />
<span class="chat-window-menu-span"> Recuperar</span>
</div>
</div> </div>
<span id="chat-window-header-right-icon" class="responsive-icon-header"><i class="fas fa-ellipsis-v"></i></span> <span id="chat-window-header-right-icon" class="responsive-icon-header"><i class="fas fa-ellipsis-v"></i></span>
</div> </div>

10
public/css/styles.css

@ -69,6 +69,10 @@ html {
--color-moon: #f1c40f; --color-moon: #f1c40f;
} }
#footer-content-left{
color: var(--text-primary);
}
/* Personalizações */ /* Personalizações */
.modal-content-body-item { .modal-content-body-item {
@ -111,7 +115,7 @@ html {
padding: 1rem; padding: 1rem;
font-size: 1.5rem; font-size: 1.5rem;
display: none !important; display: none;
} }
.box-event-buttons button { .box-event-buttons button {
@ -1551,7 +1555,7 @@ audio {
.chat-window-header-right { .chat-window-header-right {
padding: 1rem; padding: 1rem;
background-color: var(--bg-light-dark); background-color: var(--bg-light-dark);
bottom: -90px; /* bottom: -90px; */
z-index: 9000; z-index: 9000;
border-radius: 1rem; border-radius: 1rem;
right: 25px; right: 25px;
@ -1571,7 +1575,7 @@ audio {
} }
.responsive-icon-header { .responsive-icon-header {
display: block !important; display: block;
} }
} }

BIN
public/images/reply.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 606 B

3
public/js/config.js

@ -3,9 +3,12 @@ const server_api = `https://${localStorage.getItem('obj_server')}`
const version_api = '/api/v1/' const version_api = '/api/v1/'
const supervisor_api = localStorage.getItem('supervisor_api') ? localStorage.getItem('supervisor_api') : localStorage.getItem('obj_server') const supervisor_api = localStorage.getItem('supervisor_api') ? localStorage.getItem('supervisor_api') : localStorage.getItem('obj_server')
let mediaRecorder let mediaRecorder
let mediaPrint
const icontypes = ['csv', 'doc', 'pdf', 'txt', 'xls', 'zip', 'ppt'] const icontypes = ['csv', 'doc', 'pdf', 'txt', 'xls', 'zip', 'ppt']
const path = 'public' const path = 'public'
const html = document.querySelector("html"); const html = document.querySelector("html");
let abrirMensagem = false; let abrirMensagem = false;
let inputInterface = document.querySelector('#input-checkbox-switch'); let inputInterface = document.querySelector('#input-checkbox-switch');
let chatsArray = []; let chatsArray = [];
const RecuperacaoAtendimentoLimite = 22;

76
public/js/main.js

@ -27,6 +27,17 @@ $(function () {
filaNotifications(); filaNotifications();
}); });
$("#recuperaratendimento").on("click", () => {
recuperarAtendimento(
localStorage.getItem("session_uniqueid"),
localStorage.getItem("my_uniqueid")
);
});
$("#btnAtendimento").on("click", () => { $("#btnAtendimento").on("click", () => {
notifications(); notifications();
}); });
@ -37,6 +48,13 @@ $(function () {
// removeMensagemBody(); // removeMensagemBody();
}); });
$("#uploadimage").on("change", function () {
startSendImage(this.files);
});
/** FIM VOICE RECORDER */ /** FIM VOICE RECORDER */
/** EVENTOS DE CLICK NO BODY */ /** EVENTOS DE CLICK NO BODY */
$("body").mouseup(function () { $("body").mouseup(function () {
@ -47,7 +65,7 @@ $(function () {
}); });
/** INICIO DAS FUNCIONALIDADES */ /** INICIO DAS FUNCIONALIDADES */
startSendImage(); // startSendImage();
startSendFile(); startSendFile();
startPause(); startPause();
startTransfer(); startTransfer();
@ -55,6 +73,38 @@ $(function () {
exitSystem(); exitSystem();
startFooter(); startFooter();
/**
* HABILITA O ENVIO DE MIDIAS CTRL+V
*/
$(document).on('keydown', function(e) {
if (e.ctrlKey || e.metaKey) {
if (e.keyCode == 86) { // 86 é o código da tecla "V"
if(+localStorage.getItem('session_status') === 0) return;
$(document).one('paste', function(event) {
// Verifica se o que foi colado é uma imagem
if (event.originalEvent.clipboardData.items && event.originalEvent.clipboardData.items.length) {
// Percorre todos os itens colados
for (let i = 0; i < event.originalEvent.clipboardData.items.length; i++) {
// Verifica se o item atual é uma imagem
if (event.originalEvent.clipboardData.items[i].type.indexOf("image") !== -1) {
// Cria um objeto File a partir da imagem colada
let imageFile = event.originalEvent.clipboardData.items[i].getAsFile();
startSendImagePrintScreen(imageFile)
mediaPrint = imageFile;
}
}
}
});
}
}
})
/** INICIA COM O HEADER DO CONTATO VAZIO */ /** INICIA COM O HEADER DO CONTATO VAZIO */
startChannelMessage(); startChannelMessage();
/** INICIA O CHAT NO FINAL DA CONVERSA */ /** INICIA O CHAT NO FINAL DA CONVERSA */
@ -111,7 +161,9 @@ $(function () {
* EVENTOS DE CLICK PARA SELECIONAR A SESSAO DE MENSAGEM/CONVERSA E RECUPERAR AS MENSAGENS JA TROCADAS NO ATENDIMENTO * EVENTOS DE CLICK PARA SELECIONAR A SESSAO DE MENSAGEM/CONVERSA E RECUPERAR AS MENSAGENS JA TROCADAS NO ATENDIMENTO
* @param {*} id * @param {*} id
*/ */
const selectNotification = (id) => { const selectNotification = (id, status, datetime) => {
marcarMensagemVista(id); marcarMensagemVista(id);
listaMensagem(id).then(async () => { listaMensagem(id).then(async () => {
let uniqueid; let uniqueid;
@ -135,12 +187,14 @@ const selectNotification = (id) => {
); );
if (e.uniqueid == id && e.status == 0) { if (e.uniqueid == id && e.status == 0) {
hideButtons(true); hideButtons(true);
monitoraStatusTransferenciaAtendimento(datetime);
} }
}); });
$("#" + id.replace(".", `\\.`)).addClass("select-notification"); $("#" + id.replace(".", `\\.`)).addClass("select-notification");
allNotifications.data.forEach((e) => { allNotifications.data.forEach((e) => {
if (e.uniqueid == id && e.status == 0) { if (e.uniqueid == id && e.status == 0) {
hideButtons(true); hideButtons(true);
monitoraStatusTransferenciaAtendimento(datetime);
} }
}); });
if (dataRequest.data.length > 0) { if (dataRequest.data.length > 0) {
@ -160,8 +214,10 @@ const selectNotification = (id) => {
}); });
localStorage.removeItem("session_window"); localStorage.removeItem("session_window");
localStorage.removeItem("session_uniqueid"); localStorage.removeItem("session_uniqueid");
localStorage.removeItem("session_status");
localStorage.setItem("session_uniqueid", uniqueid); localStorage.setItem("session_uniqueid", uniqueid);
localStorage.setItem("session_window", number); localStorage.setItem("session_window", number);
localStorage.setItem("session_status", status);
$(".chat-window-contact-name").text(name); $(".chat-window-contact-name").text(name);
$(".chat-window-contact-status").text("Protocolo: " + protocolo); $(".chat-window-contact-status").text("Protocolo: " + protocolo);
@ -169,6 +225,7 @@ const selectNotification = (id) => {
$(".chat-window .sender").remove(); $(".chat-window .sender").remove();
$(".chat-window .receiver").remove(); $(".chat-window .receiver").remove();
$(".chat-window .events").remove(); $(".chat-window .events").remove();
alertNotification(localStorage.getItem("session_uniqueid"), "remove"); alertNotification(localStorage.getItem("session_uniqueid"), "remove");
if (typeof dataContact === "undefined") return; if (typeof dataContact === "undefined") return;
@ -257,11 +314,14 @@ const selectNotification = (id) => {
} }
} }
}); });
scrollDown(); scrollDown();
}); });
abrirMensagem = true; abrirMensagem = true;
startNotification(); startNotification();
}; };
/** /**
* REALIZA O ENVIO DE MENSAGEM ATRAVEZ DA API * REALIZA O ENVIO DE MENSAGEM ATRAVEZ DA API
@ -469,8 +529,10 @@ const keepMensage = (ev) => {
* FUNCAO PARA CAPTURAR O ARQUIVO A SER ENVIADO * FUNCAO PARA CAPTURAR O ARQUIVO A SER ENVIADO
*/ */
const sendMedia = (media = null) => { const sendMedia = (media = null) => {
let rec; let rec;
let filename; let filename;
if ($("#footer-content-left audio").length) { if ($("#footer-content-left audio").length) {
if (media.state == "recording") { if (media.state == "recording") {
media.stop(); media.stop();
@ -495,7 +557,13 @@ const sendMedia = (media = null) => {
)}" target="_blank">${imgContent}</a>`; )}" target="_blank">${imgContent}</a>`;
filename = el.name; filename = el.name;
} else { } else {
rec = mediaPrint;
if($("#uploadimage")[0].files[0]){
rec = $("#uploadimage")[0].files[0]; rec = $("#uploadimage")[0].files[0];
}
let filesent = $("#myImg"); let filesent = $("#myImg");
filesent[0].id = Date.now(); filesent[0].id = Date.now();
fileContent = filesent.css({ "max-width": "200px" })[0].outerHTML; fileContent = filesent.css({ "max-width": "200px" })[0].outerHTML;
@ -516,4 +584,6 @@ const sendMedia = (media = null) => {
}); });
}; };
file.readAsDataURL(rec); file.readAsDataURL(rec);
$("#uploadimage").val("");
$('#fieldsendmessage').focus();
}; };

29
public/js/requests.js

@ -264,6 +264,35 @@ const transferirAtendimento = (origem, destino, uniqueid) => new Promise((resolv
} }
}); });
}) })
const recuperarAtendimento = (uniqueid, matricula) => new Promise((resolve) => {
$.ajax({
url: `${server_api}${version_api}atendimentos/recover`,
type: "PUT",
data: JSON.stringify({
// matricula_origem: origem,
// matricula_destino: destino,
uniqueid,
matricula
}),
success: function (res) {
if (res.status == 'success') {
alert('Atendimento foi recuperado!')
resolve(res)
} else {
alert(res.message)
}
resolve(res)
},
error: function (res) {
alertModal(
`<h3>OPS... HOUVE UM PROBLEMA &nbsp</h3><img id="imgReconnect" width="25px" src="${path}/images/alerta.png">
<p>Não foi possível carregar as infomações do agente!</p>`,
'OPS!!!'
)
}
});
})
const marcarMensagemVista = (uniqueid) => { const marcarMensagemVista = (uniqueid) => {
$.ajax({ $.ajax({
url: `${server_api}${version_api}messages/markMessageRead`, url: `${server_api}${version_api}messages/markMessageRead`,

128
public/js/util.js

@ -87,11 +87,20 @@ const hideButtons = (type) => {
$("#voicerecorder").css({ "pointer-events": "none" }); $("#voicerecorder").css({ "pointer-events": "none" });
$("#imgclip").css({ "pointer-events": "none" }); $("#imgclip").css({ "pointer-events": "none" });
$("#fieldsendmessage").css({ "pointer-events": "none" }); $("#fieldsendmessage").css({ "pointer-events": "none" });
// $("#fieldsendmessage").css('opacity', '0');
$("#fieldsendmessage").hide(); $("#fieldsendmessage").hide();
$("#tranferagent").hide(); $("#tranferagent").hide();
$("#finalizaratendimento").hide(); $("#finalizaratendimento").hide();
$(".chat-window-header-right").hide(); // $(".chat-window-header-right").hide();
$("#chat-window-header-right-icon").hide();
// $("#recuperaratendimento").show();
$(".chat-window-header-right").css('bottom', '-50px');
// $("#chat-window-header-right-icon").hide();
// $(".responsive-icon-header").hide();
} else { } else {
$("#voicerecorder").css({ "pointer-events": "auto" }); $("#voicerecorder").css({ "pointer-events": "auto" });
$("#imgclip").css({ "pointer-events": "auto" }); $("#imgclip").css({ "pointer-events": "auto" });
@ -99,8 +108,14 @@ const hideButtons = (type) => {
$("#fieldsendmessage").show(); $("#fieldsendmessage").show();
$("#tranferagent").show(); $("#tranferagent").show();
$("#finalizaratendimento").show(); $("#finalizaratendimento").show();
$(".chat-window-header-right").show(); $(".chat-window-header-right").show();
$("#chat-window-header-right-icon").show();
$(".chat-window-header-right").css('bottom', '-90px');
$("#recuperaratendimento").hide();
$('#fieldsendmessage').focus();
} }
}; };
const alertModal = (title, message) => { const alertModal = (title, message) => {
@ -110,16 +125,31 @@ const alertModal = (title, message) => {
$(".modal-header-title").append(`${message}`); $(".modal-header-title").append(`${message}`);
$("#modalselect").show(); $("#modalselect").show();
}; };
/**
* LOG
*/
const log = (message) => {
console.log(message);
}
/** /**
* HABILITA O ENVIO DE ARQUIVO DE IMAGENS E APRESENTA UMA MODAL PARA APRESENTACAO DA IMAGEM SELECIONADA * HABILITA O ENVIO DE ARQUIVO DE IMAGENS E APRESENTA UMA MODAL PARA APRESENTACAO DA IMAGEM SELECIONADA
*/ */
const startSendImage = () => { const startSendImage = (file) => {
modalStart(); modalStart();
$("#uploadimage").on("change", function () { const fileReader = new FileReader();
const file = new FileReader(); // const file = new FileReader();
file.readAsDataURL(this.files[0]); fileReader.readAsDataURL(file[0]);
const imgName = this.files[0].name; const imgName = file[0].name;
file.onload = function (e) {
fileReader.onload = function (e) {
$("#myImg").remove(); $("#myImg").remove();
$("#footername").remove(); $("#footername").remove();
$("#footersend").remove(); $("#footersend").remove();
@ -134,8 +164,35 @@ const startSendImage = () => {
); );
}; };
$("#modalselect").show(); $("#modalselect").show();
}); }
};
const startSendImagePrintScreen = (file) => {
modalStart();
const fileReader = new FileReader();
fileReader.readAsDataURL(file);
const imgName = file.name;
fileReader.onload = function (e) {
$("#myImg").remove();
$("#footername").remove();
$("#footersend").remove();
$(".modal-content-body").append(
`<img id="myImg" src="${e.target.result}" >`
);
$("#footer-content-left").append(
`<label id="footername"><b>Arquivo:</b> ${imgName}</label>`
);
$("#footer-content-right").append(
`<a href="#" class="btn-send" id="footersend"><img src="${path}/images/enter.svg" /></a>`
);
};
$("#modalselect").show();
}
/** /**
* GERENCIA A RESPONSIVIDADE DO LAYOUT * GERENCIA A RESPONSIVIDADE DO LAYOUT
@ -543,7 +600,7 @@ const buildNotification = (data = {}) => {
} }
const datesend = converdata(data.datetime); const datesend = converdata(data.datetime);
const status = data.status == 0 ? "opacity-8" : ""; const status = data.status == 0 ? "opacity-8" : "";
return `<div class="chat ${status}" id="${data.uniqueid}" onclick="selectNotification(this.id)"> return `<div class="chat ${status}" id="${data.uniqueid}" onclick="selectNotification(this.id, ${data.status}, '${data.datetime}')">
<div class="chat-left"> <div class="chat-left">
<img src="${path}/images/${data.media}.png"/> <img src="${path}/images/${data.media}.png"/>
</div> </div>
@ -739,6 +796,53 @@ const filaNotifications = (obj = {}) => {
); );
}; };
const monitoraStatusTransferenciaAtendimento = (date) => {
let formatedTransferDate = date.slice(0, date.lastIndexOf(':'));
const data_atual = new Date();
let formatedDate = formatDate(data_atual, 'Y-m-d hh:M')
const start = new Date(formatedTransferDate);
const end = new Date(formatedDate);
const diffInTime = Math.abs(end - start) / 1000 / 60 / 60
log(diffInTime)
if(diffInTime > RecuperacaoAtendimentoLimite){
return;
}
$("#recuperaratendimento").show();
}
const formatDate = (date, format) => {
const map = {
m: String(date.getMonth()+1).padStart(2,'0'),
d: date.getDate().toString().padStart(2,'0'),
y: date.getFullYear().toString().slice(-2),
Y: date.getFullYear(),
hh: date.getHours(),
M: date.getMinutes(),
ss: date.getSeconds(),
ll: date.getMilliseconds()
}
return(format.replace(/m|d|y|Y|hh|M|ss|ll/gi, matched => map[matched]))
}
const monitorPausaAgente = () => { const monitorPausaAgente = () => {
statusAgente( statusAgente(
localStorage.getItem("my_uniqueid") localStorage.getItem("my_uniqueid")

Loading…
Cancel
Save