@extends('layouts.app')
<style>
    .estadoFisico{
       font-size: 12px;
       margin-bottom: 1px;
    }
    .ag-theme-alpine .ag-header-cell {
          height: 20px; /* Ajusta la altura del encabezado */
      }

      /* Ajusta el tamaño del texto en el encabezado */
      .ag-theme-alpine .ag-header-cell-label {
          font-size: 14px; /* Ajusta el tamaño de la fuente en el encabezado */
          line-height: 30px; /* Alinea verticalmente el texto según la altura */
      }

      /* Opcional: Ajusta el padding del encabezado */
      .ag-theme-alpine .ag-header-cell {
          padding: 0 0px 0px 10px; /* Ajusta el padding izquierdo y derecho del encabezado */
      }
        /* Ajusta la altura de las filas */
    .ag-theme-alpine .ag-row {
        height: 30px; /* Ajusta la altura de las filas */
    }

    /* Ajusta el tamaño de fuente dentro de las celdas */
    .ag-theme-alpine .ag-cell {
        font-size: 14px; /* Ajusta el tamaño de la fuente */
        display: flex;
        align-items: center; /* Centra verticalmente */
        justify-content: center; /* Centra horizontalmente */
        text-align: center; /* Centra el texto horizontalmente */
        padding: 0px; /* Opcional: Ajusta el padding si es necesario */
    }
   </style>
