@{
    ViewBag.Title = "UsedCarsItemwisePurchaseReport";
}

<script type="text/javascript" src="~/ProjectScript/ReportPrint.js"></script>

<script src="~/Scripts/Autocomplete/jquery-ui.js"></script>

<style>
    .form-control {
        font-weight: bold;
    }

    .pip {
        display: inline-block;
        margin: 10px 10px 0 0;
    }

    .slides:not(:first-child) {
        /* Hide all images except the first */
        display: none;
    }

    .prev1, .next1 {
        cursor: pointer;
        position: absolute;
        top: 50%;
        width: auto;
        padding: 16px;
        margin-top: -32px;
        color: white;
        font-weight: bold;
        font-size: 18px;
        transition: 0.6s ease;
        border-radius: 0 3px 3px 0;
        user-select: none;
    }

    .navButton:hover {
        opacity: 1;
    }

    .next1 {
        right: 0;
        border-radius: 3px 0 0 3px;
    }

        /* On hover, add a black background color with a little bit see-through */
        .prev1:hover, .next1:hover {
            background-color: rgba(0,0,0,0.8);
        }

    input[type="file"] {
        display: block;
    }

    .imageThumb {
        max-height: 75px;
        width: 137px;
        max-height: 100px;
        border: 2px solid;
        padding: 1px;
        cursor: pointer;
    }



    .remove {
        display: block;
        background: #444;
        border: 1px solid black;
        color: white;
        text-align: center;
        cursor: pointer;
    }

        .remove:hover {
            background: white;
            color: black;
        }

    .slides {
        position: relative;
        height: 300px;
        width: 500px;
    }

        .slides img {
            position: absolute;
            top: 0px;
            left: 0px;
            z-index: -2;
        }

            .slides img.top {
                z-index: -1;
            }

        .slides .front {
            position: absolute;
            right: 10px;
            top: 120px;
            padding: 5px;
            border-radius: 60px;
            width: 38px;
            height: 38px;
            text-align: center;
            color: silver;
            background: white;
            opacity: 0.4;
            cursor: pointer;
            font-size: 30px;
            font-weight: bold;
        }

        .slides .back {
            position: absolute;
            left: 10px;
            top: 120px;
            padding: 5px;
            border-radius: 60px;
            width: 38px;
            height: 38px;
            text-align: center;
            color: silver;
            background: white;
            opacity: 0.4;
            cursor: pointer;
            font-size: 30px;
            font-weight: bold;
        }

    body {
        /*overflow-y:auto;*/
        overflow-x: hidden;
    }
</style>




<div class="myData" data-x="M245" />

<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="30%"></td>
                                <td align="right"><button type="button" style="width:100px" onclick="$('#popupdiv').show(), $('#placeofsupply').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('ITEMWISEREPORT', $('#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 style="margin-top:-1%" />
                                <div id="divreport" style="overflow:auto;display:none;width:100%;">
                                    <table id="Tblreport" class="table table-striped table-bordered base-style dataTable"></table><br />
                                </div>
                                @*<div style="display:none">
                                    <table id="Tblreportprint"></table>
                                </div>*@
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>




