@extends('layouts.admin')

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


@section('content')
<div class='container-fluid'>
   <div class='row justify-content-center'>
      <div class='col-md-9'>
         <div class='card'>
            <div class='card-body'>


               <div class="table-responsive">
                  <table class="table table-sm">
                     <thead>
                        <tr>
                           <th>#</th>
                           <th>COLABORADOR</th>
                           <th>ASIGNACION</th>
                           <th>FECHA</th>
                           <th>HORAS</th>
                           <th>TOTAL</th>
                           <th></th>
                        </tr>
                     </thead>
                     <tbody>
                        @foreach ($data2 as $horas )
                        <tr>
                           <td>{{$horas->id}}</td>
                           <td>{{$horas->nombre}}</td>
                           <td>{{$horas->asignacion}}</td>
                           <td>{{$horas->created_at}}</td>
                           <td>{{$horas->numero}}</td>
                           <td>Q. {{number_format($horas->numero * 10, 2)}}</td>
                           <td>
                              @can('planilla_horas_delete')
                              <form action="{{route('planilla.deleteHorasExtras', ['id' => $horas->id])}}" method="post">
                                 @csrf
                                 @method('DELETE')
                                 <button onclick="return confirm('Esta Seguo de Eliminar?')" type="submit" class="btn btn-danger"><i class="fa fa-trash" aria-hidden="true"></i></button>
                              </form>
                              @endcan
                           </td>
                        </tr>
                        @endforeach
                     </tbody>
                  </table>

                  {{$data2->links()}}

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

      @can('planilla_horas_store')

      <div class="col-md-3">
         <h4>REGISTRO DE HGORAS EXTRAS</h4>
         <form action="{{route('planilla.saveHoraExtra')}}" method="post">
            @csrf

            <select name="planilla_id" id="planilla_id" class="mb-3" required>
               @foreach ($data as $planilla)
               <option value="">SELECCIONE COLABORADOR</option>
               <option value="{{$planilla->id}}">{{$planilla->nombre}} / {{$planilla->asignacion}}</option>
               @endforeach
            </select>




            <div class="form-group">
               <label for="">NUERO DE HORAS EXTRAS</label>
               <input type="number" step="any" class="form-control" name="numero" placeholder="HORAS EXTRAS">
            </div>

            <button type="submit" class="btn btn-primary"><i class="fasfa-save fa-2x"></i> REGISTRAR</button>


         </form>
      </div>
      @endcan

   </div>
</div>
@endsection


@section('scripts')

<script src="{{asset('plugins/slim-select/slimselect.min.js') }}"></script>

<script>
   new SlimSelect({
      select: '#planilla_id',
      placeholder: 'COLABORADOR',
      deselectLabel: '<span>&times;</span>',
      hideSelectedOption: true,
   });
</script>
@endsection