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: "fechaInicio",
			className: "text-center"
		},
		{
			title: `FECHA FIN`,
			data: `fechaFin`,
			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 2:
						label = "label label-warning";
						text = "ANULADO";
						break;
					case 3:
						label = "label label-info";
						text = "TERMINADO";
						break;
					case 4:
						label = "label label-danger";
						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 columns;
}



const listarPersonal = (selectorName) => {
	initSelect2(selectorName, baseURLRest + URI_TRABAJADORES, {title: "nombresapellidos", subtitle: "documentoidentidad"});
};


const listarSedes = (selectorName) => {
	ajaxWebService.get(URI_SEDES).then((result) => {
		let sedes = result.data;
		sedes = _.orderBy(sedes, s => s.descripcion);
		let html = `<option value="">[TODOS]</option>`;
		sedes.forEach(sede => html += `<option value="${sede.codigo}">${sede.descripcion}</option>`);
		$(`${selectorName}`).html(html);
		$(selectorName).select2();
	});
};


const inicializarInputsModalNuevaTolerancia = () => {
	listarPersonal("#cboPersonal");
	$("#cboPersonal").change(cargarHorarios);
	$("#txtToleranciaLV").bind('input', function (e) {
		if (!$(this).data("previousValue") || $(this).data("previousValue") != $(this).val()) {
			console.log("changed " + $(this).val());
			$(this).data("previousValue", $(this).val());
			let tolerancia = $(this).val();
			let horarioLV = $("#txtHorarioLV").val();
			let nuevoHorarioLV = addMinutes(horarioLV, tolerancia);
			$("#txtNuevoHorarioLV").val(nuevoHorarioLV);
		}

	});

	$("#txtToleranciaSabado").bind('input', function (e) {
		if (!$(this).data("previousValue") || $(this).data("previousValue") != $(this).val()) {
			console.log("changed " + $(this).val());
			$(this).data("previousValue", $(this).val());
			let tolerancia = $(this).val();
			let horarioSabado = $("#txtHorarioSabado").val();
			let nuevoHorarioSabado = addMinutes(horarioSabado, tolerancia);
			$("#txtNuevoHorarioSabado").val(nuevoHorarioSabado);
		}

	});

	initDatePicker("#dpFechaInicio", "#dpFechaFin");
};

const cargarHorarios = () => {
	let jsonPersonal = $('#cboPersonal').select2('data')[0];
	let horarioLV = jsonPersonal.horarioLV;
	let horarioSabado = jsonPersonal.horarioSabado;
	$("#txtHorarioLV").val(horarioLV);
	$("#txtNuevoHorarioLV").val(horarioLV).attr('min', horarioLV);
	$("#txtHorarioSabado").val(horarioSabado).attr('min', horarioSabado);
	$("#txtNuevoHorarioSabado").val(horarioSabado);
}

const registrarNuevaTolerancia = () => {
	let jsonPersonal = $('#cboPersonal').select2('data')[0];
	let {
		id: trabajador_id,
		nombres: trabajador_nombres,
		apellidos: trabajador_apellidos,
		documento_identidad: trabajador_documentoidentidad,
		horarioLV,
		horarioSabado
	} = jsonPersonal;


	let toleranciaLV = $("#txtToleranciaLV").val();
	let toleranciaSabado = $("#txtToleranciaSabado").val();
	let nuevoHorarioLV = $("#txtNuevoHorarioLV").val();
	let nuevoHorarioSabado = $("#txtNuevoHorarioSabado").val();

	let fechaInicio = $("#dpFechaInicio").val();
	let fechaFin = $("#dpFechaFin").val();
	let observacion = $("#txtObservacion").val();


	let params = {
		trabajador_id,
		trabajador_documentoidentidad,
		trabajador_nombres,
		trabajador_apellidos,
		horarioLV,
		toleranciaLV,
		nuevoHorarioLV,
		horarioSabado,
		toleranciaSabado,
		nuevoHorarioSabado,
		fechaRegistro: "",
		fechaInicio,
		fechaFin,
		observacion,
		estado: 1
	};

	ajaxWebService.post(URI_ADMINISTRATIVOS_TOLERANCIA_INDIVIDUAL, params)
		.then((response) => {
			debugger;
			if (response.status) {
				swal({
					type: 'success',
					title: '¡Tolerancia registrada exitosamente!',
					showConfirmButton: false,
					timer: 1500
				})
				listarToleranciasIndividuales();
			} else {
				swal({
					type: 'success',
					title: '¡No ha sido posible registrar la tolerancia!',
					showConfirmButton: false,
					timer: 1500
				})
			}
		})
		.catch((error) => {
			console.log(error);
		});


};

