@extends('plantilla.header')

@section('titulo')
   Solicitud de Lentes
@stop

@section('js')
<script type="text/javascript">
    $('input[name="carnet"]').on('click', function(event){
        var opcion = $(this);
        if (opcion.val() == 'SI') {
            $('#serialll').removeAttr('hidden','hidden');
            $('#codigooo').removeAttr('hidden','hidden');

            $('#serial').removeAttr('disabled','disabled');
            $('#codigo').removeAttr('disabled','disabled');
        }else{
            $('#serialll').attr('hidden','hidden');
            $('#codigooo').attr('hidden','hidden');

            $('#serial').attr('disabled','disabled');
            $('#codigo').attr('disabled','disabled');
        }
        
    });

    $('input[name="menor"]').on('click', function(event){
        var opcion = $(this);
        if (opcion.val() == 'SI') {
          $('#tmenor').removeAttr('hidden','hidden');
        }else{
          $('#tmenor').attr('hidden','hidden');
        }
        
    });

    $('input[name="trabaja"]').on('click', function(event){
        var opcion = $(this);
        if (opcion.val() == 'SI') {
          $('#dondee').removeAttr('hidden','hidden');
          $('#donde').removeAttr('disabled','disabled');
        }else{
          $('#dondee').attr('hidden','hidden');
          $('#donde').attr('disabled','disabled');
        }
        
    });

    $('input[name="venapp"]').on('click', function(event){
        var opcion = $(this);
        if (opcion.val() == 'SI') {
          $('#venappid').removeAttr('hidden','hidden');
          $('#nreporte').attr('required','required');
        }else{
          $('#venappid').attr('hidden','hidden');
          $('#nreporte').removeAttr('required','required');
        }
        
    });

    $( "#fecha1" ).change(function() {
        calcularEdad("fecha1", "edad1", true);
    });

    $( "#fecham" ).change(function() {
        calcularEdad("fecham", "edad2", true);
    });


    function calcularEdad(valor1, valor2, ooo){
        if (ooo) {
            var fecha = document.getElementById(valor1).value;
        } else {
            var fecha = valor1;
        }

        var values=fecha.split("-");

        var dia = values[2];
        var mes = values[1];
        var ano = values[0];

        var fecha_hoy = new Date();
        var ahora_ano = fecha_hoy.getYear();
        var ahora_mes = fecha_hoy.getMonth()+1;
        var ahora_dia = fecha_hoy.getDate();

        var edad = (ahora_ano + 1900) - ano;
        if ( ahora_mes < mes )
        {
            edad--;
        }
        if ((mes == ahora_mes) && (ahora_dia < dia))
        {
            edad--;
        }
        if (edad > 1900)
        {
            edad -= 1900;
        }

        var meses=0;
        if(ahora_mes>mes)
            meses=ahora_mes-mes;
        if(ahora_mes<mes)
            meses=12-(mes-ahora_mes);
        if(ahora_mes==mes && dia>ahora_dia)
            meses=11;

        var dias=0;
        if(ahora_dia>dia)
            dias=ahora_dia-dia;
        if(ahora_dia<dia)
        {
            ultimoDiaMes=new Date(ahora_ano, ahora_mes, 0);
            dias=ultimoDiaMes.getDate()-(dia-ahora_dia);
        }
        document.getElementsByName(valor2)[0].value = edad;
    }

    $("#tipo").change(function(event){
      var nacionalidad = $('#tipo').find(':selected').val();

      $('#nombrem').attr('readonly','readonly');
      $('#fecham').attr('readonly','readonly');

      $("#cedulam").val("");
      $("#nombrem").val("");
      $("#fecham").val("");
      $("#edad2").val("");

      if (nacionalidad == "SC") {
        $('#nnumeros').removeAttr('hidden','hidden');
        $('#hijos').removeAttr('disabled','disabled');
        $("#cedulam").val("{{$cedula}}");
        $('#cedulam').attr('readonly','readonly');

      } else {
        $('#nnumeros').attr('hidden','hidden');
        $('#hijos').attr('disabled','disabled');
        $('#cedulam').removeAttr('readonly','readonly');
      }
    });

    function buscarmenor() {
        $("#modal-load").modal({
            show: false,
            keyboard: false,
            backdrop: 'static'
        });

        $("#modal-load").modal("show");

        var tipo = document.getElementById("tipo").value;
        var cedulam = $("#cedulam").val();

        
        var ccc = "";
        var op = true;

        if (tipo == null || tipo == "" || cedulam == "") {
            $("#id_mensaje").empty();
            setTimeout(mensaje_load,500);
            $("#id_mensaje").append('<h3 class="h6 mb-4">Debes de colocar la nacionalidad / cédula</h3>');

            $("#modal-mensaje").modal({
                show: false,
                keyboard: false,
                backdrop: 'static'
            });

            $("#modal-mensaje").modal("show");
        } else {
            var hijos = -1;

            if (tipo == "SC") {
                hijos = document.getElementById("hijo").value;
                op = true;
            } else {
                op = true;
                ccc = tipo+"-"+cedulam
            }

            if (hijos == null || hijos == "") {
                op = false;

                $("#id_mensaje").empty();
                setTimeout(mensaje_load,500);
                $("#id_mensaje").append('<h3 class="h6 mb-4">Debes de colocar el numero de hijos</h3>');

                $("#modal-mensaje").modal({
                    show: false,
                    keyboard: false,
                    backdrop: 'static'
                });

                $("#modal-mensaje").modal("show");
            } else if (hijos >= 1) {
                ccc = tipo+"-"+cedulam+"-"+hijos
                op = true;
            }

            if (op) {
                $.ajax({
                    type: "POST",
                    url: "{{url('/menor')}}",
                    data:  {_token:"{{ csrf_token() }}",cedula:ccc},
                    cache:false,
                    success: function(data){
                        setTimeout(mensaje_load,500);
                        const obj = JSON.parse(data);
                        if (obj[0] == null) {
                            $('#nombrem').removeAttr('readonly','readonly');
                            $('#fecham').removeAttr('readonly','readonly');

                            $("#nombrem").val("");
                            $("#fecham").val("");
                            $("#edad2").val("");
                        } else {
                            //console.log(obj[0]);
                            $('#nombrem').attr('readonly','readonly');
                            $('#fecham').attr('readonly','readonly');

                            $("#nombrem").val(obj[0].nombre);
                            $("#fecham").val(obj[0].fn);

                            calcularEdad(obj[0].fn, "edad2", false);
                        }
                    }
                });
            }
        }

    }

    $(document).ready(function() {    
        var trabaja = "{{!empty($datosp[0]->trabaja) ? $datosp[0]->trabaja : null}}";
        var carnet = "{{!empty($datosp[0]->carnet) ? $datosp[0]->carnet : null}}";
        var fn = "{{!empty($datosp[0]->fn) ? $datosp[0]->fn : null}}";

        if (fn == null || fn == '') {
            fn = <?php echo date('Y-m-d'); ?>
        }

        calcularEdad(fn, "edad1", false);
        
        if (trabaja == 'SI') {
          $('#dondee').removeAttr('hidden','hidden');
          $('#donde').removeAttr('disabled','disabled');
        }else{
          $('#dondee').attr('hidden','hidden');
          $('#donde').attr('disabled','disabled');
        }

        if (carnet == 'SI') {
            $('#serialll').removeAttr('hidden','hidden');
            $('#codigooo').removeAttr('hidden','hidden');

            $('#serial').removeAttr('disabled','disabled');
            $('#codigo').removeAttr('disabled','disabled');
        }else{
            $('#serialll').attr('hidden','hidden');
            $('#codigooo').attr('hidden','hidden');

            $('#serial').attr('disabled','disabled');
            $('#codigo').attr('disabled','disabled');
        }
    });

