@extends('layouts.app')

@section('content')
    <!-- end sidebar menu -->
    <!-- start page content -->
    <div class="page-content-wrapper">
        <div class="page-content">
            <div class="page-bar">
                <div class="page-title-breadcrumb">
                    <!--<div class="pull-left">
                        <div class="page-title text-danger">Sin Sucursal</div>
                    </div>-->
                    <ol class="breadcrumb page-breadcrumb pull-right">
                        <li><i class="fa fa-home"></i>&nbsp;<a class="parent-item" href="{{ url('/dashboard') }}">Inicio</a>&nbsp;<i class="fa fa-angle-right"></i>
                        </li>
                        <li><i class="fa fa-users"></i>&nbsp;<a class="parent-item" href="{{ url('/asociaciones') }}">Listado de Asociaciones</a>
                        &nbsp;<i class="fa fa-angle-right"></i>
                        </li>
                        <li class="active">Asocición - {{isset($edit) ? 'Actualizar' : 'Nuevo'}}</li>
                    </ol>
                </div>
            </div>
            <!-- start widget -->
            <!-- start admited patient list -->
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <div class="card  card-box">
                        <div class="card-head">
                            <header>Asociación -{{isset($edit) ? 'Actualizar ('.$edit->cliente_entidad_sigla.')' : 'Nuevo'}}</header>
                        </div>
                        <div class="card-body">
                            @if(isset($edit))
                            {!! Form::model($edit,['url' => ['asociacion/update/'.$edit->cliente_entidad_id],'method'=>'PATCH','enctype'=>'multipart/form-data','id'=>'frmAsociacion']) !!}
                            @else
                            {!! Form::open(['url' => '/asocciacion/save','method'=>'POST','enctype'=>'multipart/form-data','role'=>'form','id'=>'frmAsociacion']) !!}
                            @endif
                                <div class="row mb-3 col-md-12">
                                    <label for="foto" class="form-label">Logo</label>
                                    <input type="file" class="form-control" name="foto" id="foto">
                                </div>
                                <div class="row mb-3 col-md-12">
                                    {!! Form::mselect('sede',$asociacion_padre,isset($edit) ? $edit->cliente_entidad_padre_id : null,'Asociación Padre',$errors,6,false) !!}

                                    {!! Form::mtext('tipo_identificacion',isset($edit) ? $edit->cliente_entidad_documento : null,'Identificación',$errors,6,false) !!}
                                </div>
                                <div class="row mb-3 col-md-12">
                                    {!! Form::mtext('nombre',isset($edit) ? $edit->cliente_entidad_nombre : null,'Nombre',$errors,6,true,true,[['onkeyup'=>'javascript:this.value=this.value.toUpperCase()']]) !!}

                                    {!! Form::mtext('siglas',isset($edit) ? $edit->cliente_entidad_sigla : null,'Siglas',$errors,6,true,true,[['onkeyup'=>'javascript:this.value=this.value.toUpperCase()']]) !!}
                                </div>
                                <div class="row mb-3 col-md-12">
                                    <div class="col-md-2 mb-1">
                                        <div class="form-group">
                                            <label for="codigo_telefono_pais">Codigo Telefono</label>
                                            <select name="codigo_telefono_pais" id="codigo_telefono_pais" class="form-control select2">
                                                <option value="+506">Costa Rica</option>
                                                @php
                                                    $data = json_decode(file_get_contents(public_path("/js/CountryCodes.json")));
                                                @endphp
                                                @foreach($data as $country)
                                                    <option value="{{ $country->dial_code }}" @if(@$edit->codigo_telefono_pais == $country->dial_code) selected='selected' @endif>{{ $country->name }} ({{ $country->dial_code }})</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    {!! Form::mtext('telefono',isset($edit) ? $edit->cliente_entidad_telefono_principal : null,'Teléfono Principal',$errors,4,true,true,[['onkeypress'=>'return event.charCode > 47 && event.charCode < 58;'],['maxlength'=>'8']]) !!}

                                    @php $telefonos =  isset($edit) ? str_replace(']','',str_replace('"]','',str_replace('"','',str_replace('["','',$edit->cliente_entidad_otros_telefonos)))) : null; @endphp
                                     {!! Form::mtextTags('telefonos',$telefonos,'Otros Teléfonos',$errors,6,false,true,[['onkeypress'=>'return event.charCode > 47 && event.charCode < 58;']]) !!}

                                </div>
                                <div class="row mb-3 col-md-12">
                                    {!! Form::mEmail('email',isset($edit) ? $edit->cliente_entidad_email : null,'Correo Electrónico',$errors,6,true,true,[['onkeyup'=>'javascript:this.value=this.value.toLowerCase()']]) !!}

                                    {!! Form::mselect('localidad',$localidad,isset($edit) ? $edit->cliente_entidad_localidad_id : null,'Localidad',$errors,6) !!}
                                </div>
                                <div class="row mb-3 col-md-12">
                                    {!! Form::mselect('estado',[1=>'Activo',0=>'Inactivo'],isset($edit) ? $edit->cliente_entidad_estado_id : null,'Estado',$errors,6) !!}

                                    {!! Form::mselect('medio_pago',$medios_pago,isset($edit) ? $edit->cliente_entidad_medio_de_pago_id : null,'Medio de pago',$errors,6, true) !!}
                                </div>
                                <div class="row mb-3 col-md-12">
                                    {!! Form::mtextAr('direccion',isset($edit) ? $edit->cliente_entidad_direccion : null,'Dirección',$errors,6,true) !!}

                                    <div class="col-6">
                                        <label for="encargado" class="form-label">Encargado Código
                                        </label>
                                        <div class="input-group mb-3">
                                            <select name="empleado" id="empleado" class="form-control select2" style="width: 90%;" placeholder="Seleccionar">
                                               <option value="" selected>Seleccionar</option>
                                                @foreach($empleados as $key => $value)
                                                    <option value="{{$key}}" @if(@$edit->cliente_entidad_empleado_id == $key) selected='selected' @endif>{{$value}}</option>
                                                @endforeach
                                            </select>
                                          <!-- {!! Form::select('empleado',$empleados, isset($edit) ? $edit->cliente_entidad_empleado_id : $empleado_selected ?? null,['id'=>'empleado','class'=>'form-control select2','style'=>'width: 90%;','placeholder'=>'Seleccionar']) !!} -->
                                          <div class="input-group-append">
                                            <a class="btn btn-info" data-toggle="modal" data-target="#staticModal"><i class="fa fa-plus"></i></a>
                                          </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb-3 col-md-12">
                                        <div class="col-6">
                                            <label for="telefonos" class="form-label">Autoriza Autoriza envío de Email?   </label><br>
                                            <input type="checkbox" name="autorizacion_email" data-off="No" data-on="Si"  {{isset($edit) ? $edit->cliente_entidad_autoriza_envio_email ? 'checked' : '' : ''}}   data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                                        </div>
                                        <div class="col-6">
                                            <label for="telefonos" class="form-label">Autoriza el Es Recaudador?</label><br>
                                            <input type="checkbox" name="autorizacion_recaudador" data-off="No" data-on="Si" {{isset($edit) ? $edit->cliente_entidad_es_recaudador ? 'checked' : '' : ''}}  data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                                        </div>
                                </div>
                                <div class="row mb-3 col-md-12">
                                        <div class="col-6">
                                            <label for="telefonos" class="form-label">Muestra Modalidad en Planilla?  </label><br>
                                            <input type="checkbox" name="modalidad_planilla" data-off="No" data-on="Si"  {{isset($edit) ? $edit->cliente_entidad_muestra_modalidad ? 'checked' : '' : ''}}   data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                                        </div>
                                        <div class="col-6">
                                            <label for="telefonos" class="form-label">Muestra Novedad en Planilla?</label><br>
                                            <input type="checkbox" name="novedad_planilla" data-off="No" data-on="Si" {{isset($edit) ? $edit->cliente_entidad_muestra_novedad ? 'checked' : '' : ''}}  data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                                        </div>
                                </div>
                                <div class="row mb-3 col-md-12">
                                        <div class="col-6">
                                            <label for="telefonos" class="form-label">Visualice Iva</label><br>
                                            <input type="checkbox" name="visualice_iva" data-off="No" data-on="Si"  {{isset($edit) ? $edit->cliente_entidad_visualice_impuesto ? 'checked' : '' : ''}}   data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                                        </div>
                                        <div class="col-6">
                                            <label for="telefonos" class="form-label">Visualice Factura</label><br>
                                            <input type="checkbox" name="visualice_factura" data-off="No" data-on="Si" {{isset($edit) ? $edit->cliente_entidad_visualice_factura ? 'checked' : '' : ''}}  data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                                        </div>
                                </div>
                        </div>
                        <div class="card-footer text-center">
                            <div class="text-center">
                                <button type="submit" class="btn bg-success">Aceptar</button>
                                @if (isset($edit))
                                    
                                    <a class="btn bg-danger" href="{{ url('asociacion/ver/' . $edit->cliente_entidad_id .'/index') }}">Cancelar</a>
                                @else
                                <a class="btn bg-info" href="{{ url('asociaciones') }}">Volver</a>
                                @endif
                               
                            </div>
                        </div>
                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="staticModal" role="dialog" aria-labelledby="staticModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-lg" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="staticModalLabel">Agregar Encargado</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <form role="form" id="quickForm">
                            <div class="clearfix"></div>
                        <div class="modal-body">
                          <div class="row col-md-12">

                              <div class="col-6">
                                   <label for="sede" class="form-label">Sede de Pertenencia</label>
                                    @php
                                    $resSedes = isset($edit) ? explode(",",str_replace(']','',str_replace('[','',str_replace('"','',$edit->empleado_entidad_id)))) : session()->get('data_entidad')->entidad_id;
                                @endphp


                                    {!! Form::select('sede_perteneciente',$sedes,$resSedes,['id'=>'sede_perteneciente','class'=>'form-control','placeholder'=>'Seleccionar']) !!}
                              </div>
                              {!! Form::mtext('documento',null,'Documento',$errors,6,true,true,[['onkeyup'=>'javascript:this.value=this.value.toUpperCase()']]) !!}
                          </div>
                          <div class="row col-md-12">
                            {!! Form::mtext('nombres',null,'Nombres',$errors,6,true,true,[['onkeyup'=>'javascript:this.value=this.value.toUpperCase()']]) !!}
                            {!! Form::mtext('paterno',null,'Primer Apellido',$errors,6,true,true,[['onkeyup'=>'javascript:this.value=this.value.toUpperCase()']]) !!}
                          </div>
                          <div class="row col-md-12">
                            {!! Form::mtext('materno',null,'Segundo Apellido',$errors,6,true,true,[['onkeyup'=>'javascript:this.value=this.value.toUpperCase()']]) !!}

                              <div class="col-6">
                                  <label for="sexo" class="form-label">Sexo</label>
                                  {!! Form::select('sexo', ['Masculino'=>'Masculino','Femenino'=>'Femenino','No Aplica'=>'No Aplica'], null,['id'=>'sexo','class'=>'form-control','placeholder'=>'Seleccionar']) !!}
                              </div>
                          </div>
                          <div class="row col-md-12">
                            {!! Form::mtext('celular',null,'Celular',$errors,6,false,true,[['onkeypress'=>'return event.charCode > 47 && event.charCode < 58;'],['maxlength'=>'8']]) !!}


                             {!! Form::mtextTags('telefonos',null,'Otros Teléfonos',$errors,6,false,true,[['onkeypress'=>'return event.charCode > 47 && event.charCode < 58;']]) !!}

                          </div>
                       </div>
                        <div class="modal-footer center-content-between">
                            <button type="submit" class="btn bg-success">Guardar</button>
                            <a class="btn bg-warning text-white" data-dismiss="modal" aria-label="Close">Cancelar</a>
                        </div>
                        </form>
                    </div>
                </div>
            </div>
