@{
    ViewBag.Title = "OutstandingStatement";
}

<script type="text/javascript" src="~/ProjectScript/ReportPrint.js"></script>
<script type="text/javascript" src="../Projectscript/Common.js"></script>
<script src="~/Scripts/Autocomplete/jquery-ui.js"></script>


<script>
 //   var start = new Date("01/01/" + (new Date()).getFullYear());
    var decimal = Decimal;
    function popuprefresh() {
        $('#popupdiv').hide();
    }
    var sum = 0;
    var days = 0;
    function ShowList(result) {        
        disable_datatable('Tblreport', 'buttonPlace');
        var responseText = "<thead><tr><th style='width:10px'>Slno</th><th style='width:50px'>Invoice Number</th><th>Account Code</th><th>Account Name</th><th style=text-align:right>Amount</th><th style='width:50px'>Due Days</th></tr></thead><tbody>";
        var responseText1="";
        for (var i = 0; i < result.length; i++) {
            var slno = parseInt(i + 1);
            var dt = result[i].VDate;
            var dt1 = getdate(dt);

            if (result[i].InvoNo=='')
            {
                responseText += '<tr style=background-color:#cfd8dc><td style="width:10px">' + slno + '</td><td style="width:50px">' + result[i].InvoNo + '</td><td>' + result[i].AccCode + '</td><td>' + result[i].AccName + '</td><td style=text-align:right>' + (result[i].BaseAmount).toFixed(decimal) + '</td><td style="width:50px"></td></tr>';
            }
             else
            {
            responseText += '<tr><td style="width:10px">' + slno + '</td><td style="width:50px">' + result[i].InvoNo + '</td><td>' + result[i].AccCode + '</td><td>' + result[i].AccName + '</td><td style=text-align:right>' + (result[i].BaseAmount).toFixed(decimal) + '</td><td style="width:50px">' + dt1 + '</td></tr>';
            }
        }        
        $('#Tblreport').html(responseText + '</tbody><tfoot><tr><th style="width:10px">Slno</th><th style="width:50px">InvoNo</th><th>Account Code</th><th>Account Name</th><th> </th><th style="width:50px">DueDays</th></tr></tfoot>' + responseText1);
        $('#Tblreportprint').html(responseText)
        var title = "Outstanding Statement- from " + $("#DateFrom").val() + " to " + $("#DateTo").val() + "";
        datatableWithsearch('Tblreport', true, title, 'buttonPlace');
        $('#header').text(title);
        $('#ResultLength').val(result.length);
    }

    function getdate(dtt) {
        var Dt = CurDate;
        var someDate = new Date(Dt.slice(6, 10) + '-' + Dt.slice(3, 5) + '-' + Dt.slice(0, 2));     
        var month = +someDate.getMonth() + 1;
        var day = someDate.getDate();
        if (day < 10) {
            day = '0' + day;
        }
        if (month < 10) {
            month = '0' + month;
        }
        newdate = someDate.getFullYear() + "-" + month + "-" + day;
        var Dt1 = dtt;
        var someDate1 = new Date(Dt1.slice(6, 10) + '-' + Dt1.slice(3, 5) + '-' + Dt1.slice(0, 2));
        var month1 = +someDate1.getMonth() + 1;
        var day1 = someDate1.getDate();
        if (day1 < 10) {
            day1 = '0' + day1;
        }
        if (month1 < 10) {
            month1 = '0' + month1;
        }
        newdate1 = someDate1.getFullYear() + "-" + month1 + "-" + day1;        
        var start = new Date(newdate)
        var end = new Date(newdate1)
        var days = (start - end) / (1000 * 60 * 60 * 24);        
        return Math.round(days);     
    }

    $(function () {
        GetCostCode(0);
        GetDept(0);
        $('#AccountGroup').focus();


        $('#AccountGroup').keydown(function (e) {
            var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
            $('#AccountGroupid').val(0);
            if (key == 13) {
                $('#accountCode').focus();
                e.preventDefault();
            }
        });
        $("#accountCode").keydown(function (e) {
            var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
            $('#AccId').val(0);
            if (key == 13) {
                e.preventDefault();
                $('#CostCode').focus();
            }

        });
        $('#CostCode').keydown(function (e) {
            var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
            if (key == 13) {
                $('#vDept').focus();
                e.preventDefault();
            }
        });
        $('#vDept').keydown(function (e) {
            var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
            if (key == 13) {
                $('#btnsubmit').focus();
                e.preventDefault();
            }
        });

        $("#AccountGroup").autocomplete({
            source: function (request, response) {

                var data = {};
                data.AccountCode = $("#AccountGroup").val();
                $.ajax({
                    url: '../Master/AccountScheduleSearch',
                    type: "POST",
                    data: data,
                    dataType: "json",
                    success: function (data) {
                        console.log(data);
                        response($.map(data, function (item) {
                            return ({
                                ColCount: 'TWOEnq',
                                label: item.AccountCode,
                                label1: item.AcntDescription,
                                AcntId: item.AcntId,
                                headers: ["Code", "Decription"]
                            })
                        }));
                    }

                })

            },
            autoFocus: true,
            select: function (event, ui) {
                $('#AccountGroupid').val(ui.item.AcntId)
            },

        });
        $("#accountCode").autocomplete({            
            source: function (request, response) {
                var data = {};
                data.AccCode = $("#accountCode").val();
                $.ajax({
                    url: '../AccountsErp/AccSearch',
                    type: "POST",
                    data: data,
                    dataType: "json",
                    success: function (data) {
                        response($.map(data, function (item) {
                            return ({
                                ColCount: '-2',
                                label: item.AccDescription,
                                label1: item.AccCode,
                                AccountName: item.AccDescription,
                                AccCode: item.AccCode,
                                AccountId: item.AccId,
                            })
                        }));
                    }
                })
            },
            autoFocus: true,
            select: function (event, ui) {
                $('#accountCode').val(ui.item.AccId);
                $('#AccId').val(ui.item.AccountId);
            },
        });


        $('#DateFrom').val(FinanceStartDate)

        $('#DateFrom').daterangepicker({
            minDate: minDate,
            maxDate: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()),
            singleDatePicker: true,
            showDropdowns: true,
            locale: {
                format: 'DD/MM/YYYY'
            }
        });

        $('#DateTo').daterangepicker({
            minDate: minDate,
            maxDate: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()),
            singleDatePicker: true,
            showDropdowns: true,
            locale: {
                format: 'DD/MM/YYYY'
            }
        });

       

        $("#btnsubmit").click(function (e) {
            if ($('#AccountGroup').val()=='') {
                var AccountGrp=0;
            }
            else {
                var AccountGrp=$('#AccountGroup').val();
            }
            //$('#Loading').show();
            if ($('#accountCode').val() == '') {
                $('#AccId').val(0);
            }

            var data = {};
            data.DateFrom = $('#DateFrom').val();
            data.DateTo = $('#DateTo').val();
            data.AccountId = $('#AccId').val();
            data.DepartmentId = parseInt($('#vDept').val() || 0);
            data.CostCode = parseInt($('#CostCode').val() || 0);
            data.AccountGroup = AccountGrp;
            data.title = "Parameters - " + "From: " + $('#DateFrom').val()
                + " To: " + $('#DateTo').val() + " Account: " + ($('#accountCode').val() || "(All)")
                + " Dept: " + $("#vDept").find("option:selected").text();
            $.ajax({
                type: "POST",
                url: "../AccountsErp/OustandingReportGetandGets",
                data: data,
                success: function (result) {
                    ShowList(result.oList);
                    $('#divreport').show();
                    $('#popupdiv').hide();
                }
            });    
        });
    });

    function GetDept(id) {
        var data = {};
        data.DeptId = 0;
        $.ajax({
            type: "POST",
            url: "../Master/DepartmentGetandGets",
            data: data,
            success: function (result) {
                console.log(result)
                $.each(result.oList, function (index, ele) {
                    $("#vDept").append($("<option>").attr("value", ele.DepartmentId).text(ele.DepartmentName));
                });
            }
        });
    }
    function GetCostCode(id) {
        var data5 = {};
        data5.CostCenterId = 0;
        $.ajax({
            type: "POST",
            url: "../Master/CostCenterGetandGets",
            data: data5,
            success: function (result) {
                CostCenterLoad(result.oList);

            }
        });
    }
    function CostCenterLoad(result) {
        $("#CostCode").empty();
        $("#CostCode").append("<option value='0'>-All-</option>");
        for (var i = 0; i < result.length; i++) {
            $("#CostCode").append("<option value='" + result[i].CostCenterId + "'>" + result[i].CostCenterCode + "</option>");
        }
    }
    function GroupClear() {
        $("#AccountGroup").val('');
        $("#AccountGroupid").val('');
    }
    function CodeClear() {
        $("#accountCode").val('');
        $("#AccId").val('');
    }
