@{
    ViewBag.Title = "ProjectJobDashboard";
    Layout = "~/Views/Shared/_Layout.cshtml";
}




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



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


<script src="~/Scripts/Chart/highcharts.js"></script>
<script src="~/Scripts/Chart/export-data.js"></script>
<script src="~/Scripts/Chart/exporting.js"></script>
<script src="~/Scripts/Chart/highcharts-regression.js"></script>
<script src="~/Scripts/Autocomplete/jquery-ui.js"></script>
<script type="text/javascript" src="../Projectscript/Common.js"></script>
<script type="text/javascript" src="../Projectscript/WorkItemNew.js"></script>




<style type="text/css">
    .modal-slg {
        max-width: 700px;
    }

    .main-panel {
        height: auto;
        width: auto;
        max-height: none;
        min-height: 100%;
        margin: 0;
        padding-top: 85px;
        float: none;
    }

    .eumi-search-box {
        box-sizing: border-box;
        width: 100%;
    }

    body.eumi-loader::before {
        content: '';
        display: block;
        position: fixed;
        z-index: 31000;
        height: 4px;
        background-color: rgba(0, 157, 160, 0.2);
        top: 0;
        left: 0;
        right: 0;
    }

    body.eumi-loader::after {
        content: '';
        display: block;
        position: fixed;
        z-index: 31001;
        height: 4px;
        background-color: rgba(0, 157, 160, 1);
        top: 0;
        width: 50px;
        animation: eumiloader 4s infinite linear;
    }

    .eumi-search-table, .eumi-shadow {
        border-spacing: 0 0px;
        box-shadow: 0px 0px 0px 2px #fff, 0 0 2px 2px #999;
    }

    @@keyframes eumiloader {
        from {
            right: 100%;
        }

        to {
            right: 0;
        }
    }

    #topnsales tr {
        border-bottom: 1px solid #e6e6e6;
    }

    #draggable {
        width: 150px;
        height: 150px;
        padding: 0.5em;
    }
    /*.card-block:hover {
        box-shadow: 20px 20px 10px rgba(0, 0, 0, 0.7);
        -webkit-transition: box-shadow 0.1s;
        transform: scale(1.0);
        transition: transform 0.1s;
        cursor: pointer;
    }*/
    .dihover :hover {
        background-color: transparent;
    }
</style>

@if (Model != null)
{
    <script>
        window.ListPageParams = @Html.Raw(EUMI_ERP.Common.ToJson(Model));
    </script>
}
else
{
    <script>

        window.ListPageParams = { };
    </script>
}

<div class="content-wrapper">
    <!--Statistics cards Starts-->

    <div class="row">

        <div class="col-xl-6 col-lg-6 col-md-6 col-12" style="cursor:pointer" onclick="GetCurrentJob('Created')">
            <div class="card gradient-green-tea" style="height:70px;">
                <div class="card-body">
                    <div class="card-block pt-2 pb-0">
                        <div class="media">
                            <div class="media-body white text-left">
                                <h3 id="CurrentJobs" class="font-large-1 mb-0">0</h3>
                                <span>Current  Jobs</span>
                            </div>
                            <div class="media-right white text-right">
                                <i class="icon-graph font-large-1"></i>
                            </div>
                        </div>
                    </div>
                    <div id="Widget-line-chart2" class="height-75 WidgetlineChart WidgetlineChartshadow mb-2">
                    </div>
                </div>
            </div>

        </div>




        <div class="col-xl-6 col-lg-6 col-md-6 col-12" style="cursor:pointer" onclick="GetCurrentJob('Pending')">
            <div class="card gradient-blackberry" style="height:70px">
                <div class="card-body">
                    <div class="card-block pt-2 pb-0">
                        <div class="media">
                            <div class="media-body white text-left">
                                <h3 id="PendingJobs" class="font-large-1 mb-0">0</h3>
                                <span>Pending Jobs</span>
                            </div>
                            <div class="media-right white text-right">
                                <i class="icon-pie-chart font-large-1"></i>
                            </div>
                        </div>
                    </div>
                    <div id="Widget-line-chart" class="height-75 WidgetlineChart WidgetlineChartshadow mb-2">
                    </div>
                </div>
            </div>
        </div>

    </div>

    <!--Statistics cards Ends-->
    <!--Line with Area Chart 1 Starts-->



    <div class="row">
        <div class="col-xl-9 col-lg-12 col-12">
            <div class="card">
                <div class="card-body">
                    <div class="card-block">
                        <div class="" style="float:left;margin-left:30px">
                            <select id="Datetype" class="" style="border:none" onchange="ChangeType()">
                                <option value="0">Period</option>
                                <option value="1">Daily</option>
                                <option value="2">Weekly</option>
                                <option value="3">Monthly</option>
                                <option value="4">Yearly</option>
                            </select>
                        </div>

                        <div class="" style="float:left;margin-left:30px">

                        </div>
                        <div class="" style="float:left;margin-left:30px">
                            <input type="text" class="" style="width:105px;border-radius:10px;text-align:center" id="fromdate" onchange="loadgraph()" />
                        </div>
                        <div class="" style="float:left;margin-left:30px">
                            -
                        </div>
                        <div class="" style="float:left;margin-left:30px">
                            <input type="text" class="" style="width:105px;border-radius:10px;text-align:center" id="todate" onchange="loadgraph()" />
                        </div>

                        <div class="" style="float:right;">
                            <select style="width:105px;border-radius:10px;text-align:center" id="refreshtime" onchange="refreshtimechange()">
                                @*<option value="5000">5 Sec</option>
                                    <option value="30000">30 Sec</option>*@
                                <option value="60000">1 min</option>
                                <option value="300000">5 min</option>
                                <option value="600000">10 min</option>
                            </select>

                        </div>

                        <div id="line-area" class="height-350 lineArea">
                            <div id="Sales" style="min-width: 310px; height: 350px; margin: 0 auto"></div>
                            <div id="pi" style="display:none;margin-left:300px;min-width: 310px; height: 350px; max-width: 600px;">
                                <div id="container" style="min-width: 310px; height: 350px; max-width: 600px; margin-left:200px;"></div>
                            </div>

                            <div id="halfpi" style="display:none;margin-left:300px;min-width: 310px; height: 350px; max-width: 600px;">
                                <div id="container2" style="min-width: 310px; height: 372px; max-width: 600px;  margin-left:100px;"></div>
                            </div>

                            <div class="input-group" style="margin-top:-10px;">


                                <div class="custom-control custom-radio custom-control-inline" style="margin-left:20px">
                                    <input type="radio" id="customRadioInline1" checked="" name="customRadioInline1" class="custom-control-input" onclick="SalesmanwiseGraphReport('column')">
                                    <label class="custom-control-label" for="customRadioInline1">Column chart</label>
                                </div>
                                <div class="custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline2" name="customRadioInline1" class="custom-control-input" onclick="SalesmanwiseGraphReport('line')">
                                    <label class="custom-control-label" for="customRadioInline2">Line chart</label>
                                </div>
                                <div class="custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline3" name="customRadioInline1" class="custom-control-input" onclick="GraphReport('container')">
                                    <label class="custom-control-label" for="customRadioInline3">Pi chart</label>
                                </div>
                                <div class="custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline4" name="customRadioInline1" class="custom-control-input" onclick="GraphReport('container2')">
                                    <label class="custom-control-label" for="customRadioInline4">Half-Pi chart</label>
                                </div>
                            </div>
                        </div>
                        <hr />

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

        </div>
        <div class="col-xl-3 col-lg-12 col-12">
            <div class="card">
                <div class="card-body">

                    <div id="container1" style="min-width: 310px; height: 430px; max-width: 600px; margin: 0 auto"></div>
                </div>
            </div>
        </div>
    </div>


    <div class="row">
        <div class="col-xl-12 col-lg-12 col-12">
            <div class="card" style="height:95%;">
                <div class="card-body">
                    <div class="card-header  mb-0">
                        <div class="row  mb-0">
                            <div class="col-md-6">
                                <h4 class="card-title">Project Job Dashboard</h4>
                            </div>
                            <div class="" style="float:left;margin-left:10px">
                                <input type="text" class="" style="width:105px;border-radius:10px;text-align:center" id="PJfromdate" onchange="loadgraph()" />
                            </div>
                            <div class="" style="float:left;margin-left:10px">
                                -
                            </div>
                            <div class="" style="float:left;margin-left:10px">
                                <input type="text" class="" style="width:105px;border-radius:10px;text-align:center" id="PJtodate" onchange="loadgraph()" />
                            </div>
                            <div class="col-md-1">

                            </div>
                            <div class="col-md-1" style="font-weight:bold">
                                <label>Status</label>
                            </div>
                           
                            <div class="col-md-2">
                                <select id="PJStatus" class="form-control" onchange="GetProjectJob($('#PJStatus').val())">
                                    <option value="">-All-</option>
                                    <option value="Created">Created</option>
                                    <option value="Started">Started</option>
                                    <option value="Pending">Pending</option>
                                    <option value="Closed">Closed</option>
                                </select>
                            </div>
                        </div>
                      
                    </div>
                    <div class="card-body px-2" style="height:350px; overflow:auto;margin-top:-15px">

                        <table class="table table-condensed table-light table-striped table-bordered eumi-search-table dataTable" id="projectdashboard"></table>
                        <div id="LoadingFastmoving" class="" style="display:none;background:none;">
                            <div style="position:fixed;left:50%">
                                <img src="~/app-assets/img/Loading_1.gif" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="row">


        <div class="col-xl-12 col-lg-12 col-12">
            <div class="card" style="height:470px;">
                <div class="card-body" style="">
                    <div class="card-header pb-0">
                        <div class="row">
                            <div class="col-md-6"><h4 class="card-title">Order Bouncing Approval</h4></div>

                        </div>

                    </div>
                    <div class="card-body px-2" style="height:400px; overflow:auto;width:100%">
                        <table class="table table-condensed table-light table-striped table-bordered eumi-search-table dataTable" id="orderbouncing" style="width:100%"></table>
                        <div id="LoadingOrderBouncing" class="" style="display:none;background:none;">
                            <div style="position:fixed;left:25%">
                                <img src="~/app-assets/img/Loading_1.gif" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

       
        
       

    </div>




    <div class="row">
        @*<div class="col-xl-3 col-lg-3 col-3">
                <div class="card" style="width:100%;height:580px">
                    <div class="card-header">
                        <h4 class="card-title mb-0"><input type="checkbox" id="checkallusers" onchange="Checkallusers()" />&#160;&#160;User List</h4>
                    </div>
                    <div class="card-body">
                        <input type="hidden" id="msguser" />
                        <div id="userlist" style="height:300px; overflow:auto;" class="card-block">


                        </div>
                        <hr />


                        <div class="card-block">
                            <div class="row">
                                <div class="col-xl-12 col-lg-6 col-md-6 col-12">
                                    <textarea style="height:80px;width:100%"></textarea>
                                </div>
                                <div class="col text-center">
                                    <button type="button" id="sendmsg" class="btn btn-raised btn-primary" onclick="sendmessage()">
                                        <i class="fa fa-paper-plane-o hidden-lg-up"></i> Send
                                    </button>
                                </div>

                            </div>
                        </div>



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


        <div class="col-xl-12 col-lg-12 col-12">
            <div class="card" id="defaulttable" style="width:100%;">
                <div class="row m-1">
                    <div class="col-md-12" style="align-content:center;">
                        <div class="card-header">
                            <center><h4 class="card-title mb-0">Work Items</h4></center>
                        </div>

                        <div class="card-body" style="margin-top:3px; height:auto; overflow:auto;width:100%;">
                            <table id="listitems" class="table table-condensed table-light table-striped table-bordered eumi-search-table" style="width:150%;margin-top:40px;"></table>
                        </div>
                    </div>
                </div>


                <div style="height:90%;clear: both">
                    &nbsp;
                    <div style="display:none;">
                        <input id="Type" type="text" />
                        <input id="BillSerId" type="text" value="0" />
                        <input id="BillNo" type="text" value="0" />
                        <input id="ReferenceNo" type="text" value="0" />
                    </div>
                </div>
            </div>
        </div>




        <div class="col-xl-4 col-lg-12" style="display:none;">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Statistics</h4>
                </div>
                <div class="card-body">

                    <p class="font-medium-2 text-muted text-center">.</p>
                    <div id="bar-chart" class="height-250 BarChartShadow BarChart">
                    </div>

                    <div class="card-block">
                        <div class="row">
                            <div class="col text-center">
                                <span class="gradient-pomegranate d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">48</span>
                                <span>Sport</span>
                            </div>
                            <div class="col text-center">
                                <span class="gradient-green-tea d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">9</span>
                                <span>Music</span>
                            </div>
                            <div class="col text-center">
                                <span class="gradient-blackberry d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">26</span>
                                <span>Travel</span>
                            </div>
                            <div class="col text-center">
                                <span class="gradient-ibiza-sunset d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">17</span>
                                <span>News</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-lg-12" style="display:none;">
            <div class="card ">
                <div class="card-header">
                    <h4 class="card-title">Project Stats</h4>
                </div>
                <div class="card-body">

                    <p class="font-medium-2 text-muted text-center">Project Tasks</p>
                    <div id="donut-dashboard-chart" class="height-250 donut">
                    </div>

                    <div class="card-block">
                        <div class="row mb-3">
                            <div class="col">
                                <span class="mb-1 text-muted d-block">23% - Started</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-success" role="progressbar" style="width: 23%;" aria-valuenow="23" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div>
                            <div class="col">
                                <span class="mb-1 text-muted d-block">14% - In Progress</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-amber" role="progressbar" style="width: 14%;" aria-valuenow="14" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row mb-2">
                            <div class="col">
                                <span class="mb-1 text-muted d-block">35% - Remaining</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-deep-purple bg-lighten-1" role="progressbar" style="width: 35%;" aria-valuenow="35" aria-valuemin="0"
                                         aria-valuemax="100"></div>
                                </div>
                            </div>
                            <div class="col">
                                <span class="mb-1 text-muted d-block">28% - Done</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-blue" role="progressbar" style="width: 28%;" aria-valuenow="28" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>


</div>

<div id="container1" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>

<div id="popupdiv" class="modal fade text-left show" tabindex="-1" role="dialog" aria-labelledby="myheader" style="background:rgba(0,0,0,0.5); display: block;display:none;">
    <div class="modal-dialog modal-slg" role="document" style="top:55%">
        <div class="modal-content">
            <div class="modal-header bg-primary white">
                <h5 class="modal-title" id="myheader">Create Work Item</h5>
                <button type="button" class="close" onclick="CloseAssign()" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>

            <div class="modal-body">
                <div class="col-md-12">
                    <div class="row">
                        <input type="hidden" id="WorkItemId" class="form-control" value="0">
                        <label class="col-md-5" style="margin-top:5px;text-align:left">Department:</label>
                        <div class="col-md-7">
                            <select id="Department" class="form-control disa"></select>
                        </div>


                    </div>
                    <div class="row" style="margin-top:2%;">

                        <label class="col-md-5" style="margin-top:5px;text-align:left">Division:</label>
                        <div class="col-md-7">
                            <select id="Division" class="form-control disa" onchange="WorkTaskTime()"></select>
                        </div>

                    </div>
                    <div class="row" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">User:</label>
                        <div class="col-md-7">
                            <input type="text" id="User" class="form-control disa" autocomplete="off" onkeyup="checkuser()">
                        </div>
                        <input type="hidden" id="UserId" value="0" class="form-control" autocomplete="off">
                        <input type="hidden" id="UserLength" class="form-control" autocomplete="off">
                    </div>
                    <div class="row" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">Title:</label>
                        <div class="col-md-7">
                            <input type="text" id="Title" class="form-control disa" autocomplete="off">
                        </div>

                    </div>
                    <div class="row" style="margin-top:2%;height:90px;">

                        <label class="col-md-5" style="text-align:left">Description:</label>
                        <div class="col-md-7">
                            <textarea id="Description" class="form-control disa" style="resize: none;height:100%"></textarea>
                        </div>

                    </div>
                    <div class="row" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">Reference Type:</label>
                        <div class="col-md-7">
                            <input type="text" id="RefType" class="form-control disa" autocomplete="off">
                        </div>
                    </div>
                    <div class="row" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">Reference Id:</label>
                        <div class="col-md-7">
                            <input type="text" id="RefId" class="form-control disa" autocomplete="off">
                        </div>

                    </div>
                    <div class="row" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">Turn around Time:</label>
                        <div class="col-md-7">
                            <select class="form-control disa" id="Time"></select>
                        </div>
                    </div>
                    <div class="row" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">Status</label>
                        <div class="col-md-7">
                            <select class="form-control disa" id="Status" onchange="checkhold()">
                                <option value="Created">Created</option>
                                <option value="Started">Started</option>
                                <option value="In Progress">In Progress</option>
                                <option value="On Hold">On Hold</option>
                                <option value="Ready To Deliver">Ready To Deliver</option>
                                <option value="On The Way">On The Way</option>
                                <option value="Delivered With Pending">Delivered With Pending</option>
                                <option value="Completed">Completed</option>
                                <option value="Canceled" hidden>Cancel</option>
                                <option value="Reassign" hidden>Reassigned</option>

                            </select>
                        </div>

                    </div>
                    <div class="row" id="panel1" style="margin-top:2%;display:none">

                        <label class="col-md-5" style="text-align:left" id="reasondisplay"></label>
                        <div class="col-md-7">
                            <input type="text" id="Remarksdisplay" class="form-control disa" autocomplete="off">
                        </div>
                    </div>
                    <div class="row" id="panel2" style="margin-top:2%;display:none">

                        <label class="col-md-5" style="text-align:left" id="">Driver</label>
                        <div class="col-md-7">
                            <input type="text" id="Driver" class="form-control disa" autocomplete="off">
                            <input type="hidden" id="DriverId" class="form-control disa" value="0">
                        </div>
                    </div>
                    <div class="row" id="panel3" style="margin-top:2%;display:none">

                        <label class="col-md-5" style="text-align:left" id="">User</label>
                        <div class="col-md-7">
                            <input type="text" id="IPUser" class="form-control disa" autocomplete="off">
                            <input type="hidden" id="IPUserId" class="form-control disa" value="0">
                        </div>
                    </div>
                    <div class="row" style="margin-top:2%;height:70px;">

                        <label class="col-md-5" style="text-align:left">Remarks:</label>
                        <div class="col-md-7">
                            <textarea id="NewRemarks" class="form-control disa" style="resize: none;height:100%"></textarea>
                        </div>

                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" style="width:150px;display:none" id="btncancel" class="btn btn-outline-danger">Cancel Work</button>
                <button type="button" style="width:150px;display:none" id="btntransfer" class="btn btn-outline-warning">Transfer</button>
                <button type="button" style="width:150px;display:none" id="btnassignme" onclick="AssignMe()" class="btn btn-outline-success">Assign Me</button>
                <button type="button" style="width:100px" id="btnclose" onclick="CloseAssign()" class="btn btn-outline-secondary">Close</button>
                <button type="button" style="width:100px" id="btnassign" class="btn btn-outline-primary">Create</button>
                <button type="button" style="width:100px;display:none" id="CNWR" onclick="ReAssignAsNew()" class="btn btn-info">Re Assign</button>
            </div>


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




