@extends('layouts.app')

@section('content')

    <!-- end sidebar menu -->
    <!-- start page content -->
{{-- @dump($data)
 --}}
    <div class="page-content-wrapper">
        <div class="page-content" style="min-height:1200px">
            <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 class="active">Listar Novedades de las Asociaciones</li>
                    </ol>
                </div>
            </div>


             <!-- start widget -->
            <!-- start admited patient list -->
            <div class="row">
                <div class="col-lg-12 col-lg-12">
                    <div class="card  card-box">
                        <div class="card-head">
                            <header>Listar Novedades de las Asociaciones</header>
                        </div>
                        <div class="card-body ">
                            <div class="row">
                                <div class="col-11">
                                    <!--<a href="{{ url('usuarios/nuevo-usuario') }}" class="btn btn-info mb-3">Crear Usuario</a>&nbsp;&nbsp;-->
                                   <!-- <a onclick="limpiar()" class="btn btn-warning mb-3">Limpiar Filtro</a>-->
                                </div>
                                <div class="tools float-right">
                                    {!! Form::open(['url' => 'reportes_novedades_asociaciones','method'=>'get','id'=>'frmFiltros']) !!}
                                    <input type="hidden" id="accion" name="accion" value="1">

                                    <div class="btn-group">
                                        <a href="{{url('reportes_novedades_asociaciones')}}" class="btn btn-default dropdown-toggle">
                                            <i class="fa fa-repeat"></i>
                                        </a>
                                    </div>

                                        <a class="btn btn-primary" onclick="generar()"><i class="fa fa-download"></i></a>

                                </div>
                            </div><br>
                            <div class="table-wrap">
                                <span class="text-muted">Mostrando {{$data->firstItem()}} - {{$data->lastItem()}} de {{$data->total()}}</span>
                                <div class="table-responsive ">
                                    <table class="table display product-overview  table-bordered">
                                        <thead>
                                        <tr>
                                            <th><b>#</b></th>
                                            <th><b>Tipo Novedad</b></th>
                                            <th><b>Fecha Novedad</b></th>
                                            <th><b>Quien Atendio.</b></th>
                                            <th><b>Descripción Novedad</b></th>
                                            <th><b>Observación</b></th>
                                            <th><b>Estado llamada</b></th>
                                            <th><b>Seguimiento?</b></th>
                                            <th><b>Ultima Fecha modificación</b></th>
                                            <th><b>Ultimo Usuario Modifica</b></th>
                                            <th><b>Resuelto?</b></th>

                                        </tr>

                                        <tr>
                                            <th></th>

                                            <th>
                                                {{-- novedad --}}
                                                {!! Form::select('novedad',$novedades,$novedad,['id'=>'novedad','class'=>'form-control select2','style'=>'width: 100%;','onchange'=>"buscar('novedad')",'placeholder'=>'novedades']) !!}
                                            </th>

                                            <th>
                                                {!! Form::text('fecha_novedad',$fecha_novedad,['id'=>'fecha_novedad','class'=>'form-control','placeholder'=>'Fecha Novedad']) !!}
                                            </th>
                                            <th>
                                                {!! Form::text('atendido_por',$atendido_por,['id'=>'atendido_por','class'=>'form-control','placeholder'=>'Quien atendio?','onchange '=>"buscar('atendido_por')"]) !!}
                                            </th>
                                            <th>
                                                {!! Form::text('descripcion',$descripcion,['id'=>'descripcion','class'=>'form-control','placeholder'=>'Descripción','onchange '=>"buscar('descripcion')"]) !!}
                                            </th>
                                            <th>
                                                {!! Form::text('observacion',$observacion,['id'=>'observacion','class'=>'form-control','placeholder'=>'Observación','onchange '=>"buscar('observacion')"]) !!}
                                            </th>
                                            <th>

                                                {!! Form::select('estado_llamada', $estados_llamada,$estado_llamada,['id'=>'estado_llamada','class'=>'form-control select2','style'=>'width: 100%;','onchange'=>"buscar('estado_llamada')",'placeholder'=>'Estado llamdada']) !!}
                                            </th>
                                            <th>
                                                {!! Form::select('seguimiento', ['1'=>'Si','2'=>'No'], $seguimiento, ['id'=>'seguimiento','placeholder' => '-Seleccionar-','class'=>'form-control select2','style'=>'width: 80%;','onchange'=>"buscar('seguimiento')"])  !!}
                                            </th>
                                            <th>
                                                {!! Form::text('fecha_modificado',$fecha_modificado,['id'=>'fecha_modificado','class'=>'form-control','placeholder'=>'Ultima fecha de modificación']) !!}
                                            </th>
                                            <th>
                                                {!! Form::text('username',$username,['id'=>'username','class'=>'form-control','placeholder'=>'Username','onchange '=>"buscar('username')"]) !!}
                                            </th>
                                            <th>
                                                {{-- {!! Form::text('resuelto',$resuelto,['id'=>'resuelto','class'=>'form-control','placeholder'=>'Resuleto','onchange '=>"buscar('resuelto')"]) !!} --}}

                                                {!! Form::select('resuelto', ['1'=>'Si','2'=>'No'], $resuelto, ['id'=>'resuelto','placeholder' => '-Seleccionar-','class'=>'form-control select2','style'=>'width: 80%;','onchange'=>"buscar('resuelto')"])  !!}
                                            </th>


                                            {!! Form::close() !!}
                                        </tr>


                                        <tbody>

                                            @if(count($data)>0)
                                            @foreach($data as $item)
                                                <tr>
                                                    <td>
                                                        {{ $contador++ }}
                                                    </td>
                                                    <td>
                                                        {{ $item->tipo_comunicacion_descripcios }}
                                                    </td>

                                                    <td>
                                                        @if ($item->cli_ent_nov_fecha_novedad)
                                                        {{ date('d-m-Y', strtotime($item->cli_ent_nov_fecha_novedad))   }}
                                                        @else
                                                        <span class="text-danger"></span>
                                                        @endif
                                                    </td>

                                                    <td>
                                                        {{ $item->cli_ent_nov_atentidopor }}
                                                    </td>

                                                    <td @if(Str::length($item->cli_ent_nov_descripcion)>50) class="resumen" data-texto-completo="{{ $item->cli_ent_nov_descripcion }}" @endif>
                                                        @if ($item->cli_ent_nov_descripcion)
                                                            {{ Str::limit($item->cli_ent_nov_descripcion, 50) }}
                                                        @else
                                                            <span class="text-danger"></span>
                                                        @endif
                                                    </td>
                                                    {{-- <td>
                                                        {{ $item->cli_ent_nov_descripcion }}
                                                    </td> --}}
                                                    <td @if(Str::length($item->cli_ent_nov_observacion)>50) class="resumen" data-texto-completo="{{ $item->cli_ent_nov_observacion }}" @endif>
                                                        @if ($item->cli_ent_nov_observacion)
                                                            {{ Str::limit($item->cli_ent_nov_observacion, 50) }}
                                                        @else
                                                            <span class="text-danger"></span>
                                                        @endif
                                                    </td>
                                                    {{-- <td>
                                                      {{ $item->cli_ent_nov_observacion?$item->cli_ent_nov_observacion:'' }}
                                                    </td> --}}
                                                    <td>
                                                        {{ $item->tipo_estado_llamada_descripcion?$item->tipo_estado_llamada_descripcion:'' }}
                                                    </td>

                                                    @if ($item->cli_ent_nov_seguimiento == "1")
                                                        <td>
                                                            Si
                                                        </td>
                                                    @elseif($item->cli_ent_nov_seguimiento == "2")
                                                        <td>
                                                            No
                                                        </td>
                                                    @endif


                                                    <td>
                                                        @if ($item->cli_ent_nov_fecharegistro)
                                                        {{ date('d-m-y', strtotime($item->cli_ent_nov_fecharegistro)) }}
                                                        @else
                                                            <span class="text danger"></span>
                                                        @endif

                                                    </td>

                                                    <td>
                                                        {{ $item->username }}
                                                    </td>

                                                    @if ($item->cli_ent_nov_estado == '1')
                                                        <td>Si</td>
                                                    @else
                                                        <td>No</td>
                                                    @endif


                                                </tr>

                                            @endforeach
                                            @else
                                            <tr>
                                                <td colspan="14" class="text-center">No se encontraron resultados.</td>
                                            </tr>
                                            @endif

                                        </tbody>
                                    </table>
                                </div>
                            </div>

                        </div>

                        <div class="card-footer">
                            <div class="float-right">
                                {{ $data->appends(['novedad'=>$novedad, 'fecha_novedad'=>$fecha_novedad, 'atendido_por'=>$atendido_por, 'descripcion'=>$descripcion, 'observacion'=>$observacion,'estado_llamada'=>$estado_llamada,'seguimiento'=>$seguimiento,'fecha_modificado'=>$fecha_modificado, 'username'=>$username, 'resuelto'=>$resuelto ])->links() }}
                            </div>


                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
     {{-- Modal --}}
     <div class="modal" id="modal">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-body">
              <!-- Aquí se mostrará el contenido resumido del <td> -->
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-primary" data-dismiss="modal">Cerrar</button>
            </div>
          </div>
        </div>
      </div>
