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.nombres;
				let apellidos = data.apellidos;
				nombresCompletos = `${apellidos} ${nombres}`;

				return nombresCompletos;
			}
		},
		{
			title: `CARGO`,
			data: `cargo`,
			className: 'text-center'
		},
		{
			title: `HORARIO`,
			data: `horario`,
			className: 'text-center'
		},
		{
			title: `FECHA`,
			data: `fecha`,
			className: 'text-center'
		},
		{
			title: `HORA MARCACIÓN`,
			data: `hora_marcacion`,
			className: 'text-center'
		},
		{
			title: 'ESTADO',
			data: `estado_asistencia`,
			className: "text-center",
			render: (data) => {
				let label = "";
				let contenido = "";

				if (data === 1) {
					label = `label label-success`;
					contenido = "ACTIVO";
				} else if (data === 0) {
					label = `label label-danger`;
					contenido = "INACTIVO";
				}

				return `<span class="${label}">${contenido}</span>`;
			}
		},
		{
			title: `ACCIONES`,
			data: null,
			className: 'text-center',
			render: (data) => {
				let editar = "";
				let eliminar = "";
				if (data.estado === 1) {
					editar = `<span data-placement="left" title="Editar" style="cursor: pointer"> <i class="editar icon-pencil text-slate-800"></i>&nbsp;&nbsp; </span>`;
					eliminar = `<span data-placement="left" title="Eliminar" style="cursor: pointer"> <i class="eliminar fa  fa-power-off text-danger-700"></i>&nbsp;&nbsp; </span>`;
				} else {
					eliminar = `<span data-placement="left" title="Eliminar" style="cursor: pointer"> <i class="eliminar fa  fa-power-off text-success-700"></i>&nbsp;&nbsp; </span>`;
				}

				let acciones = editar + eliminar;
				return acciones;
			}
		}
	];

	return columns;
}


function listarAsistencia(objParams = {}) {

	ajaxWebService.get(URI_ADMINISTRATIVO_ASISTENCIA, 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();
//			nodes.container.on("click", ".editar", function () {
//				let data = nodes.datatable.DataTable().row($(this).parents("tr")).data();
//				mostrarModalEdicion(data);
//			});
//
//			nodes.container.on("click", ".eliminar", function () {
//				let data = nodes.datatable.DataTable().row($(this).parents("tr")).data();
//				mostrarModalEliminacion(data);
//			});
		});
	});
}

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 listarPersonal = (selectorName) => {
	initSelect2(selectorName, baseURLRest + URI_TRABAJADORES, {title: "nombresapellidos", subtitle: "documentoidentidad"});
}

$(() => {
	listarAsistencia();
	initDatePicker("#dpFechaInicio", "#dpFechaFin");
	listarSedes("#cboSedesFiltro");
	listarPersonal("#cboPersonalFiltro");
});