<div id="popupdiv" class="modal fade text-left show" tabindex="-1" role="dialog" style="padding-right: 17px;margin-top:-50px; background:rgba(0,0,0,0.5); display: block; display:none1;height:200%">
    <div class="modal-dialog" role="document" style="top:5%;max-width:35%">
        <div class="modal-content">
            <div class="modal-header bg-primary white">
                <h3 class="modal-title" id="myheader">Itemwise Report</h3>
                <button type="button" class="close" onclick="popuprefresh()" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <form id="monthpopup" style="display:none1">

                <!-- Modal body -->
                <div class="modal-body">

                    <div class="row">
                        <div class="col-md-1"></div>
                        <div class="col-md-2 text-right">
                            <label style="font-weight:bold;">From</label>
                        </div>
                        <div class="col-md-3">
                            <input type="text" id="dateFrom" class="form-control" autocomplete="off">
                        </div>

                        <div class="col-md-2 text-right">
                            <label style="font-weight:bold;">To</label>
                        </div>
                        <div class="col-md-3">
                            <input type="text" id="dateTo" class="form-control" autocomplete="off">
                        </div>
                        <div class="col-md-1"></div>
                    </div>
                    <div class="row" style="border-bottom:1px solid #cfd8dc;margin-top:2.5%;"></div>
                    <div class="row" style="margin-top:2%;">
                        <div class="col-md-1"></div>
                        <div class="col-md-2 text-right">
                            <label style="font-weight:bold;">Area </label>
                        </div>
                        <div class="col-md-3">
                            <select id="Area" name="priority" class="form-control">
                                <option value="0">-All-</option>
                            </select>
                        </div>
                        <div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;margin-left:1%">Location </label>
                        </div>
                        <div class="col-md-3">
                            <select id="Location" name="priority" class="form-control">
                                <option value="0">- All -</option>
                            </select>
                        </div>
                        <div class="col-md-1"></div>
                    </div>
                    <div class="row" style="margin-top:2%;">
                        <div class="col-md-1"></div>
                        <div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;margin-left:6.5%">Supplier </label>
                        </div>
                        <div class="col-md-3">
                            <input type="text" id="customer" class="form-control">
                            <input type="hidden" id="customerId" class="form-control" />

                        </div>
                        <div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;margin-left:1%">Pay Type</label>
                        </div>
                        <div class="col-md-3">
                            <select id="PayType" class="form-control" name="priority">
                                <option value="0">-All-</option>
                                <option value="Cash">Cash</option>
                                <option value="Credit">Credit</option>
                                <option value="Card">Card</option>
                            </select>
                        </div>
                        <div class="col-md-1"></div>
                    </div>
                    <div class="row" style="margin-top:2%;">
                        <div class="col-md-1"></div>
                        <div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;margin-left:11%">Dept.</label>
                        </div>
                        <div class="col-md-3">
                            <select id="vDept" name="priority" class="form-control">
                                <option value="0">- All -</option>
                            </select>
                        </div>
                        <label style="font-weight:bold;margin-left:6%">Type</label>
                        <div class="col-md-3" style="">
                            <select id="PurType" class="form-control" name="priority" style="margin-left:23%">
                                <option value="0">-All-</option>
                                <option value="Local">Local</option>
                                <option value="Import">Import</option>
                            </select>
                        </div>
                        <div class="col-md-1"></div>
                    </div>
                    <div class="row"  style="margin-top:2%;">
                        <div class="col-md-1"></div>
                        <div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;margin-left:5%">Job Code</label>
                        </div>
                        <div class="col-md-8">
                            <input type="text" id="jobCode" class="form-control">
                        </div>
                        <div class="col-md-1">  <input type="text" id="jobCodeId" class="form-control d-none"></div>
                    </div>


                    
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <div class="col-md-3">
                        <fieldset class="form-group floating-label-form-group">
                            <div class="row">
                              
                            </div>

                        </fieldset>
                    </div>

                    <div class="col-md-5">

                        <div class="text-center">
                            <button type="button" id="btnsubmit" class="btn btn-primary" data-dismiss="modal">Apply</button>
                            <input type="hidden" id="Length" class="form-control" />
                            <input type="hidden" id="ResultLength" class="form-control" />
                            <button type="button" class="btn btn-primary" style="" data-dismiss="modal" onclick="popuprefresh()">Close</button>

                        </div>
                    </div>
                    <div class="col-md-3"></div>
                </div>
            </form>






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

<div id="popupdiv1" 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; display:none">
    <div class="modal-dialog" role="document" style="top:10%">
        <div class="modal-content" style="height: 50rem; width: 70rem;margin-top: -25%;margin-left: -15rem;">
            <div>
                <button type="button" class="close" onclick="formrefresh1()" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>

                @*<div id="divmultimage1" class="modal-body" style="height:400px;overflow:auto">*@
                <div id="DDh1">


                </div>
                @*</div>*@
            </div>
        </div>
    </div>
</div>

<div class="modal fade text-left show" id="imagepreview" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" style="display: block; display:none;">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <button type="button" class="close" onclick="($('#imagepreview').hide())" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">×</span>
            </button>

            <img id="myImg" src="~/app-assets/img/elements/04.png" alt="Gini" width="500" style="margin-top:-25px;border:3px solid black;" onerror="this.onerror = null; this.src = '../app-assets/img/elements/04.png';">

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

<div style="display:none">
    <input type="text" value="0" id="ItemId" />
</div>