</script>
@stop

@section('contenido')
<div class="col-12 col-xl-12">
    <div class="card card-body bg-white border-light shadow-sm mb-4">
        <h3 class="h5 mb-4">Registro - Solicitud de Lentes</h3>
    </div>
</div>

{!!Form::open(['url' => route('l_lentes'), 'method' => 'POST', 'class' => 'login-form'])!!}
<div class="col-12 col-xl-12">
    <div class="card card-body bg-white border-default shadow-sm mb-4">
        <h6 class="h6 mb-4">Datos del Beneficiarios</h6>
        
        <div class="row">
            <div class="col-md-3 mb-3">
                <div class="form-group">
                    <label for="city">Cédula/Rif</label>
                    <input class="form-control" type="text" name="cedula" id="cedula" value="{{$cedula}}" readonly autocomplete="off" required maxlength="9">
                </div>
            </div>
            <div class="col-md-3 mb-3">
                <div class="form-group">
                    <label for="city">Posee Carnet de la Patria</label><br>
                    Si 
                    {!!
                        Form::radio('carnet', 'SI', isset($datosp[0]->carnet) ? $datosp[0]->carnet == 'SI' : null, ['required' => 'required', 'id'  =>  'carnet'])
                    !!}
                    &nbsp; &nbsp; &nbsp;
                    No 
                    {!!
                        Form::radio('carnet', 'NO', isset($datosp[0]->carnet) ? $datosp[0]->carnet == 'NO' : null, ['required' => 'required', 'id'  =>  'carnet'])
                    !!}
                </div>
            </div>
            <div class="col-md-3 mb-3" id="serialll" hidden>
                <div class="form-group">
                    <label for="city">Serial</label>
                    <input class="form-control" type="text" name="serial" id="serial" value="@php echo !empty($datosp[0]->serial) ? $datosp[0]->serial : null; @endphp" onkeypress="return solonumero(event)" autocomplete="off" required maxlength="10" disabled>
                </div>
            </div>
            <div class="col-md-3 mb-3" id="codigooo" hidden>
                <div class="form-group">
                    <label for="city">Código</label>
                    <input class="form-control" type="text" name="codigo" id="codigo" value="@php echo !empty($datosp[0]->codigo) ? $datosp[0]->codigo : null; @endphp" onkeypress="return solonumero(event)" autocomplete="off" required maxlength="10" disabled>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-5 mb-3">
                <div class="form-group">
                    <label for="city">Nombres y Apellidos</label>
                    <input class="form-control" type="text" name="nombre" id="nombre" value="@php echo !empty($datosp[0]->nombre) ? $datosp[0]->nombre : null; @endphp" readonly autocomplete="off" required maxlength="80">
                </div>
            </div>
            <div class="col-md-3 mb-3">
                <div class="form-group">
                    <label for="city">Fecha de Nacimiento</label>
                    <input class="form-control" max="<?php echo date('Y-m-d'); ?>" type="date" name="fecha1" id="fecha1" value="@php echo !empty($datosp[0]->fn) ? $datosp[0]->fn : null; @endphp"  autocomplete="off" required maxlength="10">
                </div>
            </div>
            <div class="col-md-2 mb-3">
                <div class="form-group">
                    <label for="city">Edad</label>
                    <input class="form-control" type="text" name="edad1" id="edad1" value="@php echo !empty($datosp[0]->edad) ? $datosp[0]->edad : null; @endphp" readonly autocomplete="off" maxlength="3">
                </div>
            </div>
            <div class="col-md-2 mb-3">
                <div class="form-group">
                    <label for="city">Sexo</label><br>
                    M 
                    {!!
                        Form::radio('sexo1', 'M', isset($datosp[0]->sexo) ? $datosp[0]->sexo == 'M' : null, ['required' => 'required', 'id'  =>  'sexo1'])
                    !!}
                    &nbsp; &nbsp; &nbsp;
                    F 
                    {!!
                        Form::radio('sexo1', 'F', isset($datosp[0]->sexo) ? $datosp[0]->sexo == 'F' : null, ['required' => 'required', 'id'  =>  'sexo1'])
                    !!}
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <div class="form-group">
                    <label for="city">Estado Civil</label>
                    {!! 
                        Form::select('civil', ['S' => 'SOLTERO(A)', 'C' => 'CASADO(A)', 'V' => 'VIUDO(A)', 'D' => 'DIVORCIADO(A)'], !empty($datosp[0]->estadocivil) ? $datosp[0]->estadocivil : null, ['placeholder' =>  'SELECCIONE', 'class' =>  'form-select', 'required'  =>  'required', 'id'  =>  'civil']) 
                    !!}
                </div>
            </div>
            <div class="col-md-4 mb-3">
                <div class="form-group">
                    <label for="city">Ocupación</label>
                    {!! 
                        Form::select('ocupacion', $ocupacion, !empty($datosp[0]->ocupacion) ? $datosp[0]->ocupacion : null, ['placeholder' =>  'SELECCIONE', 'class' =>  'form-select', 'required'  =>  'required', 'id'  =>  'ocupacion']) 
                    !!}
                </div>
            </div>
            <div class="col-md-4 mb-3">
                <div class="form-group">
                    <label for="city">Teléfono</label>
                    <input class="form-control" type="text" name="telefono" id="telefono" value="@php echo !empty($datosp[0]->telefono) ? $datosp[0]->telefono : null; @endphp" onkeypress="return solonumero(event)" autocomplete="off" required maxlength="12">
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <div class="form-group">
                    <label for="city">Correo Electrónico</label>
                    <input class="form-control" type="text" name="correo" id="correo" value="@php echo !empty($datosp[0]->correo) ? $datosp[0]->correo : null; @endphp" autocomplete="off" required maxlength="40">
                </div>
            </div>

            <div class="col-md-4 mb-3">
                <div class="form-group">
                    <label for="city">Trabaja</label><br>
                    Si 
                    {!!
                        Form::radio('trabaja', 'SI', isset($datosp[0]->trabaja) ? $datosp[0]->trabaja == 'SI' : null, ['required' => 'required', 'id'  =>  'trabaja'])
                    !!}
                    &nbsp; &nbsp; &nbsp;
                    No 
                    {!!
                        Form::radio('trabaja', 'NO', isset($datosp[0]->trabaja) ? $datosp[0]->trabaja == 'NO' : null, ['required' => 'required', 'id'  =>  'trabaja'])
                    !!}
                </div>
            </div>

            <div class="col-md-4 mb-3" id="dondee" hidden>
                <div class="form-group">
                    <label for="city">Donde</label>
                    <input class="form-control" type="text" name="donde" id="donde" value="@php echo !empty($datosp[0]->donde) ? $datosp[0]->donde : null; @endphp" autocomplete="off" required disabled maxlength="50">
                </div>
            </div>

        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <div class="form-group">
                    <label for="city">¿Representa a un menor de edad?:</label><br>
                    Si <input required="required" name="menor" type="radio" value="SI">
                    &nbsp; &nbsp; &nbsp;
                    No <input required="required" name="menor" type="radio" value="NO">
                </div>
            </div>
        </div>
    </div>
