@extends('layouts.app')

@section('contents')
<!-- content -->
<div class="content ">

    <div class="mb-4">
        <nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a href="{{route('dashboard.index')}}">
                        <i class="bi bi-globe2 small me-2"></i> Dashboard
                    </a>
                </li>
                <li class="breadcrumb-item">
                    <a href="{{route('customers.index')}}">
                        <i class="bi bi-globe2 small me-2"></i> Customers
                    </a>
                </li>
                <li class="breadcrumb-item active" aria-current="page">Detail</li>
            </ol>
        </nav>
    </div>

    <div class="row">
        <div class="col-lg-8 col-md-12">
            <div class="card mb-4">
                <div class="card-body">
                    <div class="row mb-5 g-4">
                        <div class="col-md-3 col-sm-6">
                         {{$customer[0]['first_name'].' '.$customer[0]['last_name']}}
                         <br>
                         @foreach($emails as $email)
                         <a href="mailto:$email">{{$email}}</a>
                         @endforeach
                         <br>
                         {{$customer[0]['phone']}}
                     </div>
                 </div>
                 <div class="row g-4">
                    <div class="col-md-6 col-sm-12">
                        <div class="card">
                            <div class="card-body d-flex flex-column gap-3">
                                <div class="d-flex justify-content-between">
                                    <h5 class="mb-0">Billing Address</h5>
                                </div>
                                <div> {{$billingAddress->address1}}</div>
                                <div>{{$billingAddress->city}}</div>
                                <div>{{$billingAddress->state}}</div>
                                <div>{{$billingAddress->zip}}</div>
                                <div>{{$billingAddress->country}}</div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <div class="card">
                            <div class="card-body d-flex flex-column gap-3 ">
                                <div class="d-flex justify-content-between">
                                    <h5 class="mb-0">Shipping Address </h5>
                                </div>
                                <div>{{$shippingAddress->address1}}</div>
                                <div>{{$shippingAddress->city}}</div>
                                <div>{{$shippingAddress->state}}</div>
                                <div>{{$shippingAddress->country}}</div>
                                <div>{{$shippingAddress->zip}}</div>
                            </div>
                            
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="card widget">
   <h5 class="card-header">Invoices</h5>
   <div class="card-body">
       <div class="table-responsive">
           <table class="table table-custom mb-0">
               <thead>
                   <tr>
                       <th>Invoice Date</th>
                       <th>Order Number</th>
                       <th>Order status</th>
                       <th>Total w/o Tax</th>
                       <th>Total</th>
                   </tr>
               </thead>
               <tbody>
                <tr>
                    @foreach($datas as $data)
                    <td>{{$data->invoice_date}}</td>
                    <td><a href="{{route('order.details',$data->id)}}">{{$data->visual_id}}</a></td>
                    <td>{{$data->order_status_name}}</td>
                    <td>{{$data->order_total}}</td>
                    <td>{{$data->order_subtotal}}</td>
                </tr>
                @endforeach
            </tr>
        </tbody>
    </table>
</div>
</div>
</div>
</div>
<!-- ./ content -->
@endsection
@push('script')

@endpush