<script>
        //Customername Autocomplete

    $("#customer").autocomplete({
            source: function (request, response) {
                var data = {};
                data.CustName = $("#customer").val();
                data.CustType = 'S';

                $.ajax({
                    url: '../Master/CustomerOrSupplierSearch',
                    type: "POST",
                    data: data,
                    dataType: "json",
                    success: function (data) {
                        response($.map(data, function (item) {
                            return ({
                                ColCount: 'TWOEnq',
                                label: item.CustAccount,
                                label1: item.CustName,
                                CustId: item.CustId,
                                headers: ["Customer Code", "Customer Name"]
                            })
                        }));
                    }

                })

            },
            autoFocus: true,
            select: function (event, ui) {
                $('#customerId').val(ui.item.CustId)
                $('#customer').val(ui.item.CustName)
            },

        });

        $(function () {

            $('#Area').focus();

           
            GetArea(0);
            GetSalesMan(0);
            GroupPageLoad(0);
            CategoryPageLoad(0);

         

            $("#jobCode").autocomplete({
                source: function (request, response) {
                    $('#jobCodeId').val('');
                    var data = {};
                    data.JobCode = $("#jobCode").val();
                    $.ajax({
                        url: '../Master/JobCodeSearch',
                        type: "POST",
                        data: data,
                        dataType: "json",
                        success: function (data) {
                            response($.map(data, function (item) {
                                return ({
                                    ColCount: '2',
                                    label: item.JobCode,
                                    label1: item.Description,
                                    Description: item.Description,
                                    JobcodeId: item.ProjectJobId,
                                    headers: ["Job Code", "Job Description"]
                                })
                            }));
                        }
                    })
                },
                autoFocus: true,
                select: function (event, ui) {
                    $('#jobCodeId').val(ui.item.JobcodeId);
                },
            });



            $('#Area').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#Location').focus();
                    e.preventDefault();
                }
            });

            $('#Location').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#customer').focus();
                    e.preventDefault();
                }
            });
            $("#customer").keydown(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if ($("#customer").val() == '')
                    $('#customerId').val(0);
                if (key == 13) {
                    $("#PayType").focus();
                    e.preventDefault();
                }
            });
            $("#customer").keyup(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if ($("#customer").val() == '')
                    $('#customerId').val(0);

            });
            //$('#Supplier').keypress(function (e) {
            //    var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
            //    if (key == 13) {
            //        $('#PayType').focus();
            //        e.preventDefault();
            //    }
            //});

            $('#PayType').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#vDept').focus();
                    e.preventDefault();
                }
            });
            $('#vDept').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#btnsubmit').focus();
                    e.preventDefault();
                }
            });
            $(document).keydown(function (e) {
                if (e.keyCode == 27) { //ESC       :   Popup Close
                    formrefresh1();
                }
            });
            $('#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'
                }
            });
        });
        //load Department

        function GetDepartment(id) {
            var data = {};
            data.UserId = ERPUserId;
            $.ajax({
                type: "POST",
                url: "../Master/UserDepartmentGetandGets",
                data: data,
                success: function (result) {
                    DepartmentLoad(result.oList, id);


                }
            });
        }

        function DepartmentLoad(result, a) {
            $("#vDept").empty();
            $("#vDept").append("<option value='0'>-All-</option>");
            for (var i = 0; i < result.length; i++) {
                $("#vDept").append("<option value='" + result[i].DepartmentId + "'>" + result[i].DepartmentName + "</option>");
            }
        }
        function GetLocation(id) {
            var data = {};
            data.LocationId = 0;
            $.ajax({
                type: "POST",
                url: "../Master/LocationGetandGets",
                data: data,
                success: function (result) {
                    $.each(result.oList, function (index, ele) {
                        $("#Location").append($("<option>").attr("value", ele.LocationId).text(ele.LocationName));
                    });


                }
            });

        }
        //Load Area
        function GetArea(id) {
            var data = {};
            data.Id = 0;
            $.ajax({
                type: "POST",
                url: "../Master/AreaGetandGets",
                data: data,
                success: function (result) {
                    $.each(result.oList, function (index, ele) {
                        $("#Area").append($("<option>").attr("value", ele.AreaId).text(ele.AreaCode));
                    });
                }
            });
        }

        //Load Salesman

        function GetSalesMan(id) {
            var data = {};
            data.Id = 0;
            $.ajax({
                type: "POST",
                url: "../Master/SalesmanGetandGets",
                data: data,
                success: function (result) {
                    SalesManLoad(result.oList, id);
                }
            });
        }

        function SalesManLoad(result, a) {
            $("#Salesman").empty();
            $("#Salesman").append("<option value='0'>-All-</option>")
            for (var i = 0; i < result.length; i++) {
                $("#Salesman").append("<option value='" + result[i].Id + "'>" + result[i].FirstName + "</option>");
            }
        }

        //Load Group
        function GroupPageLoad(id) {
            var data1 = {};
            data1.GrpId = 0;
            $.ajax({
                type: "POST",
                url: "../Master/GroupGetandGets",
                data: data1,
                success: function (result) {
                    GroupLoad(result.oList, id);
                }
            });
        }

        function GroupLoad(result) {
            $("#Group").empty();
            $("#Group").append("<option value='0'>-All-</option>");
            for (var i = 0; i < result.length; i++) {

                $("#Group").append("<option value='" + result[i].GrpId + "'>" + result[i].GrpName + "</option>");
            }
            SubGroupGets();
        }

        //Load SubGroup

        function SubGroupGets() {
            var data = {};
            data.GroupId = $("#Group").val();


            if (data.GroupId == 0) {
                data.SbgrpId = 0;
                $.ajax({
                    type: "POST",
                    url: "../Master/SubGroupGetandGets",
                    data: data,
                    success: function (result) {
                        SubGroupLoad(result.oList);
                    }
                });
            }
            else {
                data.SbgrpId = 0;
                $.ajax({
                    type: "POST",
                    url: "../Master/SubGroupGetForGroup",
                    data: data,
                    success: function (result) {
                        SubGroupLoad(result.oList);
                    }
                });
            }
        }

        function SubGroupLoad(result) {
            $("#SubGroup").empty();
            $("#SubGroup").append("<option value='0'>-All-</option>");
            for (var i = 0; i < result.length; i++) {
                $("#SubGroup").append("<option value='" + result[i].SbgrpId + "'>" + result[i].SbgrpName + "</option>");
            }
        }

        //Load Category

        function CategoryPageLoad(id) {
            var data2 = {};
            data2.CategoryId = 0;
            $.ajax({
                type: "POST",
                url: "../Master/CategoryGetandGets",
                data: data2,
                success: function (result) {
                    CategoryLoad(result.oList, id);
                }
            });
        }


        function CategoryLoad(result) {
            $("#Category").empty();
            $("#Category").append("<option value='0'>-All-</option>");
            for (var i = 0; i < result.length; i++) {
                $("#Category").append("<option value='" + result[i].CategoryId + "'>" + result[i].CategoryName + "</option>");
            }
            SubCategoryGets();
        }
        //Load SubCategory

        function SubCategoryGets() {

            var data = {};
            data.CategoryId = $("#Category").val();

            if (data.CategoryId == 0) {
                data.SubCategoryId = 0;
                $.ajax({
                    type: "POST",
                    url: "../Master/SubCategoryGetandGets",
                    data: data,
                    success: function (result) {
                        SubCategoryLoad(result.oList);

                    }
                });
            }

            else {
                data.SubCategoryId = 0;
                $.ajax({
                    type: "POST",
                    url: "../Master/SubCategoryGetforCategory",
                    data: data,
                    success: function (result) {
                        SubCategoryLoad(result.oList);
                    }
                });
            }
        }



        function SubCategoryLoad(result) {
            $("#SubCategory").empty();
            $("#SubCategory").append("<option value='0'>-All-</option>");
            for (var i = 0; i < result.length; i++) {
                $("#SubCategory").append("<option value='" + result[i].SubCategoryId + "'>" + result[i].SubCategoryName + "</option>");
            }
        }

        function popuprefresh() {
            $('#popupdiv').hide();
        }

        function Showreport(result) {
            //alert('fgjhikjfg')
            disable_datatable('Tblreport', 'buttonPlace');
            var responseText = "<thead><tr><th style='text-align:center'>Sl#</th><th >Inv.#</th><th >Sup.Inv.#</th><th >Date</th><th style='text-align:center'>Account#</th><th style='text-align:center' >Supplier</th><th >Item Code</th><th width=100%>Item Name</th><th >Qty.</th><th >Unit Rate</th><th style='text-align:center'>MRP</th><th style='text-align:center'>Job Code</th><th style='text-align:center'>Terms</th><th style='text-align:right' >Area</th><th >Location</th><th>Pay Type</th><th>Purchase Type</th><th>Other Cost</th><th style='text-align:right'>Taxable Amount</th><th style='text-align:right'>Tax Amount</th><th>Amount</th><th>Fx.</th><th style='text-align:right'>Rate</th><th style='text-align:center'>FC Amount</th><th>Due Date</th><th style='text-align:right'>Ship Date</th><th>Group</th><th>SubGroup</th><th>Category</th><th>SubCategory</th><th >Dept.Code</th></tr></thead><tbody>";


            for (var i = 0; i < result.length; i++) {
                var MRP = ''; var JbCode = ''; var Strng=(result[i].BuyerNo).split('##%#%##');
                MRP = Strng[1]; JbCode = Strng[0];
                var slno = parseInt(i + 1);
                if (result[i].InvoDate == 'Grand Total') {

                    responseText += '<tr style=background-color:#cfd8dc;font-weight:bold;><td style=text-align:center>' + slno + '</td><td id="Col11_' + slno + '">' + result[i].SlNo + '</td><td id="Col1_' + slno + '">' + result[i].InvoNo + '</td><td id="Col3_' + slno + '" style=text-align:center>' + result[i].InvoDate + '</td><td id="Col4_' + slno + '" style=text-align:center>' + result[i].CustAccount + '</td><td id="Col5_' + slno + '">' + result[i].CustName + '</td><td>' + result[i].ItemCode + '</td><td id="Col6_' + slno + '">' + result[i].ItemDescription + '</td><td id="Col7_' + slno + '">' + result[i].Quantity + '</td><td align=right>' + parseFloat(result[i].Cost).toFixed(Decimal) + '</td><td style=text-align:right></td><td  style=text-align:left>' + JbCode + '</td><td id="Col8_' + slno + '" style=text-align:left>' + result[i].TermDescription + '</td><td id="Col10_' + slno + '" style=text-align:left>' + result[i].Name + '</td><td>' + result[i].LocationName + '</td><td>' + result[i].Payterms + '</td><td>' + result[i].PurchaseType + '</td><td align=right>' + parseFloat(result[i].OtherCost || 0).toFixed(Decimal) + '</td><td align=right>' + parseFloat(result[i].TaxableAmt || 0).toFixed(Decimal) + '</td><td align=right>' + parseFloat(result[i].TaxAmt || 0).toFixed(Decimal) + '</td><td style=text-align:right>' + parseFloat(result[i].LineTotal || 0).toFixed(Decimal) + '</td><td  style=text-align:left>' + result[i].CurrencyName + '</td><td style=text-align:right>' + result[i].CurrencyRate + '</td><td id="Col9_' + slno + '" style=text-align:right>' + parseFloat(result[i].FCLineTotal || 0).toFixed(Decimal) + '</td><td style=text-align:center>' + result[i].DueDate + '</td><td style=text-align:right>' + result[i].ShipDate + '</td><td>' + result[i].GrpName + ' </td><td>' + result[i].SbgrpName + ' </td><td>' + result[i].CategoryName + ' </td><td>' + result[i].SubCategoryName + ' </td><td>' + result[i].DepartmentName + ' </td></tr>';
                }

                else {
               
                    responseText += '<tr><td style=text-align:center>' + slno + '</td><td id="Col11_' + slno + '">' + result[i].SlNo + '</td><td id="Col1_' + slno + '">' + result[i].InvoNo + '</td><td id="Col3_' + slno + '" style=text-align:center>' + result[i].InvoDate + '</td><td id="Col4_' + slno + '" style=text-align:center>' + result[i].CustAccount + '</td><td id="Col5_' + slno + '">' + result[i].CustName + '</td><td>' + result[i].ItemCode + '</td><td id="Col6_' + slno + '">' + result[i].ItemDescription + '</td><td id="Col7_' + slno + '">' + result[i].Quantity + '</td><td align=right>' + parseFloat(result[i].Cost).toFixed(Decimal) + '</td><td style=text-align:right>' + parseFloat(MRP || 0).toFixed(Decimal) + '</td><td  style=text-align:left>' + JbCode + '</td><td id="Col8_' + slno + '" style=text-align:left>' + result[i].TermDescription + '</td><td id="Col10_' + slno + '" style=text-align:left>' + result[i].Name + '</td><td>' + result[i].LocationName + '</td><td>' + result[i].Payterms + '</td><td>' + result[i].PurchaseType + '</td><td align=right>' + parseFloat(result[i].OtherCost || 0).toFixed(Decimal) + '</td><td align=right>' + parseFloat(result[i].TaxableAmt || 0).toFixed(Decimal) + '</td><td align=right>' + parseFloat(result[i].TaxAmt || 0).toFixed(Decimal) + '</td><td style=text-align:right>' + parseFloat(result[i].LineTotal || 0).toFixed(Decimal) + '</td><td  style=text-align:left>' + result[i].CurrencyName + '</td><td style=text-align:right>' + parseFloat(result[i].CurrencyRate).toFixed(Decimal) + '</td><td id="Col9_' + slno + '" style=text-align:right>' + parseFloat(result[i].FCLineTotal || 0).toFixed(Decimal) + '</td><td style=text-align:center>' + result[i].DueDate + '</td><td style=text-align:right>' + result[i].ShipDate + '</td><td>' + result[i].GrpName + ' </td><td>' + result[i].SbgrpName + ' </td><td>' + result[i].CategoryName + ' </td><td>' + result[i].SubCategoryName + ' </td><td>' + result[i].DepartmentName + ' </td></tr>';
                }
               
            }
            $('#Tblreport').html(responseText + '</tbody><tfoot><tr><th>Sl#</th><th>Inv.#</th><th>Sup.Inv.#</th><th>Date</th><th>Account#</th><th>Supplier</th><th>Item Code</th><th>Item Name</th><th>Qty.</th><th> </th><th style="text-align:center">MRP</th><th style="text-align:center">Job Code</th><th>Terms</th><th>Area</th><th>Location</th><th>Pay Type</th><th>Purchase Type</th><th> </th><th> </th><th> </th><th> </th><th>Fx.</th><th> </th><th> </th><th>Due Date</th><th>Ship Date</th><th>Group</th><th>SubGroup</th><th>Category</th><th>SubCategory</th><th>Dept.Code</th></tr></tfoot>');
            var title = "Itemwise PurchaseReport - from " + $("#dateFrom").val() + " to " + $("#dateTo").val() + "";
            datatableWithsearch('Tblreport', true, title, 'buttonPlace');
            $('#header').text(title);
            $('#ResultLength').val(result.length);

        }
    
        $("#btnsubmit").click(function (e) {
            $('#Loading').show();
            if ($('#customer').val() == '') {
                $('#customerId').val(0);
            }


            var Condition = '', Area = '', PayType = '', Salesman = '', Customer = '', Group = '', SubGroup = '', Category = '', SubCategory = '', Department = '', Supplier = '', Condition1 = '';
            var data = {};
            var FromDate = $('#dateFrom').val();
            var ToDate = $('#dateTo').val();
            var Area = parseInt($('#Area').val() || 0);
            var Location = parseInt($('#Location').val() || 0);
            var Customer = parseInt($('#customerId').val() || 0);
            var PayType = $('#PayType').val();
            var Department = parseInt($('#vDept').val() || 0);
            var JobId = parseInt($('#jobCodeId').val() || 0);
            var PType = $('#PurType').val();
            //Condition1 = 'CONVERT(datetime,InvDate,103) >= CONVERT(datetime,' + "'" + FromDate + "'" + ',103) and CONVERT(datetime,InvDate,103) <= CONVERT(datetime,' + "'" + ToDate + "'" + ',103)'
            //if (Area != 0) { Condition1 += ' and R.AreaId = ' + Area; }
            //if (PayType != 0) { Condition1 += ' and R.PayType=' + PayType; }
            //if (Customer != 0) { Condition1 += ' and R.CustId=' + Customer; }           
            //if (Department != 0) { Condition1 += ' and R.DeptId=' + Department; }

            Condition = 'CONVERT(datetime,InvoDate,103) >= CONVERT(datetime,' + "'" + FromDate + "'" + ',103) and CONVERT(datetime,InvoDate,103) <= CONVERT(datetime,' + "'" + ToDate + "'" + ',103)'
            if (Area != 0) { Condition += ' and P.PlaceOfSupply = ' + Area; }
            if (Location != 0) { Condition += ' and L.LocationId = ' + Location; }
            if (PayType != 0) { Condition += ' and PT.Payterms=' + "'" + PayType + "'"; }
            if (Customer != 0) { Condition += ' and P.SupplierId=' + Customer; }
            if (Department != 0) { Condition += ' and P.DepartmentId=' + Department; }
            if (JobId != 0) { Condition += '  AND J.ProjectJobId=' + JobId; }
            if (PType != 0) { Condition += "  AND P.PurchaseType = '" + PType+"'"; }
           

          
            var data = {};
            data.Condition = Condition;
           // data.Condition1 = Condition1;
            //data.SType = status;
            data.UserId = ERPUserId;
            $.ajax({
                type: "POST",
                url: "../Purchaseandsalesreports/UsedcarsItemWiseReport",
                data: data,
                success: function (result) {

                    $('#Loading').hide();
                    $('#divreport').show();
                    $('#popupdiv').hide();
                    Showreport(result);
                }
            });


        });



        function formrefresh1() {
            $('#popupdiv1').hide();
            $('#DDh1').empty();
        }

        function imageslider(ItemId) {
            imagesliderload(ItemId);
            $('#popupdiv1').show();
            $('#DDh1').show()
        }

        var imgcnt = 0;


        function imagesliderload(ProdId) {


            $('.pip').remove();
            $.ajax({
                url: "../ProjectImages/Products/" + ProdId + ".png",
                type: 'HEAD',
                error: function () {
                    $('#myImg').attr('src', "../app-assets/img/elements/04.png");
                },
                success: function () {
                    $('#myImg').attr('src', "../ProjectImages/Products/" + ProdId + ".png");
                }
            });
            var formData = new FormData();
            var ImageId = ProdId;
            formData.append("UniqueId", ImageId);

            $.ajax({
                type: "POST",
                url: '/Master/CheckFolderLengthProduct',
                data: formData,
                dataType: "html",
                contentType: false,
                processData: false,
                success: function (result1) {


                    var ProdId = ImageId;
                    TotalImage = result1;

                    var SlideData = '';

                    for (i = 0; i < TotalImage; i++) {

                        var nextImage = 0; var prevImame = 0;
                        //if (i == 0) {
                        //    prevImame = TotalImage - 1;
                        //    nextImage = i + 1
                        //}
                        //else {
                        //    prevImame = i - 1; nextImage = i + 1
                        //}
                        //if (i == TotalImage - 1) {
                        //    nextImage = 0;
                        //}


                        if (i == (0)) {
                            SlideData += '<div class="mySlides" id=slimg-' + i + '><input type="radio"  visibility: hidden name="radio-btn" id=img-' + i + ' checked  /><li style="list-style:none;"><div  style="height: 50rem; width: 70rem;text-align: left" class=""> <img src="../ProjectImages/Products/' + ProdId + '/' + ProdId + '-' + i + '.png" style="height: 50rem; width: 70rem;align:center; margin-top:0;" id="im' + i + '"/><label for="img-' + prevImame + '" class="prev1"  id="previous' + i + '" onclick=plusDivs(\'-1\')>&#10094; </label>&nbsp&nbsp <label for="img-' + nextImage + '" class="next1" id="next"  onclick="plusDivs(\'1\')">&#10095;</label></div></li></div>';

                            imgcnt = i;
                        }
                        else
                            SlideData += '<div class="mySlides" style="display:none" id=slimg-' + i + '><input type="radio" visibility: hidden name="radio-btn" id=img-' + i + ' checked /><li style="list-style:none;"><div style="height: 50rem; width: 70rem;text-align: left" class=""> <img src="../ProjectImages/Products/' + ProdId + '/' + ProdId + '-' + i + '.png" style="height: 50rem; width: 70rem;align:center; margin-top:0;" id="im' + i + '"/><label for="img-' + prevImame + '" class="prev1" style="border-bottom:0" id="previous' + i + '" onclick=plusDivs(\'-1\')>&#10094;</label>&nbsp&nbsp <label for="img-' + nextImage + '" class="next1" style="border-bottom:0" id="next' + i + '" onclick="plusDivs(\'1\')">&#10095;</label></div></li></div>';


                    }

                    $('#DDh1').append(SlideData);
                    $(".remove").click(function () {
                        $(this).parent(".pip").remove();
                    });
                }
            });
        }



        function previmg(i) {
            var j = i - 1;
            if ($('#slimg-' + j).length) {
                $('#slimg-' + i).hide();
                $('#slimg-' + j).show();
            }
        }

        function nextimg(i) {
            var j = i + 1;
            if ($('#slimg-' + j).length) {
                $('#slimg-' + i).hide();
                $('#slimg-' + j).show();
            }
        }

        var slideIndex = 1;

        function plusDivs(n) {
            slideIndex = Number(slideIndex) + Number(n)
            showDivs(slideIndex);
        }

        function showDivs(n) {
            var i;
            var x = document.getElementsByClassName("mySlides");
            if (n > x.length) { slideIndex = 1 }
            if (n < 1) { slideIndex = x.length }
            for (i = 0; i < x.length; i++) {
                x[i].style.display = "none";
            }
            x[slideIndex - 1].style.display = "block";
        }


        function datatableWithsearch(tablename, download, title, tableButtonContainerId) {

            var a = '#' + tablename + ' tfoot th'
            $(a).each(function () {
                var title = $(this).text();
                if (title != 'Edit' && title != 'Select' && title != 'Sl#' && title != 'Credit Limit' && title != 'Due Days' && title != 'O Balance' && title != ' ') {
                    $(this).html('<input type="text" placeholder="Search ' + title + '" style="width=100%" />');
                }
                if (title == 'Sup.Inv.#' || title == 'Inv.#' || title == 'Date' || title == 'Qty.' || title == 'Unit Rate' || title == 'FC Amount' || title == 'SubCategory' || title == 'Dept.Code' || title == 'Taxable Amount' || title == 'Tax Amount' || title == 'Amount' || title == 'Other Cost' || title == 'Account#' || title == 'Supplier' || title == 'Terms' || title == 'Area' || title == 'Location' || title == 'Pay Type' || title == 'Purchase Type' || title == 'Fx.' || title == 'Rate' || title == 'Due Date' || title == 'Ship Date' || title == 'Group' || title == 'SubGroup' || title == 'Category' || title == 'SubCategory' || title == 'Dept.Code' || title == 'User') {
                    $(this).html('<input type="text" placeholder="' + title + '"  style="width:100%" />');
                }
                if(title=='Item Code')
                {
                    $(this).html('<input type="text" placeholder="' + title + '"  style="width:200px" />');
                }
                if (title == 'Item Name') {
                    $(this).html('<input type="text" placeholder="' + title + '"  style="width:300px" />');
                }
            });
            var table = null;
            if (download) {
                if (!title || !tableButtonContainerId) { console.log("download table need title and button container"); }


                table = $('#' + tablename).DataTable({
                    dom: "<'row'<'col-sm-1'l><'col-sm-11'f>>" +
            "<'row'<'col-sm-12'tr>>" +
            "<'row'<'col-sm-1'i><'col-sm-11'p>>",
                    buttons: [],


                });
                new $.fn.dataTable.Buttons(table, {
                    buttons: [
                    {
                        extend: 'collection',
                        text: 'Export',
                        className: 'excelexport',
                        buttons: [
                            {
                                extend: 'excelHtml5',
                                title: title,
                                messageTop: 'EUMI ERP',
                                exportOptions: { columns: ":visible" }
                            },
                            {
                                extend: 'pdfHtml5',
                                title: title,
                                messageTop: 'EUMI ERP',
                                exportOptions: { columns: ":visible" }
                            },
                            {
                                extend: 'print',
                                title: title,
                                messageTop: 'EUMI ERP',
                                exportOptions: { columns: ":visible" }
                            }
                        ]
                    },
                    'colvis'
                    ]
                });
                table.buttons(0, null).container().appendTo($("#" + tableButtonContainerId));
                $("#" + tableButtonContainerId).find(".buttons-collection").addClass("btn-outline-primary mx-1").css("border-radius", "4px");

            } else {
                table = $('#' + tablename).DataTable();
            }
            table.columns().every(function () {
                var that = this;
                $('input', this.footer()).on('keyup change', function () {
                    if (that.search() !== this.value) {
                        that
                            .search(this.value)
                            .draw();

                    }
                });
            });
            if (ExcelExport == 0) {
                $('.excelexport').hide();
            }
        }



        function disable_datatable(tablename, tableButtonContainerId) {
            $('#Warningpopup').fadeOut();
            if ($.fn.DataTable.isDataTable('#' + tablename)) {
                var table = $('#' + tablename).DataTable();
                table.destroy();
                if (tableButtonContainerId) { $("#" + tableButtonContainerId).empty(); }
                return;
            }
        }
        $(document).ready(function () {
            $('#popup').show();
            GetLocation(0);
            GetDepartment(0);
        });
</script>