@extends('layouts.master-horizontal')
@section('title') Facedra @endsection
@section('css')
    <!-- DataTables -->
    <link href="{{ URL::asset('assets/libs/datatables/datatables.min.css')}}" rel="stylesheet" type="text/css" />
    <link href="{{ URL::asset('assets/css/bootstrap.min.css')}}" id="bootstrap-style" rel="stylesheet" type="text/css" />
	<link href="{{ URL::asset('assets/css/app.min.css')}}" id="app-style" rel="stylesheet" type="text/css" />
    <link href="{{ URL::asset('assets/libs/sweetalert2/sweetalert2.min.css')}}" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
@endsection
@section('content')
@component('common-components.breadcrumb')
    @slot('pagetitle') Gestion Usuarios @endslot
    @slot('title') <a href="{{Route('dashboard')}}"> Menu principal </a> / Administración de Usuarios @endslot
@endcomponent
<div class="row">
	<div class="col-12">
		<div class="card">
			<div class="card-body">
				<h4 class="card-title">Filtros</h4>
                <hr>
                <div class="form-group row">
                    <label class="col-md-2 col-form-label" for="password">Código: </label>
                    <div class="col-md-4">
                        <input type="text" class="form-control" id="codigo" name="codigo" placeholder="Código de Usuario">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-md-2 col-form-label" for="nombre">Nombre: </label>
                    <div class="col-md-4">
                        <input type="text" class="form-control" id="nombre" name="nombre" placeholder="Nombre del Usuaurio">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-md-2 col-form-label" for="nombre">Correo electrónico: </label>
                    <div class="col-md-5">
                        <input type="email" class="form-control" id="email" name="email" placeholder="Correo electrónico">
                    </div>
                </div>
				@include('flash::message')
                <div class="button-items">
                    <a href=""> 
                        <button type="button" class="btn btn-primary waves-effect waves-light">
                            Buscar

                        </button>
                    </a>
                    <button id="ButtonLimpiar" type="button" class="btn btn-primary waves-effect waves-light" >
                        Limpiar Filtros
                    </button>
                    <a href="{{url("usuarios/create")}}" target="_blank">
                        <button id="Btnalta" type="button" class="btn btn-primary waves-effect waves-light">
                            Alta de Aplicacion
                        </button>
					</a>
                </div>
				<br>
                <div class="table-responsive">
                    <table id="datatable" class="table table-bordered dt-responsive nowrap yajra-datatable" style="border-collapse: collapse; border-spacing: 0; width: 100%;">
                        <thead>
							<tr>
                                <th>Código</th>
                                <th>Nombre Completo</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @forEach($usuarios as $item)
                            <tr class="filas">
                                <td>{{$item->USUA_CODIGO_USUARIO}}</td>
                                <td>{{$item->USUA_NOMBRE}}</td>
                                <td>
                                    <button type="button" class="btn btn-primary" onclick="editar({{$item->USUA_ID_USUARIO}})">Editar <i class='uil-edit ml-2'></i></button>
                                    <button type="button" class="btn btn-danger"  onclick="eliminar({{$item->USUA_ID_USUARIO}})">Eliminar <i class='mdi mdi-delete'></i></button>
                                </td>          
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('script')  
    <script src="{{ URL::asset('assets/libs/datatables/datatables.min.js')}}"></script>
    <script src="{{ URL::asset('assets/js/pages/datatables.init.js')}}"></script>
    
    <!-- Sweet Alerts js -->
    <script src="{{ URL::asset('assets/libs/sweetalert2/sweetalert2.min.js')}}"></script>
    <!-- Range slider init js-->
	<script src="{{ URL::asset('assets/js/pages/sweet-alerts.init.js')}}"></script> 
    <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
    <script>
        
        var table;
        var l_Item;
        $(document).ready(function() {
            /*
            table = $('.yajra-datatable').DataTable({
            select: true,
            "order": [[ 0, "desc" ]],
            language:{url:'https://cdn.datatables.net/plug-ins/1.10.20/i18n/Spanish.json'},
            processing: true,
            serverSide: true,
            "ajax": {
                "url": "",
                "dataType": "json",
                "type": "GET",

            },
            "columns": [
                {data: 'id_paciente', orderable: true, searchable: false},
                {data: 'documento_identificacion'},
                {data: 'numero_expediente'},
                {data: 'codigo_paciente'},
                {data: 'id_sexo_nominal'},
                {data: 'post',orderable: false, searchable: false},
            
            ],
            
            //Configuracion Inicial
                
                "lengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, 'Todos  * ']],
                
            });


            table.on( 'select', function ( e, dt, type, indexes ) {
               var rowData = table.rows( indexes ).data().toArray();
               l_Item = table.rows({ selected: true }).data()[0];
               seleccion(l_Item.id_paciente)
           });*/
         });
         $('#codigo').autocomplete({
            source: function(request, response){
                $.ajax({
                    url:"{{route('usuarios.getcodigo')}}",
                    type: 'GET',
                    dataType:'json',
                    data:{
                        term:request.term
                    },
                    success:function(data){

                        response(data)
                    }
                });
            }
        });
        $('#nombre').autocomplete({
            source: function(request, response){
                $.ajax({
                    url:"{{route('usuarios.getnombre')}}",
                    type: 'GET',
                    dataType:'json',
                    data:{
                        term:request.term
                    },
                    success:function(data){

                        response(data)
                    }
                });
            }
        });
        $('#email').autocomplete({
            source: function(request, response){
                $.ajax({
                    url:"{{route('usuarios.getemail')}}",
                    type: 'GET',
                    dataType:'json',
                    data:{
                        term:request.term
                    },
                    success:function(data){

                        response(data)
                    }
                });
            }
        });
        $('#ButtonLimpiar').click(function() {
            $('input[type="text"]').val('');
            $("#email").val('');
        });
        function eliminar(id){
            Swal.fire({
                title: 'Estas seguro de eliminar el registro?',
                text: 'No podras deshacer esta accion',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: 'Yes',
                cancelButtonText: 'No'
                }).then((result) => {
                if (result.value) {
                    Swal.fire(
                    'Eliminado!',
                    'Registro eliminado',
                    'success'
                    )
                    window.location.href = "{{ url('usuarios/destroy') }}/"+id;
                } else if (result.dismiss === Swal.DismissReason.cancel) {
                    Swal.fire(
                    'Cancelado',
                    'El registro no fue eliminado :)',
                    'error'
                    )
                    
                }
                })      
        }
        function editar(id){
            window.location.href = "{{ url('usuarios/edite') }}/"+id;
        }
    </script>
@endsection