const formulario = document.getElementById("vehiculo_form");
let valIdModelo = 0;
function DeshabilitaDatosVehiculos(valor) {
    if (valor) {
        document.getElementById("idPlaca").readOnly = true;
        document.getElementById("anioVehiculo").readOnly = true;
        document.getElementById("tipoCombustible").readOnly = true;
        document.getElementById("Chasis").readOnly = true;

        $("#marca").attr("disabled", true);
        $("#modelo").attr("disabled", true);
        $("#pertenece").attr("disabled", true);

        // document.getElementById("marca").readOnly = true;
        // document.getElementById("modelo").readOnly = true;
        // //document.getElementById("pertenece").readOnly = true;
        // $('#pertenece').attr('readonly', true);
    } else {
        document.getElementById("idPlaca").readOnly = false;
        document.getElementById("anioVehiculo").readOnly = false;
        document.getElementById("tipoCombustible").readOnly = false;
        document.getElementById("Chasis").readOnly = false;

        $("#marca").attr("disabled", false);
        $("#modelo").attr("disabled", false);
        $("#pertenece").attr("disabled", false);

        // document.getElementById("marca").readOnly = false;
        // document.getElementById("modelo").readOnly = false;
        // document.getElementById("pertenece").readOnly = false;
    }
}
$("form#vehiculo_form").submit(function (e) {
    e.preventDefault();
    MostrarLoader();
    DeshabilitaDatosVehiculos(false);
    // validacion de campos
    //toastr.error("Ingrese un numero de identificación valido.!!");

    const formData = new FormData(this);
    jQuery.each(jQuery("#vehiculo_form")[0].files, function (i, file) {
        formData.append("file-" + i, file);
    });
    $.ajax({
        url: "/admin/crearvehiculo",
        type: "POST",
        data: formData,
        success: function (data) {
            if (data.status == "ok") {
                valIdModelo = 0;
                toastr.success(data.message);
                document.getElementById("id_vehiculo").value = 0;
                document.getElementById("btn_Modifica").style.display = "none";
                document.getElementById("btn_Grabar").style.display = "";
                formulario.reset();
                OcultaDocumentos();
                setTimeout(function () {
                    location.reload();
                }, 1000);
            } else {
                toastr.error(data.message);
            }
            setTimeout(function () {
                OcultarLoader();
            }, 100);
        },
        cache: false,
        contentType: false,
        processData: false,
    });
});

const Limpiar = () => {
    document.getElementById("id_vehiculo").value = 0;
    document.getElementById("btn_Modifica").style.display = "none";
    document.getElementById("btn_Grabar").style.display = "";
    formulario.reset();
    OcultaDocumentos();
    DeshabilitaDatosVehiculos(false);
    valIdModelo = 0;
};

//ocultar documentos reportes
function OcultaDocumentos() {
    var x = document.getElementById("card_reports");
    var id = parseInt(document.getElementById("id_vehiculo").value);
    console.log("id" + id);
    if (x.style.display === "none") {
        if (id > 0) {
            x.style.display = "block";
        }
    } else {
        if (id == 0) {
            x.style.display = "none";
        }
    }
}

