@extends('admin.layouts.app')

@section('title', 'Send to '.$courier::label())
@section('crumbs')
    <a href="{{ route('admin.orders.index') }}">Orders</a>
    <span>Send to {{ $courier::label() }}</span>
@endsection

@section('content')
    @php
        $location = $courier::location();
        $ready = $orders->filter(fn ($o) => ! $o->consignment_id && ! in_array($o->status, ['cancelled', 'delivered'], true));
        $codTotal = $ready->sum(fn ($o) => $o->payment_status === 'paid' ? 0 : (float) $o->total);
    @endphp

    <form method="POST" action="{{ route('admin.orders.courier.send') }}" class="card">
        @csrf
        <input type="hidden" name="courier" value="{{ $courierKey }}">
        <div class="card-head">
            <h2>🚚 {{ $ready->count() }} ta order {{ $courier::label() }} e jabe</h2>
            <span class="muted small">Mot COD: <b>৳{{ number_format($codTotal) }}</b>@if ($courier::sandbox()) · <span class="badge badge-gold">Sandbox</span>@endif</span>
        </div>

        @if ($location === 'pathao' && ! $cities)
            <div class="card-body"><div class="fc-alert">⚠️ Pathao theke city list pawa jay ni. {{ $courier->lastError ?? 'Courier Settings e Client ID / Secret / username / password check koro.' }}</div></div>
        @elseif ($location === 'redx' && ! $areas)
            <div class="card-body"><div class="fc-alert">⚠️ RedX theke area list pawa jay ni. {{ $courier->lastError ?? 'Courier Settings e Access Token check koro.' }}</div></div>
        @endif

        <div class="table-wrap">
            <table class="table">
                <thead>
                    <tr>
                        <th>Order</th><th>Customer</th><th>Address</th><th class="text-right">COD</th>
                        @if ($location === 'pathao')<th>City</th><th>Zone</th>@elseif ($location === 'redx')<th>Delivery area</th>@elseif ($location === 'manual')<th>Tracking code (optional)</th>@endif
                    </tr>
                </thead>
                <tbody>
                @foreach ($orders as $o)
                    @php $skip = $o->consignment_id ? 'Age e '.\App\Services\Couriers\CourierManager::label($o->courier).' e pathano ('.$o->tracking_code.')' : (in_array($o->status, ['cancelled', 'delivered'], true) ? 'Order '.$o->status_label : null); @endphp
                    <tr @if ($skip) style="opacity:.55" @endif>
                        <td class="nowrap">
                            @unless ($skip)<input type="hidden" name="ids[]" value="{{ $o->id }}">@endunless
                            <strong>{{ $o->order_number }}</strong>
                            @if ($skip)<div class="err" style="font-size:12px">⛔ {{ $skip }}</div>@endif
                        </td>
                        <td>{{ $o->customer_name }}<div class="muted small">{{ $o->phone }}</div></td>
                        <td class="small" style="max-width:260px">{{ $o->address }}<div class="muted">@if ($o->city)📍 <b>{{ $o->zone }}, {{ $o->city }}</b> · @endif{{ $o->area === 'inside' ? 'Inside Dhaka' : 'Outside Dhaka' }}</div></td>
                        <td class="text-right nowrap"><strong>৳{{ number_format($o->payment_status === 'paid' ? 0 : $o->total) }}</strong>@if ($o->payment_status === 'paid')<div class="muted small">Paid</div>@endif</td>
                        @if ($location === 'pathao')
                            @php $autoCity = \App\Support\BdLocations::match($o->city, $cities); @endphp
                            <td>
                                <select name="loc[{{ $o->id }}][city]" class="input" data-pathao-city="{{ $o->id }}" data-want-zone="{{ $o->zone }}" @disabled($skip) required style="min-width:150px">
                                    <option value="">— City —</option>
                                    @foreach ($cities as $c)<option value="{{ $c['id'] }}" @selected($autoCity == $c['id'])>{{ $c['name'] }}</option>@endforeach
                                </select>
                            </td>
                            <td>
                                <select name="loc[{{ $o->id }}][zone]" class="input" data-pathao-zone="{{ $o->id }}" @disabled($skip) required style="min-width:170px">
                                    <option value="">— Age city —</option>
                                </select>
                            </td>
                        @elseif ($location === 'redx')
                            <td>
                                <input class="input" list="redxAreas" placeholder="Area khujun…" data-redx-area="{{ $o->id }}" data-want-zone="{{ $o->zone }}" @disabled($skip) required style="min-width:220px">
                                <input type="hidden" name="loc[{{ $o->id }}][area_id]" data-redx-id="{{ $o->id }}">
                                <input type="hidden" name="loc[{{ $o->id }}][area_name]" data-redx-name="{{ $o->id }}">
                            </td>
                        @elseif ($location === 'manual')
                            <td><input class="input" name="loc[{{ $o->id }}][tracking]" maxlength="100" placeholder="CarryBee panel er tracking/ID" @disabled($skip) style="min-width:200px"></td>
                        @endif
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
        @if ($location === 'redx')
            <datalist id="redxAreas">@foreach ($areas as $a)<option value="{{ $a['name'] }}" data-id="{{ $a['id'] }}"></option>@endforeach</datalist>
        @endif

        @if ($location === 'manual')
            <div class="card-body" style="padding-top:0"><p class="hint" style="margin:0">ℹ️ {{ $courier::label() }} er API nei: order gula age {{ $courier::label() }} merchant panel e banao, tarpor ekhane tracking code likhe pathao. Order gula Shipped hoye jabe.</p></div>
        @endif

        <div class="form-actions">
            <a href="{{ route('admin.orders.index') }}" class="btn btn-ghost">Cancel</a>
            <button type="submit" class="btn btn-primary" @disabled($ready->isEmpty()) data-once>🚚 {{ $ready->count() }} ta order pathao</button>
        </div>
    </form>
