Skip to content

A
Asistencia
Commit b9f72db6 by Billy Larru
Options

mostrando registros en el proyectado comparativo

parent 9f6ee97a
Showing with 197 additions and 313 deletions
src/main/webapp/js/general.js
...@@ -28,6 +28,7 @@ const URI_POLICIA_MONTOS_AMANECIDAS = "montoAmanecidas"; ...@@ -28,6 +28,7 @@ const URI_POLICIA_MONTOS_AMANECIDAS = "montoAmanecidas";
const URI_POLICIA_CONCEPTOSEDES = "conceptoSedes"; const URI_POLICIA_CONCEPTOSEDES = "conceptoSedes";
const URI_POLICIA_REPORTE_MONTOS = "reporteMontosPolicias"; const URI_POLICIA_REPORTE_MONTOS = "reporteMontosPolicias";
const URI_POLICIA_PROYECCION = "proyeccion"; const URI_POLICIA_PROYECCION = "proyeccion";
const URI_POLICIA_PROYECTADO_COMPARATIVO = "proyectadoComparativo";
//</editor-fold> //</editor-fold>
...@@ -74,7 +75,7 @@ ajaxWebService.interceptors.response.use(function (response) { ...@@ -74,7 +75,7 @@ ajaxWebService.interceptors.response.use(function (response) {
message: response.data.message || `Operación exitosa`, message: response.data.message || `Operación exitosa`,
data: response.data.data || response.data data: response.data.data || response.data
}; };
console.log(respuesta, moment().format("YYYY/DD/MM HH:MM:SS s")) // console.log(respuesta, moment().format("YYYY/DD/MM HH:MM:SS s"))
return respuesta; return respuesta;
}, function (error) { }, function (error) {
// Do something with response error // Do something with response error
...@@ -424,4 +425,24 @@ const cleanQueryParams = (params = {}) => { ...@@ -424,4 +425,24 @@ const cleanQueryParams = (params = {}) => {
} }
return params; return params;
}
let initDatePicker = (...selectorName) => {
selectorName.forEach(id => {
let options = {
minDate: new Date(2000, 1 - 1, 1), maxDate: new Date(),
dateFormat: 'dd/mm/yy',
defaultDate: new Date(),
changeMonth: true,
changeYear: true,
yearRange: '-18:+0',
zIndexOffset: 3000,
onSelect: function () {
// $(this).valid();
}
}
$(id).datepicker(options);
$(id).datepicker('setDate', 'now');
});
} }
\ No newline at end of file
src/main/webapp/js/pages/comparativo_proyeccion_policias.js
const URI_LISTAR_PROYECTADO_COMPARATIVO = ""; function getColumns() {
function initilizeData() { let columns = [
{
title: `N°`,
data: `id`,
className: 'text-center'
},
{
title: `DNI`,
data: `policia_dni`,
className: `text-center`,
},
{
title: `APELLIDOS Y NOMBRES`,
data: `policia_nombres`,
className: 'text-center'
},
{
title: `TURNO`,
data: `tiporol_descripcion`,
className: `text-center`,
},
{
title: `SEDE`,
data: `sede_descripcion`,
className: `text-center`,
},
{
title: `COSTO`,
data: `costo`,
className: `text-center`,
},
{
title: `FECHA ENTRADA`,
data: `fecha_entrada`,
className: `text-center`,
},
{
title: `HORA ENTRADA`,
data: `entrada_proyectada`,
className: `text-center`,
},
{
title: `HORA ENTRADA REAL`,
data: `marcacion_entrada`,
className: `text-center`,
},
{
title: `DIFERENCIA ENTRADA(min)`,
data: `diferencia_entrada`,
className: `text-center`,
},
{
title: `FECHA SALIDA`,
data: `fecha_salida`,
className: `text-center`,
},
{
title: `HORA SALIDA`,
data: `salida_proyectada`,
className: `text-center`,
},
{
title: `HORA SALIDA REAL`,
data: `marcacion_salida`,
className: `text-center`,
},
{
title: `DIFERENCIA DE SALIDAS(min)`,
data: `diferencia_salida`,
className: `text-center`,
},
{
title: `DIFERENCIA TOTAL`,
data: `diferencia_total`,
className: `text-center`,
},
{
title: `MONTO`,
data: `monto`,
className: `text-center`,
},
{
title: `OBSERVACION`,
data: `observacion`,
className: `text-center`,
},
];
return columns;
} }
function getColumnDefs() {
function seleccionarCriterio() { let columnDefs = [
let criterio = $(this).val(); {orderable: false, width: '3%', targets: 0, className: "text-center"},
if (criterio === "PERIODO") { {orderable: false, width: '10%', targets: 1, className: "text-center"},
let html = `<div class="col-md-8 form-group"> {orderable: false, width: '30%', targets: 2, className: "text-center"},
<label>Periodo</label> {orderable: false, width: '7%', targets: 3, className: "text-center"},
<select id="cboPeriodo" class="form-control"> {orderable: false, width: '7%', targets: 4, className: "text-center"},
<option>JUNIO 2018 - 1° QUINCENA</option> {orderable: false, width: '7%', targets: 5, className: "text-center"},
<option>JUNIO 2018 - 2° QUINCENA</option> {orderable: false, width: '7%', targets: 6, className: "text-center"},
<option>JULIO 2018 - 1° QUINCENA</option> {orderable: false, width: '7%', targets: 7, className: "text-center"},
<option>AGOSTO 2018 - 2° QUINCENA</option> {orderable: false, width: '7%', targets: 8, className: "text-center"},
</select> {orderable: false, width: '7%', targets: 9, className: "text-center"},
</div>`; {orderable: false, width: '7%', targets: 10, className: "text-center"},
$("#divCriterio").html(html); {orderable: false, width: '7%', targets: 11, className: "text-center"},
} else if (criterio === "FECHA") { {orderable: false, width: '7%', targets: 12, className: "text-center"},
let html = `<div class="col-md-4 form-group"> {orderable: false, width: '7%', targets: 13, className: "text-center"},
<label>Fecha Inicio</label> {orderable: false, width: '7%', targets: 14, className: "text-center"},
<div class="input-group"> {orderable: false, width: '7%', targets: 15, className: "text-center"},
<span class="input-group-addon"><i class="icon-calendar"></i></span> {orderable: false, width: '7%', targets: 16, className: "text-center"},
<input type="text" class="form-control" id="dpFechaInicio" name="dpFechaInicio" placeholder="Fecha inicio &hellip;"> ];
</div> return columnDefs;
</div>
<div class="col-md-4 form-group">
<label>Fecha Fin</label>
<div class="input-group">
<span class="input-group-addon"><i class="icon-calendar"></i></span>
<input type="text" class="form-control" id="dpFechaFin" name="dpFechaFin" placeholder="Fecha fin &hellip;">
</div>
</div>`;
$("#divCriterio").html(html);
initDatePicker();
} else {
$("#divCriterio").html('');
}
} }
function buscar() {
// let datos = [];
// let criterioPersonal = $("#cboCriterioPersonal").val();
// if (criterioPersonal === "dni" || criterioPersonal === "nombres") {
// let busquedaPersonal = $("#txtBusquedaPersonal").val();
// datos = _.filter(data, p => p[criterioPersonal].toLowerCase().startsWith(busquedaPersonal.toLowerCase()));
// debugger;
// } else {
// datos = data;
// }
// let numero = 1;
// datos.forEach(p => p["numeroFila"] = numero++);
$("#tblProyectadoComparativo").DataTable().destroy();
$("#tblProyectadoComparativo").DataTable({
"language": {
"lengthMenu": "Mostrar: _MENU_",
"zeroRecords": "&nbsp;&nbsp;&nbsp; No se encontraron resultados",
"info": "&nbsp;&nbsp;&nbsp; Mostrando del _START_ al _END_ de un total de _TOTAL_ registros",
"infoEmpty": "&nbsp;&nbsp;&nbsp; Mostrando 0 de 0 registros",
"search": "Filtrar:",
"loadingRecords": "Cargando...",
"processing": '<span style="width:100%;"><img src="http://www.snacklocal.com/images/ajaxload.gif"></span>',
"paginate": {
"first": "First",
"last": "Last",
"next": "Siguiente",
"previous": "Anterior"
}
},
"bSort": false,
"bFilter": false,
"aaSorting": [],
"ordering": false,
"bLengthChange": false,
"bInfo": true,
"paging": true,
iDisplayLength: 20,
bStateSave: false,
autoWidth: false,
responsive: true,
stateSave: true,
columnDefs: [
{orderable: false, width: '5%', targets: 0, className: "text-center"},
{orderable: false, width: '5%', targets: 1},
{orderable: false, width: '30%', targets: 2, className: "text-center"},
{orderable: false, width: '7%', targets: 3, className: "text-center"},
{orderable: false, width: '7%', targets: 4, className: "text-center"},
{orderable: false, width: '10%', targets: 5, className: "text-center"},
{orderable: false, width: '8%', targets: 6, className: "text-center"},
{orderable: false, width: '8%', targets: 7, className: "text-center"},
{orderable: false, width: '8%', targets: 8, className: "text-center"},
{orderable: false, width: '8%', targets: 9, className: "text-center"},
{orderable: false, width: '8%', targets: 10, className: "text-center"},
{orderable: false, width: '8%', targets: 11, className: "text-center"},
{orderable: false, width: '8%', targets: 12, className: "text-center"},
{orderable: false, width: '8%', targets: 13, className: "text-center"},
{orderable: false, width: '8%', targets: 14, className: "text-center"}
],
dom: '<"datatable-header"fl><"datatable-scroll-wrap"t><"datatable-footer"ip>',
"processing": true,
ajax: {
contentType: 'application/json; charset=utf-8',
url: URI_LISTAR_PROYECTADO_COMPARATIVO,
// data: {
// busqueda: busqueda
// }
// ,
beforeSend: function () {
// cargando();
}, complete: function () { function listarPolicias(selectorName) {
// localStorage.removeItem("dniBuscar"); ajaxWebService.get(URI_POLICIAS).then((result) => {
// dniBuscar=null; let policias = result.data;
// cerrar_cargando(); policias = _.orderBy(policias, p => p.nombres);
} let html = `<option value="">[TODOS]</option>`;
}, policias.forEach(p => html += `<option documento_identidad="${p.dni}" value="${p.id}">${p.nombres}</option>`);
columns: [ $(`${selectorName}`).html(html);
{data: "numeroFila", className: "text-center"}, $('.select-search').select2();
{data: "dni"}, });
{data: "nombres"},
{
data: "turno",
render: data => {
let label;
switch (data) {
case "REGULAR":
label = "label label-primary";
break;
case "AMANECIDA 24H":
label = "label label-success border-success-700";
break;
case "AMANECIDA 12H":
label = "label label-warning border-warning-700";
break;
default:
label = "label label-default";
}
return `<span class="${label}">${data}</span>`;
}
},
{data: "sede", className: "text-center", render: sede => `<span class="label bg-brown-400 border-brown-700">${sede}</span>`},
{data: "costo", className: "text-center", render: costo => parseFloat(costo).toFixed(2)},
{data: "fecha_entrada", className: "text-center"},
{data: "entrada_proyectada", className: "text-center"},
{
data: "marcacion_entrada",
className: "text-center",
render: data => {
let label;
console.log(data);
if (data === "0:00") {
data = "NO MARCÓ";
label = "text-danger";
}
return `<span class="${label}">${data}</span>`;
}
},
// {data: "diferencia_entrada", className: "text-center"},
{data: "fecha_salida", className: "text-center"},
{data: "salida_proyectada", className: "text-center"},
{
data: "marcacion_salida",
className: 'text-center',
render: data => {
let label;
console.log(data);
if (data === "0:00") {
data = "NO MARCÓ";
label = "text-danger";
}
return `<span class="${label}">${data}</span>`;
}
},
// {data: "diferencia_salida", className: 'text-center'},
{data: "diferencia_total", className: 'text-center', render: data => `${data} min`},
{
data: "monto",
className: 'text-center',
render: monto => {
let label;
if (monto > 0) {
label = "text-sucess";
} else if (monto < 0) {
label = "text-danger";
} else {
label = "";
}
let numeroReal = parseFloat(monto).toFixed(2);
return `<label class="${label}">${numeroReal}</label>`;
}
},
{data: "observacion", className: 'text-center'},
],
fnInitComplete: function (settings, data) {
$('th').removeClass('sorting_asc');
// console.log(data);
}
});
} }
function verReporte(objParams = {}) {
ajaxWebService.get(URI_POLICIA_PROYECTADO_COMPARATIVO, objParams).then((response) => {
let columns = getColumns();
let columnDefs = getColumnDefs();
let wrapsNameDatatable = `divDatatable`;
let classNameForDatatable = `display table table-bordered`;
let footer = false;
function initDatePicker() { makeDatatable(
$("#dpFechaInicio").datepicker({ {
minDate: new Date(2000, 1 - 1, 1), maxDate: new Date(), data: response.data,
dateFormat: 'dd/mm/yy', columns,
defaultDate: new Date(), columnDefs,
changeMonth: true, wrapsNameDatatable,
changeYear: true, classNameForDatatable,
yearRange: '-18:+0', footer
onSelect: function () { }
// $(this).valid(); )
} }
}); );
$("#dpFechaInicio").datepicker('setDate', 'now');
$("#dpFechaFin").datepicker({
minDate: new Date(2000, 1 - 1, 1), maxDate: new Date(),
dateFormat: 'dd/mm/yy',
defaultDate: new Date(),
changeMonth: true,
changeYear: true,
yearRange: '-18:+0',
onSelect: function () {
// $(this).valid();
}
});
$("#dpFechaFin").datepicker('setDate', 'now');
}
function pintarCriterioPersonal() {
let criterio = $(this).val();
if (criterio === "dni") {
let html = `<div class="col-md-8 form-group">
<label>DNI</label>
<input type="text" class="form-control" id="txtBusquedaPersonal"></input>
</div>`;
$("#divCriterioPersonal").html(html);
} else if (criterio === "nombres") {
let html = `<div class="col-md-8 form-group">
<label>Apellidos</label>
<input type="text" class="form-control" id="txtBusquedaPersonal"></input>
</div>`;
$("#divCriterioPersonal").html(html);
initDatePicker();
} else {
$("#divCriterioPersonal").html('');
}
} }
$().ready(function () { $().ready(function () {
initilizeData(); let nameDatePickers = ["#dpFechaInicio", "#dpFechaFin"];
defaultConfigDatePicker(); initDatePicker(...nameDatePickers);
$("#cboCriterio").change(seleccionarCriterio); listarPolicias("#cboPolicias");
$("#btnBuscar").click(buscar); $("#btnVerReporte").click(verReporte);
$("#cboCriterioPersonal").change(pintarCriterioPersonal);
}); });
\ No newline at end of file
src/main/webapp/vistas/comparativoProyeccionPolicias.jsp
...@@ -6,94 +6,57 @@ ...@@ -6,94 +6,57 @@
<%@include file="templates/header.jsp" %> <%@include file="templates/header.jsp" %>
<!--template-core--> <!--template-core-->
<!--css de la pagina--> <!--css de la pagina-->
<link href="../css/lib/sweetalert2.min.css" rel="stylesheet" type="text/css"/>
<!--css--> <!--css-->
</head> </head>
<body> <body>
<%@include file="templates/header-body.jsp" %> <%@include file="templates/header-body.jsp" %>
<!-- content --> <!-- content -->
<div class="col-md-4 col-md-offset-4"> <div class="row">
<div class="panel panel-primary"> <div class="col-md-4 col-md-offset-4">
<div class="panel-heading"> <div class="panel panel-primary">
<h5 class="panel-title">Proyectado comparativo</h5> <div class="panel-heading">
</div> <h5 class="panel-title">Reporte comparativo de proyeccion</h5>
</div>
<form id="frmComparativoProyectado" onsubmit="return false;" autocomplete="off">
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
<div class="col-md-4 form-group"> <div class="col-md-6 form-group">
<label>Busqueda por</label> <label>Fecha Inicio:</label>
<select class="form-control" id="cboCriterio"> <input type="text" class="form-control" id="dpFechaInicio">
<option>[SELECCIONE]</option>
<option>PERIODO</option>
<option>FECHA</option>
</select>
</div> </div>
<div id="divCriterio"> <div class="col-md-6 form-group">
<label>Fecha Fin</label>
<input type="text" class="form-control" id="dpFechaFin">
</div> </div>
</div> </div>
<div class="row">
<div class="col-md-4">
<label>Personal</label>
<select class="form-control" id="cboCriterioPersonal">
<option>[SELECCIONE]</option>
<option value="dni">DNI</option>
<option value="nombres">APELLIDOS</option>
<option value="*">TODOS</option>
</select>
</div>
<div id="divCriterioPersonal">
<div class="row">
<div class="col-md-12 form-group">
<label>Policia</label>
<select class="select-search form-control" id="cboPolicias"></select>
</div> </div>
</div> </div>
</div> </div>
<div class="panel-footer"> <div class="panel-footer">
<div class="text-center"> <div class="text-center">
<button class="btn btn-primary" id="btnBuscar"><i class="fa fa-search"></i> Buscar</button>&nbsp; <button class="btn btn-primary" id="btnVerReporte"><i class="icon-eye4"></i> Ver reporte</button>&nbsp;
<button class="btn btn-warning" id="btnLimpiar"><i class="fa fa-eraser"></i> Limpiar</button>
</div> </div>
</div> </div>
</div>
</form>
</div> </div>
</div> </div>
<div class="col-md-12"> <div class="row">
<div class="panel panel-primary card-3" style="margin-top: 30px"> <div class="col-md-12">
<div class="panel-heading" style="padding: 8px 15px"> <div class="panel panel-primary card-3" style="margin-top: 30px">
<h6 class="panel-title" style="font-size: 15px; font-family: inherit"><i class="icon icon-search4"></i>&nbsp; PROYECCION</h6> <div class="panel-heading" style="padding: 8px 15px">
</div> <h6 class="panel-title" style="font-size: 15px; font-family: inherit"><i class="icon icon-search4"></i>&nbsp; Comparativo de proyeccion y marcacion</h6>
<div> </div>
<table class="table dataTable table-striped table-hover table-sm table-bordered display" id="tblProyectadoComparativo"> <div id="divDatatable"></div>
<thead>
<tr>
<th class="text-center">Nº</th>
<th class="text-center">DNI</th>
<th class="text-center">APELLIDOS Y NOMBRES</th>
<th class="text-center">TURNO</th>
<th class="text-center">SEDE</th>
<th class="text-center">COSTO</th>
<th class="text-center">FECHA ENTRADA</th>
<th class="text-center">ENTRADA PROY.</th>
<th class="text-center">MARC. ENTRADA</th>
<!--<th class="text-center">DIF. ENTRADA(min)</th>-->
<th class="text-center">FECHA SALIDA</th>
<th class="text-center">SALIDA PROY.</th>
<th class="text-center">MARC. SALIDA</th>
<!--<th class="text-center">DIF. SALIDA(min)</th>-->
<th class="text-center">DIF. TOTAL</th>
<th class="text-center">MONTO</th>
<th class="text-center">OBS.</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div> </div>
</div> </div>
</div> </div>
...@@ -104,10 +67,12 @@ ...@@ -104,10 +67,12 @@
<!--js de la pagina--> <!--js de la pagina-->
<script src="../plantilla/assets/js/plugins/tables/datatables/datatables.min.js" type="text/javascript"></script> <script src="../plantilla/assets/js/plugins/tables/datatables/datatables.min.js" type="text/javascript"></script>
<script src="../plantilla/assets/js/plugins/ui/moment/moment.min.js" type="text/javascript"></script> <script src="../plantilla/assets/js/plugins/ui/moment/moment.min.js" type="text/javascript"></script>
<script type="text/javascript" src="../plantilla/assets/js/plugins/pickers/daterangepicker.js"></script> <script src="../plantilla/assets/js/plugins/pickers/daterangepicker.js"></script>
<script type="text/javascript" src="../plantilla/assets/js/core/libraries/jquery_ui/widgets.min.js"></script> <script src="../plantilla/assets/js/core/libraries/jquery_ui/widgets.min.js"></script>
<script src="../js/lib/lodash.js" type="text/javascript"></script> <script src="../js/lib/lodash.js" type="text/javascript"></script>
<script src="../js/lib/axios.min.js" type="text/javascript"></script> <script src="../js/lib/axios.min.js" type="text/javascript"></script>
<script src="../js/lib/sweetalert2.min.js" type="text/javascript"></script>
<script src="../plantilla/assets/js/plugins/forms/selects/select2.min.js"></script>
<script src="../js/pages/comparativo_proyeccion_policias.js" type="text/javascript"></script> <script src="../js/pages/comparativo_proyeccion_policias.js" type="text/javascript"></script>
<!--js--> <!--js-->
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment