@extends('layout.master')
@section('parentPageTitle', 'Profesionales')
@section('title', 'Citas confirmadas')
@section('page-style')
<link rel="stylesheet" href="{{asset('assets/plugins/jquery-datatable/dataTables.bootstrap4.min.css')}}">
@stop

@section('content')


<meta name="csrf-token" content="{{ csrf_token() }}">

    <div class="row clearfix">
        <div class="col-md-12">
            <div class="card patients-list">
                <div class="header">
                    <h2><strong>Citas confirmadas</strong> </h2>
                    <ul class="header-dropdown">
                        <li class="dropdown"> <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <i class="zmdi zmdi-more"></i> </a>
                            <ul class="dropdown-menu dropdown-menu-right slideUp">
                                <li><a href="ingresar">Nuevo</a></li>
                            </ul>
                        </li>
                        <li class="remove">
                            <a role="button" class="boxs-close"><i class="zmdi zmdi-close"></i></a>
                        </li>
                    </ul>
                </div>
                <div class="body">
                    <!-- Nav tabs -->
                    
          
                        
                    <!-- Tab panes -->
                    <div class="tab-content m-t-10">
                        <div class="tab-pane table-responsive active" id="All">
                                                        <table class="table m-b-0 table-hover" id="tabla1" name="tabla1">
                                <thead>
                                    <tr>                                       
                                        <th>Fecha</th>
                                        <th>Hora agendanda</th>
                                        <th>Paciente</th>
                                        <th>Estado</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($data as $cita)
                                    <tr>
                                        <td>{{ $cita->fecha }}</td>
                                        <td>{{ $cita->hora_ini }}</td>
                                        <td>{{ $cita->paciente_nombre }} {{$cita->paciente_apellidopaterno}} {{$cita->paciente_apellidomaterno}}</td>
                                        <td> 
                                            <button type="button" class="btn btn-warning" id="reagendar{{$cita->id}}" name="reagendar{{$cita->id}}" onclick="reagendarCita('{{$cita->id}}')"  disabled='disabled'>Re-agendar</button>
                                            <button type="button" class="btn btn-danger" id="rechazar{{$cita->id}}" name="rechazar{{$cita->id}}" onclick="rechazarCita('{{$cita->id}}')"  disabled='disabled'>Rechazar</button>
                                        </td>
                                    </tr>
                                    @endforeach                                                                          
                                </tbody>
                            </table>
                        </div>


                    </div>
                </div>
            </div>
        </div>
    </div>
    
    

@stop

@section('page-script')
<script src="{{asset('assets/bundles/datatablescripts.bundle.js')}}"></script>

<script>


function reagendarCita(id){

    var token = $('meta[name="csrf-token"]').attr('content');
    var url='ajax_cita_seleccionada';
    var data={"id" : id};

    $.ajax({
        type:'POST',
        url: url,
        data: data,
        headers: {
            'X-CSRF-TOKEN': token
        },
        success:function(data){
            window.location.href = "reagendamiento";
        }
    });         

}

function rechazarCita(id){

    var token = $('meta[name="csrf-token"]').attr('content');
    var url='ajax_rechazar_cita';
    var data={"id" : id};

    $.ajax({
        type:'POST',
        url: url,
        data: data,
        headers: {
            'X-CSRF-TOKEN': token
        },
        success:function(data){
            //alert(data);
            $("#rechazar"+id).attr("disabled", "disabled");              
            $("#estado"+id).attr("disabled", "disabled");           
            $("#reagendar"+id).attr("disabled", "disabled");  

            //window.location.href = "configurar_horario";
        }
    });         

}

function confirmarCita(id, estado){
    var token = $('meta[name="csrf-token"]').attr('content');
    var data={"id" : id, "estado" : estado};

    $.ajax({
        type:'POST',
        url: 'ajax_confirmar_cita_elegida',
        data: data,
        headers: {
            'X-CSRF-TOKEN': token
        },
        success:function(data){
            //alert(estado);
            if(data==1){
                $("#estado"+id).text("Pendiente");
                $("#estado"+id).attr("onclick", "confirmarCita('"+id+"', '1')");                
                //$("#"+id).attr("class", "btn btn-info");
            }else{
                $("#estado"+id).text("Confirmada");
                $("#estado"+id).attr("onclick", "confirmarCita('"+id+"', '2')");
                //$("#"+id).attr("class", "btn btn-success");
            }
        }
    });
}



$(document).ready(function() {
    $('#tabla1').DataTable({
        "language": {
            "lengthMenu": "Listar _MENU_ ",
            "zeroRecords": "Aún no tiene registros",
            "info": "Página _PAGE_ de _PAGES_",
            "infoEmpty": "",
            "Search": "Buscar",
            "infoFiltered": "(filtered from _MAX_ total records)",
            "search": "Buscar"
        },
        "order": [[ 0, "asc" ]]
    });
} );
</script>
@stop