
<?php

if($_SESSION["tipo_usuario"] == "Vendedor"){

  echo '<script>

    window.location = "inicio";

  </script>';

  return;

}

$fechaInicial = isset($_GET["fechaInicial"]) ? $_GET["fechaInicial"] : null;
$fechaFinal = isset($_GET["fechaFinal"]) ? $_GET["fechaFinal"] : null;

// Ahora pasamos estas fechas a todos los métodos
$atencionesDiarias = ControladorReportes::ctrSumaTotalAtenciones($fechaInicial, $fechaFinal);
$topDiagnosticos = ControladorReportes::ctrTopDiagnosticos($fechaInicial, $fechaFinal);
$detalle = ControladorReportes::ctrMostrarDetalleCompleto($fechaInicial, $fechaFinal);


// Formatear para Chart.js
$fechas = []; $totalesAtenciones = [];
foreach ($atencionesDiarias as $v) {
    $fechas[] = $v["fecha"];
    $totalesAtenciones[] = $v["total"];
}

$cie10Labels = []; $cie10Cantidades = [];
foreach ($topDiagnosticos as $v) {
    $cie10Labels[] = $v["codigo_cie10"];
    $cie10Cantidades[] = $v["total"];
}

// Si existen las fechas en la URL, las mostramos en el botón

?>

<?php if(isset($_GET["fechaInicial"])): ?>
    $('#daterange-btn span').html('<?php echo $_GET["fechaInicial"]." - ".$_GET["fechaFinal"]; ?>');
<?php endif; ?>



<div class="content-wrapper">
    <section class="content-header">
        <div class="container-fluid">
            <h1 class="text-navy"><i class="fas fa-chart-pie"></i> Reportes Estadísticos de Emergencia</h1>
        </div>
    </section>

    <section class="content">
        <div class="container-fluid">
            
            <div class="card card-outline card-primary shadow-sm mb-4">
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-4">
                            <label>Rango de Fecha:</label>
                            <button type="button" class="btn btn-default btn-block" id="daterange-btn">
                                <span><i class="far fa-calendar-alt"></i> Rango de fecha</span>
                                <i class="fas fa-caret-down"></i>
                            </button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-7">
                    <div class="card shadow">
                        <div class="card-header border-0">
                            <h3 class="card-title">Volumen de Atenciones Diarias</h3>
                        </div>
                        <div class="card-body">
                            <canvas id="graficoAtenciones" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%;"></canvas>
                        </div>
                    </div>
                </div>

                <div class="col-lg-5">
                    <div class="card shadow">
                        <div class="card-header border-0">
                            <h3 class="card-title">Top 5 Diagnósticos (CIE-10)</h3>
                        </div>
                        <div class="card-body text-center">
                            <canvas id="graficoDiagnosticos" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%;"></canvas>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card shadow mt-4">
                <div class="card-header bg-navy text-white">
                    <h3 class="card-title">Detalle de Atenciones para Exportación</h3>
                </div>
                <div class="card-body">
                   <table class="table table-bordered table-striped dt-reportes">
                        <thead>
                            <tr>
                                <th>Fecha</th>
                                <th>DNI</th>
                                <th>Paciente</th>
                                <th>HC</th>
                                <th>Diagnóstico</th>
                                <th>Tratamiento</th>
                                <th>Destino Final</th>
                                <th>Acción</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php
                            foreach ($detalle as $row) {
                                echo '<tr>
                                    <td>'.$row["fecha_ingreso"].'</td>
                                    <td>'.$row["dni"].'</td>
                                    <td>'.$row["paciente"].' '.$row["apellido"].'</td>
                                    <td><span class="badge badge-dark">'.$row["codigo_hc"].'</span></td>
    
                                    <td><span class="badge badge-info">'.$row["lista_diagnosticos"].'</span></td>
                                    
                                    <td>'.substr($row["medicamentos"], 0, 50).'...</td>
                                    <td class="text-uppercase">'.$row["destino_final"].'</td>
                                    <td style="text-align:center">
                            
                                        <div class="btn-group">
                                            <a href="extenciones/TCPDF/pdf/receta.php?idIngreso='.$row["id_ingreso"].'" target="_blank" class="btn btn-default btn-sm shadow-sm">
                                                <i class="fas fa-print text-primary"></i> Receta
                                            </a>
                                            <button class="btn btn-default btn-sm shadow-sm btnHistorialPaciente" 
                                                    idpaciente="'.$row["id_paciente"].'" 
                                                    nombrepaciente="'.$row["paciente"].' '.$row["apellido"].'" 
                                                    data-toggle="modal" 
                                                    data-target="#modalHistorialClinico">
                                                <i class="fas fa-history text-info"></i> Historial
                                            </button>';
                                             if (tienePermiso("CONSULTA MEDICA", "EDITAR")): 
                                            echo'<button class="btn btn-default btn-sm shadow-sm btnEditarConsulta" idIngreso="'.$row["id_ingreso"].'" data-toggle="modal" data-target="#modalEditarConsulta">
                                                <i class="fas fa-pencil-alt text-warning"></i>
                                            </button>';
                                             endif;

                                               echo'<a href="extenciones/TCPDF/pdf/atencion.php?idIngreso='.$row["id_ingreso"].'" target="_blank" class="btn btn-warning btn-sm" title="Imprimir Informe Médico">
                                                    <i class="fas fa-file-medical"></i>
                                                </a>';
                                            if (tienePermiso("CONSULTA MEDICA", "ELIMINAR")): 
                                            echo'<button class="btn btn-default btn-sm shadow-sm btnAnularConsulta" idIngreso="'.$row["id_ingreso"].'">
                                                <i class="fas fa-trash-alt text-danger"></i>
                                            </button>';
                                            endif;
                                                                                        
                                        echo'</div>

                                    </td>
                                </tr>';
                            }
                            ?>
                        </tbody>
                    </table>
                </div>
            </div>

        </div>
    </section>
