@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-square"></i>&nbsp;<a class="parent-item"
                                href="{{ url('/contratos') }}">Contratos</a>
                            &nbsp;<i class="fa fa-angle-right"></i>
                        </li>
                        <li class="active">Contrato Beneficiario - {{ 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>Contrato Beneficiario - {{ isset($edit) ? 'Actualizar' : 'Nuevo' }}</header>
                        </div>
                        @if (isset($edit))
                            {!! Form::model($edit, [
                                'url' => ['contrato_beneficiario/actualizar/' . $edit->contrato_servicio_beneficiario_id],
                                'method' => 'PATCH',
                                'id' => 'frmContratos',
                            ]) !!}
                        @else
                            {!! Form::open([
                                'url' => 'contrato_beneficiario/' . $contrato_id,
                                'method' => 'POST',
                                'role' => 'form',
                                'id' => 'frmContratos',
                            ]) !!}
                        @endif
                        <div class="row col-md-12">
                            <div class="col-md-6">
                                <label for="contrato_servicio_beneficiario_cliente_id" class="form-label">Beneficiario <span
                                        class="text-danger">*</span></label>
                                <div class="input-group col-md-12">
                                    <div class="col-10">
                                        {!! Form::select(
                                            'contrato_servicio_beneficiario_cliente_id',
                                            isset($edit) ? $cliente_data : [],
                                            isset($edit) ? $edit->contrato_servicio_beneficiario_cliente_id : null,
                                            ['id' => 'contrato_servicio_beneficiario_cliente_id', 'class' => 'form-control'],
                                        ) !!}
                                    </div>
                                    <div class="col-2 input-group-append">
                                        <a class="btn btn-info" data-toggle="modal" data-target="#staticModal"><i
                                                class="fa fa-plus"></i></a>
                                    </div>
                                </div>

                            </div>

                            {!! Form::mselect(
                                'contrato_servicio_beneficiario_parentesco',
                                $parentescos,
                                isset($edit) ? $edit->contrato_servicio_beneficiario_parentesco : null,
                                'Parentesco',
                                $errors,
                                6,
                                true,
                            ) !!}
                        </div>
                        <div class="row col-md-12">
                            {!! Form::mselect(
                                'servicio_id',
                                $servicios,
                                isset($edit) ? $edit->contrato_servicio_beneficiario_contrato_servicio_id : null,
                                'Servicio del Contrato',
                                $errors,
                                6,
                                true,
                            ) !!}

                            {!! Form::mtext(
                                'contrato_servicio_beneficiario_edad',
                                isset($edit) ? $edit->contrato_servicio_beneficiario_edad : null,
                                'Edad de Afiliación',
                                $errors,
                                6,
                                false,
                            ) !!}

                        </div>
                        <div class="row col-md-12">
                            {!! Form::mDate(
                                'contrato_servicio_beneficiario_vigencia_desde',
                                isset($edit) ? $edit->contrato_servicio_beneficiario_vigencia_desde : null,
                                'Vigencia desde',
                                $errors,
                                6,
                            ) !!}

                            {!! Form::mselect(
                                'contrato_servicio_beneficiario_suma_aseguradora_id',
                                $polizas,
                                isset($edit) ? $edit->contrato_servicio_beneficiario_suma_aseguradora : null,
                                'Suma Aseguradora',
                                $errors,
                                6,
                            ) !!}

                        </div>
                        <div class="row col-md-12">
                            {!! Form::mselect(
                                'numero_poliza',
                                $numero_poliza,
                                isset($edit) ? $edit->contrato_servicio_beneficiario_numero_poliza : null,
                                'Número Póliza',
                                $errors,
                                6,
                            ) !!}
                            <div class="col-6">
                                <label for="contrato_servicio_beneficiario_reporta_ins" class="form-label">¿Reporta a la
                                    INS?</label><br>
                                <input type="checkbox" name="contrato_servicio_beneficiario_reporta_ins"
                                    id="contrato_servicio_beneficiario_reporta_ins" data-off="No" data-on="Si"
                                    {{ isset($edit) ? ($edit->contrato_servicio_beneficiario_reporta_ins ? 'checked' : '') : '' }}
                                    data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                            </div>
                        </div>
                        <div class="card-footer text-center">
                            <div class="text-center">
                                <button type="submit"
                                    class="btn bg-success">{{ isset($edit) ? 'Editar Beneficiario' : 'Agregar Beneficiario' }}</button>
                                <a class="btn bg-danger" href="{{ url('contratos/' . $contrato_id . '/ver') }}">Volver</a>
                            </div>
                        </div>
                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <div class="card  card-box">
                        <div id="tablaContratos">

                        </div>
                    </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 Beneficiario</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 id="alerta"></div>

                        <div class="row col-md-12">
                            <div class="col-6">
                                <label for="sede" class="form-label">Sede</label>
                                {!! Form::select('sede_perteneciente', $sedes, isset($edit) ? '' : session()->get('data_entidad')->entidad_id, [
                                    'id' => 'sede_perteneciente',
                                    'class' => 'form-control',
                                    'placeholder' => 'Seleccionar',
                                ]) !!}
                            </div>
                            <div class="col-6">
                                <label for="tipo_identificacion" class="form-label">Tipo Identificación</label>
                                {!! Form::select('tipo_identificacion', $tipo_identificacion, isset($edit) ? '' : null, [
                                    'id' => 'tipo_identificacion',
                                    'class' => 'form-control',
                                    'placeholder' => 'Seleccionar',
                                ]) !!}
                            </div>
                        </div>
                        <div class="row col-md-12">
                            {!! Form::mtext('documento', null, 'Documento', $errors, 6, false, true, [
                                ['onkeyup' => 'javascript:this.value=this.value.toUpperCase()'],
                            ]) !!}

                            {!! Form::mtext('nombres', null, 'Nombres', $errors, 6, true, true, [
                                ['onkeyup' => 'javascript:this.value=this.value.toUpperCase()'],
                            ]) !!}


                        </div>
                        <div class="row col-md-12">
                            {!! Form::mtext('paterno', null, 'Primer Apellido', $errors, 6, true, true, [
                                ['onkeyup' => 'javascript:this.value=this.value.toUpperCase()'],
                            ]) !!}

                            {!! Form::mtext('materno', null, 'Segundo Apellido', $errors, 6, false, [
                                ['onkeyup' => 'javascript:this.value=this.value.toUpperCase()'],
                            ]) !!}
                        </div>
                        <div class="row col-md-12">
                            <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>
                            {!! Form::mDate(
                                'fecha_nacimiento',
                                isset($edit) ? $edit->cliente_fecha_nacimiento : null,
                                'Fecha de Nacimiento',
                                $errors,
                                6,
                            ) !!}
                        </div>
                    </div>
                    <div class="modal-footer">
                        <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>
        $(document).ready(function() {
            $('#contrato_servicio_beneficiario_cliente_id').select2({
                ajax: {
                    dataType: 'json',
                    url: '{{ url('cliente/data/ajax') }}',
                    delay: 250,
                    //minimumInputLength: 3,
                    data: function(params) {
                        var query = {
                            search: params.term.toLowerCase()
                        }

                        console.log('query :', query)
                        return query;
                    },
                    processResults: function(data, page) {
                        return {
                            results: data
                        };
                    }
                }
            });

            $("#contrato_servicio_beneficiario_cliente_id").change(function(){
                /* set Age in  */
                var cliente_id = $(this).val();
                $.ajax({
                    type: "GET",
                    url: "{{ asset('') . 'cliente/data/ajax/' }}" + cliente_id,
                    success: function(res) {
                        if(res.cliente_fecha_nacimiento == null){
                            $('#contrato_servicio_beneficiario_edad').val('');
                            return;
                        }
                        let fecha_nacimiento = new Date(res.cliente_fecha_nacimiento);
                        let hoy = new Date();
                        let edad = hoy.getFullYear() - fecha_nacimiento.getFullYear();
                        $('#contrato_servicio_beneficiario_edad').val(edad);
                    },
                    dataType: "json"
                });
            })

            //Initialize Select2 Elements
            //$('.select2').select2()

            $('#frmContratos').validate({
                rules: {
                    contrato_servicio_beneficiario_parentesco: {
                        required: true
                    },
                    servicio_id: {
                        required: true
                    },
                },
                messages: {
                    contrato_servicio_beneficiario_parentesco: {
                        required: "Campo parentesco es requerido"
                    },
                    servicio_id: {
                        required: "Campo servicio del contrato 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 data_encargado = $('#contrato_servicio_beneficiario_cliente_id').val();
                    console.log('data_encargado' + data_encargado);
                    if (data_encargado == null) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Advertencia',
                            text: 'Campo beneficiario es requerido',
                        });
                    } else {
                        form.submit();
                    }
                }
            });
        });


        var page = null
        listar(1)

        $(document).ready(() => {
            $(document).on('click', '.pagination a', function(event) {
                event.preventDefault()
                $('li').removeClass('active')
                $(this).parent('li').addClass('active')
                page = $(this).attr('href').split('page=')[1]
                listar(page)
            })
        })

        function listar(page) {
            let url = "{{ route('contactos-beneficiarios-Indexajax', $contrato_id) }}";
            $.ajax({
                url: url + '?page=' + page,
            }).done((data) => {
                console.log(data);
                $('#tablaContratos').html(data)
            }).fail((jqXHR, ajaxOptions, thrownError) => {
                //alert('No response from server')
            })
        }

        $('#quickForm').validate({
            /* rules: {
                tipo_identificacion: {
                    required: true,
                },
                documento: {
                    required: true,
                },
                nombres: {
                    required: true,
                },
                paterno: {
                    required: true,
                }, 
            },*/
            messages: {
                tipo_identificacion: {
                    required: "El campo tipo de indentificación es requerido.",
                },
                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');
            },
            submitHandler: function(form) {
                var validacion = '';
                var celular = $('#celular').val();
                var telefonos = $('#telefonos').val();
                var html = '';

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

                if (validacion != '') {
                    $('#alerta').html(`<div class="alert bg-warning alert-dismissible">
                                    ${validacion}
                        </div>`);
                } else {
                    saveCliente();
                }
            }

        });

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

            $.ajax({
                type: "POST",
                url: "{{ asset('') . 'beneficiario/data/save/ajax' }}",
                data: {
                    "_token": "{{ csrf_token() }}",
                    sede: sede,
                    tipo: tipo_identificacion,
                    documento: documento,
                    nombres: nombres,
                    paterno: paterno,
                    materno: materno,
                    sexo: sexo,
                    fecha: fecha_nacimiento,
                    celular: celular,
                    telefonos: telefonos,
                    observaciones: observaciones
                },
                success: function(res) {
                  /* modal hide */
                  $('#staticModal').modal('hide');
                    if (res.ok) {

                        document.getElementById("contrato_servicio_beneficiario_cliente_id").options[document
                                .getElementById("contrato_servicio_beneficiario_cliente_id").options.length] =
                            new Option(res.data.nombre, res.data.id);
                        $('#contrato_servicio_beneficiario_cliente_id').val(res.data.id).append();
                        /* calculate edad with cliente_fecha_nacimiento */

                        if(res.data.fecha_nacimiento !== null){                            
                            let fecha_nacimiento = new Date(res.data.fecha_nacimiento);
                            let hoy = new Date();
                            let edad = hoy.getFullYear() - fecha_nacimiento.getFullYear();
                            /* set in contrato_servicio_beneficiario_edad */
                            $('#contrato_servicio_beneficiario_edad').val(edad);
                        }

                        Swal.fire(
                            'Alerta',
                            'Registro almacenado con éxito!',
                            'success'
                        )
                    } else {
                        Swal.fire(
                            'Alerta',
                            'El beneficiario ya se encuentra registrado!',
                            'error'
                        )
                    }
                },
                dataType: "json"
            });
        }


        
        function deleteBeneficiario(benficiario_id){
            Swal.fire({
                title: '¿Estás seguro?',
                text: "¡No podrás revertir esto!",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Sí, eliminarlo!'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: `{{ asset('') . 'contrato_beneficiario/' }}${benficiario_id}`,
                        type: 'DELETE',
                        data: {
                            "_token": "{{ csrf_token() }}"
                        },
                        success: function (res) {
                            if (res.ok) {
                                Swal.fire(
                                    'Eliminado!',
                                    res.mensaje,
                                    'success'
                                )
                                listar(1);
                            } else {
                                Swal.fire(
                                    'Error!',
                                    res.mensaje,
                                    'error'
                                )
                            }
                        },
                        error: function (res) {
                            console.log(res);
                        }
                    });
                }
            });
        }


    </script>
@endsection