@extends('admin.layouts.layout')

@section('content')

@if($Application->form_type == '1')
    @include('admin.applications.english')
@elseif($Application->form_type == '2')
    @include('admin.applications.gujarati')
@endif

@endsection

@section('footer-script')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.5/jquery.validate.min.js"></script>

<script>
$(document).ready(function () {

    $('.whitespace-trim').on('input', function() {
        var value = $(this).val();
        if (value && value.charAt(0) === ' ') {
            $(this).val(value.substring(1));
        }
    });

    $('.only-number').on('input', function() {
        var value = $(this).val();
        var numericValue = value.replace(/\D/g, '');
        if (numericValue.length > 10) {
            numericValue = numericValue.substring(0, 10);
        }
        $(this).val(numericValue);
    });

    $.validator.addMethod("lettersonly", function(value, element) {
        return this.optional(element) || /^[a-zA-Z\s]+$/.test(value);
    }, "Please enter only alphabetic characters and spaces.");

    $.validator.addMethod("gujaratiOnly", function (value, element) {
        return this.optional(element) || /^[\u0A80-\u0AFF\s]+$/.test(value);
    }, "ફક્ત ગુજરાતી અક્ષરો અને જગ્યા મંજુર છે.");

    $.validator.addMethod("regexEmail", function(value, element) {
        var regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
        return this.optional(element) || regex.test(value);
    });

    $.validator.addMethod("propertyCardFormat", function (value, element) {
        return this.optional(element) || /^[A-Z]\/\d{2}\/\d{2}\/\d{3,4}$/.test(value);
    }, "Please enter in the format A/NN/NN/NNN or A/NN/NN/NNNN.");


    // Initialize the form validation
    $( '#applicationFormEng').validate({
        errorElement: 'div',
        rules: {
            property_card_no: {
                required: true,
            },
            'nature_of_document_id[]': {
                required: true
            },
            'full_name_claiming[]': {
                required: true,
                lettersonly: true
            },
            'religion_id_claiming[]': {
                required: true,
            },
            'age_claiming[]': {
                required: true,
                number: true
            },
            'occupation_id_claiming[]': {
                required: true
            },
            'mobile_no_claiming[]': {
                required: true,
                number: true,
                minlength: 10,
                maxlength: 10
            },
            'id_proof_type_id_claiming[]': {
                required: true
            },
            'id_proof_no_claiming[]': {
                required: true
            },
            'address_claiming[]': {
                required: true
            },
            'email_claiming[]': {
                email: true,
                regexEmail: true
            },
            north_boundary: {
                required: true,
            },
            south_boundary: {
                required: true,
            },
            east_boundary: {
                required: true,
            },
            west_boundary: {
                required: true,
            },
            'mortgage_cheque_upi_no[]': {
                number: true,
            },
            'mortgage_amount[]': {
                number: true,
            },
            'mortgage_top_up_amount[]': {
                number: true,
            },
            'banakhat_cheque_upi_no[]': {
                number: true,
            },
            'banakhat_amount[]': {
                number: true,
            },
            'banakhat_bank[]': {
                lettersonly: true,
            },
            'saledeed_cheque_upi_no[]': {
                number: true,
            },
            'saledeed_amount[]': {
                number: true,
            },
            'saledeed_bank[]': {
                lettersonly: true,
            },
        },
        messages: {
            property_card_no: {
                required: '<span class="text-danger">* Property Card No is required.</span>',
            },
            'nature_of_document_id[]': {
                required: '<span class="text-danger">* Nature of Document is required.</span>',
            },
            'full_name_claiming[]': {
                required: '<span class="text-danger">* Full name is required.</span>',
                lettersonly: '<span class="text-danger">* Only alphabets and spaces are allowed.</span>'
            },
            'religion_id_claiming[]': {
                required: '<span class="text-danger">* Religion is required.</span>',
            },
            'age_claiming[]': {
                required: '<span class="text-danger">* Age is required.</span>',
                number: '<span class="text-danger">* Please enter a valid number.</span>'
            },
            'occupation_id_claiming[]': {
                required: '<span class="text-danger">* Occupation is required.</span>'
            },
            'mobile_no_claiming[]': {
                required: '<span class="text-danger">* Mobile number is required.</span>',
                number: '<span class="text-danger">* Please enter a valid number.</span>',
                minlength: '<span class="text-danger">* Mobile number must be at least 10 number.</span>',
                maxlength: '<span class="text-danger">* Mobile number must be at least 10 number.</span>'
            },
            'id_proof_type_id_claiming[]': {
                required: '<span class="text-danger">* Id Proof Type is required.</span>'
            },
            'id_proof_no_claiming[]': {
                required: '<span class="text-danger">* Id Proof No is required.</span>'
            },
            'address_claiming[]': {
                required: '<span class="text-danger">* Address is required.</span>'
            },
            'email_claiming[]': {
                email: '<span class="text-danger">* Please enter a valid email address (e.g., mailto:user@example.com).</span>',
                regexEmail: '<span class="text-danger">* Please enter a valid email address (e.g., mailto:user@example.com).</span>'
            },
            north_boundary: {
                required: '<span class="text-danger">* North Boundary is required.</span>'
            },
            south_boundary: {
                required: '<span class="text-danger">* South Boundary is required.</span>'
            },
            east_boundary: {
                required: '<span class="text-danger">* East Boundary is required.</span>'
            },
            west_boundary: {
                required: '<span class="text-danger">* West Boundary is required.</span>'
            },
            'mortgage_cheque_upi_no[]': {
                number: '<span class="text-danger">* Please enter a valid number.</span>',
            },
            'mortgage_amount[]': {
                number: '<span class="text-danger">* Please enter a valid number.</span>',
            },
            'mortgage_top_up_amount[]': {
                number: '<span class="text-danger">* Please enter a valid number.</span>',
            },
            'banakhat_cheque_upi_no[]': {
                number: '<span class="text-danger">* Please enter a valid number.</span>',
            },
            'banakhat_amount[]': {
                number: '<span class="text-danger">* Please enter a valid number.</span>',
            },
            'banakhat_bank[]': {
                lettersonly: '<span class="text-danger">* Only alphabets and spaces are allowed.</span>'
            },
            'saledeed_cheque_upi_no[]': {
                number: '<span class="text-danger">* Please enter a valid number.</span>',
            },
            'saledeed_amount[]': {
                number: '<span class="text-danger">* Please enter a valid number.</span>',
            },
            'saledeed_bank[]': {
                lettersonly: '<span class="text-danger">* Only alphabets and spaces are allowed.</span>'
            },
        },
    });

    $('#applicationFormGuj').validate({
        errorElement: 'div',
        rules: {
            property_card_no: { required: true },
            extra_construction_amount: { number: true },
            extra_construction_builup_area: { number: true },
            construction_builup_area: { number: true },
            construction_amount: { number: true },

            'nature_of_document_id[]': { required: true },
            'full_name_claiming[]': { required: true },
            'religion_id_claiming[]': { required: true },
            'age_claiming[]': { required: true, number: true },
            'occupation_id_claiming[]': { required: true },
            'mobile_no_claiming[]': {
                required: true,
                number: true,
                minlength: 10,
                maxlength: 10
            },
            'id_proof_type_id_claiming[]': { required: true },
            'id_proof_no_claiming[]': { required: true },
            'address_claiming[]': { required: true },

            north_boundary: { required: true },
            south_boundary: { required: true },
            east_boundary: { required: true },
            west_boundary: { required: true },

            'banakhat_cheque_upi_no[]': { number: true },
            'banakhat_amount[]': { number: true },

            'saledeed_cheque_upi_no[]': { number: true },
            'saledeed_amount[]': { number: true },
        },
        messages: {
            property_card_no: {
                required: '<span class="text-danger">* પ્રોપર્ટી કાર્ડ નં. જરૂરી છે.</span>',
            },
            extra_construction_builup_area: {
                number: '<span class="text-danger">* કૃપા કરી માન્ય પ્રમાણ દાખલ કરો.</span>'
            },
            extra_construction_amount: {
                number: '<span class="text-danger">* કૃપા કરી માન્ય પ્રમાણ દાખલ કરો.</span>'
            },
            construction_builup_area: {
                number: '<span class="text-danger">* કૃપા કરી માન્ય પ્રમાણ દાખલ કરો.</span>'
            },
            construction_amount: {
                number: '<span class="text-danger">* કૃપા કરી માન્ય પ્રમાણ દાખલ કરો.</span>'
            },
            'nature_of_document_id[]': {
                required: '<span class="text-danger">* દસ્તાવેજનો સ્વરૂપ જરૂરી છે.</span>',
            },
            'full_name_claiming[]': {
                required: '<span class="text-danger">* પૂરું નામ જરૂરી છે.</span>',
            },
            'religion_id_claiming[]': {
                required: '<span class="text-danger">* ધર્મ જરૂરી છે.</span>',
            },
            'age_claiming[]': {
                required: '<span class="text-danger">* ઉંમર જરૂરી છે.</span>',
                number: '<span class="text-danger">* કૃપા કરી માન્ય ઉંમર દાખલ કરો.</span>'
            },
            'occupation_id_claiming[]': {
                required: '<span class="text-danger">* વ્યવસાય જરૂરી છે.</span>'
            },
            'mobile_no_claiming[]': {
                required: '<span class="text-danger">* મોબાઇલ નંબર જરૂરી છે.</span>',
                number: '<span class="text-danger">* કૃપા કરી માન્ય નંબર દાખલ કરો.</span>',
                minlength: '<span class="text-danger">* મોબાઇલ નંબર ઓછામાં ઓછો 10 અંકનો હોવો જોઈએ.</span>',
                maxlength: '<span class="text-danger">* મોબાઇલ નંબર વધુમાં વધુ 10 અંકનો હોવો જોઈએ.</span>'
            },
            'id_proof_type_id_claiming[]': {
                required: '<span class="text-danger">* ઓળખ પ્રમાણપત્ર પ્રકાર જરૂરી છે.</span>'
            },
            'id_proof_no_claiming[]': {
                required: '<span class="text-danger">* ઓળખ પ્રમાણપત્ર નંબર જરૂરી છે.</span>'
            },
            'address_claiming[]': {
                required: '<span class="text-danger">* સરનામું જરૂરી છે.</span>'
            },
            north_boundary: {
                required: '<span class="text-danger">* ઉત્તર સરહદ જરૂરી છે.</span>',
            },
            south_boundary: {
                required: '<span class="text-danger">* દક્ષિણ સરહદ જરૂરી છે.</span>',
            },
            east_boundary: {
                required: '<span class="text-danger">* પૂર્વ સરહદ જરૂરી છે.</span>',
            },
            west_boundary: {
                required: '<span class="text-danger">* પશ્ચિમ સરહદ જરૂરી છે.</span>',
            },
            'banakhat_amount[]': {
                number: '<span class="text-danger">* કૃપા કરી માન્ય રકમ દાખલ કરો.</span>',
            },
            'saledeed_cheque_upi_no[]': {
                number: '<span class="text-danger">* કૃપા કરી માન્ય નંબર દાખલ કરો.</span>',
            },
            'saledeed_amount[]': {
                number: '<span class="text-danger">* કૃપા કરી માન્ય રકમ દાખલ કરો.</span>',
            }
        }
    });


});

