<?php
$invoices = \App\Models\Invoice::where($parentType === 'Note' ? 'note_id' : 'care_month_id', $parentID)->get();
?>
<div id="generic-invoices-{{camel_case($parentType)}}-{{$parentID}}">
    <div class="d-flex align-items-baseline pb-3">
        <h4 class="font-weight-bold m-0">Invoices</h4>
        <span class="text-secondary mx-2">|</span>
        @if(!count($patient->customers))
            <b>This patient is not added as a customer on any company yet.</b>
        @else
            <div moe>
                <a href="" start show>
                    + Add Invoice
                </a>
                <form url="/api/invoice/create" class="mcp-theme-1">
                    <p class="mb-2 text-secondary font-weight-bold">Add Invoice</p>
                    <input type="hidden" name="{{$parentType === 'Note' ? 'noteUid' : 'careMonthUid'}}" value="{{$parentUid}}">
                    <div class="mb-2">
                        <label class="text-sm text-secondary mb-1">Customer</label>
                        <select name="customerUid" class="form-control form-control-sm" required>
                            <option value="">-- select --</option>
                            @foreach($patient->customers as $customer)
                                <option value="{{$customer->uid}}">{{$customer->company->name}}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-2">
                        <label class="text-sm text-secondary mb-1">Amount</label>
                        <input type="text"
                               name="amount"
                               autocomplete="off"
                               class="form-control form-control-sm"
                               required>
                    </div>
                    <div class="mb-2">
                        <label class="text-sm text-secondary mb-1">Description</label>
                        <textarea rows="2"
                                  name="description"
                                  autocomplete="off"
                                  class="form-control form-control-sm" required></textarea>
                    </div>
                    <div>
                        <button submit class="btn btn-sm btn-primary mr-2">Submit</button>
                        <button cancel class="btn btn-sm btn-default border">Cancel</button>
                    </div>
                </form>
            </div>
        @endif
        <span class="text-secondary mx-2">|</span>
        <div moe>
            <a href="" start show>
                + Add Patient as Customer
            </a>
            <form url="/api/customer/create" class="mcp-theme-1">
                <p class="mb-2 text-secondary font-weight-bold">Add As Customer</p>
                <input type="hidden" name="clientUid" value="{{$patient->uid}}">
                <div class="mb-2">
                    <label class="text-sm text-secondary mb-1">Company</label>
                    <input type="hidden" name="companyUid" value="{{@$company->uid}}">
                    <input type="text"
                           name="companyName"
                           target-key="uid"
                           target-field="companyUid"
                           autocomplete="off"
                           class="form-control form-control-sm"
                           stag-suggest
                           stag-suggest-ep="/company-suggest"
                           value="{{@$company ? @$company->name : ''}}"
                           {{@$company ? 'disabled readonly' : ''}}
                           required>
                </div>
                <div>
                    <button submit class="btn btn-sm btn-primary mr-2">Submit</button>
                    <button cancel class="btn btn-sm btn-default border">Cancel</button>
                </div>
            </form>
        </div>
    </div>
    @if(!count($invoices))
        <div class="border p-2">This {{$parentType}} does not have any invoices yet.</div>
    @else
        <table class="table table-sm table-bordered table-striped m-0">
            <thead>
            <tr>
                <th class="border-bottom-0"></th>
                <th class="border-bottom-0">Company</th>
                <th class="border-bottom-0">Created</th>
                <th class="border-bottom-0">Amount</th>
                <th class="border-bottom-0">Description</th>
                <th class="border-bottom-0">Pay Link</th>
                <th class="border-bottom-0">Paid</th>
                <th class="border-bottom-0">Balance</th>
                <th class="border-bottom-0">Active?</th>
                <th class="border-bottom-0"></th>
            </tr>
            </thead>
            <tbody>
            <?php $i = 1; ?>
            @foreach($invoices as $record)
                <tr>
                    <td>{{ $i++ }}</td>
                    <td>{{ $record->customer->company->name }}</td>
                    <td>{{ friendly_date($record->created_at) }}</td>
                    <td>${{ is_null($record->amount) ? 0 : $record->amount }}
                        <div moe relative class="ml-1">
                            <a href="#" start show><i class="fa fa-edit on-hover-opaque"></i></a>
                            <form url="/api/invoice/changeAmount">
                                <input type="hidden" name="invoiceUid" value="{{$record->uid}}">
                                <div class="mb-2">
                                    <label class="text-sm text-secondary mb-1">Amount</label>
                                    <input type="text"
                                           name="amount"
                                           autocomplete="off"
                                           class="form-control form-control-sm"
                                           value="{{$record->amount}}"
                                           required>
                                </div>
                                <div>
                                    <button submit class="btn btn-sm btn-primary mr-2">Submit</button>
                                    <button cancel class="btn btn-sm btn-default border">Cancel</button>
                                </div>
                            </form>
                        </div>
                    </td>
                    <td>{{ $record->description ?: '' }}
                        <div moe relative class="ml-1">
                            <a href="#" start show><i class="fa fa-edit on-hover-opaque"></i></a>
                            <form url="/api/invoice/changeDescription">
                                <input type="hidden" name="invoiceUid" value="{{$record->uid}}">
                                <div class="mb-2">
                                    <label class="text-sm text-secondary mb-1">Description</label>
                                    <textarea rows="2"
                                              name="description"
                                              autocomplete="off"
                                              class="form-control form-control-sm" required>{{$record->description}}</textarea>
                                </div>
                                <div>
                                    <button submit class="btn btn-sm btn-primary mr-2">Submit</button>
                                    <button cancel class="btn btn-sm btn-default border">Cancel</button>
                                </div>
                            </form>
                        </div>
                    </td>
                    <td>
                        <a href="#" data-invoice-uid="{{$record->uid}}" data-uid="{{$record->customer->uid}}" class="generate-and-visit-ic-pay" native target="_blank">Visit</a>
                        <a href="#" data-invoice-uid="{{$record->uid}}" data-uid="{{$record->customer->uid}}" class="generate-and-copy-ic-pay-url ml-1" native target="_blank">Copy</a>
                    </td>
                    <td>${{ is_null($record->paid) ? 0 : $record->paid }}</td>
                    <td>${{ is_null($record->balance) ? 0 : $record->balance }}</td>
                    <td class="{{ !$record->is_active ? 'text-warning-dark' : ''}}">{{ $record->is_active ? 'Yes' : 'No' }}</td>
                    <td>
                        <div class="d-flex flex-wrap">
                            @if($record->is_active)
                                <div moe class="mr-2">
                                    <a href="" start show>Deactivate</a>
                                    <form url="/api/invoice/deactivate" class="mcp-theme-1" right>
                                        <p class="mb-2 text-nowrap">Deactivate this invoice?</p>
                                        <input type="hidden" name="uid" value="{{$record->uid}}">
                                        <div>
                                            <button submit class="btn btn-sm btn-primary mr-2">Submit</button>
                                            <button cancel class="btn btn-sm btn-default border">Cancel</button>
                                        </div>
                                    </form>
                                </div>
                            @else
                                <div moe class="mr-2">
                                    <a href="" start show>Reactivate</a>
                                    <form url="/api/invoice/reactivate" class="mcp-theme-1" right>
                                        <p class="mb-2 text-nowrap">Reactivate this invoice?</p>
                                        <input type="hidden" name="uid" value="{{$record->uid}}">
                                        <div>
                                            <button submit class="btn btn-sm btn-primary mr-2">Submit</button>
                                            <button cancel class="btn btn-sm btn-default border">Cancel</button>
                                        </div>
                                    </form>
                                </div>
                            @endif
                            <a href="{{route('patients.view.invoicing-invoice-transactions', ['patient' => $patient, 'invoice' => $record])}}" class="mr-2">Transactions</a>
                        </div>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>
    @endif
