var tableVouchers;
var tableConceptos;
var editor;
$(document).ready(function() {

    tableConceptos = $('#tb-recibo').DataTable({
        "language": {
            "sProcessing":     "Procesando...",
            "sLengthMenu":     "Mostrar _MENU_ registros",
            "sZeroRecords":    "No se encontraron resultados",
            "sEmptyTable":     "No existen registros creados",
            "sInfo":           "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
            "sInfoEmpty":      "Mostrando registros del 0 al 0 de un total de 0 registros",
            "sInfoFiltered":   "(filtrado de un total de _MAX_ registros)",
            "sInfoPostFix":    "",
            "sSearch":         "Buscar:",
            "sUrl":            "",
            "sInfoThousands":  ",",
            "sLoadingRecords": "Cargando...",
            "oPaginate": {
                "sFirst":    "Primero",
                "sLast":     "Último",
                "sNext":     "Siguiente",
                "sPrevious": "Anterior"
            },
            "oAria": {
                "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
                "sSortDescending": ": Activar para ordenar la columna de manera descendente"
            }
        },
        processing: true,
        serverSide: true,
        destroy: true,
        responsive:true,
        ajax:{
            url: urlConceptos,
            method: 'POST',
            error: function(error){
                console.log(error);
            }
        },
        columns:[
            {
                data:'concepto',
                name:'concepto',
                "searchable": false
            },
            {
                data:'monto',
                name:'monto',
                "searchable": false,
                render: $.fn.dataTable.render.number( ',', '.', 2, 'S/.' )
            }
        ],
        "pageLength": 5,
        "columnDefs": [
            { // set default column settings
                'orderable': false,
                'targets': [0]
            }, {
                "searchable": true,
                "targets": [0]
            }
        ],
        "bInfo": false,
        "bLengthChange": false,
        "ordering": false,
        "bFilter": false,
        "fnDrawCallback": function(oSettings) {
            if (oSettings._iDisplayLength > oSettings.fnRecordsDisplay()) {
                $(oSettings.nTableWrapper).find('.dataTables_paginate').hide();
            }
        }
    });

    tableVouchers = $('#tb-voucher').DataTable({
        "language": {
            "sProcessing":     "Procesando...",
            "sLengthMenu":     "Mostrar _MENU_ registros",
            "sZeroRecords":    "No se encontraron resultados",
            "sEmptyTable":     "No existen registros creados",
            "sInfo":           "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
            "sInfoEmpty":      "Mostrando registros del 0 al 0 de un total de 0 registros",
            "sInfoFiltered":   "(filtrado de un total de _MAX_ registros)",
            "sInfoPostFix":    "",
            "sSearch":         "Buscar:",
            "sUrl":            "",
            "sInfoThousands":  ",",
            "sLoadingRecords": "Cargando...",
            "oPaginate": {
                "sFirst":    "Primero",
                "sLast":     "Último",
                "sNext":     "Siguiente",
                "sPrevious": "Anterior"
            },
            "oAria": {
                "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
                "sSortDescending": ": Activar para ordenar la columna de manera descendente"
            }
        },
        processing: true,
        serverSide: true,
        destroy: true,
        responsive:true,
        ajax:{
            url: urlVouchers,
            method: 'POST',
            error: function(error){
                console.log(error);
            }
        },
        columns:[
            {
                data:'codigo',
                name:'codigo',
                "searchable": true
            },
            {
                data:'monto',
                name:'monto',
                "searchable": false,
                render: $.fn.dataTable.render.number( ',', '.', 2, 'S/.' )
            },
            {
                data:'id',
                name:'id',
                "searchable": false,
                render: function(data,type,row){
                    return '<td><button class="btn btn-outline btn-circle btn-sm red eliminar" data-id="'+data+'" type="button"><i class="fa fa-trash"></i> Eliminar </button></td>'
                }
            }
        ],
        "pageLength": 5,
        "columnDefs": [
            { // set default column settings
                'orderable': false,
                'targets': [0]
            }, {
                "searchable": true,
                "targets": [0]
            }
        ],
        "bInfo": false,
        "bLengthChange": false,
        "ordering": false,
        "bFilter": false
    });

    function editarMonto (updatedCell, updatedRow, oldValue) {
        // console.log("The new value for the cell is: " + updatedCell.data());
        // console.log(updatedRow.data().id);
        $.ajax({
            url: urlBase + "/recibo/concepto/editar",
            type: "POST",
            data: {
                id: updatedRow.data().id,
                monto: updatedCell.data()
            },
            success: function (result) {
                if (result.montototal != null) {
                    var total = result.montototal.toFixed(2).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
                    $('#monto_total').text('Monto total: S/. ' + total);
                }
            },
            complete: function (result) {
            }
        });
    }

    tableConceptos.MakeCellsEditable({
        "onUpdate": editarMonto,
        "inputCss":'my-input-class',
        "columns": [1],
        "confirmationButton": {
            "confirmCss": 'my-confirm-class',
            "cancelCss": 'my-cancel-class'
        },
        "inputTypes": [
            {
                "column":1,
                "type":"numeric",
                "options":null
            }
        ]
    });
});

