@extends('layouts.admin')

@section('styles')
<link rel="stylesheet" href="{{asset('plugins/toastr/toastr.min.css')}}">
@endsection

@section('content')
<div class="container-fluid">
   <div class="row">
      <div class="col-md-3">
         <div class="row">

            <div class="col-12">
               <div class="card">
                  <div class="card-body">
                     <h4 class="card-title text-uppercase">{{$cuadre->tipo}}</h4>
                     <p class="card-text">VALOR TOTAL: Q. {{number_format($cuadre->monto, 2)}}</p>
                     <p class="card-text">FECHA DE REGISTRO: {{$cuadre->created_at}}</p>
                  </div>
               </div>
            </div>

            <div class="col-12">
               <div class="card">
                  <div class="card-body">
                     <h4 class="card-title">NUEVA BOLETA SIN CUADRAR</h4>

                     <form action="{{route('control.storeOldAbono', $cuadre)}}" method="post" enctype="multipart/form-data">
                        @csrf

                        <input type="hidden" name="cuadre_id" value="{{$cuadre->id}}">

                        <div class="form-group">
                           <label for="">VALOR</label>
                           <input type="number" class="form-control" name="valor" step="any">
                        </div>

                        <div class="form-group">
                           <label for="">NUMERO DE REFERENCIA</label>
                           <input type="text" class="form-control" name="referencia">
                        </div>

                        <div class="form-group">
                           <label for="">CONCEPTO</label>
                           <select class="form-control" name="concepto">
                              <option value="DEDPOSITO">DEDPOSITO</option>
                              <option value="TRANSFERENCIA">TRANSFERENCIA</option>
                           </select>
                        </div>

                        <div class="form-group">
                           <label for="">FECHA DE REGISTRO</label>
                           <input type="text" class="form-control" name="created_at" value="{{$dia}}">
                        </div>

                        <div class="custom-file">
                           <input type="file" class="custom-file-input" id="customFile" name="foto">
                           <label class="custom-file-label" for="customFile">BUSCAR ARCHIVO</label>
                        </div>

                        <button type="submit" class="btn btn-success text-white" onclick="return confirm('Esta Seguro de Guardar?')"><i class="fas fa-save"></i></button>

                     </form>


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

         </div>
      </div>

      <div class="col-md-9">
         <div class="card">
            <div class="card-body">
               <div class="d-flex justify-content-md-around">
                  <div>
                     BOLETAS
                  </div>
               </div>

               <div class="row">
                  @foreach ($boletas as $b )
                  <div class="col-md-4">
                     <div class="card">
                        <img class="card-img-top" src="{{config('app.url')}}{{ Storage::url('boletas/' . $b->foto) }}" alt="">
                        <div class="card-body">
                           <h4 class="card-title">VALOR: Q. {{number_format($b->valor, 2)}}</h4>
                           <p class="card-text">NUMERO DE REFERENCIA: {{$b->referencia}}</p>
                           <p class="card-text">CONCEPTO: {{$b->concepto}}</p>
                           <p class="card-text">ACEPTADO: {{$b->acept}}</p>
                           <p class="card-text">TIPO: {{$b->user->tipo}}</p>

                           @if ($b->acept != 'SI')
                           <a class="btn btn-success" onclick="calificar( )"><i class="fa fa-check" aria-hidden="true"></i></a>

                           <form action="{{route('control.delete_boleta', $b)}}" method="post">
                              @csrf
                              @method('DELETE')
                              <button type='submit' class='btn btn-danger' onclick="return confirm('Esta Seguro de Eliminar?')"><i class='fa fa-trash' aria-hidden='true'></i></button>
                           </form>
                           @else

                           @can('admin')
                           <form action="{{route('control.delete_boleta', $b)}}" method="post">
                              @csrf
                              @method('DELETE')
                              <button type='submit' class='btn btn-danger' onclick="return confirm('Esta Seguro de Eliminar?')"><i class='fa fa-trash' aria-hidden='true'></i></button>
                           </form>
                           @endcan

                           @endif


                        </div>
                     </div>
                  </div>
                  @endforeach
               </div>
            </div>
         </div>
      </div>
   </div>
</div>

@endsection


@section('scripts')
<script src="{{asset('plugins/toastr/toastr.min.js')}}"></script>
<script>
   function calificar(boleta) {

      event.preventDefault();
      let route = "{{route('control.acept_boleta')}}"

      $.ajax({
         type: "GET",
         url: route,
         data: {
            boleta
         },
         dataType: "JSON",
         success: function(resp) {
            console.log(resp);

            toastr["success"]("BOLETA ACEPTADA", "GENIAL")
            toastr.options = {
               "closeButton": true,
               "debug": false,
               "newestOnTop": false,
               "progressBar": true,
               "positionClass": "toast-bottom-center",
               "preventDuplicates": false,
               "onclick": null,
               "showDuration": "300",
               "hideDuration": "1000",
               "timeOut": "5000",
               "extendedTimeOut": "1000",
               "showEasing": "swing",
               "hideEasing": "linear",
               "showMethod": "fadeIn",
               "hideMethod": "fadeOut"
            }
         }
      });

   }
</script>

@endsection