@extends('layouts.app')
@section('title', 'Polish American Liens')
@section('content')
<style>

.loading
    {
        position: fixed;
        z-index: 999;
        height: 2em;
        width: 2em;
        overflow: show;
        margin: auto;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
    }

/* Transparent Overlay */
    .loading:before
    {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
        background: radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0, .8));

    background: -webkit-radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0,.8));
    }

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required)
{
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.loading:not(:required):after
{
  content: '';
  display: block;
  font-size: 10px;
  width: 1em;
  height: 1em;
  margin-top: -0.5em;
  -webkit-animation: spinner 150ms infinite linear;
  -moz-animation: spinner 150ms infinite linear;
  -ms-animation: spinner 150ms infinite linear;
  -o-animation: spinner 150ms infinite linear;
  animation: spinner 150ms infinite linear;
  border-radius: 0.5em;
  -webkit-box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
    box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner
{
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes spinner
{
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes spinner
{
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spinner
{
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
</style>
<div class="m-0 p-0">
    <div id="loaderclass" class="loading d-none">Loading&#8230;</div>
    <div class="container-fluid">
        <div id="taxautomationdiv">
             <div id="addtaxautomate" class="col-12 text-center mt-2 d-none">
                <button type="button" name="gettaxdetails" class="btn btn-warning" onclick="updatepolishpaid();">Update as Paid</button>
            </div>
            <table id="datatable2" class="table table-bordered mb-0"  >
                <thead class="correctionheader">
                    <tr>
                        <th><input type="checkbox" id="selectall"> All </th>
                        <th>Loan No.</th>
                        <th>Borrower Name.</th>
                        <th>Property Address</th>
                        <th>City</th>
                        <th>State</th>
                        <th>Zip</th>
                        <th>Parcel No</th>
                        <th>Agency</th>
                        <th>Year</th>
                        <th>Installment</th>
                        <th>Tax Amount</th>
                        <th>Balance</th>
                        <th>Tax Status</th>
                    </tr>
                </thead>
                <tbody>
                                    </tbody>
            </table>
        </div>
    </div>
</div>
@endsection
@section('script')
<script>
    $('#datatable2').DataTable({
        dom: 'lBfrtip',
        "paging": true,
        "info": true,
        searching:true,
        'columnDefs': [
      {
         'targets': 0,
         orderable: false,
         'checkboxes': {
            'selectRow': true
         }
      }
   ],
        "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');

                $("#addtaxautomate").removeClass("d-none");
        }
        else
        {
            $(".checkloanclass").prop("checked", false).removeClass('checkclass');
             $("#addtaxautomate").addClass("d-none");

        }

    });
    function updatecheckclass(id,tabid)
    {
        if($("#"+id).is(':checked'))
        {
            $("#"+id).prop("checked", true).addClass('checkclass');

                $("#addtaxautomate").removeClass("d-none");
                

        }
        else
        {
            $("#"+id).prop("checked", false).removeClass('checkclass');
            var totallength = $('.checkloanclass').length;
            var numberOfChecked = $('.checkloanclass:checked').length;
            if(totallength > numberOfChecked)
            {
                $("#selectall").prop("checked", false);

                 $("#addtaxautomate").removeClass("d-none");

            }
            if(numberOfChecked == 0)
            {
                $("#selectall").prop("checked", false);

                $("#addtaxautomate").addClass("d-none");

            }
        }
    }
    function updatepolishpaid()
    {
        
        checked = []; 
        $("#loaderclass").removeClass('d-none');
        let taxids = $(".checkloanclass:checked")
                .map(function (){
                return $(this).val();
            }).toArray();
        $.ajax({
                type: "POST",
                url: "{{route('updatetaxstatuspolish')}}",
                data: { "_token": "{{ csrf_token() }}",
                        "taxids":taxids
                    },
                success: function(response)
                {
                    if(response)
                    {
                         $("#loaderclass").addClass('d-none');
                         location.href = location.href;
                    }
                }
            });
    }
</script>
@endsection