$(document).ready(function () {
    $('.addMoreClaim').on('click', function () {
        var newGroup = $('.claiming-party-group').first().clone();

        // Clear input/select/textarea values
        newGroup.find('input, textarea').val('');
        newGroup.find('select').prop('selectedIndex', 0);

        $('#claimingPartyContainer').append(newGroup);
    });

    // Remove claiming party group
    $(document).on('click', '.removeClaim', function () {
        if ($('.claiming-party-group').length > 1) {
            $(this).closest('.claiming-party-group').remove();
        } else {
            alert("At least one claiming party is required.");
        }
    });
});

$(document).ready(function () {
    $(document).on('click', '.addBanakhat', function () {
        let html = `
        <div class="row banakhat-row mb-3">
            <div class="col-lg-12 text-end mb-2">
                <button type="button" class="btn btn-danger btn-sm removeBanakhat" style="width: 30px;">-</button>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Cheque No/UPI No</label>
                    <input type="text" name="banakhat_cheque_upi_no[]" class="new-control form-control cheque-no whitespace-trim" placeholder="Enter Cheque No/UPI No">
                    <small class="text-danger" id="chequeNoErr"></small>
                </div>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Consideration Amount (Rs.)</label>
                    <input type="text" name="banakhat_amount[]" class="new-control form-control amount whitespace-trim" placeholder="Enter Amount">
                </div>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Bank Name</label>
                    <input type="text" name="banakhat_bank[]" class="new-control form-control bank whitespace-trim" placeholder="Enter Bank">
                </div>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Date</label>
                    <input type="date" name="banakhat_date[]" class="new-control form-control date whitespace-trim">
                </div>
            </div>
        </div>
        `;
        $('#banakhat-container').append(html);
    });

    $(document).on('click', '.removeBanakhat', function () {
        $(this).closest('.banakhat-row').remove();
    });
});