<div id="ReasonDiv" class="modal fade text-left show" tabindex="-1" role="dialog" aria-labelledby="myheader" style="background:rgba(0,0,0,0.5); display: block;margin-top:77%;display: none;">
    <div class="modal-dialog modal-dialog-centered" role="document" style="top:-25%">
        <div class="modal-content">
            <div class="modal-header">
                @*<h5 class="modal-title" id="myheader">Add Time Tags</h5>*@
                <button type="button" class="close" onclick="$('#ReasonDiv').hide()" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>

            <div class="modal-body">
                <div class="col-md-12">
                    <div class="row" id="panel" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left" id="reason"></label>
                        <div class="col-md-7">
                            <input type="text" id="Remarks" class="form-control disa" autocomplete="off">
                        </div>
                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" style="width:100px;" id="btndivdelete" onclick="$('#ReasonDiv').hide()" class="btn btn-outline-secondary">Close</button>
                <button type="button" style="width:100px" id="btncnclsave" onclick="CancelWork()" class="btn btn-outline-danger">Cancel</button>
            </div>


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

<div id="TransferDiv" class="modal fade text-left show" tabindex="-1" role="dialog" aria-labelledby="myheader" style="background:rgba(0,0,0,0.5); display: block;margin-top:77%;display: none;">
    <div class="modal-dialog modal-dialog-centered" role="document" style="top:-25%">
        <div class="modal-content">
            <div class="modal-header">
                @*<h5 class="modal-title" id="myheader">Add Time Tags</h5>*@
                <button type="button" class="close" onclick="$('#TransferDiv').hide()" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>

            <div class="modal-body">
                <div class="col-md-12">
                    <div class="row" id="panel" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">Reason For Transfer:</label>
                        <div class="col-md-7">
                            <input type="text" id="rsntransfer" class="form-control disa" autocomplete="off">
                        </div>
                    </div>
                    <div class="row" id="panel" style="margin-top:2%;">

                        <label class="col-md-5" style="text-align:left">Transfer To User:</label>
                        <div class="col-md-7">
                            <input type="text" id="transuser" class="form-control disa" autocomplete="off" onkeyup="checktransuser()">
                            <input type="hidden" id="transuserId" value="0" class="form-control disa" autocomplete="off">
                            <input type="hidden" id="transuserLength" class="form-control disa" autocomplete="off">
                        </div>
                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" style="width:100px;" id="btncncl" onclick="$('#TransferDiv').hide()" class="btn btn-outline-secondary">Close</button>
                <button type="button" style="width:100px" id="btntras" onclick="Reassign()" class="btn btn-outline-warning">Transfer</button>
            </div>


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

<div id="LoadingSmallRound" class="overlay" style="display:none;background:none">
    <div style="position:fixed;top:20%;left:50%">
        <img src="~/app-assets/img/Loading_1.gif" />
    </div>
</div>

<div class="modal fade text-left show" id="iconForm" tabindex="-1" role="dialog" aria-labelledby="headiddetialls" style="padding-right: 17px; display: none;background:rgba(0,0,0,0.5);height:1800px;">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content" style="width:180%; margin-left:-270px;margin-top:20%">
            <div class="modal-header bg-primary white">
                <div style="" id="saleshead">
                    <h4 class="modal-title" id="headiddetialls"></h4>
                </div>
                <div style="width:5%">

                </div>
                <div style="" id="salesdetails">
                   
                </div>
                <button type="button" class="close" data-dismiss="modal" onclick="$('#iconForm').hide();" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div id="View">
                <div class="modal-body">

                    <div id="div1" style="height:500px;overflow:auto;width:100%">
                        <table id="Stocklist" class="table table-striped table-bordered zero-configuration dataTable" style="width:100%"></table>
                    </div>
                </div>
                <div class="modal-footer">
                    <input type="hidden" id="RowGet" />
                    @*<input type="button" id="btn1" class="btn btn-outline-secondary btn-lg" style="height:45px;width:75px" onclick="$('#iconForm').hide();" value="close">*@
                </div>
            </div>

        </div>
    </div>

</div>
<div id="PendingPurchaseTransactionPopup" class="modal fade text-left show" tabindex="-1" role="dialog" aria-labelledby="PurchaseTransactionheader" style="padding-right: 17px; display: block; display:none">
    <div class="modal-dialog modal-lg" role="document" style="margin-top:20%;margin-left:300px">
        <div class="modal-content" style="width:170%;">
            <div class="modal-header bg-primary white">
                <h4 class="modal-title col-md-10" id="PendingPurchaseTransactionheader"></h4>

                <div id="allpendingcheckboxdiv" class="custom-control custom-checkbox col-md-1" style="display:none">
                    <input type="checkbox" class="custom-control-input" id="select_statuspending" onchange="PendingPurchasespopup($('#ProductId').val())">
                    <label class="custom-control-label" for="select_statuspending">All</label>
                </div>

                <button type="button" class="close" onclick="ClosePendingPurTransPopup()" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <section id="pendingpurchasetrans" style="display:none">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-1"></div>
                                <div class="col-md-3">
                                    <label style="font-weight:bold">Total Pending :</label>
                                    <label style="font-weight:bold" id="totalpending"></label>
                                </div>
                                <div class="col-md-4"></div>
                                <div class="col-md-3">
                                    <label style="font-weight:bold">Total In transit Qty. :</label>
                                    <label style="font-weight:bold" id="totalintransit"></label>
                                </div>
                                <div class="col-md-1"></div>


                            </div>
                            <div class="card-block" style="overflow:scroll;width:100%;overflow:auto">
                                <div id="" class="jsgrid" style="position: relative;overflow-y:scroll;width:100%;height:530px">
                                    <input type="hidden" id="pendingtransid" />
                                    <table class="table table-responsive-md-md jsgrid-table compact table-bordered table-striped" id="tblpendingpurchasetrans" style="width:100%;overflow-x:scroll;overflow-y:scroll;font-size:small"></table>
                                </div>
                            </div>


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

<div style="display:none">
    <input type="text" value="1" id="RowCount" />
    <input type="text" id="ProductId" />
    <input type="text" id="ItemCode" class="form-control" />
    <input type="text" id="ItemDescription" class="form-control" />
</div>
@section bottomscripts {
    <script type="text/javascript" src="~/Scripts/EumiDataTable/eumi-datatable.js"></script>
}






