function getColumns() {
	let columns = [
		{
			title: `N°`,
			data: `id`,
			className: 'text-center'
		},
		{
			title: `CONCEPTO`,
			data: `descripcion`,
			className: `text-center`,
		},
		{
			title: `MONTO AMANECIDA 12h`,
			data: `monto12h`,
			className: 'text-center'
		},
		{
			title: `MONTO AMANECIDA 24h`,
			data: `monto24h`,
			className: 'text-center'
		},
		{
			title: 'ESTADO',
			data: `estado`,
			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 getColumnDefs() {
	let columnDefs = [
		{orderable: false, width: '1%', targets: 0, className: "text-center"},
		{orderable: false, width: '15%', targets: 1, className: "text-center"},
		{orderable: false, width: '15%', targets: 2, className: "text-center"},
		{orderable: false, width: '15%', targets: 3, className: "text-center"},
		{orderable: false, width: '8%', targets: 4, className: "text-center"},
	];
	return columnDefs;
}



function cambiarFormatoDecimal(selectorName) {
	$(selectorName).formatter({
		pattern: '{{999}}.00'
	});
}

function registrar() {
	let descripcion = $("#txtDescripcion").val();
	let monto24h = parseFloat($("#txtMonto12h").val());
	let monto12h = parseFloat($("#txtMonto24h").val());
	let estado = 1;

	let params = {
		descripcion,
		monto12h,
		monto24h,
		estado
	};

	ajaxWebService.post(URI_POLICIA_MONTOS_AMANECIDAS, params).then((response) => {

		if (response.status) {
			swal({
				type: 'success',
				title: '¡Se registró exitosamente!',
				showConfirmButton: false,
				timer: 1500
			});
			listarMontos();
		}

	});

}
function inicializarInputsModal(data = {}){
	$("#txtEditarConcepto").val(data.descripcion);
	$("#txtEditarMonto12h").val(data.monto12h);
	$("#txtEditarMonto24h").val(data.monto24h);
	debugger
}

function mostrarMensajeResultadoModal(result = {}){
	if (result.value) {
		swal({
			type: 'success',
			title: '¡Se realizó la actualización exitosamente!',
			showConfirmButton: false,
			timer: 1500
		});
}
}

function mostrarModalEdicion(data = {}) {
	ajaxModal.get("policias/asignarMontoAmanecida/editarMontoConcepto.jsp").then((response) => {
		swal({
			title: '<strong>Editar Montos de amanecidas</strong>',
			html: response.data,
			showCloseButton: true,
			showCancelButton: true,
			focusConfirm: false,
			confirmButtonText: '<i class="fa fa-thumbs-up"></i> Guardar cambios',
			confirmButtonAriaLabel: 'Thumbs up, great!',
			cancelButtonText: 'Cancelar',
			cancelButtonAriaLabel: 'Thumbs down',
			width: '15%',
			onOpen: () => {
				inicializarInputsModal(data);
			}
		}).then((result) => {
			mostrarMensajeResultadoModal(result);
		});
	});
}

function mostrarModalEliminacion(data) {
	let {id, estado} = data;
	let titulo = "";
	let textoConfirmacion = ""
	let tituloOperacion = "";


	if (estado) {
		titulo = 'Está seguro de eliminar?';
		textoConfirmacion = 'Sí, eliminar!';
		tituloOperacion = '¡Eliminado exitosamente!';
		estado = 0;
	} 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_POLICIA_MONTOS_AMANECIDAS}/${id}`, {estado}).then((response) => {
				if (response.status) {
					swal({
						type: 'success',
						title: tituloOperacion,
						showConfirmButton: false,
						timer: 1500
					});
					listarMontos();
				}
			});
		}
	});
}

function listarMontos(objParams = {}) {

	ajaxWebService.get(URI_POLICIA_MONTOS_AMANECIDAS, objParams).then((response) => {
		let columns = getColumns();
		let columnDefs = getColumnDefs();

		let wrapsNameDatatable = `divDatatable`;
		let classNameForDatatable = `display table table-bordered`;

		makeDatatable(
		  wrapsNameDatatable,
		  {
			  data: response.data,
			  columns,
			  columnDefs,
		  },
		  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);
			});
		});
	});
}


$().ready(function () {
	listarMontos();
	$("#btnRegistrar").click(registrar);
});