$(document).ready(function () {
    // Add Sale Deed Row
    $(document).on('click', '.addSaledeed', function () {
        let html = `
        <div class="row saledeed-row mb-3">
            <div class="col-lg-12 text-end mb-2">
                <button type="button" class="btn btn-danger btn-sm removeSaledeed" style="width: 30px;">-</button>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Cheque No/UPI No</label>
                    <input type="text" name="saledeed_cheque_upi_no[]" class="new-control form-control cheque-no" placeholder="Enter Cheque No/UPI No">
                </div>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Consideration Amount (Rs.)</label>
                    <input type="text" name="saledeed_amount[]" class="new-control form-control amount" placeholder="Enter Amount">
                </div>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Bank Name</label>
                    <input type="text" name="saledeed_bank[]" class="new-control form-control bank" placeholder="Enter Bank">
                </div>
            </div>

            <div class="col-lg-3">
                <div class="form-group">
                    <label>Date</label>
                    <input type="date" name="saledeed_date[]" class="new-control form-control date">
                </div>
            </div>
        </div>`;
        $('#saledeed-container').append(html);
    });

    // Remove Sale Deed Row
    $(document).on('click', '.removeSaledeed', function () {
        $(this).closest('.saledeed-row').remove();
    });
});

$(document).ready(function () {
        let claimingIndex = 1;

        // Add More button click
        $(document).on('click', '.addMoreClaimGuj', function () {
            claimingIndex++;

            let html = `
            <div class="claiming-party-group-wrapper">
                <div class="card-header border-bottom justify-content-between d-flex flex-wrap align-items-center gap-2">
                    <h3 class="header-title">વેચાણ લેનાર : <span class="party-index">${claimingIndex}</span></h3>
                    <button type="button" class="btn btn-danger btn-sm removeClaimBlock">- દૂર કરો</button>
                </div>
                <div class="row claiming-party-group mb-3 mt-3">
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">પૂરું નામ</label><span style="color: red; font-size: large;"> *</span>
                        <input type="text" id="full_name_claiming[]" name="full_name_claiming[]" class="form-control whitespace-trim" placeholder="પૂરું નામ દાખલ કરો">
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">ધર્મ</label><span style="color: red; font-size: large;"> *</span>
                        <select class="form-control whitespace-trim" id="religion_id_claiming[]" name="religion_id_claiming[]">
                            <option value="">ધર્મ પસંદ કરો</option>
                            @foreach ($Religions as $Religion)
                                <option value="{{ $Religion->id }}">{{ $Religion->name_guj }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">ઉંમર</label><span style="color: red; font-size: large;"> *</span>
                        <input type="number" id="age_claiming[]" name="age_claiming[]" class="form-control whitespace-trim" placeholder="તમારી ઉંમર દાખલ કરો">
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">વ્યવસાય</label><span style="color: red; font-size: large;"> *</span>
                        <select class="form-control whitespace-trim" id="occupation_id_claiming[]" name="occupation_id_claiming[]">
                            <option value="">વ્યવસાય પસંદ કરો</option>
                            @foreach ($Occupations as $Occupation)
                                <option value="{{ $Occupation->id }}">{{ $Occupation->name_guj }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">મોબાઇલ નંબર</label><span style="color: red; font-size: large;"> *</span>
                        <input type="tel" id="mobile_no_claiming[]" name="mobile_no_claiming[]" class="form-control whitespace-trim" placeholder="મોબાઇલ નંબર દાખલ કરો">
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">ઓળખનો પુરાવો</label><span style="color: red; font-size: large;"> *</span>
                        <select class="form-control whitespace-trim" id="id_proof_id[]" name="id_proof_id[]">
                            <option value="">ઓળખનો પુરાવો પસંદ કરો</option>
                            @foreach ($IdProofTypes as $IdProofType)
                                <option value="{{ $IdProofType->id }}">{{ $IdProofType->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">ઓળખ પુરાવાનો નંબર</label><span style="color: red; font-size: large;"> *</span>
                        <input type="text" id="id_proof_no[]" name="id_proof_no[]" class="form-control whitespace-trim" placeholder="ઓળખ પુરાવાનો નંબર દાખલ કરો">
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">ઇમેઇલ</label><span style="color: red; font-size: large;"> *</span>
                        <input type="email" id="email_claiming[]" name="email_claiming[]" class="form-control whitespace-trim" placeholder="ઇમેઇલ દાખલ કરો">
                    </div>
                    <div class="mb-3 col-lg-3">
                        <label class="form-label">સરનામું</label><span style="color: red; font-size: large;"> *</span>
                        <textarea id="address_claiming[]" name="address_claiming[]" class="form-control whitespace-trim" placeholder="સરનામું દાખલ કરો"></textarea>
                    </div>
                </div>
            </div>`;

            $('#claimingPartyContainer').append(html);
        });

        // Remove button click
        $(document).on('click', '.removeClaimBlock', function () {
            $(this).closest('.claiming-party-group-wrapper').remove();
            // Re-index the titles
            $('.party-index').each(function (index) {
                $(this).text(index + 1);
            });
        });
    });