$(function () {
    document.getElementById("id_vehiculo").value = 0;
    OcultaDocumentos();
    CambiarBotonGuardar();
    bsCustomFileInput.init();

    //Initialize Select2 Elements
    $(".select2").select2();

    //Initialize Select2 Elements
    $(".select2bs4").select2({
        theme: "bootstrap4",
    });

    //Datemask dd/mm/yyyy
    $("#datemask").inputmask("dd/mm/yyyy", {
        placeholder: "dd/mm/yyyy",
    });
    //Datemask2 mm/dd/yyyy
    $("#datemask2").inputmask("mm/dd/yyyy", {
        placeholder: "mm/dd/yyyy",
    });
    //Money Euro
    $("[data-mask]").inputmask();
    //PLACA
    // Initialize InputMask
    $("input").inputmask();

    //Date picker
    $("#reservationdate").datetimepicker({
        format: "DD/MM/YYYY",
    });
    $("#reservationdate1").datetimepicker({
        format: "DD/MM/YYYY",
    });
    $("#reservationdate2").datetimepicker({
        format: "DD/MM/YYYY",
    });
    //Date and time picker
    $("#reservationdatetime").datetimepicker({
        icons: {
            time: "far fa-clock",
        },
    });

    $(".toastrDefaultSuccess").click(function () {
        //toastr.success('Lorem ipsum dolor sit amet, consetetur sadipscing elitr.')
        $("#vehiculo_form").submit();
    });
    $(".toastrDefaultInfo").click(function () {
        toastr.info("Lorem ipsum dolor sit amet, consetetur sadipscing elitr.");
    });
    $(".toastrDefaultError").click(function () {
        toastr.error(
            "Lorem ipsum dolor sit amet, consetetur sadipscing elitr."
        );
    });
    $(".toastrDefaultWarning").click(function () {
        toastr.warning(
            "Lorem ipsum dolor sit amet, consetetur sadipscing elitr."
        );
    });

    //Date range picker
    $("#reservation").daterangepicker();
    //Date range picker with time picker
    $("#reservationtime").daterangepicker({
        timePicker: true,
        timePickerIncrement: 30,
        locale: {
            format: "DD/MM/YYYY hh:mm A",
        },
    });

    $("#marca").change(function () {

        SetSel(this);
    });

    const csrfToken = document.head.querySelector(
        "[name~=csrf-token][content]"
    ).content;

    function SetSel(elem) {
        var secondCombo = document.getElementById("modelo");
  ;
        $.ajax({
            url: "/admin/listarModelosCatalogo",
            type: "POST",
            data: JSON.stringify({
                id: elem.value,
            }),
            headers: {
                "Content-Type": "application/json",
                "X-CSRF-Token": csrfToken,
            },
            success: function (data) {
                if (data.status == "ok") {
                    if (valIdModelo == 0) {
                        var opciones = "<option value=''>Elegir</option>";
                        for (let i in data.object) {
                            opciones +=
                                '<option value="' +
                                data.object[i].CodigoCatalogo +
                                '">' +
                                data.object[i].Descricion +
                                "</option>";
                        }
                        document.getElementById("modelo").innerHTML = opciones;
                    } else {
                        const filtro = data.object.filter(
                            (x) => x.CodigoCatalogo == valIdModelo
                        );

                        const resultado =
                            '<option value="' +
                            filtro[0].CodigoCatalogo +
                            '">' +
                            filtro[0].Descricion +
                            "</option>";
                        document.getElementById("modelo").innerHTML = resultado;
                    }
                } else {
                    toastr.error(data.message);
                }
            },
            cache: false,
            contentType: false,
            processData: false,
        });
    }

    function CargarBusqueda() {
        $("#tblBuscarVehiculos")
            .DataTable({
                processing: true,
                serverSide: true,
                responsive: true,
                lengthChange: false,
                autoWidth: false,
                select: true,
                //"ajax": "{{ url('/buscarVehiculos') }}",
                ajax: {
                    url: "buscarVehiculos",
                    headers: {
                        "Content-Type": "application/json",
                        "X-CSRF-Token": csrfToken,
                    },
                },
                columns: [
                    {
                        data: "IdVehiculos",
                    },
                    {
                        data: "PlacaVehiculo",
                    },
                    {
                        data: "FechaIngreso",
                    },
                    {
                        data: "CodigoMarca",
                    },
                    {
                        data: "CodigoModelo",
                    },
                    {
                        data: "Socio",
                    },
                    {
                        data: "AnioVehiculo",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "TipoCombustible",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "ColorVehiculo",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "IdMarca",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "IdModelo",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "AmbienteOperacion",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "ClaseTransporte",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "Estado",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "PerteneceVehiculo",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "FechaCaducidadLicencia",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "FechaCaducidadMatricula",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "Chasis",
                        visible: false,
                        searchable: false,
                    },
                    {
                        data: "emisionLicencia",
                        visible: false,
                        searchable: false,
                    },
                ],
                language: {
                    lengthMenu: "Mostrar _MENU_ registros por página",
                    zeroRecords: "No se encontró nada - lo siento",
                    info: "Mostrando la página _PAGE_ de _PAGES_",
                    infoEmpty: "No hay registros disponibles",
                    infoFiltered: "(filtrado de _MAX_ registros totales)",
                    search: "Buscar Vehículos:",
                    paginate: {
                        previous: "Anterior",
                        next: "siguiente",
                    },
                },
                buttons: ["copy", "csv", "excel", "pdf", "print", "colvis"],
            })
            .buttons()
            .container()
            .appendTo("#tblBuscarVehiculos_wrapper .col-md-6:eq(0)");

        var table = $("#tblBuscarVehiculos").DataTable();
        $("#tblBuscarVehiculos tbody").on("click", "tr", function () {
            var row = table.row(this).data();
            CargarDatosSelect(row);
        });
    }

    CargarBusqueda();

    $("#busquedaVeh").on("click", function () {
        var table = $("#tblBuscarVehiculos").DataTable();
        table.ajax.reload();
        $("#modal-xl").modal("show");
    });

    function CargarDatosSelect(item) {
        // console.log(item);
        valIdModelo = item.IdModelo;
        SetComboSocios(parseInt(item.PerteneceVehiculo), item.Socio);
        $("#modal-xl").modal("hide");
        $("#marca").val(item.IdMarca).change();
        document.getElementById("id_vehiculo").value = item.IdVehiculos;
        document.getElementById("idPlaca").value = item.PlacaVehiculo;
        document.getElementById("anioVehiculo").value = item.AnioVehiculo;
        $("#tipoCombustible").val(item.TipoCombustible).change();
        document.getElementById("colorVehiculo").value = item.ColorVehiculo;
        //document.getElementById("marca").value = item.IdMarca;
        //document.getElementById("modelo").value = item.IdModelo;
        document.getElementById("operacion").value = item.AmbienteOperacion;
        document.getElementById("claseTransporte").value = item.ClaseTransporte;
        //document.getElementById("estado").value = item.Estado;
        $("#estado").val(item.Estado).change();
        //document.getElementById("pertenece").value = item.PerteneceVehiculo;
        //console.log(item);
        // console.log(parseInt(item.PerteneceVehiculo));
        // $("#pertenece").val(parseInt(item.PerteneceVehiculo)).change();
        // document.getElementById("emiLicencia").value = format(
        //     item.emisionLicencia
        // );
        // document.getElementById("caduLicencia").value = format(
        //     item.FechaCaducidadLicencia
        // );
        // document.getElementById("matricula").value = format(
        //     item.FechaCaducidadMatricula
        // );
        // 'certMatriculacion' => 'required',
        // 'permisoOperacion' => 'required'
        document.getElementById("Chasis").value = item.Chasis;
        CambiarBotonGuardar();
        //setTimeout(function() {
        //$("#modelo").val(item.IdModelo).change();
        //SetComboModelo(item.IdMarca);
        // }, 500);

        OcultaDocumentos();
        DeshabilitaDatosVehiculos(true);
    }

    function CambiarBotonGuardar() {
        var systemON = document.getElementById("id_vehiculo").value;

        if (systemON > "0") {
            //document.querySelector(`#grupo__accion .button-hidden`).classList.add(".button-visible");
            document.getElementById("btn_Grabar").style.display = "none";
            document.getElementById("btn_Modifica").style.display = "";
        } else {
            //document.querySelector(`#grupo__usuario .button-hidden`).classList.add("formulario__input-error-activo");
            document.getElementById("btn_Modifica").style.display = "none";
            document.getElementById("btn_Grabar").style.display = "";
        }
    }

    function format(inputDate) {
        let fecha = new Date(inputDate);
        let date, month, year;

        date = fecha.getDate() + 1;
        month = fecha.getMonth() + 1;
        year = fecha.getFullYear();

        date = date.toString().padStart(2, "0");

        month = month.toString().padStart(2, "0");

        return `${date}/${month}/${year}`;
    }

    //CREACION DE MARCAS Y MODELOS
    //ACCION
    $("#addMarca").on("click", function () {
        $("#modal-marcas").modal("show");
    });

    $("#addModelo").on("click", function () {
        var marca = document.getElementById("marca").value;
    //    console.log(marca);
        if (marca > 0) {
            $("#modal-modelos").modal("show");
            $("#marca2").val(marca).change();
        } else {
            toastr.error("Debe Seleccionar una Marca!");
        }
    });

    $("#btnGuardarMarca").on("click", function () {
        $("#marca_form").submit();
    });

    $("#btnGuardarModelo").on("click", function () {
        var marca = document.getElementById("marca").value;
        document.getElementById("IdPadre").value = marca;

        $("#modelo_form").submit();
    });

    $("form#marca_form").submit(function (e) {
        e.preventDefault();
        MostrarLoader();
        // validacion de campos
        //toastr.error("Ingrese un numero de identificación valido.!!");
        const formData = new FormData(this);
        $.ajax({
            url: "/admin/createMarcas",
            type: "POST",
            data: formData,
            success: function (data) {
                if (data.status == "ok") {
                    $("#modal-marcas").modal("hide");
                    SetComboMarca();
                    toastr.success(data.message);
                    document.getElementById("marca_form").reset();
                } else {
                    toastr.error(data.message);
                }
                setTimeout(function () {
                    OcultarLoader();
                }, 100);
            },
            cache: false,
            contentType: false,
            processData: false,
        });
    });

    $("form#modelo_form").submit(function (e) {
        e.preventDefault();
        MostrarLoader();
        // validacion de campos
        //toastr.error("Ingrese un numero de identificación valido.!!");

        const formData = new FormData(this);
        $.ajax({
            url: "/admin/createModelos",
            type: "POST",
            data: formData,
            success: function (data) {
                if (data.status == "ok") {
                    $("#modal-modelos").modal("hide");
                    var marca = document.getElementById("marca").value;
                    SetComboModelo(marca);
                    toastr.success(data.message);
                    document.getElementById("modelo_form").reset();
                } else {
                    toastr.error(data.message);
                }
                setTimeout(function () {
                    OcultarLoader();
                }, 100);
            },
            cache: false,
            contentType: false,
            processData: false,
        });
    });

    //RECARGAR MARCAS
    function SetComboMarca() {
        $.ajax({
            url: "/vehiculo/CargarMarcas",
            type: "GET",
            headers: {
                "Content-Type": "application/json",
                "X-CSRF-Token": csrfToken,
            },
            success: function (data) {
                if (data.status == "ok") {
                    var opciones = ""; //"<option value=''>Elegir</option>";
                    for (let i in data.object) {
                        opciones +=
                            '<option value="' +
                            data.object[i].IdDetcatalogo +
                            '">' +
                            data.object[i].Descricion +
                            "</option>";
                    }
                    document.getElementById("marca").innerHTML = opciones;
                    document.getElementById("marca2").innerHTML = opciones;
                } else {
                    toastr.error(data.message);
                }
            },
            cache: false,
            contentType: false,
            processData: false,
        });
    }

    //RECARGAR MODELOS
    function SetComboModelo(marca) {
        $.ajax({
            url: "/admin/listarModelosCatalogo",
            type: "POST",
            data: JSON.stringify({
                id: marca,
            }),
            headers: {
                "Content-Type": "application/json",
                "X-CSRF-Token": csrfToken,
            },
            success: function (data) {
                if (data.status == "ok") {
                    var opciones = "<option value=''>Elegir</option>";
                    for (let i in data.object) {
                        opciones +=
                            '<option value="' +
                            data.object[i].CodigoCatalogo +
                            '">' +
                            data.object[i].Descricion +
                            "</option>";
                    }
                    document.getElementById("modelo").innerHTML = opciones;
                } else {
                    toastr.error(data.message);
                }
            },
            cache: false,
            contentType: false,
            processData: false,
        });
    }

    //RECARGAR SOCIOS
    function SetComboSocios(id, nombre) {
        const socio = '<option value="' + id + '">' + nombre + "</option>";
        // }
        document.getElementById("pertenece").innerHTML = socio;
        // $.ajax({
        //     url: "/socios/listarxId/" + idSocio,
        //     type: "GET",
        //     headers: {
        //         "Content-Type": "application/json",
        //         "X-CSRF-Token": csrfToken,
        //     },
        //     success: function (data) {
        //         if (data != null) {
        //             // = ""; //"<option value=''>Elegir</option>";
        //             //for (let i in data) {
        //             const socio = (opciones +=
        //                 '<option value="' +
        //                 data[0].IdSocios +
        //                 '">' +
        //                 data[0].nombre_completo +
        //                 "</option>");
        //             // }
        //             document.getElementById("pertenece").innerHTML = socio;
        //         } else {
        //             toastr.error("no se pudo actualizar la lista de socios");
        //         }
        //     },
        //     cache: false,
        //     contentType: false,
        //     processData: false,
        // });
    }
});
