painel / static /operacaoTemplate.html
Atualli's picture
Update static/operacaoTemplate.html
990d2e5
raw
history blame
68.1 kB
<!DOCTYPE html>
<html>
<head>
<!--meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"-->
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta charset="utf-8" />
<title>ATUALLI MOSAICO WEB</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
* {
box-sizing: border-box;
}
body {
margin: 0;
font-family: Arial;
background: #000000;
}
#logo {
width: 100%;
top: 10px;
z-index: 1;
}
.title_print, .reporting_period {
text-align: center;
}
.header {
text-align: center;
padding: 0.05%;
background: #053067;
color: white;
}
.buttondiv {
float: left;
overflow: auto;
padding: 4px 10px;
}
.buttonfila {
font-size: 14px;
border-radius: 25px;
border: 2px solid black;
outline: none;
color: white;
padding: 11px 16px;
background-color: #000000;
font-family: inherit;
margin: 0;
}
.buttonwork {
font-size: 14px;
border-radius: 25px;
// border: none;
border: 2px solid black;
outline: none;
color: white;
padding: 11px 16px;
background-color: #339BFF;
font-family: inherit;
margin: 0;
}
.tudo {
// position: absolute;
// display: none;
// flex-wrap: wrap;
// background: #000000;
// height: 100%;
// width: 100%;
}
/* Bottom left text */
.bottom-left {
position: absolute;
bottom: 8px;
left: 16px;
}
/* Top left text */
.top-left {
position: absolute;
top: 18px;
left: 16px;
}
/* Top right text */
.top-right {
position: absolute;
top: 18px;
right: 16px;
}
/* Bottom right text */
.bottom-right {
position: absolute;
bottom: 8px;
right: 16px;
}
/* Centered text */
.centered {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.row {
// position: fixed;
display: none;
flex-wrap: wrap;
padding: 6.3vh 0;
background: #000000;
width:100%;
height:92%;
}
.rowblock {
display: none;
flex-wrap: wrap;
padding: 100% 0;
background-image: url('getresource?r=accessdenied.png');
height: 100%;
}
/* Create four equal columns that sits next to each other */
.column7x {
flex: 14.28%;
max-width: 14.28%;
padding: 0 2px;
}
.column7x img {
margin-top: 2px;
vertical-align: middle;
}
.column7x:active canvas {
position: fixed;
top: 50%;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
cursor: zoom-out;
}
.column6x {
flex: 16.6%;
max-width: 16.6%;
padding: 0 2px;
}
.column6x img {
margin-top: 2px;
vertical-align: middle;
}
.column6x:active canvas {
position: fixed;
top: 50%;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
cursor: zoom-out;
}
.column5x {
flex: 20%;
max-width: 20%;
padding: 0 2px;
}
.column5x img {
margin-top: 2px;
vertical-align: middle;
}
.column5x:active canvas {
position: fixed;
top: 50%;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
cursor: zoom-out;
}
.column3x {
flex: 33.33%;
max-width: 33.33%;
padding: 0 2px;
}
.column3x img {
margin-top: 2px;
vertical-align: middle;
}
.column3x:active canvas {
position: fixed;
top: 50%;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
cursor: zoom-out;
}
.column {
flex: 25%;
max-width: 25%;
padding: 0 2px;
}
.column img {
margin-top: 2px;
vertical-align: middle;
}
.column:hover img {
/* position: absolute;
// bottom: 0%;
left: 0;
right: 0;
height: 50%;
width: 50%;
background: rgba(0, 0, 0, 0.5);
padding: 5px 10px;
transition: all 1s;
color: white; */
}
.column:active canvas {
position: fixed;
top: 50%;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
cursor: zoom-out;
}
/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
.column {
flex: 50%;
max-width: 50%;
}
.column3x {
flex: 50%;
max-width: 50%;
}
.column5x {
flex: 50%;
max-width: 50%;
}
.column6x {
flex: 50%;
max-width: 50%;
}
.column7x {
flex: 50%;
max-width: 50%;
}
}
/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
.column {
flex: 100%;
max-width: 100%;
}
.column3x {
flex: 100%;
max-width: 100%;
}
.column5x {
flex: 100%;
max-width: 100%;
}
.column6x {
flex: 100%;
max-width: 100%;
}
.column7x {
flex: 100%;
max-width: 100%;
}
}
#popupbox {
margin: 0;
margin-left: 40%;
margin-right: 40%;
margin-top: 50px;
padding-top: 10px;
width: 20%;
height: 150px;
position: fixed;
background: #FBFBF0;
border: solid #000000 2px;
z-index: 9;
font-family: arial;
visibility: hidden;
}
#ocorrencia {
margin: 0;
margin-left: 25%;
margin-right: 25%;
margin-top: 12%;
padding-top: 10px;
width: 50%;
height: 50%;
position: fixed;
background: white;
border: solid black 2px;
z-index: 9;
font-family: arial;
visibility: hidden;
}
.sidenav {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: #111;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
}
.sidenav a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 25px;
color: #818181;
display: block;
transition: 0.3s;
}
.sidenav a:hover {
color: #f1f1f1;
}
.sidenav .closebtn {
position: absolute;
top: 0;
right: 25px;
font-size: 36px;
margin-left: 50px;
}
@media screen and (max-height: 450px) {
.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}
}
.topnav {
position: fixed;
top: 0;
width: 100%;
height:6.3vh;
overflow: hidden;
background-color: #fefefe;
}
.topnav a {
float: left;
display: block;
color: #000000;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.active {
background-color: #4CAF50;
color: white;
}
.topnav .icon {
display: none;
}
.dropdown {
float: left;
overflow: auto;
padding: 4px 10px;
}
.dropdown .dropbtn {
font-size: 14px;
border-radius: 25px;
border: 2px solid black;
outline: none;
color: black;
padding: 11px 16px;
background-color: #fefefe;
font-family: inherit;
margin: 0;
}
.dropdown-content {
display: none;
position: fixed;
background-color: #f9f9f9;
min-width: 160px;
overflow: auto;
max-height: 90%;/* you can change as you need it */
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-content a {
float: none;
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.topnav a:hover, .dropdown:hover .dropbtn {
background-color: #555;
color: white;
}
.dropdown-content a:hover {
background-color: #ddd;
color: black;
}
.dropdown:hover .dropdown-content {
display: block;
}
@media screen and (max-width: 1300px) {
.topnav a:not(:first-child), .dropdown .dropbtn {
display: none;
}
.topnav a.icon {
float: right;
display: block;
position: fixed;
top: 0;
right: 0;
}
}
@media screen and (max-width: 1300px) {
.topnav.responsive {
position: relative;
height:1%;
}
.topnav.responsive .icon {
position: absolute;
right: 0;
top: 0;
}
.topnav.responsive a {
float: none;
display: block;
text-align: left;
}
.topnav.responsive .dropdown {
float: none;
}
.topnav.responsive .dropdown-content {
position: relative;
}
.topnav.responsive .dropdown .dropbtn {
display: block;
width: 100%;
text-align: left;
float: right;
}
}
/*
novo popup
*/
/* Button used to open the contact form - fixed at the bottom of the page */
.open-button {
background-color: #555;
color: white;
padding: 16px 20px;
border: none;
cursor: pointer;
opacity: 0.8;
position: fixed;
bottom: 23px;
right: 28px;
width: 280px;
}
/* The popup form - hidden by default */
.form-popup {
display: none;
position: fixed;
bottom: 0;
right: 15px;
border: 3px solid #f1f1f1;
z-index: 9;
}
/* Add styles to the form container */
.form-container {
max-width: 300px;
padding: 10px;
background-color: white;
}
/* Full-width input fields */
.form-container input[type=text], .form-container input[type=password] {
width: 100%;
padding: 15px;
margin: 5px 0 22px 0;
border: none;
background: #f1f1f1;
}
/* When the inputs get focus, do something */
.form-container input[type=text]:focus, .form-container input[type=password]:focus {
background-color: #ddd;
outline: none;
}
/* Set a style for the submit/login button */
.form-container .btn {
background-color: #4CAF50;
color: white;
padding: 16px 20px;
border: none;
cursor: pointer;
width: 100%;
margin-bottom: 10px;
opacity: 0.8;
}
/* Add a red background color to the cancel button */
.form-container .cancel {
background-color: red;
}
/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
opacity: 1;
}
/* POPUP central */
/* Full-width input fields */
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
/* Set a style for all buttons */
.button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
text-align: center;
}
button:hover {
opacity: 0.8;
}
/* Extra styles for the cancel button */
.cancelbtn {
width: 100%;
padding: 10px 18px;
background-color: #f44336;
text-align: center;
}
/* Center the image and position the close button */
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
position: relative;
border: 3px solid #fff;
background: #f1f1f1;
width: 100%;
// min-height: 450px;
}
.imgchild {
width: 50%;
height: 26vw;
float: left;
padding: 0px;
margin: 0 0;
border: 1px solid #000;
}
img.avatar {
width: 40%;
border-radius: 50%;
}
.container {
padding: 16px;
}
.select {
padding: 16px;
width: 40%;
}
.select_audio {
width: 40%;
}
options {
padding: 16px;
width: 40%;
}
span.psw {
float: right;
padding-top: 16px;
}
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
left: 20%;
top: 0;
width: 60%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.0); /* Black w/ opacity */
padding-top: 10%;
}
/* Hide scrollbar for Chrome, Safari and Opera */
.modal::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.modal {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
/* Modal Content/Box */
.modal-content {
background-color: #fefefe;
margin: 0% auto 0% auto; /* 5% from the top, 15% from the bottom and centered */
border: 1px solid #888;
width: 100%; /* Could be more or less, depending on screen size */
}
/* The Close Button (x) */
.close {
position: absolute;
right: 25px;
top: 0;
color: #000;
font-size: 35px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: red;
cursor: pointer;
}
/* Add Zoom Animation */
.animate {
-webkit-animation: animatezoom 0.6s;
animation: animatezoom 0.6s
}
@-webkit-keyframes animatezoom {
from {
-webkit-transform: scale(0)
}
to {
-webkit-transform: scale(1)
}
}
@keyframes animatezoom {
from {
transform: scale(0)
}
to {
transform: scale(1)
}
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
</style>
</head>
<body onload="iniciaPagina();">
<title>Hello</title>
<script type="text/javascript">
function storeLogin(name)
{
setCookieh("LOGIN",name,10);
}
function loadLogin()
{
var name = getCookieh("LOGIN");
return name;
}
function loadFotoLogin() {
var foto = getCookieh("FOTO");
return foto;
}
function setCookieh(name,value,days) {
window.localStorage.setItem(name, value);
}
function getCookieh(name) {
return window.localStorage.getItem(name);
}
function sleeph(time) {
return new Promise((resolve) => setTimeout(resolve, time));
}
function handleClientLoad() {
sleeph(100).then(() => {
document.getElementById("conteudototal").style.display = "block";
var name=loadLogin();
if((!name) || (name=="LOGIN"))
{
waitLogin();
}
else
{
waitLogout(name);
}
});
}
function updateSigninStatus(isSignedIn) {
if (isSignedIn) {
} else {
waitLogin();
}
}
/**
* Sign in the user upon button click.
*/
var init=0;
function handleAuthClick(event) {
document.getElementById("myLogin").innerHTML = "AGUARDE...";
if(init==0)
{
init=1;
}
}
function waitLogin()
{
document.getElementById("tudo").style.display = "none";
document.getElementById("conteudototal").style.display = "none";
document.getElementById("listaclientes").style.display = "none";
// document.getElementById("ferramentas").style.display = "none";
document.getElementById("Fila").style.display = "none";
document.getElementById("operacao").style.display = "none";
document.getElementById("viewList").style.display = "none";
document.getElementById("portal").style.display = "flex";
document.getElementById("myLogin").innerHTML = "LOGIN";
document.getElementById("myLoginS").innerHTML = "LOGIN";
var obj = document.getElementById("myLoginS");
obj.setAttribute('href', "javascript:handleAuthClick(0);");
document.getElementById("Fila").setAttribute('onclick', "document.getElementById('ocoModal').style.display = 'none'; javascript:void(0);");
storeLogin("LOGIN");
openurl("/novo-front/index");
}
function waitLogout(logname) {
document.getElementById("tudo").style.display = "inline";
document.getElementById("conteudototal").style.display = "block";
document.getElementById("listaclientes").style.display = "inline";
// document.getElementById("ferramentas").style.display = "inline";
//document.getElementById("Fila").style.display = "flex";
//document.getElementById("operacao").style.display = "flex";
document.getElementById("viewList").style.display = "inline";
document.getElementById("portal").style.display = "none";
document.getElementById("myLogin").innerHTML = "LOGOFF";
var obj = document.getElementById("myLoginS");
obj.setAttribute('href', "javascript:handleSignoutClick(0);");
document.getElementById("Fila").setAttribute('onclick', "getVideoOcorrencia();");
// var name = gapi.auth2.getAuthInstance().currentUser.get();
// var logname = name.getBasicProfile().getName() + " ( " + name.getBasicProfile().getEmail() + " )";
//login(logname);
document.getElementById("myLogin").innerHTML = logname; // Qt.Au = email , Qt.Bd= fullname, Qt.zU=lastname, Qt.zW=firstname.
var clip=logname.indexOf("(");
document.getElementById("myLoginS").innerHTML = logname.substring(0,clip);
storeLogin(logname);
}
/**
* Sign out the user upon button click.
*/
function handleSignoutClick(event) {
var x;
var r = confirm("Deseja finalizar a sessao ?");
if (r == true) {
document.getElementById("myLogin").innerHTML = "AGUARDE...";
// gapi.load('client:auth2', initClientSigOut);
waitLogin();
init=1;
}
}
function appendPre(message) {
document.body.innerHTML = message.trim();
}
</script>
<script async defer src="https://apis.google.com/js/api.js"
onload="this.onload=function(){};handleClientLoad()"
onreadystatechange="if (this.readyState === 'complete') this.onload()">
</script>
<div id="tudo">
<div id="mySidenav" class="sidenav">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
<a href="javascript:setMosaico();" id="mosaico">Mosaico</a>
<a href="javascript:setDash();" id="dash">Dashboard</a>
<a href="javascript:popupwindow('/visualizacao','VISUALIZACAO', screen.width/1, screen.height/1);" onclick="closeNav()" id="visualizacao"> Visualizacao</a>
<a href="javascript:setConfig()" id="conf">Configuracao</a>
<a href="javascript:setConfigCheckList()" id="confckl">Check-List</a>
<a href="javascript:setTelegram()" id="telegram">Telegram</a>
<a href="javascript:setSimulador()" id="sim">Simulador</a>
<a href="javascript:setSimuladorNovo()" id="simnovo">Simulador Novo</a>
<a href="javascript:setSimuladorLPR()" id="simlpr">Simulador LPR</a>
<a href="javascript:setConfigCheckList()" id="bloqueios">Bloqueios</a>
<a href="javascript:setResetMosaico();" id="reset">Reset Mosaico</a>
<a href="javascript:setSobre();" id="sobrenos">Sobre</a>
<a href="javascript:handleSignoutClick(0);" onclick="closeNav()" id="sair">Sair</a>
</div>
<div class="topnav" id="myTopnav">
<span style="background-color: #000000;color: blue;float:left;font-size:40px;cursor:pointer" onclick="openNav()">&#9776; </span>
<img title="logo" id="logotipo" src="" align="left" style="width:9%">
<!--a href="#news" onclick="javascript:void(0);" id="Fila">Fila</a-->
<div class="buttondiv">
<button class="buttonfila" id="Fila">Fila</button>
</div>
<div class="dropdown" id="listaclientes">
<button class="dropbtn" id="clientelabel">
CLIENTE
</button>
<div id="listaclientesItem" class="dropdown-content">
<a href="javascript:activecheckboxlist(this)">CUSTOMIZADO</a>
LISTA
</div>
<div id="listaclientesItembkp" style="display:none">
</div>
</div>
<div class="buttondiv">
<button onclick="javascript:setoperacao(0);" class="buttonwork" id="operacao">>AGUARDE...</button>
</div>
<div class="dropdown" id="viewList">
<button class="dropbtn">
VIEW
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown-content">
<a href="javascript:changeGrade('column7x');">7x</a>
<a href="javascript:changeGrade('column6x');">6x</a>
<a href="javascript:changeGrade('column5x');">5x</a>
<a href="javascript:changeGrade('column');">4x</a>
<a href="javascript:changeGrade('column3x');">3x</a>
<a href="javascript:changeGrade('Auto');">Auto</a>
</div>
</div>
<img title="avatar" id="myavatar" style="width:3%" src="getresource?r=anonymus.jpg" align="left">
<a href="" style="display:none" id="myLogin"></a>
<a href="javascript:handleAuthClick(0);" id="myLoginS"></a>
<a href="javascript:void(0);" class="icon" onclick="NavResponsive()">
<i class="fa fa-bars"></i>
</a>
</div>
<div class="rowblock" id="portal">
<tr></tr>
</div>
<div style="display:none" id="listocorrencias">
<tr>
<iframe id="iframelistocorrencias" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0" allowfullscreen></iframe>
</tr>
</div>
<div style="display:none" id="configuracao">
<tr>
<iframe id="iframeconfiguracao" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:70%; height:100%; border:0" allowfullscreen></iframe>
</tr>
</div>
<div style="display:none" id="configuracaochecklist">
<tr>
<iframe id="iframeconfiguracaochecklist" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0" allowfullscreen></iframe>
</tr>
</div>
<div style="display:none" id="cercavirtual">
<tr>
<iframe id="iframecercavirtual" src="" frameborder="0" style="position:absolute; top:7%; left:70%; width:30%; height:100%; border:0" allowfullscreen></iframe>
</tr>
</div>
<div style="display:none" id="simulador">
<tr>
<iframe id="iframesimulador" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe>
</tr>
</div>
<div style="display:none" id="simuladornovo">
<tr>
<iframe id="iframesimuladornovo" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe>
</tr>
</div>
<div style="display:none" id="simuladorlpr">
<tr>
<iframe id="iframesimuladorlpr" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe>
</tr>
</div>
<div style="display:none" id="sobre" >
<tr>
<iframe id="iframesobre" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe>
</tr>
</div>
<div id="conteudototal" >
<div class="row" id="conteudo">
BODY
</div>
<tr id="bodymosaico">
<div id="ocoModal" class="modal">
<form class="modal-content animate" id="formOcorrencia" action="javascript:gravaOcorrencia()" method="get">
<div class="imgcontainer">
<div style="width:100%">
<p><b>TRATAMENTO DE OCORRENCIA</b></p> <span onclick="document.getElementById('ocoModal').style.display = 'none'" class="close" title="Close Modal">&times;</span>
</div>
<div class="imgchild">
<p><b>Gravacao</b></p>
<video id="videoocorrencia" preload="metadata" autoplay loop muted playsinline width=100% height=77% controls src="getresource?r=atualli.png&" type="video/mp4"> </video>
</div>
<div class="imgchild">
<p><b>Ao Vivo</b></p>
<img src="" id="aovivo" class="refrx" alt="" style="width:100%;display:none;">
<canvas title="Ao vivo" id="cvcx" alt="" style="width:100%"></canvas>
</div>
</div>
<div class="container" style="background-color:#f1f1f1">
<label for="rot"><b>.</b></label></br>
<label id="IdOcoView" for="rot"><b>ID: </b></label></br>
<label id="IdCliente" for="rot"><b>Cliente: </b></label></br>
<label id="Operador" for="rot"><b>Operador: </b></label></br>
<label id="DataOcorrencia" for="rot"><b>Data: </b></label></br>
<label id="NomeRoteiro" for="rot"><b>Roteiro: </b></label></br>
<label id="Prioridade" for="rot"><b>Prioridade: </b></label></br>
<!--label id="videoOco" for="rot"><b>Video: </b></label></br-->
</div>
<div class="container">
<label id="pergunta1" for="uname"><b>Procedimento</b></label>
<input type="text" id="procedimento" placeholder="Texto livre" name="procedimento" readonly style="background-color:#f1f1f1">
<label id="pergunta2" for="psw"><b>Motivo</b></label>
<input type="text" id="template" placeholder="Texto livre" name="template" required onkeydown="return (event.keyCode!=13);">
<!--textarea placeholder="Texto livre" rows="5" cols="10" id="template" style = "font-size: 12pt; width:100%; margin:5px 0;padding:3px" ></textarea-->
<label id="pergunta3" for="psw"><b>Audio</b></label>
<input type="file" id="audio" name="audio" accept="audio/*" multiple>
<button type="button" id="loadLastAudio" onclick="javascript:getUltimoAudio()">Carrega Ultimos Audios</button>
<select id="listaAudios" class="select_audio" style="background-color:#f1f1f1" name="formal" onchange="javascript:selAudio(this)"></select>
</br></br>
<a href="" id="lastaudio"></a>
<input type="hidden" name="cmd" id="GravaOcorrencia" value="">
<input type="hidden" name="idOco" id="idOco" value="">
<input type="hidden" name="idCamera" id="idCamera" value="">
<input type="hidden" name="nomeOperador" id="nomeOperador" value="">
<input type="hidden" name="idChat" id="idChat" value="">
<input type="hidden" name="cliente" id="cliente" value="">
<input type="hidden" name="roteiro" id="roteiro" value="">
<button type="submit" style="display:none" id="gravar" class="button">Grava</button>
<button type="button" style="display:none" id="descartar" onclick="javascript:descartaOcorrencia(0)" class="cancelbtn">Descartar</button>
<button type="button" style="display:none" id="desbloqueio" onclick="" class="cancelbtn">Desbloqueio</button>
<select class="select" id="listaContatos" style="background-color:#f1f1f1" name="formal" onchange="javascript:handleSelect(this)"></select>
<script type="text/javascript">
function handleSelect(elm)
{
if(elm.value.length>1)
window.location = elm.value;
}
</script>
</div>
</form>
</div>
</tr>
</div>
</div>
<script async">
var to = 1; // 2; //3;
var first = 0;
var idx = 0;
var tamFila = 0;
var myFila = 0;
var onlyView = 0;
var timergogo = 0;
var urlBase = '<?URL?>';
var atualColumn = "column";
var dashurl = "";
var confurl = "";
var voipurl = "";
var confcklurl = "";
var reseturl = "";
var visualizacaourl = "";
var telegramurl = "";
var filaurl = "";
var simuladorurl = "";
var simuladornovo = "";
var simuladorlpr = "";
var logourl = "";
var paginalogourl = "";
var offsetpos=0;
function activecheckboxlist(checkBox) {
let lista = document.getElementById("listaclientesItem").innerHTML;
let position = lista.search("input type");
if (position>0)
{
let newlista = document.getElementById("listaclientesItembkp").innerHTML;
document.getElementById("listaclientesItem").innerHTML=newlista;
// gogo();
offsetpos=0
}
else
{
// clearTimeout(timergogo);
document.getElementById("listaclientesItembkp").innerHTML=lista;
const listaarray = lista.split("</a>");
let newlista=listaarray[0];
for (var i = 1; i < listaarray.length; i++) {
let item = listaarray[i];
let start = item.search(">");
let end = item.substring(start).search("<");
let name = item.substring(start+1,item.length);
let newitem = item.replace(">", "><input type=\"checkbox\" onclick=\"addclientcustom('"+name+"')\">");
newlista+=newitem;
}
// let result = lista.replaceAll("</a>", "<input type=\"checkbox\" onclick=\"addclientcustom(this)\"></a>");
document.getElementById("listaclientesItem").innerHTML=newlista;
}
}
function addclientcustom(cliente) {
makeMosaico(cliente,true);
}
function makeMosaico(cliente,flagAdd)
{
if(flagAdd==false)
offsetpos=0;
clearTimeout(timergogo);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("conteudo").style.display = "flex";
var json = JSON.parse(this.responseText);
if (cliente != json.mosaico) cliente = json.mosaico;
json.urlbase="/proxyimg?img="+json.urlbase;
urlBase = json.urlbase+":"+json.portabase;
var mosaico="";
for (var i=0;i<json.cameras.length;i++)
{
var p=i+offsetpos;
var sid=p.toString().padStart(2, "0");
camera = json.cameras[i];
mosaico+="<div class = \"column\">\r\n" +
" <img id=\"img"+cliente+sid+"\" class=\"refr\" style=\"width:100;display:none;\" src=\"getresource?r=atualli.png\" srcorg=\""+json.urlbase+":"+json.portabase+"/getcamera?c="+camera.camera+"\" >\r\n" +
" <canvas title = \"\r\n"+
" Cliente: "+camera.cliente+"\r\n" +
"DVR: "+camera.equipamento+" ("+camera.dvr+")\r\n"+
"IP : "+camera.url+":"+camera.porta+" \r\n" +
"Cam : "+camera.cameranome+" ("+camera.canal+" ["+camera.id+"]) \r\n" +
"Recorder : "+camera.statusgravacao+"\"\r\n" +
" id=\"cvc"+cliente+sid+"\" class=\"refrc\" alt=\"\" style=\"width:100%\"></canvas>\r\n" +
"</div>\r\n"
}
var mosaicoold=document.getElementById("conteudo").innerHTML;
if(offsetpos==0)
mosaicoold="";
offsetpos+=json.cameras.length;
var mosaiconew = mosaicoold + mosaico;
document.getElementById("conteudo").innerHTML = mosaiconew;
document.getElementById("clientelabel").innerHTML = cliente;
atualColumn="column";
var novaGrade=getCookie("GRADE-"+cliente);
if(novaGrade)
changeGrade(novaGrade);
else
changeGrade("Auto");
mosaiconew = document.getElementById("conteudo").innerHTML
// setCookie("MOSAICO-"+cliente,mosaiconew,10);
setCookie("CLIENTE", cliente, 10);
gogo(true);
}
};
document.getElementById("clientelabel").innerHTML = cliente;
var name=loadLogin();
xhttp.open("GET", "getdatamosaico?cliente="+cliente+"&operador="+name, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
var mosaico=getCookie("MOSAICO-"+cliente);
if(mosaico) {
}
setCookie("CLIENTE",cliente,10);
}
function setAcessos(json) {
if (json.dashboard == "")
document.getElementById("dash").style.display = "none";
if (json.configuracao == "")
document.getElementById("conf").style.display = "none";
if (json.configuracaochecklist == "") {
document.getElementById("confckl").style.display = "none";
document.getElementById("bloqueios").style.display = "none";
}
if (json.simulador == "")
document.getElementById("sim").style.display = "none";
if (json.simuladornovo == "")
document.getElementById("simnovo").style.display = "none";
if (json.simuladorlpr == "")
document.getElementById("simlpr").style.display = "none";
if (json.reset == "")
document.getElementById("reset").style.display = "none";
if (json.telegram == "")
document.getElementById("telegram").style.display = "none";
if (json.visualizacao == "")
document.getElementById("visualizacao").style.display = "none";
if (json.fila == "") {
document.getElementById("operacao").style.display = "none";
document.getElementById("Fila").style.display = "none";
}
if (json.logo == "") {
document.getElementById("logotipo").src = "getresource?r=alogo.png";
} else {
document.getElementById("logotipo").src = json.logo;
}
}
function makeLista()
{
var cliente="ATUALLI";
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var json = JSON.parse(this.responseText);
var lista="<a href =\"javascript:activecheckboxlist(this)\">CUSTOMIZADO</a>";
for (var i=0;i<json.listaclientes.length;i++)
{
lista+="<a href =\"javascript:makeMosaico('"+json.listaclientes[i]+"',false)\">"+json.listaclientes[i]+"</a>\r\n"
}
document.getElementById("listaclientesItem").innerHTML = lista;
dashurl = json.dashboard;
confurl = json.configuracao;
voipurl = json.voip;
confcklurl = json.configuracaochecklist;
reseturl = json.reset;
visualizacaourl = json.visualizacao;
telegramurl = json.telegram;
filaurl = json.fila;
simuladorurl = json.simulador;
simuladornovo = json.simuladornovo;
simuladorlpr = json.simuladorlpr;
paginalogourl = json.paginalogo;
setAcessos(json);
}
};
document.getElementById("clientelabel").innerHTML = cliente;
var name=loadLogin();
xhttp.open("GET", "getdatamosaico?cliente="+cliente+"&operador="+name, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
function NavResponsive() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
function setTelegram() {
popupwindow(telegramurl,'TELEGRAM', screen.width/4, screen.height)
closeNav();
}
function resetAllView() {
document.getElementById("configuracao").style.display = "none";
document.getElementById("configuracaochecklist").style.display = "none";
document.getElementById("conteudototal").style.display = "none";
document.getElementById("listocorrencias").style.display = "none";
document.getElementById("simulador").style.display = "none";
document.getElementById("simuladornovo").style.display = "none";
document.getElementById("simuladorlpr").style.display = "none";
document.getElementById("cercavirtual").style.display = "none";
document.getElementById("sobre").style.display = "none";
}
function setCercaVirtual()
{
// resetAllView();
var objAovivo = document.getElementById("iframecercavirtual");
var osrc= objAovivo.getAttribute('src');
if ( osrc=="")
{
objAovivo.setAttribute('src', "/programacao?id=1");
}
document.getElementById("cercavirtual").style.display = "flex";
closeNav();
}
function setDash() {
resetAllView();
var objAovivo = document.getElementById("iframelistocorrencias");
var osrc= objAovivo.getAttribute('src');
if ( osrc=="")
{
objAovivo.setAttribute('src', dashurl);
}
document.getElementById("listocorrencias").style.display = "flex";
closeNav();
}
function setMosaico() {
resetAllView();
document.getElementById("conteudototal").style.display = "block";
closeNav();
}
function setResetMosaico()
{
setMosaico();
resetMosaico(0);
}
function setSimulador()
{
resetAllView();
var objAovivo = document.getElementById("iframesimulador");
var osrc= objAovivo.getAttribute('src');
if ( osrc=="")
{
objAovivo.setAttribute('src', simuladorurl);
}
document.getElementById("simulador").style.display = "flex";
closeNav();
}
function setSobre() {
resetAllView();
var objAovivo = document.getElementById("iframesobre");
var osrc = objAovivo.getAttribute('src');
if (osrc == "") {
objAovivo.setAttribute('src', paginalogourl);
}
document.getElementById("sobre").style.display = "flex";
closeNav();
}
function setSimuladorNovo()
{
resetAllView();
var objAovivo = document.getElementById("iframesimuladornovo");
var osrc= objAovivo.getAttribute('src');
if ( osrc=="")
{
objAovivo.setAttribute('src', simuladornovo);
}
document.getElementById("simuladornovo").style.display = "flex";
closeNav();
}
function setSimuladorLPR()
{
resetAllView();
var objAovivo = document.getElementById("iframesimuladorlpr");
var osrc= objAovivo.getAttribute('src');
if ( osrc=="")
{
objAovivo.setAttribute('src', simuladorlpr);
}
document.getElementById("simuladorlpr").style.display = "flex";
closeNav();
}
function setConfig() {
resetAllView();
var objAovivo = document.getElementById("iframeconfiguracao");
var osrc= objAovivo.getAttribute('src');
if ( osrc=="")
{
objAovivo.setAttribute('src', confurl);
}
document.getElementById("configuracao").style.display = "flex";
setCercaVirtual();
closeNav();
}
function setConfigCheckList() {
resetAllView();
var objAovivo = document.getElementById("iframeconfiguracaochecklist");
var osrc= objAovivo.getAttribute('src');
if ( osrc=="")
{
objAovivo.setAttribute('src', confcklurl);
}
document.getElementById("configuracaochecklist").style.display = "flex";
closeNav();
}
function openNav() {
document.getElementById("mySidenav").style.width = "250px";
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
}
function changeGrade(novo)
{
var lista = document.getElementsByClassName(atualColumn);
var len=lista.length;
var newClass=novo;
if(novo=="Auto")
{ newClass="column3x";
if (len>=8) newClass="column";
if (len>=16) newClass="column5x";
if (len>=24) newClass="column6x";
if (len>=31) newClass="column7x";
}
for (var i = 0; i < len; i ++)
{
lista[0].className = newClass;
}
atualColumn=newClass;
let cliente=document.getElementById("clientelabel").innerHTML;
cliente=cliente.trim();
setCookie("GRADE-"+cliente,novo,10);
}
function drawOperador(name) {
document.getElementById("myLogin").innerHTML = name;
}
function selecionaOperador(name) {
var atual= getCookie("LOGIN");
if (name!=atual)
{
if((name.length>0) && (name!="LOGOFF")&& (name!="LOGIN"))
login(name);
if(atual.length>0)
logout(atual);
}
if(!name) name="LOGIN";
setCookie("LOGIN",name,10);
drawOperador(name);
}
function setCookie(name,value,days) {
window.localStorage.setItem(name,value);
}
function getCookie(name) {
return window.localStorage.getItem(name);
}
function eraseCookie(name) {
document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
}
function openForm() {
document.getElementById("myForm").style.display = "block";
}
function closeForm() {
document.getElementById("myForm").style.display = "none";
}
function resetFormOcorrencia()
{
var obj = document.getElementById("videoocorrencia");
obj.setAttribute('src', "");
var objproc = document.getElementById("procedimento");
objproc.setAttribute('value', "");
var objtmp = document.getElementById("template");
objtmp.setAttribute('value', "");
// document.getElementById("videoOco").innerHTML = "<b> Video: Aguarde...</b>";
document.getElementById("IdCliente").innerHTML = "<b> Cliente: Aguarde...</b>";
document.getElementById("IdOcoView").innerHTML = "<b> ID: Aguarde...</b>";
document.getElementById("NomeRoteiro").innerHTML = "<b> Roteiro: Aguarde...</b>";
document.getElementById("DataOcorrencia").innerHTML = "<b> Data: Aguarde... </b>";
document.getElementById("Operador").innerHTML = "<b> Operador: Aguarde... </b>";
document.getElementById("Prioridade").innerHTML = "<b> Prioridade: Aguarde...</b>";
var objidOco = document.getElementById("idOco");
objidOco.setAttribute('value', "");
var objnOp = document.getElementById("nomeOperador");
objnOp.setAttribute('value', "");
var objnidChat = document.getElementById("idChat");
objnidChat.setAttribute('value', "");
document.getElementById("desbloqueio").style.display = 'none'
document.getElementById("gravar").style.display = 'none'
document.getElementById("descartar").style.display = 'none'
document.getElementById("gravar").innerHTML = "Gravar";
document.getElementById("gravar").disabled = false;
document.getElementById("descartar").innerHTML = "Descartar";
document.getElementById("descartar").disabled = false;
var objAovivo = document.getElementById("aovivo");
objAovivo.setAttribute('src', '');
objAovivo.setAttribute('class', 'refrx');
document.getElementById("audio").value = "";
document.getElementById("lastaudio").innerHTML = "";
document.getElementById("listaAudios").innerHTML = "";
}
function popupwindow(url, title, w, h) {
var left = (screen.width / 2) - (w / 2);
var top = (screen.height / 2) - (h / 2);
return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
}
function openurl(url)
{
var urls = url;
if (onlyView==1)
urls = urls + "?view=true";
window.location.replace(urls);
// return window.open(urls,'_self');
}
function execDesbloqueio(url)
{
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var desbloqueio = document.getElementById("desbloqueio");
desbloqueio.innerHTML = this.responseText;
}
};
var desbloqueio = document.getElementById("desbloqueio").innerHTML = "AGUARDE...";
xhttp.open("GET", url, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
function sleep(time) {
return new Promise((resolve) => setTimeout(resolve, time));
}
function getVideoOcorrencia() {
if (myFila <= 0) return;
resetFormOcorrencia();
// Usage!
sleep(100).then(() => {
// Do something after the sleep!
if (myFila <= 0) return;
document.getElementById("desbloqueio").innerHTML="Desbloqueio";
document.getElementById("gravar").innerHTML = "Grava";
//document.getElementById('ocoModal').style.display = 'block'
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
if(this.responseText.indexOf("VAZIO") !== -1) return;
var json = JSON.parse(this.responseText);
if (json.status == "Manual") {
document.getElementById('ocoModal').style.display = 'block';
resetFormOcorrencia();
//document.getElementById('ocoModal').style.display = 'block';
document.getElementById("descartar").style.display = 'block'
document.getElementById("gravar").style.display = 'block'
document.getElementById("desbloqueio").style.display = 'none'
var obj = document.getElementById("videoocorrencia");
obj.setAttribute('src', json.video);
//document.getElementById("procedimento").innerHTML = "<b>" + json.procedimento + "</b>";
document.getElementById("template").innerHTML = json.templat ;
var objproc = document.getElementById("procedimento");
objproc.setAttribute('value', json.procedimento);
var objtmp = document.getElementById("template");
objtmp.setAttribute('value', json.templat);
var objidChat = document.getElementById("idChat");
objidChat.setAttribute('value', json.idchat);
var objCliente = document.getElementById("cliente");
objCliente.setAttribute('value', json.cliente);
var objRoteiro = document.getElementById("roteiro");
objRoteiro.setAttribute('value', json.roteiro);
var objAovivo = document.getElementById("aovivo");
objAovivo.setAttribute('src', json.urlcamera);
document.getElementById("IdCliente").innerHTML = "<b> Cliente: " + json.cliente + "</b>";
document.getElementById("IdOcoView").innerHTML = "<b> ID: " + json.id + "</b>";
document.getElementById("NomeRoteiro").innerHTML = "<b> Roteiro: " + json.roteiro + "</b>";
document.getElementById("DataOcorrencia").innerHTML = "<b> Data: " + json.data + "</b>";
document.getElementById("Prioridade").innerHTML = "<b> Prioridade: " + json.prioridade + "</b>";
if (json.desbloqueio) {
var desbloqueio = document.getElementById("desbloqueio");
desbloqueio.style.display = 'block'
var url = json.desbloqueio;
desbloqueio.setAttribute('onclick', "execDesbloqueio('" + url + "')");
}
var lista = json.contatos.split(/,| |-/);
var options = "<option value=\"\">REALIZAR CONTATO</option>";
for (var i = 0; i < lista.length; i += 2) {
nome = lista[i];
telefone = lista[i + 1];
options += "<option value=\"tel:80" + telefone + "\">Ligar para " + nome + " " + telefone + "</option>";
}
document.getElementById("listaContatos").innerHTML = options;
document.getElementById("Operador").innerHTML = "<b> Operador: " + document.getElementById("myLogin").innerHTML + "</b>";
var objidOco = document.getElementById("idOco");
objidOco.setAttribute('value', json.id);
var objnOp = document.getElementById("nomeOperador");
objnOp.setAttribute('value', document.getElementById("myLogin").innerHTML);
}
else {
document.getElementById('ocoModal').style.display = 'none';
}
}
};
xhttp.open("GET", "getdatalocal?comando=Ocorrencia&operador=" + document.getElementById("myLogin").innerHTML, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
});
}
const fileInput = document.getElementById('audio');
fileInput.onchange = () => {
const selectedFile = fileInput.files[0];
if ((selectedFile) && (selectedFile.name.length > 0))
{
var dt = new Date();
var path = voipurl + dt.getFullYear() + "/" + String(dt.getMonth() + 1).padStart(2, '0') + "/" + String(dt.getDate()).padStart(2, '0') + "/";
var saudio = path+selectedFile.name;
var saudio = saudio.replace("[1]", "");
var objAudio = document.getElementById("lastaudio");
objAudio.setAttribute('href', saudio);
document.getElementById("lastaudio").innerHTML = saudio;
}
else {
document.getElementById("lastaudio").innerHTML = "";
}
}
function getUltimoAudio()
{
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function ()
{
if (this.readyState == 4 && this.status == 200)
{
var json = JSON.parse(this.responseText);
var file = json.voips[0].file;
var sfile = file.replace("/var/spool/asterisk/monitor", voipurl);
var objAudio = document.getElementById("lastaudio");
objAudio.setAttribute('href', sfile);
document.getElementById("lastaudio").innerHTML = sfile;
document.getElementById("loadLastAudio").innerHTML = "Carrega Ultimos Audios";
var options = "<option value=\"\">Lista Ultimos Audios</option>";
for (var i = 0; i < json.voips.length; i ++) {
var nome = json.voips[i].file;
var snome = nome.replace("/var/spool/asterisk/monitor", voipurl);
options += "<option value=\"" + snome + "\">" + snome + "</option>";
}
document.getElementById("listaAudios").innerHTML = options;
}
}
var videoobj = document.getElementById("videoocorrencia");
var video = videoobj.getAttribute('src');
var dvideo = video;
document.getElementById("loadLastAudio").innerHTML = "AGUARDE...";
xhttp.open("GET", dvideo + "&ramal=2002&phone=0", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
function testAudio(elm)
{
window.open(elm.value);
}
function selAudio(elm) {
if (elm.value.length > 1) {
var objAudio = document.getElementById("lastaudio");
objAudio.setAttribute('href', elm.value);
document.getElementById("lastaudio").innerHTML = elm.value;
}
}
function sendMsgFinal(status)
{
var xhttp = new XMLHttpRequest();
var videoobj = document.getElementById("videoocorrencia");
var video = videoobj.getAttribute('src');
var objnOp = document.getElementById("nomeOperador");
var operador = objnOp.getAttribute('value');
var idResp2 = document.getElementById("template").value;
var idChat = document.getElementById("idChat").value;
var cliente = document.getElementById("cliente").value;
var roteiro = document.getElementById("roteiro").value;
var idOco = document.getElementById("idOco").value;
var saudio = document.getElementById("lastaudio").innerHTML;
if (saudio.length > 0)
idResp2 = idResp2 + " (AUDIO ANEXADO)";
var dvideo = video;
var url = dvideo + "&idchat=" + idChat + "&status=" + status + "&idoco=" + idOco + "&cliente=" + cliente + "&roteiro=" + roteiro + "&motivo=" + idResp2 + "&audio=" + saudio;
xhttp.open("GET", url, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
function gravaOcorrencia()
{
var template = document.getElementById("template").value;
if (template.length > 0) {
var r = confirm("Deseja realmente salvar a ocorrencia ?");
if (r == true) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var json = JSON.parse(this.responseText);
sendMsgFinal("grava");
resetFormOcorrencia();
document.getElementById('ocoModal').style.display = 'none';
alert("OCORRENCIA GRAVADA COM SUCESSO !");
document.getElementById("gravar").innerHTML = "Gravar";
document.getElementById("gravar").disabled = false;
}
};
document.getElementById("gravar").innerHTML = "Aguarde..";
document.getElementById("gravar").disabled = true;
var objidOco = document.getElementById("idOco");
var idOco = objidOco.getAttribute('value');
var objnOp = document.getElementById("nomeOperador");
var operador = objnOp.getAttribute('value');
var idResp1 = document.getElementById("procedimento").value;
var idResp2 = document.getElementById("template").value;
var idChat = document.getElementById("idChat").value;
xhttp.open("GET", "getdatalocal?comando=GravaOcorrencia&idOco=" + idOco + "&resposta1=" + idResp1 + "&resposta2=" + idResp2 + "&operador=" + operador, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
}
else
alert("Preencha o campo motivo e justifique a ocorrencia !");
}
function resetMosaico() {
var r = confirm("Deseja realmente reiniciar o Mosaico ?. Use apenas em quando as imagens estiverem congeladas a mais de 1 hora");
if (r == true) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
alert("MOSAICO REINICIADO COM SUCESSO !");
document.getElementById("reset").innerHTML = "RESET";
document.getElementById("reset").disabled = false;
}
};
document.getElementById("reset").innerHTML = "AGUARDE..";
document.getElementById("reset").disabled = true;
var login = document.getElementById("myLogin").innerHTML;
var cliente = document.getElementById("clientelabel").innerHTML;
var texto = "AT" + cliente + "_reiniciado_pelo_operador_" + login;
xhttp.open("GET", urlBase+reseturl + texto, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
}
function descartaOcorrencia() {
var template = document.getElementById("template").value;
if (template.length > 0) {
var r = confirm("Deseja realmente descartar ocorrencia ?");
if (r == true) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var json = JSON.parse(this.responseText);
sendMsgFinal("descarta");
resetFormOcorrencia();
document.getElementById('ocoModal').style.display = 'none';
alert("OCORRENCIA DESCARTADA COM SUCESSO !");
document.getElementById("descartar").innerHTML = "Descartar";
document.getElementById("descartar").disabled = false;
}
};
document.getElementById("descartar").innerHTML = "Aguarde..";
document.getElementById("descartar").disabled = true;
var objidOco = document.getElementById("idOco");
var idOco = objidOco.getAttribute('value');
var objnOp = document.getElementById("nomeOperador");
var operador = objnOp.getAttribute('value');
var idResp1 = document.getElementById("procedimento").value;
var idResp2 = document.getElementById("template").value;
xhttp.open("GET", "getdatalocal?comando=GravaOcorrencia&descarta=true&idOco=" + idOco + "&resposta1=" + idResp1 + "&resposta2=" + idResp2 + "&operador=" + operador, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
}
else
alert("Preencha o campo motivo e justifique o Descarte!");
}
function myFunctionNav() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
var solicitaLog = 0;
function login(login) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4) {
solicitaLog = 0;
}
};
xhttp.open("GET", "getdatalocal?comando=Login&login="+login+"&ip=0", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
function logout(login) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4) {
solicitaLog = 0;
}
};
xhttp.open("GET", "getdatalocal?comando=Logout&login=" + login + "&ip=0", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
function setoperacao() {
var status = document.getElementById("operacao").innerHTML;
var usuario = document.getElementById("myLogin").innerHTML;
if ((usuario != "LOGIN") && (usuario != "")) {
if (status == "QUERO TRABALHAR") {
solicitaLog = 1;
document.getElementById("operacao").innerHTML = "AGUARDE...";
login(usuario);
}
if (status == "TRABALHANDO") {
solicitaLog = 1;
document.getElementById("operacao").innerHTML = "AGUARDE...";
logout(usuario);
}
}
}
function getFila()
{
if (onlyView==1) {
document.getElementById("operacao").innerHTML = "VISUALIZANDO";
tamFila = 0;
myFila = 0;
return;
}
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var json = JSON.parse(this.responseText);
document.getElementById("Fila").innerHTML = "FILA OCORRENCIAS " + "(" + json.myFila +"/"+json.numFila + ") ";
if (solicitaLog == 0) {
document.getElementById("operacao").innerHTML = json.status;
}
var status = document.getElementById("operacao").innerHTML;
if (status == "TRABALHANDO") {
if (json.numFila != "0") {
tamFila = parseInt(json.numFila);
myFila = parseInt(json.myFila);
if (document.getElementById('ocoModal').style.display != 'block') {
getVideoOcorrencia();
}
}
else {
tamFila = 0;
myFila = 0;
}
}
else {
tamFila = 0;
myFila = 0;
}
}
};
var usuario = document.getElementById("myLogin").innerHTML;
if(filaurl!=""){
xhttp.open("GET", filaurl+usuario, true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("");
}
}
function gogo2()
{
getFila()
setTimeout(gogo2, to * 1000);
}
function refreshimg(img)
{
}
function imgRedirect(img)
{
}
function errorloadimg(img) {
var d = new Date(),
dummy = d.getTime();
var newurl = 'getresource?r=atualli.png&';
var obj = img,
s_rc = obj.getAttribute('src'),
pure_src = s_rc.substring(s_rc.indexOf('c='), s_rc.indexOf('c=') + 4);
obj.setAttribute('src',newurl+pure_src + '&' + dummy);
}
var resx = 1000;
var resy = 1000;
var canvasvx = 720;
var canvasvy = 480;
var lastDate = new Date();
var dataXhttp = [];
var slot = 0;
var forceinterval=0;
function gogo(flag) {
if(flag==true)
{ var pix = document.getElementsByClassName('refr');
for (var i = 0; i < pix.length; i++) {
var img = pix[i];
img.src = img.src;
img.onload = function () {
var ids = this.id;
var cam = "cvc" + ids.substring(3); //, 5);
var c = document.getElementById(cam);
if(c) {
var ctx = c.getContext("2d");
c.setAttribute('width', canvasvx);
c.setAttribute('height', canvasvy);
ctx.drawImage(this, 0, 0, canvasvx, canvasvy);
}
}
}
forceinterval=30;
}
if (first == 0) {
first += 1;
for (var i = 0; i < 500; i++) {
for (var j = 0 ; j <= 32 ; j++) {
dataXhttp[i + 500 * j] = new XMLHttpRequest();
}
}
var pix = document.getElementsByClassName('refr');
for (var i = 0; i < pix.length; i++) {
var img = pix[i];
img.src = img.src;
img.setAttribute("data-completed", -1);
img.setAttribute("srcorg", "");
img.onload = function () {
var ids = this.id;
var cam = "cvc" + ids.substring(3); //, 5);
var c = document.getElementById(cam);
if(c) {
var ctx = c.getContext("2d");
c.setAttribute('width', canvasvx);
c.setAttribute('height', canvasvy);
ctx.drawImage(this, 0, 0, canvasvx, canvasvy);
}
}
}
timergogo = setTimeout(gogo, 10);
}
else {
var pix = document.getElementsByClassName('refr');
for (var i = 0; i < pix.length; i++) {
var img = pix[i];
var size = pix.length * slot;
var impl = function (img, i, size)
{
var comp = img.getAttribute("data-completed");
if (comp < 0) {
var cam = img.id.substring(3, 5);
let newurl = urlBase + "c=" + cam;
var srcorg = img.getAttribute("srcorg");
if (srcorg!="") {
newurl = srcorg;
}
var xhttp = dataXhttp[i + size];
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var json = this.response;
var reader = new FileReader();
reader.onloadend = function () {
if (reader.result.length > 0) {
img.src = reader.result;
img.onload = function () {
this.setAttribute("data-completed", -1);
var ids = this.id;
var cam = "cvc" + ids.substring(3); //, 5);
var c = document.getElementById(cam);
if(c) {
var ctx = c.getContext("2d");
var resx = this.width
var resy = this.height;
c.setAttribute('width', canvasvx);
c.setAttribute('height', canvasvy);
ctx.drawImage(this, 0, 0, canvasvx, canvasvy);
}
}
img.onerror = function () {
this.setAttribute("data-completed", -1);
}
}
}
reader.readAsDataURL(json);
}
else {
img.setAttribute("data-completed", -1);
}
};
xhttp.open("GET", newurl, true);
xhttp.responseType = 'blob';
xhttp.send(null);
img.setAttribute("data-completed", 0);
}
else {
comp++;
if (comp > 13) {
comp = -1;
}
img.setAttribute("data-completed", comp);
}
}
impl(img, i, size);
}
var d = new Date();
var dummy = d.getTime();
pix = document.getElementsByClassName('refrx');
for (var i = 0; i < pix.length; i++) {
var img = pix[i];
var c = document.getElementById('cvcx');
if (img.src.indexOf("getcamera") >= 0) {
if (img.complete) {
var s_rc = img.src;
var pure_src = s_rc.substring(0, s_rc.indexOf('c=') + 4);
img.src = pure_src + "&" + dummy;
img.onload = function () {
this.complete = true;
var c = document.getElementById('cvcx');
var ctx = c.getContext("2d");
c.setAttribute('width', this.width);
c.setAttribute('height', this.height);
ctx.drawImage(this, 0, 0, this.width, this.height);
}
}
}
}
slot++;
slot = slot & 0x1f;
var actual = new Date();
var interval = actual - lastDate;
lastDate = actual;
if (interval > 150) interval = 150 - (interval - 150);
else interval = 150;
// console.log("inteval = ", interval);
if (interval < 0 )
{
interval = 1;
}
if(forceinterval-->0)
interval = 1;
timergogo = setTimeout(gogo, interval);
}
}
function iniciaPagina()
{
const urlParams = new URLSearchParams(window.location.search);
var name=loadLogin();
if((!name) || (name=="LOGIN"))
{
openurl("/novo-front/index");
}
else
{
var foto = loadFotoLogin();
if (foto) {
document.getElementById("myavatar").src = foto;
}
const myParam = urlParams.get('view');
if (myParam)
onlyView = 1;
var cliente=getCookie("CLIENTE");
if(!cliente) {
cliente = document.getElementById("clientelabel").innerHTML;
cliente=cliente.trim();
}
const parclient = urlParams.get('cliente');
if (parclient)
cliente = parclient;
makeLista();
makeMosaico(cliente,false);
gogo2();
gogo();
}
}
//Make the DIV element draggagle:
dragElement(document.getElementById("ocoModal"));
function dragElement(elmnt) {
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
if (document.getElementById(elmnt.id + "header")) {
/* if present, the header is where you move the DIV from:*/
document.getElementById(elmnt.id + "header").onmousedown = dragMouseDown;
} else {
/* otherwise, move the DIV from anywhere inside the DIV:*/
elmnt.onmousedown = dragMouseDown;
}
function dragMouseDown(e) {
e = e || window.event;
//e.preventDefault();
// get the mouse cursor position at startup:
pos3 = e.clientX;
pos4 = e.clientY;
var elementId = e.srcElement.id;
if (elementId != "template") {
document.onmouseup = closeDragElement;
// call a function whenever the cursor moves:
document.onmousemove = elementDrag;
}
}
function elementDrag(e) {
e = e || window.event;
//e.preventDefault();
// calculate the new cursor position:
pos1 = pos3 - e.clientX;
pos2 = pos4 - e.clientY;
pos3 = e.clientX;
pos4 = e.clientY;
// set the element's new position:
elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
}
function closeDragElement() {
/* stop moving when mouse button is released:*/
document.onmouseup = null;
document.onmousemove = null;
}
}
</script>
</body>
</html>