Skip to content

A
Asistencia
Commit 626ce74f by Billy Larru
Options

agregando mejoras al makeDatatable

parent a03e43d9
Showing with 106 additions and 63 deletions
src/main/webapp/js/general.js
......@@ -26,6 +26,55 @@ const URI_POLICIA_REPORTE_MONTOS = "http://sistem16:666/reporteMontosPolicias";
//</editor-fold>
$.extend($.fn.dataTable.defaults, {
bSort: false,
bFilter: false,
aaSorting: [],
ordering: false,
bLengthChange: false,
bInfo: true,
paging: true,
iDisplayLength: 20,
bStateSave: false,
autoWidth: false,
responsive: true,
stateSave: true,
scrollX: true,
responsive: true,
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"
}
}
});
axios.interceptors.response.use(function (response) {
// Do something with response data
let respuesta = {
status: response.data.status || true,
message: response.data.message || `Operación exitosa`,
data: response.data.data || response.data
};
console.log(respuesta)
return respuesta;
}, function (error) {
// Do something with response error
return Promise.reject(error);
});
/*Ajax genral*/
const ajaxRequestSendBody = obj => {
let body = JSON.stringify(obj.body);
......@@ -172,37 +221,8 @@ let logOut = () => {
};
function defaultConfigDataTable() {
$.extend($.fn.dataTable.defaults, {
bSort: false,
bFilter: false,
aaSorting: [],
ordering: false,
bLengthChange: false,
bInfo: true,
paging: true,
iDisplayLength: 20,
bStateSave: false,
autoWidth: false,
responsive: true,
stateSave: true,
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"
}
}
});
}
......@@ -278,7 +298,15 @@ function primeraLetraMayuscula(str) {
const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [], wrapsNameDatatable: ``, classNameForDatatable: ``, footer: false, highlighting: true}) => {
const makeDatatable = (jsonForDatatable = {
data: [],
columns: [],
columnDefs: [],
wrapsNameDatatable: ``,
classNameForDatatable: ``,
footerFilter: false,
highlighting: true
}) => {
let data = jsonForDatatable.data;
let columns = jsonForDatatable.columns;
let columnDefs = jsonForDatatable.columns;
......@@ -288,6 +316,7 @@ const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [
let classNameForDatatable = jsonForDatatable.classNameForDatatable
let highlighting = jsonForDatatable.highlighting
let footerFilter = jsonForDatatable.footerFilter
let table_head = `
<table id="${nameDatatable}" class="${classNameForDatatable} table-hover" cellspacing="0" width="100%">`;
......@@ -310,7 +339,7 @@ const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [
</thead>`
let table_foot_th = ``;
if (jsonForDatatable.footer) {
if (footerFilter) {
table_foot_th = `
<tfoot>
<tr>`;
......@@ -333,16 +362,47 @@ const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [
let table_foot = `</table>`
$(`#${wrapsNameDatatable}`).empty().append(`${table_head}${table_head_th}${table_foot_th}${table_foot}`);
if (footerFilter) {
// Setup - add a text input to each footer cell
$(`#${nameDatatable} tfoot th`).each(function () {
var title = $(this).text();
$(this).html(`<input type="text" class="form-control" placeholder="${title}" />`);
});
}
$(`#${nameDatatable}`)
.DataTable({
data,
columns,
columnDefs
columnDefs,
fixedColumns: {
leftColumns: 1,
rightColumns: 1
}
});
if (highlighting) {
if (footerFilter) {
// DataTable
let table = $(`#${nameDatatable}`).DataTable();
// Apply the search
table.columns().every(function () {
var that = this;
$('input', this.footer()).on('keyup change', function () {
if (that.search() !== this.value) {
that
.search(this.value)
.draw();
}
});
});
$(`#${wrapsNameDatatable} .dataTables_scrollBody`).appendTo(`#${wrapsNameDatatable} .dataTables_scroll`);
}
if (highlighting) {
let table = $(`#${nameDatatable}`).DataTable();
$(`#${nameDatatable} tbody`)
.on('mouseenter', 'td', function () {
let colIdx = table.cell(this).index().column;
......@@ -352,7 +412,10 @@ const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [
});
}
return Promise.resolve($(`#${nameDatatable}`));
return Promise.resolve({
datatable: $(`#${nameDatatable}`),
container: $(`#${wrapsNameDatatable}`)
});
}
......@@ -371,22 +434,4 @@ const cleanQueryParams = (params = {}) => {
}
return params;
}
let interceptorsResponseAxios = () => {
axios.interceptors.response.use(function (response) {
// Do something with response data
let respuesta = {
status: response.data.status || true,
message: response.data.message || `Operación exitosa`,
data: response.data.data || response.data
};
console.log(respuesta)
return respuesta;
}, function (error) {
// Do something with response error
return Promise.reject(error);
});
}
interceptorsResponseAxios();
\ No newline at end of file
}
\ No newline at end of file
src/main/webapp/js/pages/crearRolPolicia.js
......@@ -15,7 +15,7 @@ function initDatePicker(selectorName) {
}
function listarRolesPolicias(objParams = {}) {
axios.get(URI_ROL_POLICIA, objParams).then((response) => {
debugger
let columns = [
......@@ -99,9 +99,9 @@ function listarRolesPolicias(objParams = {}) {
wrapsNameDatatable: wrapsNameDatatable,
classNameForDatatable: classNameForDatatable,
footer: footer
}).then((datatable) => {
$(datatable).on("click", ".ver-detalle", function () {
let data = $(datatable).DataTable().row($(this).parents("tr")).data();
}).then((nodes) => {
nodes.container.on("click", ".ver-detalle", function () {
let data = nodes.datatable.DataTable().row($(this).parents("tr")).data();
console.log(data);
axios.get("modals/policias/mantenimientoRol/detalleRol.jspf").then((response) => {
......@@ -376,7 +376,6 @@ function mostrarModalNuevoRol() {
defaultConfigDatePicker();
defaultConfigDateRangePicker();
}
}).then((result) => {
if (result.value) {
......@@ -405,7 +404,6 @@ function buscarRoles() {
}
$().ready(function () {
defaultConfigDataTable();
initDatePicker("#dpFechaInicio");
initDatePicker("#dpFechaFin");
listarSedes("#cboSedesFiltro");
......
src/main/webapp/vistas/crearRolPolicia.jsp
......@@ -879,7 +879,6 @@
<%@include file="templates/footer-body.jsp"%>
<!--js de la pagina-->
<script src="../plantilla/assets/js/plugins/tables/datatables/datatables.min.js" type="text/javascript"></script>
<script src="../plantilla/assets/js/core/libraries/jquery_ui/interactions.min.js"></script>
<script src="../plantilla/assets/js/core/libraries/jquery_ui/widgets.min.js"></script>
......
src/main/webapp/vistas/templates/footer-body.jsp
......@@ -31,6 +31,7 @@
<!-- /core JS files -->
<!--axios-->
<script src="../plantilla/assets/js/plugins/tables/datatables/datatables.min.js" type="text/javascript"></script>
<script src="../js/lib/axios.min.js" type="text/javascript"></script>
<!-- /Generales -->
......
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