</div>

<div class="col-12 col-xl-12" id="tmenor" hidden>
    <div class="card card-body bg-white border-default shadow-sm mb-4">
        <h6 class="h6 mb-4">Datos del menor</h6>
        
        <div class="row">
            <div class="col-md-3 mb-3">
                <div class="form-group">
                    <label for="city">Tipo de Identificación</label>
                    <select class="form-select mb-0" id="tipo" name="tipo">
                        <option value="" selected="selected">SELECCIONE</option>
                        <option value="V">V</option>
                        <option value="E">E</option>
                        <option value="SC">SIN CEDULA</option>
                    </select>
                </div>
            </div>
            <div class="col-md-3 mb-3">
                <div class="form-group">
                    <label for="city">Cédula</label>
                    <input class="form-control" type="text" name="cedulam" id="cedulam" value="" onkeypress="return solonumero(event)" autocomplete="off" maxlength="12">
                </div>
            </div>
            <div class="col-md-3 mb-3" id="nnumeros" hidden>
                <div class="form-group">
                    <label for="city">N° del Hijo</label>
                    {!! 
                        Form::select('hijo', $hijos, null, ['placeholder' =>  'SELECCIONE', 'class' =>  'form-select', 'id'  =>  'hijo']) 
                    !!}
                </div>
            </div>
            <div class="col-md-3 mb-3">
                <div class="form-group">
                    <br>
                    <a class="btn btn-primary" onclick="buscarmenor()"><i class="fa-solid fa-check"></i> Buscar</a>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-5 mb-3">
                <div class="form-group">
                    <label for="city">Nombres y Apellidos</label>
                    <input class="form-control" type="text" name="nombrem" id="nombrem" value="" autocomplete="off"  maxlength="60" readonly>
                </div>
            </div>
            <div class="col-md-3 mb-3">
                <div class="form-group">
                    <label for="city">Fecha de Nacimiento</label>
                    <input class="form-control" max="<?php echo date('Y-m-d'); ?>" type="date" name="fecham" id="fecham" value="" autocomplete="off" readonly maxlength="10">
                </div>
            </div>
            <div class="col-md-2 mb-3">
                <div class="form-group">
                    <label for="city">Edad</label>
                    <input class="form-control" type="text" name="edad2" id="edad2" value="" readonly autocomplete="off" maxlength="3">
                </div>
            </div>
            <div class="col-md-2 mb-3">
                <div class="form-group">
                    <label for="city">Sexo</label><br>
                    M <input name="sexom" type="radio" value="M">
                    &nbsp; &nbsp; &nbsp;
                    F <input name="sexom" type="radio" value="F">
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <div class="form-group">
                    <label for="city">Relacion</label>
                    <select class="form-select mb-0" id="relacion" name="relacion">
                        <option selected="selected" value="">SELECCIONE</option>
                        <option value="H">HIJO(A)</option>
                        <option value="HE">HERMANO(A)</option>
                        <option value="S">SOBRINO(A)</option>
                        <option value="N">NIETO(A)</option>
                    </select>
                </div>
            </div>
        </div>

    </div>