$(document).on('click', '.addBanakhatGuj', function () {
    let html = `<div class="row banakhat-row-guj">
        <div class="col-lg-12">
            <div class="form-group mt-3" style="float: right;">
                <button type="button" class="btn btn-danger btn-sm removeBanakhatGuj" style="width: 30px;">-</button>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="form-group">
                <label>ચેક નંબર/યુપીઆઈ નંબર</label>
                <input type="text" name="banakhat_cheque_upi_no[]" class="new-control form-control cheque-no whitespace-trim" placeholder="ચેક નંબર/યુપીઆઈ નંબર દાખલ કરો">
                <small class="text-danger" class="chequeNoErr"></small>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="form-group">
                <label>વિચારણાની રકમ (રૂ. )</label>
                <input type="text" name="banakhat_amount[]" class="new-control form-control amount whitespace-trim" placeholder="રકમ દાખલ કરો">
            </div>
        </div>
        <div class="col-lg-3">
            <div class="form-group">
                <label>બેંકનું નામ</label>
                <input type="text" name="banakhat_bank[]" class="new-control form-control bank whitespace-trim" placeholder="બેંકનું નામ દાખલ કરો">
            </div>
        </div>
        <div class="col-lg-3">
            <div class="form-group">
                <label>તારીખ</label>
                <input type="date" name="banakhat_date[]" class="new-control form-control date whitespace-trim">
            </div>
        </div>
    </div>`;
    $('#banakhat-container-guj').append(html);
});
// Remove row
$(document).on('click', '.removeBanakhatGuj', function () {
    $(this).closest('.banakhat-row-guj').remove();
});

