Skip to content

A
Asistencia
Commit 06ae75fe by Billy Larru
Options

listando vacaciones individuales

parent e71e80fc
Showing with 318 additions and 134 deletions
src/main/webapp/css/general.css
btn-green{ btn-green{
background-color: #26A69A; background-color: #26A69A;
} }
.label-left{ .label-left{
text-align: left; text-align: left;
font-size: 13px; font-size: 13px;
} }
.bg-jade{ .bg-jade{
background-color: #26A69A; background-color: #26A69A;
border-color: #26A69A; border-color: #26A69A;
color: #fff; color: #fff;
} }
.border-left-jade{ .border-left-jade{
border-left-color: #26A69A; border-left-color: #26A69A;
} }
.text-migration{ .text-migration{
color: #36F; color: #36F;
} }
.table-sm > thead > tr > th, .table-sm > tbody > tr > th, .table-sm > tfoot > tr > th, .table-sm > thead > tr > td, .table-sm > tbody > tr > td, .table-sm > tfoot > tr > td { .table-sm > thead > tr > th, .table-sm > tbody > tr > th, .table-sm > tfoot > tr > th, .table-sm > thead > tr > td, .table-sm > tbody > tr > td, .table-sm > tfoot > tr > td {
padding: 6px 10px; padding: 6px 10px;
} }
.text-azul{ .text-azul{
color: blue; color: blue;
/*font-weight: bold;*/ /*font-weight: bold;*/
} }
/******/ /******/
.fix-label{ .fix-label{
width: 100%; width: 100%;
text-align: left; text-align: left;
font-size: 13px; font-size: 13px;
font-weight: 500; font-weight: 500;
} }
/* PAGE-HEADER */ /* PAGE-HEADER */
.page-title{ .page-title{
padding: 16px 36px 16px 0; padding: 16px 36px 16px 0;
} }
/* ACTIVE LINK */ /* ACTIVE LINK */
.navigation > li > ul li:first-child{ .navigation > li > ul li:first-child{
padding-top: 0; padding-top: 0;
} }
/* ACTIVE LINK */ /* ACTIVE LINK */
.navigation > li > ul li:last-child{ .navigation > li > ul li:last-child{
padding-bottom: 0; padding-bottom: 0;
} }
.navbar-header{ .navbar-header{
width: 200px; width: 200px;
} }
.media-left, .media > .pull-left{ .media-left, .media > .pull-left{
padding-right: 0; padding-right: 0;
} }
/* USER CONTENT */ /* USER CONTENT */
.tp-sidebar-category-content{ .tp-sidebar-category-content{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
text-align: center; text-align: center;
background: url("../img/user_background.jpg") no-repeat center; background: url("../img/user_background.jpg") no-repeat center;
background-size: cover; background-size: cover;
box-shadow: inset 0px 0px 13px 0px rgba(0,0,0,0.75) box-shadow: inset 0px 0px 13px 0px rgba(0,0,0,0.75)
} }
...@@ -82,26 +82,26 @@ btn-green{ ...@@ -82,26 +82,26 @@ btn-green{
/* SIDEBAR NAVIGATION */ /* SIDEBAR NAVIGATION */
.navigation > li ul li a{ .navigation > li ul li a{
padding: 8px 52px; padding: 8px 52px;
min-height: 36px; min-height: 36px;
} }
.navigation > li > a{ .navigation > li > a{
padding: 8px 20px 8px 16px; padding: 8px 20px 8px 16px;
min-height: 36px; min-height: 36px;
} }
.navigation .navigation-header{ .navigation .navigation-header{
padding: 10px 16px; padding: 10px 16px;
} }
.navigation > li.active > a, .navigation > li.active > a:hover, .navigation > li.active > a:focus{ .navigation > li.active > a, .navigation > li.active > a:hover, .navigation > li.active > a:focus{
background-color: var(--primary-color); background-color: var(--primary-color);
} }
/* PANELES */ /* PANELES */
.panel-heading{ .panel-heading{
padding: 9px 15px; padding: 9px 15px;
} }
/* SIDEBAR */ /* SIDEBAR */
...@@ -112,113 +112,113 @@ btn-green{ ...@@ -112,113 +112,113 @@ btn-green{
/* NAVBAR */ /* NAVBAR */
.navbar-inverse{ .navbar-inverse{
background-color: var(--primary-color-dark); background-color: var(--primary-color-dark);
border: none; border: none;
} }
/* TABLA */ /* TABLA */
.table-xxs > thead > tr > th, .table-xxs > tbody > tr > th, .table-xxs > tfoot > tr > th, .table-xxs > thead > tr > td, .table-xxs > tbody > tr > td, .table-xxs > tfoot > tr > td{ .table-xxs > thead > tr > th, .table-xxs > tbody > tr > th, .table-xxs > tfoot > tr > th, .table-xxs > thead > tr > td, .table-xxs > tbody > tr > td, .table-xxs > tfoot > tr > td{
padding: 2px 10px; padding: 2px 10px;
} }
.table tr, .table th, .table td, .htContextMenu td, .ranges ul li{ .table tr, .table th, .table td, .htContextMenu td, .ranges ul li{
height: 30px; height: 30px;
} }
.datatable-header{ .datatable-header{
padding-top: 0px; padding-top: 0px;
} }
/* BOTONES */ /* BOTONES */
.btn{ .btn{
padding: 5px 8px; padding: 5px 8px;
} }
/* HEADING ELEMENTS */ /* HEADING ELEMENTS */
.heading-elements{ .heading-elements{
margin-top: -16px; margin-top: -16px;
} }
@media only screen and (max-width: 768px){ @media only screen and (max-width: 768px){
.panel-heading .visible-elements{ .panel-heading .visible-elements{
margin: 15px -15px 0 -15px; margin: 15px -15px 0 -15px;
} }
.panel .visible-elements{ .panel .visible-elements{
padding: 8px; padding: 8px;
} }
.sidebar-mobile-main .sidebar-main, .sidebar-mobile-secondary .sidebar-secondary, .sidebar-mobile-opposite .sidebar-opposite, .sidebar-mobile-detached .sidebar-detached > .sidebar{ .sidebar-mobile-main .sidebar-main, .sidebar-mobile-secondary .sidebar-secondary, .sidebar-mobile-opposite .sidebar-opposite, .sidebar-mobile-detached .sidebar-detached > .sidebar{
width: 100%; width: 100%;
} }
.sidebar-user + .sidebar-category .navigation{ .sidebar-user + .sidebar-category .navigation{
padding-bottom: 0; padding-bottom: 0;
} }
.sidebar-content{ .sidebar-content{
padding-bottom: 0px; padding-bottom: 0px;
} }
} }
/* BREADCRUMBS */ /* BREADCRUMBS */
.breadcrumb{ .breadcrumb{
padding: 7px 0; padding: 7px 0;
} }
/* MODALES */ /* MODALES */
.modal-header[class*=bg-]{ .modal-header[class*=bg-]{
padding: 9px 15px; padding: 9px 15px;
} }
/* MEDIA OBJECTS */ /* MEDIA OBJECTS */
.media-left, .media > .pull-left{ .media-left, .media > .pull-left{
padding-right: 15px; padding-right: 15px;
} }
/*JQUERY CONFIRMATION*/ /*JQUERY CONFIRMATION*/
.jconfirm .jconfirm-box.jconfirm-type-blue{ .jconfirm .jconfirm-box.jconfirm-type-blue{
border-top: solid 7px #3ba4ce; border-top: solid 7px #3ba4ce;
} }
.jconfirm .jconfirm-box.jconfirm-type-blue .jconfirm-title-c .jconfirm-icon-c{ .jconfirm .jconfirm-box.jconfirm-type-blue .jconfirm-title-c .jconfirm-icon-c{
color: #3ba4ce !important; color: #3ba4ce !important;
} }
/*HEADER*/ /*HEADER*/
.tp-header-right-table-button{ .tp-header-right-table-button{
width: 180px; width: 180px;
} }
.tp-header-right-table-button > i{ .tp-header-right-table-button > i{
font-size: 20px; font-size: 20px;
} }
@media only screen and (min-width: 769px) { @media only screen and (min-width: 769px) {
.sidebar{ .sidebar{
width: 200px; width: 200px;
} }
.navbar-header{ .navbar-header{
min-width: 200px; min-width: 200px;
} }
.sidebar-xs .sidebar-main .navigation > li > a > span{ .sidebar-xs .sidebar-main .navigation > li > a > span{
background-color:var(--primary-color); background-color:var(--primary-color);
border: 1px solid var(--primary-color); border: 1px solid var(--primary-color);
right: -200px; right: -200px;
width: 200px; width: 200px;
padding: 7px 20px; padding: 7px 20px;
} }
.sidebar-xs .sidebar-main .navigation > li.active > ul{ .sidebar-xs .sidebar-main .navigation > li.active > ul{
position: absolute; position: absolute;
top: 36px; top: 36px;
width: 200px; width: 200px;
right: -200px; right: -200px;
} }
.sidebar-xs .sidebar-main .navigation > li > ul{ .sidebar-xs .sidebar-main .navigation > li > ul{
position: absolute; position: absolute;
top: 36px; top: 36px;
width: 200px; width: 200px;
right: -200px; right: -200px;
} }
} }
/* /*
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
...@@ -231,34 +231,34 @@ btn-green{ ...@@ -231,34 +231,34 @@ btn-green{
}*/ }*/
table.display tbody tr:hover td { table.display tbody tr:hover td {
background-color: #B0B8B7 !important; background-color: #B0B8B7 !important;
} }
.datatable-scroll{ .datatable-scroll{
border-top: 1px solid #bbbbbb9c; border-top: 1px solid #bbbbbb9c;
border-bottom: 0px; border-bottom: 0px;
} }
.dataTables_info { .dataTables_info {
float: left; float: left;
padding: 13px 0; padding: 13px 0;
margin-bottom: 0px; margin-bottom: 0px;
} }
.dataTables_paginate { .dataTables_paginate {
margin: 5px 0 5px 0; margin: 5px 0 5px 0;
} }
.table-xxs > thead > tr > th, .table-xxs > tbody > tr > th, .table-xxs > tfoot > tr > th, .table-xxs > thead > tr > td, .table-xxs > tbody > tr > td, .table-xxs > tfoot > tr > td { .table-xxs > thead > tr > th, .table-xxs > tbody > tr > th, .table-xxs > tfoot > tr > th, .table-xxs > thead > tr > td, .table-xxs > tbody > tr > td, .table-xxs > tfoot > tr > td {
padding: 3px 15px; padding: 3px 15px;
} }
.table-sm > thead > tr > th, .table-sm > tbody > tr > th, .table-sm > tfoot > tr > th, .table-sm > thead > tr > td, .table-sm > tbody > tr > td, .table-sm > tfoot > tr > td { .table-sm > thead > tr > th, .table-sm > tbody > tr > th, .table-sm > tfoot > tr > th, .table-sm > thead > tr > td, .table-sm > tbody > tr > td, .table-sm > tfoot > tr > td {
padding: 5px 15px; padding: 5px 15px;
} }
.table{ .table{
width: 100% !important; width: 100% !important;
} }
.dataTable thead .sorting_asc:after { .dataTable thead .sorting_asc:after {
content: '' !important; content: '' !important;
} }
.datepicker{z-index:9999 !important} .datepicker{z-index:9999 !important}
...@@ -272,4 +272,8 @@ table.display tbody tr:hover td { ...@@ -272,4 +272,8 @@ table.display tbody tr:hover td {
.align-auto { .align-auto {
text-align: -webkit-auto; text-align: -webkit-auto;
}
.panel-body #frm .form-group{
text-align: -webkit-auto;
} }
\ No newline at end of file
src/main/webapp/js/general.js
...@@ -35,6 +35,7 @@ const URI_ADMINISTRATIVO_ASISTENCIA = "asistenciaAdministrativa"; ...@@ -35,6 +35,7 @@ const URI_ADMINISTRATIVO_ASISTENCIA = "asistenciaAdministrativa";
const URI_TRABAJADORES = "trabajadores"; const URI_TRABAJADORES = "trabajadores";
const URI_ADMINISTRATIVOS_TOLERANCIA_INDIVIDUAL = "toleranciasIndividuales"; const URI_ADMINISTRATIVOS_TOLERANCIA_INDIVIDUAL = "toleranciasIndividuales";
const URI_ADMINISTRATIVOS_ESTADO_TOLERANCIA_INDIVIDUAL = "estadoTolerancias"; const URI_ADMINISTRATIVOS_ESTADO_TOLERANCIA_INDIVIDUAL = "estadoTolerancias";
const URI_ADMINISTRATIVOS_VACACIONES_INDIVIDUAL = "vacacionesAdministrativasIndividuales";
//</editor-fold> //</editor-fold>
......
src/main/webapp/js/pages/vacaciones_administrativas_individual.js
function getColumns() {
let columns = [
{
title: `N°`,
data: `id`,
className: 'text-center'
},
{
title: `APELLIDOS Y NOMBRES`,
data: null,
className: `text-center`,
render: (data) => {
let nombresCompletos;
let nombres = data.trabajador_nombres;
let apellidos = data.trabajador_apellidos;
nombresCompletos = `${apellidos} ${nombres}`;
return nombresCompletos;
}
},
{
title: "FECHA INICIO",
data: "fecha_inicio",
className: "text-center"
},
{
title: `FECHA FIN`,
data: `fecha_fin`,
className: 'text-center'
},
{
title: `CANT. DIAS`,
data: `cantidad_dias`,
className: 'text-center'
},
{
title: `ESTADO`,
data: `estado`,
className: 'text-center',
render: (data) => {
let label = "";
let text = "";
switch (data) {
case 1:
label = "label label-success";
text = "ACTIVO";
break;
case 0:
label = "label label-warning";
text = "INACTIVO";
break;
}
return `<span class="${label}">${text}</span>`;
}
},
{
title: `ACCIONES`,
data: null,
className: 'text-center',
render: (data) => {
let acciones = "";
let verdetalle = "";
let editar = "";
let eliminar = "";
if (data.estado === 1) {
eliminar = `<span style="cursor: pointer"><i class="eliminar fa fa-power-off text-danger-700"></i>&nbsp;&nbsp;</span>`;
} else {
eliminar = `<span style="cursor: pointer"><i class="eliminar fa fa-power-off text-success-700"></i>&nbsp;&nbsp;</span>`;
}
verdetalle = `<span style="cursor: pointer"><i class="verdetalle icon-list text-primary-700"></i>&nbsp;&nbsp;</span>`;
// editar = `<span style="cursor: pointer"><i class="editar icon-pencil text-slate-800"></i>&nbsp;&nbsp;</span>`;
acciones = verdetalle + editar + eliminar;
return acciones;
return null;
}
},
];
return columns;
}
const listarPersonal = (selectorName) => { const listarPersonal = (selectorName) => {
initSelect2(selectorName, baseURLRest + URI_TRABAJADORES, {title: "nombresapellidos", subtitle: "documentoidentidad"}); initSelect2(selectorName, baseURLRest + URI_TRABAJADORES, {title: "nombresapellidos", subtitle: "documentoidentidad"});
}; };
...@@ -14,18 +104,134 @@ const listarSedes = (selectorName) => { ...@@ -14,18 +104,134 @@ const listarSedes = (selectorName) => {
}); });
}; };
const inicializarInputsModalVerDetalle = (data) => {
};
const mostrarModalVerDetalleVacaciones = (data) => {
ajaxModal.get("administrativos/vacaciones/individual/verdetalle.jsp").then((response) => {
swal({
title: '<strong>Detalle de vacaciones</strong>',
html: response.data,
showCloseButton: true,
showCancelButton: true,
focusConfirm: false,
confirmButtonText: '<i class="icon-checkmark2"></i> Editar tolerancia',
confirmButtonAriaLabel: 'Editar tolerancia',
cancelButtonText: '<i class="icon-cross3"></i>Cancelar',
cancelButtonAriaLabel: 'Thumbs down',
width: '30%',
customClass: 'swal2-overflow',
onOpen: () => {
inicializarInputsModalVerDetalle(data);
}
});
});
};
function listarVacacionesIndividuales(objParams = {}){ function listarVacacionesIndividuales(objParams = {}){
ajaxWebService.get(URI_ADMINISTRATIVOS_VACACIONES_INDIVIDUAL, objParams).then((response) => {
let columns = getColumns();
let wrapsNameDatatable = `divDatatable`;
let classNameForDatatable = `display table table-bordered`;
makeDatatable(
wrapsNameDatatable,
{
data: response.data,
columns,
},
classNameForDatatable,
).then((nodes) => {
nodes.container
.off()
.on("click", ".verdetalle", function () {
let data = nodes.datatable.DataTable().row($(this).parents("tr")).data();
mostrarModalVerDetalleVacaciones(data);
})
// .on("click", ".editar", function () {
// let data = nodes.datatable.DataTable().row($(this).parents("tr")).data();
// mostrarModalEditarTolerancia(data);
// })
// .on("click", ".eliminar", function () {
// let data = nodes.datatable.DataTable().row($(this).parents("tr")).data();
// mostrarModalEliminarTolerancia(data);
// });
});
});
} }
const aplicarFiltro = () => { const aplicarFiltro = () => {
}; };
const mostrarModalNuevo = () => {
const inicializarInputsModalRegistroVacaciones = () => {
listarPersonal("#cboPersonal");
initDatePicker("#dpFechaInicio", "#dpFechaFin");
};
const registrarVacaciones = () => {
let params = {};
ajaxWebService.post(URI_ADMINISTRATIVOS_VACACIONES_INDIVIDUAL, params)
.then((response) => {
debugger;
if (response.status) {
swal({
type: 'success',
title: '¡Vacaciones registradas!',
showConfirmButton: false,
timer: 1500
})
listarVacacionesIndividuales();
} else {
swal({
type: 'success',
title: '¡No ha sido posible registrar las vacaciones!',
showConfirmButton: false,
timer: 1500
})
}
})
.catch((error) => {
console.log(error);
});
}; };
const mostrarModalNuevo = () => {
ajaxModal.get("administrativos/vacaciones/individual/registroVacaciones.jsp").then((response) => {
swal({
title: '<strong>Registro de vacaciones</strong>',
html: response.data,
showCloseButton: true,
showCancelButton: true,
focusConfirm: false,
confirmButtonText: '<i class="icon-checkmark2"></i> Registrar vacaciones',
confirmButtonAriaLabel: 'Registrar vacaciones',
cancelButtonText: '<i class="icon-cross3"></i>Cancelar',
cancelButtonAriaLabel: 'Thumbs down',
width: '30%',
customClass: 'swal2-overflow',
onOpen: () => {
inicializarInputsModalRegistroVacaciones();
}
}).then((result) => {
if (result.value) {
registrarVacaciones();
}
});
});
};
$(() => { $(() => {
initDatePicker("#dpFechaInicioFiltro", "#dpFechaFinFiltro"); initDatePicker("#dpFechaInicioFiltro", "#dpFechaFinFiltro");
listarPersonal("#cboPersonalFiltro"); listarPersonal("#cboPersonalFiltro");
......
src/main/webapp/vistas/modals/administrativos/vacaciones/individual/registroVacaciones.jsp
<div class="panel-body"> <div class="panel-body">
<form id="frm" onsubmit="return false;" autocomplete="off"> <form id="frm" onsubmit="return false;" autocomplete="off">
<div class="row">
<div class="form-group col-md-12">
<label>Personal</label>
<select id="cboPersonal" class="select-search form-control"></select>
</div>
</div>
<div class="row">
<div class="form-group col-md-4">
<label>Horario LV</label>
<input type="time" class="form-control text-center" id="txtHorarioLV" disabled>
</div>
<div class="form-group col-md-4">
<label>Tolerancia(min)</label>
<input type="number" min="0" value="0" class="form-control text-center" id="txtToleranciaLV">
</div>
<div class="form-group col-md-4">
<label>Nuevo Horario LV</label>
<input type="time" min="00:00" max="23:59" class="form-control text-center" id="txtNuevoHorarioLV">
</div>
</div>
<div class="row"> <div class="row">
<div class="form-group col-md-4"> <div class="form-group col-md-12">
<label>Horario Sabado</label> <label>Personal</label>
<input type="time" class="form-control text-center" id="txtHorarioSabado" disabled> <select id="cboPersonal" class="select-search form-control"></select>
</div>
<div class="form-group col-md-4">
<label>Tolerancia(min)</label>
<input type="number" min="0" value="0" class="form-control text-center" id="txtToleranciaSabado">
</div>
<div class="form-group col-md-4">
<label>Nuevo Horario Sabado</label>
<input type="time" min="00:00" max="23:59" class="form-control text-center" id="txtNuevoHorarioSabado">
</div> </div>
</div> </div>
<div class="row"> <div class="row">
......
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