<%@ Page Title="Hourly Sale Report" Language="C#" MasterPageFile="~/SunMaster.Master"
    AutoEventWireup="true" CodeBehind="HourlySale.aspx.cs" Inherits="SUNWEB.HourlySale" %>

<%@ 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 src="scripts/ScrollableGridPlugin.js" type="text/javascript"></script>
    <style type="text/css">
        @media only screen and (max-width: 600px)
        {
            table, th, td
            {
                font-size: 10px;
                font-weight: bold;
            }
        
            .Labels
            {
                font-size: 12px;
            }
            .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>

    <!-- Newlu added code For Selected Menu items  stays same selection mode -->

    <script type="text/javascript">

        $(document).ready(function () {
            Callit(localStorage.getItem("PageValue"));

        });


        function Demo(anchor) {
            var values = anchor.getAttribute('value');
            localStorage.setItem("PageValue", values);
            console.log("Initial Session Value:" + localStorage.getItem("PageValue"));
            Callit(localStorage.setItem("PageValue", values))
        }


        function Callit(pagevalue) {
            if (pagevalue == "Reports") {
                // Assing the session  submenu collapse show
                console.log("Reports:Selection" + pagevalue);
                document.getElementById('submenu6').className = "submenu collapse show";  // Active value
                document.getElementById('submenu7').className = "submenu collapse";
                document.getElementById('submenu8').className = "submenu collapse";
                document.getElementById('submenu9').className = "submenu collapse";
                document.getElementById('submenu10').className = "submenu collapse";
                document.getElementById('submenu11').className = "submenu collapse";
                document.getElementById('submenu12').className = "submenu collapse";
                document.getElementById('submenu13').className = "submenu collapse";
            }
            else if (pagevalue == "Modules") {

                console.log("Modules:Selection " + pagevalue);
                document.getElementById('submenu6').className = "submenu collapse";
                document.getElementById('submenu7').className = "submenu collapse show"; // Active value
                document.getElementById('submenu8').className = "submenu collapse";
                document.getElementById('submenu9').className = "submenu collapse";
                document.getElementById('submenu10').className = "submenu collapse";
                document.getElementById('submenu11').className = "submenu collapse";
                document.getElementById('submenu12').className = "submenu collapse";
                document.getElementById('submenu13').className = "submenu collapse";
            }
            else if (pagevalue == "Stock") {
                console.log("Stock:Selection " + pagevalue);
                document.getElementById('submenu7').className = "submenu collapse";
                document.getElementById('submenu6').className = "submenu collapse";
                document.getElementById('submenu8').className = "submenu collapse show";   // Active value
                document.getElementById('submenu9').className = "submenu collapse";
                document.getElementById('submenu10').className = "submenu collapse";
                document.getElementById('submenu11').className = "submenu collapse";
                document.getElementById('submenu12').className = "submenu collapse";
                document.getElementById('submenu13').className = "submenu collapse";
            }
            else if (pagevalue == "Synchronise") {
                console.log("Synchronise:Selection " + pagevalue);
                document.getElementById('submenu7').className = "submenu collapse";
                document.getElementById('submenu6').className = "submenu collapse";
                document.getElementById('submenu8').className = "submenu collapse";
                document.getElementById('submenu9').className = "submenu collapse show";   // Active value
                document.getElementById('submenu10').className = "submenu collapse";
                document.getElementById('submenu11').className = "submenu collapse";
                document.getElementById('submenu12').className = "submenu collapse";
                document.getElementById('submenu13').className = "submenu collapse";
            }
            else if (pagevalue == "Customer") {
                console.log("Cuseromer:Selection " + pagevalue);
                document.getElementById('submenu7').className = "submenu collapse";
                document.getElementById('submenu6').className = "submenu collapse";
                document.getElementById('submenu8').className = "submenu collapse";
                document.getElementById('submenu9').className = "submenu collapse";
                document.getElementById('submenu10').className = "submenu collapse show";   // Active value
                document.getElementById('submenu11').className = "submenu collapse";
                document.getElementById('submenu12').className = "submenu collapse";
                document.getElementById('submenu13').className = "submenu collapse";
            }

            else if (pagevalue == "Web") {

                console.log("Web:Selection " + pagevalue);
                document.getElementById('submenu6').className = "submenu collapse";
                document.getElementById('submenu7').className = "submenu collapse";
                document.getElementById('submenu8').className = "submenu collapse";
                document.getElementById('submenu9').className = "submenu collapse";
                document.getElementById('submenu10').className = "submenu collapse";
                document.getElementById('submenu11').className = "submenu collapse show";   // Active value
                document.getElementById('submenu12').className = "submenu collapse";
                document.getElementById('submenu13').className = "submenu collapse";
            }
            else if (pagevalue == "CRM") {

                console.log("Crm:Selection " + pagevalue);
                document.getElementById('submenu6').className = "submenu collapse";
                document.getElementById('submenu7').className = "submenu collapse";
                document.getElementById('submenu8').className = "submenu collapse";
                document.getElementById('submenu9').className = "submenu collapse";
                document.getElementById('submenu10').className = "submenu collapse";
                document.getElementById('submenu11').className = "submenu collapse";
                document.getElementById('submenu12').className = "submenu collapse show";   // Active value
                document.getElementById('submenu13').className = "submenu collapse";
            }

            else if (pagevalue == "USER") {

                console.log("USER:Selection " + pagevalue);
                document.getElementById('submenu6').className = "submenu collapse";
                document.getElementById('submenu7').className = "submenu collapse";
                document.getElementById('submenu8').className = "submenu collapse";
                document.getElementById('submenu9').className = "submenu collapse";
                document.getElementById('submenu10').className = "submenu collapse";
                document.getElementById('submenu11').className = "submenu collapse";
                document.getElementById('submenu12').className = "submenu collapse";
                document.getElementById('submenu13').className = "submenu collapse show";   // Active value
            }

        }


    </script>




    <script type="text/javascript">
        $(document).ready(function ()
        {  // Datagrid Header Freeze
            $('#<%=GridView1.ClientID %>').Scrollable({
                ScrollHeight: 200
            });
        });
    </script>
    <link type="text/css" rel="Stylesheet" href="css/style.css" />
    <link rel="shortcut icon" href="IMG/logo.png" />
    <script type="text/javascript" language="JavaScript" src="js/FusionCharts.js"></script>
    <script type="text/javascript" language="JavaScript">
        function myJS(myVar) {
            window.alert(myVar);
        }      
    </script>
    <link type="text/css" rel="Stylesheet" href="css/style.css" />
    <script language="javascript" type="text/javascript">
        function checkNumber(evt) {
            evt = (evt) ? evt : window.event
            var charCode = (evt.which) ? evt.which : evt.keyCode
            if (charCode > 31 && (charCode < 48 || charCode > 57))
            {
                status = "This field accepts numbers only."
                return false
            }
            status = ""
            return true
        }
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div align="left">
        <asp:Button ID="Button1" runat="server" CssClass="btn btn-success btn-xs" OnClick="btnExcel_Click"
            Text="Excel" BackColor="Green" BorderColor="Green" ToolTip="To Export the Report Click Here" />
    </div>
    <asp:UpdatePanel ID="Upanel" runat="server">
        <ContentTemplate>
            <div class="section-block">
                <h6 class="section-title">
                 HOURLY SALES REPORT
                </h6>
            </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="txtStartDt" class="form-control" runat="server"></asp:TextBox>
                                    <asp:CalendarExtender ID="calFirstDueDate" Format="yyyy-MM-dd" runat="server" TargetControlID="txtStartDt"
                                        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="txtEndDt" class="form-control" runat="server"></asp:TextBox>
                                <asp:CalendarExtender ID="CalendarExtender1" Format="yyyy-MM-dd" runat="server" TargetControlID="txtEndDt"
                                    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">
                                <asp:Button ID="btnGetReports" runat="server" Text="Apply" CssClass="btn btn-primary"
                                    OnClick="btnGetReports_Click" OnClientClick="return validate()" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            </div>
            <%--<asp:Button ID="btnPdf" runat="server" Text="PDF" 
            ToolTip="To Export  the Report Click Here"  CssClass="btn btn-secondary" 
            onclick="btnPdf_Click"/>--%>

            <div class="row">
            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="card">
                    <h5 class="card-header" id="idHourly" 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>

            <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-header" id="idGenReport" runat="server">
                        <asp:Label ID="lblMsgTotalSelection" runat="server" CssClass="Labels"></asp:Label>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table id="Table1" class="table table-striped table-bordered second" style="width: 100%">
                                <tbody>
                                    <caption>
                                          <asp:Panel ID="Panel8" runat="server" BackColor="white" Height="520px" ScrollBars="Auto"
                                            Width="1500px">
                                        <asp:GridView ID="GridView1" EnableViewState="false" runat="server" Width="1450px"
                                            AutoGenerateColumns="False" OnDataBound="OnDataBound" OnRowCreated="GridView1_RowCreated"
                                            Font-Size="12px" BorderStyle="None" BorderWidth="1px" CellPadding="3" EmptyDataText="No Data Found Between these Dates !">
                                            <Columns>
                                                <asp:BoundField DataField="Hour" HeaderText="HOUR" ItemStyle-Width="80">
                                                    <ItemStyle Width="90px"></ItemStyle>
                                                </asp:BoundField>
                                                <asp:BoundField DataField="BarCode" HeaderText="BARCODE" ItemStyle-Width="50">
                                                    <ItemStyle Width="30px"></ItemStyle>
                                                </asp:BoundField>
                                                <asp:BoundField DataField="Name" HeaderText="NAME" ItemStyle-Width="150px">
                                                    <ItemStyle Width="150px"></ItemStyle>
                                                </asp:BoundField>

                                                
                                                <asp:BoundField DataField="InventoryDesc" HeaderText="DESCRIPTION" ItemStyle-Width="150px">
                                                    <ItemStyle Width="150px"></ItemStyle>
                                                </asp:BoundField>
                                                <asp:BoundField DataField="Qty" HeaderText="QTY" HeaderStyle-HorizontalAlign="Right"
                                                    ItemStyle-Width="30" ItemStyle-HorizontalAlign="Center">
                                                    <ItemStyle HorizontalAlign="Right" Width="5px"></ItemStyle>
                                                </asp:BoundField>
                                                <asp:BoundField DataField="Disamt" HeaderText="DISCOUNT" ItemStyle-Width="30" DataFormatString="{0:N2}"
                                                    ItemStyle-HorizontalAlign="Right">
                                                    <ItemStyle HorizontalAlign="Right" Width="30px"></ItemStyle>
                                                </asp:BoundField>
                                                <asp:BoundField DataField="Amount" HeaderText="AMOUNT" ItemStyle-Width="30" DataFormatString="{0:N2}"
                                                    ItemStyle-HorizontalAlign="Right">
                                                    <ItemStyle HorizontalAlign="Right" Width="30px"></ItemStyle>
                                                </asp:BoundField>
                                            </Columns>
                                            <FooterStyle BackColor="White" ForeColor="Black" />
                                            <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
                                            <RowStyle ForeColor="#000066" />
                                            <SortedAscendingCellStyle BackColor="#F1F1F1" />
                                            <SortedAscendingHeaderStyle BackColor="#007DBB" />
                                            <SortedDescendingCellStyle BackColor="#CAC9C9" />
                                            <SortedDescendingHeaderStyle BackColor="#00547E" />
                                        </asp:GridView>
                                       </asp:Panel>
                                    </caption>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <%-- </div>--%>
                </div>
            </div>
            </div>
        </ContentTemplate>
        <Triggers>
            <asp:PostBackTrigger ControlID="btnGetReports" />
        </Triggers>
    </asp:UpdatePanel>
    <asp:UpdateProgress ID="UpdateProgress" runat="server" AssociatedUpdatePanelID="Upanel">
        <ProgressTemplate>
            <div class="overlay">
                <%--  <div style="z-index: 1000; margin-left: 450px; margin-top: 0; opacity: 1; -moz-opacity: 1;">--%>
                <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>