</div>

<div id="modalHistorialClinico" class="modal fade" role="dialog">
  <div class="modal-dialog modal-lg">
    <div class="modal-content shadow-lg">
      
      <div class="modal-header bg-info text-white d-flex align-items-center">
        <h4 class="modal-title">
            <i class="fas fa-briefcase-medical mr-2"></i> 
            <span id="nombrePacienteModal"></span>
        </h4>
        
        <div id="espacioDni" class="ml-auto mr-3">
            </div>

        <button type="button" class="close text-white" data-dismiss="modal">&times;</button>
      </div>

      <div class="modal-body" style="background-color: #f4f6f9; max-height: 70vh; overflow-y: auto;">
        <div class="timeline" id="contenedorTimeline">
            </div>
      </div>

      <div class="modal-footer bg-light">
        <button type="button" class="btn btn-secondary shadow-sm" data-dismiss="modal">Cerrar</button>
      </div>

    </div>
  </div>
</div>

<div id="modalEditarConsulta" class="modal fade" role="dialog">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <form role="form" method="post">
        
        <div class="modal-header bg-warning">
          <h4 class="modal-title"><i class="fas fa-user-edit"></i> Editar Atención Médica Completa</h4>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>

        <div class="modal-body">
          <div class="box-body">

            <input type="hidden" name="idIngresoEditar" id="idIngresoEditar">

            <div class="row">
              
              <div class="col-md-6">
                <div class="form-group">
                  <label><i class="fas fa-comment-medical text-warning"></i> Anamnesis</label>
                  <textarea class="form-control" name="editarAnamnesis" id="editarAnamnesis" rows="4" required></textarea>
                </div>
              </div>

              <div class="col-md-6">
                <div class="form-group">
                  <label><i class="fas fa-stethoscope text-warning"></i> Examen Físico</label>
                  <textarea class="form-control" name="editarExamenFisico" id="editarExamenFisico" rows="4" required></textarea>
                </div>
              </div>

              <div class="col-md-12"><hr></div>

              <div class="col-md-4">
                <div class="form-group">
                  <label><i class="fas fa-search text-warning"></i> Código CIE-10</label>
                  <input type="text" class="form-control" name="editarCie10" id="editarCie10" required>
                </div>
              </div>

              <div class="col-md-8">
                <div class="form-group">
                  <label><i class="fas fa-map-marker-alt text-warning"></i> Destino Final</label>
                  <select class="form-control" name="editarDestino" id="editarDestino">
                    <option value="observacion">OBSERVACIÓN</option>
                    <option value="alta">ALTA MÉDICA</option>
                    <option value="deceso">DECESO</option>
                  </select>
                </div>
              </div>

              <div class="col-md-12"><hr></div>

              <div class="col-md-12">
                <div class="form-group">
                  <label><i class="fas fa-pills text-warning"></i> Medicamentos / Tratamiento</label>
                  <textarea class="form-control" name="editarTratamiento" id="editarTratamiento" rows="3" required></textarea>
                </div>
              </div>

              <div class="col-md-6">
                <div class="form-group">
                  <label><i class="fas fa-syringe text-warning"></i> Procedimientos</label>
                  <textarea class="form-control" name="editarProcedimientos" id="editarProcedimientos" rows="2"></textarea>
                </div>
              </div>

              <div class="col-md-6">
                <div class="form-group">
                  <label><i class="fas fa-clipboard-list text-warning"></i> Indicaciones</label>
                  <textarea class="form-control" name="editarIndicaciones" id="editarIndicaciones" rows="2"></textarea>
                </div>
              </div>

            </div>
          </div>
        </div>

        <div class="modal-footer">
          <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Cerrar</button>
          <button type="submit" class="btn btn-warning shadow"><i class="fas fa-save"></i> Actualizar Historia Clínica</button>
        </div>

        <?php
          $editar = new ControladorConsulta();
          $editar -> ctrEditarAtencion();
        ?>
      </form>
    </div>
  </div>
