@extends('layout.master')
@section('parentPageTitle', 'Listado cuentas validar')
@section('title', 'Listado cuentas validar')


@section('page-style')
<link rel="stylesheet" href="{{asset('assets/plugins/jquery-datatable/dataTables.bootstrap4.min.css')}}">
<link rel="stylesheet" href="{{asset('assets/jquery-ui.css')}}">
<link rel="stylesheet" href="{{asset('assets/bootstrap.min.css')}}">
@stop

@section('content')


<meta name="csrf-token" content="{{ csrf_token() }}">

    <div class="row clearfix">
        
        <!--<div class="col-md-1"></div>
        <div class="col-md-1"></div>
        <div class="col-md-1"></div>
        
        <div class="col-sm-8 col-sm-8 col-sm-8">-->
        <div class="col-md-12 d-flex justify-content-center"> 
            <div class="card patients-list">
                

                <div class="body">
                    <!-- Nav tabs -->

                    <div class="navbar-header d-flex justify-content-left align-items-left ml-0 p-0" align="left">
                        <big style="color: black;font-size: 25px;"class="">@yield('title')</big>
                    </div>

                    <!-- Tab panes -->
                    <div class="tab-content m-t-10">
                        <div class="tab-pane table-responsive active" id="All">
                            <table class="table m-b-0 table-hover" id="tabla1" name="tabla1" style="width:100%;">
                                <thead>
                                    <tr class="ui-widget-header">                                       
                                        <th>Rut</th>
                                        <th>Nombre empresa</th>
                                        <th>Plan</th>
                                        <th>Tipo</th>
                                        <th>Contenido</th>
                                        <th>Revision</th>
                                    </tr>
                                </thead>
                                
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div id="dialog_alerta" title="{{config('maestro.nombresistema')}}" align="center">
        <p id="dialog_texto"></p>
    </div> 

    <!-- DIALOGO CONTENIDO -->
    <div id="dialog-mostrarcontenido" title="Detalle contenido">
        <form>
            <br>
            <div class="row" id="divmostrarcontenido" name="divmostrarcontenido">

                <input type="hidden" id="tiporegoculto" name=" tiporegoculto" class="form-control" value="">

                <!-- Columna de foto (derecha) -->
                <div class="col-sm-4 d-flex justify-content-end align-items-start" style="margin-left:-30rem;" >
                    <img id="previzualizarfotomostrarcontenido" class="img-circle" src="" width="100" height="100" alt="">
                </div>
                <!-- Columna de campos (izquierda) -->
                <div class="col-sm-10">
                    <!-- Aquí van todas las filas de campos -->
                    <div class="row clearfix">
                        <div class="col-sm-2">
                            <div class="d-flex justify-content-left align-items-left ml-0 p-1">Rut</div>
                        </div>
                        <div class="col-sm-4">
                            <div class="form-group">
                                <input type="text" id="rutmostrarcontenido" name="rutmostrarcontenido" class="form-control" autocomplete="off" required disabled>
                            </div>
                        </div>
                        <div class="col-sm-2">
                            <div class="d-flex justify-content-left align-items-left ml-0 p-1">Nombre Clínica o Profesional</div>
                        </div>
                        <div class="col-sm-4">
                            <div class="form-group">
                                <input type="text" id="nombremostrarcontenido" name="nombremostrarcontenido" class="form-control" autocomplete="off" required disabled>
                            </div>
                        </div>
                    </div>
                    
                    <div class="row clearfix">

                        <div class="col-sm-2">                                
                        <div class="d-flex justify-content-left align-items-left ml-0 p-1">
                            Teléfono contacto
                        </div>
                        </div>

                        <div class="col-sm-4">
                        <div class="form-group">
                            <input type="text" id="telefonomostrarcontenido" name="telefonomostrarcontenido" class="form-control" autocomplete="off" required placeholder="" maxlength="" value="" disabled="">
                        </div>
                        </div>

                        <div class="col-sm-2">                                
                        <div class="d-flex justify-content-left align-items-left ml-0 p-1">
                            Email contacto
                        </div>
                        </div>

                        <div class="col-sm-4">
                        <div class="form-group">
                            <input type="text" id="emailmostrarcontenido" name="emailmostrarcontenido" class="form-control" autocomplete="off" required placeholder="" maxlength="" value="" disabled="">
                        </div>
                        </div>

                    </div>

                    <div class="row clearfix">

                        <div class="col-sm-2">                                
                        <div class="d-flex justify-content-left align-items-left ml-0 p-1">
                            Dirección
                        </div>
                        </div>

                        <div class="col-sm-4">
                        <div class="form-group">
                            <input type="text" id="direccionmostrarcontenido" name="direccionmostrarcontenido" class="form-control" autocomplete="off" required placeholder="" maxlength="" value="" disabled="">
                        </div>
                        </div>

                        <div class="col-sm-2">                                
                        <div class="d-flex justify-content-left align-items-left ml-0 p-1">
                            Comuna
                        </div>
                        </div>

                        <div class="col-sm-4">
                        <div class="form-group">
                            <input type="text" id="comunamostrarcontenido" name="comunamostrarcontenido" class="form-control" autocomplete="off" required placeholder="" maxlength="" value="" disabled="">
                        </div>
                        </div> 

                    </div>

                    <div class="row clearfix">

                        <div class="col-sm-2">                                
                        <div class="d-flex justify-content-left align-items-left ml-0 p-1">
                            Tipo cuenta
                        </div>
                        </div>

                        <div class="col-sm-4">
                        <div class="form-group">
                            <input type="text" id="tipocuentanmostrarcontenido" name="tipocuentanmostrarcontenido" class="form-control" autocomplete="off" required placeholder="" maxlength="" value="" disabled="">
                        </div>
                        </div>

                        <div class="col-sm-2">                                
                        <div class="d-flex justify-content-left align-items-left ml-0 p-1">
                            Link agendamiento
                        </div>
                        </div>

                        <div class="col-sm-4">
                        <div class="form-group">
                            <input type="text" id="linkagendamostrarcontenido" name="linkagendamostrarcontenido" class="form-control" autocomplete="off" required placeholder="" maxlength="" value="" disabled="">
                        </div>
                        </div> 

                    </div>

                    <h4 id="" name="" style="margin-top:3rem;" align="center">&nbsp;&nbsp;&nbsp;&nbsp;Listado de especialidad</h4>

                    <div id="divtablaespecialidad" name="divtablaespecialidad" class="tab-content m-t-10">
                        <div class="tab-pane table-responsive active" id="All">
                            <table class="table m-b-0 table-hover" id="especialidadamostrarcontenido" name="especialidadamostrarcontenido" style="width:100%;">
                                <thead>
                                    <tr class="ui-widget-header">         
                                        <th>Especialidad</th>
                                        </tr>
                                </thead>

                                <tbody>
                                        
                                </tbody>  
                                
                            </table>
                        </div>
                    </div>

                    <!-- Botones -->
                    <div class="row clearfix" align="center">
                        <div class="col-sm-12">
                            <button style="border-color:#18ce0f; color:#18ce0f;" type="button" class="btn btn-default btn-round btn-simple" id="btnconfirmarrevision" name="btnconfirmarrevision">Aprobar revisión</button>
                            <button style="border-color:#FF3636; color:#FF3636;" type="button" id="btnnegarrevision" name="btnnegarrevision" class="btn btn-default btn-round btn-simple">Rechazar revisión</button>
                            <button style="border-color:#FF3636; color:#FF3636;" type="button" id="btncancelarrevision" class="btn btn-default btn-round btn-simple">Cancelar</button>
                        </div>
                    </div>
                </div>

            </div>
        </form>
    </div>