@endsection


@section('script')
    <script type="text/javascript">

        function generar(){
            $('#accion').val(2);
            document.getElementById("frmFiltros").submit();
        }


        function buscar(tipo){

            $('#accion').val(1);
            var textoSelect = $('#'+tipo).val();
            const ENTER_KEY_CODE = 13;

            switch(tipo){

                /* case 'resuelto':
                    document.querySelector('#resuelto').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break; */

                case 'username':
                    document.querySelector('#username').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break;

                case 'fecha_modificado':
                    document.querySelector('#fecha_modificado').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break;

                case 'fecha_novedad':
                    document.querySelector('#fecha_novedad').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break;

                case 'atendido_por':
                    document.querySelector('#atendido_por').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break;

                case 'descripcion':
                    document.querySelector('#descripcion').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break;

                case 'observacion':
                    document.querySelector('#observacion').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break;
               /*  case 'estado_llamada':
                    document.querySelector('#estado_llamada').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break; */
                /* case 'seguimiento':
                    document.querySelector('#seguimiento').addEventListener('keyup', function(e) {
                        if (e.keyCode === ENTER_KEY_CODE) {
                            document.getElementById("frmFiltros").submit();
                        }
                    });
                break; */


                default:
                    document.getElementById("frmFiltros").submit();
                break;
            }

        }

        $(document).ready(function(){

            let fecha_novedad = @json($fecha_novedad);


if (fecha_novedad != null) {
    let fechas = fecha_novedad.split(' - ')
    var fecha_inicio = fechas[0];

    var fecha_fin = fechas[1];

    $('input[name="fecha_novedad"]').daterangepicker({
    //timePicker: true,
    startDate: fecha_novedad != null ? fecha_inicio : '',
    endDate: fecha_novedad != null ? fecha_fin : '',
    locale: {
        format: 'DD-MM-YYYY'
    }
});

}else{
    $('input[name="fecha_novedad"]').daterangepicker({
    //timePicker: true,
    locale: {
        format: 'DD-MM-YYYY'
    }
});

$('input[name="fecha_novedad"]').val('');
$('input[name="fecha_novedad"]').attr('placeholder', moment().format('DD-MM-YYYY')+' '+moment().format('DD-MM-YYYY'));

}

$('input[name=fecha_novedad]').on('apply.daterangepicker', function() {
    console.log($(this).val());
    if ($(this).val() != '') {
        document.getElementById("frmFiltros").submit();
    }

})

//



let fecha_modificado = @json($fecha_modificado);


if (fecha_modificado != null) {
    let fechas = fecha_modificado.split(' - ')
    var fecha_inicio = fechas[0];

    var fecha_fin = fechas[1];

    $('input[name="fecha_modificado"]').daterangepicker({
    //timePicker: true,
    startDate: fecha_modificado != null ? fecha_inicio : '',
    endDate: fecha_modificado != null ? fecha_fin : '',
    locale: {
        format: 'DD-MM-YYYY'
    }
});

}else{
    $('input[name="fecha_modificado"]').daterangepicker({
    //timePicker: true,
    locale: {
        format: 'DD-MM-YYYY'
    }
});

$('input[name="fecha_modificado"]').val('');
$('input[name="fecha_modificado"]').attr('placeholder', moment().format('DD-MM-YYYY')+' '+moment().format('DD-MM-YYYY'));

}

$('input[name=fecha_modificado]').on('apply.daterangepicker', function() {
    console.log($(this).val());
    if ($(this).val() != '') {
        document.getElementById("frmFiltros").submit();
    }

})

        //modal direccion completa
        $('.resumen').on('click', function() {
    var content = $(this).data('texto-completo');
    $('.modal-body').html(content);
    $('#modal').modal('show');
  });

  // Cierra el modal
  $('.modal-footer').on('click', 'button', function() {
    $('#modal').modal('hide');
  });

        })

    </script>
@endsection