<%@ Page Title="Consumer Behaviour Analysis" Language="C#" MasterPageFile="~/SunMaster.Master" AutoEventWireup="true" CodeBehind="ConsumerBehaviourAnalysis.aspx.cs" Inherits="SUNWEB.ConsumerBehaviourAnalysis" %>

<%@ Register Assembly="AjaxControlToolkit" TagPrefix="asp" Namespace="AjaxControlToolkit" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

    <script type="text/javascript">

        function CheckOne(obj) {
            var grid = obj.parentNode.parentNode.parentNode;
            var inputs = grid.getElementsByTagName("input");
            for (var i = 0; i < inputs.length; i++) {
                if (inputs[i].type == "checkbox") {
                    if (obj.checked && inputs[i] != obj && inputs[i].checked) {
                        inputs[i].checked = false;
                    }
                }
            }
        }
    </script>

    
 
    <script type="text/javascript">

        function MainCall()
        {
            StatusFlag = document.getElementById('<%= hidDropdownValue.ClientID%>').value;
            if (StatusFlag == "Itemwise") {
                ItemHeader5();
                google.charts.load('current', { packages: ['corechart', 'bar'] });
                google.charts.setOnLoadCallback(drawBasic);
               

            }
            else if (StatusFlag == "Categorywise")
            {
                CategorywiseHeader5();
                google.charts.load('current', { packages: ['corechart', 'bar'] });
                google.charts.setOnLoadCallback(drawBasic1);
               
                
            }

            else if (StatusFlag == "Memberwise")
            {
                CustomerwiseHeader5();
                google.charts.load('current', { packages: ['corechart', 'bar'] });
                google.charts.setOnLoadCallback(drawBasic2);
               

            }


        }

        function ItemHeader5() {

            var returnval = "";
            $.ajax({

                type: "POST",
                url: "ConsumerBehaviourAnalysis.aspx/Web_ItemWise_Qty_Count",
                data: "{ }",
                async: false,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {

                    alert("Error occured..");

                },
                success: function (result) {
                    var Data = result.d.toString();
                    if (Data) {
                        ret = Data
                    }
                    else {
                        ret = "";
                    }
                }
            });
            return (ret);
        }

        // Itemwise Chart 
        function drawBasic() {
            var data = new google.visualization.DataTable();
            data.addColumn('string', 'Name');
            data.addColumn('number', 'Qty');

            var Rjsonvalue = JSON.parse(ItemHeader5());

            
            Rjsonvalue.forEach(function (item) {
                data.addRow([item.Name, item.Qty]);
            });


            var options = {
                title: 'Product Sold By Qty',
                hAxis: {
                    title: 'Qty',
                    //format: 'MMM yyyy',
                    /*viewWindow: {
                      min: [7, 30, 0],
                      max: [19, 30, 0]
                    }*/
                },
                vAxis: {
                    title: 'Name'
                }
            };

            // Call the Itemwise Amoutn Pie chart Function
            google.charts.setOnLoadCallback(byItemwiseAmount());



            function selectHandler() {
                var selection = chart.getSelection();
                if (selection.length > 0) {
                    var mydata = data.getValue(selection[0].row, 0);

                }
                else {


                }

            }


            // Loading the chart 
            var chart = new google.visualization.BarChart(
                document.getElementById('chart_div'));
            google.visualization.events.addListener(chart, 'select', selectHandler);
            chart.draw(data, options);

        }


        function byItemwiseAmount() {


            var Branchdata = new google.visualization.DataTable();
            Branchdata.addColumn('string', 'Name');
            Branchdata.addColumn('number', 'Amount');

            var Branchjsonvalue = JSON.parse(GetItemwiseAmount());
            Branchjsonvalue.forEach(function (item) {
                Branchdata.addRow([item.Name, item.Amount]);

            });




            var options = {
                title: 'Product Sold By Amount',
                hAxis: {
                    title: 'Name',
                    format: '',
                    /*viewWindow: {
                      min: [7, 30, 0],
                      max: [19, 30, 0]
                    }*/
                },
                vAxis: {
                    title: 'Amount'
                }
            };

            function selectHandler() {
                var selection = chart2.getSelection();
                if (selection.length > 0) {
                    var myBranchdata = Branchdata.getValue(selection[0].row, 0);
                }
            }

            var chart2 = new google.visualization.PieChart(
            document.getElementById('chart_div_1'));
            google.visualization.events.addListener(chart2, 'select', selectHandler);
            chart2.draw(Branchdata, options);
        }

        function GetItemwiseAmount()
        {

            var returnval = "";
            $.ajax({

                type: "POST",
                url: "ConsumerBehaviourAnalysis.aspx/Web_ItemWise_Amount",
                data: "{ }",
                async: false,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {

                    alert("Error occured..");

                },
                success: function (result) {
                    var Data = result.d.toString();
                    if (Data) {
                        ret = Data
                    }
                    else {
                        ret = "";
                    }
                }
            });
            return (ret);
        }





        //#2.  Category -> Functions 
        function CategorywiseHeader5() {

            var returnval = "";
            $.ajax({

                type: "POST",
                url: "ConsumerBehaviourAnalysis.aspx/Web_Categorywise_Qty_Count",
                data: "{ }",
                async: false,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {

                    alert("Error occured..");

                },
                success: function (result) {
                    var Data = result.d.toString();
                    if (Data) {
                        ret = Data
                    }
                    else {
                        ret = "";
                    }
                }
            });
            return (ret);
        }




        // Categorywise Chart 
       
        function drawBasic1(jsonResult) {
            var Categorydata = new google.visualization.DataTable();
            Categorydata.addColumn('string', 'CategoryName');
            Categorydata.addColumn('number', 'Qty');
            var catjsonvalue = JSON.parse(CategorywiseHeader5());
            catjsonvalue.forEach(function (item) {
            Categorydata.addRow([item.CategoryName, item.Qty]);

            });


            var options = {
                title: 'Categorywise Sold by Qty',
                hAxis: {
                    title: 'Category Name',
                    format: '',
                    /*viewWindow: {
                      min: [7, 30, 0],
                      max: [19, 30, 0]
                    }*/
                },
                vAxis: {
                    title: 'Qty'
                }
            };

            // Call the Categorywise  Amoutn Pie chart Function
            byCategorywiseAmount();

            function selectHandler() {
                var selection = chart3.getSelection();
                if (selection.length > 0) {
                    var myBranchdata = Categorydata.getValue(selection[0].row, 0);
                }
            }

            var chart3 = new google.visualization.BarChart(
                document.getElementById('chart_div'));
            google.visualization.events.addListener(chart3, 'select', selectHandler);
            chart3.draw(Categorydata, options);
        }
        function byCategorywiseAmount() {


            var Category_amt = new google.visualization.DataTable();
            Category_amt.addColumn('string', 'CategoryName');
            Category_amt.addColumn('number', 'Amount');

            var Category_amt_jsonvalue = JSON.parse(GetCateogorywiseAmount());
            Category_amt_jsonvalue.forEach(function (item) {
                Category_amt.addRow([item.CategoryName, item.Amount]);

            });




            var options = {
                title: 'CategoryWise  Sold By  Amount',
                hAxis: {
                    title: 'Category Name',
                    format: '',
                    /*viewWindow: {
                      min: [7, 30, 0],
                      max: [19, 30, 0]
                    }*/
                },
                vAxis: {
                    title: 'Amount'
                }
            };

            function selectHandler() {
                var selection = chart4.getSelection();
                if (selection.length > 0) {
                    var myBranchdata = Category_amt.getValue(selection[0].row, 0);
                }
            }

            var chart4 = new google.visualization.PieChart(
                document.getElementById('chart_div_1'));
            google.visualization.events.addListener(chart4, 'select', selectHandler);
            chart4.draw(Category_amt, options);
        }
        function GetCateogorywiseAmount() {

            var returnval = "";
            $.ajax({

                type: "POST",
                url: "ConsumerBehaviourAnalysis.aspx/Web_Categorywise_Amount",
                data: "{ }",
                async: false,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {

                    alert("Error occured..");

                },
                success: function (result) {
                    var Data = result.d.toString();
                    if (Data) {
                        ret = Data
                    }
                    else {
                        ret = "";
                    }
                }
            });
            return (ret);
        }


        //#3.  Customer -> Functions
        function CustomerwiseHeader5() {

            var returnval = "";
            $.ajax({

                type: "POST",
                url: "ConsumerBehaviourAnalysis.aspx/Web_Customerwise_Qty_Count",
                data: "{ }",
                async: false,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {

                    alert("Error occured..");

                },
                success: function (result) {
                    var Data = result.d.toString();
                    if (Data) {
                        ret = Data
                    }
                    else {
                        ret = "";
                    }
                }
            });
            return (ret);
        }


       
        //Customer wise Chart 
       
        function drawBasic2() {


            var customerdata = new google.visualization.DataTable();

            customerdata.addColumn('string', 'CustomerNumber');
            customerdata.addColumn('number', 'Qty');

            var customerJSONvalue =JSON.parse(CustomerwiseHeader5()) ;
            customerJSONvalue.forEach(function (item) {
                customerdata.addRow([item.CustomerNumber, item.Qty]);

            });




            var options = {
                title: 'Customer wise Product Sold By Qty',
                hAxis: {
                    title: 'Customer Name',
                    format: '',
                    /*viewWindow: {
                      min: [7, 30, 0],
                      max: [19, 30, 0]
                    }*/
                },
                vAxis: {
                    title: 'Qty'
                }
            };

            // Call the  Customerwise Amoutn Pie chart Function
            byCustomerwiseAmount();  

            function selectHandler() {
                var selection = chart5.getSelection();
                if (selection.length > 0) {
                    var myBranchdata = customerdata.getValue(selection[0].row, 0);
                }
            }

            var chart5 = new google.visualization.BarChart(
                document.getElementById('chart_div'));
            google.visualization.events.addListener(chart5, 'select', selectHandler);
            chart5.draw(customerdata, options);
        }

        function byCustomerwiseAmount() {


            var Customer_amt = new google.visualization.DataTable();
            Customer_amt.addColumn('string', 'CustomerNumber');
            Customer_amt.addColumn('number', 'Amount');

            var Customer_amt_amt_jsonvalue = JSON.parse(GetCustomerwiseAmount());
            Customer_amt_amt_jsonvalue.forEach(function (item) {
                Customer_amt.addRow([item.CustomerNumber, item.Amount]);

            });

            var options = {
                title: 'Customer Wise Product Sold By Amount',
                hAxis: {
                    title: 'Customer Name',
                    format: '',
                    /*viewWindow: {
                      min: [7, 30, 0],
                      max: [19, 30, 0]
                    }*/
                },
                vAxis: {
                    title: 'Amount'
                }
            };

            function selectHandler() {
                var selection = chart6.getSelection();
                if (selection.length > 0) {
                    var myBranchdata = Customer_amt.getValue(selection[0].row, 0);
                }
            }

            var chart6 = new google.visualization.PieChart(
                document.getElementById('chart_div_1'));
            google.visualization.events.addListener(chart6, 'select', selectHandler);
            chart6.draw(Customer_amt, options);
        }

        function GetCustomerwiseAmount() {

            var returnval = "";
            $.ajax({

                type: "POST",
                url: "ConsumerBehaviourAnalysis.aspx/Web_Customerwise_Amount",
                data: "{ }",
                async: false,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {

                    alert("Error occured..");

                },
                success: function (result) {
                    var Data = result.d.toString();
                    if (Data) {
                        ret = Data
                    }
                    else {
                        ret = "";
                    }
                }
            });
            return (ret);
        }




    </script>
    <link type="text/css" rel="Stylesheet" href="css/NestedDG.css" />
    <style type="text/css">
        @media only screen and (max-width: 600px) {
            table, th, td {
                font-size: 10px;
                font-weight: bold;
            }

            .Labels {
                font-size: 10px;
            }

            .alnright {
                text-align: right;
            }
        }
    </style>
    <style type="text/css">
        .overlay {
            position: fixed;
            top: 0px;
            left: 0px;
            z-index: 0;
            height: 100%;
            width: 100%;
            top: 0;
            background-color: White;
            filter: alpha(opacity=60);
            opacity: 0.9;
            -moz-opacity: 1;
        }

        .LoadingDivCss {
            margin: 0;
            position: absolute;
            top: 50%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -50%);
        }

        .LoadingImgCss {
            height: 100px;
            width: 100px;
        }
    </style>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">


    <div align="left">

        <asp:Button ID="btnExcel" runat="server" Text="Export"
            ToolTip="To Export the Report Click Here" CssClass="btn btn-success btn-xs"
            OnClick="btnExcel_Click" />
    </div>
    <asp:UpdatePanel ID="Upanel" runat="server">
        <ContentTemplate>


            <div class="section-block">
                <h5 class="section-title">Consumer Behaviour Analysis    
                </h5>
            </div>

            <div class="row">
                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                    <div class="card">

                        <div class="card-body">
                            <div class="form-row">
                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                    <caption>
                                        <label for="validationCustom03">
                                            From
                                        </label>

                                        <asp:TextBox ID="txtFromDt" class="form-control" runat="server"
                                            Font-Size="Small"></asp:TextBox>
                                        <asp:CalendarExtender ID="calFirstDueDate" Format="yyyy-MM-dd" runat="server" TargetControlID="txtFromDt"
                                            PopupPosition="BottomLeft" FirstDayOfWeek="Sunday"></asp:CalendarExtender>
                                    </caption>
                                </div>
                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                    <label for="validationCustom03">
                                        To
                                    </label>

                                    <asp:TextBox ID="txtToDt" runat="server" class="form-control"
                                        Font-Size="Small"></asp:TextBox>
                                    <asp:CalendarExtender ID="CalendarExtender1" Format="yyyy-MM-dd" runat="server" TargetControlID="txtToDt"
                                        PopupPosition="BottomLeft" FirstDayOfWeek="Sunday"></asp:CalendarExtender>
                                </div>
                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                    <label for="validationCustom03">
                                        Branch
                                        <asp:Label ID="lblBranchAliasName" ForeColor="Blue" runat="server"></asp:Label></label>
                                    <asp:DropDownList ID="cmbBranches" CssClass="custom-select"
                                        runat="server" AutoPostBack="true"
                                        OnSelectedIndexChanged="cmbBranches_SelectedIndexChanged">
                                    </asp:DropDownList>
                                </div>

                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                    <caption>
                                        <label for="validationCustom03">
                                            Select By
                                        </label>
                                        <asp:DropDownList ID="CmbSelect" runat="server" CssClass="custom-select" AutoPostBack="true"
                                            OnSelectedIndexChanged="cmbSelect_SelectedIndexChanged">
                                            <asp:ListItem Text="Itemwise" Value="Itemwise"></asp:ListItem>
                                            <asp:ListItem Text="Categorywise" Value="Categorywise"></asp:ListItem>
                                            <asp:ListItem Text="Memberwise" Value="Memberwise"></asp:ListItem>
                                        </asp:DropDownList>
                                    </caption>
                                </div>




                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                    <caption>
                                        <label for="validationCustom03">
                                            Search By:
                                        </label>
                                        <asp:DropDownList ID="cmbSelectby" runat="server" CssClass="custom-select" OnSelectedIndexChanged="cmbSelectby_SelectedIndexChanged"
                                            AutoPostBack="true">
                                            <asp:ListItem Text="All Inventory" Value="AInventory"></asp:ListItem>
                                            <asp:ListItem Text="Category" Value="Category"></asp:ListItem>
                                            <asp:ListItem Text="Single Inventory" Value="SInventory"></asp:ListItem>
                                            <asp:ListItem Text="Customer" Value="Customer"></asp:ListItem>
                                        </asp:DropDownList>
                                    </caption>
                                </div>
                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                    <label for="validationCustom03" style="font-color: white">
                                        ID
                                    </label>
                                    <asp:TextBox ID="txtID" class="form-control" runat="server" ReadOnly="false" OnTextChanged="txtID_OnTextChange"></asp:TextBox>
                                </div>
                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2" runat="server" visible="false">
                                    <label for="validationCustom03">
                                        Name</label>
                                    <asp:TextBox ID="txtName" class="form-control" runat="server" ReadOnly="false" OnTextChanged="txtName_OnTextChange"></asp:TextBox>
                                </div>
                                <br />
                                <br />
                                
                           
                                <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">

                                    <asp:Button ID="btnApplySearch" runat="server" Text="Update"
                                     CssClass="btn btn-primary px-4 py-2"
                                     OnClick="btnApplySearch_Click" />
                                </div>
                               

                                <br />

                               
                                <p>
                                    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                        <div class="card">
                                            <h5 id="idSearch" runat="server" class="card-header">
                                                <asp:Label ID="lblSearchResult" runat="server" CssClass="Labels"> </asp:Label>
                                                <%--This Code for Image validation   Msg --%></h5>
                                            <%-- <div class="card-header">
                                                <div>
                                                    <asp:Label ID="lblSearchResult" runat="server" CssClass="Labels"> </asp:Label>
                                                </div>
                                            </div>--%>
                                            <div class="card-body">
                                                <div class="table-responsive">
                                                    <table id="example" class="table table-striped table-bordered second" style="width: 100%">
                                                        <tbody>
                                                            <caption>
                                                                <asp:Panel ID="Panel8" runat="server" BackColor="white" Height="180px" ScrollBars="Auto" Width="1500px">
                                                                    <asp:GridView ID="grv" runat="server" AllowPaging="true" AllowSorting="true" AutoGenerateColumns="False" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3" DataKeyNames="row1" EmptyDataRowStyle-CssClass="alert-dark" EmptyDataText="No Record! " Font-Size="11px" FooterStyle-BackColor="Green" FooterStyle-ForeColor="white" HeaderStyle-BackColor="RoyalBlue" PageSize="150" Width="920px">
                                                                        <Columns>
                                                                            <asp:TemplateField>
                                                                                <ItemTemplate>
                                                                                    <asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="true" OnCheckedChanged="CheckBox_Changed" onclick="CheckOne(this)" />
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:TemplateField HeaderText="Number" ItemStyle-HorizontalAlign="Left" Visible="true">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="lblrow1" runat="server" Text='<%#Eval("row1") %>'></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:TemplateField HeaderText="Name" ItemStyle-HorizontalAlign="Left">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="lblrow2" runat="server" Text='<%#Eval("row2") %>'></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:TemplateField HeaderText="" ItemStyle-HorizontalAlign="Left">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="lblrow3" runat="server" Text='<%#Eval("row3") %>'></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                        </Columns>
                                                                        <PagerStyle CssClass="gridview" />
                                                                        <FooterStyle BackColor="#006699" ForeColor="White" />
                                                                        <HeaderStyle BackColor="White" Font-Bold="True" ForeColor="Black" />
                                                                        <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
                                                                        <RowStyle ForeColor="#000066" />
                                                                        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
                                                                        <SortedAscendingCellStyle BackColor="#F1F1F1" />
                                                                        <SortedAscendingHeaderStyle BackColor="#007DBB" />
                                                                        <SortedDescendingCellStyle BackColor="#CAC9C9" />
                                                                        <SortedDescendingHeaderStyle BackColor="#00547E" />
                                                                    </asp:GridView>
                                                                </asp:Panel>
                                                            </caption>
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <p>
                                    </p>
                                    <p>
                                    </p>
                                    <p>
                                    </p>
                                    <p>
                                    </p>
                                    <p>
                                    </p>
                                    <p>
                                    </p>
                                    <p>
                                    </p>
                                    <p>
                                    </p>
                                </p>








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

            <div align="left">
                <asp:Button ID="btnGenerate" runat="server" Text="Generate Report" Class="btn btn-primary"
                    OnClick="btnGenerate_Click" />
                <%--<asp:Button ID="btnGenerateReport" runat="server"  Text="Apply1" Class="btn btn-primary" 
                        OnClick="btnGenerateReport_Click"/>--%>
            </div>
            <asp:HiddenField ID="hidDropdownValue" runat="server" ClientIDMode="Static" />

            <br />


            <%--            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="card">
                    <h5 class="card-header" id="idItemwise" runat="server">
                        <asp:Label ID="Label1" runat="server" CssClass="Labels"></asp:Label>
                    </h5>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table id="Table2" class="table table-striped table-bordered second" style="width: 100%">
                                &nbsp;&nbsp;&nbsp;
                                <div id="chart_div">

                                </div>
                                <asp:Literal ID="FCLiteral1" runat="server" Visible="false"></asp:Literal>
                                <asp:Literal ID="lt" runat="server"></asp:Literal>
                                <asp:Label ID="lblGreeting" runat="server"></asp:Label>
                                <br />
                            </table>
                        </div>
                    </div>
                </div>
            </div>          --%>

            <%--                <div>  
                   
                    <asp:GridView ID="gvData" runat="server">  
                    </asp:GridView>  
                    <br />  
                    <br />  
                    <asp:Literal ID="ltScripts" runat="server"></asp:Literal>  
                    <div id="chart_div" >  
                    </div>  
                </div>  
            --%>



            <%--<div style="margin-left: 0px;">