@section('content')
<input type="hidden" id="estadofisico" value="{{$estadoFisicos[0]->idestadofisico}}">
<input type="hidden" id="informaciones" value="{{$informaciones[0]->idinformacion}}">
<input type="hidden" id="anemia" value="{{$datosAnemia->idanemia}}">
<input type="hidden" id="hemograma" value="{{$hemograma[0]->idhemograma}}">
<input type="hidden" id="cinetica" value="{{$cinetica[0]->idcinetica}}">
<input type="hidden" id="idpaciente" value="{{$datosAnemia->idpaciente}}">
<div class="nk-content">
    <div class="container-fluid">
      <div class="nk-content-inner">
        <div class="nk-content-body">
          <div class="d-flex justify-content-center w-55">
            <div class="w-100 bd-highlight">
              <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="{{route('paginaPrevia',['dato1' => $datosAnemia->historial, 'dato2' => "consultas"])}}" class="btn btn-white btn-dim btn-outline-dark m-1">
                <em class="icon ni ni-arrow-left"></em><span>Retornar</span>
              </a>
            </div>
            <div class="bd-highlight">
              <a href="{{ route('anemiaPdf', ['dato' => $datosAnemia->idanemia]) }}" class="btn btn-white btn-dim btn-outline-dark m-1"><em class="icon ni ni-file-pdf"></em><span>PDF</span></a>
            </div>
            <!--<button type="button" class="btn btn-white btn-dim btn-outline-dark m-1" id="printButton" data-url="{{ route('printReceta', ['dato' => $datosAnemia->idanemia]) }}"><em class="icon ni ni-printer"></em><span>Imprimir</span></button>-->
            <iframe id="printFrame" name="printFrame" style="display:none;"></iframe>  
          </div>
          <div class="nk-block">
            <div class="row g-gs">
              <div class="col-xxl-12 col-sm-12">
                <div class="card border shadow-sm rounded-5 p-2">
                  <div class="nk-ecwg nk-ecwg6">
                    <div class="card-inner">
                      <div class="card-title-group">
                        <div class="card-title">
                            <h6 class="titulo"><em class="icon ni ni-user-alt"></em><span>PLAN DE TRATAMIENTO Y CONTROL PARA PACIENTES CON ANEMIA</span></h6>
                        </div>
                      </div>
                      <div class="container-fluid">
                        <div class="row justify-content-center">
                          <div class="col-12 col-md-6">
                            <table class="tabla1" style="width: 90%;margin-left:30px;padding-top:8px">
                                <tbody>
                                    <tr style="border-bottom: solid #b3b3b3 1px" >
                                        <th style="font-size: 14px;text-transform: uppercase;" align="left" colspan="2">{{$datosAnemia->nombre}} {{$datosAnemia->paterno}} {{$datosAnemia->materno}}</th>
                                        <th style="font-size: 14px" align="left">ID: {{$datosAnemia->historial}}</th>
                                    </tr>
                                    <tr>
                                        <td style="width: 30%;font-size: 12px;text-transform: uppercase;"><strong>Fecha de Nacimiento:</strong> {{$datosAnemia->nacimiento}}</td>
                                        <td style="width: 40%;font-size: 12px;text-transform: uppercase;"><strong>Edad:</strong> {{$datosAnemia->edad}}</td>
                                        <td style="width: 30%;font-size: 12px;text-transform: uppercase;"><strong>Medico:</strong> {{$datosAnemia->nombreMedico}} </td>
                                    </tr>
                                    <tr >
                                        <td style="font-size: 12px;text-transform: uppercase;"><strong>Sexo:</strong> {{$datosAnemia->sexo}}</td>
                                        <td style="font-size: 12px;text-transform: uppercase;"><strong>C.I.:</strong> {{$datosAnemia->ci}}</td>
                                        <td style="font-size: 13px;text-transform: uppercase;"><strong>Fecha de Control:</strong>{{$datosAnemia->fechaIngreso}}</td>
                                    </tr>
                                    <tr style="border-bottom: solid 1px #b3b3b3">
                                        <td style="font-size: 12px;text-transform: uppercase;"><strong>Alergias:</strong> {{$datosAnemia->alergia}}</td>
                                        <td style="font-size: 12px;text-transform: uppercase;"><strong>Diagnostico:</strong> {{$datosAnemia->diagnostico}}</td>
                                    </tr>
                                </tbody>
                            </table>
                            <div style="width: 90%;margin-left:30px;padding-top:8px">
                                <div class="d-flex bd-highlight">
                                    <div class="p-2 w-70 bd-highlight">
                                        <div class="mb-0">
                                            <label for="motivo" class="col-lg-5 col-form-label"><strong>Motivo de Consulta:</strong></label>
                                            <textarea type="text" class="form-control form-control-sm" id="motivo" name="motivo" data-group="informaciones" tabindex="1" disabled>{{$informaciones[0]->motivo}} </textarea>
                                          </div>
                                          <div class="mb-0">
                                            <label for="comorbo" class="col-lg-5 col-form-label"><strong>Comorbilidades:</strong></label>
                                            <input type="text" class="form-control form-control-sm" id="comorbo" name="comorbo" value="{{$informaciones[0]->comorbo}}" data-group="informaciones" tabindex="1" disabled>
                                          </div>
                                    </div>
                                    <div class="p-2 flex-shrink-1 bd-highlight">
                                      <table class="table table-sm table-borderless ">
                                        <thead>
                                          <tr>
            
                                          </tr>
                                        </thead>
                                        <tbody>
                                          <tr>
                                            <td class="estadoFisico"><strong>Peso:</strong></td>
                                            <td><input type="text" class="datoHemoEstado" name="peso" id="peso" value="{{$estadoFisicos[0]->peso}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico" >Kg</td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>Sat O2:</strong></td>
                                            <td><input type="text" class="datoHemoEstado" name="sat" id="sat" value="{{$estadoFisicos[0]->sat}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico">%</td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>PA:</strong</td>
                                            <td><input type="text" class="datoHemoEstado" name="pa" id="pa" value="{{$estadoFisicos[0]->pa}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico">MmHg</td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>FC:</strong</td>
                                            <td><input type="text" class="datoHemoEstado" name="fc" id="fc" value="{{$estadoFisicos[0]->fc}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico">Lat/min</td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>FR:</strong</td>
                                            <td><input type="text" class="datoHemoEstado" name="fr" id="fr" value="{{$estadoFisicos[0]->fr}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico">Resp/min</td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>T°:</strong</td>
                                            <td><input type="text" class="datoHemoEstado" name="temp" id="temp" value="{{$estadoFisicos[0]->temp}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico">°C</td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>PS:</strong</td>
                                            <td><input type="text" class="datoHemoEstado" name="ps" id="ps" value="{{$estadoFisicos[0]->ps}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico"></td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>IMC:</strong</td>
                                            <td><input type="text" class="datoHemoEstado" name="imc" id="imc" value="{{$estadoFisicos[0]->imc}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico"></td>
                                          </tr>
                                          <tr>
                                            <td class="estadoFisico"><strong>SC:</strong</td>
                                            <td><input type="text" class="datoHemoEstado" name="sc" id="sc" value="{{$estadoFisicos[0]->sc}}" autocomplete="off" data-group="estadoFisico" tabindex="2" disabled></td>
                                            <td class="estadoFisico"></td>
                                          </tr>
                                        </tbody>
                                      </table>
                                    </div>
                                </div>
                              <div class="mb-0">
                                <label for="antecedentes" class="col-lg-5 col-form-label"><strong>Antecedentes:</strong></label>
                                <textarea type="text" class="form-control form-control-sm" id="antecedentes" name="antecedentes" data-group="informaciones" tabindex="1" disabled>{{$informaciones[0]->antecedentes}}</textarea>
                              </div>
                              <div class="mb-0">
                                <label for="objetivo" class="col-lg-5 col-form-label"><strong>Examen Objetivo:</strong></label>
                                <input type="text" class="form-control form-control-sm" id="objetivo" name="objetivo" value="{{$informaciones[0]->objetivo}}" data-group="informaciones" tabindex="1" disabled>
                              </div>
                              <div class="mb-0">
                                <label for="antecedentes" class="col-lg-5 col-form-label"><strong>Conclusión:</strong></label>
                                <textarea type="text" class="form-control form-control-sm" style="height: 50px;" id="conclusion" name="conclusion" data-group="informaciones" tabindex="1" disabled>{{$informaciones[0]->conclusion}}</textarea>
                              </div>
                              <div class="mb-0">
                                <label for="antecedentes" class="col-lg-5 col-form-label"><strong>Tratamiento:</strong></label>
                                <textarea type="text" class="form-control form-control-sm" id="tratamiento" name="tratamiento" data-group="informaciones" tabindex="1" disabled>{{$informaciones[0]->tratamiento}}</textarea>
                              </div>
                              <div class="row mt-1">
                                <div class="col-lg-8">
                                  <div class="mb-3 row">
                                    <label for="fechaProximo" class="col-lg-5 col-form-label"><strong>Proximo control en Fecha:</strong></label>
                                    <div class="col-lg-7">
                                      <input type="date" class="form-control form-control-sm" name="fechaProximo" id="fechaProximo" value="{{ $datosAnemia->fechaProximo }}" data-group="anemias" tabindex="1" disabled>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                          <div class="col-12 col-md-6">
                            <div class="row p-1 text-center" style="border-bottom: solid 1px #b3b3b3;min-height: 170px">
                              <div class="col-6 col-md-3">
                                <table class="table table-sm">
                                  <thead>
                                    <tr>
                                      <th scope="col" colspan="3" class="text-center">Serie Roja</th>
                                    </tr>
                                  </thead>
                                  <tbody style="font-size: 14px">
                                    @foreach ($hemograma as $item)
                                        @if ($item->tipo==="Serie Roja")
                                        <tr>
                                            <td><input type="hidden" name="parametro[]" value="{{$item->parametro}}">{{$item->parametro}}</td>
                                            <td><input type="text" class="datoHemo" name="resultado[]" id="{{$item->idhemograma}}" value="{{$item->resultado}}" data-group="hemograma" autocomplete="off" tabindex="3" disabled></td>
                                            <td class=""><input type="hidden" name="unidad[]" value="{{$item->unidad}}">{{$item->unidad}}</td>
                                          </tr>
                                        @endif
                                    @endforeach
                                  </tbody>
                                </table>
                              </div>
                              <div class="col-6 col-md-3">
                                <table class="table table-sm">
                                  <thead>
                                    <tr>
                                    
                                      <th scope="col" colspan="3" class="text-center">Serie Blanca</th>
                                    </tr>
                                  </thead>
                                  <tbody style="font-size: 14px">
                                    @foreach ($hemograma as $item)
                                        @if ($item->tipo==="Serie Blanca")
                                        <tr>
                                          
                                            <td><input type="hidden" name="parametro[]" value="{{$item->parametro}}">{{$item->parametro}}</td>
                                            <td><input type="text" class="datoHemo" name="resultado[]" id="{{$item->idhemograma}}" value="{{$item->resultado}}" data-group="hemograma" autocomplete="off" tabindex="3" disabled></td>
                                            <td class=""><input type="hidden" name="unidad[]" value="{{$item->unidad}}">{{$item->unidad}}</td>
                                          </tr>
                                        @endif
                                    @endforeach
                                  </tbody>
                                </table>
                              </div>
                              <div class="col-6 col-md-3">
                                <table class="table table-sm">
                                  <thead>
                                    <tr>
                                     
                                      <th scope="col" colspan="3" class="text-center">Plaquetas</th>
                                    </tr>
                                  </thead>
                                  <tbody style="font-size: 14px">
                                    @foreach ($hemograma as $item)
                                        @if ($item->tipo==="Plaquetas")
                                        <tr>
                                            
                                            <td><input type="hidden" name="parametro[]" value="{{$item->parametro}}" >{{$item->parametro}}</td>
                                            <td><input type="text" class="datoHemo" name="resultado[]" id="{{$item->idhemograma}}" value="{{$item->resultado}}" data-group="hemograma" autocomplete="off" tabindex="3" disabled></td>
                                            <td class=""><input type="hidden" name="unidad[]" value="{{$item->unidad}}">{{$item->unidad}}</td>
                                          </tr>
                                        @endif
                                    @endforeach
                                  </tbody>
                                </table>
                                
                              </div>
                              <div class="col-6 col-md-3">
                                <table class="table table-sm">
                                  <thead>
                                    <tr>
                                    
                                      <th scope="col" colspan="2" class="text-center">Cinetica de Hierro</th>
                                    </tr>
                                  </thead>
                                  <tbody style="font-size: 15px">
                                    @foreach ($cinetica as $item)
                                    <tr>
                                       
                                        <td><input type="hidden" name="parametroCinetica[]" value="{{$item->parametro}}">{{$item->parametro}}</td>
                                        <td><input type="text" class="datoHemo" name="resultadoCinetica[]" id="{{$item->idcinetica}}" value="{{$item->resultado}}" data-group="cinetica" autocomplete="off" tabindex="3" disabled></td>
                                      </tr>  
                                    @endforeach
                                  </tbody>
                                </table>
                              </div>  
                            </div>
                            <div id="tablaHistorialAnemia" style="height: 300px; width: 100%; margin-top:5px" class="ag-theme-alpine"></div>
                          </div>
                        </div>
                      </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