$(document).ready(function () {
    // Add new Sale Deed Payment row
    $(document).on('click', '.addSaledeedGuj', function (e) {
        e.preventDefault();
        let html = `
        <div class="row saledeed-row-guj">
            <div class="col-lg-12">
                <div class="form-group mt-3 " style="float: right;">
                    <button type="button" class="btn btn-danger btn-sm removeSaledeedGuj" style="width: 30px;">-</button>
                </div>
            </div>
            <div class="col-lg-3">
                <div class="form-group">
                    <input type="hidden" name="saledeed_payment_id[]" value="">
                    <label>ચેક નંબર/યુપીઆઈ નંબર</label>
                    <input type="text" name="saledeed_cheque_upi_no[]" class="new-control form-control cheque-no whitespace-trim" placeholder="ચેક નંબર/યુપીઆઈ નંબર દાખલ કરો">
                </div>
            </div>
            <div class="col-lg-3">
                <div class="form-group">
                    <label>વિચારણાની રકમ (રૂ. )</label>
                    <input type="text" name="saledeed_amount[]" class="new-control form-control amount whitespace-trim" placeholder="રકમ દાખલ કરો">
                </div>
            </div>
            <div class="col-lg-3">
                <div class="form-group">
                    <label>બેંકનું નામ</label>
                    <input type="text" name="saledeed_bank[]" class="new-control form-control bank whitespace-trim" placeholder="બેંકનું નામ દાખલ કરો">
                </div>
            </div>
            <div class="col-lg-3">
                <div class="form-group">
                    <label>તારીખ</label>
                    <input type="date" name="saledeed_date[]" class="new-control form-control date whitespace-trim" placeholder="તારીખ દાખલ કરો">
                </div>
            </div>
        </div>`;

        // Append after last row
        $(this).closest('.saledeed-row-guj').after(html);
    });

    // Remove Sale Deed Payment row
    $(document).on('click', '.removeSaledeedGuj', function (e) {
        e.preventDefault();
        $(this).closest('.saledeed-row-guj').remove();
    });
});