</div>
@endsection
@section('script')
    <script>

        /*$('body').on('shown.bs.modal', '.modal', function() {
  $(this).find('select').each(function() {
    var dropdownParent = $(document.body);
    if ($(this).parents('.modal.in:first').length !== 0)
      dropdownParent = $(this).parents('.modal.in:first');
    $(this).select2({
       dropdownParent: dropdownParent

    });
  });
});*/

       /*$('#sede_perteneciente').select2({
        dropdownParent: $('#staticModal')
    });*/

    /*$('#sexo').select2({
   dropdownParent: $('#staticModal');
});*/
        $('#frmAsociacion').validate({
            rules: {
                nombre: {
                    required: true,
                },
                siglas: {
                    required: true,
                },
                telefono: {
                    required: true,
                },
                email: {
                    required: true,
                },
                medio_pago: {
                    required: true,
                },
                direccion: {
                    required: true,
                },

            },
             messages: {
                nombre: {
                        required: "El campo nombre es requerido.",
                },
                siglas: {
                        required: "El campo siglas es requerido.",
                },
                telefono: {
                        required: "El campo teléfono principal es requerido.",
                },
                email: {
                        required: "El campo correo electrónico es requerido.",
                },
                medio_pago: {
                        required: "El campo medio de pago es requerido.",
                },
                direccion: {
                        required: "El campo dirección es requerido.",
                },
            },
             errorElement: 'span',
        errorPlacement: function (error, element) {
          error.addClass('invalid-feedback');
          element.closest('.form-group').append(error);
        },
        highlight: function (element, errorClass, validClass) {
          $(element).addClass('is-invalid');
        },
        unhighlight: function (element, errorClass, validClass) {
          $(element).removeClass('is-invalid');
        },
        submitHandler: function(form){
            var celular = $('#telefono').val();
            var telefonos = $('#telefonos').val();
            var html = '';
            var validacion = '';

            if(celular == '' && telefonos == '' ){
                validacion = 'Debe ingresar alguno de los campos celular o teléfonos.';
            }

            if(celular != '' && validacion == ''){
              if(celular.length < 8){
                    validacion = 'El campo celular solo debe contener 8 caracteres de tipo numerico.';
                }
            }

            if(telefonos != '' && validacion == ''){
                var arrayTelefonos =  telefonos.split(',');

                for(var i = 0 ; i < arrayTelefonos.length; i++){
                    if(arrayTelefonos[i].length < 8 || isNaN(arrayTelefonos[i]*1)){
                        validacion += 'El teléfono ('+arrayTelefonos[i]+') debe contener 8 caracteres de tipo numerico.'+"<br/>"
                    }
                }
                html = validacion;
            }

                    if(validacion != ''){
                        Swal.fire({
                          icon: 'error',
                          title: 'Advertencia',
                          text: html == '' ? validacion : '',
                          html: html
                        });
                    }else{
                        form.submit();
                    }
        }
        });



     $(document).ready(function () {
          $.validator.setDefaults({
            submitHandler: function () {
              saveEncargado();
            }
          });

           $('#quickForm').validate({
            rules: {
                documento: {
                    required: true,
                },
                nombres: {
                    required: true,
                },
                paterno: {
                    required: true,
                },
            },
            messages: {
                documento: {
                        required: "El campo documento es requerido.",
                },
                nombres: {
                        required: "El campo nombres es requerido.",
                },
                paterno: {
                        required: "El campo primer apellido es requerido.",
                },
            },
            errorElement: 'span',
        errorPlacement: function (error, element) {
          error.addClass('invalid-feedback');
          element.closest('.form-group').append(error);
        },
        highlight: function (element, errorClass, validClass) {
          $(element).addClass('is-invalid');
        },
        unhighlight: function (element, errorClass, validClass) {
          $(element).removeClass('is-invalid');
        }
        });


        /*$('#empleado').select2({
            ajax: {
                dataType: 'json',
                url: "{{asset('').'ajax/empleados'}}",
                delay: 250,
                minimumInputLength: 3,
                data: function(params) {
                        var query = {
                            search: params.term,
                            page: params.page || 1
                        }
                        console.log(query);
                        return query;
                },
                processResults: function (data, page) {
                  return {
                    results: data
                  };
                },
                theme: "classic"
            }
        });*/
    });

        function saveEncargado(){
            console.log("{{asset('').'empleado/save/modal'}}");
            var sede = $('#sede').val();
            var documento = $('#documento').val();
            var nombres = $('#nombres').val();
            var paterno = $('#paterno').val();
            var materno = $('#materno').val();
            var sexo = $('#sexo').val();
            var celular = $('#celular').val();
            var telefonos = $('#telefonos').val();

            $.ajax({
                type: "POST",
                url: "{{asset('').'empleado/save/modal'}}",
                data:{  "_token": "{{ csrf_token() }}",
                        sede:sede, documento:documento,nombres:nombres,paterno:paterno,materno:materno, sexo:sexo,celular:celular,telefonos:telefonos},
                success: function (res) {
                    console.log(res.data);

                    document.getElementById("empleado").options[document.getElementById("empleado").options.length]=new Option(nombres+' '+paterno+' '+materno, res.data);
                    $('#staticModal').modal('hide');
                    Swal.fire(
                    'Alerta',
                    'Registro almacenado con éxito!',
                    'success'
                    )

                    $('#empleado').append(`
                        <option selected value="${res.empleado_id}">
                            ${res.empleado_nombres} ${res.empleado_apellido1} ${res.empleado_apellido2}
                        </option>
                    `)

                    // setTimeout(() => {
                    //     location.reload()
                    // }, 1500);
                },
                dataType: "json"
            });
        }
        /*$(function () {
             //Initialize Select2 Elements
            $('.select2').select2()

            //Initialize Select2 Elements
            $('.select2bs4').select2({
              theme: 'bootstrap4'
            })
        });*/
    </script>
@endsection