@include('header')
@if ($cliente == null)
@include('navigator_clientes')
@endif 
<style>
.fancy-theme-my .fancy-grid-cell {
  color: #626262;
}
.rojo {
        background-color: #fc9e79;
    }
.letrarojo {
        color: #fc9e79;
    }
  
</style>
<section> 
    <div class="container-fluid col-sm-10">
        <input type="radio" name="activoinactivo" class="activoinactivo activo">
        <label class="letra-10">Activos</label>&nbsp;&nbsp;&nbsp;
        <input type="radio" name="activoinactivo" class="activoinactivo inactivo">    
        <label class="letra-10">Inactivos</label>&nbsp;&nbsp;&nbsp;
        <input type="radio" name="activoinactivo" class="activoinactivo vencido">    
        <label class="letra-10">Vencidos</label>&nbsp;&nbsp;&nbsp;
    </div>
    <div class="col-sm-2 text-right">
        @if ($cliente == null)
        <a href="/administracion-clientes?ruta=panel_de_administracion">
        <button type="button" class="btn btn-primary btn-fidelitas">Nuevo Registro de Apikey</button>
        </a>
        @endif 
    </div>

</section> 
<section>
    <div class="container-fluid">
        <!-- <div style="padding-bottom:10px;">
        <button class="btn btn-primary" id="crear_fila">Crear Fila</button>
        </div> -->
        <div id="result"></div>
    </div>
</section>
<!-- -->
<form id="formulario_modal_ver_historial">
    <input type="hidden" id="token_historial" value="{{ csrf_token() }}">
    <input type="hidden" id="client_id">
    <input type="hidden" id="nombre_del_cliente">
    <input type="hidden" id="id_producto">
    <input type="hidden" id="nombre_del_producto"> 
</form>
<!-- -->
<form id="formulario_descargar_documentacion">
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
    <input type="hidden" name="indicador_de_documentacion">
    <input type="hidden" name="producto_id">
</form> 
<!-- -->
<section id="cargar_documentacion">

</section>
<!-- -->

<section id="mostrar_historial">
 
</section>

<section id="generar_token">

</section>

<section id="mostrar_modal_topes">
</section>

<script type ="text/javascript" src="{{ URL::asset('js/controlar_api/funciones.js') }}"></script>
<script>
    $(document).ready( function () {
        $(".activo").prop('checked',true);

        var data = [{ "cli_codigo":"API1" , "Descripcion":"Padron Basica" , "Cliente":"Mati" , "activa":"Si", "toped":"10.000","consumod":"7.300","topem":"250.000","consumom":"138.700","topea":"3.000.000","consumoa":"762.850","Topeus":"Si","Usuarios":"manger@mati.com","Topemensualfinal":"1.000.000","Topeanualfinal":"12.000.000","vigencia":"01/01/2022"}];
        var data1 = <?php echo($contenido); ?>;
        // console.log(data1)
        // console.log(typeof(JSON.stringify(data1)));
        FancyGrid_PanelDeAdministracion(data1,'ACTIVO');
        // $('#fancy-gen-73 > .fancy-field-text > .fancy-combo-input-container > .fancy-field-text-input').click();
        // $('#fancy-gen-88').click();
        // FancyGrid_Prueba(data1);
        modificar_tope_panel();
        ver_historial_consumos();
        descargar_documentacion_comercial();
    });

    $(document).on('change',".activoinactivo",function(e){
        e.preventDefault();
        if($('.activo').prop('checked')) {
            var estado = 'ACTIVO'; 
        }
        if($('.inactivo').prop('checked')) {
            var estado = 'INACTIVO'; 
        }
        if($('.vencido').prop('checked')) {
            var estado = 'VENCIDO'; 
        }
        $("#result").html(""); 
        var data1 = <?php echo($contenido); ?>;
        FancyGrid_PanelDeAdministracion(data1,estado);
        modificar_tope_panel();
        ver_historial_consumos();
        descargar_documentacion_comercial();
    });


</script>

@include('footer')