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 = "PASIVO";
				}

				return `<span class="${label}">${contenido}</span>`;
			}
		},
		{
			title: `ACCIONES`,
			data: null,
			className: 'text-center',
			render: (data) => {
				let acciones = `<span data-placement="left" title="Editar" style="cursor: pointer"> <i class="editar icon-pencil text-slate-800"></i>&nbsp;&nbsp; </span>
                                    <span data-placement="left" title="Eliminar" style="cursor: pointer"> <i class="eliminar icon-cancel-circle2 text-danger-700"></i>&nbsp;&nbsp; </span>`;
				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
	};

	axios.post(URI_POLICIA_MONTOS_AMANECIDAS, params).then((response) => {
		response.data = formatResponse(response);

		if (response.data.status) {
			swal({
				type: 'success',
				title: '¡Se registró correctamente!',
				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 correctamente!',
			showConfirmButton: false,
			timer: 1500
		});
}
}

function mostrarModalEdicion(data = {}) {
	axios.get("modals/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) {

	axios.put(URI_POLICIA_MONTOS_AMANECIDAS, data)

	swal({
		type: 'success',
		title: '¡Eliminado correctamente!',
		showConfirmButton: false,
		timer: 1500
	});
}

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.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);
});