<%@ Page Title="Sales Invoice List" Language="C#" MasterPageFile="~/SunMaster.Master" AutoEventWireup="true" CodeBehind="SalesInvoiceList.aspx.cs" Inherits="SUNWEB.SalesInvoiceList" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

    <asp:UpdatePanel runat="server" ID="updatepanel1" UpdateMode="Conditional">
        <ContentTemplate>
            <table style="margin-left: 1%; width: 98%;">
                <tr>
                    <td style="font-size: large; width: 50%; font-family: 'Open Sans', sans-serif; font-weight: bolder;">SALES INVOICE LIST
                    </td>
                </tr>
            </table>


            <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 DATE
                                        </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 DATE
                                    </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">
                                        <asp:Label ID="lblBranchAliasName" ForeColor="Gray" runat="server" Text="Branch Name"></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=" generate()" />--%>
                                   <button type="button" class="btn btn-primary btn-sm" id="button-apply">Apply</button>
                        
                                </div>
                            </div>
                            <hr />

                            <div class="container-fluid mx-0" style="overflow-x: auto">
                                <div class="row">
                                      <div class="col-sm-2 col-md-2">
                                        <div class="container-fluid px-0 py-2">
                                            <button type="button" id="button-new-invoice" class="btn btn-primary btn-sm">New Invoice</button>
                                        </div>
                                    </div>

                                   <div class="col-sm-2 col-md-3">
                                        <div class="container-fluid px-0 py-2">
                                            <select id="selectedsearch" class="form-select rounded-0" aria-label="size 3 select example">
                                                <option value="1">All</option>
                                                <option value="2">Pending</option>
                                                <option value="3">Completed</option>
                                            </select>
                                        </div>
                                    </div>

                                </div>

                                <table class="table table table-bordered">
                                    <thead>
                                        <tr>
                                            <th scope="col" class="text-center" style="font-size: 18px">Invoce #</th>
                                            <th scope="col" style="font-size: 18px">Date</th>
                                            <th scope="col" style="font-size: 18px">Status</th>
                                            <th scope="col" style="font-size: 18px">Payment Type</th>
                                            <th scope="col" style="font-size: 18px">Amount</th>
                                            <th scope="col" style="font-size: 18px; width: 8px"></th>
                                        </tr>
                                    </thead>
                                    <tbody id="table-body-SIList">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div>
                <h4>&nbsp;<asp:Label ID="lblGreeting" runat="server"></asp:Label></h4>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
    <script type="text/javascript" src="sunScript/SIList.js"></script>
    <script type="text/javascript">

        //let selectedbranch = $("#<%=cmbBranches.ClientID %> option:selected").text();
        let fromdate = $("#<%=txtStartDt.ClientID %>").val();
        let todate = $("#<%=txtStartDt.ClientID %>").val();
        Load_SITransactionList(fromdate,todate);
<%--        ini_data(selectedbranch,fromdate,todate)--%>
        //ctl00$ContentPlaceHolder1$btnGetReports
        $( "#button-apply" ).on( "click", function() {            
            let fromdate = $("#<%=txtStartDt.ClientID %>").val();
            let todate = $("#<%=txtEndDt.ClientID %>").val();
            Load_SITransactionList(fromdate,todate);
           
        });

       

        
    </script>
</asp:Content>
