shipping-portal/resources/views/pages/orders/move_order.blade.php

@extends('layouts.base_portal')
@section('inner_content')
<div class="row d-none" :class="[{'d-flex': $store.getters.isAdmin}]" v-if="$store.getters.isAdmin">
    <div class="col-12">
        <h4>Move Order to Customer</h4>
        <div class="card mb-3">
            <div class="card-body">
                <div class="row mb-2">
                    <div class="col-md-4">
                        <label>Order number</label>
                        <div class="d-flex">
                            <input type="text" id="orderRef" class="form-control" placeholder="e.g. 845287762">
                            <button type="button" class="btn btn-primary ml-2" id="btnLoad">Load</button>
                        </div>
                    </div>
                </div>
                <div class="row mb-2">
                    <div class="col-md-6">
                        <label>From customer</label>
                        <div id="fromCustomer" class="form-control" style="min-height:38px;"></div>
                    </div>
                </div>
                <div class="row mb-2">
                    <div class="col-md-6">
                        <label>To customer</label>
                        <select id="toCustomer" class="form-control" style="width:100%;">
                            <option value="">— Select —</option>
                        </select>
                    </div>
                </div>
                <div class="row mb-2">
                    <div class="col">
                        <button type="button" class="btn btn-danger" id="btnMove">Move order</button>
                    </div>
                </div>
                <div class="row mt-3">
                    <div class="col-12">
                        <label>Log</label>
                        <pre id="log" class="bg-dark text-light p-3" style="min-height:120px; max-height:280px; overflow:auto; font-size:12px;"></pre>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
(function(){
    var logEl = document.getElementById('log');
    if (!logEl) return;
    var orderInfoUrl = {!! json_encode(route('move-order.orderInfo')) !!};
    var customersUrl = {!! json_encode(route('move-order.customers')) !!};
    var moveUrl = {!! json_encode(route('move-order.move')) !!};
    function log(msg){ logEl.textContent += msg + '\n'; logEl.scrollTop = logEl.scrollHeight; }
    function clearLog(){ logEl.textContent = ''; }

    fetch(customersUrl, { headers: {'Accept':'application/json'}, credentials: 'same-origin' })
        .then(function(r){ return r.json(); })
        .then(function(arr){
            var sel = document.getElementById('toCustomer');
            if (!sel) return;
            sel.innerHTML = '<option value="">— Select —</option>';
            (arr||[]).forEach(function(c){ var o=document.createElement('option'); o.value=c.id; o.textContent=(c.marking||'')+' - '+(c.name||''); sel.appendChild(o); });
            if (window.$ && $.fn.select2) {
                $(sel).select2({ placeholder: '— Select —', allowClear: false, width: '100%' });
            }
        });

    document.getElementById('btnLoad').onclick = function(){
        var ref = (document.getElementById('orderRef').value||'').trim();
        if(!ref){ log('Enter order number'); return; }
        clearLog(); log('Loading order...');
        fetch(orderInfoUrl + '?reference=' + encodeURIComponent(ref), { headers: {'Accept':'application/json'}, credentials: 'same-origin' })
            .then(function(r){ return r.json(); })
            .then(function(d){
                if(d.error){ log('Error: ' + d.error); return; }
                var from = document.getElementById('fromCustomer'); if(from) from.innerHTML = (d.from_customer_marking || '') + ' - ' + (d.from_customer_name || '');
                log('Loaded: ' + d.reference + ' (from: ' + (d.from_customer_marking||'') + ')');
            })
            .catch(function(e){ log('Error: ' + e.message); });
    };

    document.getElementById('btnMove').onclick = function(){
        var ref = (document.getElementById('orderRef').value||'').trim();
        var toId = document.getElementById('toCustomer').value;
        if(!ref){ log('Enter order number'); return; }
        if(!toId){ log('Select To customer'); return; }
        clearLog(); log('Moving order...');
        var body = JSON.stringify({ order_reference: ref, target_company_module_id: parseInt(toId,10) });
        var headers = { 'Accept':'application/json', 'Content-Type':'application/json' };
        fetch(moveUrl, { method: 'POST', headers: headers, body: body, credentials: 'same-origin' })
            .then(function(r){ return r.json(); })
            .then(function(d){
                (d.log||[]).forEach(function(l){ log(l); });
                if(d.error && !d.success) log('Error: ' + d.error);
                if(d.success) log('Success.');
            })
            .catch(function(e){ log('Error: ' + e.message); });
    };
})();
</script>
@endpush