</div>

<div class="col-12 col-xl-12">
    <div class="card card-body bg-white border-default shadow-sm mb-4">
        <h6 class="h6 mb-4">Dirección de Habitación</h6>
        <div class="row">
            <div class="col-md-6 mb-3">
                <div class="form-group">
                    <label for="city">Comunidad</label>
                    {!! 
                        Form::select('comunidad', $comunidad, !empty($datosp[0]->id_jefe_com ) ? $datosp[0]->id_jefe_com  : null, ['placeholder' =>  'SELECCIONE', 'class' =>  'form-select', 'required'  =>  'required', 'id'  =>  'comunidad']) 
                    !!}
                </div>
            </div>
            <div class="col-md-6 mb-3">
                <div class="form-group">
                    <label for="city">Dirección Exacta</label>
                    <textarea id="direccion" name="direccion" class="form-control" required>{{!empty($datosp[0]->direccion ) ? $datosp[0]->direccion  : null}}</textarea>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12 mb-3">
                <div class="form-group">
                    <label for="city">Punto de Referencia</label>
                    <textarea id="referencia" name="referencia" class="form-control" required>{{!empty($datosp[0]->preferencia ) ? $datosp[0]->preferencia  : null}}</textarea>
                </div>
            </div>
        </div>

    </div>