<script type="text/javascript">
    function PendingPurchasespopup(ItemId) {
        $('#ProductId').val(ItemId);
        $('#ItemCode').val($('#Icode'+ItemId).text());
        $('#ItemDescription').val($('#IDesc' + ItemId).text());

        var pending = 0;
        var Intransit = 0;
        if ($('#select_statuspending').prop("checked"))
            var s = 1;
        else
            var s = 0;

        $('#totalpending').text('');
        $('#pendingtransid').val(0);
        if ($('#ProductId').val() != 0) {

            disable_datatable('tblpendingpurchasetrans');


            var data = {};   //array
            data.ItemId = ItemId;
            data.Department = ERPDeptId;
            data.UserId = ERPUserId;
            data.Type = s;

            $.ajax({
                type: "POST",
                url: "../StockReport/PendingPurchaseOrderSQ",
                data: data,
                success: function (result) {

                    var ProdRow = "<thead><tr><th>Order#</th><th>Date</th><th>Supplier</th><th>Order Qty.</th><th>In transit Qty.</th><th>Received Qty.</th><th>Arrival Date</th><th>FC Cost</th><th>Currency</th><th style='display:none'></th></tr>" +
                                         "<tr><th>Order#</th><th>Date</th><th>Supplier</th><th>Order Qty.</th><th>In transit Qty.</th><th>Received Qty.</th><th>Arrival Date</th><th>FC Cost</th><th>Currency</th><th style='display:none'></th></tr></thead><tbody>";

                    if (result.length != 0) {

                        for (var p = 0; p < result.length; p++) {
                            if (SuppDetailsRight == 'Yes') {
                                ProdRow = ProdRow + "<tr id=" + 'pdctrow' + (p + 1) + ">" +
                                "<td class='text-center'>" + result[p].OrderNo + "</td>" +
                                "<td class='text-center'>" + result[p].OrderDate + "</td>" +
                                "<td class='text-left'>" + result[p].Supplier + "</td>" +
                                "<td style='text-align:center' class='QtyColour'>" + result[p].OrderQty + "</td>" +
                               "<td style='text-align:center' class='QtyColour'>" + result[p].PerformaQty + "</td>" +
                               "<td style='text-align:center' class='QtyColour'>" + result[p].RecQty + "</td>" +
                                "<td style='text-align:center'>" + result[p].PerformaDate + "</td>" +
                                "<td style='text-align:right'>" + parseFloat(result[p].FCCost).toFixed(Decimal) + "</td>" +
                                "<td class='text-left'>" + result[p].Currency + "</td>" +
                                "<td class='text-right' style='display:none'>" + parseFloat(result[p].PendingQty).toFixed(Decimal) + "</td></tr>";
                            }
                            else
                            {
                                ProdRow = ProdRow + "<tr id=" + 'pdctrow' + (p + 1) + ">" +
                                "<td class='text-center'>" + result[p].OrderNo + "</td>" +
                                "<td class='text-center'>" + result[p].OrderDate + "</td>" +
                                "<td></td>" +
                                "<td style='text-align:center' class='QtyColour'>" + result[p].OrderQty + "</td>" +
                                "<td style='text-align:center' class='QtyColour'>" + result[p].PerformaQty + "</td>" +
                                "<td style='text-align:center' class='QtyColour'>" + result[p].RecQty + "</td>" +
                                "<td style='text-align:center'>" + result[p].PerformaDate + "</td>" +
                                "<td></td>" +
                                "<td class='text-left'>" + result[p].Currency + "</td>" +
                                "<td class='text-right' style='display:none'>" + parseFloat(result[p].PendingQty).toFixed(Decimal) + "</td></tr>";
                            }
                            pending += parseFloat(result[p].PendingQty);
                            Intransit += parseFloat(result[p].PerformaQty);
                        }

                        $('#tblpendingpurchasetrans').html(ProdRow + '</tbody>');
                        datatableWithsearchNew('tblpendingpurchasetrans', 'MultiplePurchaseOrderT');
                        $('#tblpendingpurchasetrans').scrollTop(0);
                        $('#totalpending').text(pending);
                        $('#totalintransit').text(Intransit);

                    }
                    else {
                        $('#totalpending').text(0);
                        $('#totalintransit').text(0);
                        $('#tblpendingpurchasetrans').html(ProdRow + '</tbody>');
                        datatableWithsearchNew('tblpendingpurchasetrans', 'MultiplePurchaseOrderT');
                    }


                    $('#allpendingcheckboxdiv').show();
                    $('#productpdiv').hide();
                    $('#productdiv').hide();
                    $('#salestransdiv').hide();
                    $('#PurchaseTransactionPopup').hide();
                    $("#PendingPurchaseTransactionPopup").css("margin-top", '0px');
                    $('#PendingPurchaseTransactionPopup').show();
                    var ProductDesc = $('#ItemCode').val();
                    var product = $('#ItemDescription').val();
                    $('#PendingPurchaseTransactionheader').text(ProductDesc + '(' + product + ')' + ' :  Pending Details');
                    $('#pendingpurchasetrans').show();

                }
            });
        }

    }
    function ClosePendingPurTransPopup() {
        var Z = $('#tblpendingpurchasetrans tr').length;
        $('#PendingPurchaseTransactionPopup').hide();
        $('#pendingpurchasetrans').hide();
        for (var j = 1; j <= Z; j++) {
            $('#pid_' + j).remove();
        }
    }
    var RemarkFlag=0;
    $("#User").autocomplete({
        delay: 0,
        minLength: 0,
        source: function (request, response) {
            var data1 = {};
            data1.UserName = $("#User").val();
            data1.DepartmentId = $("#Department").val();
            data1.DivisionId = $("#Division").val();

            $.ajax({
                url: '../WorkItemUser/DeptUserGetandGets',
                type: "POST",
                data: data1,
                dataType: "json",
                success: function (data) {

                    response($.map(data, function (item) {
                        return ({
                            ColCount: 'ONE',
                            label: item.UserName,
                            UserId: item.UserId,
                            UserName:item.UserName,
                            headers: ["User"]
                        })
                    }));
                }

            })

        },
        autoFocus: true,
        select: function (event, ui) {
            $('#UserId').val(ui.item.UserId);
            $('#UserLength').val((ui.item.UserName).length);
        },
    });

    $("#transuser").autocomplete({
        delay: 0,
        minLength: 0,
        source: function (request, response) {
            var data1 = {};
            data1.UserName = $("#transuser").val();
            data1.DepartmentId = $("#Department").val();
            data1.DivisionId = $("#Division").val();

            $.ajax({
                url: '../WorkItemUser/DeptUserGetandGets',
                type: "POST",
                data: data1,
                dataType: "json",
                success: function (data) {

                    response($.map(data, function (item) {
                        return ({
                            ColCount: 'ONE',
                            label: item.UserName,
                            UserId: item.UserId,
                            UserName:item.UserName,
                            headers: ["User"]
                        })
                    }));
                }

            })

        },
        autoFocus: true,
        select: function (event, ui) {
            $('#transuserId').val(ui.item.UserId);
            $('#transuserLength').val((ui.item.UserName).length);
        },
    });

    $("#Driver").autocomplete({
        delay: 0,
        minLength: 0,
        source: function (request, response) {
            var data1 = {};
            data1.DriverName = $("#Driver").val();
            data1.DepartmentId = $("#Department").val();

            $.ajax({
                url: '../WorkItemUser/DriverAutoComplete',
                type: "POST",
                data: data1,
                dataType: "json",
                success: function (data) {

                    response($.map(data, function (item) {
                        return ({
                            ColCount: 'ONE',
                            label: item.DriverName,
                            DriverId: item.Driver,
                            Driver: item.DriverName,
                            headers: ["Driver"]
                        })
                    }));
                }

            })

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

    $("#IPUser").autocomplete({
        delay: 0,
        minLength: 0,
        source: function (request, response) {
            var data = {};
            data.UserName = $("#IPUser").val();
            $.ajax({
                url: '../Master/UserSearch',
                type: "POST",
                data: data,
                dataType: "json",
                success: function (data) {

                    response($.map(data, function (item) {
                        return ({
                            ColCount: 'ONE',
                            label: item.UserName,
                            UserId: item.UserId,
                            UserName: item.UserName,
                            headers: ["User"]
                        })
                    }));
                }

            })

        },
        autoFocus: true,
        select: function (event, ui) {
            $('#IPUserId').val(ui.item.UserId);
        },
    });

    $(document).ready(function () {
        calcPJ();
        GetProjectJob($('#PJStatus').val());
        $('#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'
            }
        });

        GetDepartment();
        GetDivision();
        GetList();
        GetNonMovingItems(1);
        $("#btnassign").click(function (e) {
            SaveAndUpdate()
        });
        $("#btncancel").click(function (e) {
            $('#TransferDiv').hide();
            $('#Remarks').prop("disabled",false)
            $('#ReasonDiv').show();
            $('#reason').text('Reason For Cancel:')
            $('#Remarks').focus();
        });
        $("#btntransfer").click(function (e) {
            $('#ReasonDiv').hide();
            $('#rsntransfer').prop("disabled",false);
            $('#transuser').prop("disabled",false);
            $('#TransferDiv').show();
            $('#rsntransfer').focus();

        });
        Defaultfocus();

        if ("@Request.QueryString["from"]" == "SalesInvoice") {
            var srlsrs = sessionStorage.getItem("sales_srs");
            var srlno = sessionStorage.getItem("sales_slno");
            var dep = sessionStorage.getItem("sales_deptid");
            sessionStorage.removeItem("sales_srs");
            sessionStorage.removeItem("sales_slno");
            sessionStorage.removeItem("sales_deptid");
            var numId = parseInt(srlsrs);
            var num = parseInt(srlno);
            var deprtid=parseInt(dep)
            if (!isNaN(numId) && !isNaN(num) && !isNaN(deprtid)) {
                GetSalesInvoceWorkItem(numId,num,deprtid);
            }
        }
        else if("@Request.QueryString["from"]" == "Layout"){
            var sorttype = sessionStorage.getItem("sort_type");
            sessionStorage.removeItem("sort_type");
            var worksorttype = parseInt(sorttype);
            if (!isNaN(worksorttype)) {
                $('#defaulttable').hide();
                GetSortedWorkitem(worksorttype);

            }
        }
        $(document).keydown(function (e) {
            if (e.keyCode == 27) { //ESC       :   Popup Close
                $('#iconForm').hide();
            }
        });
    });

    function GetDepartment(){
        var data = {};
        data.DeptId = 0;
        $.ajax({
            type: "POST",
            url: "../Master/DepartmentGetandGets",
            data: data,
            success: function (result) {
                DepartmentLoad(result.oList);


            }
        });
    }


    function GetDivision(){

        var data1 = {};
        $.ajax({
            type: "POST",
            url: "../WorkItemUser/WorkDivisionGetandGets",
            data: data1,
            success: function (result) {
                DivisionLoad(result.oList);


            }
        });
    }

    function GetList() {


        if (usermenu1.indexOf("M225") != -1) {
            var  Flag = 0;               //ALL WORK ITEM VIEW RIGHT
        }
        else {
            var  Flag = 4;               //NOT ALL WORK ITEM VIEW RIGHT
        }



        var data = {};
        data.Type = Flag;
        data.UserId = ERPUserId;
        data.DepartmentId = ERPDeptId;
        data.FromDate = CurDate;
        data.ToDate = CurDate;
        data.Variable1 = 0;
        data.Variable2 = '';

        $.ajax({
            type: "POST",
            url: "../WorkItemUser/WorkItemGetList",
            data: data,
            success: function (result) {

                ListWorkItemsD(result);
            }
        });

    }

    function ListWorkItemsD(result) {

        disable_datatable('listitems', 'buttonPlace');
        var responseText = "<thead><tr>" +
            "<th>Edit</th>" +
            "<th>Sl#</th>" +
            "<th>Category</th>" +
            "<th>Description</th>" +
            "<th>Date/Time</th>" +
            "<th>Assigned By</th>" +
            "<th>Assigned To</th>" +
            "<th>Driver</th>" +
            "<th>Status</th>" +
            "<th>Location</th>" +
            "<th>Division</th>" +
            "<th>Reason</th>" +
            "<th>Remarks</th>" +
            "<th>UpdatedOn</th>" +
            "</tr></thead><tbody>";

        for (var i = 0; i < result.length; i++) {
            var slno = parseInt(i + 1);


            if (result[i].Status == 'Completed') var rowclass = 'badge-success';
            else if (result[i].Status == 'In Progress') var rowclass = 'badge-info';
            else if (result[i].Status == 'Canceled') var rowclass = 'badge-dark';
            else if (result[i].Status == 'Created') var rowclass = 'badge-light';
            else if (result[i].Status == 'Started') var rowclass = 'badge-secondary';
            else if (result[i].Status == 'On Hold') var rowclass = 'badge-danger';
            else if (result[i].Status == 'Reassign') var rowclass = 'badge-warning';
            else if (result[i].Status == 'Ready To Deliver') var rowclass = 'badge-pink white';
            else if (result[i].Status == 'On The Way') var rowclass = 'badge-primary';
            else if (result[i].Status == 'Delivered With Pending') var rowclass = 'badge-light-blue white';

            if (result[i].ExceededTime <= 0 && result[i].Status != 'Completed' && result[i].Status != 'Canceled' && result[i].Status != 'Reassign') {

                responseText += '<tr ondblclick=GetSalesCopy(' + "'" + result[i].BillSlNo + "'" + ',' + "'" + result[i].BillNo + "'" + ',' + "'" + result[i].BillDeptId + "'" + ')  class="white" style="background-color:#FF8F00">' +
                    '<td><a  onclick="GetItem(' + result[i].WorkItemId + ');">' + Editbutton + '</a></td>' +
                    '<td>' + slno + '</td>' +
                    '<td>' + result[i].Title + '</td>' +
                    '<td>' + result[i].Description + '</td>' +
                    '<td>' + result[i].AssignedOnDate + '</td>' +
                    '<td>' + result[i].AssignedByUser + '</td>' +
                    '<td>' + result[i].AssignedToUser + '</td>' +
                    '<td>' + result[i].DriverName + '</td>' +
                    '<td><div class="text-center" style="width:100%"><span style="width:100%" class="badge ' + rowclass + '">' + result[i].Status + '</span></div></td>' +
                    '<td>' + result[i].DepartmentName + '</td>' +
                    '<td>' + result[i].DivisionName + '</td>' +
                    '<td>' + result[i].Remarks + '</td>' +
                    '<td>' + result[i].NewWorkRemarks + '</td>' +
                    '<td>' + result[i].UpdatedOn + '</td>' +
                    '</tr>';

            }
            else {
                responseText += '<tr ondblclick=GetSalesCopy(' + "'" + result[i].BillSlNo + "'" + ',' + "'" + result[i].BillNo + "'" + ',' + "'" + result[i].BillDeptId + "'" + ')>' +
                    '<td><a  onclick="GetItem(' + result[i].WorkItemId + ');">' + Editbutton + '</a></td>' +
                    '<td>' + slno + '</td>' +
                    '<td>' + result[i].Title + '</td>' +
                    '<td>' + result[i].Description + '</td>' +
                    '<td>' + result[i].AssignedOnDate + '</td>' +
                    '<td>' + result[i].AssignedByUser + '</td>' +
                    '<td>' + result[i].AssignedToUser + '</td>' +
                    '<td>' + result[i].DriverName + '</td>' +
                    '<td><div class="text-center" style="width:100%"><span style="width:100%" class="badge ' + rowclass + '">' + result[i].Status + '</span></div></td>' +
                    '<td>' + result[i].DepartmentName + '</td>' +
                    '<td>' + result[i].DivisionName + '</td>' +
                    '<td>' + result[i].Remarks + '</td>' +
                    '<td>' + result[i].NewWorkRemarks + '</td>' +
                    '<td>' + result[i].UpdatedOn + '</td>' +
                    '</tr>';
            }
        }
        $('#listitems').html(responseText + '</tbody><tfoot><tr>' +
            '<th> </th>' +
            '<th> </th>' +
            '<th>Category</th>' +
            '<th>Description</th>' +
            '<th>Date/Time</th>' +
            '<th>Assigned By</th>' +
            '<th>Assigned To</th>' +
            "<th>Driver</th>" +
            '<th>Status</th>' +
            '<th>Location</th>' +
            '<th>Division</th>' +
            '<th>Reason</th>' +
            '<th>Remarks</th>' +
            '<th>UpdatedOn</th>' +
            '</tr></tfoot>');


        datatableWithsearchWIINDEX('listitems', true, '', 'buttonPlace');
        $('#Loading').hide();
        WorkItemNotifyVar = 0;
    }


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

        var a = '#' + tablename + ' tfoot th'
        $(a).each(function () {
            var title = $(this).text();
            if (title != ' ')
                $(this).html('<input type="text" placeholder="Search ' + title + '" style="width:100%" />');

        });
        var table = null;
        if (download) {
            if (!title || !tableButtonContainerId) { 
                //console.log("download table need title and button container"); }

            // AddColumnSelectionButton(tableButtonContainerId, tablename)

            table = $('#' + tablename).DataTable({
                // dom: 'Bfrtip',
                dom: "<'row'<'col-sm-1'l><'col-sm-11'f>>" +
                        "<'row'<'col-sm-12'tr>>" +
                        "<'row'<'col-sm-1'i><'col-sm-11'p>>",
                "pageLength": 25,
                "columnDefs": [
                    { "width": "2%", "targets": 0 },
                     { "width": "2%", "targets": 1 },
                    { "width": "9%", "targets": 2 },
                    { "width": "15%", "targets": 3 },
                    { "width": "8%", "targets": 4 },
                    { "width": "6%", "targets": 5 },
                    { "width": "6%", "targets": 6 },
                    { "width": "6%", "targets": 7 },
                    { "width": "6%", "targets": 8 },
                    { "width": "6%", "targets": 9 },
                    { "width": "4%", "targets": 10 },
                    { "width": "8%", "targets": 11 },
                    { "width": "10%", "targets": 12 },
                    { "width": "8%", "targets": 13 },

                ],
                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 DepartmentLoad(result) {
        $("#Department").empty();
        for (var i = 0; i < result.length; i++) {
            $("#Department").append("<option value='" + result[i].DepartmentId + "'>" + result[i].DepartmentName + "</option>");
        }
        $('#Department').val(ERPDeptId);
    }

    function DivisionLoad(result) {
        $("#Division,#Division1,#Division2").empty();
        $("#Division1,#Division2").append("<option value='0'>--Select Division--</option>");
        for (var i = 0; i < result.length; i++) {
            $("#Division,#Division1,#Division2").append("<option value='" + result[i].DivisionId + "'>" + result[i].DivisionName + "</option>");
        }
        WorkTaskTime();
    }

    function WorkTaskTime() {
        var data = {};
        data.DivisionId = $('#Division').val();
        $.ajax({
            type: "POST",
            url: "../WorkItemUser/WorkingTaskTimeGetandGets",
            data: data,
            success: function (result) {
                WorkTimeGets(result.bList);


            }
        });
    }

    function WorkTimeGets(result){
        $("#Time").empty();
        for (var i = 0; i < result.length; i++) {
            var Hr=0;   var Min=0;  var realmin=0;

            if(result[i].TurnAroundTimes>=60){
                Min = parseInt(result[i].TurnAroundTimes);
                realmin = Min % 60;
                Hr = Math.floor(Min / 60);
                $("#Time").append("<option value='" + result[i].TurnAroundTimes + "'>" + result[i].TurnAroundTimesName +" - " + Hr + " HR(s) "+ realmin +" Min(s)</option>");
            }
            else{
                Hr=0;
                realmin=parseInt(result[i].TurnAroundTimes)
                $("#Time").append("<option value='" + result[i].TurnAroundTimes + "'>" + result[i].TurnAroundTimesName +" - " + Hr + " HR(s) "+ realmin +" Min(s)</option>");
            }

        }
    }







    function Checkallusers() {
        //alert('')
    }


    const monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var hhh = new Date();
    var mmmonth = hhh.getMonth() + 1;
    var ddday = hhh.getDate();
    var MonthFirst = '01/' + (mmmonth < 10 ? '0' : '') + mmmonth + '/' + hhh.getFullYear();
    var monthtext = '';

    GetUsers();
    function GetUsers() {
        var data = {};
        data.UserId = 0;
        $.ajax({
            type: "POST",
            url: "../Master/UsersGetandGets",
            data: data,
            success: function (result) {
                ShowUserslist(result.oList);
            }
        });
    }



    var d = new Date();
    var month = d.getMonth() + 1;
    var day = d.getDate();

    $('#fromdate').val(CurDate);
    $('#todate').val(CurDate);
    $('#PJfromdate').val(CurDate);
    $('#PJtodate').val(CurDate);
    
    SalesmanwiseGraphReport('column')
    SalesPerformance('loess')


    function ChangeType() {
        if ($('#Datetype').val() == 0 || $('#Datetype').val() ==1 )
        {
            $('#fromdate').val(CurDate);
            $('#todate').val(CurDate);
        }
        loadgraph();
        //SalesmanwiseGraphReport('column');
        //$("#customRadioInline1").prop("checked", true);
    }

    //GetExpiryItems()
    //GetPurchaseorderItems()
   // GetOrderBouncing()




    function GetFast() {
        if ($('#fastQty').val() == '') {
            GetFastMovingItems(1)

        }
        else {
            GetFastMovingItems(0)
        }

    }

    function GetNon() {
        if ($('#nonQty').val() == '') {

            GetNonMovingItems(1)

        }
        else {
            GetNonMovingItems(0)
        }

    }

    function GetPurchaseorderItems() {

        var Condition = 'CONVERT(datetime,InvDate,103) >= CONVERT(datetime,' + "'" + CurDate + "'" + ',103) and CONVERT(datetime,InvDate,103) <= CONVERT(datetime,' + "'" + CurDate + "'" + ',103) group by ProductCode,ProductDescr,GrpCode,SbgrpName,CategoryCode,SubCategoryName,Inv_SalesSub.DeptId,avgcost order by Quantity desc'
        var data = {};
        data.Number = 5;
        data.Condition = Condition;



        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/PurchaseOrderReminder",
            data: data,
            success: function (result) {
                ShowTopSalesreport(result);
            }
        });
    }
    function ShowTopSalesreport(result) {
        var responseText = "<thead><tr><th align=left>Product</th><th align=center>Quantity</th></tr></thead>  <tbody>";
        for (var i = 0; i < result.length; i++) {

            if (result[i].ItemDesc != 'Grand Total')
                responseText += '<tr><td align=left>' + result[i].ItemCode + ' - ' + result[i].ItemDesc + '</td><td align=center>' + result[i].Qty + '</td></tr>';
        }
        $('#topnsales').html(responseText + '</tbody>');
    }
    //function GetOrderBouncing()
    //{
    //    $('#LoadingOrderBouncing').show();
    //    var data = {};
    //    data.FromDate = $('#From').val();
    //    data.ToDate = $('#To').val();

    //    $.ajax({
    //        type: "POST",
    //        url: "../Purchaseandsalesreports/OrderBouncingReport",
    //        data: data,
    //        success: function (result) {
    //            ShowOrderBouncing(result);
    //        }
    //    });
    //}

   
    function GetProjectJob(Type) {
        $('#LoadingFastmoving').show();
        var data = {};
        data.FromDate = $('#PJfromdate').val();
        data.ToDate = $('#PJtodate').val(); 
        data.Type = Type;
        $.ajax({
            type: "POST",
            url: "../Projectandjob/ProjectJobDashboard",
            data: data,
            success: function (result) {
                disable_datatable('projectdashboard');
                $('#projectdashboard tr').remove();
                $('#LoadingFastmoving').hide();
             
                ShowPJ(result);
            }
        });
    }

    function ShowPJ(result) {

        var responseText="";
         responseText = "<thead><tr><th class='text-center'>Sl#</th><th>Job Code</th><th>Description</th><th>Customer</th><th>Salesman</th><th style=text-align:right>Est.Amount</th><th>LPO</th><th>Status</th></tr>"+
            "<tr><th class='text-center'> </th><th>Job Code</th><th>Description</th><th>Customer</th><th>Salesman</th><th style=text-align:right> </th><th>LPO</th><th> </th></tr></thead>  <tbody>";
        for (var i = 0; i < result.length; i++) {
            if (result[i].Status == 'Created') var rowclass = 'badge-success';
            else if (result[i].Status == 'Started') var rowclass = 'badge-info';
            else if (result[i].Status == 'Pending') var rowclass = 'badge-danger';
            else if (result[i].Status == 'Closed') var rowclass = 'badge-warning';

            responseText += '<tr><td class="text-center">' + (i + 1) + '</td><td>' + result[i].JobCode + ' </td><td> ' + result[i].JobDescription + '</td><td>' + result[i].Customer + '</td><td>' + result[i].Salesman + '</td><td style=text-align:right>' + ReplaceNumberWithCommas(parseFloat(result[i].EstAmount || 0).toFixed(Decimal)) + '</td><td>' + result[i].LPO + '</td><td><div class="text-center" style="width:100%"><span style="width:100%" class="badge ' + rowclass + '">' + result[i].Status + '</span></div></td></tr>';
        }
        $('#projectdashboard').html(responseText + '</tbody>');
        datatableWithsearchNew('projectdashboard', 'Multiple');
        $('#LoadingFastmoving').hide();
    }




    $('#Datetype').val('0');
    //  DepartmentWiseSalesDashboard('column')



    function Getaccountstament() {
        $('#LoadingSmallRound').show();
        $('#salesdetails').hide();
        $('#pcol0').text(''); $('#pcol1').text(''); $('#pcol2').text(''); $('#pcol3').text('');


        var data = {};
        data.Fromdate = $('#fromdate').val(); //'01/01/2019';
        data.Todate = $('#todate').val();   //CurDate;
        data.DeptId = ERPDeptId;
        data.UserId = ERPUserId;


        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/CustOutstandingDashboard",
            data: data,
            success: function (result) {
                showaccountstament(result);
            }
        });
    }


    function showaccountstament(result) {


        disable_datatable('Stocklist');
        $('#Stocklist tr').remove();
        var responseText = "";
        if (result.length != 0) {


            var responseText = "<thead><tr><th style='text-align:center;'>Sl#</th><th style='width:150px'>Account Code</th><th style='width:300px'>Account Name</th><th class=text-right style='width:100px'>Debit</th><th style='width:100px' class=text-right>Credit</th><th style='display:none'></th></tr>" +
                "<tr><th style='text-align:center;'>Sl#</th><th>Account Code</th><th>Account Name</th><th class=text-right>Debit</th><th class=text-right>Credit</th><th style='display:none'></th></tr>" +
                "</thead><tbody>";

            for (var i = 0; i < result.length; i++) {


                var slno;
                slno = parseInt(i+1);

                var DebitAmt = parseFloat(result[i].Debit || 0).toFixed(Decimal);
                var CreditAmt = parseFloat(result[i].Credit || 0).toFixed(Decimal);
                if (DebitAmt == 0)
                    DebitAmt = '';

                if (CreditAmt == 0)
                    CreditAmt = '';

                if (result[i].AccDesc == 'Balance') {

                    responseText += '<tr style="background-color:#cfd8dc"><td style="width:70px;text-align:center;"><b>' + slno + '</b></td><td style="width:150px"  id="Col1_' + slno + '" ><b>' + result[i].AccCode + '</b></td><td style="width:500px;"   id="Col2_' + slno + '" ><b>' + result[i].AccDesc + '</b></td><td   id="Col3_' + slno + '" style="text-align:right;width:120px"><b>' + ReplaceNumberWithCommas(DebitAmt) + '</b></td><td id="Col4_' + slno + '" style="text-align:right;width:120px" ><b>' + ReplaceNumberWithCommas(CreditAmt) + '</b></td><td id="Col5_' + slno + '" style="text-align:right;display:none"><b>1</b></td></tr>';
                }
                else  if (CreditAmt == '' && DebitAmt=='') {

                    responseText += '<tr style="background-color:#cfd8dc"><td style="width:70px;text-align:center;"><b>' + slno + '</b></td><td style="width:150px"  id="Col1_' + slno + '" ><b>' + result[i].AccCode + '</b></td><td style="width:500px;"   id="Col2_' + slno + '" ><b>' + result[i].AccDesc + '</b></td><td   id="Col3_' + slno + '" style="text-align:right;width:120px"><b>' + ReplaceNumberWithCommas(DebitAmt) + '</b></td><td id="Col4_' + slno + '" style="text-align:right;width:120px" ><b>' + ReplaceNumberWithCommas(CreditAmt) + '</b></td><td id="Col5_' + slno + '" style="text-align:right;display:none"><b>1</b></td></tr>';
                }
                else  if (result[i].AccDesc == 'Total') {

                    responseText += '<tr style="background-color:#cfd8dc"><td style="width:70px;text-align:center;"><b>' + slno + '</b></td><td style="width:150px"  id="Col1_' + slno + '" ><b>' + result[i].AccCode + '</b></td><td style="width:500px;"   id="Col2_' + slno + '" ><b>' + result[i].AccDesc + '</b></td><td   id="Col3_' + slno + '" style="text-align:right;width:120px"><b>' + ReplaceNumberWithCommas(DebitAmt) + '</b></td><td id="Col4_' + slno + '" style="text-align:right;width:120px" ><b>' + ReplaceNumberWithCommas(CreditAmt) + '</b></td><td id="Col5_' + slno + '" style="text-align:right;display:none"><b>1</b></td></tr>';
                }
                else  if (result[i].AccDesc == 'Grand Total') {

                    responseText += '<tr style="background-color:#cfd8dc"><td style="width:70px;text-align:center;"><b>' + slno + '</b></td><td style="width:150px"  id="Col1_' + slno + '" ><b>' + result[i].AccCode + '</b></td><td style="width:500px;"   id="Col2_' + slno + '" ><b>' + result[i].AccDesc + '</b></td><td   id="Col3_' + slno + '" style="text-align:right;width:120px"><b>' + ReplaceNumberWithCommas(DebitAmt) + '</b></td><td id="Col4_' + slno + '" style="text-align:right;width:120px" ><b>' + ReplaceNumberWithCommas(CreditAmt) + '</b></td><td id="Col5_' + slno + '" style="text-align:right;display:none"><b>1</b></td></tr>';
                }
                else {
                    responseText += '<tr><td style="text-align:center">' + slno + '</td><td style="width:70px;"   id="Col1_' + slno + '"  style="width:150px" >' + result[i].AccCode + '</td><td   id="Col2_' + slno + '" style="width:500px" >' + result[i].AccDesc + '</td><td   id="Col3_' + slno + '" style="text-align:right;width:120px">' + ReplaceNumberWithCommas(DebitAmt) + '</td><td id="Col4_' + slno + '" style="text-align:right;width:120px">' + ReplaceNumberWithCommas(CreditAmt) + '</td><td id="Col5_' + slno + '" style="text-align:right;display:none"><b>0</b></td></tr>';
                }
            }
        }


        $('#Stocklist').html(responseText + '</tbody>');
        datatablesearch('Stocklist', 'Multiple');
        $('#headiddetialls').text('Customer Outstanding Statement');
        $('#div1').animate({ scrollTop: 0 });
        $('#iconForm').show();
        $('#LoadingSmallRound').hide();


    }



    function GetCurrentJob(Type)
    {

        $('#LoadingSmallRound').show();
        
        var data = {};
        data.FromDate = $('#fromdate').val();
        data.ToDate = $('#todate').val(); 
        data.Type = Type;
        $.ajax({
            type: "POST",
            url: "../Projectandjob/ProjectJobDashboard",
            data: data,
            success: function (result) {
                disable_datatable('Stocklist');
                $('#Stocklist tr').remove();
                $('#LoadingSmallRound').hide();
                $('#iconForm').show();
                if(Type=='Created')
                {
                    $('#headiddetialls').text('Current Jobs');
                }
                else
                {
                    $('#headiddetialls').text('Pending Jobs');
                }
                ShowSalesreport(result);
            }
        });

    }


    function ShowSalesreport(result) {

        var responseText = "";

        var responseText = "<thead>"+
          "<tr><th style='text-align:center;'>Sl#</th><th>Job Code</th><th>Description</th><th>Customer</th><th>Salesman</th><th>Est.Amount</th><th>LPO#</th><th>Status</th></tr>" +
         "<tr><th> </th><th>Job Code</th><th>Description</th><th>Customer</th><th>Salesman</th><th> </th><th>LPO#</th><th>Status</th></tr></thead><tbody>";

        if (result.length != 0) {
            var crsale = 0; var drsale = 0; var retval = 0;
            for (var i = 0; i < result.length; i++) {
                var slno = parseInt(i + 1);
                responseText += '<tr><td>' + slno + '</td><td>' + result[i].JobCode + '</td><td>' + result[i].JobDescription + '</td><td>' + result[i].Customer + '</td><td>' + result[i].Salesman + '</td><td style=text-align:right>' + parseFloat(result[i].EstAmount || 0).toFixed(Decimal) + '</td><td>' + result[i].LPO + '</td><td>' + result[i].Status + '</td></tr>';
            }
           
        }
       
        $('#salesdetails').show();
       
        $('#Stocklist').html(responseText + '</tbody>');
        datatableWithsearch('Stocklist', 'Multiple');
        $('#div1').animate({ scrollTop: 0 });
        $('#LoadingSmallRound').hide();
    }
    
    function calcPJ()
    {
        var data1 = {};
        data1.FromDate = $('#fromdate').val();
        data1.ToDate = $('#todate').val(); 

        $.ajax({
            type: "POST",
            url: "../Projectandjob/ProjectJobDasboardWidgets",
            data: data1,
            success: function (result) {
                if(result.oList.length>0){
                   
                    $('#CurrentJobs').text(ReplaceNumberWithCommas(parseInt(result.oList[0].Created)||0));
                    $('#PendingJobs').text(ReplaceNumberWithCommas(parseInt(result.oList[0].Pending)||0));
                }
            }
        });
    }
   
    function datatableWithsearch(tablename, Type) {

        var a = '#' + tablename + ' tr:eq(1) th'

        $(a).each(function () {
            var title = $(this).text();
            if (title != ' ')
                if (title == 'Date' || title == 'Currency' || title == 'OrderNo' || title == 'SerialNo' || title == 'InvoiceNo') {
                    $(this).html('<input type="text" class="form-control"  style="width:120px"  placeholder="' + title + '"/>')
                }
                else {
                    $(this).html('<input type="text" class="form-control"   placeholder="' + title + '"/>')
                }
        });

        var table = null;

        if (Type == 'Single') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                orderCellsTop: true,
                //"order": false,
            });

        }
        else if (Type == 'Multiple') {

            table = $('#' + tablename).DataTable({
                dom: 'tir',
                orderCellsTop: true,
                "order": [],
                "pageLength": -1
            });


        }
        else if (Type == 'MultiplePurchaseT') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "10%", "targets": 0 },
                    { "width": "15%", "targets": 2 },
                ],
                orderCellsTop: true,
                "order": [],
                //  "pageLength": -1,
                autoWidth: false
            });
            
        }
        else if (Type == 'MultiplePurchaseOrderT') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "5%", "targets": 0 },
                    { "width": "5%", "targets": 1 },
                    { "width": "30%", "targets": 2 },
                    { "width": "10%", "targets": 3 },
                    { "width": "10%", "targets": 4 },
                    { "width": "15%", "targets": 5 },
                    { "width": "15%", "targets": 6 },
                    { "width": "15%", "targets": 7 },
                    { "width": "15%", "targets": 8 },
                ],
                orderCellsTop: true,
                "order": [],
                //  "pageLength": -1,
                autoWidth: false
            });

        }
        else if (Type == 'MultipleSalesT') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "5%", "targets": 0 },
                    { "width": "3%", "targets": 1 },
                    { "width": "30%", "targets": 2 },
                    { "width": "40%", "targets": 3 },
                    { "width": "5%", "targets": 4 },
                    { "width": "10%", "targets": 5 },
                    { "width": "5%", "targets": 6 },
                    { "width": "5%", "targets": 7 },
                    { "width": "5%", "targets": 8 },
                ],
                orderCellsTop: true,
                "order": [],
                // "pageLength": -1
            });


        }

        else if (Type == 'MultipleAllTransaction') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "10%", "targets": 5 },
                    { "width": "12%", "targets": 6 },
                    { "width": "10%", "targets": 13 },
                ],
                orderCellsTop: true,
                "order": [],
                //"pageLength": -1,
                autoWidth: false
            });

        }
        table.columns().every(function (index) {
            $('#' + tablename + ' thead tr:eq(1) th:eq(' + index + ') input').on('keyup change', function () {
                table.column($(this).parent().index() + ':visible')
                    .search(this.value)
                    .draw();
            });
        });
    }


    function disable_datatable(tablename) {
        $('#Warningpopup').fadeOut();
        if ($.fn.DataTable.isDataTable('#' + tablename)) {
            var table = $('#' + tablename).DataTable();
            table.destroy();
            return;
        }
    }

    function GetSalesbillsCashCredit(Flag)
    {

        $('#LoadingSmallRound').show();
        status = 0;
        var FromDate = $('#fromdate').val();  //CurDate;
        var ToDate = $('#todate').val();  //CurDate;

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

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

                disable_datatable('Stocklist');
                $('#Stocklist tr').remove();
                $('#LoadingSmallRound').hide();
                $('#iconForm').show();
                if(Flag=='Credit'){$('#headiddetialls').text('Total Credit Sales');}
                else if(Flag=='Cash'){$('#headiddetialls').text('Total Cash Sales');}
                ShowSalesreportCreditCash(result,Flag);
            }
        });

    }


    function ShowSalesreportCreditCash(result,Flag) {

        var responseText = "";

        var responseText = "<thead><tr><th style='width:5px;text-align:center;'>Sl#</th><th style='width:10px'>Dept.Code</th><th>Type</th><th style='width:50px'>Bill#</th>" +
         "<th style='width:50px'>Date</th><th style='width:30px'>Account#</th><th style='width:400px'>Customer</th><th style='width:40px'>Pay.</th><th style='width:100px' class='text-right' >SalesValue</th></tr>" +
         "<tr><th >Sl#</th><th>Dept.Code</th><th>Type</th><th>Bill</th><th >Date</th><th style='width:50px'>Account#</th>" +
         "<th >Customer</th><th>Pay.</th><th >SalesValue</th></tr></thead><tbody>";

        if (result.length != 0) {
            var crsale = 0; var drsale = 0; var retval = 0;  var slno=0;
            for (var i = 0; i < result.length; i++) {

                if (result[i].SType == 'SR') {
                    retval = (parseFloat(retval) + parseFloat(result[i].SalesAmount || 0)).toFixed(Decimal);
                }
                if (result[i].PayTerms == 'Credit')
                {
                    drsale = (parseFloat(drsale) + parseFloat(result[i].SalesAmount || 0)).toFixed(Decimal);
                }
                else  if (result[i].PayTerms == 'Cash') {
                    crsale = (parseFloat(crsale) + parseFloat(result[i].SalesAmount || 0)).toFixed(Decimal);
                }
                if(Flag=='Credit'){
                    if (result[i].PayTerms == 'Credit')
                    {

                        slno ++;
                        responseText += '<tr> <td style="width:5px;text-align:center;">' + slno + '</td>' +
                            '<td style="width:10px">' + result[i].DepartmentName + '</td>' +
                            '<td style="width:10px">' + result[i].SType + '</td>' +
                            '<td style="width:50px">' + result[i].Billdescription + '-' + result[i].BillSlNo + '</td>' +
                            '<td style="width:50px">' + result[i].InvDate + '</td>' +
                            '<td style="width:30px">' + result[i].AccCode + '</td>' +
                            '<td style="width:400px">' + result[i].CustoName + '</td>' +
                            '<td style="width:40px">' + result[i].PayTerms + '</td>' +
                            '<td align=right style="width:100px">' + ReplaceNumberWithCommas(parseFloat(result[i].SalesAmount || 0).toFixed(Decimal)) + '</td></tr>';
                    }
                }
                else if(Flag=='Cash'){
                    if (result[i].PayTerms == 'Cash') {
                        slno ++;
                        responseText += '<tr> <td style="width:5px;text-align:center;">' + slno + '</td>' +
                            '<td style="width:10px">' + result[i].DepartmentName + '</td>' +
                            '<td style="width:10px">' + result[i].SType + '</td>' +
                            '<td style="width:50px">' + result[i].Billdescription + '-' + result[i].BillSlNo + '</td>' +
                            '<td style="width:50px">' + result[i].InvDate + '</td>' +
                            '<td style="width:30px">' + result[i].AccCode + '</td>' +
                            '<td style="width:400px">' + result[i].CustoName + '</td>' +
                            '<td style="width:40px">' + result[i].PayTerms + '</td>' +
                            '<td align=right style="width:100px">' + ReplaceNumberWithCommas(parseFloat(result[i].SalesAmount || 0).toFixed(Decimal)) + '</td></tr>';
                    }
                }
            }
            if (Flag == 'Credit')
            {
                slno ++;
                responseText += '<tr> <td style="width:5px;text-align:center;">' + slno + '</td>' +
                    '<td style="width:10px"></td>' +
                    '<td style="width:10px"></td>' +
                    '<td style="width:50px"></td>' +
                    '<td style="width:50px">GrandTotal</td>' +
                    '<td style="width:30px"></td>' +
                    '<td style="width:400px"></td>' +
                    '<td style="width:40px"></td>' +
                    '<td align=right style="width:100px">' + ReplaceNumberWithCommas(parseFloat(drsale|| 0).toFixed(Decimal)) + '</td></tr>';
            }
            else if(Flag=='Cash')
            {
                slno ++;
                responseText += '<tr> <td style="width:5px;text-align:center;">' + slno + '</td>' +
                    '<td style="width:10px"></td>' +
                    '<td style="width:10px"></td>' +
                    '<td style="width:50px"></td>' +
                    '<td style="width:50px">GrandTotal</td>' +
                    '<td style="width:30px"></td>' +
                    '<td style="width:400px"></td>' +
                    '<td style="width:40px"></td>' +
                    '<td align=right style="width:100px">' + ReplaceNumberWithCommas(parseFloat(crsale|| 0).toFixed(Decimal)) + '</td></tr>';
            }
        }
        $('#pcol1').text('');
        $('#pcol2').text('');
        $('#pcol3').text('');
        $('#pcol0').text('');
        $('#salesdetails').show();

        $('#pcol0').show(); $('#pcol1').show(); $('#pcol2').show(); $('#pcol3').show();
        $('#pcol0').append('Total Sales : ' + $('#totsales').text() + '&emsp;&emsp;&emsp;');
        $('#pcol1').append('Total Cash Sale : ' + ReplaceNumberWithCommas(parseFloat(crsale|| 0).toFixed(Decimal)) + '&emsp;&emsp;&emsp;');
        $('#pcol2').append('Total Credit Sale : ' + ReplaceNumberWithCommas(parseFloat(drsale || 0).toFixed(Decimal)) + '&emsp;&emsp;&emsp;');
        $('#pcol3').append('Total SalesReurn : ' + ReplaceNumberWithCommas(parseFloat(retval || 0).toFixed(Decimal)));
        $('#Stocklist').html(responseText + '</tbody>');
        datatablesearch('Stocklist', 'Multiple');
        $('#div1').animate({ scrollTop: 0 });
        $('#LoadingSmallRound').hide();

    }



    function DepartmentWiseSalesDashboard(GrType) {

        var data = {};
        data.Fromdate = $('#fromdate').val();   //CurDate;
        data.Todate =   $('#todate').val(); // CurDate;
        data.UserId = ERPUserId;

        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/DepartmentWiseSalesDashboard1",
            data: data,
            success: function (result) {
                DepartmentwiseSalesGraph(result, GrType);
            }
        });




        //    //var datamnt = {};
        //    //datamnt.Fromdate = $('#fromdate').val();  //CurDate;
        //    //datamnt.Todate = $('#todate').val(); // CurDate;
        //    //datamnt.UserId = ERPUserId;
        //    //$.ajax({
        //    //    type: "POST",
        //    //    url: "../Purchaseandsalesreports/SalesmanwisePeriodReport",
        //    //    data: datamnt,
        //    //    success: function (result) {
        //    //        SalesmanwiseSalesGraphPeriod(result, GrType);
        //    //    }
        //    //});


        calcTotSales();

        calcTotStockValue();


    }


    function calcTotSales()
    {
        var data1 = {};
        data1.Fromdate = $('#fromdate').val(); //CurDate;
        data1.Todate = $('#todate').val();   //CurDate;
        data1.DeptId = ERPDeptId;
        data1.UserId = ERPUserId;



        // totoutstand, ,


        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/DashboardGetandGetsElectronics",
            data: data1,
            success: function (result) {
                $('#totsales').text(ReplaceNumberWithCommas(parseFloat((result[0].TotalAmount)||0).toFixed(Decimal)));
                $('#totoutstand').text(ReplaceNumberWithCommas(parseFloat((result[0].totalTax) || 0).toFixed(Decimal)));
                //$('#totstock').text(ReplaceNumberWithCommas(parseFloat((result[0].Cost) || 0).toFixed(0)));
                $('#totalexp').text(ReplaceNumberWithCommas(parseFloat((result[0].Earning || 0)).toFixed(Decimal)));
                $('#creditsales').text(ReplaceNumberWithCommas(parseFloat((result[0].CreditSales || 0)).toFixed(Decimal)));
                $('#cashsales').text(ReplaceNumberWithCommas(parseFloat((result[0].CashSales || 0)).toFixed(Decimal)));
            }
        });
    }


    function calcTotStockValue()
    {
        var data1 = {};

        data1.Todate = $('#todate').val();   //CurDate;
        data1.UserId = ERPUserId;

        // totoutstand, ,

        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/TotalStock",
            data: data1,
            success: function (result) {
                $('#totstock').text(ReplaceNumberWithCommas(parseFloat((result[0].Cost) || 0).toFixed(Decimal)));
            }
        });
    }




    function GraphReport(GrType)
    {
        var data1 = {};
        data1.Fromdate = $('#fromdate').val(); // CurDate;
        data1.Todate = $('#todate').val(); //CurDate;
        data1.Paytype = 0;
        data1.SalesmanId = 0;
        data1.DeptId = 0;
        data1.Userid = ERPUserId;
        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/SalesmanwiseGraphReport",
            data: data1,
            success: function (result) {
                DepartmentWiseSalesDashboard('column');
                ShowReportShort(result, GrType);
            }
        });
    }

    function loadgraph()
    {
        if ($('#customRadioInline1').prop('checked'))
        {
            SalesmanwiseGraphReport('column');
        }
        else if ($('#customRadioInline2').prop('checked')) {
            SalesmanwiseGraphReport('line');
        }
        else if ($('#customRadioInline3').prop('checked')) {
            GraphReport('container');
        }
        else if ($('#customRadioInline4').prop('checked')) {
            GraphReport('container2');
        }

        calcPJ();
        GetProjectJob($('#PJStatus').val());

    }



    function ShowReportShort(result, GrType) {
        var Amount = [];
        var SalesMan = [];
        var GrData = [];
        for (var i = 0; i < result.length; i++) {
            Amount.push(parseFloat(result[i].Amount || 0));
            SalesMan.push('Salesman:' + result[i].SalesMan);
            GrData.push({ name: result[i].SalesMan, y: parseFloat(result[i].Amount || 0) })
        }
        //For PI Chart
        Highcharts.chart('container', {
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false,
                type: 'pie'
            },
            title: {
                text: 'Salesmanwise Sales-PI Chart'
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
            },
            colors: [
                   '#FF4758',
                   '#08B46B',
                   '#19B6D4',
                    '#FF8558',
                   '#ec407a',
                   '#9c27b0',
                    '#1a237e',
                    '#3e2723',
                    '#e91e63',
                    '#9c27b0',
                    '#03a9f4',
                    '#4caf50',
                    '#795548',
                    '#9e9e9e',
            ],
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: false
                    },
                    //showInLegend: true,

                }
            },

            series: [{
                name: 'Sales',
                colorByPoint: true,
                data: GrData
            }]
        });

        Highcharts.chart('container2', {
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: 0,
                plotShadow: false,
                type: 'pie',
            },
            title: {
                text: 'Salesmanwise Sales-Half PI Chart'
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
            },
            colors: [
                  '#FF4758',
                   '#08B46B',
                   '#19B6D4',
                    '#FF8558',
                   '#ec407a',
                   '#9c27b0',
                    '#1a237e',
                    '#3e2723',
                    '#e91e63',
                    '#9c27b0',
                    '#03a9f4',
                    '#4caf50',
                    '#795548',
                    '#9e9e9e',
            ],
            plotOptions: {
                pie: {
                    dataLabels: {
                        enabled: true,
                        distance: -50,
                        style: {
                            fontWeight: 'bold',
                            color: 'white'
                        }
                    },
                    startAngle: -90,
                    endAngle: 90,
                    center: ['50%', '75%'],
                }
            },
            series: [{
                name: 'Sales',
                innerSize: '50%',
                colorByPoint: true,
                data: GrData

            }]
        });



    }

    function GetFormattedDate(datetoformat) {
        var todayTime = new Date(datetoformat);
        var month = todayTime.getMonth() + 1;
        var day = todayTime.getDate();
        var year = todayTime.getFullYear();

        if (day < 10)
            day = '0' + day
        if (month < 10)
            month = '0' + month

        return day + "/" + month + "/" + year;
    }

    //Date Picker
    $(function () {
        $('#fromdate,#todate').daterangepicker({
            minDate: minDate,
            maxDate: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()),
            singleDatePicker: true,
            showDropdowns: true,
            locale: {
                format: 'DD/MM/YYYY'
            }
        });
        $('#PJfromdate,#PJtodate').daterangepicker({
            minDate: minDate,
            maxDate: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()),
            singleDatePicker: true,
            showDropdowns: true,
            locale: {
                format: 'DD/MM/YYYY'
            }
        });
        
        $('#From,#To').daterangepicker({
            minDate: minDate,
            maxDate: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()),
            singleDatePicker: true,
            showDropdowns: true,
            locale: {
                format: 'DD/MM/YYYY'
            }
        });
    });

    function SalesmanwiseGraphReport(Grtype) {
        if ($('#Datetype').val() == 0) {

            var datamnt = {};
            datamnt.Fromdate = $('#fromdate').val(); // CurDate;
            datamnt.Todate = $('#todate').val(); //CurDate;
            datamnt.UserId = ERPUserId;
            $.ajax({
                type: "POST",
                url: "../Purchaseandsalesreports/SalesmanwisePeriodReport",
                data: datamnt,
                success: function (result) {
                    DepartmentWiseSalesDashboard('column');
                    SalesmanwiseSalesGraphPeriod(result, Grtype);
                }
            });
        }
        else if ($('#Datetype').val() == 1) {
            var datamnt = {};
            datamnt.Fromdate = $('#fromdate').val();  //CurDate;
            datamnt.Todate = $('#todate').val();//CurDate;
            datamnt.DeptId = 0;
            datamnt.UserId = ERPUserId;
            $.ajax({
                type: "POST",
                url: "../Purchaseandsalesreports/SalesmanDashboard",
                data: datamnt,
                success: function (result) {
                    DepartmentWiseSalesDashboard('column');
                    SalesmanwiseSalesGraph(result, Grtype);
                }
            });
        }
        else if ($('#Datetype').val() == 2) {

            var XFromDate=CurDate.split('/');
            var XXFromDate=XFromDate[2]+'-'+XFromDate[1]+'-'+XFromDate[0];


            var prevSat = new Date(XXFromDate);
            prevSat.setDate(prevSat.getDate() - (prevSat.getDay() + 8) % 7);
            var FormatedDate=GetFormattedDate(prevSat);


            var datamnt = {};
            datamnt.Fromdate =  FormatedDate;                                    //'01/' + mmmonth + '/' + hhh.getFullYear();
            datamnt.Todate = CurDate;                               //'31/12/' + hhh.getFullYear();
            datamnt.DeptId = 0;
            datamnt.UserId = ERPUserId;
            $.ajax({
                type: "POST",
                url: "../Purchaseandsalesreports/SalesmanWeeklyDashboard",
                data: datamnt,
                success: function (result) {
                    $('#fromdate').val(datamnt.Fromdate);
                    $('#todate').val(datamnt.Todate);
                    DepartmentWiseSalesDashboard('column');
                    SalesmanwiseSalesGraphWeek(result, Grtype);
                }
            });
        }
        else if ($('#Datetype').val() == 3) {

            var XFromDate=CurDate.split('/');

            var datamnt = {};
            datamnt.Fromdate = '01/' +XFromDate[1] +'/'+ +XFromDate[2];           //'01/01/' + hhh.getFullYear();
            datamnt.Todate = CurDate;                                             //'31/12/' + hhh.getFullYear();
            datamnt.DeptId = 0;
            datamnt.UserId = ERPUserId;

            $.ajax({
                type: "POST",
                url: "../Purchaseandsalesreports/SalesmanMonthlyDashboard",
                data: datamnt,
                success: function (result) {
                    $('#fromdate').val(datamnt.Fromdate);
                    $('#todate').val(datamnt.Todate);
                    DepartmentWiseSalesDashboard('column');
                    SalesmanwiseSalesGraphMonth(result, Grtype);
                }
            });
        }
        else if ($('#Datetype').val() == 4) {

            var datamnt = {};
            datamnt.Fromdate = '01/01/' + hhh.getFullYear();
            datamnt.Todate = CurDate;
            datamnt.DeptId = 0;
            datamnt.UserId = ERPUserId;

            $.ajax({
                type: "POST",
                url: "../Purchaseandsalesreports/SalesmanYearlyDashboard",
                data: datamnt,
                success: function (result) {
                    $('#fromdate').val(datamnt.Fromdate);
                    $('#todate').val(datamnt.Todate);
                    DepartmentWiseSalesDashboard('column');
                    SalesmanwiseSalesGraphYear(result, Grtype);
                }
            });
        }
    }




    //for SalesmanwiseSales

    function SalesmanwiseSalesGraph(result, Grtype) {

        var Amount = [];
        var SalesMan = [];
        var GrData = [];
        var Date = [];
        for (var i = 0; i < result.length; i++) {
            var shodatesplit = result[i].Fromdate.split("/");
            var ShowDate = shodatesplit[0] + '/' + shodatesplit[1];
            Amount.push(parseFloat(result[i].Amount || 0));
            SalesMan.push(result[i].SalesMan);
            Date.push(ShowDate)
            GrData.push({ name: result[i].SalesMan, y: parseFloat(result[i].Amount || 0) })
        }


        Highcharts.chart('Sales', {
            chart: { type: Grtype },
            title: {
                text: 'Salesman Wise Daily - ' + monthNames[hhh.getMonth()] + ',' + hhh.getFullYear()
            },
            subtitle: {
                text: 'Source: eumierp.com'
            },
            xAxis: {
                categories: Date
            },
            yAxis: {
                title: {
                    text: 'Sales()'
                }
            },
            colors: [
                        '#FF4758',
                   '#08B46B',
                   '#19B6D4',
                    '#FF8558',
                   '#ec407a',
                   '#9c27b0',
                    '#1a237e',
                    '#3e2723',
                    '#e91e63',
                    '#9c27b0',
                    '#03a9f4',
                    '#4caf50',
                    '#795548',
                    '#9e9e9e',
            ],
            plotOptions: {
                column: {
                    colorByPoint: true,
                },
                line: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: false
                }
            },
            series: [
            {
                name: 'Sales',
                data: GrData
            },
            ]
        });


    }

    function SalesmanwiseSalesGraphWeek(result, Grtype) {

        var Amount = [];
        var SalesMan = [];
        var GrData = [];
        var Date = [];
        for (var i = 0; i < result.length; i++) {
            Amount.push(parseFloat(result[i].Amount || 0));
            SalesMan.push(result[i].SalesMan);
            Date.push(result[i].Fromdate);
            GrData.push({ name: result[i].SalesMan, y: parseFloat(result[i].Amount || 0) })
        }


        Highcharts.chart('Sales', {
            chart: { type: Grtype },
            title: {
                text: 'Salesman Wise Weekly - ' + monthNames[hhh.getMonth()] + ',' + hhh.getFullYear()
            },
            subtitle: {
                text: 'Source: eumierp.com'
            },
            xAxis: {
                categories: Date
            },
            yAxis: {
                title: {
                    text: 'Sales()'
                }
            },
            colors: [
                    '#FF4758',
                   '#08B46B',
                   '#19B6D4',
                    '#FF8558',
                   '#ec407a',
                   '#9c27b0',
                    '#1a237e',
                    '#3e2723',
                    '#e91e63',
                    '#9c27b0',
                    '#03a9f4',
                    '#4caf50',
                    '#795548',
                    '#9e9e9e',
            ],
            plotOptions: {
                column: {
                    colorByPoint: true,
                },
                line: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: false
                }
            },
            series: [
            {
                name: 'Sales',
                data: GrData
            },
            ]
        });


    }

    function SalesmanwiseSalesGraphMonth(result, Grtype) {

        var Amount = [];
        var SalesMan = [];
        var GrData = [];
        var Date = [];
        for (var i = 0; i < result.length; i++) {
            Amount.push(parseFloat(result[i].Amount || 0));
            SalesMan.push(result[i].SalesMan);
            Date.push(monthNames[result[i].Fromdate]);
            GrData.push({ name: result[i].SalesMan, y: parseFloat(result[i].Amount || 0) })
        }


        Highcharts.chart('Sales', {
            chart: { type: Grtype },
            title: {
                text: 'Salesman Wise Monthly - ' + hhh.getFullYear()
            },
            subtitle: {
                text: 'Source: eumierp.com'
            },
            xAxis: {
                categories: Date
            },
            yAxis: {
                title: {
                    text: 'Sales()'
                }
            },
            colors: [
                   '#FF4758',
                   '#08B46B',
                   '#19B6D4',
                    '#FF8558',
                   '#ec407a',
                   '#9c27b0',
                    '#1a237e',
                    '#3e2723',
                    '#e91e63',
                    '#9c27b0',
                    '#03a9f4',
                    '#4caf50',
                    '#795548',
                    '#9e9e9e',
            ],
            plotOptions: {
                column: {
                    colorByPoint: true,
                },
                line: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: false
                }
            },
            series: [
            {
                name: 'Sales',
                data: GrData
            },
            ]
        });


    }

    function SalesmanwiseSalesGraphYear(result, Grtype) {

        var Amount = [];
        var SalesMan = [];
        var GrData = [];
        var Date = [];
        for (var i = 0; i < result.length; i++) {
            Amount.push(parseFloat(result[i].Amount || 0));
            SalesMan.push(result[i].SalesMan);
            Date.push(result[i].Fromdate);
            GrData.push({ name: result[i].SalesMan, y: parseFloat(result[i].Amount || 0) })
        }


        Highcharts.chart('Sales', {
            chart: { type: Grtype },
            title: {
                text: 'Salesman Wise Yearly - ' + hhh.getFullYear()
            },
            subtitle: {
                text: 'Source: eumierp.com'
            },
            xAxis: {
                categories: Date
            },
            yAxis: {
                title: {
                    text: 'Sales()'
                }
            },
            colors: [
                    '#FF4758',
                   '#08B46B',
                   '#19B6D4',
                    '#FF8558',
                   '#ec407a',
                   '#9c27b0',
                    '#1a237e',
                    '#3e2723',
                    '#e91e63',
                    '#9c27b0',
                    '#03a9f4',
                    '#4caf50',
                    '#795548',
                    '#9e9e9e',
            ],
            plotOptions: {
                column: {
                    colorByPoint: true,
                },
                line: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: false
                }
            },
            series: [
            {
                name: 'Sales',
                data: GrData
            },
            ]
        });


    }
    function SalesmanwiseSalesGraphPeriod(result, Grtype) {

        var Amount = [];
        var SalesMan = [];
        var GrData = [];
        for (var i = 0; i < result.length; i++) {
            Amount.push(parseFloat(result[i].Amount || 0));
            SalesMan.push(result[i].SalesMan);
            GrData.push({ name: result[i].SalesMan, y: parseFloat(result[i].Amount || 0) })
        }


        Highcharts.chart('Sales', {
            chart: { type: Grtype },
            title: {
                text: 'Salesman Wise Period - ' + hhh.getFullYear()
            },
            subtitle: {
                text: 'Source: eumierp.com'
            },
            xAxis: {
                categories: SalesMan
            },
            yAxis: {
                title: {
                    text: 'Sales()'
                }
            },
            colors: [
                   '#FF4758',
                   '#08B46B',
                   '#19B6D4',
                    '#FF8558',
                   '#ec407a',
                   '#9c27b0',
                    '#1a237e',
                    '#3e2723',
                    '#e91e63',
                    '#9c27b0',
                    '#03a9f4',
                    '#4caf50',
                    '#795548',
                    '#9e9e9e',
            ],
            plotOptions: {
                column: {
                    colorByPoint: true,
                },
                line: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: false
                }
            },
            series: [
            {
                name: 'Sales',
                data: GrData
            },
            ]
        });


    }


    //for DepartmentwiseSales
    function DepartmentwiseSalesGraph(result, GrType) {
        var Amount = [];
        var GrData = [];
        var Department = [];

        for (var i = 0; i < result.length; i++) {
            Amount.push(parseFloat(result[i].Amount || 0));
            Department.push(result[i].Department);
            GrData.push({ name: result[i].Department, y: parseFloat(result[i].Amount || 0) })
        }
        //PI CHAT
        Highcharts.chart('container1', {
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false,
                type: 'pie'
            },
            title: {
                text: 'Department wise Sales'
            },
            tooltip: {
                pointFormat: '{series.name}: <b>({point.y})  {point.percentage:.1f}% </b>'
            },
            colors: [
                      '#0099e6',    //Blue
                      '#FF8F00',     //Orange
                      '#3e2723',
                      '#9c27b0',
                      '#1a237e',  //dark blue
                      '#FF8558',   //light orange
                      '#ec407a',   //Light Majanta
                      '#FF4758',
                      '#08B46B'     //Green
                      //'#FF4758',
                      //'#08B46B',
                      //'#19B6D4',
                      // '#FF8558',
                      //'#ec407a',
                      //'#9c27b0',
                      // '#1a237e',
                      // '#3e2723'
            ],
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: false
                    },
                    showInLegend: true
                }
            },
            series: [{
                name: 'Sales',
                colorByPoint: true,
                data: GrData
            }]
        });
    }



    function ShowUserslist(result) {
        for (var i = 0; i < result.length; i++) {
            var userid = result[i].UserId;
            var Data = '<div class="media mb-1"><a><img class="rounded-circle" height="45" width="45" src="../ProjectImages/User/Image/' + userid + '.png" alt=""  ></a><div class="media-body"><h4 class="font-medium-1 mt-1 mb-0">' + result[i].Name + '</h4><p class="text-muted font-small-3">User</p></div><div class="mt-1"><input type="checkbox" class="" checked id=""></div></div></div>'
            $('#userlist').append(Data)
        }
    }



    function ShowTopSalesreport(result) {
        var responseText = "<thead><tr><th align=left>Product</th><th align=center>Quantity</th></tr></thead>  <tbody>";
        for (var i = 0; i < result.length; i++) {

            if (result[i].ItemDesc != 'Grand Total')
                responseText += '<tr><td align=left>' + result[i].ItemCode + ' - ' + result[i].ItemDesc + '</td><td align=center>' + result[i].Qty + '</td></tr>';
        }
        $('#topnsales').html(responseText + '</tbody>');
    }


    //function ShowOrderBouncing(result) {
    //    var responseText = "<thead><tr><th align=center>Sl#</th><th>Customer</th><th>Item Code</th><th>Item Name</th><th>Remarks</th><th align=center>Qty.</th><th>User Name</th></tr></thead><tbody>";
    //    for (var i = 0; i < result.length; i++) {

    //        responseText += '<tr><td align=center>' + (i+1) + '</td><td>' + result[i].Customer + '</td><td>' + result[i].ItemCode + '</td><td>' + result[i].ItemName + '</td><td>' + result[i].Remarks + '</td><td align=center>' + result[i].Quantity + '</td><td>' + result[i].User + '</td></tr>';
    //    }
    //    $('#orderbouncing').html(responseText + '</tbody>');
    //    $('#LoadingOrderBouncing').hide();
    //}

    transferload();

    function transferload() {
        var data = {};
        data.LocId = 0;
        $.ajax({
            type: "POST",
            url: "../LocationTransfer/OrderBouncingGetandGets",
            data: data,
            success: function (result) {
                // disable_datatable('tblOrderBouncing');
                ShowOrderBouncinglist(result.oList);
            }
        });
    }

    function ShowOrderBouncinglist(result) {
        disable_datatable('orderbouncing');
        var responseText = "";

        if (result.length == 0) {
            var responseText = "<thead><tr style='text-align:center;color:red'><th>NO TRANSFER REQUEST YET</th></tr></thead>";
            $('#orderbouncing').html(responseText);
        }
        else {
            responseText += "<thead><tr><th style='width:5px;'>Slno</th><th>Approve/Remove</th><th>Date</th><th>Item Code</th><th>Description</th><th>Quantity</th><th>Remarks</th></tr>"+
                "<tr><th> </th><th> </th><th>Date</th><th>Item Code</th><th>Description</th><th> </th><th>Remarks</th></tr></thead><tbody>";
            for (var i = 0; i < result.length; i++) {
                var slno = i + 1;
                responseText += '<tr ondblclick=PendingPurchasespopup('+result[i].ProductId+ ')><td style="width:5px">' + slno + '</td>'+
                    '<td id=' + 'Approved' + slno + '  class= "jsgrid-cell jsgrid-control-field jsgrid-align-left"  style="width:3.0%;">&nbsp; <button type="button" title=Approve class="badge badge-default round  btn-success" id="accept" style="font-weight:normal;color:white;border:none;" onclick="approved(' + result[i].ProductId + ',' + 1 + ',' + result[i].BillSeriesId + ')">Approve</button> ' +
                    '&nbsp;<button type="button" title= Reject  class="badge badge-default round  btn-warning" id="delete" style="font-weight:normal;color:white;border:none;"  onclick="approved(' + result[i].ProductId + ',' + 2 + ',' + result[i].BillSeriesId + ')">Remove</button> </td><td>' + result[i].CurrentDate + '</td><td id=' + "Icode" + result[i].ProductId + '>' + result[i].ProductCode + '</td><td id=' + "IDesc" + result[i].ProductId + '>' + result[i].ProductDescr + '</td><td>' + result[i].ProdQty + '</td><td>' + result[i].Remarks + '</td>' +
              '</tr>';

            }
            $('#orderbouncing').html(responseText + '</tbody>');
            datatableWithsearchNew('orderbouncing', 'Multiple');
        }
    }
    function Showalerts(Status) {
        if (Status == 1) {
            //formrefresh();
            swal('Data Accepted Successfully', "", "success");
            $('.swal-button swal-button--confirm').focus();
            transferload();
        }
        else if (Status == 2) {
            // formrefresh();
            swal('Data Rejected Successfully', "", "success");
            $('.swal-button swal-button--confirm').focus();
            transferload();
        }

    }
    function approved(ItemId,Flag,BillSeriesId)
    {
        var data={};
        data.ProductId = ItemId;
        data.DelFlag = Flag;
        data.BillSeriesId = BillSeriesId;
        $.ajax({
            type: "POST",
            url: "../LocationTransfer/ApproveOrderBouncing",
            data: data,
            success: function (result) {
                var status = result.oList[0].Status;
                Showalerts(status);
            }
        })

    }


    $(function () {
        $("#customRadioInline1").click(function (e) {
            $('#pi').hide();
            $('#halfpi').hide();
            $('#Sales').show();
            $('#Loading').hide();
        });
        $("#customRadioInline2").click(function (e) {
            $('#pi').hide();
            $('#halfpi').hide();
            $('#Sales').show();
            $('#Loading').hide();
        });
        $("#customRadioInline3").click(function (e) {
            $('#pi').show();
            $('#halfpi').hide();
            $('#Sales').hide();
            $('#Loading').hide();
        });
        $("#customRadioInline4").click(function (e) {
            $('#halfpi').show();
            $('#pi').hide();
            $('#Sales').hide();
            $('#Loading').hide();
        });

    });

    setrefreshtime($('#refreshtime').val());
    var refreshIntervalId;
    function refreshtimechange(){
        clearInterval(refreshIntervalId);

        var SetRefreshT=$('#refreshtime').val();
        setrefreshtime(SetRefreshT);
    }

    function setrefreshtime(SetRefreshT){

        refreshIntervalId =setInterval(function () {

            calcTotSales();
            calcTotStockValue();
            //SalesmanwiseGraphReport('column')
            loadgraph();
            SalesPerformance('loess');
            $("#SalesPerf1").prop("checked",true);
            //$('#customRadioInline1').prop("checked",true);

        }, SetRefreshT);

    }

    function GetNonMovingItems(Num) {
        $('#LoadingNonmoving').show();
        var data1 = {};
        data1.Qty = parseInt($('#nonQty').val() || 0);
        data1.DateFrom = $('#DateFrom').val();
        data1.DateTo = $('#DateTo').val();
        data1.Number = Num;
        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/NonMovingItemsDashboard",
            data: data1,
            success: function (result) {
                ShowNonMovingreport(result);
            }
        });
    }


    function ShowNonMovingreport(result) {
        var responseText = "<thead><tr><th class='text-center'>Sl#</th><th class='text-left' style=''>Item Code</th><th class='text-left'>Item Name</th><th class='text-right'>Qty.Sold</th><th class='text-right'>Stock</th><th class='text-right'>Cost</th></tr></thead>  <tbody>";
        for (var i = 0; i < result.length; i++) {

            if (result[i].ItemDesc != 'Grand Total')
                responseText += '<tr><td class="text-center">' + (i + 1) + '</td><td class="text-left">' + result[i].ItemCode + ' </td><td class="text-left"> ' + result[i].ItemDesc + '</td><td class="text-right">' + result[i].Qty + '</td><td class="text-right">' + result[i].Stock + '</td><td class="text-right">' + ReplaceNumberWithCommas(parseFloat(result[i].AvgCost || 0).toFixed(Decimal)) + '</td></tr>';
        }
        $('#nonmovingsales').html(responseText + '</tbody>');
        $('#LoadingNonmoving').hide();
    }


    function StockValueReport(){

        $('#LoadingSmallRound').show();
        var data = {};
        data.Condition = "1=1";
        data.Condition1 = "1=1";
        data.ToDate = $('#todate').val();
        data.Type = 0;

        $.ajax({
            type: "POST",
            url: "../Report/DetailedStock",
            data: data,
            success: function (result) {
                disable_datatable('Stocklist');
                $('#Stocklist thead').remove();
                $('#Stocklist tbody').remove();
                $('#Stocklist tfoot').remove();
                $('#LoadingSmallRound').hide();
                $('#iconForm').show();
                $('#headiddetialls').text('Total Stock');
                LoadDetails(result)

            }});
    }


    function LoadDetails(result)
    {

        var responseText = "<thead><tr><th>Sl#</th><th width=500px>Item Code</th><th width=1450px>Item Name</th><th width=10px>Qty.</th><th class='text-right' width=10px>Cost</th><th class='text-right' width=130px>Stock Value</th></tr></thead><tbody>";

        for (var i = 0; i < result.length; i++) {
            if (result[i].ItemDesc != 'Grand Total')
            {

                responseText += "<tr class='jsgrid-row' >" +
         "<td class='text-left'> " + (i + 1) + " </td>" +
         "<td id='Col1_" + i + "' class='text-left'>" + result[i].ItemCode + "</td>" +
         "<td id='Col2_" + i + "' class='text-left'>" + result[i].ItemDesc + "</td>" +
         "<td id='Col3_" + i + "' class='text-left'>" + parseInt(result[i].StockQty || 0) + "</td>" +
         "<td id='Col4_" + i + "' class='text-right'>" + parseFloat(result[i].AvgCost || 0).toFixed(Decimal) + "</td>" +
         "<td id='Col5_" + i + "' class='text-right'>" + parseFloat(result[i].StockValue || 0).toFixed(Decimal) + "</td>" +
         "</tr>";
            }

            else
            {
                responseText += "<tr  style=background-color:#cfd8dc  class='jsgrid-row' >" +
                "<td class='text-left'> " + (i + 1) + " </td>" +
                "<td id='Col1_" + i + "' class='text-left'>" + result[i].ItemCode + "</td>" +
                "<td id='Col2_" + i + "' class='text-left'><b>" + result[i].ItemDesc + "</b></td>" +
                "<td id='Col3_" + i + "' class='text-left'><b>" + parseInt(result[i].StockQty || 0) + "</b></td>" +
                "<td id='Col4_" + i + "' class='text-right'>" + result[i].AvgCost + "</td>" +
                "<td id='Col5_" + i + "' class='text-right'><b>" + parseFloat(result[i].StockValue || 0).toFixed(Decimal) + "</b></td>" +
     "</tr>";

            }

        }
        $('#LoadingSmallRound').hide();
        $('#iconForm').show();
        $('#Stocklist').append(responseText);

        datatablesearch('Stocklist');


    }

    function SalesPerformance(Grtype) {
        var datamnt = {};
        datamnt.UserId = ERPUserId;
        datamnt.DeptId = ERPDeptId;

        $.ajax({
            type: "POST",
            url: "../Purchaseandsalesreports/SalesPerformanceDashBoard",
            data: datamnt,
            success: function (result) {
                SalesPerformanceGraph(result, Grtype);
            }
        });
    }

    function SalesPerformanceGraph(result, Grtype) {

        var Total = [];
        var MMonth = [];
        var GrData = [];
        var GrDataTest = [];
        var MMonthTest=[];
        for (var i = 0; i < result.length; i++) {
            Total.push(parseFloat(result[i].Total || 0));
            MMonth.push(monthNames[result[i].SalesMan]);
            MMonthTest.push(result[i].SalesMan);
            GrData.push({ x: monthNames[result[i].SalesMan], y: parseFloat(result[i].Total || 0) });
            GrDataTest.push({ x: result[i].SalesMan, y: parseFloat(result[i].Total || 0) })
        }

        $('#SalesPerformance').highcharts({
            chart: {
                type: 'column',
                zoomType: 'xy'
            },
            title: {
                text: 'Sales Performance - ' + hhh.getFullYear()
            },
            xAxis: {
                categories: MMonth,
                title: {
                    enabled: true,
                    text: 'Month'
                },
                startOnTick: true,
                endOnTick: true,
                showLastLabel: true
            },
            yAxis: {

                title: {
                    text: 'Sales'
                }
            },

            series: [{
                regression: true,
                regressionSettings: {
                    type: Grtype,
                    name: '',
                    color: '#660066',
                    dashStyle: 'solid',
                    'stroke-width': 3,
                },
                name: 'Sales',
                color: '#0099cc',
                data: GrDataTest

            }]
        });
    }
    function datatableWithsearchForMainTable(tablename, download, title, tableButtonContainerId) {

        var a = '#' + tablename + ' tr:eq(1) th'

        $(a).each(function () {
            var title = $(this).text();
            if (title != ' ')
                if (title == 'Date' || title == 'Currency' || title == 'OrderNo' || title == 'Sl#' || title == 'InvoiceNo') {
                    $(this).html('<input type="text"  style="width:120px"  placeholder="' + title + '"/>')
                }
                else  if(title == 'Status')
                    $(this).html('<input type="text" style="width:100%"   placeholder="' + title + '"/>')
                else {
                    $(this).html('<input type="text"   placeholder="' + title + '"/>')
                }
        });
        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>>" +
               "<'row'<'col-sm-12'tr>>" +
               "<'row'<'col-sm-1'i><'col-sm-11'p>>",
                orderCellsTop: true,
                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();
           
        }
        if (tablename == 'productlist') {
            $("#MainRow_1").click();
        }
        table.columns().every(function (index) {
            $('#' + tablename + ' thead tr:eq(1) th:eq(' + index + ') input').on('keyup change', function () {
                table.column($(this).parent().index() + ':visible')
                    .search(this.value)
                    .draw();
            });
        });

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

    function datatableWithsearchNew(tablename, Type) {

        var a = '#' + tablename + ' tr:eq(1) th'

        $(a).each(function () {
            var title = $(this).text();
            if (title != ' ')
                if (title == 'Date' || title == 'Currency' || title == 'OrderNo' || title == 'SerialNo' || title == 'InvoiceNo') {
                    $(this).html('<input type="text" class="form-control"  style="width:120px"  placeholder="' + title + '"/>')
                }
                else {
                    $(this).html('<input type="text" class="form-control"   placeholder="' + title + '"/>')
                }
        });

        var table = null;

        if (Type == 'Single') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                orderCellsTop: true,
                //"order": false,
            });

        }
        else if (Type == 'Multiple') {

            table = $('#' + tablename).DataTable({
                dom: 'tir',
                orderCellsTop: true,
                "order": [],
                "pageLength": -1
            });


        }
        else if (Type == 'MultiplePurchaseT') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "10%", "targets": 0 },
                    { "width": "15%", "targets": 2 },
                ],
                orderCellsTop: true,
                "order": [],
                //  "pageLength": -1,
                autoWidth: false
            });

        }
        else if (Type == 'MultiplePurchaseOrderT') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "5%", "targets": 0 },
                    { "width": "5%", "targets": 1 },
                    { "width": "30%", "targets": 2 },
                    { "width": "10%", "targets": 3 },
                    { "width": "10%", "targets": 4 },
                    { "width": "15%", "targets": 5 },
                    { "width": "15%", "targets": 6 },
                    { "width": "15%", "targets": 7 },
                    { "width": "15%", "targets": 8 },
                ],
                orderCellsTop: true,
                "order": [],
                //  "pageLength": -1,
                autoWidth: false
            });

        }
        else if (Type == 'MultipleSalesT') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "5%", "targets": 0 },
                    { "width": "3%", "targets": 1 },
                    { "width": "30%", "targets": 2 },
                    { "width": "40%", "targets": 3 },
                    { "width": "5%", "targets": 4 },
                    { "width": "10%", "targets": 5 },
                    { "width": "5%", "targets": 6 },
                    { "width": "5%", "targets": 7 },
                    { "width": "5%", "targets": 8 },
                ],
                orderCellsTop: true,
                "order": [],
                // "pageLength": -1
            });


        }

        else if (Type == 'MultipleAllTransaction') {

            table = $('#' + tablename).DataTable({
                dom: 'tipr',
                "columnDefs": [
                    { "width": "10%", "targets": 5 },
                    { "width": "12%", "targets": 6 },
                    { "width": "10%", "targets": 13 },
                ],
                orderCellsTop: true,
                "order": [],
                //"pageLength": -1,
                autoWidth: false
            });

        }
        table.columns().every(function (index) {
            $('#' + tablename + ' thead tr:eq(1) th:eq(' + index + ') input').on('keyup change', function () {
                table.column($(this).parent().index() + ':visible')
                    .search(this.value)
                    .draw();
            });
        });
    }


    function disable_datatable(tablename) {
        $('#Warningpopup').fadeOut();
        if ($.fn.DataTable.isDataTable('#' + tablename)) {
            var table = $('#' + tablename).DataTable();
            table.destroy();
            return;
        }
    }
