@extends('admin.layouts.app')
@section('title', 'Order Detail')
@section('content')
    <!-- Content -->
    <div class="container-xxl flex-grow-1 container-p-y">
        <div class="d-flex mb-4">
            <h4 class="primary-title fw-bold ">Order #<span class="order_id text-danger">{{ $order->order_number }}</span>

            </h4>
            <div class="badge {{ badgeForOrderStatuses($order->order_status) }}"> {{ orderStatuses($order->order_status) }}
            </div>

        </div>
        <!-- Basic Layout & Basic with Icons -->
        <div class="row ">
            <!-- Basic Layout -->
            <div
                class="{{ $order->order_status == 3 || ($order->order_status == 4 && $order->order_status == 5) ? 'col-12' : 'col-xxl-8 col-lg-7 col-sm-12' }}">
                <div class="card px-4 mb-4">
                    <div class="card-body px-0">
                        <h5 class="">Customer Detail</h5>
                        <div class="row">
                            <div class="col-md-8 col-sm-12">
                                <div class="d-flex">
                                    <div class="customer-image">
                                        @php
                                            $image = DEFAULT_PATH;
                                            if (!empty($order->customer->image)) {
                                                $image = $order->customer->image;
                                            }

                                        @endphp

                                        <img src="{{ asset($image) }}" alt="Customer Image" width="60" height="60"
                                            class="rounded-circle">
                                    </div>
                                    <div class="customer-info">
                                        <p class="customer-name">{{ $order->customer->full_name }}</p>
                                        <p class="customer-contact">Email : {{ $order->customer->email }}</p>
                                        <p class="customer-contact">Phone Number : {{ $order->customer->mobile_number }}
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <div class="d-flex align-items-center">
                                    <div class="order-ico">
                                        <i class="theme-text-color fas fa-shopping-cart"></i>
                                    </div>

                                    <p class="order_count">{{ $orderCount }} Orders</p>
                                </div>

                            </div>
                        </div>

                    </div>
                </div>
            </div>
            @if (in_array($order->order_status, [0, 1, 2]))
                @can('status-update-order')
                    <div class="col-xxl-4 col-lg-5 col-sm-12">
                        <div class="card px-4 mb-4">
                            <div class="card-body px-0">

                                <h5 class="">Update Status</h5>


                                <div class="update-status-container">
                                    <form class="row g-3 ajax-submit-form" data-confirm ="update-status"
                                        data-url="{{ route('admin.orders.update', $order->id) }}" data-method="post">
                                        @method('put')

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

                                            <label for="order_status" class="visually-hidden">Order Status</label>
                                            <select name="order_status" class="form-select" id="order_status">
                                                <option selected value="">
                                                    {{ orderStatuses($order->order_status) }}</option>
                                                @foreach (nextOrderStatus($order->order_status) as $key => $value)
                                                    <option {{ $key == $order->order_status ? 'selected' : '' }}
                                                        value="{{ $key }}">
                                                        {{ $value }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        <div class="col-sm-4">
                                            <button type="submit" class="btn btn-primary mb-3">Update</button>
                                        </div>

                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                @endcan
            @elseif(in_array($order->order_status, [4, 5]) && $order->is_refund == 0)
                <div class="col-xxl-4 col-lg-5 col-sm-12">
                    <div class="card px-4 mb-4">
                        <div class="card-body px-0">
                            @can('view-order-detail-order')
                                @if ($order->order_status == 5)
                                    <div class="d-flex">
                                        <p class=""><b>Return Reason : </b></p>
                                        <p>&nbsp;Defective items received</p>
                                    </div>
                                @elseif ($order->order_status == 4)
                                    <div class="d-flex">
                                        <p class=""><b>Cancel Reason : </b></p>
                                        <p>&nbsp;Defective items received</p>
                                    </div>
                                @endif
                            @endcan
                            @if (auth()->user()->hasPermissionTo('approve-order'))
                                <div class="order-approve-container">
                                    <form class="row g-3 ajax-submit-form" data-confirm ="order-approve"
                                        data-url="{{ route('admin.ordersRefund.update', $order->id) }}" data-method="post">
                                        @method('put')

                                        <input type="hidden" name="mark_as_refunded" value="1">
                                        <button type="submit" class="btn btn-primary mb-3"><i
                                                class="fas fa-check-circle"></i>
                                            Approve Order</button>

                                    </form>
                                </div>
                            @endif
                            @can('status-update-order')
                                <div class="update-status-container">
                                    <form class="row g-3 ajax-submit-form" data-confirm ="update-status"
                                        data-url="{{ route('admin.ordersRefund.update', $order->id) }}" data-method="post">
                                        @method('put')

                                        <input type="hidden" name="mark_as_refunded" value="1">
                                        <button type="submit" class="btn btn-primary mb-3"><i class="fas fa-check-circle"></i>
                                            Mark as Refunded</button>

                                    </form>
                                </div>
                            @endcan
                        </div>
                    </div>
                </div>
            @elseif(in_array($order->order_status, [4, 5]) && $order->is_refund == 1)
                <div class="col-xxl-4 col-lg-5 col-sm-12">
                    <div class="card px-4 mb-4">
                        <div class="card-body px-0">

                            @if ($order->order_status == 5)
                                <div class="d-flex">
                                    <p class=""><b>Return Reason : </b></p>
                                    <p>&nbsp;Defective items received</p>
                                </div>
                            @elseif ($order->order_status == 4)
                                <div class="d-flex">
                                    <p class=""><b>Cancel Reason : </b></p>
                                    <p>&nbsp;Defective items received</p>
                                </div>
                            @endif
                            <h6 class="text-danger"><i class="fas fa-check-circle"></i> Refund has been done</h6>



                        </div>
                    </div>
                </div>
            @endif


        </div>
        <div class="row ">
            <!-- Basic Layout -->
            <div class="col-12">
                <div class="card px-4 mb-4">
                    <div class="card-body px-0">
                        <h5 class="">Order Detail</h5>
                        {{-- order detail in loop --}}
                        @if (isset($order->orderDetails) && count($order->orderDetails) > 0)
                            <table id="myTable" class="dataTable table table-hover display responsive nowrap">
                                <thead>
                                    <tr>
                                        <th>
                                            Product Name
                                        </th>
                                        <th style="width: 50px;">
                                            Price in USD
                                        </th>
                                        <th>
                                            Price in MMK
                                        </th>
                                        <th>
                                            Quantity
                                        </th>
                                        <th>
                                            Total
                                        </th>
                                        <th>
                                            Returned
                                        </th>
                                        <th>
                                            Approval
                                        </th>
                                        <th>Pickup</th>
                                        <th>Refund</th>
                                        <th>Restock</th>
                                    </tr>
                                </thead>

                                <tbody class="table-border-bottom-0">
                                    @foreach ($order->orderDetails as $item)
                                        <tr>
                                            <td class="text-capitalize">{{ $item->product_name }}</td>
                                            <td class="text-capitalize">{{ $item->price_usd }}</td>
                                            <td class="text-capitalize">{{ $item->price_mmk }}</td>
                                            <td class="text-capitalize">{{ $item->quantity }}</td>
                                            <td class="text-capitalize">{{ $item->total }}</td>
                                        </tr>
                                    @endforeach
                                </tbody>




                            </table>
                        @endif
                        <div class="d-flex justify-content-end align-items-center m-6 mb-2">
                            <div class="col-md-3 col-sm-12 order-calculations">
                                {{-- <div class="d-flex justify-content-start mb-2">
                                    <span class="w-px-100 text-heading">Subtotal:</span>
                                    <h6 class="mb-0">$2093</h6>
                                </div> --}}

                                {{-- <div class="d-flex justify-content-start mb-2">
                                    <span class="w-px-100 text-heading">Wholesale Discount:</span>
                                    <h6 class="mb-0">N/A</h6>
                                </div> --}}
                                {{-- <div class="d-flex justify-content-start mb-2">
                                    <span class="w-px-100 text-heading">Tax:</span>
                                    <h6 class="mb-0">$28</h6>
                                </div> --}}
                                <div class="d-flex justify-content-start mb-3">
                                    <h6 class="w-px-100 mb-0">Total(USD):</h6>
                                    <h6 class="mb-0">{{ $order->total_price_usd }}</h6>
                                </div>
                                <div class="d-flex justify-content-start">
                                    <h6 class="w-px-100 mb-0">Total(MMK):</h6>
                                    <h6 class="mb-0">{{ $order->total_price_mmk }}</h6>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {{-- shipping billing and status timeline --}}
        <div class="row ">
            <!-- Basic Layout -->
            <div class="col-md-6 col-sm-12">
                <div class="card px-4 mb-4">
                    <div class="card-body px-0">
                        <h5 class="">Shipping Address</h5>
                        <div class="row">
                            <div class="col-md-8 col-sm-12">
                                <div class="d-flex">

                                    <div class="customer-shipping-address">

                                        <p> {{ $order->shippingAddress->address }}<br>

                                            {{ $order->shippingAddress->city }},
                                            {{ $order->shippingAddress->state }}
                                            Myanmar,
                                            {{ $order->shippingAddress->pincode }}
                                        </p>

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

                        </div>
                        <div class="billing">
                            <h5 class="">Billing Address</h5>
                            <div class="row">
                                <div class="col-md-8 col-sm-12">
                                    <div class="d-flex">

                                        <div class="customer-shipping-address">

                                            <p> {{ $order->billingAddress->address }}<br>

                                                {{ $order->billingAddress->city }},
                                                {{ $order->billingAddress->state }}
                                                Myanmar,
                                                {{ $order->billingAddress->pincode }}
                                            </p>

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

                            </div>
                        </div>

                    </div>
                </div>
            </div>
            <div class="col-md-6 col-sm-12">
                <div class="card px-4 mb-4">
                    <div class="card-body px-0">
                        <h5 class="mb-3">Shipping Activity</h5>
                        <div class="shipping-activity-container ">
                            @php
                                $logs = $order->orderStatusLogs;
                                $logsByStatus = $logs->keyBy('status');
                                $isRefund = $order->is_refund == 1;
                                $statusToShow = getOrderStatusFlow($logs, $isRefund);
                            @endphp

                            <div class="shipping-activity-container">
                                @foreach ($statusToShow as $loopIndex => $key)
                                    @php
                                        $status = orderStatuses($key);
                                        $log = $logsByStatus->get($key);
                                        $isActive = !is_null($log); // Refund is now logged in DB, so just check presence
                                    @endphp

                                    <div class="timeline-step d-flex align-items-start">

                                        <div
                                            class="timeline-line {{ $isActive ? 'timeline-line-active-color' : 'timeline-line-deactive-color' }}">
                                        </div>

                                        <div class="timeline-icon-wrapper">
                                            <div class="timeline-icon {{ $isActive ? 'bg-primary-c' : 'bg-light-c' }}">
                                            </div>
                                        </div>
                                        <div class="timeline-content ms-3">
                                            <h6 class="mb-1 fw-semibold">{{ $status }}</h6>
                                            @if ($isActive)
                                                <small class="text-muted">{{ dateInList($log->status_date_time) }}</small>
                                            @else
                                                <small class="text-muted">Not yet updated</small>
                                            @endif
                                        </div>
                                    </div>
                                @endforeach

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- / Content -->
    @endsection