@stop

@section('page-script')
<script src="{{asset('assets/bundles/datatablescripts.bundle.js')}}"></script>
<script src="{{asset('assets/jquery-ui.js')}}"></script>

<script>

    var lenguaje = {
        "lengthMenu": "Listar _MENU_ ",
        "zeroRecords": "A煤n no tiene registros",
        "info": "P&aacute;gina _PAGE_ de _PAGES_",
        "infoEmpty": "",
        "Search": "Buscar",
        "infoFiltered": "(filtered from _MAX_ total records)",
        "search": "Buscar",
        "zeroRecords": "Sin resultados encontrados",
        "paginate": {
            "first": "Primero",
            "last": "Ultimo",
            "next": "Siguiente",
            "previous": "Anterior"
        }
    }

var listarcuentasvalidar = function(){

    var eliminartabla = jQuery('#tabla1').dataTable().fnDestroy();
    var recargartabla = jQuery('#tabla1').dataTable( {

    ajax: {
            url:'{{route('validarcuentas.listarcuentasvalidar')}}',
            dataSrc: ""
        },
        columns: [
            
            {
                name: 'rut',
                data: 'rut'
            },

            {
                name: 'nombreempresa',
                data: 'nombreempresa'
            },

            {
                name: 'tipocuenta',
                data: 'tipocuenta'
            },
            
            {   
                className: 'text-left',
                data:'rut',
                
                render: function (data,type,row) {
                    
                    var identificador= row.id;

                    var boton = '<center> <span class="zmdi zmdi-plus-circle" onclick="mostrarcontenidocuentas('+identificador+')" style="color:#FF4500;cursor:pointer;><span class=""></span> </center>'

                    return ''+boton+''; 

                }
            },
            
            {   
                className: 'text-left',
                data:'rut',
                
                render: function (data,type,row) {
                   
                    var estado= row.revision; 

                    if (estado == "PENDIENTE"){

                      var boton = '<a href="#" id="'+data+'" name="'+data+'" class="tag badge badge-suc" style="border-color:#FFA500; color:#FFA500;pointer-events:none; cursor:default;">Pendiente</a>'

                    }

                    if ((estado == "APROBADA")||(estado == null)){
                      
                      var boton = '<a href="#" id="'+data+'" name="'+data+'" class="tag badge badge-default" style="border-color:#18ce0f;color:#18ce0f;pointer-events:none; cursor:default;">Aprobada</a>'

                    }

                     if (estado == "NEGADA"){

                      var boton = '<a href="#" id="'+data+'" name="'+data+'" class="tag badge badge-suc" style="border-color:#FF3636; color:#FF3636;pointer-events:none; cursor:default;">Negada</a>'  

                    }

                    //alert(boton);

                    return ''+boton+'';  
                }
            }
       
        ],
        "columnDefs": [
             
           // { "orderable": false, "targets": 6},

             
        ],
        "aaSorting": [],
        language : lenguaje
  }); 
  
}