$('input:radio[name="tipo_pago"]').change(function() {
    if ($(this).val() == '2') {
        $('#voucher-container').show();
    } else {
        $('#voucher-container').hide();
    }
});
function tableRefresh() {
    tableVouchers.draw();
}

$("#form-recibo").validate({
    submitHandler: function (form) {
        if ($("input[name=tipo_pago]:checked").val() === '2') {
            if ( ! tableVouchers.data().any() ) {
                swal("No se ingresó un Voucher", "Debe ingresar por lo menos un voucher de pago.", "warning");
                return false;
            }
        }

        var l = Ladda.create(document.querySelector('#submitRecibo'));
        l.start();

        $.ajax({
            url: $(form).attr('action'),
            type: "POST",
            data: $(form).serialize(),
            complete: function () {
                l.toggle();
            },
            error: function () {
                swal("Ocurrió un problema", "No se pudo procesar su solicitud.", "error");
            },
            success: function (data) {
                if (data) {
                    var imprimir = window.open("", "Boleta de Pago");
                    imprimir.document.write(data);
                    imprimir.focus();
                    imprimir.print();
                    imprimir.document.close();
                    imprimir.close();

                    $('#submitTexto').text('Imprimir Recibo');
                    $("input[name=tipo_pago]").prop('disabled', true);
                }
            }
        });
    }
});
$("#form-voucher").validate({
    submitHandler: function (form) {
        var l = Ladda.create(document.querySelector('#submitVoucher'));
        l.start();
        $.ajax({
            url: $(form).attr('action'),
            type: "POST",
            data: $(form).serialize(),
            cache: false,
            dataType: 'json',
            processData: false,
            success: function(result) {
                if (result.responseText != "Fallo") {
                    tableRefresh();
                }
                else {
                    swal("No se pudo agregar", "La boleta ya fue registrada como cancelada.", "error");
                }
                $('#modal').modal('toggle');
            },
            error: function(data) {

                var errors = JSON.parse(data.responseText);
                console.log(errors);
                var htmlErrors = "";
                $.each(errors, function (index, itemData) {
                    htmlErrors = htmlErrors + '<li>' + itemData + '</li>';
                });
                $('#errors-container').html(
                    '<div class="alert alert-dismissible alert-danger">' +
                    '<button type="button" class="close" data-dismiss="alert">&times;</button>' +
                    '<ul class="list-unstyled">' +
                    htmlErrors +
                    '</ul></div>')
            },
            complete: function() {
                l.toggle();
            }
        });
    }
});
$('#tb-voucher').on('click','.eliminar', function () {
    var id = $(this).data('id');
    $.ajax({
        url: urlBase + "/vouchers/eliminar",
        type: "POST",
        data: {
            id: id
        },
        success: function (result) {
            // console.log(result.responseText);
            if (result.responseText != "Fallo") {
                tableRefresh();
            }
            else {
                swal("No se pudo eliminar", "La boleta ya fue registrada como cancelada.", "error");
            }
        },
        error: function (){
            swal("No se pudo eliminar", "Ocurrió un problema con su solicitud.", "error");
        }
    });
});
$('#modal').on('hidden.bs.modal', function(){
    $(this).find('form')[0].reset();
});

$('button#cancelar').on('click', function () {
    var id = $('#cancelar').data('id');

    swal({
            title: '¿Desea cancelar la generación de pago?',
            text: "Se perderán todos los cambios realizados con respecto al recibo.",
            type: "warning",
            confirmButtonText: "Si",
            cancelButtonText: "Cancelar",
            showCancelButton: true,
            closeOnConfirm: false,
            showLoaderOnConfirm: true
        },
        function (isConfirm) {
            if (isConfirm) {
                post(urlBase+"/cancelar", {id: id});
            }
        })
});
