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";
const URI_POLICIA_CONCEPTOSEDES = "conceptoSedes";
const URI_POLICIA_REPORTE_MONTOS = "reporteMontosPolicias";
const URI_POLICIA_PROYECCION = "proyeccion";
const URI_POLICIA_PROYECTADO_COMPARATIVO = "proyectadoComparativo";
//</editor-fold>
......@@ -74,7 +75,7 @@ ajaxWebService.interceptors.response.use(function (response) {
message: response.data.message || `Operación exitosa`,
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;
}, function (error) {
// Do something with response error
......@@ -424,4 +425,24 @@ const cleanQueryParams = (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 initilizeData() {
function getColumns() {
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 seleccionarCriterio() {
let criterio = $(this).val();
if (criterio === "PERIODO") {
let html = `<div class="col-md-8 form-group">
<label>Periodo</label>
<select id="cboPeriodo" class="form-control">
<option>JUNIO 2018 - 1° QUINCENA</option>
<option>JUNIO 2018 - 2° QUINCENA</option>
<option>JULIO 2018 - 1° QUINCENA</option>
<option>AGOSTO 2018 - 2° QUINCENA</option>
</select>
</div>`;
$("#divCriterio").html(html);
} else if (criterio === "FECHA") {
let html = `<div class="col-md-4 form-group">
<label>Fecha Inicio</label>
<div class="input-group">
<span class="input-group-addon"><i class="icon-calendar"></i></span>
<input type="text" class="form-control" id="dpFechaInicio" name="dpFechaInicio" placeholder="Fecha inicio &hellip;">
</div>
</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 getColumnDefs() {
let columnDefs = [
{orderable: false, width: '3%', targets: 0, className: "text-center"},
{orderable: false, width: '10%', targets: 1, className: "text-center"},
{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: '7%', targets: 5, className: "text-center"},
{orderable: false, width: '7%', targets: 6, className: "text-center"},
{orderable: false, width: '7%', targets: 7, className: "text-center"},
{orderable: false, width: '7%', targets: 8, className: "text-center"},
{orderable: false, width: '7%', targets: 9, className: "text-center"},
{orderable: false, width: '7%', targets: 10, className: "text-center"},
{orderable: false, width: '7%', targets: 11, className: "text-center"},
{orderable: false, width: '7%', targets: 12, className: "text-center"},
{orderable: false, width: '7%', targets: 13, className: "text-center"},
{orderable: false, width: '7%', targets: 14, className: "text-center"},
{orderable: false, width: '7%', targets: 15, className: "text-center"},
{orderable: false, width: '7%', targets: 16, className: "text-center"},
];
return columnDefs;
}
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 () {
// localStorage.removeItem("dniBuscar");
// dniBuscar=null;
// cerrar_cargando();
}
},
columns: [
{data: "numeroFila", className: "text-center"},
{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 listarPolicias(selectorName) {
ajaxWebService.get(URI_POLICIAS).then((result) => {
let policias = result.data;
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>`);
$(`${selectorName}`).html(html);
$('.select-search').select2();
});
}
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() {
$("#dpFechaInicio").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();
}
});
$("#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('');
}
makeDatatable(
{
data: response.data,
columns,
columnDefs,
wrapsNameDatatable,
classNameForDatatable,
footer
}
)
}
);
}
$().ready(function () {
initilizeData();
defaultConfigDatePicker();
$("#cboCriterio").change(seleccionarCriterio);
$("#btnBuscar").click(buscar);
$("#cboCriterioPersonal").change(pintarCriterioPersonal);
let nameDatePickers = ["#dpFechaInicio", "#dpFechaFin"];
initDatePicker(...nameDatePickers);
listarPolicias("#cboPolicias");
$("#btnVerReporte").click(verReporte);
});
\ No newline at end of file
src/main/webapp/vistas/comparativoProyeccionPolicias.jsp
......@@ -6,94 +6,57 @@
<%@include file="templates/header.jsp" %>
<!--template-core-->
<!--css de la pagina-->
<link href="../css/lib/sweetalert2.min.css" rel="stylesheet" type="text/css"/>
<!--css-->
</head>
<body>
<%@include file="templates/header-body.jsp" %>
<!-- content -->
<div class="col-md-4 col-md-offset-4">
<div class="panel panel-primary">
<div class="panel-heading">
<h5 class="panel-title">Proyectado comparativo</h5>
</div>
<div class="row">
<div class="col-md-4 col-md-offset-4">
<div class="panel panel-primary">
<div class="panel-heading">
<h5 class="panel-title">Reporte comparativo de proyeccion</h5>
</div>
<form id="frmComparativoProyectado" onsubmit="return false;" autocomplete="off">
<div class="panel-body">
<div class="row">
<div class="col-md-4 form-group">
<label>Busqueda por</label>
<select class="form-control" id="cboCriterio">
<option>[SELECCIONE]</option>
<option>PERIODO</option>
<option>FECHA</option>
</select>
<div class="col-md-6 form-group">
<label>Fecha Inicio:</label>
<input type="text" class="form-control" id="dpFechaInicio">
</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 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 class="panel-footer">
<div class="text-center">
<button class="btn btn-primary" id="btnBuscar"><i class="fa fa-search"></i> Buscar</button>&nbsp;
<button class="btn btn-warning" id="btnLimpiar"><i class="fa fa-eraser"></i> Limpiar</button>
<button class="btn btn-primary" id="btnVerReporte"><i class="icon-eye4"></i> Ver reporte</button>&nbsp;
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-md-12">
<div class="panel panel-primary card-3" style="margin-top: 30px">
<div class="panel-heading" style="padding: 8px 15px">
<h6 class="panel-title" style="font-size: 15px; font-family: inherit"><i class="icon icon-search4"></i>&nbsp; PROYECCION</h6>
</div>
<div>
<table class="table dataTable table-striped table-hover table-sm table-bordered display" id="tblProyectadoComparativo">
<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 class="row">
<div class="col-md-12">
<div class="panel panel-primary card-3" style="margin-top: 30px">
<div class="panel-heading" style="padding: 8px 15px">
<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 id="divDatatable"></div>
</div>
</div>
</div>
......@@ -104,10 +67,12 @@
<!--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/ui/moment/moment.min.js" type="text/javascript"></script>
<script type="text/javascript" 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/plugins/pickers/daterangepicker.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/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>
<!--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