@endsection

@push('scripts')
<script>
    // double click e duibar na jay
    document.querySelector('[data-once]').closest('form').addEventListener('submit', function (e) {
        var b = this.querySelector('[data-once]');
        setTimeout(function () { b.disabled = true; b.textContent = 'Pathano hocche…'; }, 0);
    });

    // customer er zone er sathe courier er option mile: hubohu nam, na hole matro ekta option ei nam diye shuru hole
    var norm = function (s) { return String(s || '').toLowerCase().split(',')[0].replace(/[^a-z0-9]/g, ''); };
    function pick(names, want) {
        var w = norm(want);
        if (!w) return -1;
        var exact = names.findIndex(function (n) { return norm(n) === w; });
        if (exact > -1) return exact;
        var starts = names.map(function (n, i) { return norm(n).indexOf(w) === 0 ? i : -1; }).filter(function (i) { return i > -1; });
        return starts.length === 1 ? starts[0] : -1;
    }

    // Pathao: city bodlale oi city er zone list
    document.querySelectorAll('[data-pathao-city]').forEach(function (sel) {
        sel.addEventListener('change', function () {
            var zone = document.querySelector('[data-pathao-zone="' + sel.dataset.pathaoCity + '"]');
            zone.innerHTML = '<option value="">Loading…</option>';
            if (!sel.value) { zone.innerHTML = '<option value="">— Age city —</option>'; return; }
            fetch(@json(url('admin/couriers/pathao/zones')) + '/' + sel.value, { headers: { Accept: 'application/json' } })
                .then(function (r) { return r.json(); })
                .then(function (list) {
                    zone.innerHTML = '<option value="">— Zone —</option>' + list.map(function (z) {
                        var o = document.createElement('option'); o.value = z.id; o.textContent = z.name; return o.outerHTML;
                    }).join('');
                    var i = pick(list.map(function (z) { return z.name; }), sel.dataset.wantZone);
                    if (i > -1) zone.value = list[i].id;
                    sel.dataset.wantZone = '';   // ekbar e; pore city bodlale admin nije select korbe
                })
                .catch(function () { zone.innerHTML = '<option value="">Zone pawa jay ni</option>'; });
        });
        if (sel.value) sel.dispatchEvent(new Event('change'));   // customer er city auto-select hoye thakle zone load
    });

    // RedX: area nam likhle list theke id boshay
    var areaIds = {};
    document.querySelectorAll('#redxAreas option').forEach(function (o) { areaIds[o.value] = o.dataset.id; });
    document.querySelectorAll('[data-redx-area]').forEach(function (inp) {
        inp.addEventListener('input', function () {
            var id = areaIds[inp.value] || '';
            document.querySelector('[data-redx-id="' + inp.dataset.redxArea + '"]').value = id;
            document.querySelector('[data-redx-name="' + inp.dataset.redxArea + '"]').value = id ? inp.value : '';
            inp.setCustomValidity(id ? '' : 'List theke area select koro');
        });
        // customer er zone diye RedX area auto
        var names = Object.keys(areaIds), i = pick(names, inp.dataset.wantZone);
        if (i > -1) { inp.value = names[i]; inp.dispatchEvent(new Event('input')); }
    });
</script>
@endpush