</div>
</div>
@section('js1')
<script src="{{asset("js/modulos/historialAnemia.js")}}"></script>
<script>

$('#printButton').on('click', function() {
            var url = $(this).data('url');
            $('#printFrame').attr('src', url);
        });
        
        $('#printFrame').on('load', function() {
            this.contentWindow.focus();
            this.contentWindow.print();
        });
$('#printButtonU').on('click', function() {
            var url = $(this).data('url');
            $('#printFrame').attr('src', url);
        });

        $('#printFrame').on('load', function() {
            this.contentWindow.focus();
            this.contentWindow.print();
        });

function guardarEdicion() {
  location.reload();
}

$(document).ready(function() {
    $('body').on('click', 'input, textarea', function() {
        var $element = $(this);
        var campo = $element.attr('id');
        var grupo = $element.data('group');
        console.log(grupo,campo)
        $element.on('keyup', function() {
            var valor = $element.val();
            var idvalor;
            console.log(valor,idvalor)
            if (grupo === "estadoFisico") {
                idvalor = $('#estadofisico').val();
            } else if (grupo === "informaciones") {
                idvalor = $('#informaciones').val();
            } else if (grupo === "anemias"){
                idvalor = $('#anemia').val();
            } else if(grupo==="hemograma"){
               idvalor=$('#hemograma').val()
            } else if(grupo==="cinetica"){
              idvalor=$('#cinetica').val()
            } else {
                return; // Salir si el grupo no coincide
            }

            $.ajax({
                type: "POST",
                url: "../editarCampoAnemia/"+idvalor,
                data: {
                    campo: campo,
                    valor: valor,
                    idvalor: idvalor,
                    grupo: grupo
                },
                headers: {
                    "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content")
                },
                success: function(response) {
                },
                error: function(error) {
                    console.error(error);
                }
            });
        });
    });
});

$(document).ready(function() {
    $('body').on('focus', 'input, textarea', function() {
        var $element = $(this);
        var campo = $element.attr('id');
        var grupo = $element.data('group');
        console.log(grupo,campo)
        $element.on('keyup', function() {
            var valor = $element.val();
            var idvalor;
            console.log(valor,idvalor)
            if (grupo === "estadoFisico") {
                idvalor = $('#estadofisico').val();
            } else if (grupo === "informaciones") {
                idvalor = $('#informaciones').val();
            } else if (grupo === "anemias"){
                idvalor = $('#anemia').val();
            } else if(grupo==="hemograma"){
               idvalor=$('#hemograma').val()
            } else if(grupo==="cinetica"){
              idvalor=$('#cinetica').val()
            } else {
                return; // Salir si el grupo no coincide
            }

            $.ajax({
                type: "POST",
                url: "../editarCampoAnemia/"+idvalor,
                data: {
                    campo: campo,
                    valor: valor,
                    idvalor: idvalor,
                    grupo: grupo
                },
                headers: {
                    "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content")
                },
                success: function(response) {
                },
                error: function(error) {
                    console.error(error);
                }
            });
        });
    });
});
</script>
@endsection
@endsection