$(document).on('click', '.removeClaimBlock', function () {
    let $button = $(this);

    // Find the next sibling claiming-party-group after the .card-header
    let claimingPartyId = $button.closest('.card-header').next('.claiming-party-group').find('.claiming-party-id').val();
    console.log(claimingPartyId);

    if (confirm('Are you sure you want to delete this party?')) {
        $.ajax({
            url: '/admin/delete-claiming-party/' + claimingPartyId,
            type: 'DELETE',
            data: {
                _token: $('meta[name="csrf-token"]').attr('content') // for CSRF protection
            },
            success: function (response) {
                if (response.success) {
                    // Remove both card-header and claiming-party-group
                    $button.closest('.card-header').next('.claiming-party-group').remove();
                    $button.closest('.card-header').remove();

                    alert('Deleted successfully.');
                } else {
                    alert('Delete failed.');
                }
            },
            error: function () {
                alert('Something went wrong.');
            }
        });
    }
});

$(document).on('click', '.removeBanakhatGuj', function () {
    const $row = $(this).closest('.banakhat-row-guj');
    const id = $row.find('.banakat_payment_id').val();

    if (!id) {
        // No ID means it's a newly added row not saved in DB yet
        $row.remove();
        return;
    }

    if (!confirm('Are you sure you want to delete this payment?')) return;

    $.ajax({
        url: `/admin/banakhat-payment/delete/${id}`,
        type: 'DELETE',
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        success: function () {
            $row.remove();
        },
        error: function () {
            alert('There was a problem deleting the payment.');
        }
    });
});

$(document).on('click', '.removeSaledeedGuj', function () {
    const $row = $(this).closest('.saledeed-row-guj');
    const id = $row.find('.saledeed_payment_id').val();

    if (!id) {
        // No ID means it's a newly added row not saved in DB yet
        $row.remove();
        return;
    }

    if (!confirm('Are you sure you want to delete this payment?')) return;

    $.ajax({
        url: `/admin/saledeed-payment/delete/${id}`,
        type: 'DELETE',
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        success: function () {
            $row.remove();
        },
        error: function () {
            alert('There was a problem deleting the payment.');
        }
    });
});

document.addEventListener('click', function (e) {
    if (e.target.classList.contains('removeBanakhat')) {
        let row = e.target.closest('.banakhat-row');
        let paymentId = row.querySelector('.banakhat_payment_id').value;

        if (confirm("Are you sure you want to delete this entry?")) {
            fetch(`/admin/banakhat-payment/delete/${paymentId}`, {
                method: 'DELETE',
                headers: {
                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
                    'Content-Type': 'application/json'
                }
            })
            .then(response => {
                if (response.ok) {
                    row.remove(); // remove from DOM
                } else {
                    alert("Failed to delete.");
                }
            })
            .catch(error => {
                console.error("Error:", error);
                alert("Something went wrong.");
            });
        }
    }
});

document.addEventListener('click', function (e) {
    if (e.target.classList.contains('removeSaledeed')) {
        let row = e.target.closest('.saledeed-row');
        let paymentId = row.querySelector('input[name="saledeed_payment_id[]"]').value;

        if (confirm("Are you sure you want to delete this Sale Deed payment?")) {
            fetch(`/admin/saledeed-payment/delete/${paymentId}`, {
                method: 'DELETE',
                headers: {
                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
                    'Content-Type': 'application/json',
                },
            })
            .then(response => {
                if (response.ok) {
                    row.remove(); // Remove the row from the DOM
                } else {
                    alert("Failed to delete. Please try again.");
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert("Something went wrong. Please check the console.");
            });
        }
    }
});

</script>

@endsection