@extends('layouts.app')
@section('css')
  <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.0/css/bootstrap-datepicker.css" rel="stylesheet">
@endsection
@section('header')
    <div class="page-header">
        <h1><i class="glyphicon glyphicon-edit"></i> Charola / Refrigerador #{{$tray->refrigerator->id}} / Editar charola</h1>
    </div>
@endsection

@section('content')
    @include('error')

    <div class="row">
        <div class="col-md-12 hidden">

            <form action="{{ route('trays.update', $tray->id) }}" method="POST">
                <input type="hidden" name="_method" value="PUT">
                <input type="hidden" name="_token" value="{{ csrf_token() }}">

                <div class="form-group @if($errors->has('position')) has-error @endif">
                    <label for="position-field">Position</label>
                    <input type="text" id="position-field" name="position" class="form-control" value="{{ is_null(old("position")) ? $tray->position : old("position") }}"/>
                    @if($errors->has("position"))
                    <span class="help-block">{{ $errors->first("position") }}</span>
                    @endif
                </div>
                <div class="well well-sm">
                    <a class="btn btn-link" href="{{ route('trays.index') }}"><i class="glyphicon glyphicon-backward"></i>  Regresar</a>
                    <button type="submit" class="btn btn-primary">Actualizar</button>
                </div>
            </form>

        </div>
    </div>

    <div class="row">
        <div class="col-md-12">
            <a href="{{route('refrigerators.edit', $tray->refrigerator->id)}}" class="btn btn-lg btn-default">Regresar a detalles del refrigerador</a>
            <hr>
            <h2>Productos en la charola</h2>

            @if($tray->products->count() > 0)
            @foreach($tray->products as $i => $product)
            <table class="table table-bordered" style="table-layout: fixed;">
                <tr>
                    <th>Producto {{$i + 1}}</th>
                    <td>{{$product->name}}</td>
                    <td><img src="{{$product->image}}" style="max-height: 50px;" class="img-responsive"></td>
                    <td class="text-right">
                        <form action="{{ route('products.remove', $product->pivot->id) }}" method="POST" style="display: inline;" onsubmit="if(confirm('Eliminar? Estás seguro?')) { return true } else {return false };">
                            <input type="hidden" name="_method" value="DELETE">
                            <input type="hidden" name="_token" value="{{ csrf_token() }}">
                            <input type="hidden" name="tray_id" value="{{$tray->id}}">
                            <button type="submit" class="btn btn-sm btn-danger"><i class="glyphicon glyphicon-trash"></i> Eliminar</button>
                        </form>
                    </td>
                </tr>
            </table>
            @endforeach
            @else
            <p class="alert alert-info">No hay productos en la charola</p>
            @endif
            <div>
                <hr>
                <form action="{{ route('products.add') }}" method="POST">
                    <div class="row">
                        <div class="col-md-8">
                            <div class="form-group">
                                <label for="product-field">Producto</label>
                                {{ Form::select('product_id', $products, null, ['class'=> 'form-control']) }}
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="quantity-field">Cantidad</label>
                                {{ Form::select('quantity', $qs, null, ['class'=> 'form-control']) }}
                            </div>
                        </div>
                        <div class="col-md-12">
                            <input type="hidden" name="_token" value="{{ csrf_token() }}">
                            <input type="hidden" name="tray_id" value="{{$tray->id}}">
                            <button type="submit" class="btn btn-sm btn-primary">Agregar producto(s)</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection
@section('scripts')
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.0/js/bootstrap-datepicker.min.js"></script>
  <script>
    $('.date-picker').datepicker({
    });
  </script>
@endsection