@include('layouts.header', ['title' => 'Add Query'])
<div class="wrapper">
    @include('layouts.navbar')
    @include('layouts.sidebar')

    <div class="content-page">
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">
                        <div class="page-title-box">
                            <div class="page-title-right"></div>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-9">
                        <div class="card">
                            <div class="card-header">
                                <h4 class="page-title">Add Query</h4>

                            </div>

                            <form id="userForm" action="{{ route('admin.rnr.store_remarks') }}" method="POST"
                                enctype="multipart/form-data">
                                @csrf

                                <div class="card-body">
                                    <div class="mb-3">
                                        <label for="remarks" class="form-label">Remarks <span
                                        class="text-danger">*</span></label>
                                        <textarea id="remarks" name="remarks" class="form-control" rows="4" required placeholder="Enter your remarks here">{{ old('remarks') }}</textarea>
                                    </div>
                                </div>

                                <div class="card-footer border-top border-light">
                                    <button type="submit" class="btn btn-success me-2" id="submitBtn">Submit</button>
                                </div>
                            </form>

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

            </div>
        </div>

        @include('layouts.footer')
    </div>
</div>

<!-- Vendor JS -->
<script src="{{ asset('assets/js/vendor.min.js') }}"></script>
<!-- jQuery UI (should load after vendor.min.js) -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

<script src="{{ asset('assets/js/app.min.js') }}"></script>


<script>
    $(document).ready(function() {
        // Show error/success messages using Toastr
        @if ($errors->any())
            @foreach ($errors->all() as $error)
                toastr.error("{{ $error }}");
            @endforeach
        @endif

        @if (session('success'))
            toastr.success("{{ session('success') }}");
        @endif

        @if (session('error'))
            toastr.error("{{ session('error') }}");
        @endif

        // Prevent multiple submissions
        $('#userForm').on('submit', function() {
            const submitButton = $(this).find('button[type="submit"]');
            // Disable the button to prevent further clicks
            submitButton.prop('disabled', true).text('Submitting...');
        });


    });
</script>


</body>

</html>