@extends('frontend.layouts.user.master')
@section('title', 'Dashboard')
@section('content')

    <div class="container">
        <!-- row -->
        <div class="row mb-8">
            <div class="col-md-12">
                <div class="d-md-flex justify-content-between align-items-center">
                    <div>
                        <!-- page header -->
                        <h2>Order Single</h2>
                        <!-- breacrumb -->
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb mb-0">
                                <li class="breadcrumb-item"><a href="#" class="text-inherit">Dashboard</a></li>
                                <li class="breadcrumb-item active" aria-current="page">Order Single</li>
                            </ol>
                        </nav>
                    </div>
                    <!-- button -->
                    <div>
                        <a href="{{ route('user.orders') }}" class="btn btn-primary">Back to all orders</a>
                    </div>

                </div>
            </div>
        </div>
        <!-- row -->
        <div class="row">
            <div class="col-xl-12 col-12 mb-5">
                <!-- card -->
                <div class="card h-100 card-lg">
                    <div class="card-body p-6">
                        <div class="d-md-flex justify-content-between">
                            <div class="d-flex align-items-center mb-2 mb-md-0">
                                <h2 class="mb-0">Order ID: #{{ $order->order_number }}</h2>
                                @php
                                    // $orderstatus = 'pending','approved','decline','packing','performa_invoice','invoice_review','delivered','cancelled','completed','shipping','invoiced','shipped'
                                    $status = $order->status;
                                    $color = '';
                                    if ($status == 'pending') {
                                        $color = 'warning';
                                    } elseif ($status == 'approved') {
                                        $color = 'primary';
                                    } elseif ($status == 'decline') {
                                        $color = 'danger';
                                    } elseif ($status == 'packing') {
                                        $color = 'info';
                                    } elseif ($status == 'performa_invoice') {
                                        $color = 'success';
                                    } elseif ($status == 'invoice_review') {
                                        $color = 'secondary';
                                    } elseif ($status == 'delivered') {
                                        $color = 'success';
                                    } elseif ($status == 'cancelled') {
                                        $color = 'danger';
                                    } elseif ($status == 'completed') {
                                        $color = 'success';
                                    } elseif ($status == 'shipping') {
                                        $color = 'info';
                                    } elseif ($status == 'invoiced') {
                                        $color = 'success';
                                    } elseif ($status == 'shipped') {
                                        $color = 'success';
                                    } else {
                                        $color = 'dark';
                                    }
                                @endphp
                                <span class="badge bg-light-{{ $color }} text-dark-{{ $color }} ms-2 fs-6">
                                    {{ ucwords(str_replace('_', ' ', $status)) }}
                                </span>
                            </div>
                            <!-- select option -->
                            <div class="d-md-flex">
                                <div class="mb-2 mb-md-0 d-none">
                                    <select class="form-select">
                                        <option selected="">Status</option>
                                        <option value="{{ $status }}" selected>{{ ucwords($status) }}</option>
                                        @if ($status != 'cancelled')
                                            <option value="cancelled">Cancel</option>
                                        @endif
                                        {{-- <option value="Success">Success</option>
                    <option value="Pending">Pending</option>
                    <option value="Cancel">Cancel</option> --}}
                                    </select>
                                </div>
                                <!-- button -->
                                @php
                                    $invoice = $order->invoices()->first();
                                @endphp
                                <div class="ms-md-3">
                                    @php
                                        $order_cannot_be_cancelled = [
                                            'invoiced',
                                            'packed',
                                            'shipped',
                                            'delivered',
                                            'completed',
                                            'shipping',
                                            'declined',
                                            'cancelled',
                                        ];
                                    @endphp
                                    @if ((!$invoice || $invoice->status != 'real') && !in_array($order->status, $order_cannot_be_cancelled))
                                        <a href="#" data-bs-toggle="modal" data-bs-target="#cancelOrderModal"
                                            class="btn btn-danger">Cancel Order</a>
                                    @endif
                                    @if ($invoice && $invoice->status != 'draft')
                                        @if ($order->hasRefundRequest())
                                            <a href="{{ route('front.user.order.refund.add', ['order_id' => $order->id]) }}"
                                                class="btn btn-info">Refund Request</a>
                                        @endif
                                        <a href="{{ route('user.order.invoice', ['order_id' => $order->id]) }}"
                                            class="btn btn-secondary">See Invoice</a>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="mt-8">
                            <div class="row">
                                <!-- address -->
                                <div class="col-lg-4 col-md-4 col-12">
                                    <div class="mb-6">
                                        <h6>Customer Details</h6>
                                        <p class="mb-1 lh-lg">
                                            {{ $order->user->first_name . ' ' . $order->user->last_name }}<br>
                                            {{ $order->user->email }}<br>
                                            {{ $order->user->phone }}</p>
                                        {{-- <a href="#">View Profile</a> --}}
                                    </div>
                                </div>
                                <!-- address -->
                                @php
                                    $shippingAddress = $order->shippingAddress;
                                @endphp
                                @if ($shippingAddress)
                                    <div class="col-lg-4 col-md-4 col-12">
                                        <div class="mb-6">
                                            <h6>Shipping Address</h6>
                                            <p class="mb-1 lh-lg">
                                                {{ $shippingAddress->first_name . ' ' . $shippingAddress->last_name }}<br>
                                                {{ $shippingAddress->email }}<br>
                                                {{ $shippingAddress->phone }}<br>
                                                {{ $shippingAddress->address_line_1 }}<br>
                                                {{ $shippingAddress->address_line_2 }}<br>
                                                {{ $shippingAddress->city }}<br>
                                                {{ $shippingAddress->post_code }}<br>
                                        </div>
                                    </div>
                                @endif
                                @php
                                    $pickupAddress = $order->pickupAddress;
                                @endphp
                                @if ($pickupAddress)
                                    <div class="col-lg-4 col-md-4 col-12">
                                        <div class="mb-6">
                                            <h6>Pickup Address</h6>
                                            <p class="mb-1 lh-lg">
                                            <p><strong>Name:</strong> {{ $pickupAddress->name }}</p>
                                            <p><strong>Phone:</strong> {{ $pickupAddress->phone }}</p>
                                            <p><strong>Note:</strong> {{ $pickupAddress->note }}</p>
                                        </div>
                                    </div>
                                @endif
                                <!-- address -->
                                <div class="col-lg-4 col-md-4 col-12">
                                    <div class="mb-6">
                                        <h6>Order Details</h6>
                                        <p class="mb-1 lh-lg">Order ID: <span
                                                class="text-dark">{{ $order->order_number }}</span><br>
                                            Order Date: <span class="text-dark">
                                                {{ $order->created_at->format('d M Y, h:i A') }}
                                            </span><br>
                                            Order Total: <span class="text-dark">£{{ $order->grand_total }}</span></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class="table-responsive">
                                <!-- Table -->
                                <table class="table mb-0 text-nowrap table-centered">
                                    <!-- Table Head -->
                                    <thead class="bg-light">
                                        <tr>
                                            <th>Products</th>
                                            <th>Price</th>
                                            <th>Quantity</th>
                                            <th>Total</th>
                                        </tr>
                                    </thead>
                                    <!-- tbody -->
                                    <tbody>
                                        @foreach ($order->orderDetails as $item)
                                            <tr>
                                                <td>
                                                    <a href="#" class="text-inherit">
                                                        <div class="d-flex align-items-center">
                                                            <div>
                                                                <img src="{{ asset($item->product->thumbnail_image) }}"
                                                                    alt="" class="icon-shape icon-lg">
                                                            </div>
                                                            <div class="ms-lg-4 mt-2 mt-lg-0">
                                                                <h5 class="mb-0 h6">
                                                                    {{ $item->product->name }}
                                                                </h5>
                                                                <h5 class="mb-0 h6 text-muted">
                                                                    {{ $item->product->specification }}
                                                                </h5>
                                                            </div>
                                                        </div>
                                                    </a>
                                                </td>
                                                <td><span class="text-body">£{{ $item->price }}</span></td>
                                                <td>{{ $item->quantity }}</td>
                                                <td>£{{ $item->total_amount }}</td>
                                            </tr>
                                        @endforeach
                                        <tr>
                                            <td class="border-bottom-0 pb-0"></td>
                                            <td class="border-bottom-0 pb-0"></td>
                                            <td colspan="1" class="fw-medium text-dark ">
                                                <!-- text -->
                                                Items Sub Total
                                            </td>
                                            <td class="fw-medium text-dark ">
                                                <!-- text -->
                                                £{{ $order->total_amount }}
                                            </td>
                                        <tr>
                                            <td class="border-bottom-0 pb-0"></td>
                                            <td class="border-bottom-0 pb-0"></td>
                                            <td colspan="1" class="fw-medium text-dark ">
                                                <!-- text -->
                                                Shipping Charges
                                            </td>
                                            <td class="fw-medium text-dark ">
                                                <!-- text -->
                                                @if (is_null($order->shipping_charges))
                                                    <span class="text-primary">Still not added</span>
                                                @else
                                                    £{{ $order->shipping_charges }}
                                                @endif
                                            </td>
                                        </tr>
                                        @if ($order->vat_tax_amount != null && $order->vat_tax_amount > 0)
                                            <tr>
                                                <td class=""></td>
                                                <td class=""></td>
                                                <td colspan="1" class="fw-medium text-dark ">
                                                    <!-- text -->
                                                    VAT Tax ({{ $order->vat_tax_percentage }}%)
                                                </td>
                                                <td class="fw-medium text-dark ">
                                                    <!-- text -->
                                                    £{{ $order->vat_tax_amount }}
                                                </td>
                                            </tr>
                                        @endif
                                        </tr>


                                        <tr>
                                            <td></td>
                                            <td></td>
                                            <td colspan="1" class="fw-semi-bold text-dark ">
                                                <!-- text -->
                                                Grand Total
                                            </td>
                                            <td class="fw-semi-bold text-dark ">
                                                <!-- text -->
                                                £{{ $order->grand_total }}
                                            </td>
                                        </tr>

                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card-body p-6">
                        <div class="row">
                            <div class="col-md-6 mb-4 mb-lg-0">
                                <h6>Payment Info</h6>
                                <span>
                                    <span class="text-dark fw-semi-bold">Payment Method:</span>
                                    {{ $order->payment_method == 'stripe' ? 'Payment before Delivery' : 'Payment after Delivery' }}
                                </span>
                                <br>
                                <span>
                                    <span class="text-dark fw-semi-bold">Payment Status:</span>
                                    @php
                                        // $paymentStatus = 'pending','credit','paid'
                                        $paymentStatus = $order->payment_status;
                                        $color = '';
                                        if ($paymentStatus == 'pending') {
                                            $color = 'warning';
                                        } elseif ($paymentStatus == 'credit') {
                                            $color = 'primary';
                                        } elseif ($paymentStatus == 'paid') {
                                            $color = 'success';
                                        }
                                    @endphp
                                    <span
                                        class="badge bg-light-{{ $color }} text-dark-{{ $color }} ms-2">{{ ucwords($paymentStatus) }}</span>
                                </span>
                            </div>

                            @if ($order->status == 'cancelled')
                                <div class="row mt-4">
                                    <div class="col-md-12">
                                        <div class="alert alert-danger">
                                            <p class="mb-0"><span class="fw-semibold">REASON FOR CANCELLATION:</span>
                                                <span id="note">
                                                    {{ $order->cancelled_reason }}
                                                </span>
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            @endif

                        </div>
                        @if (!empty($order->notes))
                            <div class="row mt-4">
                                <div class="col-md-12">
                                    {{-- <h5>Notes</h5> --}}
                                    {{-- <textarea class="form-control mb-3" rows="3" placeholder="Write note for order"></textarea>
                                    <a href="#" class="btn btn-primary">Save Notes</a> --}}
                                    <div class="alert alert-info">
                                        <p class="mb-0"><span class="fw-semibold">NOTES:</span>
                                            <span id="note">
                                                {{ $order->notes }}
                                            </span>
                                        </p>
                                    </div>
                                </div>
                            </div>
                        @endif
                    </div>
                </div>

            </div>

        </div>

        <!-- Invoice Comments Section -->
        {{-- <div class="row mt-5">
        <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                    <h4 class="card-title">Invoice Negotiation</h4>
                    <!-- Chat Messages -->
                    <div class="chat-messages">
                        <!-- Customer Message -->
                        <div class="message customer-message">
                            <div class="message-content">
                                <p>Hello, I'd like to negotiate the invoice price.</p>
                                <small>Customer - 2 hours ago</small>
                            </div>
                        </div>
                        <!-- Admin Message -->
                        <div class="message admin-message text-right">
                            <div class="message-content">
                                <p>Sure, what price are you proposing?</p>
                                <small>Admin - 1 hour ago</small>
                            </div>
                        </div>
                        <!-- Customer Message -->
                        <div class="message customer-message">
                            <div class="message-content">
                                <p>I can offer $500 for this invoice.</p>
                                <small>Customer - 30 minutes ago</small>
                            </div>
                        </div>
                    </div>
                    <!-- Chat Input -->
                    <div class="chat-input mt-3">
                        <textarea class="form-control" rows="3" placeholder="Type your message here..."></textarea>
                        <button type="button" class="btn btn-primary mt-2">Send</button>
                    </div>
                </div>
            </div>
        </div>
    </div> --}}

        <div class="modal fade" id="cancelOrderModal" tabindex="-1" aria-labelledby="cancelOrderModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content p-4">
                    <div class="modal-header border-0">
                        <h5 class="modal-title fs-3 fw-bold" id="cancelOrderModalLabel">Cancel Order</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form method="POST" action="{{ route('user.order.cancel', ['order_id' => $order->id]) }}">
                        @csrf
                        <div class="modal-body">
                            <div class="mb-3">
                                <label for="cancelReason" class="form-label">Reason for Cancellation</label>
                                <textarea class="form-control" id="cancelReason" placeholder="Enter your reason for cancellation" required
                                    name="cancellation_reason"></textarea>
                            </div>

                            <input type="hidden" name="order_id" value="{{ $order->id }}">

                        </div>
                        <div class="modal-footer border-0 justify-content-between">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                            <button type="submit" class="btn btn-danger"
                                onclick="return confirm('Are you sure you want to cancel this order?');">Confirm
                                Cancellation</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

    @endsection