@if (request('type') == 'new')
    <div class="modal fade" id="modalClient" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog"
        aria-labelledby="modalUserLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="modalUserLabel"> Client Details</h4>
                </div>
                <form id="formClient" action="{{ route('paymentlink') }}" method="POST" class="needs-validation"
                    novalidate>
                    <div class="modal-body">
                        @csrf
                        <input type="hidden" name="callback_url" value="{{ route('payment.callback') }}">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="amount" class="form-label">Amount <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="amount" name="amount"
                                        placeholder="" value="" required>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="currency" class="form-label">currency <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="currency" name="currency"
                                        placeholder="" value="" required>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="reference_id" class="form-label">reference_id <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="reference_id" name="reference_id"
                                        placeholder="" value="" required>

                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="description" class="form-label">description <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="description" name="description"
                                        placeholder="" value="" required>

                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="name" class="form-label">customer name <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="name" name="name"
                                        placeholder="" value="" required>

                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="contact" class="form-label">contact no <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="contact" name="contact"
                                        placeholder="" value="" required>

                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="email" class="form-label">Email <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="email" name="email"
                                        placeholder="" value="" required>

                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="callback_url" class="form-label">callback_url <code
                                            class="highlighter-rouge">*</code></label>
                                    <input type="text" class="form-control" id="callback_url" name="callback_url"
                                        placeholder="" value="" required>

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button id="btnSave" type="submit" class="btn btn-primary">Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endif
@section('custom-scripts')
    <script>
        $(document).ready(function() {
            $('#formClient').on('submit', function(event) {
                event.preventDefault();

                var formData = {
                    amount: $('#amount').val() * 100,
                    currency: $('#currency').val(),
                    accept_partial: $('#accept_partial').val() === 'true' ? true : false,
                    first_min_partial_amount: $('#first_min_partial_amount').val() * 100,
                    expire_by: new Date($('#expire_by').val()).getTime() / 1000,
                    reference_id: $('#reference_id').val(),
                    callback_url: $('#callback_url').val(),
                    callback_method: $('#callback_method').val() || 'get'
                };

                $.ajax({
                    url: 'https://api.razorpay.com/v1/payment_links',
                    type: 'POST',
                    data: formData,
                    success: function(response) {
                        toastr["success"]("Payment link created successfully!");
                        $('#modalClient').modal('hide');
                        
                    },
                    error: function(xhr, status, error) {
                        toastr["error"]("Failed to create payment link. Please try again.");
                        console.error(xhr.responseText);
                    }
                });
            });
        });
    </script>
@endsection