{{-- mainLayouts extends --}}
@extends('layouts.contentLayoutMaster')

{{-- Page title --}}
@section('title', 'Merchant Order Detail')
@section('vendor-style')
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/select2/select2.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/select2/select2-materialize.css') }}">
@endsection

{{-- page style --}}
@section('page-style')
    <link rel="stylesheet" type="text/css" href="{{ asset('css/pages/page-users.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/pages/form-select2.css') }}">
@endsection


@section('content')
    <div class="section users-view">
        <div class="pb-1">
            <a class="waves-effect waves-light btn red" href="{{ route('admin.merchant.orders') }}"><i
                    class="material-icons left">arrow_back</i>Back</a>
        </div>
        <div class="card-panel">
            <div class="row">
                <div class="col s12 m7">
                    <div class="display-flex media">
                        <a href="#" class="avatar custom-avatar">
                            @if (isset($order->user->images[0]))
                                <img src="{{ url($order->user->images[0]->full_image ?? '') }}" alt="users view avatar"
                                    class="z-depth-4 circle" height="64" width="64">
                            @else
                                <img src="{{ asset('images/profile.png') }}" alt="users view avatar"
                                    class="z-depth-4 circle" height="64" width="64">
                            @endif
                        </a>
                        <div class="media-body">
                            <h6 class="media-heading">
                                <span class="users-view-name">{{ $order->user->name ?? '-' }}</span>
                            </h6>
                            <span>Merchant ID:</span>
                            <span class="users-view-id">{{ $order->user->id ?? '-' }}</span>
                        </div>
                    </div>
                </div>
                {{-- <div class="col s12 m5 quick-action-btns display-flex justify-content-end align-items-center pt-2">
				<a class="waves-effect waves-light btn modal-trigger" href="#modal1">Change Merchants</a>
			</div> --}}
            </div>
        </div>

        <div class="card">
            <div class="card-content">
                <div class="row">
                    <div class="col s12">
                        <div style="display: flex;align-items: center">
                            <h6 class="mb-2 mt-2"><i class="material-icons">error_outline</i> Order Info</h6>
                            <form action="{{ route('admin.orders.destroy', $order->id) }}" method="post"
                                onsubmit="return confirm('Are you sure to delete this order?')" style="margin-left: auto">
                                @csrf
                                @method('DELETE')
                                <button style="border: none; outline: none;background: transparent" type="submit">
                                    <i class="material-icons mt-2">
                                        <a class="red lighten-4 border-radius-button red-text" style="padding: 6px 10px;">
                                            delete_forever
                                        </a>
                                    </i>
                                </button>
                            </form>
                        </div>
                        <table class="striped">
                            <tbody>
                                <tr>
                                    <td>Qr Code</td>
                                    <td>
                                        @if ($order->qr_code_link)
                                            <div style="width:100px;height: 100px;">
                                                <img src="{{ asset($order->qr_code_link) }}" alt=""
                                                    style="width: 100%!important">
                                            </div>
                                        @else
                                            {{ '-' }}
                                        @endif
                                    </td>
                                </tr>
                                <tr>
                                    <td>Order ID:</td>
                                    <td>{{ $order->display_order_number }}</td>
                                </tr>
                                <tr>
                                    <td>Created Time:</td>
                                    <td>{{ $order->created_time }}</td>
                                </tr>
                                <tr>
                                    <td>Merchant Name:</td>
                                    <td>{{ $order->user && $order->user->name ? $order->user->name : '-' }}</td>
                                </tr>
                                <tr>
                                    <td>Total Price:</td>
                                    <td>{{ $order->total_price }}</td>
                                </tr>
                                <tr>
                                    <td>Payment Method:</td>
                                    <td>{{ $order->payment_method }}</td>
                                </tr>
                                <tr>
                                    <td>Payment Type:</td>
                                    <td>{{ $order->paymentMeium->name ?? $order->paymentMeium->name }}</td>
                                </tr>
                                <tr>
                                    <td>City:</td>
                                    <td>{{ $order->address && $order->address->city ? $order->address->city->name : '-' }}
                                    </td>
                                </tr>
                                <tr>
                                    <td>Township:</td>
                                    <td>{{ $order->address && $order->address->township ? $order->address->township->name : '-' }}
                                    </td>
                                </tr>
                                <tr>
                                    <td>Status:</td>
                                    <td>
                                        <span class="chip {{ $status }} lighten-4">
                                            <span class="{{ $status }}-text"> {{ $order->status }} </span>
                                        </span>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Description:</td>
                                    <td>{{ $order->description ?? '-' }}</td>
                                </tr>
                                <tr>
                                    <td>Delivery Address</td>
                                    <td>
                                        {{ $order->address->address ?? '-' }}
                                        {{-- @if ($order->delivery_address)
										<iframe width="100%" height="170" frameborder="0" src="{{ $order->delivery_address }}"></iframe>
									@else
										-
									@endif --}}
                                    </td>
                                </tr>
                                <tr>
                                    <td>Phone No</td>
                                    <td>
                                        @if ($order->user)
                                            <a
                                                href="tel:{{ $order->user->phone_number }}">{{ $order->user->phone_number ?? $order->user->phone_number }}</a>
                                        @else
                                            -
                                        @endif
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-content">
                <span class="card-title">Order Detail</span>
                <div class="responsive-table">
                    {{-- {{$orders->withQueryString()->links()}} --}}
                    <table id="users-list-datatable" class="table responsive-table">
                        <thead>
                            <tr>
                                <th></th>
                                <th>#</th>
                                <th>Proudct Type </th>
                                <th>Proudct Model </th>
                                <th>Price</th>
                                <th>Quantity</th>
                                <th>Discount Price</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($order->orderDetails as $key => $orderDetail)
                                <tr>
                                    <td></td>
                                    <td>{{ $key + 1 }}</td>
                                    <td>{{ $orderDetail->product->category->name ?? null }}</td>
                                    <td>{{ $orderDetail->product->model ?? null }}</td>
                                    <td>{{ $orderDetail->price ?? null }}</td>
                                    <td>{{ $orderDetail->quantity ?? null }}</td>
                                    <td>{{ $orderDetail->discount_price && $orderDetail->discount_price != 0? $orderDetail->discount_price: $orderDetail->price }}
                                    </td>
                                    {{-- <td><a href="{{ route('admin.orders.index') }}"><i class="material-icons">remove_red_eye</i></a></td> --}}
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="7">No Order Found!</td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                    {{-- {{$orders->withQueryString()->links()}} --}}
                </div>
            </div>
        </div>

        @if ($order->status == 'pending')
            {{-- <h5>Is Approve?</h5> --}}
            <div class="row right mb-1 pr-1">
                <form action="{{ route('admin.order.status.change', $order->id) }}" method="post"
                    id="order-status-form-{{ $order->id }}" style="display: inline-block;">
                    @csrf
                    <input type="hidden" class="validate" value="approve" name="status" />
                    <button type="submit"
                        class="green waves-effect waves-light btn modal-trigger noti-button mt-0">Approve</button>
                </form>
                <form action="{{ route('admin.order.status.change', $order->id) }}" method="post"
                    id="order-status-form-{{ $order->id }}" style="display: inline-block;">
                    @csrf
                    <input type="hidden" class="validate" value="reject" name="status" />
                    <button type="submit"
                        class="red waves-effect waves-light btn modal-trigger noti-button mt-0">Reject</button>
                </form>
            </div>
        @elseif ($order->status == 'approve')
            <div class="row right col pr-1 mb-2">
                <form action="{{ route('admin.order.status.change', $order->id) }}" method="post">
                    <input type="hidden" name="status" value="delivering">
                    <button class="btn waves-effect waves-light blue darken-2">Delivering</button>
                </form>
            </div>
        @elseif ($order->status == 'delivering')
            <div class="row right pr-1 mb-1">
                <form action="{{ route('admin.order.status.change', $order->id) }}" method="post">
                    <input type="hidden" name="status" value="delivered">
                    <button class="btn waves-effect waves-light green darken-2">Delivered</button>
                </form>
            </div>
            {{-- @elseif ($order->status == 'reject')
		<span class="badge red badge-custom">{{ $order->status }}</span>
	@elseif ($order->status == 'delivered')
		<span class="badge green badge-custom">{{ $order->status }}</span> --}}
        @endif

        @if ($order->remark != null)
            <div class="card mt-7">
                <div class="card-content">
                    <span class="card-title">Order Complain</span>
                    <p class="mt-1">{!! nl2br(stripcslashes($order->remark)) !!}</p>
                    <div class="display-flex align-items-center mt-3">
                        <form action="{{ route('admin.order.orderComplain.status', $order->id) }}"
                            id="order-complain-form-{{ $order->id }}" class="mr-1" method="POST">
                            @csrf
                            @method('PUT')
                            <input type="hidden" name="status" value="resolved">
                            <button type="submit" class="btn btn-small btn-border-rounded green"
                                {{ $order->order_complain_status == 'resolved' ? 'disabled' : '' }}>Resolved</button>
                        </form>
                    </div>
                </div>
            </div>
        @endif
    </div>
@endsection

@section('page-script')
    <script src="{{ asset('js/scripts/advance-ui-modals.js') }}"></script>
    <script src="{{ asset('js/scripts/form-select2.js') }}"></script>
@endsection
{{-- vendor script --}}
@section('vendor-script')
    <script src="{{ asset('vendors/select2/select2.full.min.js') }}"></script>
@endsection