<div class="container-fluid  dashboard-content">
<div class="row">--%>

            <div class="row">
                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                    <div class="card">


                        <h4 class="card-header" id="idGenReport" runat="server">
                            <asp:Label ID="lblMsgTotalSelection" runat="server" CssClass="Labels"> </asp:Label></h4>
                        <%--<asp:Button ID="btnPdf" runat="server" Text="PDF" 
            ToolTip="To Export  the Report Click Here"  CssClass="btn btn-secondary" 
            onclick="btnPdf_Click"/>--%>  
        </h4>
 


                        <div class="card-body">
                            <div class="table-responsive">
                                <div align="center">
                                    <table id="example4" class="table table-striped table-bordered" style="width: 100%">
                                        <tbody>
                                            <caption>

                                                <div align="center">
                                                    <%-- For Itemwise and Categorywise Report--%>
                                                    <%--DataKeyNames="Barcode" --%>
                                                    <asp:GridView ID="GridView1"
                                                        runat="server" ShowFooter="true" BorderColor="Transparent"
                                                        AutoGenerateColumns="True" Font-Size="13px"
                                                        OnRowDataBound="GridView1_RowDataBound" Width="100%" EmptyDataText="No Record Found !"
                                                        OnPageIndexChanging="GridView1_PageIndexChanging" AllowPaging="True" PageSize="20">

                                                        <HeaderStyle CssClass="dataTable" />
                                                        <HeaderStyle BackColor="White" ForeColor="Black" />
                                                        <FooterStyle BackColor="White" ForeColor="Black" />
                                                        <%--<AlternatingRowStyle CssClass="dataTableAlt" />--%>
                                                        <RowStyle CssClass="dataTable" />

                                                        <%--    <Columns>
    <asp:TemplateField>
        <ItemTemplate>
        <a href="javascript:switchViews('div<%# Eval("TransID") %>', 'one');">
        <img id="imgdiv<%# Eval("TransID") %>" alt="Click to show/hide Details" border="0" src="IMG/plus.gif" />
        </a>
        </ItemTemplate>
        <AlternatingItemTemplate>
        <a href="javascript:switchViews('div<%# Eval("TransID") %>', 'alt');">
        <img id="imgdiv<%# Eval("TransID") %>" alt="Click to show/hide Details" border="0" src="IMG/plus.gif" />
        </a>
        </AlternatingItemTemplate>
    </asp:TemplateField>

    <asp:BoundField DataField="Barcode" HeaderText="Barcode"  HeaderStyle-HorizontalAlign="Left"  HtmlEncode="False" ItemStyle-HorizontalAlign="left" ItemStyle-Width="10%"  />
    <asp:BoundField DataField="Name" HeaderText="Name"  HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="10%" />
    <asp:BoundField DataField="InventoryDesc" HeaderText="Description"  HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="20%" />
    <asp:BoundField DataField="Qty" HeaderText="Qty"  HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="15%" />
    <asp:BoundField DataField="QtyPercentage" HeaderText="Qty %"  HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="15%" />
    <asp:BoundField DataField="Amount" HeaderText="Amount"  HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="15%" />
    <asp:BoundField DataField="AmountPercentage" HeaderText="Amount %"  HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="15%" />

    
    </Columns>--%>

                                                        <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
                                                        <RowStyle ForeColor="#000066" />
                                                        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
                                                        <SortedAscendingCellStyle BackColor="#F1F1F1" />
                                                        <SortedAscendingHeaderStyle BackColor="#007DBB" />
                                                        <SortedDescendingCellStyle BackColor="#CAC9C9" />
                                                        <SortedDescendingHeaderStyle BackColor="#00547E" />
                                                    </asp:GridView>
                                                </div>

                                                <div align="center">
                                                    <%-- For Memberwise Report--%>
                                                    <asp:GridView ID="GridView2"
                                                        runat="server" ShowFooter="true" BorderColor="Transparent"
                                                        DataKeyNames="CustomerNumber" AutoGenerateColumns="False" Font-Size="13px"
                                                        OnRowDataBound="GridView2_RowDataBound" Width="100%" EmptyDataText=""
                                                        OnPageIndexChanging="GridView2_PageIndexChanging" AllowPaging="True" PageSize="20">

                                                        <HeaderStyle CssClass="dataTable" />
                                                        <HeaderStyle BackColor="White" ForeColor="Black" />
                                                        <FooterStyle BackColor="White" ForeColor="Black" />
                                                        <%--<AlternatingRowStyle CssClass="dataTableAlt" />--%>
                                                        <RowStyle CssClass="dataTable" />

                                                        <Columns>
                                                            <asp:TemplateField>
                                                                <ItemTemplate>
                                                                    <a href="javascript:switchViews('div<%# Eval("CustomerNumber") %>', 'one');">
                                                                        <img id="imgdiv<%# Eval("CustomerNumber") %>" alt="Click to show/hide Details" border="0" src="IMG/plus.gif" />
                                                                    </a>
                                                                </ItemTemplate>
                                                                <AlternatingItemTemplate>
                                                                    <a href="javascript:switchViews('div<%# Eval("CustomerNumber") %>', 'alt');">
                                                                        <img id="imgdiv<%# Eval("CustomerNumber") %>" alt="Click to show/hide Details" border="0" src="IMG/plus.gif" />
                                                                    </a>
                                                                </AlternatingItemTemplate>
                                                            </asp:TemplateField>

                                                            <asp:BoundField DataField="CustomerNumber" HeaderText="CustomerNumber" HeaderStyle-HorizontalAlign="Left" HtmlEncode="False" ItemStyle-HorizontalAlign="left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="Qty" HeaderText="Qty" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="TaxAmount1" HeaderText="TaxAmount1" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="TaxAmount2" HeaderText="TaxAmount2" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="TaxAmount3" HeaderText="TaxAmount3" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="ItemDisc" HeaderText="ItemDisc" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="MemberDisc" HeaderText="MemberDisc" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="TotalDisc" HeaderText="TotalDisc" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="11%" />
                                                            <asp:BoundField DataField="Amount" HeaderText="Amount" HtmlEncode="False" ItemStyle-HorizontalAlign="left" HeaderStyle-CssClass="text-left" ItemStyle-Width="12%" />

                                                            <asp:TemplateField>
                                                                <ItemTemplate>
                                                                    <tr>
                                                                        <td colspan="100%">
                                                                            <div id="div<%# Eval("CustomerNumber") %>" style="display: none; position: relative; left: 5px;">

                                                                                <asp:GridView ID="GridView3" runat="server" Width="93%"
                                                                                    AutoGenerateColumns="false" DataKeyNames="TransID"
                                                                                    EmptyDataText="No Details">
                                                                                    <HeaderStyle CssClass="dataTable" />
                                                                                    <RowStyle CssClass="dataTable" />
                                                                                    <Columns>
                                                                                        <asp:BoundField DataField="TransID" HeaderText="TransID" HeaderStyle-HorizontalAlign="Left" HtmlEncode="False" ItemStyle-HorizontalAlign="left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="TransNo" HeaderText="TransNo" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="TransDate" HeaderText="TransDate" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="Barcode" HeaderText="Barcode" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="Name" HeaderText="Name" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="InventoryDesc" HeaderText="InvDesc" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="10%" />
                                                                                        <asp:BoundField DataField="CategoryName" HeaderText="CatName" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="Price" HeaderText="Price" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="Qty" HeaderText="Qty" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="TaxAmount1" HeaderText="Tax1" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="TaxAmount2" HeaderText="Tax2" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="TaxAmount3" HeaderText="Tax3" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="ItemDisc" HeaderText="ItemDisc" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="MemberDisc" HeaderText="MemberDisc" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="TotalDisc" HeaderText="TotalDisc" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="UnitCost" HeaderText="UnitCost" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                        <asp:BoundField DataField="Amount" HeaderText="Amount" HeaderStyle-HorizontalAlign="Left" HeaderStyle-CssClass="text-left" HtmlEncode="False" ItemStyle-HorizontalAlign="Left" ItemStyle-Width="5%" />
                                                                                    </Columns>
                                                                                </asp:GridView>


                                                                            </div>

                                                                        </td>
                                                                    </tr>
                                                                    </tr>
                                                                </ItemTemplate>
                                                            </asp:TemplateField>



                                                        </Columns>

                                                        <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
                                                        <RowStyle ForeColor="#000066" />
                                                        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
                                                        <SortedAscendingCellStyle BackColor="#F1F1F1" />
                                                        <SortedAscendingHeaderStyle BackColor="#007DBB" />
                                                        <SortedDescendingCellStyle BackColor="#CAC9C9" />
                                                        <SortedDescendingHeaderStyle BackColor="#00547E" />
                                                    </asp:GridView>
                                                </div>

                                            </caption>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

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





            <script type="text/javascript">
                function switchViews(obj, row) {
                    var div = document.getElementById(obj);
                    var img = document.getElementById('img' + obj);

                    if (div.style.display == "none") {
                        div.style.display = "inline";
                        img.src = "IMG/minus.gif";
                    } else {
                        div.style.display = "none";
                        img.src = "IMG/plus.gif";
                    }
                }
            </script>







            <div class="row">
                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                    <div class="card">
                        <table>
                            <tr>
                                <td>
                                    <div id="chart_div" style="width: 900px; height: 500px;" > </div>
                                </td>
                                <td>
                                    <div id="chart_div_1" style="width: 700px; height: 500px;"></div>
                                </td>

                            </tr>
                        </table>




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

   



            <!--Headers included in  bottom -->
            <meta charset='utf-8'>
            <meta http-equiv='X-UA-Compatible' content='IE=edge'>
            <meta name='viewport' content='width=device-width, initial-scale=1'>
            <script src="https://www.gstatic.com/charts/loader.js" type="text/javascript"></script>
            <%--<script src="Charts/consumer.js" type="text/javascript"></script>--%>
        </ContentTemplate>

    </asp:UpdatePanel>



    <asp:UpdateProgress ID="UpdateProgress" runat="server" AssociatedUpdatePanelID="Upanel">
        <ProgressTemplate>
            <div class="overlay">

                <div class="LoadingDivCss">
                    <img alt="" src="IMG/Spinner.gif" class="LoadingImgCss" />
                </div>
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>


<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css?v=1.1" rel="stylesheet" />
<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" />
<!-- Optional Bootstrap Icons -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet" />



</asp:Content>

