<div class="row mb-3">
    <div class="col">
        <h4>
            <x-form.buttons.button-add id="add_payment" class="btn-xs" />
            Règlements
        </h4>
    </div>
</div>
@if ($payments ?? false)
    <table class="table">
        <thead>
            <th>Date</th>
            <th>Type</th>
            <th class="text-right">Montant</th>
            <th>Ref</th>
        </thead>
        <tbody>
            @foreach ($payments as $payment)
                <tr>
                    <td>{{ $payment['date'] }}</td>
                    <td>{{ $payment_types[$payment['payment_type']] }}</td>
                    <td class="text-right font-weight-bold">{{ sprintf('%01.2f', $payment['amount']) }} €</td>
                    <td>{{ $payment['reference'] }}</td>
                    <td class="text-right">
                        <x-form.buttons.edit :dataId="$payment['id']" class="payment-edit btn-xs" />
                        <x-form.buttons.delete :dataId="$payment['id']" class="payment-delete btn-xs" />
                    </td>
                </tr>
            @endforeach
        </tbody>
    </table>
@endif

@include('load.form.datepicker')

@push('js')
    <script>
        $('#add_payment').click(function() {
            InvoicePaymentCreate();
        });
        $('.payment-edit').click(function() {
            InvoicePaymentEdit($(this).data('id'));
        });
        $('.payment-delete').click(function() {
            InvoicePaymentDelete($(this).data('id'));
        });

        function InvoicePaymentCreate() {
            var url_open = "{{ route('Admin.Shop.InvoicePayments.create') }}/{{ $invoice['id'] }}";
            var url_save = "{{ route('Admin.Shop.InvoicePayments.store') }}";
            openModal("Ajouter un paiement", '#invoice_payment-form', url_open, url_save,
                "InvoicePaymentRefresh();", 'sm');
        }

        function InvoicePaymentEdit(id) {
            var url_open = "{{ route('Admin.Shop.InvoicePayments.edit') }}/" + id;
            var url_save = "{{ route('Admin.Shop.InvoicePayments.store') }}";
            openModal("Editer un paiement", '#invoice_payment-form', url_open, url_save,
                "InvoicePaymentRefresh();", 'sm');
        }

        function InvoicePaymentDelete(id) {
            var url = "{{ route('Admin.Shop.InvoicePayments.destroy') }}/" + id;
            $.get(url, function() {
                window.location = "{{ route('Admin.Shop.Invoices.edit') }}/{{ $invoice['id'] }}";
            });
        }
    </script>
@endpush
