@extends('layouts.app')
@section('title', 'Installment Bulk Update')

@section('content')
<div class="container-fluid">
    <x-setting_tabs/>
        <div class="col-12" id="lienfilterdiv">
                <div id="updatedates" class="text-center" style="display:none"><button class="btn btn-success" onclick="updateinstallmentdates();">Update Installment Dates</button></div>
                <table id="lienstatustable1" class="table table-bordered mb-0">
                    <thead style="background-color:rgb(23, 25, 104) !important;color:#fff !important;">
                        <tr>
                            <th style="color:#fff !important">All <input type="checkbox" name="selectall" id="selectall"></th>
                            <th style="color:#fff !important">Loan No</th>
                            <th style="color:#fff !important">Property Address</th>
                            <th style="color:#fff !important">City</th>
                            <th style="color:#fff !important">State</th>
                            <th style="color:#fff !important">Agency</th>
                            <th style="color:#fff !important">Parcel No</th>
                        </tr>
                    </thead>
                    <tbody>
                                            </tbody>
                </table>
        </div>
</div>
@endsection
@section('script')
<script>
    $(document).ready(function() {
		$(".odtabs").not("#tab23").addClass('btn-outline-secondary');
		$("#tab23").addClass('btn-secondary');
	});
      $('#lienstatustable1').DataTable({
                    dom: 'lBfrtip',
                    "lengthMenu": [10,50,100,200,500,1000,2000,5000],
                    "buttons":['excel']
                    });
    $("#selectall").on('change', function()
    {
        if($("#selectall").is(':checked'))
        {
            $(".checkloanclass").prop("checked", true).addClass('checkclass');

            $("#updatedates").show();
        }
        else
        {
            $(".checkloanclass").prop("checked", false).removeClass('checkclass');

            $(".agencyclass").removeClass("agencyselected");
            $("#updatedates").hide();
        }
    });
function updatecheckclass(id)
    {
        if($("#"+id).is(':checked'))
        {

            $("#"+id).prop("checked", true).addClass('checkclass');
            $("#updatedates").show();
        }
        else
        {
            $("#"+id).prop("checked", false).removeClass('checkclass');
            var totallength = $('.checkloanclass').length;
            var numberOfChecked = $('.checkloanclass:checked').length;

            if(numberOfChecked < totallength)
            {
                $("#selectall").prop("checked", false);

            }
            if(numberOfChecked == 0)
            {
                $("#selectall").prop("checked", false);
                $("#updatedates").hide();
            }
        }
    }
function updateinstallmentdates()
{
    let agencyids = $(".checkloanclass:checked")
                .map(function (){
                return $(this).val();
            }).toArray();
    $.ajax({
            type: "POST",
            url: "{{route('updateinstallmentdatesbulk')}}",
            data: { "_token": "{{ csrf_token() }}",
                    "agencyids":agencyids,
                },
                success: function(response)
                {
                   location.href = location.href;
                }
        });
}
</script>
@endsection