const mostrarModalNuevaTolerancia = () => {
	ajaxModal.get("administrativos/tolerancia/individual/registroTolerancia.jsp").then((response) => {
		swal({
			title: '<strong>Nueva Tolerancia</strong>',
//            type: 'info',
			html: response.data,
			showCloseButton: true,
			showCancelButton: true,
			focusConfirm: false,
			confirmButtonText: '<i class="icon-checkmark2"></i> Registrar tolerancia',
			confirmButtonAriaLabel: 'Registrar tolerancia',
			cancelButtonText: '<i class="icon-cross3"></i>Cancelar',
			cancelButtonAriaLabel: 'Thumbs down',
			width: '30%',
			customClass: 'swal2-overflow',
			onOpen: () => {
				inicializarInputsModalNuevaTolerancia();
			}
		}).then((result) => {
			if (result.value) {
				registrarNuevaTolerancia();
			}
		});
	});
};

const aplicarFiltro = () => {
	debugger
	let jsonPersonal = $('#cboPersonalFiltro').select2('data')[0];
	let trabajador_id = "";

	if (jsonPersonal) {
		trabajador_id = jsonPersonal.id;
	}

//	let sede_id = "";
	let fecha_inicio = $("#dpFechaInicioFiltro").val();
	let fecha_fin = $("#dpFechaFinFiltro").val();
	let rango_fechas = generarFechas(fecha_inicio, fecha_fin);

	let params = cleanQueryParams({
		trabajador_id,
		fecha_inicio: rango_fechas
	});

	debugger
	listarToleranciasIndividuales({params});
}


function addMinutes(time, minsToAdd) {
	function D(J) {
		return (J < 10 ? '0' : '') + J;
	}
	;
	var piece = time.split(':');
	var mins = piece[0] * 60 + +piece[1] + +minsToAdd;

	return D(mins % (24 * 60) / 60 | 0) + ':' + D(mins % 60);
}


const mostrarModalVerDetalleTolerancia = (data) => {

};
const mostrarModalEditarTolerancia = (data) => {
	ajaxModal.get("administrativos/tolerancia/individual/editarTolerancia.jsp").then((response) => {
		swal({
			title: '<strong>Editar Tolerancia</strong>',
//            type: 'info',
			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: () => {
				inicializarInputsModalEditarTolerancia(data);
			}
		}).then((result) => {
			if (result.value) {
				editarTolerancia();
			}
		});
	});
};
const mostrarModalEliminarTolerancia = (data) => {
	let {id, estado} = data;
	let titulo = "";
	let textoConfirmacion = ""
	let tituloOperacion = "";
	if (estado == 1) {
		titulo = 'Está seguro de eliminar la tolerancia?';
		textoConfirmacion = 'Sí, eliminar!';
		tituloOperacion = '¡Eliminado exitosamente!';
		estado = 4;
	} else {
		titulo = 'Está seguro de activar?';
		textoConfirmacion = 'Sí, activar!';
		tituloOperacion = '¡Activado exitosamente!';
		estado = 1;
	}

	swal({
		title: titulo,
		text: "",
		type: 'warning',
		showCancelButton: true,
		confirmButtonColor: '#3085d6',
		cancelButtonColor: '#d33',
		confirmButtonText: textoConfirmacion
	}).then((result) => {
		if (result.value) {
			ajaxWebService.patch(`${URI_ADMINISTRATIVOS_TOLERANCIA_INDIVIDUAL}/${id}`, {estado}).then((response) => {
				if (response.status) {
					swal({
						type: 'success',
						title: tituloOperacion,
						showConfirmButton: false,
						timer: 1500
					});
					listarToleranciasIndividuales();
				}
			});
		}
	});
};


const editarTolerancia = () => {
	swal({
						type: 'success',
						title: "Se actualizó la tolerancia exitosamente",
						showConfirmButton: false,
						timer: 1500
					});
};

const inicializarInputsModalEditarTolerancia = (data) => {
	let nombresCompletos = `${data.trabajador_apellidos} ${data.trabajador_nombres}`;
	$("#spanNombres").text(nombresCompletos);
	$("#txtHorarioLV").val(data.horarioLV);
	$("#txtToleranciaLV").val(data.toleranciaLV);
	$("#txtNuevoHorarioLV").val(data.nuevoHorarioLV);
	$("#txtHorarioSabado").val(data.horarioSabado);
	$("#txtToleranciaSabado").val(data.toleranciaSabado);
	$("#txtNuevoHorarioSabado").val(data.nuevoHorarioSabado);
	initDatePicker("#dpFechaInicio", "#dpFechaFin");
	$("#dpFechaInicio").val(data.fechaInicio);
	$("#dpFechaFin").val(data.fechaFin);
	$("#txtObservacion").val(data.observacion);


};



function listarToleranciasIndividuales(objParams = {}){
	ajaxWebService.get(URI_ADMINISTRATIVOS_TOLERANCIA_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();
					mostrarModalVerDetalleTolerancia(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);
				});

		});
	});
}

$(() => {
	initDatePicker("#dpFechaInicioFiltro", "#dpFechaFinFiltro");
	listarPersonal("#cboPersonalFiltro");
	listarSedes("#cboSedesFiltro");
	$("#btnMostrarTodo").click(listarToleranciasIndividuales);
	$("#btnAplicarFiltro").click(aplicarFiltro);
	$("#btnNuevaTolerancia").click(mostrarModalNuevaTolerancia);
});