function listarcuentasvalidarindex() {

    var route = "{{route('validarcuentas.listarcuentasvalidarindex')}}";

    var recargartablatotal = jQuery('#tabla1').dataTable({
        
        //"aoColumnDefs": [{ "bVisible": false, "aTargets": [0] }],
        "ajax": {
            method:'post',
            url: route,
            headers:{
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            "data": function(data) {

            }
        },
        
        columns: [
            
            {
                name: 'rut',
                data: 'rut'
            },

            {
                name: 'nombreempresa',
                data: 'nombreempresa'
            },

            /*{   
                className: 'text-left',
                data:'nombreplan',
                
                render: function (data,type,row) {
                    
                    var nombreplan= row.nombreplan;

                    if(nombreplan==null){
                      var nombreplanlistado="CHILEPRAXIS";
                    }
                    else{
                      var nombreplanlistado= row.nombreplan;
                    }

                    return ''+nombreplanlistado+''; 

                }
            },*/

            {
                name: 'nombreplan',
                data: 'nombreplan'
            },

            {
                name: 'tipocuenta',
                data: 'tipocuenta'
            },

            {   
                className: 'text-left',
                data:'rut',
                
                render: function (data,type,row) {
                    
                    var identificador= row.id;

                    var boton = '<center> <span class="zmdi zmdi-plus-circle" onclick="mostrarcontenidocuentas('+identificador+')" style="color:#FF4500;cursor:pointer;><span class=""></span> </center>'

                    return ''+boton+''; 

                }
            },
            
            {   
                className: 'text-left',
                data:'rut',
                
                render: function (data,type,row) {
                   
                    var estado= row.revision; 

                    if (estado == "PENDIENTE"){

                      var boton = '<a href="#" id="'+data+'" name="'+data+'" class="tag badge badge-suc" style="border-color:#FFA500; color:#FFA500;pointer-events:none; cursor:default;">Pendiente</a>'

                    }

                    if ((estado == "APROBADA")||(estado == null)){
                      
                      var boton = '<a href="#" id="'+data+'" name="'+data+'" class="tag badge badge-default" style="border-color:#18ce0f;color:#18ce0f;pointer-events:none; cursor:default;">Aprobada</a>'

                    }

                     if (estado == "NEGADA"){

                      var boton = '<a href="#" id="'+data+'" name="'+data+'" class="tag badge badge-suc" style="border-color:#FF3636; color:#FF3636;pointer-events:none; cursor:default;">Negada</a>'  

                    }

                    //alert(boton);

                    return ''+boton+'';  
                }
            }
            
        ],

        "columnDefs": [
             
           // { "orderable": false, "targets": 6},
           
             
        ],

        "aaSorting": [],

        language: lenguaje

    });

}

var listarespecialidad = function(){

    var rut = $('#rutmostrarcontenido').val();
    var tiporeg= $('#tiporegoculto').val();

    var route = "{{route('validarcuentas.listarespecialidad')}}";

    var eliminartabla = jQuery('#especialidadamostrarcontenido').dataTable().fnDestroy();
    var recargartablatotal = jQuery('#especialidadamostrarcontenido').dataTable({

        //"bDestroy": 'true',
        //"responsive": 'true',
        //"aoColumnDefs": [{ "bVisible": false, "aTargets": [0,1] }],

        "ajax": {
            method:'post',
            url: route,

            headers:{
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            
            "data": { 
                rutempresa: rut,
                tiporeg: tiporeg
                 
            }
        },
        columns: [

            {
                name: 'nombreespecialidad',
                data: 'nombreespecialidad'
            },
  
        ],

        "columnDefs": [
             
            //{ "orderable": false, "targets": 8},
            //{ "orderable": false, "targets": 9},
            //{ "orderable": false, "targets": 4},
             
        ],

        "aaSorting": [],

        language: lenguaje
  }); 
  
}

function mostrarcontenidocuentas(id) {

    //alert("pase por aqui");
    var blanco="";

    $("#rutmostrarcontenido").val(blanco);
    $("#nombremostrarcontenido").val(blanco);
    $("#telefonomostrarcontenido").val(blanco);
    $("#emailmostrarcontenido").val(blanco);
    $("#direccionmostrarcontenido").val(blanco);
    $("#comunamostrarcontenido").val(blanco);
    $("#tipocuentanmostrarcontenido").val(blanco);
    $("#linkagendamostrarcontenido").val(blanco);

    $("#especialidadamostrarcontenido > tbody").html("");
    $("#especialidadamostrarcontenido > tfoot").html("");
    
    $('#dialog-mostrarcontenido').dialog({
      autoOpen: false,
      width: '85%', // Puedes ajustar este valor según tus necesidades
      height:'auto',
      open: function(event, ui) {
          /*$(event.target).parent().css({ 'position': 'fixed', 'top': '50%', 'left': '50%', 'transform': 'translate(-50%, -50%)' });*/
      },
      resizable: false
    });

    var token = $('meta[name="csrf-token"]').attr('content');
    
    var route = "obtenerdetallecuenta/" + id;

    $.get(route, function(data){

    })

    .done(function(data) {

        $("#rutmostrarcontenido").val(data.detallecuenta[0].rut);  
        $("#nombremostrarcontenido").val(data.detallecuenta[0].nombreempresa);
        $("#telefonomostrarcontenido").val(data.detallecuenta[0].telefono);
        $("#emailmostrarcontenido").val(data.detallecuenta[0].email);
        $("#direccionmostrarcontenido").val(data.detallecuenta[0].direccion);
        $("#comunamostrarcontenido").val(data.detallecuenta[0].nombrecomuna);
        $("#tiporegoculto").val(data.detallecuenta[0].tiporeg);
        if(data.detallecuenta[0].tipocuenta==1){
            $("#tipocuentanmostrarcontenido").val('Profesional independiente'.toUpperCase());
        }
        if(data.detallecuenta[0].tipocuenta==2){
            $("#tipocuentanmostrarcontenido").val('Centro multiprofesional'.toUpperCase());
        }
        
        $("#linkagendamostrarcontenido").val(data.detallecuenta[0].linkpropioagenda);

        $('#previzualizarfotomostrarcontenido').attr('src', '');
        $('#previzualizarfotomostrarcontenido').attr('src',data.rutalogoexpraxis);

        //alert(data.detallecuenta[0].revision);

        if(data.detallecuenta[0].revision=="PENDIENTE"){

            $("#btnconfirmarrevision").show();
            $("#btnnegarrevision").show();
            
        }

        if((data.detallecuenta[0].revision=="APROBADA")||(data.detallecuenta[0].revision==null)){

            $("#btnconfirmarrevision").hide();
            $("#btnnegarrevision").show();

        }

        if(data.detallecuenta[0].revision=="NEGADA"){

            $("#btnconfirmarrevision").show();
            $("#btnnegarrevision").hide();
            
        }

        listarespecialidad();
       
        
    })   

    .fail(function() {
           

    });

    $("#dialog-mostrarcontenido").dialog("open");
   
}

$("#btncancelarrevision").click(function(){
           
    $("#dialog-mostrarcontenido").dialog("close");
});

$("#btnconfirmarrevision").click(function(){

    var rut = $('#rutmostrarcontenido').val();
    var parametro="APROBAR";

    var token = $('meta[name="csrf-token"]').attr('content');

    $.ajax({

        type:'POST',            
        async:false,
        url:'actualizarrevision',
        data:{
            rut:rut,
            parametro:parametro
        },
        headers: {'X-CSRF-TOKEN': token},

        success:function(data){

            if (data.mensaje == 'revisionactualizada') {

                $("#dialog_texto").empty();
                $("#dialog_texto").append("La revisión se ha actualizado con exito");
                $("#dialog_alerta").dialog('open');
                setTimeout(function(){
                    //window.location.href = "listado";
                    listarcuentasvalidar();
                    $("#dialog-mostrarcontenido").dialog("close");
                    $("#dialog_alerta").dialog('close');
                },1500); 
                
            }

        }
    });   
           
});

$("#btnnegarrevision").click(function(){
           
    var rut = $('#rutmostrarcontenido').val();
    var parametro="NEGAR";

    var token = $('meta[name="csrf-token"]').attr('content');

    $.ajax({

        type:'POST',            
        async:false,
        url:'actualizarrevision',
        data:{
            rut:rut,
            parametro:parametro
        },
        headers: {'X-CSRF-TOKEN': token},

        success:function(data){

            if (data.mensaje == 'revisionactualizada') {

                $("#dialog_texto").empty();
                $("#dialog_texto").append("La revisión se ha actualizado con exito");
                $("#dialog_alerta").dialog('open');
                setTimeout(function(){
                    //window.location.href = "listado";
                    listarcuentasvalidar();
                    $("#dialog-mostrarcontenido").dialog("close");
                    $("#dialog_alerta").dialog('close');
                },1500); 
                
            }

        }
    });   
});


$(document).ready(function() {

    var user = "{{Auth::user()->id}}";

    listarcuentasvalidarindex();

    $("#dialog_alerta").dialog({ autoOpen: false });
    $("#dialog-mostrarcontenido").dialog({ autoOpen: false });
    
} );


</script>
@stop