@extends('masterpage.masterpage')
<!-- Content Header (Page header) -->

@section ('content')
<section class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1>Consultas</h1>
        </div>
      </div>
    </div><!-- /.container-fluid -->
  </section>
  <!-- Main content -->
  <section class="content">
    <div class="container-fluid">
      <div class="row">
        <div class="col-12">
          @if(Session::has('message'))
            <div class="alert alert-success alert-dismissible">
              <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
              <h5><i class="icon fas fa-check"></i> Alerta!</h5>
              {{ Session::get('message')}}
            </div>
          @endif
          @if(Session::has('error'))
            <div class="alert alert-danger alert-dismissible">
              <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
              <h5><i class="icon fas fa-ban"></i> Alert!</h5>
              {{ Session::get('error')}}
            </div>
          @endif
          <div class="card">
            <div class="card-header">
              <h3 class="card-title">Olá , as consultas de {{$paciente->name}}</h3>
            </div>
            <!-- /.card-header -->
            <div class="card-body">
              <table id="example1" class="table table-striped">
                <thead>
                <tr>
                  <th>Consulta</th>
                  <th>Telefone</th>
                  <th>Data</th>
                  <th style="text-align: right">Ações</th>
                </tr>
                </thead>
                <tbody>
                  @foreach ($atendimentos as $atendimento)
                  <tr>
                    <td>{{$atendimento->consulta }}</td>
                    <td>{{$atendimento->phone }}</td> 
                    <td>{{$atendimento->created_at->format('d/m/Y H:m:s') }}</td>                   
                    <td style="text-align: right">
                      <div>
                        @if(Auth::user()->perfil == 1)
                            <button  onclick="showDetails('{{$atendimento->consulta}}')" class="btn btn-primary btn-xs"><i class="fa fa-user-alt"></i></button>
                        @endif
                      </div>  
                    </td>
                  </tr>   
                @endforeach
                </tbody> 
                </tfoot>
              </table>
            </div>
            <!-- /.card-body -->
          </div>
          <!-- /.card -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </div>
    <!-- /.container-fluid -->
    
  </section>
  <!-- /.content -->
 <!-- /.modal -->

 <div class="modal fade" id="modal-client">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Status Cliente</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <input type="hidden" name="_token" id="csrf-token" value="{{ Session::token() }}" />
      </div>
      <div class="modal-body">
        <p id="detailContulta">One fine body&hellip;</p>
      </div>
      <div class="modal-footer justify-content-between">
        <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
      </div>
    </div>
    <!-- /.modal-content -->
  </div>
  <!-- /.modal-dialog -->
</div>


  @stop

 @section('scripts')
    <script>
        $(function () {
          $("#example1").DataTable({   
              "buttons": [{extend: "copy", text:'Copiar'}, "excel", "pdf", {extend: "print", text:"Imprimir"}],
              "responsive": true,
              "autoWidth": false,
              "oLanguage":{
                "sEmptyTable": "Nenhum registro encontrado",
                "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                "sInfoEmpty": "Mostrando 0 até 0 de 0 registros",
                "sInfoFiltered": "(Filtrados de _MAX_ registros)",
                "sInfoPostFix": "",
                "sInfoThousands": ".",
                "sLengthMenu": "_MENU_ Resultados por página",
                "sLoadingRecords": "Carregando...",
                "sProcessing": "Processando...",
                "sZeroRecords": "Nenhum registro encontrado",
                "sSearch": "Pesquisar ",
                "oPaginate": {
                      "sNext": "Próximo",
                      "sPrevious": "Anterior",
                      "sFirst": "Primeiro",
                      "sLast": "Último"
                }
              }
          }).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
          $('#example2').DataTable({
              "paging": true,
              "lengthChange": false,
              "searching": false,
              "ordering": true,
              "info": true,
              "autoWidth": false,
              "responsive": true,
              "oLanguage":{
                "sEmptyTable": "Nenhum registro encontrado",
                "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                "sInfoEmpty": "Mostrando 0 até 0 de 0 registros",
                "sInfoFiltered": "(Filtrados de _MAX_ registros)",
                "sInfoPostFix": "",
                "sInfoThousands": ".",
                "sLengthMenu": "_MENU_ Resultados por página",
                "sLoadingRecords": "Carregando...",
                "sProcessing": "Processando...",
                "sZeroRecords": "Nenhum registro encontrado",
                "sSearch": "Pesquisar ",
                "oPaginate": {
                      "sNext": "Próximo",
                      "sPrevious": "Anterior",
                      "sFirst": "Primeiro",
                      "sLast": "Último"
                }
              }
          });
        });
        function showDetails(detail){
          $('#detailContulta').html(detail)
          $('#modal-client').modal();
        }

        function submitStatus(id){
            var csrfToken = $('#csrf-token').val();
            var state = $('#stateSelect').val();
            var data = new FormData();
            data.append('state', state);
            data.append('id', id);
           
            fetch('{{URL('clientes/changeStatus')}}', {
              method: 'post',
              body: data,
              headers: {
                  "X-CSRF-Token": csrfToken
              },       
            }).then(function(response){
                   location.reload();
                  //return response.json();
            }).then(function(json){

                // change course

            }).catch(function(error){


            });
           
        }
    </script>
 @stop