@extends('layouts.admin')

@section('content')
<div class='container-fluid'>
   <div class='row justify-content-center'>
      <div class='col-md-10'>
         <div class='card'>
            <div class='card-body'>
               <h4 class='card-title'>PERIFIL DE PLANILLA</h4>


               <div class="row align-items-center">
                  <div class="col-md-7 col-xl-9 order-2 order-md-1">
                     <div class="tab-content">
                        <div id="v-pills-home1" class="tab-pane fade active show">

                           <p class="text-center text-uppercase">{{$data->nombre}}</p>
                           <p class="text-center text-uppercase">Asignacion: <b>{{$data->asignacion}}</b></p>
                           <p class="text-center text-uppercase">Sueldo Mensual: <b>Q. {{number_format($data->sueldo, 2)}}</b></p>
                           <p class="text-center text-uppercase">Pago Quincenal: <b>Q. {{number_format($data->sueldo / 2, 2)}}</b></p>
                           <p class="text-center text-uppercase">Pago de Fin de Mes: <b>Q. {{number_format($data->sueldo / 2, 2)}}</b></p>



                           <div class="text-center">
                              <a class="btn btn-primary" href="{{config('app.url')}}/storage/planilla/{{$data->cv}}" role="button" target="_blank"><i class="fa fa-download" aria-hidden="true"></i> CV</a>
                           </div>

                        </div>
                        <div id="v-pills-profile1" class="tab-pane fade">

                           <form action="{{route('planilla.update', ['id' => $data->id])}}" method="post">
                              @csrf
                              @method('PUT')
                              @include('admin.planillas.forms.update')

                              <button type="submit" class="btn btn-warning"><i class="fa fa-sync"></i> ACTUALIZAR</button>
                           </form>

                        </div>
                        <div id="v-pills-messages1" class="tab-pane fade">

                           <div class="row">
                              <div class="col-md-5">
                                 <div class="card">
                                    <div class="card-body">
                                       <h3 class="card-title">HORAS EXTRAS</h3>
                                       <p class="card-text">RETORNA LAS HORAS EXTRAS POR MES</p>

                                       <form action="{{route('planilla.reportHorasMesPalan')}}" method="GET">

                                          <input type="hidden" name="planilla_id" value="{{$data->id}}">

                                          <select name="mes" class="form-control">
                                             <option selected hidden>Mes</option>
                                             <option value="01">Enero</option>
                                             <option value="02">Febrero</option>
                                             <option value="03">Marzo</option>
                                             <option value="04">Abril</option>
                                             <option value="05">Mayo</option>
                                             <option value="06">Junio</option>
                                             <option value="07">Julio</option>
                                             <option value="08">Agosto</option>
                                             <option value="09">Septiembre</option>
                                             <option value="10">Octubre</option>
                                             <option value="11">Noviembre</option>
                                             <option value="12">Diciembre</option>
                                          </select>

                                          <button type="submit" class="btn btn-info mt-3"><i class="fa fa-search" aria-hidden="true"></i> BUSCAR</button>


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

                              <div class="col-md-5">
                                 <div class="card">
                                    <div class="card-body">
                                       <h4 class="card-title">PAGOS</h4>
                                       <p class="card-text">FILTRA LOS PAGOS REALIZADOS POR FECHA</p>

                                       <form action="{{route('pago_planilla.getPagoToPlanilla')}}" method="post">
                                          @csrf

                                          <input type="hidden" name="planilla_id" value="{{$data->id}}">

                                          <div class="form-group">
                                             <label for="">De (Fecha de Inicio): </label>
                                             <input type="date" class="form-control" name="inicio" placeholder="Fecha de Inicio" required>
                                          </div>

                                          <div class="form-group">
                                             <label for="">Hasta (Fecha de Final): </label>
                                             <input type="date" class="form-control" name="fin" placeholder="Fecha de Fin" required>
                                          </div>

                                          <button type="submit" class="btn btn-success mt-3"> <i class="fa fa-search" aria-hidden="true"></i> BUSCAR</button>

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

                        </div>

                     </div>
                  </div>
                  <div class="col-md-5 col-xl-3 order-1 order-md-2 mb-3 mb-md-0">
                     <div class="nav flex-column nav-pills">
                        <a href="#v-pills-home1" data-toggle="pill" class="nav-link active show">PERFIL</a>
                        <a href="#v-pills-profile1" data-toggle="pill" class="nav-link">ACTUALIZAR</a>
                        <a href="#v-pills-messages1" data-toggle="pill" class="nav-link">REPORTES</a>
                     </div>
                  </div>
               </div>


            </div>
         </div>
      </div>
   </div>
</div>
@endsection