@extends ('layouts/template')

@section('content')

    <div id="practice-shipments-ready-to-print" class="p-3 mcp-theme-1">
    <div class="card border-bottom-0">
        <div class="card-header px-3 py-3 d-flex align-items-center bg-white">
            <strong class="font-size-14">
                Shipments - Printed &amp; Waiting for Picker ({{@$counts['shipmentsWaitingForPicker']}})
            </strong>
            <span class="mx-3 text-secondary">|</span>
            <a href="{{route('practice-management.shipments-ready-to-print')}}">Ready to Print ({{@$counts['shipmentsReadyToPrint']}})</a>
            <span class="mx-3 text-secondary">|</span>
            <a href="{{route('practice-management.shipments')}}">All ({{@$counts['shipments']}})</a>
            <div class="ml-auto">
                @include('app.practice-management.shipment-scan')
            </div>
        </div>

        <div class="card-header px-3 py-1 d-flex align-items-center bg-white">
            <span id="num-selected" class="font-weight-bold text-secondary py-2">0 shipments selected.</span>
            <button id="print-selected" class="btn btn-sm btn-info ml-3 d-none">Generate PDF for all selected shipments</button>
        </div>

        <div class="card-body p-0 border-0">
            <table class="table table-sm table-bordered table-hover p-0 m-0 border-0" style="table-layout: fixed">
                <thead class="bg-light">
                <tr>
                    <th class="border-top-0 border-bottom-0 border-left-0 width-50px">
                        <label class="d-flex align-items-center m-0">
                            <input type="checkbox" class="my-0 mr-1" id="select-all">
                            <span class="font-weight-normal">All</span>
                        </label>
                    </th>
                    <th class="border-top-0 border-bottom-0"></th>
                    <th class="border-top-0 border-bottom-0">Patient</th>
                    <th class="border-top-0 border-bottom-0">Address</th>
                    <th class="border-top-0 border-bottom-0">Item(s)</th>
                    <th class="border-top-0 border-bottom-0 border-right-0">Actions</th>
                </tr>
                </thead>
                <tbody>
                @foreach ($shipments as $shipment)
                    <tr class="{{$shipment->is_cancelled ? 'bg-light' : ''}}">
                        <th class="border-right border-left-0">
                            <label class="d-flex align-items-center m-0">
                                <input type="checkbox" class="my-0 mr-1 row-select">
                            </label>
                        </th>
                        <td class="border-right"><a href="{{route('practice-management.shipment', $shipment->uid)}}">Open</a></td>
                        <td>{{$shipment->client->displayName()}}</td>
                        <td>
                            {!! $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]) : '-'  !!}
                        </td>
                        <td>
                            @if($shipment->supplyOrders && count($shipment->supplyOrders))
                                <ol class="m-0 pl-3">
                                @foreach($shipment->supplyOrders as $iSupplyOrder)
                                    <li class="mb-1">
                                        {{ $iSupplyOrder->product->title }}
                                        <!--<td class="">{{ $iSupplyOrder->imei }}</td>
                                        <td class="">{{ $iSupplyOrder->lot_number }}</td>-->
                                    </li>
                                @endforeach
                                </ol>
                            @else
                                -
                            @endif
                        </td>
                        <td class="border-right-0">
                            <a class="print-row" href="#">Generate PDF</a>
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
            <div>
                {{$shipments->links()}}
            </div>
        </div>
    </div>
    </div>

    <script>
        (function() {

            function applyFilters() {
                let params = {}, queryLine = [];
                $('[data-filter]').each(function() {
                    if($.trim($(this).val())) {
                        params[$(this).attr('data-filter')] = $.trim($(this).val());
                    }
                });
                for(let x in params) {
                    if(params.hasOwnProperty(x)) {
                        queryLine.push(x + '=' + encodeURIComponent(params[x]));
                    }
                }
                queryLine = queryLine.join('&');

                fastLoad('/practice-management/shipments?' + queryLine);
            }

            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 init() {
                $('select[data-filter]')
                    .off('change')
                    .on('change', applyFilters);
                $('input[data-filter]')
                    .off('keyup')
                    .on('keyup', function(_event) {
                        if(_event.which === 13) {
                            applyFilters();
                            return false;
                        }
                    });
                $('#select-all')
                    .off('change')
                    .on('change', function() {
                        $('.row-select').prop('checked', this.checked);
                        updatePrintButton();
                    });
                $('.row-select')
                    .off('change')
                    .on('change', function() {
                        $('#select-all').prop('checked', $('.row-select:not(:checked)').length === 0);
                        updatePrintButton();
                    });
            }

            addMCInitializer('practice-shipments-ready-to-print', init, '#practice-shipments-ready-to-print')

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