@extends('backend.layouts.master')

@section('title','Order Detail')

@section('main-content')
<div class="card">
<h5 class="card-header">Order
   <!-- <a href="{{route('order.pdf',$order->id)}}" class=" btn btn-sm btn-primary shadow-sm float-right"><i class="fas fa-download fa-sm text-white-50"></i> Generate PDF</a> -->
   <div class="float-right">
   <a href="{{route('order.edit',$order->id)}}" class="btn btn-primary btn-sm float-left mr-1" style="height:30px; width:30px;border-radius:50%" data-toggle="tooltip" title="edit" data-placement="bottom"><i class="fas fa-edit"></i></a>
   </div>
  </h5>
  <div class="card-body">
    @if($order)

    @if($orderDetails)
    <h4 class="text-center pb-4">Products Details</h4>
    <table class="table table-striped table-hover">
      <thead>
        <tr>
            <th>ID</th>
            <th>Order ID.</th>
            <th>Product ID</th>
            <th>Title</th>
            <th>Size</th>
            <th>Color</th>
            <th>Image</th>
        </tr>
      </thead>
      <tbody>
      @foreach ($orderDetails as $details)
        <tr>
            <td>{{$details->id}}</td>
            <td>{{$details->order_id}}</td>
            <td>{{$details->product_id}}</td>
            <td>{{$details->title}}</td>
            <td>{{$details->size}}</td>
            <td>{{$details->color}}</td>
            <td><a href="{{$details->image}}" target="_blank"> <img width="100" height="100" src="{{$details->image}}" /> </a></td>
        </tr>
      @endforeach
      </tbody>
    </table>
    @endif

    @if($nftDetails)
    <h4 class="text-center pb-4">NFT Details</h4>
    <table class="table table-striped table-hover">
      <thead>
        <tr>
            <th>ID</th>
            <th>Order ID.</th>
            <th>Token ID</th>
            <th>Collection Address</th>
            <th>Collection Name</th>
            <th>Image</th>
        </tr>
      </thead>
      <tbody>
        <tr>
            <td>{{$nftDetails->id}}</td>
            <td>{{$nftDetails->order_id}}</td>
            <td>{{$nftDetails->token_id}}</td>
            <td>{{$nftDetails->collection_address}}</td>
            <td>{{$nftDetails->collection_name}}</td>
            <td><a href="{{$nftDetails->image}}" target="_blank"> <img width="100" height="100" src="{{$nftDetails->image}}" /> </a></td>
        </tr>
      </tbody>
    </table>
    @endif

    <section class="confirmation_part section_padding">
      <div class="order_boxes">
        <div class="row">
          <div class="col-lg-12 col-lx-12">
            <div class="shipping-info">
              <h4 class="text-center pb-4">Order INFORMATION</h4>
              <table class="table">
                    <tr class="">
                        <td>Order No</td>
                        <td> : {{$order->order_number}}</td>
                    </tr>
                    <tr class="">
                        <td>Quantity</td>
                        <td> : {{$order->quantity}}</td>
                    </tr>
                    <tr class="">
                        <td>First Name</td>
                        <td> : {{$order->first_name}}</td>
                    </tr>
                    <tr class="">
                        <td>Last Name</td>
                        <td> : {{$order->last_name}}</td>
                    </tr>
                    <tr class="">
                        <td>Email</td>
                        <td> : {{$order->email}}</td>
                    </tr>
                    <tr class="">
                        <td>Phone</td>
                        <td> : {{$order->phone}}</td>
                    </tr>
                    <tr class="">
                        <td>Country</td>
                        <td> : {{$order->country}}</td>
                    </tr>
                    <tr class="">
                        <td>Postal Code</td>
                        <td> : {{$order->post_code}}</td>
                    </tr>
                    <tr class="">
                        <td>Province</td>
                        <td> : {{$order->province}}</td>
                    </tr>
                    <tr class="">
                        <td>City</td>
                        <td> : {{$order->city}}</td>
                    </tr>
                    <tr>
                        <td>Province</td>
                        <td> : {{$order->province}}</td>
                    </tr>
                    <tr>
                        <td>House No.</td>
                        <td> : {{$order->houseNo}}</td>
                    </tr>
                    <tr>
                        <td>Address</td>
                        <td> : {{$order->address}}</td>
                    </tr>
                    <tr>
                        <td>IOSS No. (only applicable for Europe)</td>
                        <td> : {{$order->iossNumber}}</td>
                    </tr>
                    <tr>
                        <td>Created At</td>
                        <td> : {{ date('d-m-Y', strtotime($order->created_at)) }}</td>
                    </tr>
              </table>
            </div>
          </div>
        </div>
      </div>
    </section>
    @endif

  </div>
</div>
@endsection

@push('styles')
<style>
    .order-info,.shipping-info{
        background:#ECECEC;
        padding:20px;
    }
    .order-info h4,.shipping-info h4{
        text-decoration: underline;
    }

</style>
@endpush