</div>

<div class="col-12 col-xl-12">
    <div class="card card-body bg-white border-default shadow-sm mb-4">
        <h6 class="h6 mb-4">Solicitud de Ayuda</h6>
        <div class="row">
            <div class="col-md-6 mb-3">
                <div class="form-group">
                    <label for="city">Usted realizó la solicitud en la aplicación VenApp (Línea 58)</label><br>
                    Si <input required="required" name="venapp" type="radio" value="SI">
                    &nbsp; &nbsp; &nbsp;
                    No <input required="required" name="venapp" type="radio" value="NO">
                </div>
            </div>
            <div class="col-md-6 mb-3" id="venappid" hidden>
                <div class="form-group">
                    <label for="city">Escriba el número del reporte de la aplicación VenApp línea 58</label>
                    <input class="form-control" type="text" name="nreporte" id="nreporte" value="" autocomplete="off" maxlength="30">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12 mb-3">
                <div class="form-group">
                    <label for="city">Describa su caso médico (OBLIGATORIO)</label>
                    <textarea id="descripcion" name="descricion" required class="form-control"></textarea>
                </div>
            </div>
        </div>

    </div>
</div>

<div class="col-12 col-xl-12">
    <div class="card card-body bg-white border-light shadow-sm mb-4">
        <div class="row">
            <div class="col-sm-6 mb-3">
                <div class="form-group">
                    
                </div>
            </div>
            <div class="col-sm-6" style="text-align: right;">
                <div class="form-group">
                    <button type="submit" class="btn btn-dark"><i class="fa-solid fa-save"></i> Guardar</button>
                </div>
            </div>
        </div>
    </div>
</div>
{!! Form::close() !!}
@stop