</script>



@*<div class="content-wrapper">
  
    <!--Statistics cards Starts-->
    <div class="row">
        <div class="col-xl-3 col-lg-6 col-md-6 col-12">
            <div class="card gradient-blackberry">
                <div class="card-body">
                    <div class="card-block pt-2 pb-0">
                        <div class="media">
                            <div class="media-body white text-left">
                                <h3 class="font-large-1 mb-0">$2156</h3>
                                <span>Total Tax</span>
                            </div>
                            <div class="media-right white text-right">
                                <i class="icon-pie-chart font-large-1"></i>
                            </div>
                        </div>
                    </div>
                    <div id="Widget-line-chart" class="height-75 WidgetlineChart WidgetlineChartshadow mb-2">
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-lg-6 col-md-6 col-12">
            <div class="card gradient-ibiza-sunset">
                <div class="card-body">
                    <div class="card-block pt-2 pb-0">
                        <div class="media">
                            <div class="media-body white text-left">
                                <h3 class="font-large-1 mb-0">$1567</h3>
                                <span>Total Cost</span>
                            </div>
                            <div class="media-right white text-right">
                                <i class="icon-bulb font-large-1"></i>
                            </div>
                        </div>
                    </div>
                    <div id="Widget-line-chart1" class="height-75 WidgetlineChart WidgetlineChartshadow mb-2">
                    </div>

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

        <div class="col-xl-3 col-lg-6 col-md-6 col-12">
            <div class="card gradient-green-tea">
                <div class="card-body">
                    <div class="card-block pt-2 pb-0">
                        <div class="media">
                            <div class="media-body white text-left">
                                <h3 class="font-large-1 mb-0">$4566</h3>
                                <span>Total Sales</span>
                            </div>
                            <div class="media-right white text-right">
                                <i class="icon-graph font-large-1"></i>
                            </div>
                        </div>
                    </div>
                    <div id="Widget-line-chart2" class="height-75 WidgetlineChart WidgetlineChartshadow mb-2">
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-lg-6 col-md-6 col-12">
            <div class="card gradient-pomegranate">
                <div class="card-body">
                    <div class="card-block pt-2 pb-0">
                        <div class="media">
                            <div class="media-body white text-left">
                                <h3 class="font-large-1 mb-0">$8695</h3>
                                <span>Total Earning</span>
                            </div>
                            <div class="media-right white text-right">
                                <i class="icon-wallet font-large-1"></i>
                            </div>
                        </div>
                    </div>
                    <div id="Widget-line-chart3" class="height-75 WidgetlineChart WidgetlineChartshadow mb-2">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--Statistics cards Ends-->
    <!--Line with Area Chart 1 Starts-->
    <div class="row">
        <div class="col-sm-9">
            <div class="card">
                <div class="card-body">
                    <div class="card-block">
                        <div id="line-area" class="height-400 lineArea">
                            <div id="Sales" style="min-width: 400px; height: 350px; margin: 0 auto" data-highcharts-chart="0"><div id="highcharts-bg3agvz-0" dir="ltr" class="highcharts-container " style="position: relative; overflow: hidden; width: 1200px; height: 350px; text-align: left; line-height: normal; z-index: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><svg version="1.1" class="highcharts-root" style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Arial, Helvetica, sans-serif;font-size:12px;" xmlns="http://www.w3.org/2000/svg" width="1250" height="350" viewBox="0 0 1033 350"><desc>Created with Highcharts 6.1.1</desc><defs><clipPath id="highcharts-bg3agvz-1"><rect x="0" y="0" width="956" height="201" fill="none"></rect></clipPath></defs><rect fill="#ffffff" class="highcharts-background" x="0" y="0" width="1033" height="350" rx="0" ry="0"></rect><rect fill="none" class="highcharts-plot-background" x="67" y="71" width="956" height="201"></rect><g class="highcharts-grid highcharts-xaxis-grid " data-z-index="1"><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 146.5 71 L 146.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 225.5 71 L 225.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 305.5 71 L 305.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 385.5 71 L 385.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 464.5 71 L 464.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 544.5 71 L 544.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 624.5 71 L 624.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 703.5 71 L 703.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 783.5 71 L 783.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 863.5 71 L 863.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 942.5 71 L 942.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 1022.5 71 L 1022.5 272" opacity="1"></path><path fill="none" data-z-index="1" class="highcharts-grid-line" d="M 66.5 71 L 66.5 272" opacity="1"></path></g><g class="highcharts-grid highcharts-yaxis-grid " data-z-index="1"><path fill="none" stroke="#e6e6e6" stroke-width="1" data-z-index="1" class="highcharts-grid-line" d="M 67 272.5 L 1023 272.5" opacity="1"></path><path fill="none" stroke="#e6e6e6" stroke-width="1" data-z-index="1" class="highcharts-grid-line" d="M 67 205.5 L 1023 205.5" opacity="1"></path><path fill="none" stroke="#e6e6e6" stroke-width="1" data-z-index="1" class="highcharts-grid-line" d="M 67 138.5 L 1023 138.5" opacity="1"></path><path fill="none" stroke="#e6e6e6" stroke-width="1" data-z-index="1" class="highcharts-grid-line" d="M 67 70.5 L 1023 70.5" opacity="1"></path></g><rect fill="none" class="highcharts-plot-border" data-z-index="1" x="67" y="71" width="956" height="201"></rect><g class="highcharts-axis highcharts-xaxis " data-z-index="2"><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 146.5 272 L 146.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 225.5 272 L 225.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 305.5 272 L 305.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 385.5 272 L 385.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 464.5 272 L 464.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 544.5 272 L 544.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 624.5 272 L 624.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 703.5 272 L 703.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 783.5 272 L 783.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 863.5 272 L 863.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 942.5 272 L 942.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 1023.5 272 L 1023.5 282" opacity="1"></path><path fill="none" class="highcharts-tick" stroke="#ccd6eb" stroke-width="1" d="M 66.5 272 L 66.5 282" opacity="1"></path><path fill="none" class="highcharts-axis-line" stroke="#ccd6eb" stroke-width="1" data-z-index="7" d="M 67 272.5 L 1023 272.5"></path></g><g class="highcharts-axis highcharts-yaxis " data-z-index="2"><text x="26.046875" data-z-index="7" text-anchor="middle" transform="translate(0,0) rotate(270 26.046875 171.5)" class="highcharts-axis-title" style="color:#666666;fill:#666666;" y="171.5"><tspan>Sales()</tspan></text><path fill="none" class="highcharts-axis-line" data-z-index="7" d="M 67 71 L 67 272"></path></g><g class="highcharts-series-group" data-z-index="3"><g data-z-index="0.1" class="highcharts-series highcharts-series-0 highcharts-line-series highcharts-color-0 " transform="translate(67,71) scale(1 1)" clip-path="url(#highcharts-bg3agvz-1)"><path fill="none" d="M 39.833333333333 154.1 L 119.5 154.76999999999998 L 199.16666666667 137.35 L 278.83333333333 103.85 L 358.5 77.72000000000001 L 438.16666666667 56.94999999999999 L 517.83333333333 32.16 L 597.5 23.44999999999999 L 677.16666666667 44.889999999999986 L 756.83333333333 78.38999999999999 L 836.5 107.86999999999999 L 916.16666666667 136.68" class="highcharts-graph" data-z-index="1" stroke="#7cb5ec" stroke-width="2" stroke-linejoin="round" stroke-linecap="round"></path></g><g data-z-index="0.1" class="highcharts-markers highcharts-series-0 highcharts-line-series highcharts-color-0 " transform="translate(67,71) scale(1 1)"><path fill="#7cb5ec" d="M 43 154.1 A 4 4 0 1 1 42.99999800000017 154.09600000066666 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 123 154.76999999999998 A 4 4 0 1 1 122.99999800000016 154.76600000066665 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 203 137.35 A 4 4 0 1 1 202.99999800000018 137.34600000066666 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 282 103.85 A 4 4 0 1 1 281.9999980000002 103.84600000066666 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 362 77.72000000000001 A 4 4 0 1 1 361.9999980000002 77.71600000066668 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 442 56.94999999999999 A 4 4 0 1 1 441.9999980000002 56.94600000066665 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 521 32.16 A 4 4 0 1 1 520.9999980000001 32.15600000066666 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 601 23.44999999999999 A 4 4 0 1 1 600.9999980000001 23.446000000666654 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 681 44.889999999999986 A 4 4 0 1 1 680.9999980000001 44.88600000066665 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 760 78.38999999999999 A 4 4 0 1 1 759.9999980000001 78.38600000066666 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 840 107.86999999999999 A 4 4 0 1 1 839.9999980000001 107.86600000066666 Z" class="highcharts-point highcharts-color-0"></path><path fill="#7cb5ec" d="M 920 136.68 A 4 4 0 1 1 919.9999980000001 136.67600000066668 Z" class="highcharts-point highcharts-color-0"></path></g><g data-z-index="0.1" class="highcharts-series highcharts-series-1 highcharts-line-series highcharts-color-1 " transform="translate(67,71) scale(1 1)" clip-path="url(#highcharts-bg3agvz-1)"><path fill="none" d="M 39.833333333333 174.87 L 119.5 172.86 L 199.16666666667 162.81 L 278.83333333333 144.05 L 358.5 121.27 L 438.16666666667 99.16 L 517.83333333333 87.1 L 597.5 89.77999999999999 L 677.16666666667 105.86 L 756.83333333333 131.99 L 836.5 156.78 L 916.16666666667 168.84" class="highcharts-graph" data-z-index="1" stroke="#434348" stroke-width="2" stroke-linejoin="round" stroke-linecap="round"></path></g><g data-z-index="0.1" class="highcharts-markers highcharts-series-1 highcharts-line-series highcharts-color-1 " transform="translate(67,71) scale(1 1)"><path fill="#434348" d="M 39 170.87 L 43 174.87 39 178.87 35 174.87 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 119 168.86 L 123 172.86 119 176.86 115 172.86 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 199 158.81 L 203 162.81 199 166.81 195 162.81 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 278 140.05 L 282 144.05 278 148.05 274 144.05 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 358 117.27 L 362 121.27 358 125.27 354 121.27 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 438 95.16 L 442 99.16 438 103.16 434 99.16 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 517 83.1 L 521 87.1 517 91.1 513 87.1 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 597 85.77999999999999 L 601 89.77999999999999 597 93.77999999999999 593 89.77999999999999 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 677 101.86 L 681 105.86 677 109.86 673 105.86 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 756 127.99000000000001 L 760 131.99 756 135.99 752 131.99 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 836 152.78 L 840 156.78 836 160.78 832 156.78 Z" class="highcharts-point highcharts-color-1"></path><path fill="#434348" d="M 916 164.84 L 920 168.84 916 172.84 912 168.84 Z" class="highcharts-point highcharts-color-1"></path></g><g data-z-index="0.1" class="highcharts-series highcharts-series-2 highcharts-line-series highcharts-color-2 " transform="translate(67,71) scale(1 1)" clip-path="url(#highcharts-bg3agvz-1)"><path fill="none" d="M 39.833333333333 161.47 L 119.5 159.46 L 199.16666666667 149.41 L 278.83333333333 130.64999999999998 L 358.5 107.86999999999999 L 438.16666666667 85.76 L 517.83333333333 73.7 L 597.5 76.37999999999998 L 677.16666666667 92.46000000000001 L 756.83333333333 118.58999999999999 L 836.5 143.38 L 916.16666666667 155.44" class="highcharts-graph" data-z-index="1" stroke="#90ed7d" stroke-width="2" stroke-linejoin="round" stroke-linecap="round"></path></g><g data-z-index="0.1" class="highcharts-markers highcharts-series-2 highcharts-line-series highcharts-color-2 " transform="translate(67,71) scale(1 1)"><path fill="#90ed7d" d="M 35 157.47 L 43 157.47 43 165.47 35 165.47 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 115 155.46 L 123 155.46 123 163.46 115 163.46 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 195 145.41 L 203 145.41 203 153.41 195 153.41 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 274 126.64999999999998 L 282 126.64999999999998 282 134.64999999999998 274 134.64999999999998 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 354 103.86999999999999 L 362 103.86999999999999 362 111.86999999999999 354 111.86999999999999 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 434 81.76 L 442 81.76 442 89.76 434 89.76 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 513 69.7 L 521 69.7 521 77.7 513 77.7 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 593 72.37999999999998 L 601 72.37999999999998 601 80.37999999999998 593 80.37999999999998 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 673 88.46000000000001 L 681 88.46000000000001 681 96.46000000000001 673 96.46000000000001 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 752 114.58999999999999 L 760 114.58999999999999 760 122.58999999999999 752 122.58999999999999 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 832 139.38 L 840 139.38 840 147.38 832 147.38 Z" class="highcharts-point highcharts-color-2"></path><path fill="#90ed7d" d="M 912 151.44 L 920 151.44 920 159.44 912 159.44 Z" class="highcharts-point highcharts-color-2"></path></g></g><g class="highcharts-exporting-group" data-z-index="3"><g class="highcharts-button highcharts-contextbutton" style="cursor:pointer;" stroke-linecap="round" transform="translate(999,10)"><title>Chart context menu</title><rect fill="#ffffff" class=" highcharts-button-box" x="0.5" y="0.5" width="24" height="22" rx="2" ry="2" stroke="none" stroke-width="1"></rect><path fill="#666666" d="M 6 6.5 L 20 6.5 M 6 11.5 L 20 11.5 M 6 16.5 L 20 16.5" class="highcharts-button-symbol" data-z-index="1" stroke="#666666" stroke-width="3"></path><text x="0" data-z-index="1" style="font-weight:normal;color:#333333;fill:#333333;" y="12"></text></g></g><text x="517" text-anchor="middle" class="highcharts-title" data-z-index="4" style="color:#333333;font-size:18px;fill:#333333;" y="24"><tspan>Monthly Average Sales</tspan></text><text x="517" text-anchor="middle" class="highcharts-subtitle" data-z-index="4" style="color:#666666;fill:#666666;" y="52"><tspan>Source: eumierp.com</tspan></text><g data-z-index="6" class="highcharts-data-labels highcharts-series-0 highcharts-line-series highcharts-color-0 " transform="translate(67,71) scale(1 1)" opacity="1" visibility="visible"><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(31,130)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">7</tspan><tspan x="5" y="16">7</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(105,131)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round" style="">6.9</tspan><tspan x="5" y="16">6.9</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(185,113)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">9.5</tspan><tspan x="5" y="16">9.5</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(261,80)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round" style="">14.5</tspan><tspan x="5" y="16">14.5</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(341,54)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">18.4</tspan><tspan x="5" y="16">18.4</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(421,33)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">21.5</tspan><tspan x="5" y="16">21.5</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(500,8)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">25.2</tspan><tspan x="5" y="16">25.2</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(580,-1)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">26.5</tspan><tspan x="5" y="16">26.5</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(660,21)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">23.3</tspan><tspan x="5" y="16">23.3</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(739,54)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">18.3</tspan><tspan x="5" y="16">18.3</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(819,84)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">13.9</tspan><tspan x="5" y="16">13.9</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0 " data-z-index="1" transform="translate(902,113)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">9.6</tspan><tspan x="5" y="16">9.6</tspan></text></g></g><g data-z-index="6" class="highcharts-data-labels highcharts-series-1 highcharts-line-series highcharts-color-1 " transform="translate(67,71) scale(1 1)" opacity="1" visibility="visible"><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(25,151)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">3.9</tspan><tspan x="5" y="16">3.9</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(105,149)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">4.2</tspan><tspan x="5" y="16">4.2</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(185,139)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">5.7</tspan><tspan x="5" y="16">5.7</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(264,120)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">8.5</tspan><tspan x="5" y="16">8.5</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(341,97)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">11.9</tspan><tspan x="5" y="16">11.9</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(421,75)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">15.2</tspan><tspan x="5" y="16">15.2</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(506,63)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">17</tspan><tspan x="5" y="16">17</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(580,66)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">16.6</tspan><tspan x="5" y="16">16.6</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(660,82)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">14.2</tspan><tspan x="5" y="16">14.2</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(739,108)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">10.3</tspan><tspan x="5" y="16">10.3</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(822,133)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">6.6</tspan><tspan x="5" y="16">6.6</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1 " data-z-index="1" transform="translate(902,145)"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">4.8</tspan><tspan x="5" y="16">4.8</tspan></text></g></g><g data-z-index="6" class="highcharts-data-labels highcharts-series-2 highcharts-line-series highcharts-color-2 " transform="translate(67,71) scale(1 1)" opacity="1" visibility="visible"><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(25,137)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">5.9</tspan><tspan x="5" y="16">5.9</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(105,135)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">6.2</tspan><tspan x="5" y="16">6.2</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(185,125)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">7.7</tspan><tspan x="5" y="16">7.7</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(261,107)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">10.5</tspan><tspan x="5" y="16">10.5</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(341,84)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">13.9</tspan><tspan x="5" y="16">13.9</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(421,62)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">17.2</tspan><tspan x="5" y="16">17.2</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(506,50)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">19</tspan><tspan x="5" y="16">19</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(580,52)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">18.6</tspan><tspan x="5" y="16">18.6</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(660,68)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">16.2</tspan><tspan x="5" y="16">16.2</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(739,95)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">12.3</tspan><tspan x="5" y="16">12.3</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(822,119)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">8.6</tspan><tspan x="5" y="16">8.6</tspan></text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-2 " data-z-index="1" transform="translate(902,131)" opacity="0" visibility="hidden"><text x="5" data-z-index="1" style="font-size:11px;font-weight:bold;color:#000000;fill:#000000;" y="16"><tspan x="5" y="16" class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">6.8</tspan><tspan x="5" y="16">6.8</tspan></text></g></g><g class="highcharts-legend" data-z-index="7" transform="translate(406,306)"><rect fill="none" class="highcharts-legend-box" rx="0" ry="0" x="0" y="0" width="220" height="29" visibility="visible"></rect><g data-z-index="1"><g><g class="highcharts-legend-item highcharts-line-series highcharts-color-0 highcharts-series-0" data-z-index="1" transform="translate(8,3)"><path fill="none" d="M 0 11 L 16 11" class="highcharts-graph" stroke="#7cb5ec" stroke-width="2"></path><path fill="#7cb5ec" d="M 12 11 A 4 4 0 1 1 11.999998000000167 10.996000000666664 Z" class="highcharts-point"></path><text x="21" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2" y="15"><tspan>Smn1</tspan></text></g><g class="highcharts-legend-item highcharts-line-series highcharts-color-1 highcharts-series-1" data-z-index="1" transform="translate(82.65625,3)"><path fill="none" d="M 0 11 L 16 11" class="highcharts-graph" stroke="#434348" stroke-width="2"></path><path fill="#434348" d="M 8 7 L 12 11 8 15 4 11 Z" class="highcharts-point"></path><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Smn2</tspan></text></g><g class="highcharts-legend-item highcharts-line-series highcharts-color-2 highcharts-series-2" data-z-index="1" transform="translate(157.484375,3)"><path fill="none" d="M 0 11 L 16 11" class="highcharts-graph" stroke="#90ed7d" stroke-width="2"></path><path fill="#90ed7d" d="M 4 7 L 12 7 12 15 4 15 Z" class="highcharts-point"></path><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Smn3</tspan></text></g></g></g></g><g class="highcharts-axis-labels highcharts-xaxis-labels " data-z-index="7"><text x="106.83333333333667" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Jan</text><text x="186.49999999999665" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Feb</text><text x="266.1666666666667" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Mar</text><text x="345.83333333333667" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Apr</text><text x="425.4999999999967" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">May</text><text x="505.1666666666667" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Jun</text><text x="584.8333333333367" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Jul</text><text x="664.4999999999966" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Aug</text><text x="744.1666666666666" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Sep</text><text x="823.8333333333367" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Oct</text><text x="903.4999999999966" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Nov</text><text x="983.1666666666666" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="middle" transform="translate(0,0)" y="291" opacity="1">Dec</text></g><g class="highcharts-axis-labels highcharts-yaxis-labels " data-z-index="7"><text x="52" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="end" transform="translate(0,0)" y="276" opacity="1">0</text><text x="52" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="end" transform="translate(0,0)" y="209" opacity="1">10</text><text x="52" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="end" transform="translate(0,0)" y="142" opacity="1">20</text><text x="52" style="color:#666666;cursor:default;font-size:11px;fill:#666666;" text-anchor="end" transform="translate(0,0)" y="75" opacity="1">30</text></g><text x="1023" class="highcharts-credits" text-anchor="end" data-z-index="8" style="cursor:pointer;color:#999999;font-size:9px;fill:#999999;" y="345"></text></svg></div></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-lg-10 col-12">
            <div class="card" style="height: 430px;">
                <div class="card-body">

                    <div id="container" style="min-width: 310px; height: 350px; max-width: 600px; margin: 0 auto" data-highcharts-chart="1">
                    <div id="highcharts-bg3agvz-4" dir="ltr" class="highcharts-container " style="position: relative; overflow: hidden; width: 340px; height: 400px; text-align: left; line-height: normal; z-index: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                        <svg version="1.1" class="highcharts-root" style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Arial, Helvetica, sans-serif;font-size:12px;" xmlns="http://www.w3.org/2000/svg" width="340" height="400" viewBox="0 0 340 400"><desc>Created with Highcharts 6.1.1</desc>
                        <defs><clipPath id="highcharts-bg3agvz-5"><rect x="0" y="0" width="320" height="273" fill="none"></rect></clipPath></defs><rect fill="#ffffff" class="highcharts-background" x="0" y="0" width="340" height="400" rx="0" ry="0"></rect><rect fill="none" class="highcharts-plot-background" x="10" y="53" width="320" height="273"></rect><rect fill="none" class="highcharts-plot-border" data-z-index="1" x="10" y="53" width="320" height="273"></rect><g class="highcharts-series-group" data-z-index="3"><g data-z-index="0.1" class="highcharts-series highcharts-series-0 highcharts-pie-series  highcharts-tracker" transform="translate(10,53) scale(1 1)" style="cursor:pointer;"><path fill="#7cb5ec" d="M 159.97423533973256 10.000002623785477 A 126.5 126.5 0 0 1 257.4013819722177 217.21691761893632 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(9,-4)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-point-select highcharts-color-0"></path><path fill="#434348" d="M 257.3206163673646 217.31427862621953 A 126.5 126.5 0 0 1 123.92358400550486 257.74661730948264 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(0,0)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-color-1"></path><path fill="#90ed7d" d="M 123.80235544660965 257.71048027619725 A 126.5 126.5 0 0 1 61.1294184761736 215.4104435999469 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(0,0)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-color-2"></path><path fill="#f7a35c" d="M 61.05055748101205 215.311533579683 A 126.5 126.5 0 0 1 159.82429403783394 10.00012202608707 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(0,0)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-color-3"></path></g><g data-z-index="0.1" class="highcharts-markers highcharts-series-0 highcharts-pie-series " transform="translate(10,53) scale(1 1)"></g></g><g class="highcharts-exporting-group" data-z-index="3"><g class="highcharts-button highcharts-contextbutton" style="cursor:pointer;" stroke-linecap="round" transform="translate(306,10)"><title>Chart context menu</title><rect fill="#ffffff" class=" highcharts-button-box" x="0.5" y="0.5" width="24" height="22" rx="2" ry="2" stroke="none" stroke-width="1"></rect><path fill="#666666" d="M 6 6.5 L 20 6.5 M 6 11.5 L 20 11.5 M 6 16.5 L 20 16.5" class="highcharts-button-symbol" data-z-index="1" stroke="#666666" stroke-width="3"></path><text x="0" data-z-index="1" style="font-weight:normal;color:#333333;fill:#333333;" y="12"></text></g></g><text x="170" text-anchor="middle" class="highcharts-title" data-z-index="4" style="color:#333333;font-size:18px;fill:#333333;" y="24"><tspan>Department wise Sales</tspan></text><text x="170" text-anchor="middle" class="highcharts-subtitle" data-z-index="4" style="color:#666666;fill:#666666;" y="52"></text><g class="highcharts-legend" data-z-index="7" transform="translate(47,338)"><rect fill="none" class="highcharts-legend-box" rx="0" ry="0" x="0" y="0" width="246" height="47" visibility="visible"></rect><g data-z-index="1"><g><g class="highcharts-legend-item highcharts-pie-series highcharts-color-0" data-z-index="1" transform="translate(8,3)"><text x="21" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2" y="15"><tspan>Dept A</tspan></text><rect x="2" y="4" width="12" height="12" fill="#7cb5ec" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g><g class="highcharts-legend-item highcharts-pie-series highcharts-color-1" data-z-index="1" transform="translate(91.46875,3)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Dept B</tspan></text>
                            <rect x="2" y="4" width="12" height="12" fill="#434348" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g><g class="highcharts-legend-item highcharts-pie-series highcharts-color-2" data-z-index="1" transform="translate(174.9375,3)">
                            <text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Dept C</tspan></text><rect x="2" y="4" width="12" height="12" fill="#90ed7d" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g>
                            <g class="highcharts-legend-item highcharts-pie-series highcharts-color-3" data-z-index="1" transform="translate(8,21)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Dept D</tspan></text><rect x="2" y="4" width="12" height="12" fill="#f7a35c" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g></g></g></g>
                        <text x="330" class="highcharts-credits" text-anchor="end" data-z-index="8" style="cursor:pointer;color:#999999;font-size:9px;fill:#999999;" y="395"></text></svg></div></div>
                </div>
            </div>
        </div>
    </div>
    <!--Line with Area Chart 1 Ends-->

    <div class="row match-height">
        @*<div class="col-xl-4 col-lg-12 col-12">
            <div class="card" style="height: 465px;">
                <div class="card-body">

                    <div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto" data-highcharts-chart="1"><div id="highcharts-bg3agvz-4" dir="ltr" class="highcharts-container " style="position: relative; overflow: hidden; width: 340px; height: 400px; text-align: left; line-height: normal; z-index: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><svg version="1.1" class="highcharts-root" style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Arial, Helvetica, sans-serif;font-size:12px;" xmlns="http://www.w3.org/2000/svg" width="340" height="400" viewBox="0 0 340 400"><desc>Created with Highcharts 6.1.1</desc><defs><clipPath id="highcharts-bg3agvz-5"><rect x="0" y="0" width="320" height="273" fill="none"></rect></clipPath></defs><rect fill="#ffffff" class="highcharts-background" x="0" y="0" width="340" height="400" rx="0" ry="0"></rect><rect fill="none" class="highcharts-plot-background" x="10" y="53" width="320" height="273"></rect><rect fill="none" class="highcharts-plot-border" data-z-index="1" x="10" y="53" width="320" height="273"></rect><g class="highcharts-series-group" data-z-index="3"><g data-z-index="0.1" class="highcharts-series highcharts-series-0 highcharts-pie-series  highcharts-tracker" transform="translate(10,53) scale(1 1)" style="cursor:pointer;"><path fill="#7cb5ec" d="M 159.97423533973256 10.000002623785477 A 126.5 126.5 0 0 1 257.4013819722177 217.21691761893632 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(9,-4)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-point-select highcharts-color-0"></path><path fill="#434348" d="M 257.3206163673646 217.31427862621953 A 126.5 126.5 0 0 1 123.92358400550486 257.74661730948264 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(0,0)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-color-1"></path><path fill="#90ed7d" d="M 123.80235544660965 257.71048027619725 A 126.5 126.5 0 0 1 61.1294184761736 215.4104435999469 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(0,0)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-color-2"></path><path fill="#f7a35c" d="M 61.05055748101205 215.311533579683 A 126.5 126.5 0 0 1 159.82429403783394 10.00012202608707 L 160 136.5 A 0 0 0 0 0 160 136.5 Z" transform="translate(0,0)" stroke="#ffffff" stroke-width="1" stroke-linejoin="round" class="highcharts-point highcharts-color-3"></path></g><g data-z-index="0.1" class="highcharts-markers highcharts-series-0 highcharts-pie-series " transform="translate(10,53) scale(1 1)"></g></g><g class="highcharts-exporting-group" data-z-index="3"><g class="highcharts-button highcharts-contextbutton" style="cursor:pointer;" stroke-linecap="round" transform="translate(306,10)"><title>Chart context menu</title><rect fill="#ffffff" class=" highcharts-button-box" x="0.5" y="0.5" width="24" height="22" rx="2" ry="2" stroke="none" stroke-width="1"></rect><path fill="#666666" d="M 6 6.5 L 20 6.5 M 6 11.5 L 20 11.5 M 6 16.5 L 20 16.5" class="highcharts-button-symbol" data-z-index="1" stroke="#666666" stroke-width="3"></path><text x="0" data-z-index="1" style="font-weight:normal;color:#333333;fill:#333333;" y="12"></text></g></g><text x="170" text-anchor="middle" class="highcharts-title" data-z-index="4" style="color:#333333;font-size:18px;fill:#333333;" y="24"><tspan>Department wise Sales</tspan></text><text x="170" text-anchor="middle" class="highcharts-subtitle" data-z-index="4" style="color:#666666;fill:#666666;" y="52"></text><g class="highcharts-legend" data-z-index="7" transform="translate(47,338)"><rect fill="none" class="highcharts-legend-box" rx="0" ry="0" x="0" y="0" width="246" height="47" visibility="visible"></rect><g data-z-index="1"><g><g class="highcharts-legend-item highcharts-pie-series highcharts-color-0" data-z-index="1" transform="translate(8,3)"><text x="21" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2" y="15"><tspan>Dept A</tspan></text><rect x="2" y="4" width="12" height="12" fill="#7cb5ec" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g><g class="highcharts-legend-item highcharts-pie-series highcharts-color-1" data-z-index="1" transform="translate(91.46875,3)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Dept B</tspan></text><rect x="2" y="4" width="12" height="12" fill="#434348" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g><g class="highcharts-legend-item highcharts-pie-series highcharts-color-2" data-z-index="1" transform="translate(174.9375,3)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Dept C</tspan></text><rect x="2" y="4" width="12" height="12" fill="#90ed7d" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g><g class="highcharts-legend-item highcharts-pie-series highcharts-color-3" data-z-index="1" transform="translate(8,21)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" data-z-index="2"><tspan>Dept D</tspan></text><rect x="2" y="4" width="12" height="12" fill="#f7a35c" rx="6" ry="6" class="highcharts-point" data-z-index="3"></rect></g></g></g></g><text x="330" class="highcharts-credits" text-anchor="end" data-z-index="8" style="cursor:pointer;color:#999999;font-size:9px;fill:#999999;" y="395"></text></svg></div></div>
                </div>
            </div>
        </div>*@

        @*<div class="col-sm-12">
            <div class="card" style="height: 400px">
                <div class="card-header">
                    <h3 class="card-title">Project Job List</h3>
                    
                        <div class="text-right" style="margin-right:60px">
                            <button type="button" onclick="($('#iconForm').show()),($('#JobCode').focus())" class="btn btn-outline-primary mr-1">Add Job</button>

                        </div>

          
                    <a class="heading-elements-toggle"></a>
                    <div class="heading-elements">
                        <ul class="list-inline mb-0">
                            <li><a data-action="reload"></a></li>
                            <li><a data-action="expand"></a></li>
                        </ul>
                    </div>
                </div>
                <div class="card-content">
                    <div class="card-body">


                   

                        </div>
                </div>


                <div class="table-responsive">

                    <div class="card-content collapse show">
                        <div class="card-body card-dashboard">
                            <table id="tblprojectjob1" class="table table-striped table-bordered zero-configuration dataTable"></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>


        <div class="modal fade text-left show" id="iconForm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel17" style="padding-right: 17px;+ display: block; display: none;background:rgba(0,0,0,0.5);height:200%">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content" style="width:1000px">
                    <div class="modal-header bg-primary white">
                        <h4 class="modal-title" id="myModalLabel17">Project Job</h4>
                        <button type="button" class="close" data-dismiss="modal" onclick="($('#iconForm').hide())" aria-label="Close">
                            <span aria-hidden="true">×</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="row" style="float:right">
                            <div class="col-md-3">
                                <fieldset>
                                    <div class="custom-control custom-checkbox">
                                        <input type="checkbox" class="custom-control-input" checked="" name="customCheck" id="JobStatus">
                                        <label class="custom-control-label" for="JobStatus">Active</label>
                                    </div>
                                </fieldset>
                            </div>
                        </div><br /><br />

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="JobCode">Code<span class="danger">*</span></label>
                                    <div class="col-md-8">
                                        <input type="text" id="JobCode" onkeyup="changetoupper(this.id)" class="form-control" style="font-weight:bold" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="Description">Description</label>
                                    <div class="col-md-8">
                                        <input type="text" id="Description" class="form-control" maxlength="150">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="CustName">Customer</label>
                                    <div class="col-md-8">
                                        <input type="text" id="CustName" class="form-control" maxlength="150" />
                                        <input type="hidden" id="CustomerId" class="form-control" />
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="EstAmount">Est.Amount</label>
                                    <div class="col-md-8">
                                        <input type="number" id="EstAmount" class="form-control" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                        </div>



                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="FirstName">Salesman</label>
                                    <div class="col-md-8">
                                        <select id="FirstName" name="interested" class="form-control"></select>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="JobNature">Job Nature</label>
                                    <div class="col-md-8">
                                        <input type="text" id="JobNature" class="form-control" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="LPO">LPO</label>
                                    <div class="col-md-8">
                                        <input type="text" id="LPO" class="form-control" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="StartDate">Start Date</label>
                                    <div class="col-md-8">
                                        <input type="text" id="StartDate" class="form-control" />
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="EndDate">End Date</label>
                                    <div class="col-md-8">
                                        <input type="text" id="EndDate"  class="form-control"/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="JobGroup">Job Group</label>
                                    <input type="hidden" id="JobGroupId" class="form-control" />
                                    <div class="col-md-8">
                                        <input type="text" id="JobGroup" autocomplete="off" class="form-control" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="Address1">Address 1</label>
                                    <div class="col-md-8">
                                        <input type="text" id="Address1" class="form-control" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="Address2">Address 2</label>
                                    <div class="col-md-8">
                                        <input type="text" id="Address2" class="form-control" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="Address3">Address 3</label>
                                    <div class="col-md-8">
                                        <input type="text" id="Address3" class="form-control" maxlength="150" />
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="BOQ">Need BOQ</label>
                                    <div class="col-md-8">
                                        <select class="form-control" id="BOQ">
                                            <option>Select</option>
                                            <option>Yes</option>
                                            <option>No</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">

                                <div class="form-group row">
                                    <label class="col-md-3 label-control" for="JobDetails">Job Details</label>
                                    <div class="col-md-8">
                                        <textarea class="form-control" id="JobDetails" rows="3"></textarea>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <input type="button" class="btn btn-outline-primary" onclick="SaveJob()" value="Save" id="btnjobsubmit">
                        <input type="button" class="btn btn-outline-secondary" onclick="($('#iconForm').hide())" value="close">
                    </div>
                </div>
            </div>
        </div>*@



    @*</div>

    <div class="row match-height">
        <div class="col-xl-8 col-lg-12 col-12">
            <div class="card" style="height: 539px;">
                <div class="card-header">
                    <h4 class="card-title mb-0">Visit &amp; Sales Statistics</h4>
                </div>
                <div class="card-body">
                    <div class="card-block">
                        <div class="chart-info mb-2">
                            <span class="text-uppercase mr-3"><i class="fa fa-circle primary font-small-2 mr-1"></i> Sales</span>
                            <span class="text-uppercase"><i class="fa fa-circle deep-purple font-small-2 mr-1"></i> Visits</span>
                        </div>
                        <div id="line-area2" class="height-400 lineAreaDashboard">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-lg-12 col-12">
            <div class="card gradient-blackberry" style="height: 539px;">
                <div class="card-body">
                    <div class="card-block">
                        <h4 class="card-title white">Statistics</h4>
                        <div class="p-2 text-center">
                            <a class="white font-medium-1">Month</a>
                            <a class="btn btn-raised btn-round bg-white mx-3 px-3">Week</a>
                            <a class="white font-medium-1">Day</a>
                        </div>
                        <div class="my-3 text-center white">
                            <a class="font-large-2 d-block mb-1">$ 78.89 <span class="ft-arrow-up font-large-2"></span></a>
                            <span class="font-medium-1">Week2   +15.44</span>
                        </div>
                    </div>
                    <div id="lineChart" class="height-250 lineChart lineChartShadow">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row match-height">
        <div class="col-xl-4 col-lg-12">
            <div class="card" style="height: 535px;">
                <div class="card-header">
                    <h4 class="card-title">Statistics</h4>
                </div>
                <div class="card-body">

                    <p class="font-medium-2 text-muted text-center">Hobbies</p>
                    <div id="bar-chart" class="height-250 BarChartShadow BarChart">
                    </div>

                    <div class="card-block">
                        <div class="row">
                            <div class="col text-center">
                                <span class="gradient-pomegranate d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">48</span>
                                <span>Sport</span>
                            </div>
                            <div class="col text-center">
                                <span class="gradient-green-tea d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">9</span>
                                <span>Music</span>
                            </div>
                            <div class="col text-center">
                                <span class="gradient-blackberry d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">26</span>
                                <span>Travel</span>
                            </div>
                            <div class="col text-center">
                                <span class="gradient-ibiza-sunset d-block rounded-circle mx-auto mb-2" style="width:10px; height:10px;"></span>
                                <span class="font-large-1 d-block mb-2">17</span>
                                <span>News</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-lg-12">
            <div class="card" style="height: 535px;">
                <div class="card-header">
                    <h4 class="card-title mb-0">User List</h4>
                </div>
                <div class="card-body">
                    <div class="card-block">
                        <div class="media mb-1">
                            <a>
                                <img alt="96x96" class="media-object d-flex mr-3 bg-primary height-50 rounded-circle" src="../app-assets/img/portrait/small/avatar-s-12.png">
                            </a>
                            <div class="media-body">
                                <h4 class="font-medium-1 mt-1 mb-0">Jessica Rice</h4>
                                <p class="text-muted font-small-3">UX Designer</p>
                            </div>
                            <div class="mt-1">
                                <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                                    <input type="checkbox" class="custom-control-input" checked="" id="customcheckbox1">
                                    <label class="custom-control-label" for="customcheckbox1"></label>
                                </div>

                            </div>
                        </div>
                        <div class="media mb-1">
                            <a>
                                <img alt="96x96" class="media-object d-flex mr-3 bg-danger height-50 rounded-circle" src="../app-assets/img/portrait/small/avatar-s-11.png">
                            </a>
                            <div class="media-body">
                                <h4 class="font-medium-1 mt-1 mb-0">Jacob Rios</h4>
                                <p class="text-muted font-small-3">HTML Developer</p>
                            </div>
                            <div class="mt-1">
                                <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                                    <input type="checkbox" class="custom-control-input" id="customcheckbox2">
                                    <label class="custom-control-label" for="customcheckbox2"></label>
                                </div>

                            </div>
                        </div>
                        <div class="media mb-1">
                            <a>
                                <img alt="96x96" class="media-object d-flex mr-3 bg-success height-50 rounded-circle" src="../app-assets/img/portrait/small/avatar-s-3.png">
                            </a>
                            <div class="media-body">
                                <h4 class="font-medium-1 mt-1 mb-0">Russell Delgado</h4>
                                <p class="text-muted font-small-3">Database Designer</p>
                            </div>
                            <div class="mt-1">
                                <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                                    <input type="checkbox" class="custom-control-input" id="customcheckbox3">
                                    <label class="custom-control-label" for="customcheckbox3"></label>
                                </div>

                            </div>
                        </div>
                        <div class="media mb-1">
                            <a>
                                <img alt="96x96" class="media-object d-flex mr-3 bg-warning height-50 rounded-circle" src="../app-assets/img/portrait/small/avatar-s-6.png">
                            </a>
                            <div class="media-body">
                                <h4 class="font-medium-1 mt-1 mb-0">Sara McDonald</h4>
                                <p class="text-muted font-small-3">Team Leader</p>
                            </div>
                            <div class="mt-1">
                                <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                                    <input type="checkbox" class="custom-control-input" checked="" id="customcheckbox4">
                                    <label class="custom-control-label" for="customcheckbox4"></label>
                                </div>

                            </div>
                        </div>
                        <div class="media mb-1">
                            <a>
                                <img alt="96x96" class="media-object d-flex mr-3 bg-info height-50 rounded-circle" src="../app-assets/img/portrait/small/avatar-s-18.png">
                            </a>
                            <div class="media-body">
                                <h4 class="font-medium-1 mt-1 mb-0">Janet Lucas</h4>
                                <p class="text-muted font-small-3">Project Manger</p>
                            </div>
                            <div class="mt-1">
                                <div class="custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0">
                                    <input type="checkbox" class="custom-control-input" id="customcheckbox5">
                                    <label class="custom-control-label" for="customcheckbox5"></label>
                                </div>

                            </div>
                        </div>
                        <div class="action-buttons mt-2 text-center">
                            <a class="btn btn-raised gradient-blackberry py-2 px-4 white mr-2">Add New</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-lg-12">
            <div class="card" style="height: 535px;">
                <div class="card-header">
                    <h4 class="card-title">Project Stats</h4>
                </div>
                <div class="card-body">

                    <p class="font-medium-2 text-muted text-center">Project Tasks</p>
                    <div id="donut-dashboard-chart" class="height-250 donut">
                    </div>

                    <div class="card-block">
                        <div class="row mb-3">
                            <div class="col">
                                <span class="mb-1 text-muted d-block">23% - Started</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-success" role="progressbar" style="width: 23%;" aria-valuenow="23" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div>
                            <div class="col">
                                <span class="mb-1 text-muted d-block">14% - In Progress</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-amber" role="progressbar" style="width: 14%;" aria-valuenow="14" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row mb-2">
                            <div class="col">
                                <span class="mb-1 text-muted d-block">35% - Remaining</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-deep-purple bg-lighten-1" role="progressbar" style="width: 35%;" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div>
                            <div class="col">
                                <span class="mb-1 text-muted d-block">28% - Done</span>
                                <div class="progress" style="height: 5px;">
                                    <div class="progress-bar bg-blue" role="progressbar" style="width: 28%;" aria-valuenow="28" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<script src="../Scripts/Chart/highcharts.js"></script>
