411 lines
21 KiB
Plaintext
411 lines
21 KiB
Plaintext
<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.master" CodeBehind="picada.aspx.vb" Inherits="WebIntranet.picada" %>
|
|
|
|
<asp:Content ID="Content1" ContentPlaceHolderID="Content" runat="server" ClientIDMode="Static">
|
|
<div>
|
|
<input type="submit" onclick="btnNada()" value="piedra" style="position: absolute; top: -8001px;" />
|
|
<%-- TABS --%>
|
|
<nav>
|
|
<div class="nav nav-tabs" id="nav-tab" role="tablist">
|
|
<a class="nav-item nav-link active" id="nav-intPicada-tab" style="color: black; border-top-left-radius: 15px !important; border-top-right-radius: 15px !important;" data-toggle="tab" href="#intPicada" role="tab" aria-controls="intPicada" aria-selected="true">Introducir Picada</a>
|
|
<a class="nav-item nav-link" id="nav-intIncidencia-tab" style="color: black; border-top-left-radius: 15px !important; border-top-right-radius: 15px !important;" data-toggle="tab" href="#intIncidencia" role="tab" aria-controls="intIncidencia" aria-selected="false">Introducir Incidencia</a>
|
|
<a class="nav-item nav-link" id="nav-listPicada-tab" style="color: black; border-top-left-radius: 15px !important; border-top-right-radius: 15px !important;" data-toggle="tab" href="#listPicada" role="tab" aria-controls="listPicada" aria-selected="false">Listado de Picadas</a>
|
|
</div>
|
|
</nav>
|
|
|
|
|
|
|
|
<div class="tab-content" id="nav-tabContent">
|
|
|
|
<%-- INTRODUCIR PICADA --%>
|
|
|
|
<div class="tab-pane fade active" id="intPicada" role="tabpanel" aria-labelledby="nav-intPicada-tab">
|
|
<div class="secPicada d-flex justify-content-center align-items-center">
|
|
<div class="d-flex flex-column justify-content-center mt-3">
|
|
<div id="fechaActual" style="margin: auto" runat="server">
|
|
<p>Fecha / Hora de Picada: <span id="fechaHoraPicada"></span></p>
|
|
</div>
|
|
<div class="incidencias" style="display: block;">
|
|
<p style="margin-right: 15px;">Incidencia:</p>
|
|
<select class="selectIn" id="selIncidencia" runat="server">
|
|
</select>
|
|
</div>
|
|
<div class="d-flex justify-content-center">
|
|
<dx:BootstrapButton runat="server" ID="btnPicar" Text="Picar" AutoPostBack="false" CssClasses-Control="btnVerde btnAlargado">
|
|
</dx:BootstrapButton>
|
|
</div>
|
|
<div id="mensajePicada" runat="server">
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<%-- INTRODUCIR INCIDENCIA --%>
|
|
|
|
<div class="tab-pane fade" id="intIncidencia" role="tabpanel" aria-labelledby="nav-intIncidencia-tab">
|
|
<div class="secPicada d-flex justify-content-center align-items-center">
|
|
<div class="row flex-column justify-content-center mt-3" style="max-width: 100%;">
|
|
<div id="listIncidencia" runat="server">
|
|
<p id="mensajeIncidencia" runat="server"></p>
|
|
<div class="row columna justify-content-between IntroducirFechas" style="max-width: 100%; margin-top: 0px;">
|
|
<div class="row columna selectInHora justify-content-between">
|
|
<p>Fecha<span style="color: red">*</span></p>
|
|
<div class="divInpHora row">
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Inicio</span>
|
|
</div>
|
|
<input id="inpFechaInicioIncidencia" class="inFecha" runat="server" type="date" />
|
|
</div>
|
|
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Final</span>
|
|
</div>
|
|
<input id="inpFechaFinIncidencia" class="inFecha" runat="server" type="date" />
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div style="width: 100%">
|
|
<hr />
|
|
</div>
|
|
<div class="row justify-content-center" style="min-width: 100%;">
|
|
<div class="incidencias" style="width: 100%;">
|
|
<p style="margin-right: 15px; margin-top: 0px; margin-bottom: 0.5rem !important">Incidencia<span style="color: red;">*</span>:</p>
|
|
<dx:ASPxComboBox TextField="Descripcion" ValueField="idIncidencias" runat="server" ID="selIncidenciaNoReloj"></dx:ASPxComboBox>
|
|
<%--<select class="selectIn" id="selIncidenciaNoReloj" runat="server"> </select>--%>
|
|
</div>
|
|
</div>
|
|
<div style="width: 100%">
|
|
<hr />
|
|
</div>
|
|
<div class="columna selectInHora justify-content-between">
|
|
<p>Horario mañana</p>
|
|
<div class="row divInpHora">
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Inicio</span>
|
|
</div>
|
|
<input onchange="totalHoras()" id="inpIniManana" type="time" runat="server" class="inHora" />
|
|
</div>
|
|
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Final</span>
|
|
</div>
|
|
<input onchange="totalHoras()" id="inpFinManana" type="time" runat="server" class="inHora" />
|
|
</div>
|
|
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Total</span>
|
|
</div>
|
|
<input id="inpTotalManana" type="time" runat="server" class="inHora" style="color: grey !important" readonly="true" />
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div style="width: 100%">
|
|
<hr />
|
|
</div>
|
|
<div class="columna selectInHora justify-content-between">
|
|
<p>Horario tarde</p>
|
|
<div class="row divInpHora">
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Inicio</span>
|
|
</div>
|
|
<input onchange="totalHorasTarde()" id="inpIniTarde" type="time" runat="server" class="inHora" />
|
|
</div>
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Final</span>
|
|
</div>
|
|
<input onchange="totalHorasTarde()" id="inpFinTarde" type="time" runat="server" class="inHora" />
|
|
</div>
|
|
<div class="col p-0 input-group flex-lg-nowrap">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text txtInputPrepend">Total</span>
|
|
</div>
|
|
<input id="inpTotalTarde" type="time" runat="server" class="inHora" style="color: grey !important" readonly="true" />
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div style="width: 100%">
|
|
<hr />
|
|
</div>
|
|
<div class="selectIn">
|
|
<p class="txtSobreInput">Observaciones</p>
|
|
<textarea cols="30" rows="5" class="selectIn wideInput" id="inpObservaciones" type="text" runat="server" />
|
|
</div>
|
|
<div class="selectIn">
|
|
<p class="txtSobreInput">Expediente</p>
|
|
<input class="selectIn" id="inpExpediente" type="text" runat="server" />
|
|
</div>
|
|
|
|
|
|
|
|
<div class="row justify-content-center" style="width: 100%; margin-top: 1rem;">
|
|
<dx:BootstrapButton runat="server" ID="btnIntIncidencia" Text="Introducir Incidencia" AutoPostBack="false" CssClasses-Control=" btnVerde btnAlargado">
|
|
</dx:BootstrapButton>
|
|
</div>
|
|
</div>
|
|
<p style="margin-top: 15px; font-size: 10px"><span style="color: red">*</span> Campos necesarios</p>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<%-- LISTADO DE PICADAS --%>
|
|
|
|
<div class="tab-pane fade" id="listPicada" role="tabpanel" aria-labelledby="nav-listPicada-tab">
|
|
|
|
<div class="d-flex-column justify-content-center">
|
|
|
|
<div class="row IntroducirFechas align-items-center wrap" style="width: 100%; margin-left: auto !important; margin-right: auto !important; margin-top: 25px !important;">
|
|
|
|
<p style="margin-top: 16px; margin-bottom: 0px; line-height: 35px">Del</p>
|
|
<input id="inpFechaInicio" class="inputFecha" style="margin-top: 16px;" value="2022-08-13" runat="server" type="date" />
|
|
|
|
|
|
<p style="margin-top: 16px; margin-bottom: 0px; line-height: 35px;">al</p>
|
|
<input id="inpFechaFin" style="margin-top: 16px;" class="inputFecha" runat="server" type="date" />
|
|
|
|
<dx:BootstrapButton runat="server" ID="btnFechas" Text="Buscar" AutoPostBack="false" CssClasses-Control="btnFecha btnVerde btnAlargado">
|
|
</dx:BootstrapButton>
|
|
</div>
|
|
<div class="row">
|
|
|
|
<button id="btnImprimir" class="btn btnVerde" onclick="Imprimir()" runat="server">
|
|
<img src="Content/images/print.svg" style="height: 15px; width: auto; margin-right: 5px;" />
|
|
Imprimir</button>
|
|
|
|
<a class='btnVerde btn' id='mostrarGeneral' onclick='botonMostrarTodo("mostrarGeneral")' role='button' style='margin-left:15px;text-align:center !important' runat="server">Mostrar todo</a>
|
|
|
|
</div>
|
|
<p id="mensaje" runat="server"></p>
|
|
|
|
|
|
<div id="tablaPicadas" runat="server">
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div id="tablaImpresion" class="myDivToPrint" style="display: none" runat="server"></div>
|
|
|
|
<script>
|
|
|
|
|
|
/***MANTENER LA TAB ACTIVA ABIERTA TRAS REFRESCAR***/
|
|
|
|
$(document).ready(function () {
|
|
$('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
|
|
localStorage.setItem('activeTab', $(e.target).attr('href'));
|
|
});
|
|
var activeTab = localStorage.getItem('activeTab');
|
|
if (activeTab) {
|
|
$('#nav-tab a[href="' + activeTab + '"]').tab('show');
|
|
}
|
|
});
|
|
|
|
|
|
/***RELOJ PICADAS***/
|
|
|
|
function clockTick() {
|
|
var currentTime = new Date(),
|
|
month = (currentTime.getMonth() + 1).toString(),
|
|
day = currentTime.getDate().toString(),
|
|
year = currentTime.getFullYear(),
|
|
hours = currentTime.getHours(),
|
|
minutes = currentTime.getMinutes().toString(),
|
|
seconds = currentTime.getSeconds(),
|
|
|
|
|
|
text = (day.padStart(2, "0") + "/" + month.padStart(2, "0") + "/" + year + ' ' + hours + ':' + minutes.padStart(2, "0"));
|
|
|
|
|
|
document.getElementById('fechaHoraPicada').innerHTML = text;
|
|
}
|
|
|
|
setInterval(clockTick, 1000);
|
|
|
|
/***LISTADO DE PICADAS - NO SE PUEDE INTRODUCIR FECHA DE INICIO > FECHA FINAL***/
|
|
|
|
let startInput = document.getElementById('inpFechaInicio');
|
|
let endInput = document.getElementById('inpFechaFin');
|
|
let messageDiv = document.getElementById('mensaje');
|
|
let submitButton = document.getElementById('btnFechas');
|
|
|
|
let compare = () => {
|
|
let startValue = (new Date(startInput.value)).getTime();
|
|
let endValue = (new Date(endInput.value)).getTime();
|
|
|
|
if (endValue < startValue) {
|
|
messageDiv.innerHTML = 'Asegurese que la fecha de inicio es anterior a la de final';
|
|
submitButton.disabled = true;
|
|
} else {
|
|
messageDiv.innerHTML = '';
|
|
submitButton.disabled = false;
|
|
}
|
|
};
|
|
|
|
|
|
/* **CALCULAR TOTAL DE HORAS***/
|
|
|
|
function totalHoras() {
|
|
if (document.getElementById('inpIniManana').value != "00:00") {
|
|
var ini = document.getElementById('inpIniManana').value
|
|
var iniHoras = (ini.substring(0, 2) * 60) * 60
|
|
var iniMins = ini.slice(-2) * 60
|
|
ini = iniHoras + iniMins
|
|
|
|
var end = document.getElementById('inpFinManana').value
|
|
var endHoras = (end.substring(0, 2) * 60) * 60
|
|
var endMins = end.slice(-2) * 60
|
|
end = endHoras + endMins
|
|
|
|
var total = end - ini
|
|
var h = Math.floor(total / 3600).toString()
|
|
var m = Math.floor(total % 3600 / 60).toString()
|
|
|
|
total = h.padStart(2, "0") + ":" + m.padStart(2, "0")
|
|
document.getElementById('inpTotalManana').value = total
|
|
}
|
|
}
|
|
function totalHorasTarde() {
|
|
if (document.getElementById('inpIniTarde').value != "00:00") {
|
|
var ini = document.getElementById('inpIniTarde').value
|
|
var iniHoras = (ini.substring(0, 2) * 60) * 60
|
|
var iniMins = ini.slice(-2) * 60
|
|
ini = iniHoras + iniMins
|
|
|
|
var end = document.getElementById('inpFinTarde').value
|
|
var endHoras = (end.substring(0, 2) * 60) * 60
|
|
var endMins = end.slice(-2) * 60
|
|
end = endHoras + endMins
|
|
|
|
var total = end - ini
|
|
var h = Math.floor(total / 3600).toString()
|
|
var m = Math.floor(total % 3600 / 60).toString()
|
|
|
|
total = h.padStart(2, "0") + ":" + m.padStart(2, "0")
|
|
document.getElementById('inpTotalTarde').value = total
|
|
}
|
|
};
|
|
|
|
|
|
/***IMPRIMIR***/
|
|
|
|
function Imprimir() {
|
|
var mywindow = window.open('', 'PRINT', 'height=400,width=600');
|
|
mywindow.document.write('<html><head>');
|
|
mywindow.document.write('</head><body >');
|
|
mywindow.document.write(document.getElementById('tablaImpresion').innerHTML);
|
|
mywindow.document.write('</body></html>');
|
|
|
|
mywindow.document.close(); // necessary for IE >= 10
|
|
mywindow.focus(); // necessary for IE >= 10*/
|
|
|
|
mywindow.print();
|
|
mywindow.close();
|
|
|
|
return true;
|
|
};
|
|
|
|
/***MOSTRAR***/
|
|
|
|
function botonMostrar(id, idClase) {
|
|
|
|
var tablas = document.getElementsByClassName("todasTablas");
|
|
tablas = Array.from(tablas);
|
|
var tablasColapsadas = [];
|
|
var estaTabla = document.getElementsByClassName(idClase);
|
|
estaTabla = Array.from(estaTabla);
|
|
|
|
for (var i = 0; i < tablas.length; i++) {
|
|
if (tablas[i].classList.contains('show') == false) {
|
|
tablasColapsadas.push(tablas[i])
|
|
}
|
|
}
|
|
if (tablas.length == tablasColapsadas.length) {
|
|
document.getElementById('mostrarGeneral').innerText = "Ocultar todo"
|
|
}
|
|
else {
|
|
document.getElementById('mostrarGeneral').innerText = "Mostrar todo"
|
|
}
|
|
|
|
var link = document.getElementById(id)
|
|
var texto = link.innerText
|
|
switch (texto) {
|
|
case "Mostrar":
|
|
estaTabla.forEach(element => element.classList.add('show'))
|
|
//console.log("entra")
|
|
texto = "Ocultar"
|
|
break
|
|
case "Ocultar":
|
|
estaTabla.forEach(element => element.classList.remove('show'))
|
|
//document.getElementsByClassName(idClase).classList.remove('show')
|
|
//console.log("entra")
|
|
texto = "Mostrar"
|
|
break
|
|
}
|
|
link.innerText = texto
|
|
document.getElementById('mostrarGeneral')
|
|
};
|
|
|
|
|
|
function botonMostrarTodo(id) {
|
|
var tablas = document.getElementsByClassName("todasTablas")
|
|
tablas = Array.from(tablas)
|
|
var link = document.getElementById(id)
|
|
var linkPersona = document.getElementsByClassName('btnPersona')
|
|
linkPersona = Array.from(linkPersona)
|
|
var texto = link.innerText
|
|
var textoBtnPersona = linkPersona.innerText
|
|
|
|
switch (texto) {
|
|
case "Mostrar todo":
|
|
texto = "Ocultar todo"
|
|
textoBtnPersona = "Ocultar"
|
|
for (var i = 0; i < tablas.length; i++) {
|
|
if (tablas[i].classList.contains('show') == true) {
|
|
|
|
}
|
|
else {
|
|
tablas[i].classList.add('show')
|
|
}
|
|
}
|
|
break
|
|
case "Ocultar todo":
|
|
texto = "Mostrar todo"
|
|
textoBtnPersona = "Mostrar"
|
|
for (var x = 0; x < tablas.length; x++) {
|
|
if (tablas[x].classList.contains('show') == true) {
|
|
tablas[x].classList.remove('show')
|
|
}
|
|
|
|
}
|
|
break
|
|
|
|
}
|
|
linkPersona.forEach(element => element.innerHTML = textoBtnPersona)
|
|
link.innerText = texto
|
|
};
|
|
|
|
|
|
|
|
</script>
|
|
</asp:Content>
|