@extends('base')
@section('title')
    reserva
@endsection
@section('content')

    @include('sessions')


    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item " aria-current="page"><a href="{{route('file.index')}}">Listado Files</a></li>

            <li class="breadcrumb-item active" aria-current="page">Listado de reservas</li>
        </ol>
    </nav>

    <div class="d-sm-flex align-items-center justify-content-between mb-4">
        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addModal">
            Agregar Reserva
        </button>
    </div>

    <table class=" table">
        <thead class="thead-dark">
            <tr>
                <th scope="col">Item</th>
                <th scope="col">Codigo Proveedor</th>
                <th scope="col">Nombre</th>
                <th scope="col">Monto Reserva</th>
                <th scope="col">Acciones</th>
            </tr>
        </thead>
        <tbody>

            @foreach ($reservas as $reserva)
                <tr>
                    <td>{{$reserva->id }}</td>
                    <td>{{ $reserva->supplier->nombreProveedor }}</td>
                    <td>{{ $reserva->supplier->codProveedor }}</td>
                    <td>${{ number_format($reserva->monto,2)  }}</td>
                    <td style="display: flex">

                        <a title="Detalle PDF" class="ki-outline ki-note-2 fs-2x text-danger-emphasis mx-2"
                            style="background-color:transparent; border: 0px solid;"
                            target="_blank" href="{{ route('reserva.reporte', $reserva->id) }}"></a>

                            <button type="button" title="Editar" data-toggle="modal" data-target="#editModal"
                            class="ki-outline ki-pencil fs-2 text-dark"
                            style="background-color:transparent; border: 0px solid;"
                            onclick="fun_edit('{{ $reserva->id }}')"></button>


                    </td>
                </tr>
            @endforeach
        </tbody>
    </table>

    <!-- Agregar Modal -->
    @include('solicitudReserva.modals.addReservaModal')
    <!-- Fin Agregar Modal -->
    <div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalTitle"
    aria-hidden="true">
    <div class="modal-dialog" role="document">
       <div class="modal-content">
          <div class="modal-header bg-light">
             <h5 class="modal-title" id="exampleModalLongTitle">
                <i class="ki-outline ki-plus fs-2"></i>
                Agregar cotizacion
             </h5>
            <button type="button" class="btn btn-icon btn-sm btn-active-light-danger ms-2" data-bs-dismiss="modal" aria-label="Close">
                <i class="ki-outline ki-cross fs-1"></i>
            </button>
          </div>
          <div class="modal-body">
             <form action="{{ route('reserva.update') }}" method="POST" name="miForm">
                @csrf
                <div class="form-group required">
                   <br>
                   <label for="fecha_pago" class="control-label">Fecha de pago: </label>
                  <input type="date" name="fecha_pago" id ="fecha_pago" class="form-control">

                </div>
             <div class="form-group required">
                 <label for="fecha_pago" class="control-label">Proveedor: </label>
                 <select name="supplier_id" id="supplier_id" class="form-control" required>
                     @foreach ($proveedores as $proveedor)
                     <option value="{{ $proveedor->id }}">{{ $proveedor->nombreProveedor }}</option>
                     @endforeach
                  </select>
              </div>

              <div class="form-group required">
                 <label for="monto" class="control-label">Monto: </label>
                 <input type="number" step="0.01" placeholder="0.00" name="monto" id = "monto" class="form-control">

              </div>

              <div class="form-group required">
                 <label for="observaciones" class="control-label">Observaciones: </label>
                 <textarea name="observaciones" id ="observaciones" class="form-control"  cols="30" rows="10"></textarea>

              </div>
                     <input type="hidden" name="creado_por" value="{{auth()->user()->name}}">
                     <input type="hidden" name="file_id" value="{{$file->id}}">
                     <input type="hidden" name="edit_id" id="edit_id">


                <div class="modal-footer d-flex justify-content-center">
                   <button type="submit" class="btn btn-primary">
                      <i class='ki-outline ki-check-circle fs-2'></i>
                      Guardar
                   </button>
                   <a href="" class="btn btn-primary" data-dismiss="modal">
                      <i class='ki-outline ki-cross-circle fs-2'></i>
                      Cancelar
                   </a>
                </div>
             </form>
          </div>
       </div>
    </div>
 </div>


    <script>
        function fun_notificacion(id) {
            $("#idBL").val(id);
        }
    </script>

@endsection

@section('extrajs')

    <script type="text/javascript">
        function getreservaId(id) {
            $("#idreserva").val(id);
        }
        //Limpiar los campos de la modal de traslados
        function limpiarCampos() {
            $('#nombre_cotizacion').val(''); //Limpiando el input
            $("#categoria_id").val(""); //Seleccionando la primera opción del select
        }


        function fun_edit(id) {
            var view_url = '{{ route('reserva.edit', ':id') }}';
            view_url = view_url.replace(':id', id);
            $.ajax({
                url: view_url,
                type: "GET",
                data: {
                    "id": id
                },
                success: function(result) {
                    console.log(result.nombre_cliente);
                    $("#edit_id").val(result.id);

                    $("#fecha_pago").val(result.fecha_pago);
                    $('#supplier_id').val(result.supplier_id);
                    $('#monto').val(result.monto);
                    $('#observaciones').val(result.observaciones);
                    Console.log(result);
                }
            });
        }
    </script>

@endsection