@extends('layouts.admin')
@section('title', $order->order_number)
@section('content')
@php $m = $shop->money; $a = $order->address; $labels = ['confirmed' => __('Confirm order'), 'processing' => __('Start processing'), 'packed' => __('Mark packed'), 'shipped' => __('Mark shipped'), 'delivered' => __('Mark delivered'), 'completed' => __('Complete order')]; @endphp
<a href="{{ route('admin.orders') }}" class="text-sm font-bold text-primary hover:underline">← {{ __('Orders') }}</a>
<div class="mb-6 mt-2 flex flex-wrap items-center justify-between gap-3"><h1 class="text-2xl font-extrabold text-primary">{{ $order->order_number }}</h1><x-status :value="$order->status"/></div>

<div class="grid gap-6 lg:grid-cols-[1fr_360px]">
    <div class="space-y-6">
        <section class="rounded-[32px] border border-surface-variant bg-white p-6">
            <h2 class="mb-3 font-extrabold text-primary">{{ __('Items') }}</h2>
            <ul class="divide-y divide-surface-variant">
            @foreach ($order->items as $i)
                <li class="flex gap-3 py-3">@include('partials.line-thumb', ['image' => $i->image_url])
                    <div class="min-w-0 flex-1 text-sm"><p class="font-bold text-primary">{{ $i->product_name }}</p><p class="text-on-surface-variant">{{ collect([$i->color_label, $i->size_label])->filter()->implode(' · ') }} × {{ $i->quantity }}</p><p class="text-xs text-outline">{{ $i->sku }}</p></div>
                    <p class="text-sm font-bold">{{ $m->format((float) $i->line_total) }}</p></li>
            @endforeach
            </ul>
            <dl class="mt-4 space-y-2 border-t border-surface-variant pt-4 text-sm">
                <div class="flex justify-between"><dt>{{ __('Subtotal') }}</dt><dd>{{ $m->format((float) $order->subtotal) }}</dd></div>
                @if ((float) $order->discount_total > 0)<div class="flex justify-between"><dt>{{ __('Discount') }} @if ($order->coupon_code)({{ $order->coupon_code }})@endif</dt><dd>−{{ $m->format((float) $order->discount_total) }}</dd></div>@endif
                <div class="flex justify-between"><dt>{{ __('Delivery') }} ({{ $order->shipping_method_name }})</dt><dd>{{ $m->format((float) $order->shipping_fee) }}</dd></div>
                <div class="flex justify-between text-base font-extrabold text-primary"><dt>{{ __('Total') }}</dt><dd>{{ $m->format((float) $order->grand_total) }}</dd></div>
            </dl>
        </section>
        <section class="rounded-[32px] border border-surface-variant bg-white p-6">
            <h2 class="mb-3 font-extrabold text-primary">{{ __('History') }}</h2>
            <ol class="space-y-2 text-sm">@foreach ($order->history as $h)
                <li class="flex flex-wrap gap-x-3"><span class="font-bold text-primary">{{ __(ucfirst($h->to_status)) }}</span><span class="text-outline">{{ $h->created_at }}</span>@if ($h->first_name)<span class="text-on-surface-variant">· {{ $h->first_name }}</span>@endif @if ($h->note)<span class="text-on-surface-variant">— {{ $h->note }}</span>@endif</li>
            @endforeach</ol>
        </section>
    </div>

    <aside class="space-y-6">
        <section class="rounded-[32px] bg-surface-mid p-6">
            <h2 class="mb-3 font-extrabold text-primary">{{ __('Next step') }}</h2>
            @if ($order->next)
                <div class="space-y-3">
                @foreach ($order->next as $to)
                    @if ($to !== 'cancelled')
                        <form method="POST" action="{{ route('admin.orders.status', $order->id) }}">@csrf <input type="hidden" name="to" value="{{ $to }}"><x-btn type="submit" block>{{ $labels[$to] ?? ucfirst($to) }}</x-btn></form>
                    @endif
                @endforeach
                @if (in_array('cancelled', $order->next, true))
                    <form method="POST" action="{{ route('admin.orders.status', $order->id) }}" onsubmit="return confirm('{{ __('Cancel this order? Reserved stock will be released.') }}')" class="space-y-2 border-t border-outline-variant pt-3">@csrf <input type="hidden" name="to" value="cancelled">
                        <label class="sr-only" for="note">{{ __('Reason') }}</label><input id="note" name="note" placeholder="{{ __('Reason (optional)') }}" class="min-h-[44px] w-full rounded-full border border-outline-variant bg-white px-4 text-sm">
                        <x-btn type="submit" variant="danger" block>{{ __('Cancel order') }}</x-btn></form>
                @endif
                </div>
            @else <p class="text-sm text-on-surface-variant">{{ __('This order is closed.') }}</p> @endif
        </section>
        
                @if ($grab)
        <section class="rounded-[32px] border border-surface-variant bg-white p-6 text-sm" id="grab-helper">
            <h2 class="mb-1 font-extrabold text-primary">{{ __('Book Grab') }}</h2>
            <p class="mb-3 text-xs text-on-surface-variant">{{ __('Copy these into GrabExpress, book the driver, then create the shipment below and paste Grab\'s tracking link.') }}</p>
            <div class="space-y-3">
                @foreach ([['pickup', __('Pick-up'), $grab['pickup']], ['dropoff', __('Drop-off'), $grab['dropoff']], ['note', __('Parcel note'), $grab['note']]] as [$key, $label, $text])
                    <div>
                        <div class="mb-1 flex items-center justify-between"><span class="text-xs font-extrabold uppercase tracking-wider text-on-surface-variant">{{ $label }}</span>
                            @if ($text)<button type="button" data-copy="grab-{{ $key }}" class="rounded-full border border-outline-variant px-3 py-1 text-xs font-bold text-primary hover:bg-surface-mid">{{ __('Copy') }}</button>@endif</div>
                        @if ($text)<pre id="grab-{{ $key }}" class="whitespace-pre-wrap break-words rounded-2xl bg-surface-mid p-3 font-sans">{{ $text }}</pre>
                        @else<p class="rounded-2xl bg-accent-container p-3 text-on-accent-container">{{ __('No pick-up address yet. Add it in Warehouses (Operations menu).') }}</p>@endif
                    </div>
                @endforeach
            </div>
            @if ($grab['cod'])<p class="mt-3 rounded-2xl bg-accent-container p-3 font-bold text-on-accent-container">{{ __('Customer pays on delivery') }}: {{ $grab['cod'] }}</p>@endif
            <div class="mt-3 flex flex-wrap gap-2">
                <a href="https://express.grab.com/" target="_blank" rel="noopener" class="inline-flex min-h-[44px] items-center rounded-full bg-primary px-5 font-bold text-on-primary hover:bg-primary-container">{{ __('Open GrabExpress') }}</a>
                @if ($grab['map'])<a href="{{ $grab['map'] }}" target="_blank" rel="noopener" class="inline-flex min-h-[44px] items-center rounded-full border border-outline-variant px-5 font-bold text-primary hover:bg-surface-mid">{{ __('Customer pin on map') }}</a>@endif
            </div>
        </section>
        @push('scripts')
        <script>
        document.addEventListener('click', async (e) => {
          const b = e.target.closest('[data-copy]'); if (!b) return;
          const el = document.getElementById(b.dataset.copy); if (!el) return;
          try { await navigator.clipboard.writeText(el.textContent); } catch (err) { const r = document.createRange(); r.selectNodeContents(el); const s = getSelection(); s.removeAllRanges(); s.addRange(r); document.execCommand('copy'); s.removeAllRanges(); }
          const old = b.textContent; b.textContent = @json(__('Copied')); setTimeout(() => { b.textContent = old; }, 1500);
        });
        </script>
        @endpush
        @endif
        
        
        
        <section class="rounded-[32px] border border-surface-variant bg-white p-6 text-sm">
            <h2 class="mb-2 font-extrabold text-primary">{{ __('Shipments') }}</h2>
            @foreach ($shipments as $s)
                <div class="mb-3 rounded-2xl bg-surface-mid p-3"><x-status :value="$s->status"/> {{ $s->carrier }} @if ($s->tracking_number)<strong>{{ $s->tracking_number }}</strong>@endif
                    @php $turl = \App\Services\Admin\AdminFulfilment::trackingUrl($s->tracking_url_template, $s->tracking_number); @endphp
                    @if ($turl)<a href="{{ $turl }}" target="_blank" rel="noopener" class="block text-xs underline">{{ __('Track parcel') }}</a>@endif
                    @foreach ($s->events as $e)<p class="mt-1 text-xs text-on-surface-variant">{{ $e->occurred_at }} · {{ __(ucfirst(str_replace('_', ' ', $e->status))) }} {{ $e->location }} {{ $e->description }}</p>@endforeach</div>
            @endforeach
            @if (!in_array($order->status, ['pending', 'cancelled'], true))
                <form method="POST" action="{{ route('admin.shipments.store', $order->id) }}" class="space-y-2">@csrf
                    <label class="sr-only" for="carrier_id">{{ __('Carrier') }}</label><select id="carrier_id" name="carrier_id" class="min-h-[44px] w-full rounded-full border border-outline-variant bg-white px-4"><option value="">{{ __('Carrier…') }}</option>@foreach ($carriers as $c)<option value="{{ $c->id }}">{{ $c->name }}</option>@endforeach</select>
                    <label class="sr-only" for="tracking">{{ __('Tracking no.') }}</label><input id="tracking" name="tracking" placeholder="{{ __('Tracking no. (optional)') }}" class="min-h-[44px] w-full rounded-full border border-outline-variant bg-white px-4">
                    <x-btn type="submit" variant="ghost" block>{{ __('Create shipment') }}</x-btn></form>
            @endif
            <div class="mt-3 flex flex-wrap gap-2 border-t border-outline-variant pt-3">
                <form method="POST" action="{{ route('admin.invoices.create', $order->id) }}">@csrf<button class="rounded-full border border-outline-variant px-4 py-2 text-xs font-bold text-primary">{{ __('Invoice') }}</button></form>
                @if (in_array($order->status, ['shipped', 'delivered', 'completed'], true))<a href="{{ route('admin.returns.create', ['order' => $order->order_number]) }}" class="rounded-full border border-outline-variant px-4 py-2 text-xs font-bold text-primary">{{ __('Start a return') }}</a>@endif
            </div>
        </section>
        <section class="rounded-[32px] border border-surface-variant bg-white p-6 text-sm">
            <h2 class="mb-2 font-extrabold text-primary">{{ __('Payment') }}</h2>
            <p>{{ $order->payment ? __($order->payment->name) : '' }} · <strong>{{ __(ucfirst($order->payment_status)) }}</strong></p>
            @if ($order->payment_status !== 'paid' && $order->status !== 'cancelled')
                <form method="POST" action="{{ route('admin.orders.paid', $order->id) }}" class="mt-3" onsubmit="return confirm('{{ __('Mark this order as paid?') }}')">@csrf<x-btn type="submit" variant="soft" block>{{ __('Mark as paid') }}</x-btn></form>
            @endif
        </section>
        <section class="rounded-[32px] border border-surface-variant bg-white p-6 text-sm">
            <h2 class="mb-2 font-extrabold text-primary">{{ __('Customer & delivery') }}</h2>
            @if ($a)<p class="text-on-surface-variant"><strong class="text-primary">{{ $a->recipient_name }}</strong><br>{{ $a->phone }}<br>{{ $a->email }}<br>{{ $a->address_line1 }}@if ($a->address_line2), {{ $a->address_line2 }}@endif<br>{{ collect([$a->district, $a->province])->filter()->implode(', ') }}</p>@if ($a->latitude && $a->longitude)<a href="https://www.google.com/maps?q={{ $a->latitude }},{{ $a->longitude }}" target="_blank" rel="noopener" class="mt-2 inline-flex items-center rounded-full bg-surface-mid px-4 py-2 text-sm font-bold text-primary">{{ __('Open pin on map') }}</a>@endif @endif
            @if ($order->customer_note)<p class="mt-3 rounded-2xl bg-accent-container p-3 text-on-accent-container">{{ $order->customer_note }}</p>@endif
        </section>
    </aside>
</div>
@endsection