@extends ('layouts/template')
@section('content')

    <?php
    function cleanStatus($_status)
    {
        return ucwords(strtolower(str_replace("_", " ", $_status)));
    }
    ?>

    <div id="practice-shipment" class="p-3 mcp-theme-1 {{in_array($shipment->status, ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED', 'BEING_SCANNED', 'SCANNED']) ? 'pick-list' : 'order-slip' }}">
        <div class="card">
            <div class="card-header px-3 py-3 d-flex align-items-center bg-white">
                <strong class="font-size-14 only-pick-list">
                    Shipment
                </strong>
                <span class="text-sm text-secondary ml-2 only-pick-list">
                    (Created: {{friendlier_date_time($shipment->created_at)}})
                </span>
                @if($shipment->status === 'CANCELLED')
                    <div class="ml-5 font-weight-bold text-danger on-hover-opaque">-- CANCELLED --</div>
                @endif
                <div class="ml-auto d-inline-flex align-items-center only-screen">
                    @if(in_array($shipment->status, ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED', 'BEING_SCANNED', 'SCANNED']))
                        <button id="print-shipment" class="btn btn-sm btn-info">Print Pick-List</button>
                    @elseif(in_array($shipment->status, ['BEING_FULFILLED', 'FULFILLED', 'DISPATCHED']))
                        <button id="print-shipment-order-slip" class="btn btn-sm btn-info">Print Order-Slip</button>
                    @endif
                    <div moe relative class="d-block ml-3">
                        <a start show class="btn btn-default border btn-sm text-secondary">Cancel Shipment</a>
                        <form url="/api/shipment/setStatus" right>
                            <input type="hidden" name="uid" value="{{ $shipment->uid }}">
                            <input type="hidden" name="status" value="CANCELLED">
                            <p>Cancel this shipment?</p>
                            <div class="d-flex align-items-center">
                                <button class="btn btn-sm btn-primary mr-2" submit>Submit</button>
                                <button class="btn btn-sm btn-default mr-2 border" cancel>Cancel
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="only-print only-order-slip text-center flex-grow-1">
                    <img src="/img/dialmd-logo.png" style="height: 60px;" class="mx-auto d-block">
                </div>
            </div>
            <div class="only-screen">
                <div class="card-header px-3 py-3 d-flex align-items-center bg-light">
                    <span class="mr-3">Status:</span>
                    <?php $statuses = ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED', 'BEING_SCANNED', 'SCANNED', 'BEING_FULFILLED', 'FULFILLED', 'DISPATCHED']; ?>
                    @foreach($statuses as $status)
                        <button class="btn btn-sm {{ $shipment->status === $status ? 'btn-info font-weight-bold' : 'btn-outline-info change-status' }}"
                                data-status="{{$status}}">
                            {{cleanStatus($status)}}
                        </button>
                        @if($status !== 'DISPATCHED')
                            <span class="text-secondary text-sm mx-2"><i class="fa fa-chevron-right on-hover-opaque"></i></span>
                        @endif
                    @endforeach
                </div>
            </div>

            <div class="card-header p-3 only-print bg-white only-pick-list">
                <div class="d-flex justify-content-center">
                    <div>
                        <?php
                        $generator = new Picqer\Barcode\BarcodeGeneratorPNG();
                        echo '<img src="data:image/png;base64,' . base64_encode($generator->getBarcode($shipment->uid, $generator::TYPE_CODE_128, 1, 60)) . '">';
                        ?>
                        <div class="text-center text-secondary text-sm mt-1">{{$shipment->uid}}</div>
                    </div>
                </div>

            </div>

            <div class="card-body p-3 border-0">

                <div class="mb-1">
                    <span class="text-secondary">Patient: </span>
                    <a href="{{route('patients.view.dashboard', $shipment->client->uid)}}">
                        <span class="font-size-14">{{$shipment->client->displayName()}}</span>
                    </a>
                </div>
                <div class="mb-3">
                    <span class="text-secondary ml-auto">Address: </span>
                    <span class="font-size-14">{!! $shipment->mailing_address_full ? implode(" ", [$shipment->mailing_address_line1 . ' ' . $shipment->mailing_address_line2, $shipment->mailing_address_city . ' ' . $shipment->mailing_address_state . ' ' . $shipment->mailing_address_zip]) : '-'  !!}</span>
                </div>

                <div class="mb-3">
                    <table class="table table-sm table-striped table-bordered mb-0 bg-white">
                        @if($shipment->supplyOrders && count($shipment->supplyOrders))
                            <thead>
                            <tr class="">
                                @if(in_array($shipment->status, ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED', 'BEING_SCANNED', 'SCANNED']))
                                <th class="px-2 text-nowrap text-secondary border-bottom-0 only-print">Picked</th>
                                @endif
                                <th class="px-2 text-nowrap text-secondary border-bottom-0">Item</th>
                                <th class="px-2 text-nowrap text-secondary border-bottom-0">IMEI</th>
                                <th class="px-2 text-nowrap text-secondary border-bottom-0">Lot #</th>
                                @if(in_array($shipment->status, ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED']))
                                <th class="px-2 text-nowrap text-secondary border-bottom-0 only-screen">&nbsp;</th>
                                @endif
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($shipment->supplyOrders as $iSupplyOrder)
                                <tr class="">
                                    @if(in_array($shipment->status, ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED', 'BEING_SCANNED', 'SCANNED']))
                                    <td class="px-2 only-print">&nbsp;</td>
                                    @endif
                                    <td class="px-2">{{ $iSupplyOrder->product->title }}
                                        <span class="text-sm text-secondary ml-2">
                                            (Created: {{friendlier_date_time($iSupplyOrder->created_at)}})
                                        </span>
                                    </td>
                                    <td class="px-2">
                                        <div class="only-screen">
                                        <div moe relative class="d-block">
                                            <a start
                                               show>{{ $iSupplyOrder->imei ? $iSupplyOrder->imei : '(not set)' }}</a>
                                            <form url="/api/supplyOrder/associateImei" right>
                                                <input type="hidden" name="uid" value="{{ $iSupplyOrder->uid }}">
                                                <div class="mb-2">
                                                    <label class="text-secondary mb-1 text-sm">IMEI *</label>
                                                    <input type="text" class="form-control form-control-sm" required
                                                           name="imei" value="{{ $iSupplyOrder->imei }}">
                                                </div>
                                                <div class="d-flex align-items-center">
                                                    <button class="btn btn-sm btn-primary mr-2" submit>Save</button>
                                                    <button class="btn btn-sm btn-default mr-2 border" cancel>Cancel
                                                    </button>
                                                </div>
                                            </form>
                                        </div>
                                        </div>
                                        &nbsp;
                                    </td>
                                    <td class="px-2">
                                        <div moe relative class="d-block">
                                            <div class="only-screen">
                                            @if($iSupplyOrder->product->has_lot)
                                                <a start
                                                   show>{{ $iSupplyOrder->lot_number ? $iSupplyOrder->lot_number : '(not set)' }}</a>
                                                <form url="/api/supplyOrder/updateLotNumber" right>
                                                    <input type="hidden" name="uid" value="{{ $iSupplyOrder->uid }}">
                                                    <div class="mb-2">
                                                        <label class="text-secondary mb-1 text-sm">Lot # *</label>
                                                        <input type="text" class="form-control form-control-sm" required
                                                               name="lotNumber" value="{{ $iSupplyOrder->lot_number }}">
                                                    </div>
                                                    <div class="d-flex align-items-center">
                                                        <button class="btn btn-sm btn-primary mr-2" submit>Save</button>
                                                        <button class="btn btn-sm btn-default mr-2 border" cancel>
                                                            Cancel
                                                        </button>
                                                    </div>
                                                </form>
                                            @else
                                                <span class="text-secondary">N/A</span>
                                            @endif
                                            </div>
                                            &nbsp;
                                        </div>
                                    </td>
                                    @if(in_array($shipment->status, ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED']))
                                    <td class="px-2 only-screen">
                                        <div moe relative>
                                            <a start show class="py-0 text-danger">Remove</a>
                                            <form url="/api/supplyOrder/removeFromShipment" right>
                                                <input type="hidden" name="uid" value="{{ $iSupplyOrder->uid }}">
                                                <p class="small">Remove this supply order?</p>
                                                <div class="d-flex align-items-center">
                                                    <button class="btn btn-sm btn-primary mr-2" submit>Submit</button>
                                                    <button class="btn btn-sm btn-default mr-2 border" cancel>Cancel
                                                    </button>
                                                </div>
                                            </form>
                                        </div>
                                    </td>
                                    @endif
                                </tr>
                            @endforeach
                            </tbody>
                        @else
                            <tbody>
                            <tr>
                                <td class="text-secondary px-3 py-2">No items in this shipment!</td>
                            </tr>
                            </tbody>
                        @endif
                    </table>
                </div>

                @include('app.patient.partials.packs')

            </div>
        </div>
    </div>

    <script>
        (function () {

            function updatePrintButton() {
                let num = $('.row-select:checked').length;
                $('#num-selected').text(num + ' shipment' + (num === 1 ? '' : 's') + ' selected');
                if (num) {
                    $('#print-selected').removeClass('d-none');
                } else {
                    $('#print-selected').addClass('d-none');
                }
            }

            function hasError(_data) {
                let msg = 'Unknown error!';
                if (_data) {
                    if (_data.success) return false;
                    else if (_data.message) msg = _data.message;
                }
                toastr.error(msg);
                return true;
            }

            function init() {
                $('.change-status')
                    .off('click')
                    .on('click', function () {
                        $.post('/api/shipment/setStatus', {
                            uid: '{{$shipment->uid}}',
                            status: $(this).attr('data-status')
                        }, (_data) => {
                            if (!hasError(_data)) {
                                fastReload();
                            }
                        }, 'json');
                    });
                $('#print-shipment')
                    .off('click')
                    .on('click', function () {
                        $('body').addClass('pick-list').removeClass('order-slip');
                        window.print();
                    });

                $('#print-shipment-order-slip')
                    .off('click')
                    .on('click', function () {
                        $('body').addClass('order-slip').removeClass('pick-list');
                        window.print();
                    });
            }

            addMCInitializer('practice-shipment', init, '#practice-shipment')

        }).call(window);
    </script>


@endsection
