<div class="tab-pane {{$tab == 'packing' ? 'active' : ''}}" id="packing" role="tabpanel"
        aria-labelledby="packing-tab">
    <div class="row justify-content-center mb-3">
        <div class="col-9">
            <div class="d-flex flex-row gap-2">
                {{--                                <button class="btn btn-sm btn-danger" title="Remove a contact..."--}}
                {{--                                        data-bs-toggle="modal" data-bs-target="#deleteContactModal">--}}
                {{--                                    <x-bi-trash-fill/>--}}
                {{--                                    Delete entry--}}
                {{--                                </button>--}}

                <button class="btn btn-sm btn-primary" title="Create new packing slip..."
                        data-bs-toggle="modal" data-bs-target="#createPackingSlipModal">
                    <x-bi-plus-circle-fill/>
                    Create entry
                </button>

                <div class="mx-auto"></div>

                {{--                                <div class="vr"></div>--}}

                <div class="d-inline-flex gap-2">
                    <input type="text" class="form-control form-control-sm" placeholder="Search..."
                            name="" id="searchText">
                    <button class="btn btn-sm btn-outline-primary" id="searchButton">
                        <x-bi-search/>
                    </button>
                </div>
            </div>
        </div>
    </div>

    <div class="row justify-content-center mb-3">
        <div class="col-7">
            <table class="table table-striped table-sm table-hover">
                <thead>
                <tr class="border-bottom border-black">
                    <th scope="col">Date</th>
                    <th scope="col">PO</th>
                    <th scope="col">Amount</th>
                    <th scope="col">Contents</th>
                </tr>
                </thead>
                <tbody>
                @foreach($packingSlips as $packingSlip)
                    <tr>
                        <td class="text-nowrap">{{$packingSlip->date_received}}</td>
                        <td class="text-nowrap"><a href="">{{$packingSlip->order_id}}</a></td>
                        <td class="text-nowrap">{{$packingSlip->amount}}</td>
                        <td class="w-50">{{$packingSlip->contents}}</td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    </div>

    <div class="row">
        <div class="col"></div>
        <div class="col-4">
            {{$packingSlips->links()}}
        </div>
        <div class="col"></div>
    </div>

</div>