@extends('layouts.app')

@section('content')
<style>
.modal-dialog{
    margin-top: 2%;
}
</style>
<input type="hidden" id="errorTole" value="0">
<div class="container">
    <div class="form-group row">
        <label for="staticEmail" class="col-sm-1 col-form-label"><b class="text-blue">Entidad</b></label>
        <div class="col-sm-3">
            <select name="entidad_maestro" id="entidad_maestro" class="form-control" onChange="traeMuestras()">
                <option value="0000">Seleccione</option>
                @foreach($entidad as $enti)
                    <option value="{{ $enti->ent_id }}" @if(session('enti') == $enti->ent_id) selected='selected' @endif> {{ $enti->ent_abrev }}</option>
                @endforeach
            </select>
        </div>
        <label for="staticEmail" class="col-sm-1 col-form-label" style="padding-left: 3%;"><b class="text-blue">Muestra</b></label>
            <div class="col-sm-4" id="traeFileError">
                <select name="fileSiaf_maestro" id="fileSiaf_maestro" class="form-control" onChange="acutalizaTabla()">
                    <option value="0000">Seleccione</option>
                </select>
        </div>
    </div>
    <hr>
    <div class="row sub-titulo">
        <h5>Tabla de decisiones para muestras</h5>
    </div>
    <br>
    <div class="form-group row">
        <div class="col-12 btn-right">
            <button type="button" class="btn btn-primary" title="Nuevo" onclick="nuevaConfiguracion()">
            <svg class="bi bi-file-earmark-plus" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
  <path d="M9 1H4a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h5v-1H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h5v2.5A1.5 1.5 0 0 0 10.5 6H13v2h1V6L9 1z"/>
  <path fill-rule="evenodd" d="M13.5 10a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1H13v-1.5a.5.5 0 0 1 .5-.5z"/>
  <path fill-rule="evenodd" d="M13 12.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1H14v1.5a.5.5 0 0 1-1 0v-2z"/>
</svg>
            </button>
        </div>
    </div>
    <div class="row">
    <div class="table-responsive">
        <table class="table table-striped table-hover table-sm" id="tabla">
            <thead class="thead-principal">
                <tr>
                <th >ID</th>
                <th >Descripci&oacute;n</th>
                <th >Clasificador</th>
                <th >Estado</th>
                <th class="th-botton"></th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
</dvi>

<!-- Modal -->

