@extends('admin.layouts.app')

@section('title', 'Order Details')
@section('page-title', 'Order: ' . $order->order_number)

@section('content')
<div class="space-y-6">
    <!-- Order Info -->
    <div class="bg-white rounded-lg shadow p-6">
        <div class="flex justify-between items-start mb-4">
            <div>
                <h3 class="text-lg font-semibold">Order Information</h3>
                <p class="text-sm text-gray-500">Placed on {{ $order->created_at->format('F d, Y h:i A') }}</p>
            </div>
            <span class="px-3 py-1 text-sm rounded-full 
                {{ $order->status === 'paid' ? 'bg-green-100 text-green-800' : '' }}
                {{ $order->status === 'pending' ? 'bg-yellow-100 text-yellow-800' : '' }}
                {{ $order->status === 'shipped' ? 'bg-blue-100 text-blue-800' : '' }}
                {{ $order->status === 'delivered' ? 'bg-purple-100 text-purple-800' : '' }}
                {{ $order->status === 'cancelled' ? 'bg-red-100 text-red-800' : '' }}">
                {{ ucfirst($order->status) }}
            </span>
        </div>

        <div class="grid grid-cols-2 gap-6">
            <div>
                <h4 class="font-semibold mb-2">Customer Information</h4>
                <p class="text-sm"><strong>Name:</strong> {{ $order->shipping_name }}</p>
                <p class="text-sm"><strong>Email:</strong> {{ $order->shipping_email }}</p>
                <p class="text-sm"><strong>Phone:</strong> {{ $order->shipping_phone ?? 'N/A' }}</p>
            </div>
            <div>
                <h4 class="font-semibold mb-2">Shipping Address</h4>
                <p class="text-sm">{{ $order->shipping_address }}</p>
                <p class="text-sm">{{ $order->shipping_city }}, {{ $order->shipping_state }} {{ $order->shipping_postal_code }}</p>
                <p class="text-sm">{{ $order->shipping_country }}</p>
            </div>
        </div>
    </div>

    <!-- Order Items -->
    <div class="bg-white rounded-lg shadow p-6">
        <h3 class="text-lg font-semibold mb-4">Order Items</h3>
        <div class="overflow-x-auto">
            <table class="min-w-full divide-y divide-gray-200">
                <thead class="bg-gray-50">
                    <tr>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">Product</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">Variant</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">Quantity</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">Price</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">Subtotal</th>
                    </tr>
                </thead>
                <tbody class="bg-white divide-y divide-gray-200">
                    @foreach($order->items as $item)
                    <tr>
                        <td class="px-4 py-3 text-sm">{{ $item->product_name }}</td>
                        <td class="px-4 py-3 text-sm">{{ $item->variant_name ?? '-' }}</td>
                        <td class="px-4 py-3 text-sm">{{ $item->quantity }}</td>
                        <td class="px-4 py-3 text-sm">{{ $currency_symbol }}{{ number_format($item->price, 2) }}</td>
                        <td class="px-4 py-3 text-sm">{{ $currency_symbol }}{{ number_format($item->subtotal, 2) }}</td>
                    </tr>
                    @endforeach
                </tbody>
                <tfoot class="bg-gray-50">
                    <tr>
                        <td colspan="4" class="px-4 py-3 text-right font-semibold">Subtotal:</td>
                        <td class="px-4 py-3 font-semibold">{{ $currency_symbol }}{{ number_format($order->subtotal, 2) }}</td>
                    </tr>
                    <tr>
                        <td colspan="4" class="px-4 py-3 text-right">Tax:</td>
                        <td class="px-4 py-3">{{ $currency_symbol }}{{ number_format($order->tax, 2) }}</td>
                    </tr>
                    <tr>
                        <td colspan="4" class="px-4 py-3 text-right">Shipping:</td>
                        <td class="px-4 py-3">{{ $currency_symbol }}{{ number_format($order->shipping, 2) }}</td>
                    </tr>
                    @if($order->discount > 0)
                    <tr>
                        <td colspan="4" class="px-4 py-3 text-right">Discount:</td>
                        <td class="px-4 py-3 text-green-600">-{{ $currency_symbol }}{{ number_format($order->discount, 2) }}</td>
                    </tr>
                    @endif
                    <tr>
                        <td colspan="4" class="px-4 py-3 text-right font-bold text-lg">Total:</td>
                        <td class="px-4 py-3 font-bold text-lg">{{ $currency_symbol }}{{ number_format($order->total, 2) }}</td>
                    </tr>
                </tfoot>
            </table>
        </div>
    </div>

    <!-- Assign to delivery boy -->
    @if(!$order->delivery_agent_id && in_array($order->status, ['paid', 'pending']))
    <div class="bg-white rounded-lg shadow p-6">
        <h3 class="text-lg font-semibold mb-4">Assign to delivery boy</h3>
        <form method="POST" action="{{ route('admin.delivery.orders.assign', $order) }}">
            @csrf
            <div class="grid grid-cols-2 gap-4">
                <div>
                    <label for="delivery_agent_id" class="block text-sm font-medium text-gray-700">Delivery agent</label>
                    <select name="delivery_agent_id" id="delivery_agent_id" required
                            class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3">
                        <option value="">Select delivery boy</option>
                        @foreach($deliveryAgents as $agent)
                        <option value="{{ $agent->id }}">{{ $agent->user->name ?? 'N/A' }} ({{ $agent->agent_code }})</option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label for="delivery_fee" class="block text-sm font-medium text-gray-700">Delivery fee for delivery boy (optional)</label>
                    <input type="number" name="delivery_fee" id="delivery_fee" step="0.01" min="0" value="{{ old('delivery_fee', \App\Models\Setting::get('delivery_boy_fee_per_order', 50)) }}"
                           class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3">
                </div>
            </div>
            <div class="mt-4">
                <button type="submit" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">
                    Assign to delivery boy
                </button>
            </div>
        </form>
    </div>
    @elseif($order->delivery_agent_id)
    <div class="bg-white rounded-lg shadow p-6">
        <h3 class="text-lg font-semibold mb-4">Delivery</h3>
        <p class="text-sm"><strong>Assigned to:</strong> {{ $order->deliveryAgent->user->name ?? 'N/A' }} ({{ $order->deliveryAgent->agent_code ?? 'N/A' }})</p>
        <p class="text-sm text-gray-500">Delivery status: {{ $order->delivery_status ?? 'N/A' }}</p>
        @php $assignment = $order->deliveryAssignment; @endphp
        @if($assignment)
        <p class="text-sm mt-2"><strong>Delivery fee (to wallet):</strong> {{ $currency_symbol ?? '$' }}{{ number_format($assignment->delivery_fee ?? $order->delivery_fee ?? 0, 2) }}</p>
        @if(($assignment->bonus ?? 0) > 0)
        <p class="text-sm"><strong>Bonus:</strong> {{ $currency_symbol ?? '$' }}{{ number_format($assignment->bonus, 2) }}</p>
        @endif
        @if(($assignment->tip ?? 0) > 0)
        <p class="text-sm"><strong>Customer tip (to wallet):</strong> {{ $currency_symbol ?? '$' }}{{ number_format($assignment->tip, 2) }}</p>
        @endif
        @endif
    </div>
    @endif

    <!-- Update Status -->
    <div class="bg-white rounded-lg shadow p-6">
        <h3 class="text-lg font-semibold mb-4">Update Order Status</h3>
        <form method="POST" action="{{ route('admin.orders.status.update', $order) }}">
            @csrf
            @method('PUT')
            <div class="grid grid-cols-2 gap-4">
                <div>
                    <label for="status" class="block text-sm font-medium text-gray-700">Status</label>
                    <select name="status" id="status" required
                            class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3">
                        <option value="pending" {{ $order->status === 'pending' ? 'selected' : '' }}>Pending</option>
                        <option value="paid" {{ $order->status === 'paid' ? 'selected' : '' }}>Paid</option>
                        <option value="shipped" {{ $order->status === 'shipped' ? 'selected' : '' }}>Shipped</option>
                        <option value="delivered" {{ $order->status === 'delivered' ? 'selected' : '' }}>Delivered</option>
                        <option value="cancelled" {{ $order->status === 'cancelled' ? 'selected' : '' }}>Cancelled</option>
                    </select>
                </div>
                <div>
                    <label for="admin_notes" class="block text-sm font-medium text-gray-700">Admin Notes</label>
                    <textarea name="admin_notes" id="admin_notes" rows="2"
                              class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3">{{ old('admin_notes', $order->admin_notes) }}</textarea>
                </div>
            </div>
            <div class="mt-4">
                <button type="submit" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
                    Update Status
                </button>
            </div>
        </form>
    </div>

    <!-- Payments -->
    @if($order->payments->count() > 0)
    <div class="bg-white rounded-lg shadow p-6">
        <h3 class="text-lg font-semibold mb-4">Payment Information</h3>
        <div class="space-y-2">
            @foreach($order->payments as $payment)
            <div class="flex justify-between items-center p-3 bg-gray-50 rounded">
                <div>
                    <p class="font-medium">{{ ucfirst($payment->payment_method) }}</p>
                    <p class="text-sm text-gray-500">{{ $payment->payment_intent_id ?? 'N/A' }}</p>
                </div>
                <div class="text-right">
                    <p class="font-semibold">{{ $currency_symbol }}{{ number_format($payment->amount, 2) }}</p>
                    <span class="px-2 py-1 text-xs rounded-full 
                        {{ $payment->status === 'succeeded' ? 'bg-green-100 text-green-800' : '' }}
                        {{ $payment->status === 'pending' ? 'bg-yellow-100 text-yellow-800' : '' }}
                        {{ $payment->status === 'failed' ? 'bg-red-100 text-red-800' : '' }}">
                        {{ ucfirst($payment->status) }}
                    </span>
                </div>
            </div>
            @endforeach
        </div>
    </div>
    @endif

    <div class="flex justify-end space-x-4">
        <a href="{{ route('admin.orders.index') }}" class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded">
            Back to Orders
        </a>
        <a href="{{ route('admin.orders.invoice', $order) }}" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">
            <i class="fas fa-file-pdf mr-2"></i>View Invoice
        </a>
    </div>
</div>
@endsection