@if ($parcel->isNew() && Auth::user()->hasRole('client'))
<!-- Button trigger modal -->
@if (!$parcel->isValidated())
<button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal"
    data-bs-target="#attachProductToParcel{{$parcel->id}}">
    <span class="ti-xs ti ti-plus me-2"></span> Produit
</button>

@if($parcel->products()->count() > 0)

<a href="{{route('parcels.validateParcel',$parcel->id)}}" class="btn btn-success btn-sm"> <span
        class="ti-xs ti ti-check me-2"></span> Valider</a>
@endif




@endif

@if ($parcel->isValidated())
<a href="{{route('parcels.validateParcel',$parcel->id)}}" class="btn btn-warning btn-sm"> <span
        class="ti-xs ti ti-hand-open me-2"></span> Modifier</a>
@endif


<hr>
@endif


@if($parcel->products()->count() > 0)

List des produits
<section>
    <ul>
        @foreach($parcel->products as $product)
        <li>s
            {{$product->name}} X {{$product->pivot->quantity}}
        </li>
        @endforeach
    </ul>
</section>
@endif

<!-- Modal -->
<div class="modal fade" id="attachProductToParcel{{$parcel->id}}" tabindex="-1" role="dialog"
    aria-labelledby="modelTitleId" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Ajouter produit a la command de <b>{{$parcel->receiver}}</b> </h5>
                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form action="{{route('parcels.attachProduct')}}" method="post">
                    @csrf
                    <input type="hidden" name="parcel_id" value="{{$parcel->id}}">
                    <div class="row">

                        <x-form.select col="12" name="product_id" label="Produit" :options="$products" _key="id"
                            value="name" required req="true" />

                        <x-form.input col="12" type="number" label="Quantité" id="quantity" name="quantity" required
                            req="true" value="{{old('quantity')}}" />

                        <div class="col-2">
                            <label class="col-form-label">.
                            </label>
                            <x-form.button type="submit">Ajouter</x-form.button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>