<div class="modal fade bd-example-modal-lg" id="modalExportar" tabindex="-1" role="dialog" aria-labelledby="modalExportar" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="modalExportar">Nueva Regla</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="alert alert-danger alert-dismissible fade show" role="alert" id="alert-message" style="display:none;">
            <span id="message">A simple danger alert—check it out!</span>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <form method="POST" action="{{ route('tabla.save') }}" id="form-tabla-decision">
        @csrf
            <input type="hidden" name="tipoModulo" id="tipoModulo" value="{{ $tipoModulo }}">
            <input type="hidden" name="entidad" id="entidad" value="1">
            <input type="hidden" name="codDecision" id="codDecision" value="1">
            <input type="hidden" name="edita" id="edita" value="1">
            <input type="hidden" name="reglaGeneral" id="reglaGeneral">
            <div class="form-group row">
                <label for="idFile" class="col-sm-2 col-form-label text-blue" style="padding-left: 3%;"><b>ID</b></label>
                <div class="col-sm-2">
                <input type="text" class="form-control" id="idFile" name="idFile" maxlength="11" value="{{ $ultimo }}" readonly>
                </div>
                <div class="col-sm-3">
                </div>
                <label class="col-sm-1 col-form-label text-blue"><b>Estado</b></label>
                <div class="col-sm-3">
                    <select name="activo" id="activo" class="form-control">
                        <option value="ACTIVO">Activo</option>
                        <option value="INACTIVO">Inactivo</option>
                    </select>
                </div>
            </div>
            <div class="form-group row">
                <label for="staticEmail" class="col-sm-2 col-form-label" style="padding-left: 3%;"><b class="text-blue">Muestra</b></label>
                <div class="col-sm-5">
                    <select name="fileSiaf" id="fileSiaf" class="form-control">
                        <option value="0000">Seleccione</option>
                        @foreach($fileSiaf as $file)
                            <option value="{{ $file->siaf_id }}" > {{ $file->siaf_descripcion }}</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <div class="form-group row">
                <label for="descripcion" class="col-sm-2 col-form-label text-blue" style="padding-left: 3%;" maxlength="80"><b>Descripción</b></label>
                <div class="col-sm-9">
                <input type="text" class="form-control" id="descripcion" name="descripcion">
                </div>
            </div>
            <div class="form-group row">
                <label for="partida" class="col-sm-2 col-form-label text-blue " style="padding-left: 3%;"><b>Clasificador</b></label>
                <div class="col-sm-3">
                <input type="text" class="form-control" id="partida" name="partida" maxlength="30">
                </div>
            </div>
            <div class="form-group row ">
            <div class="col sub-titulo" style="margin-left: 3%;margin-right: 3%;background-color:#D98D0A;">
        <h5 style="text-align:center">Acciones</h5>
    </div>

            </div>
            <div class="form-group row">
            <div class="col-1"></div>
                <div class="col-sm-4">
                    <div class="custom-control custom-radio" style="padding-top: 3%;">
                    <input type="radio" id="cantidadRegistro" name="decisionRadio" class="custom-control-input" value="1" onclick="validaRadio()">
                    <label class="custom-control-label" for="cantidadRegistro">Cantidad de registros</label>
                    </div>
                </div>
                <div class="col-sm-2">
                    <input type="text" class="form-control" id="numCantidad" style="text-align: right;" name="numCantidad" maxlength="4">
                </div>
            </div>
            <div class="form-group row" >
            <div class="col-sm-1"></div>
                <div class="col-sm-4">
                    <div class="custom-control custom-radio" style="padding-top: 3%;">
                    <input type="radio" id="hastaET" name="decisionRadio" class="custom-control-input" value="2" onclick="validaRadio()">
                    <label class="custom-control-label" for="hastaET">Hasta llegar a ET</label>
                    </div>
                </div>
                <div class="col-sm-2">
                    <input type="text" class="form-control" style="text-align: right;" id="errorTolerable" name="errorTolerable" readonly="readonly">
                </div>
            </div>
            <div class="form-group row" >
            <div class="col-sm-1"></div>
                <div class="col-sm-4">
                    <div class="custom-control custom-radio" style="padding-top: 3%;">
                    <input type="radio" id="hastaPorcentaje" name="decisionRadio" class="custom-control-input" value="3" onclick="validaRadio()">
                    <label class="custom-control-label" for="hastaPorcentaje">Hasta llegar a un % de ET</label>
                    </div>
                </div>
                <div class="col-sm-2">
                    <input type="text" class="form-control" id="porcentaje" name="porcentaje" style="text-align: right;">
                </div>
                <div class="col-1" style="padding-left: 0px;"><label style="padding-top: 15%;" maxlength="5">%</label></div>
            </div>

        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-principal" data-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-principal" id="button-guardar">Aceptar</button>
      </div>
    </div>
  </div>
</div>

