@extends('layouts.app')
@section('title', 'Taxline Liens')
@section('content')
<style>
    thead
{
    background-color: #7680ff !important;
    color: #fff !important;
}
th{
    color:#fff !important;
}
 .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 Loans&#8230;</div>
    <div class="container-fluid">
        <x-reporttabs/>
        <div id="dashboarddiv" class="p-0 m-0">
            <div class="row pr-2 pl-2 pt-0 mt-1">
                <div class="col-lg-12 col-md-12 col-xl-12 col-sm-12">
                    <div class="text-center" id="insertyearbtn" style="display:none;">
                        <button style="background-color:#104661 !important;color:#fff !important;" class="btn btn-primary" onclick="inserttaxcycle()">Update Tax Cycle</button>
                        <button style="color:#fff !important;" class="btn btn-warning mr-2" id="annualid" onclick="updatetaxannual()">Update Annual</button>
                         <button style="color:#fff !important;" class="btn btn-danger mr-2" id="removeid" onclick="updatetaxannual()">Remove Liens</button>
                    </div>
                    <div class="card dashboardcard">
                        <div class="card-body pt-0">
                            <div class="row p-0 m-0">
                                <div class="col-lg-1 col-sm-12 col-xl-1 col-md-1">
                                    <select name="yeardrop" id="yeardrop" class="form-control float-right">
                                         <option value="All">Filter By Year</option>
                                                                            </select>
                                </div>
                                <div class="col-lg-1 col-sm-12 col-xl-1 col-md-1">
                                    <select name="instdrop" id="instdrop" class="form-control float-right">
                                         <option value="All">Filter By Inst</option>
                                                                            </select>
                                </div>
                                <div class="col-lg-2 col-sm-12 col-xl-2 col-md-2">
                                    <select name="taxcycledrop" id="taxcycledrop" class="form-control float-right">
                                        <option value="All">Filter By Taxcycle</option>
                                         <option value="1">With Tax Cycle</option>
                                         <option  value="2">Without Tax Cycle</option>
                                    </select>
                                </div>
                                <div class="col-lg-2 col-sm-12 col-xl-2 col-md-2">
                                    <select name="basetaxdrop" id="basetaxdrop" class="form-control float-right">
                                        <option value="All">Filter By Base Tax </option>
                                         <option value="1">With Base Tax</option>
                                         <option value="2">Without Base Tax</option>
                                    </select>
                                </div>
                                <div class="col-lg-2 col-sm-12 col-xl-2 col-md-2">
                                    <select name="balancedrop" id="balancedrop" class="form-control float-right">
                                        <option value="All">Filter By Balance Amount </option>
                                         <option value="1">With Balance Amount</option>
                                         <option value="2">Without Balance Amount</option>
                                    </select>
                                </div>
                                <div class="col-lg-2 col-sm-12 col-xl-2 col-md-2">
                                    <select name="taxstatusdrop" id="taxstatusdrop" class="form-control float-right">
                                        <option value="All">Filter By Tax Status </option>
                                         <option value="1">With Tax Status</option>
                                         <option value="2">Without Tax Status </option>
                                    </select>
                                </div>
                                <div class="col-lg-2 col-sm-12 col-xl-2 col-md-2">
                                   <button type="button" class="btn btn-primary" onclick="getlieninfofiltered();">Filter Entries</button>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-12 col-md-12 col-xl-12 col-sm-12" id="stateloandiv">
                                    <table class="table" id="setuptable1">
                                        <thead>
                                            <tr>
                                                <th>All <input type="checkbox" name="selectall" id="selectall"></th>
                                                <th>LoanPrimaryID</th>
                                                <th>TaxPrimaryID</th>
                                                <th>Loan No</th>
                                                <th>Parcel</th>
                                                <th>State</th>
                                                <th>Agency</th>
                                                <th>Year</th>
                                                <th>Installment</th>
                                                <th>Base Amount</th>
                                                <th>Balance Amount</th>
                                                <th>Tax Status</th>
                                                <th>Tax Cycle ID</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                                                                </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function() {  
     var loanDetailTb = $('#setuptable1').DataTable({
        dom: 'lBfrtip',
                buttons: [
                'excel'
                ],
                "columnDefs": [ {
                        "targets": 0,
                        "orderable": false
                        } ],
                "lengthMenu": [10,50,100,200,500,1000,2500,5000,10000],
                    "paging": true,
                    "info": true,
                    searching: true,
                });
    });
    function getlieninfofiltered()
    {
        var yeardrop = $("#yeardrop").val();
        var taxcycledrop = $("#taxcycledrop").val();
        var basetaxdrop = $("#basetaxdrop").val();
        var balancedrop = $("#balancedrop").val();
        var taxstatusdrop = $("#taxstatusdrop").val();
        var instdrop = $("#instdrop").val();
         $("#loaderclass").removeClass('d-none');
        $.ajax({
            type: "POST",
            url: "{{route('getlieninfofiltered')}}",
            data: { "_token": "{{ csrf_token() }}",
                    "yeardrop" : yeardrop,
                    "taxcycledrop" :taxcycledrop,
                     "basetaxdrop" :basetaxdrop,
                     "balancedrop" : balancedrop,
                     "taxstatusdrop":taxstatusdrop,
                     "instdrop":instdrop
                },
            success: function(html)
            {
                $("#stateloandiv").html("");
                $("#stateloandiv").html(html);
                $("#loaderclass").addClass('d-none');
            }
        });
    }
    function inserttaxcycle()
    {
        var agencyids=[];var installments = [];
        checked = []; 
        var years = []; var stateids = []
        let taxids = $(".checkloanclass:checked")
            .map(function (){
            return $(this).val();
            }).toArray();
            let taxdivids = $(".checkloanclass:checked")
                .map(function ()
            {
                checked.push(this.id);
            });
            var i;
           
            for (i = 0; i < checked.length; i++)
            {
                var stateid = $("#stateid"+checked[i]).val();
                stateids.push(stateid);
                var agencyid = $("#agencyid"+checked[i]).val();
                agencyids.push(agencyid);
                var year = $("#year"+checked[i]).val();
                years.push(year);
                var installment = $("#installment"+checked[i]).val();
                installments.push(installment);
            }
            $("#loaderclass").removeClass('d-none');
            $.ajax({
                    type: "POST",
                    url: "{{route('updatetaxcyclefornull')}}",
                    data: { "_token": "{{ csrf_token() }}",
                            "taxids":taxids,
                            "agencyids":agencyids,
                            "year":years
                        },
                    success: function(html)
                    {
                        $("#loaderclass").addClass('d-none');
                        location.href = location.href;
                    }
                });
    }
    function updatetaxannual()
    {
        var agencyids=[];var installments = [];
        checked = []; 
        var years = []; var stateids = []
        let taxids = $(".checkloanclass:checked")
            .map(function (){
            return $(this).val();
            }).toArray();
            let taxdivids = $(".checkloanclass:checked")
                .map(function ()
            {
                checked.push(this.id);
            });
            var i;
           
            for (i = 0; i < checked.length; i++)
            {
                var stateid = $("#stateid"+checked[i]).val();
                stateids.push(stateid);
                var agencyid = $("#agencyid"+checked[i]).val();
                agencyids.push(agencyid);
                var year = $("#year"+checked[i]).val();
                years.push(year);
                var installment = $("#installment"+checked[i]).val();
                installments.push(installment);
            }
            $("#loaderclass").removeClass('d-none');
            $.ajax({
                    type: "POST",
                    url: "{{route('updatetaxcycleannual')}}",
                    data: { "_token": "{{ csrf_token() }}",
                            "taxids":taxids,
                            "agencyids":agencyids,
                            "year":years
                        },
                    success: function(html)
                    {
                        $("#loaderclass").addClass('d-none');
                        location.href = location.href;
                    }
                });
    }
     $("#selectall").on('change', function()
    {
        if($("#selectall").is(':checked'))
        {
            $(".checkloanclass").prop("checked", true).addClass('checkclass');

            $("#insertyearbtn").show();
        }
        else
        {
            $(".checkloanclass").prop("checked", false).removeClass('checkclass');
            $("#insertyearbtn").hide();
            $(".agencyclass").removeClass("agencyselected");
        }
    });
     function updatecheckclass(id)
    {
        if($("#"+id).is(':checked'))
        {
            $("#"+id).prop("checked", true).addClass('checkclass');

            $("#insertyearbtn").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);
                
                $("#insertyearbtn").hide();
            }
        }
    }
   </script>
@endsection