@{
    ViewBag.Title = "UsedCarsItemwise";
}

<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="M243" />

<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(), $('#customer').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">
                                    <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:7.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>
                        <label class="col-md-2 text-right" style="font-weight:bold;">Customer</label>
                        <div class="col-md-8">
                            <table width="100%">
                                <tr>
                                    <td width="30%">
                                        <input type="text" id="customer" class="form-control" onkeyup="$('#custnames').val('')" style="border-right:none;border-top-right-radius:0px;border-bottom-right-radius:0px;text-align:left">
                                        <input type="hidden" id="customerId" class="form-control" />
                                    </td>
                                    <td>
                                        <input type="text" id="custnames" class="form-control" onchange="" autocomplete="off" style="border-top-left-radius:0px;border-bottom-left-radius:0px;border-left:none;background-color:white" disabled>
                                    </td>
                                </tr>
                            </table>
                        </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="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;">Pay Type</label>
                        </div>
                        <div class="col-md-3">
                            <select id="Paytype" class="form-control" name="priority">
                                <option value="0">-All-</option>
                                <option value="1">Cash</option>
                                <option value="2">Credit</option>
                                <option value="3">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="font-weight:bold;">Salesman</label>
                        </div>
                        <div class="col-md-3">
                            <select id="Salesman" name="priority" class="form-control"></select>
                        </div>
                        <div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;">Dept.</label>
                        </div>
                        <div class="col-md-3">
                            <select id="Dept" name="priority" class="form-control"></select>
                        </div>
                        <input type="text" class="form-control" id="UserId" style="display:none">
                        @*<div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;">Customer </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-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="font-weight:bold;">Group</label>
                        </div>
                        <div class="col-md-3">
                            <select id="Group" name="priority" class="form-control"></select>
                        </div>
                        <div class="col-md-2 text-right">
                            <label style="font-weight:bold;">Sub Grp.</label>
                        </div>
                        <div class="col-md-3">
                            <select id="SubGroup" name="priority" class="form-control"></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="font-weight:bold;">Category</label>
                        </div>
                        <div class="col-md-3">
                            <select id="Category" name="priority" class="form-control"></select>
                        </div>
                        <div class="col-md-2 text-right">
                            <label style="margin-top:2%;font-weight:bold;">Sub Cat.</label>
                        </div>
                        <div class="col-md-3">
                            <select id="SubCategory" name="priority" class="form-control"></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"></div>
                        <div class="col-md-1"></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 class="custom-control custom-checkbox">
                                    <input type="checkbox" class="custom-control-input" name="customCheck" id="grpbySR">
                                    <label class="custom-control-label" for="grpbySR" style="font-weight:bold">Sales Return</label>
                                </div>
                            </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 = 'C';

                $.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,
                                CustName: item.CustName,
                                headers: ["Customer Code", "Customer Name"]
                            })
                        }));
                    }

                })

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

        });

        $(function () {

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

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


            $('#Area').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) {
                    $('#Salesman').focus();
                    e.preventDefault();
                }
            });

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

            $('#Dept').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#Group').focus();
                    e.preventDefault();
                }
            });
            $('#Group').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#SubGroup').focus();
                    e.preventDefault();
                }
            });
            $('#SubGroup').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#Category').focus();
                    e.preventDefault();
                }
            });
            $('#Category').keypress(function (e) {
                var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
                if (key == 13) {
                    $('#SubCategory').focus();
                    e.preventDefault();
                }
            });
            $('#SubCategory').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) {
            $("#Dept").empty();
            $("#Dept").append("<option value='0'>-All-</option>");
            for (var i = 0; i < result.length; i++) {
                $("#Dept").append("<option value='" + result[i].DepartmentId + "'>" + result[i].DepartmentName + "</option>");
            }
        }

        //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) {

            disable_datatable('Tblreport', 'buttonPlace');
            var responseText = "<thead><tr><th style='text-align:center'>Sl#</th><th style='text-align:center'>Image</th><th width=10px>Type</th><th width=100px>Bill#</th><th style='text-align:center' width=10px>Date</th><th style='text-align:center' width=100px>Account#</th><th width=100px>Customer</th><th width=100px>Salesman</th><th width=400px>Item Code</th><th width=500px>Item Name</th><th width=10px>Unit</th><th style='text-align:center' width=10px>Qty.</th><th style='text-align:right' width=10px>Rate</th><th width=10px>Area</th><th width=10px>Terms</th><th width=10px>Pay Type</th><th width=10px>JobCode</th><th width=10px>LPO#</th><th style='text-align:right' width=10px>Taxable Amount</th><th style='text-align:right' width=10px>Tax Amount</th><th width=10px>Disc.</th><th style='text-align:right' width=10px>Amount</th><th style='text-align:center' width=10px>Fx.</th><th>FC Rate</th><th style='text-align:right' width=10px>FC Amount</th><th>Group</th><th width=10px>SubGroup</th><th width=10px>Category</th><th width=10px>SubCategory</th><th width=10px>Dept.Code</th><th width=10px>Exit Paper Date</th></tr></thead><tbody>";


            for (var i = 0; i < result.length; i++) {
                var slno = parseInt(i + 1);
                if (result[i].InvDate == 'Grand Total') {

                    var salesman = (result[i].FirstName);
                    salesman = salesman.substring(0, 10);

                    responseText += '<tr  style=background-color:#cfd8dc><td style=text-align:center>' + slno + '</td><td></td><td id="Col1_' + slno + '">' + result[i].SType + '</td><td></td><td id="Col3_' + slno + '" style=text-align:center><b>' + result[i].InvDate + '</b></td><td id="Col4_' + slno + '" style=text-align:center>' + result[i].AccCode + '</td><td id="Col5_' + slno + '">' + result[i].CustoName + '</td><td>' + salesman + '</td><td id="Col6_' + slno + '">' + result[i].ProductCode + '</td><td id="Col7_' + slno + '">' + result[i].ProductDescr + '</td><td>' + result[i].UnitName + '</td><td id="Col8_' + slno + '" style=text-align:center><b>' + result[i].ProdQty + '</b></td><td id="Col10_' + slno + '" style=text-align:right>' + result[i].ProdRate + '</td><td>' + result[i].Name + '</td><td>' + result[i].TermDescription + '</td><td>' + result[i].Payterms + '</td><td>' + result[i].JobCode + '</td><td>' + result[i].LPO + '</td><td style=text-align:right><b>' + parseFloat(result[i].TaxableAmount || 0).toFixed(Decimal) + '</b></td><td  style=text-align:right><b>' + parseFloat(result[i].TaxAmount || 0).toFixed(Decimal) + '</b></td><td style=text-align:right><b>' + parseFloat(result[i].ProdDisc || 0).toFixed(Decimal) + '</b></td><td id="Col9_' + slno + '" style=text-align:right><b>' + parseFloat(result[i].Amount || 0).toFixed(Decimal) + '</b></td><td style=text-align:center>' + result[i].CurrencyName + '</td><td></td><td style=text-align:right><b>' + parseFloat(result[i].FCAmount || 0).toFixed(Decimal) + '</b></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><td>' + result[i].ExitPaperDate + ' </td></tr>';
                }

                else {
                    var salesman = (result[i].FirstName);
                    salesman = salesman.substring(0, 10);

                    responseText += '<tr ondblclick=gotoInvoNo(' + result[i].BillSlNo + "," + result[i].BillSeriesId + ",'" + result[i].SType + "'," + result[i].DeptId + ')><td style=text-align:center>' + slno + '</td><td style=text-align:center><a onclick="imageslider(' + result[i].ItemId + ')"><img src="../ProjectImages/Products/' + result[i].ItemId + '/' + result[i].ItemId + '-0.png" alt="" style="height:30px;width:30px; align:center" id="im0"></a></td><td id="Col1_' + slno + '" style="text-align:center">' + result[i].SType + '</td><td id="Col2x_' + slno + '">' + result[i].BillDescription + '-' + result[i].BillSlNo + '</td><td id="Col3_' + slno + '" style=text-align:center>' + result[i].InvDate + '</td><td id="Col4_' + slno + '" style=text-align:center>' + result[i].AccCode + '</td><td id="Col5_' + slno + '">' + result[i].CustoName + '</td><td>' + salesman + '</td><td id="Col6_' + slno + '">' + result[i].ProductCode + '</td><td id="Col7_' + slno + '">' + result[i].ProductDescr + '</td><td>' + result[i].UnitName + '</td><td id="Col8_' + slno + '" style=text-align:center>' + result[i].ProdQty + '</td><td id="Col10_' + slno + '" style=text-align:right>' + result[i].ProdRate + '</td><td>' + result[i].Name + '</td><td>' + result[i].TermDescription + '</td><td>' + result[i].Payterms + '</td><td>' + result[i].JobCode + '</td><td>' + result[i].LPO + '</td><td style=text-align:right>' + parseFloat(result[i].TaxableAmount || 0).toFixed(Decimal) + '</td><td  style=text-align:right>' + parseFloat(result[i].TaxAmount || 0).toFixed(Decimal) + '</td><td style=text-align:right>' + parseFloat(result[i].ProdDisc || 0).toFixed(Decimal) + '</td><td id="Col9_' + slno + '" style=text-align:right>' + parseFloat(result[i].Amount || 0).toFixed(Decimal) + '</td><td style=text-align:center>' + result[i].CurrencyName + '</td><td style=text-align:right>' + parseFloat(result[i].CurncyRate || 0).toFixed(Decimal) + '</td><td style=text-align:right>' + parseFloat(result[i].FCAmount || 0).toFixed(Decimal) + '</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><td>' + result[i].ExitPaperDate + ' </td></tr>';
                }

            }
            $('#Tblreport').html(responseText + '</tbody><tfoot><tr><th>Sl#</th><th>Image</th><th>Type</th><th>Bill#</th><th>Date</th><th>Account#</th><th>Customer</th><th>Salesman</th><th>Item Code</th><th>Item Name</th><th>Unit</th><th> </th><th> </th><th>Area</th><th>Terms</th><th>Pay Type</th><th>JobCode</th><th>LPO#</th><th> </th><th> </th><th> </th><th> </th><th>Fx.</th><th>FC Rate</th><th> </th><th>Group</th><th>SubGroup</th><th>Category</th><th>SubCategory</th><th>Dept.Code</th><th>Exit Paper Date</th></tr></tfoot>');
            $('#Tblreportprint').html(responseText)
            var title = "Itemwise SalesReport - from " + $("#dateFrom").val() + " to " + $("#dateTo").val() + "";
            datatableWithsearch('Tblreport', true, title, 'buttonPlace');
            $('#header').text(title);
            $('#ResultLength').val(result.length);

        }

        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 gotoInvoNo(BillSlNo, BillSeriesId, SType, DeptId) {
            if (SType == 'SI')
            {
                window.open('../SalesInvoice/SalesInvoiceUsedCar?slno=' + BillSlNo + '&billseries=' + BillSeriesId + '&dept=' + DeptId);

            }
            else {
                if ((usermenu1.indexOf("M56") != -1)) {
                    window.open('../SalesInvoice/SalesReturn?slno=' + BillSlNo + '&billseries=' + BillSeriesId + '&dept=' + DeptId);

                }
                else if ((usermenu1.indexOf("M241") != -1)) {
                    window.open('../SalesInvoice/SalesReturnNew?slno=' + BillSlNo + '&billseries=' + BillSeriesId + '&dept=' + DeptId);

                }
                else {
                    warningshow('Invalid User Rights');
                    return false;
                }

            }
        }

        function warningshow(message, Id) {
            $('#popupmessage').text(message);
            $('#Warningpopup').show();
            $('#' + Id).focus();
            window.setTimeout(function () {
                $('#Warningpopup').hide();
            }, 3000);
        }

        $("#btnsubmit").click(function (e) {
            $('#Loading').show();


            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 PayType = $('#Paytype').val();

            var Salesman = parseInt($('#Salesman').val() || 0);
            var Customer = parseInt($('#customer').val() || 0);
            var Group = parseInt($('#Group').val() || 0);
            var SubGroup = parseInt($('#SubGroup').val() || 0);
            var Category = parseInt($('#Category').val() || 0);
            var SubCategory = parseInt($('#SubCategory').val() || 0);

            var Department = parseInt($('#Dept').val() || 0);




            if ($('#customer').val() == '') {
                $('#customerId').val(0);
            }



            var Customer = $('#customerId').val();


            var Supplier = parseInt($('#customerId').val() || 0);

            var status = 0;
            if ($('#grpbySR').prop("checked")) {

                status = 1;
                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 (Salesman != 0) { Condition1 += ' and R.SalesManId=' + Salesman; }

                if (Customer != 0) { Condition1 += ' and R.CustId=' + Customer; }

                if (Group != 0) { Condition1 += ' and I.GroupId=' + Group; }

                if (SubGroup != 0) { Condition1 += ' and I.SubGroupId  =' + SubGroup; }

                if (Category != 0) { Condition1 += ' and I.CategoryId =' + Category; }

                if (SubCategory != 0) { Condition1 += ' and I.SubCategoryId =' + SubCategory; }


                if (Department != 0) { Condition1 += ' and R.DeptId=' + Department; }





                Condition = 'CONVERT(datetime,InvDate,103) >= CONVERT(datetime,' + "'" + FromDate + "'" + ',103) and CONVERT(datetime,InvDate,103) <= CONVERT(datetime,' + "'" + ToDate + "'" + ',103)'


                if (Area != 0) { Condition += ' and S.AreaId = ' + Area; }

                if (PayType != 0) { Condition += ' and S.PayType=' + PayType; }

                if (Salesman != 0) { Condition += ' and S.SalesManId=' + Salesman; }

                if (Customer != 0) { Condition += ' and S.CustId=' + Customer; }


                if (Group != 0) { Condition += ' and I.GroupId=' + Group; }

                if (SubGroup != 0) { Condition += ' and I.SubGroupId  =' + SubGroup; }

                if (Category != 0) { Condition += ' and I.CategoryId =' + Category; }

                if (SubCategory != 0) { Condition += ' and I.SubCategoryId =' + SubCategory; }

                if (Department != 0) { Condition += ' and S.DeptId=' + Department; }



            }
            else {
                Condition = 'CONVERT(datetime,InvDate,103) >= CONVERT(datetime,' + "'" + FromDate + "'" + ',103) and CONVERT(datetime,InvDate,103) <= CONVERT(datetime,' + "'" + ToDate + "'" + ',103)'


                if (Area != 0) { Condition += ' and S.AreaId = ' + Area; }

                if (PayType != 0) { Condition += ' and S.PayType=' + PayType; }

                if (Salesman != 0) { Condition += ' and S.SalesManId=' + Salesman; }

                if (Customer != 0) { Condition += ' and S.CustId=' + Customer; }


                if (Group != 0) { Condition += ' and I.GroupId=' + Group; }

                if (SubGroup != 0) { Condition += ' and I.SubGroupId  =' + SubGroup; }

                if (Category != 0) { Condition += ' and I.CategoryId =' + Category; }

                if (SubCategory != 0) { Condition += ' and I.SubCategoryId =' + SubCategory; }


                if (Department != 0) { Condition += ' and S.DeptId=' + Department; }



            }

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

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


        });

        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 != 'Image' && title != 'Credit Limit' && title != 'Due Days' && title != 'O Balance' && title != ' ') {
                    $(this).html('<input type="text" placeholder="Search ' + title + '" style="width=100%" />');
                }
                if (title == 'Type' || title == 'FC Rate') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:60px" />');
                }
                if (title == 'Unit' || title == 'Account#') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:50px" />');
                }
                if (title == 'Salesman'||title == 'Location') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100px" />');
                }
                if (title == 'Item Name') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:250px" />');
                }
                if (title == 'Terms') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'Date') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100px" />');
                }
                if (title == 'Category' || title == 'SubCategory' || title == 'Group' || title == 'SubGroup') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:150px" />');
                }
                if (title == 'Customer') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:120px" />');
                }
                if (title == 'Bill#') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:60px" />');
                }
                if (title == 'Qty.') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'Item Code') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:150px" />');
                }
                if (title == 'Dept.Code') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'Fx.') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'Pay Type') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'LPO#') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'JobCode') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'Area') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'Group') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'SubGroup') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'Category') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
                if (title == 'SubCategory') {
                    $(this).html('<input type="text" placeholder="' + title + '" style="width:100%" />');
                }
            });
            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();
        });
</script>