@extends('adm.index')
@section('productos','active')
@section('productos_true','true')
@section('productos_show','show')
@section('productos_collapsed','collapsed')
@section('form')

<style>
    form{
        margin-bottom: 40px !important;
        height: 100%;
    }
    main{
        max-height: none;
    }
</style>

<div class="container">
    <div class="row">
        <div class="col-12">
            <div class="d-flex justify-content-between">
                <h2>Listado de productos</h2>
                <div>
                    <button type="button" class="btn btn-success" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
                        Subir lista de precios
                    </button>
                    <a href="{{route('crearProducto')}}" class="btn btn-success" >Agregar producto</a>
                </div>
            </div>
        </div>
        <div class="col-12">
            <table class="table">
                <thead>
                    <tr>
                        <th scope="col">Orden</th>
                        <th scope="col">Nombre</th>
                        <!-- <th scope="col">Categor&iacute;a</th> -->
                        <th scope="col">Foto</th>
                        <th scope="col">Acci&oacute;n</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach($productos as $producto){ ?>
                        <tr>
                            <td><?= $producto->orden ?></td>
                            <td><?= $producto->nombre ?></td>
                            <td>
                                <?php if($producto->foto){ ?>
                                    <img src="{{asset(Storage::url($producto->foto))}}" class="img-thumbnail" style="width: 200px; height: 200px;">
                                <?php } ?>
                            </td>
                            <td>
                                <a class="btn btn-warning" role="button" href="<?= route('editarProducto', ['id' => $producto->id]) ?>">
                                    Editar producto
                                </a>
                                <a class="btn btn-danger" role="button" href="<?= route('eliminarProducto', ['id' => $producto->id]) ?>">
                                    Eliminar producto
                                </a>
                            </td>
                        </tr>
                    <?php } ?>
                </tbody>
            </table>
        </div>
    </div>
</div>
<div class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h1 class="modal-title fs-5" id="staticBackdropLabel">Subir lista de precios</h1>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <form action="{{ route('subirCatalogo') }}" method="POST" enctype="multipart/form-data">
            @csrf
            <div class=" mb-3">
                <label for="formFile" class="form-label">Cat&aacute;logo</label>
                <input class="form-control" type="file" id="formFile" name="lista" required>
            </div>
            <button type="submit" class="btn btn-primary">Subir lista de precios</button>
        </form>
      </div>
    </div>
  </div>
</div>

@endsection