</div>
<script>
    (function () {
        function init() {
            initStagSuggest();
            let parentSegment = $('body');
            parentSegment.find('input[stag-suggest][target-key][target-field]')
                .off('stag-suggest-selected')
                .on('stag-suggest-selected', (_e, _input, _data) => {
                    _input = $(_input);
                    _input.closest('form').find('input[name="' + _input.attr('target-field') + '"]').val(_data[_input.attr('target-key')]);
                });
            parentSegment.find('.copy-target')
                .off('click.copy-target')
                .on('click.copy-target', function() {
                    copyTextToClipboard($(this).attr('data-target'));
                    return false;
                });

            parentSegment.find('.generate-and-visit-ic-portal')
                .off('click.generate-and-visit-ic-portal')
                .on('click.generate-and-visit-ic-portal', function() {
                    $.post('/api/session/proLogInAsCustomer', {
                        customerUid: $(this).attr('data-uid')
                    }, _data => {
                        if(!hasResponseError(_data)) {
                            window.location.href = '/ic/home/' + _data.data;
                            return false;
                        }
                    });
                    return false;
                });

            parentSegment.find('.generate-and-copy-ic-portal-url')
                .off('click.generate-and-copy-ic-portal-url')
                .on('click.generate-and-copy-ic-portal-url', function() {
                    $.post('/api/session/proLogInAsCustomer', {
                        customerUid: $(this).attr('data-uid')
                    }, _data => {
                        if(!hasResponseError(_data)) {
                            copyTextToClipboard('{{config('app.url')}}/ic/home/' + _data.data);
                            return false;
                        }
                    });
                    return false;
                });

            parentSegment.find('.generate-and-visit-ic-pay')
                .off('click.generate-and-visit-ic-pay')
                .on('click.generate-and-visit-ic-pay', function() {
                    $.post('/api/session/proLogInAsCustomer', {
                        customerUid: $(this).attr('data-uid')
                    }, _data => {
                        if(!hasResponseError(_data)) {
                            window.location.href = '/ic/pay/' + $(this).attr('data-invoice-uid') + '/' + _data.data;
                            return false;
                        }
                    });
                    return false;
                });

            parentSegment.find('.generate-and-copy-ic-pay-url')
                .off('click.generate-and-copy-ic-pay-url')
                .on('click.generate-and-copy-ic-pay-url', function() {
                    $.post('/api/session/proLogInAsCustomer', {
                        customerUid: $(this).attr('data-uid')
                    }, _data => {
                        if(!hasResponseError(_data)) {
                            copyTextToClipboard('{{config('app.url')}}/ic/pay/' + $(this).attr('data-invoice-uid') + '/' + _data.data);
                            return false;
                        }
                    });
                    return false;
                });
        }
        addMCInitializer('generic-invoices-{{camel_case($parentType)}}-{{$parentID}}', init, '#generic-invoices-{{camel_case($parentType)}}-{{$parentID}}')
    }).call(window);
</script>