<script>

    function validaRadio(){

        if($('input:radio[name=decisionRadio]:checked').val() == "1"){
            $("#numCantidad").prop('readonly', false);
            $("#porcentaje").prop('readonly', true);
            //$("#numCantidad").val('');
            $("#porcentaje").val('');
        }

        if($('input:radio[name=decisionRadio]:checked').val() == "2"){
            $("#numCantidad").prop('readonly', true);
            $("#porcentaje").prop('readonly', true);
            $("#numCantidad").val('');
            $("#porcentaje").val('');
        }

        if($('input:radio[name=decisionRadio]:checked').val() == "3"){
            $("#numCantidad").prop('readonly', true);
            $("#porcentaje").prop('readonly', false);
            $("#numCantidad").val('');
            //$("#porcentaje").val('');
        }

    }

    function nuevaConfiguracion(){
        $("#edita").val('0');
        if($("#entidad_maestro").val() == "0000"){
            Swal.fire({
                title: 'Debe Seleccionar una entidad',
                icon: 'warning',
            })
        }else if($("#fileSiaf_maestro").val() == "0000"){
            Swal.fire({
                title: 'Debe Seleccionar una muestra',
                icon: 'warning',
            })
        }else{
            $.ajax({
                type:"GET",
                url:"{{ asset('') }}traeID/"+$("#entidad_maestro").val()+"/"+$("#fileSiaf_maestro").val(),
                success:function(datos){
                    $.each(datos, function (i, items) {
                        $("#idFile").val(items);
                    });
                    $("#button-guardar").text("Aceptar");
                    $("#partida").prop('readonly', false);
                    $("#activo").prop('disabled', false);
                    $("#fileSiaf").val($("#fileSiaf_maestro").val());
                    $("#entidad").val($("#entidad_maestro").val());
                    $("#fileSiaf").prop('disabled', false);
                    $("#descripcion").val('');
                    $("#partida").val('');
                    $("#numCantidad").val('');
                    $("#porcentaje").val('');
                    $('input:radio[name=decisionRadio]')[0].checked = false;
                    $('input:radio[name=decisionRadio]')[1].checked = false;
                    $('input:radio[name=decisionRadio]')[2].checked = false;
                    $("#numCantidad").prop('readonly', false);
                    $("#porcentaje").prop('readonly', false);
                    $("#modalExportar").modal('show');
                    $("#errorTolerable").val(addCommas($("#errorTole").val()));
                }
            });

        }


    }

    function validaForm(){

        if($("#idFile").val() == ""){
            $("#alert-message").css("display", "block");
            $("#message").text("Ingrese un ID");
            return false
        }

        if($("#fileSiaf").val() == "0000"){
            $("#alert-message").css("display", "block");
            $("#message").text("Seleccionar una muestra");
            return false
        }

        if($("#descripcion").val() == ""){
            $("#alert-message").css("display", "block");
            $("#message").text("Ingrese una descripción");
            return false
        }
        if($("#reglaGeneral").val() != "S"){
            if($("#partida").val() == ""){
                $("#alert-message").css("display", "block");
                $("#message").text("Ingrese un código de clasificador");
                return false
            }
        }


        if($('input:radio[name=decisionRadio]:checked').val() == "1"){
            if($("#numCantidad").val() == ""){
                $("#alert-message").css("display", "block");
                $("#message").text("Ingrese Cantidad de registros");
                return false
            }
        }

        if($('input:radio[name=decisionRadio]:checked').val() == "3"){
            if($("#porcentaje").val() == ""){
                $("#alert-message").css("display", "block");
                $("#message").text("Ingrese un porcentaje");
                return false
            }
        }

        if(!$('input:radio[name=decisionRadio]:checked').is(':checked')){
            $("#alert-message").css("display", "block");
            $("#message").text("Seleccione una regla");
            return false
        }

        return true;

    }

    function envioForumario(tbody, table){
        $("#button-guardar").click(function(){
            let retorna =  validaForm();
            if(retorna ==  true){
                if($("#edita").val() != "1"){
                   nuevoFormulario();
                } else {
                    editaFormulario(tbody, table);
                }
            }
        });
    }

    let indexGlobal;
    let dataGlobal;

    function editar(tbody, table){

        $(tbody).on("click","button.editar", function(){
            $("#alert-message").css("display", "none");
            if(table.row(this).child.isShown()){
                var data = table.row(this).data();
                indexGlobal = table.row(this);
            }else{
                var data = table.row($(this).parents("tr")).data();
                indexGlobal = table.row($(this).parents("tr"));
            }
            dataGlobal = data;

            $("#edita").val('1');
            $("#idFile").val(data.des_identificador);
            $("#button-guardar").text("Actualizar");
            $("#entidad").val(data.des_id_entidad);
            $("#fileSiaf").prop('disabled', true);
            $("#fileSiaf").val(data.des_siaf_id);
            $("#descripcion").val(data.des_descripcion);
            $("#partida").val(data.des_clasificador);
            $("#codDecision").val(data.des_id);
            $("#activo").val(data.des_estado);
            $("#numCantidad").val(data.des_cantidad_registros != '0' ? data.des_cantidad_registros : '');
            $("#porcentaje").val(data.des_hasta_porcentaje_et != '0' ? data.des_hasta_porcentaje_et : '');
            $("#errorTolerable").val(addCommas($("#errorTole").val()));
            $("#reglaGeneral").val(data.des_indicados_rg );
            if(data.des_indicados_rg  == 'S'){
                $("#partida").val('');
                $("#partida").prop('readonly', true);
                $("#activo").prop('disabled', true);
            } else{
                $("#partida").prop('readonly', false);
                $("#activo").prop('disabled', false);
            }

            if(data.des_cantidad_registros != '' && data.des_cantidad_registros != null){

                $('input:radio[name=decisionRadio]')[0].checked = true;
                $("#porcentaje").prop('readonly', true);
                $("#numCantidad").prop('readonly', false);

            }else if(data.des_hasta_porcentaje_et != '' && data.des_hasta_porcentaje_et != null){

                $('input:radio[name=decisionRadio]')[2].checked = true;
                $("#numCantidad").prop('readonly', true);
                $("#porcentaje").prop('readonly', false);

            }else if(data.des_hasta_et != '0' && data.des_hasta_et != null){

                $('input:radio[name=decisionRadio]')[1].checked = true;
                $("#numCantidad").prop('readonly', true);
                $("#porcentaje").prop('readonly', true);

            }else{
                $('input:radio[name=decisionRadio]')[0].checked = false;
                $('input:radio[name=decisionRadio]')[1].checked = false;
                $('input:radio[name=decisionRadio]')[2].checked = false;
                $("#numCantidad").prop('readonly', false);
                $("#porcentaje").prop('readonly', false);
            }

            $("#form-carga-archivo").attr("action", '{{ asset('') }}editaDecision');
            $("#modalExportar").modal();
        })
    }

    function addCommas(nStr){
    nStr += '';
    x = nStr.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1 + x2;
    }

    function armaTable(primeraVez){
        let entidad = $("#entidad_maestro").val();
        let fileSiaf = $("#fileSiaf_maestro").val();
        let tipoModulo = $("#tipoModulo").val();
        let datatable = $('#tabla').DataTable({
            "language": {
                "url": "{{ asset('') }}lenguaje/Spanish.json"
            },
            "processing": true,
            "serverSide": true,
            "ajax": "{{ asset('') }}tablaDecisionTrae/"+entidad+"/"+fileSiaf+"/"+tipoModulo,
            columns: [
                {data: 'des_identificador', name: 'des_identificador'},
                {data: 'des_descripcion', name: 'des_descripcion'},
                {data: 'des_clasificador', name: 'des_clasificador'},
                {data: 'des_estado', name: 'des_estado'},
                {data: 'edita', name: 'edita'},
            ],
            columnDefs: [
                { "orderable": false, "targets": 4 },
            ],
        });
            editar("#tabla tbody",datatable);
            elimina("#tabla tbody",datatable);
        if(primeraVez == '1'){
            envioForumario("#tabla tbody",datatable);
        }

    }

    function nuevoFormulario(){
        $.ajax({
            type:"POST",
            url:"{{ asset('') }}tablaDecicionSave",
            data: $("#form-tabla-decision").serialize(),
            success:function(datos){
                $("#modalExportar").modal('hide');
                Swal.fire({
                    title: 'Se actualizó con éxito',
                    icon: 'success',
                });
                $('#tabla').empty();
                $('#tabla').dataTable().fnDestroy();
                armaTable('0');
            }
        });
    }

    function editaFormulario(tbody, table){
        let index = indexGlobal;
        let temp = dataGlobal;
        let token = $("input[name='_token']").val()
        let partida = $("#partida").val();
        let descripcion = $("#descripcion").val();
        let numCantidad = $("#numCantidad").val();
        let hastaET = $("#hastaET").val();
        let codDecision = $("#codDecision").val();
        let porcentaje = $("#porcentaje").val();
        let activo = $("#activo").val();
        let decisionRadio =  $('input:radio[name=decisionRadio]:checked').val();
        temp.des_descripcion = descripcion;
        temp.des_estado = activo;
        temp.des_clasificador = partida;
        temp.des_descripcion = descripcion;
        temp.des_cantidad_registros= numCantidad;
        temp.des_hasta_et = hastaET;
        temp.des_hasta_porcentaje_et = porcentaje;
        $.ajax({
            type:"POST",
            url:"{{ asset('') }}editaDecision",
            data:{
                _token: token,
                partida: partida,
                descripcion: descripcion,
                numCantidad: numCantidad,
                hastaET: hastaET,
                porcentaje: porcentaje,
                codDecision: codDecision,
                activo: activo,
                decisionRadio:decisionRadio
                },
            success:function(datos){
                $('#tabla').dataTable().fnUpdate(temp,index,undefined,false);
                $("#modalExportar").modal('hide');
                $("body").css("padding-right", "0px");
                Swal.fire({
                    title: 'Se actualizó con éxito',
                    icon: 'success',
                });

            }
        });
    }

    function elimina(tbody, table){
        $(tbody).on("click","button.elimina", function(){
            if(table.row(this).child.isShown()){
                var data = table.row(this).data();
            }else{
                var data = table.row($(this).parents("tr")).data();
            }

            Swal.fire({
                title: '¿Está seguro de eliminar?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Sí',
                cancelButtonText: 'No'
            }).then((result) => {
                if (result.value) {
                // Al confirmar que se desea eliminar
                window.location.href = '{{ asset('') }}deleteDecision/'+data.des_id+'/'+data.des_id_entidad;
                }
            })
        })
    }

    function traeMuestras(){
        let tipoModulo = $("#tipoModulo").val();
        $.ajax({
            type:"GET",
            url:"{{ asset('') }}traeArchivosMuestra/"+$("#entidad_maestro").val()+"/"+tipoModulo,
            success:function(data){
                $.each(data, function (i, items) {
                    $('#fileSiaf_maestro').html(items).fadeIn();
                    $('#fileSiaf').html(items).fadeIn();
                });
            }
        });

    }

    function acutalizaTabla(){

        let fileSiaf_maestro= $("#fileSiaf_maestro").val();

        $.ajax({
            type:"GET",
            url:"{{ asset('') }}traeErrorTolerable/"+fileSiaf_maestro,
            success:function(data){
                $.each(data, function (i, items) {
                    console.log(items.siaf_error_tolerable);
                    let errortole = '0';
                    $("#errorTole").val((items.siaf_error_tolerable != null && items.siaf_error_tolerable != undefined ? items.siaf_error_tolerable : '0'));
                });
            }
        });

        $('#tabla').empty();
        $('#tabla').dataTable().fnDestroy();
        armaTable('0');
    }

    window.onload=function() {

        armaTable('1');

        $('#entidad_maestro').change(function(){
            $('#tabla').empty();
            $('#tabla').dataTable().fnDestroy();
            armaTable('0');
        });

    }

</script>

@endsection