@extends('merchant.layouts.master')

@section('content')

    <!-- End of Topbar -->
    <div id="app">
        <!-- Begin Page Content -->
        <div class="container-fluid">


            <div class="row">
                <div class="col-sm-4">
                    <!-- Page Heading -->
                    <h1 class="h3 mb-4 text-gray-800">
                        <i class="fas fa-list"></i>
                        Order Detail
                    </h1>
                </div>

            </div>

            <div class="row">
                <div class="col-sm-12">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="#">Home</a></li>
                            <li class="breadcrumb-item"><a href="#">Orders</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Order Detail</li>
                        </ol>
                    </nav>
                </div>
            </div>

            <div class="row">

                <div class="col-sm-12">

                    <div class="card shadow mb-4">
                        <div class="card-header py-3">
                            <h6 class="m-0 font-weight-bold text-primary">Order # {{$order->order_no}} Details</h6>
                        </div>
                        <div class="card-body">

                            <div class="table-responsive mb-2">
                                <table class="table">
                                    <tbody>
                                    <tr>
                                        <td class="font-weight-bold">Order Recieved:</td>
                                        <td>{{$order->order_time}}
                                            on {{localTimeZone($order->created_at)->format('l  \\, d/y/m')}}</td>
                                        <td class="font-weight-bold">Order Completed:</td>
                                        <td>{{$order->completed_at ? localTimeZone($order->completed_at)->format("g:i a \\o\\n  l  \\, d/y/m") : '---'}}</td>
                                    </tr>
                                    <tr>
                                        <td class="font-weight-bold">Order Type:</td>
                                        <td>{{$order->order_type}}</td>
                                        @if ($order->order_type == 'DINE_IN')
                                            <td class="font-weight-bold">Table Number</td>
                                            <td>{{$order->table_no}}</td>
                                        @endif
                                    </tr>
                                    <tr>
                                        <td class="font-weight-bold">Customer Name:</td>
                                        <td>{{$order->customer->name}}</td>
                                        <td class="font-weight-bold">Customer Email:</td>
                                        <td>{{$order->customer->email}}</td>
                                    </tr>
                                    <tr>
                                        <td class="font-weight-bold">Customer Contact:</td>
                                        <td>{{$order->phone}}</td>
                                        <td class="font-weight-bold">Customer Address:</td>
                                        <td>{{$order->address->detail}}</td>
                                    </tr>
                                    <tr>
                                        <td class="font-weight-bold" colspan="2">Order Notes:</td>
                                        <td colspan="2">{{$order->note}}</td>
                                    </tr>
                                    </tbody>
                                </table>

                            </div>

                            <div class="table-responsive">
                                <table class="table table-bordered">
                                    <thead class="bg-danger text-white">
                                    <tr>
                                        <th>Product</th>
                                        <th>Options (type)</th>
                                        <th>Rate</th>
                                        <th>Qty</th>
                                        <th>Price</th>
                                    </tr>
                                    </thead>
                                    <tbody class="items-detail-table-body">

                                    @foreach($order->items as $item)
                                        <tr>
                                            <td width="20%">{{$item->item->name}}</td>
                                            <td width="30%">
                                                <ul class="list-unstyled">
                                                    @foreach($item->variations as $variation)
                                                        <li><strong>{{$variation->title}}
                                                                :</strong> {{$variation->selected_option}}</li>
                                                    @endforeach
                                                </ul>
                                            </td>
                                            <td width="10%">{{$item->price / $item->quantity}}</td>
                                            <td width="20%">{{$item->quantity}}</td>
                                            <td width="10%">{{$item->price}}</td>

                                        </tr>
                                    @endforeach

                                    <tr>
                                        <td colspan="3"></td>
                                        <td><strong>Order Amount</strong></td>
                                        <td>{{$order->payable_amount}} <small>AED</small></td>
                                    </tr>
                                    <tr>
                                        <td colspan="3"></td>
                                        <td><strong>Delivery Charges</strong></td>
                                        <td>0 <small>AED</small></td>
                                    </tr>
                                    <tr>
                                        <td colspan="3"></td>
                                        <td><strong>Discount</strong></td>
                                        <td>0 <small>AED</small></td>
                                    </tr>
                                    <tr>
                                        <td colspan="3"></td>
                                        <td><strong>Total</strong></td>
                                        <td>{{$order->payable_amount}} <small>AED</small></td>
                                    </tr>
                                    <tr>
                                        <td colspan="3"></td>
                                        <td><strong>Platform Charges</strong></td>
                                        <td>0 AED</td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>


                        </div>
                    </div>

                </div>

            </div>

        </div>
        <!-- /.container-fluid -->
    </div>

    <!-- End of Main Content -->


@endsection