@extends('layouts.app')
@section('content')
<div class="nk-content">
    <div class="container-fluid">
      <div class="nk-content-inner">
        <div class="nk-content-body">
          <div class="nk-block">
            <a href="{{route('dashboard')}}" class="btn btn-white btn-dim btn-outline-dark m-1">
                <em class="icon ni ni-home"></em><span>Home</span>
              </a>
              <a href="{{URL::previous()}}" class="btn btn-white btn-dim btn-outline-dark m-1">
                <em class="icon ni ni-arrow-left"></em><span>Retornar</span>
              </a>
            <div class="row g-gs">
                <input type="hidden" value="{{Auth::user()->id}}" id="idusuario">
              <div class="col-xxl-12 col-sm-12">
                <div class="card">
                  <div class="nk-ecwg nk-ecwg6">
                    <div class="card-inner p-0">
                      <div class="card-title-group">
                        <div class="card-title">
                            <h6 class="titulo"><em class="icon ni ni-user-alt"></em><span>HISTORIAL DE PACIENTES</span></h6>
                        </div>
                      </div>
                      <div class="card-body p-0">
                        <div class="row g-3">
                            <div class="col-12 col-lg-10">
                                <div id="miTabla" style="height: 600px; width:100%;" class="ag-theme-alpine"></div>
                            </div>                             
                            <div class="col-12 col-lg-2">
                                <div class="card-inner">
                                    <div class="row gy-4">
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="form-label">Fecha Inicial</label>
                                                <div class="form-control-wrap focused">
                                                    <input type="date" class="form-control" id="fechaInicial">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="form-label">Fecha Final</label>
                                                <div class="form-control-wrap focused">
                                                    <input type="date" class="form-control" id="fechaFinal">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-sm-1 text-center">
                                            <a href="#" class="btn btn-outline-secondary" onclick="generarDatos()">Buscar</a>
                                        </div>
                                        <hr>
                                        <div class="col-sm-12">
                                            <div class="form-group">
                                                <label class="form-label" for="default-01">
                                                    Px
                                                </label>
                                                <div class="form-control-wrap">
                                                    <input type="text" class="form-control" id="px"  disabled>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-sm-6">
                                            <div class="form-group">
                                                <label class="form-label" for="default-01">
                                                    S.S.U.
                                                </label>
                                                <div class="form-control-wrap">
                                                    <input type="text" class="form-control" id="ssu" disabled>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-sm-6">
                                            <div class="form-group">
                                                <label class="form-label" for="default-01">
                                                    Particular
                                                </label>
                                                <div class="form-control-wrap">
                                                    <input type="text" class="form-control" id="particular" disabled>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="bd-highlight"><button type="button" class="btn btn-white btn-dim btn-outline-dark m-1" onclick="generarexcel()"><em class="icon ni ni-file-xls"></em><span>Generar Excel</span></button></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
</div>
</div>
@section('js1')
<script src="{{asset("js/modulos/informePacientes.js")}}"></script>
<script>
function generarDatos(){
    var fechaInicial = $("#fechaInicial").val();
    var fechaFinal = $("#fechaFinal").val();
    $.ajax({
        type: "GET",
        url: "./obtenerEstadisticaInformes/",
        data: {
            fechaInicial: fechaInicial,
            fechaFinal: fechaFinal,
        },
        dataType: "json",
        success: function (response) {
            console.log(response)
            $('#px').val(response.cantidadParticular+response.cantidadUniversidad);
            $('#particular').val(response.cantidadParticular);
            $('#ssu').val(response.cantidadUniversidad);

        },
        error: function (error) {},
        });
}

function generarexcel() {
    var fechaInicial = $("#fechaInicial").val();
    var fechaFinal = $("#fechaFinal").val();
    var px = $("#px").val();
    
    $.ajax({
        type: "GET",
        url: "./obtenerExcel",
        data: {
            fechaInicial: fechaInicial,
            fechaFinal: fechaFinal,
        },
        xhrFields: {
            responseType: 'blob' // Solicitar respuesta como Blob
        },
        success: function(response, status, xhr) {
            console.log(px)
            // Crear un objeto Blob a partir de la respuesta
            var blob = new Blob([response], { type: xhr.getResponseHeader('Content-Type') });
            
            // Crear un enlace de descarga
            var url = window.URL.createObjectURL(blob);
            var a = document.createElement('a');
            a.style.display = 'none';
            a.href = url;
            a.download = 'Lista de '+px+' muestras de '+fechaInicial+' a '+fechaFinal+'.xlsx'; // Nombre del archivo
            document.body.appendChild(a);
            a.click();
            window.URL.revokeObjectURL(url);
        },
        error: function(error) {
            console.error('Error al generar el archivo Excel:', error);
        }
    });
}

</script>
@endsection
@endsection