@extends('layouts.LayoutMaster')

@section('content')
@include('_partials.alerts')

<div class="card card-action mb-4  border border-">
    <div class="card-header align-items-center">
        <h5 class="card-action-title mb-0">Sac livrue</h5>
    </div>
    <div class="card-body">
        <div class="row">
            <div class="col-xl-7 col-12">
                <dl class="row mb-0">
                    <dt class="col-sm-4 mb-2 fw-medium text-nowrap">REF N° :</dt>
                    <dd class="col-sm-8">{{$shipperBox->reference}}</dd>

                    <dt class="col-sm-4 mb-2 fw-medium text-nowrap">CODE SUIVIE N° :</dt>
                    <dd class="col-sm-8">{{$shipperBox->tracking_number}}</dd>

                    <dt class="col-sm-4 mb-2 fw-medium text-nowrap">Status :</dt>
                    <dd class="col-sm-8">
                        <span class="badge rounded-pill bg-{{ $shipperBox->statusDetails()['color'] }} bg-glow">
                            {{$shipperBox->statusDetails()['name']}}
                        </span>
                    </dd>

                    <dt class="col-sm-4 mb-2 fw-medium text-nowrap">Etat des colies :</dt>
                    <dd class="col-sm-8">
                        {{$shipperBox->parcels->count()}} / {{$shipperBox->candidateParcels()}}
                    </dd>



                </dl>
            </div>
            <div class="col-xl-5 col-12">
                <dl class="row mb-0">
                    <dt class="col-sm-4 mb-2 fw-medium text-nowrap">Livreur :</dt>
                    <dd class="col-sm-8">{{$shipperBox->shipper->name}}</dd>

                    <dt class="col-sm-4 mb-2 fw-medium text-nowrap">Zone :</dt>
                    <dd class="col-sm-8">{{$shipperBox->zone->name}}</dd>

                    <dt class="col-sm-4 mb-2 fw-medium text-nowrap">Cree le :</dt>
                    <dd class="col-sm-8">{{$shipperBox->created_at}}</dd>

                    <dd class="col-sm-12">
                        @include('shipper-box.actions')
                    </dd>

                </dl>
            </div>
        </div>
    </div>
</div>

<br>


<div class="col-12">
    <div class="card mb-4">
        <h5 class="card-header">Liste des colies</h5>
        <div class="card-body">
            <div class="table-responsive text-nowrap">
                <table class="table table-bordered">

                    <thead>
                        <tr>
                            <x-table.header :withSN="false" :headers="[
                                'Code d\'envoi',
                                'Destinataire',
                                'Status',
                                'Prix',
                                ]" />
                        </tr>
                    </thead>

                    <tbody>
                        @forelse ($shipperBox->parcels as $parcel)
                        <tr>
                            <td>
                                {{$parcel->tracking_num}} <br>

                            </td>

                            <td>
                                <b>Nom : </b> {{$parcel->receiver}} <br>
                                <b>Telephone : </b> {{$parcel->phone}} <br>
                                <b>Ville : </b> {{$parcel->city->name}} <br>
                            </td>
                            <td>
                                <span class="badge rounded-pill bg-{{ $parcel->statusColor() }} bg-glow">
                                    {{$parcel->statusName()}}
                                </span>
                            </td>
                            <td>{{$parcel->price}}</td>
                        </tr>

                        @empty
                        <td>No record</td>
                        @endforelse
                    </tbody>
                </table>

            </div>
        </div>

    </div>
</div>
@endsection