</script>

<div class="myData" data-x="M83" />
<div id="Entry">
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header" style="border-bottom:1px solid #e6e6e6">
                    <div>
                        <table width="100%">
                            <tr>
                                <td><h4 id="header"></h4></td>
                                <td width="32%"></td>
                                <td align="right"><button type="button" style="width:100px" onclick="$('#popupdiv').show(), $('#AccountGroup').focus()" id="btnback" class="btn btn-outline-primary">Back</button></td>
                                <td><button type="button" style="width:100px;margin-left:20px" id="btnprint" onclick="PrintthisReportWindows('OUTSTANDINGREPORT', $('#ResultLength').val())" class="btn btn-primary">Print <i class="ft-printer"></i></button></td>

                                <td align="right">
                                    <div class="btn-group" id="buttonPlace">
                                        <div align="right">
                                            <div class="heading-elements">
                                                <div class="btn-group" id="buttonPlace">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </table>
                        <div align="right">
                            <div class="heading-elements">
                                <br /><hr />
                                <div id="divreport" style="overflow:auto;display:none">
                                    <table id="Tblreport" class="table table-striped table-bordered base-style dataTable"></table><br />
                                </div>
                                <div style="display:none">
                                    <table id="Tblreportprint"></table>
                                </div>

                                <br /><br />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="popupdiv" class="modal fade text-left show" tabindex="-1" role="dialog" aria-labelledby="myheader" style="padding-right: 17px; background:rgba(0,0,0,0.5); display: block;height:200%">
    <div class="modal-dialog" role="document" style="top:5%">
        <div class="modal-content">

            <!-- Modal Header -->
            <div class="modal-header bg-primary white">
                <h4 class="modal-title">Report Parameters</h4>
                <button type="button" class="close" onclick="popuprefresh()">&times;</button>
            </div>

            <!-- Modal body -->
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="DateFrom">From Date:</label>
                            <input type="text" class="form-control" id="DateFrom">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="dateTo">
                            <label for="DateTo">To Date:</label>
                            <input type="text" class="form-control" id="DateTo">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="AccountGroup">Account Group:</label>
                            <input type="text" class="form-control" id="AccountGroup" onkeyup="CodeClear()">
                            <input type="hidden" class="form-control" id="AccountGroupid">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="accountCode">Account Code:</label>
                            <input type="text" class="form-control" id="accountCode" onkeyup="GroupClear()">
                            <input type="hidden" class="form-control" id="AccId">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="CostCode">Cost Code:</label>
                            <select id="CostCode" name="priority" class="form-control"></select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="vDept">Department:</label>
                            <select id="vDept" class="form-control">
                                <option value="0">- All -</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Modal footer -->
            <div class="modal-footer">
                <button type="button" id="btnsubmit" class="btn btn-primary" data-dismiss="modal">Apply</button>
            </div>

        </div>
    </div>
</div>