<script src="../Scripts/Chart/export-data.js"></script>
<script src="../Scripts/Chart/exporting.js"></script>

<script>


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

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

                        })
                    }));
                }

            })

        },
        autoFocus: true,
        select: function (event, ui) {
            $('#CustomerId').val(ui.item.CustId);
        },

    });

    $("#JobGroup").autocomplete({
        source: function (request, response) {
            var data = {};
            data.JobCode = $("#JobGroup").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,
                        })
                    }));
                }

            })

        },
        autoFocus: true,
        select: function (event, ui) {
            $('#JobGroupId').val(ui.item.JobcodeId);
        },

    });

    $(function () {


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

        });

    });
    $(function () {


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

        });

    });

    function SaveJob() {
        SaveAndUpdate(1)
        GetRows1(0);
    }
    function GetRows1(ProjectJobId) {
        $('#ProjectJobId').val(ProjectJobId)
        var data = {};
        data.ProjectJobId = ProjectJobId;
        $.ajax({
            type: "POST",
            url: "../Master/ProjectJobGetandGets",
            data: data,
            success: function (result) {

                ShowProjectJoblist1(result.oList);
            }

        });
    }

    function ShowProjectJoblist1(result) {

        var responseText = "<thead><tr><th>Slno</th><th>Code</th><th>Description</th><th>Est.Amount</th><th>Status</th></tr></thead><tbody>";
        for (var i = 0; i < result.length; i++) {
            var slno = parseInt(i + 1);
            responseText += '<tr><td>' + slno + '</td><td>' + result[i].JobCode + '</td><td>' + result[i].Description + '</td><td>' + result[i].EstAmount + '</td><td>' + result[i].JobStatus + '</td></tr>';
        }
        $('#tblprojectjob1').html(responseText + '</tbody>');

    }


        $(document).ready(function () {
        GetRows1(0);
    });
</script>*@