</div>

<script src="./vistas/js/reporte.js">

 
</script>

<script>
       var elemento = document.getElementById("almacen");
      elemento.className += " active";

      var elemento = document.getElementById("alma");
      elemento.className += " menu-open";
      
      var elemento = document.getElementById("reportes");
      elemento.className += " active";

      $(function () {
            // --- GRÁFICO DE BARRAS (ATENCIONES POR DÍA) ---
            var areaChartData = {
                labels: <?php echo json_encode($fechas); ?>,
                datasets: [{
                    label: 'Pacientes Atendidos',
                    backgroundColor: 'rgba(60,141,188,0.9)', // Color Primary
                    borderColor: 'rgba(60,141,188,0.8)',
                    data: <?php echo json_encode($totalesAtenciones); ?>
                }]
            };

            var barChartCanvas = $('#graficoAtenciones').get(0).getContext('2d');
            new Chart(barChartCanvas, {
                type: 'bar',
                data: areaChartData,
                options: {
                    responsive: true,
                    maintainAspectRatio: false,
                    scales: {
                                y: { // ANTES ERA yAxes: [{ ... }]
                                    beginAtZero: true
                                }
                            },
                            plugins: {
                                legend: {
                                    display: true
                                }
                            }
                }
            });

            // --- GRÁFICO CIRCULAR (TOP DIAGNÓSTICOS) ---
            var donutData = {
                labels: <?php echo json_encode($cie10Labels); ?>,
                datasets: [{
                    data: <?php echo json_encode($cie10Cantidades); ?>,
                    backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc'],
                }]
            };

            var pieChartCanvas = $('#graficoDiagnosticos').get(0).getContext('2d');
            new Chart(pieChartCanvas, {
                type: 'doughnut', // Estilo dona, más moderno
                data: donutData,
                options: { maintainAspectRatio: false, responsive: true }
            });
        });



</script>