@extends('frontend.vendor_dashboard.dashboard.layouts.app')

@section('content')
    <div class="page-content">
        <div class="card">
            <div class="card-body p-0">
                <form method="post" action="{{ route('vendor.gharjanaune.update', $gharjanaune->id) }}" class="needs-validation" novalidate=""
                    id="birth-form">
                    @csrf
                    @method('PUT')

                    <div class="card-header">
                        <h4>Edit Unmarried Record</h4>
                    </div>
                    <div class="card-body">
                        <div class="row ">
                            <!-- Chalani No -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>चलानी नं</label>
                                <input type="text" class="form-control" id="unique-input" name="chalani_no"
                                    value="{{ old('chalani_no', $gharjanaune->chalani_no) }}" inputmode="numeric">
                                <div class="invalid-feedback">
                                    कृपया चलानी नं भर्नुहोस्
                                </div>
                            </div>

                            <!-- Subject -->
                            <div class="form-group col-md-12 col-12 mb-3">
                                <label>विषय</label>
                                <input type="text" class="form-control" name="subject"
                                    value="{{ old('subject', $gharjanaune->subject) }}" required="">
                                <div class="invalid-feedback">
                                    कृपया विषय भर्नुहोस्
                                </div>
                            </div>

                            <!-- Previous Ward No -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>साविक वडा नं</label>
                                <input type="text" class="form-control nepali-input" name="previous_ward_no"
                                    value="{{ old('previous_ward_no', $gharjanaune->previous_ward_no) }}">
                                <div class="invalid-feedback">
                                    कृपया ठेगना भर्नुहोस्
                                </div>
                            </div>

                            <!-- Office Name -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>अफिसकाे नाम </label>
                                <input type="text" class="form-control nepali-input" name="office_name"
                                    value="{{ old('office_name', $gharjanaune->office_name) }}" required="">
                                <div class="invalid-feedback">
                                    कृपया जिल्ला भर्नुहोस्
                                </div>
                            </div>

                            <!-- Office Address -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>अफिसकाे ठेगाना</label>
                                <input type="text" class="form-control nepali-input" name="office_address"
                                    value="{{ old('office_address', $gharjanaune->office_address) }}" required="">
                                <div class="invalid-feedback">
                                    कृपया प्रदेश भर्नुहोस्
                                </div>
                            </div>

                            <!-- Applicant Name -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>निवेदक</label>
                                <input type="text" class="form-control nepali-input" name="applicant_name"
                                    value="{{ old('applicant_name', $gharjanaune->applicant_name) }}" required="">
                                <div class="invalid-feedback">
                                    कृपया निवेदकको नाम भर्नुहोस्
                                </div>
                            </div>

                            <!-- Applicant Municipality -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>निवेदककाे नगरपालिका</label>
                                <input type="text" class="form-control nepali-input" name="applicant_municipality"
                                    value="{{ old('applicant_municipality', $gharjanaune->applicant_municipality) }}" required="">
                                <div class="invalid-feedback">
                                    कृपया निवेदकको नगरपालिका भर्नुहोस्
                                </div>
                            </div>

                            <!-- Applicant Ward -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>निवेदककाे वडा</label>
                                <input type="text" class="form-control nepali-input" name="applicant_ward"
                                    value="{{ old('applicant_ward', $gharjanaune->applicant_ward) }}" required="">
                                <div class="invalid-feedback">
                                    कृपया निवेदकको वडा भर्नुहोस्
                                </div>
                            </div>

                            <!-- Applicant More (Multiple Applicants) -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>के निवेदक एक भन्दा बदि छ</label>
                                <select name="applicant_more" class="form-control" required>
                                    <option value="0" {{ old('applicant_more', $gharjanaune->applicant_more) == '0' ? 'selected' : '' }}>छैन</option>
                                    <option value="1" {{ old('applicant_more', $gharjanaune->applicant_more) == '1' ? 'selected' : '' }}>छ</option>
                                </select>
                                <div class="invalid-feedback">
                                    कृपया चयन गर्नुहोस्
                                </div>
                            </div>

                            <!-- Gender -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>लिङ्ग</label>
                                <select name="gender" class="form-control" required>
                                    <option value="">--Select--</option>
                                    <option value="Male" {{ old('gender', $gharjanaune->gender) == 'Male' ? 'selected' : '' }}>पुरुष</option>
                                    <option value="Female" {{ old('gender', $gharjanaune->gender) == 'Female' ? 'selected' : '' }}>महिला</option>
                                </select>
                                <div class="invalid-feedback">
                                    कृपया लिङ्ग चयन गर्नुहोस्
                                </div>
                            </div>

                            <!-- Plot No -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>कि नं</label>
                                <input type="text" class="form-control nepali-input" name="plot_no"
                                    value="{{ old('plot_no', $gharjanaune->plot_no) }}" required="">
                                <div class="invalid-feedback">
                                    कृपया कि नं भर्नुहोस्
                                </div>
                            </div>

                            <!-- Area -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>क्षाे फ</label>
                                <input type="text" class="form-control nepali-input" name="area"
                                    value="{{ old('area', $gharjanaune->area) }}">
                                <div class="invalid-feedback">
                                    कृपया क्षेत्रफल भर्नुहोस्
                                </div>
                            </div>

                            <!-- Is Complete -->
                            <div class="form-group col-md-6 col-6 mb-3">
                                <label>निर्माण सम्पन्न छ</label>
                                <select name="is_complete" class="form-control" required>
                                    <option value="0" {{ old('is_complete', $gharjanaune->is_complete) == '0' ? 'selected' : '' }}>छैन</option>
                                    <option value="1" {{ old('is_complete', $gharjanaune->is_complete) == '1' ? 'selected' : '' }}>छ</option>
                                </select>
                                <div class="invalid-feedback">
                                    कृपया चयन गर्नुहोस्
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="card-footer text-right">
                        <button type="submit" class="btn btn-primary">अद्यावधिक गर्नुहोस्</button>
                        <a href="{{ route('vendor.gharjanaune.index') }}" class="btn btn-secondary">रद्द गर्नुहोस्</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        $(document).ready(function() {
            // Remove validation error on input change
            $('input, select').on('input change', function() {
                $(this).removeClass('is-invalid');
                $(this).next('.invalid-feedback').hide();
            });

            // Client-side validation before submit
            $('#birth-form').on('submit', function(e) {
                let isValid = true;
                $(this).find('[required]').each(function() {
                    if (!$(this).val()) {
                        $(this).addClass('is-invalid');
                        isValid = false;
                    }
                });
                if (!isValid) {
                    e.preventDefault();
                    $('html, body').animate({
                        scrollTop: $('.is-invalid:first').offset().top - 100
                    }, 500);
                }
            });
        });
    </script>
@endpush