<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PaymentRequestPastel.aspx.cs" Inherits="APC.Forms.Workflow.PaymentRequestPastel" %>
<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="../../Scripts/script.js" type="text/javascript"></script>
<script type="text/javascript">
    var total = 0;
    function updateTotal(control, amount, type) 
    {
        // routine to update the total when the selection changes
        if (type == 0)
            total -= amount;
        else
            total += amount;
        control.setValue(Ext.util.Format.usMoney(total));
    }
    function getRowClass(record) {
        if (record.data.Style == 'selected') {
            return 'current-row';
        }
    }
</script>
 <style>
    .current-row .x-grid-cell, .dirty-row .x-grid-rowwrap-div
    {
        background-color:orange !important;
        color:white !important;
    }
</style>
</head>
<body>
    <form id="form1" runat="server">
     <ext:ResourceManager ID="ResourceManager" runat="server"  Theme="Gray" />
        <ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout">
        <Items>
               <ext:FormPanel ID="pnlContainer" runat="server" Layout="BorderLayout" Region="Center" Border="false">
                <Items>
            <ext:Panel Split="true" Collapsible="false" runat="server" Region="Center" Title="Outstanding Pastel Exports" ID="pnlPastelExportList" Frame="true" AutoScroll="true" Icon="Money" Layout=BorderLayout>
            <Items>
             <ext:GridPanel ID="grdData" runat="server" Region="Center">
                             <TopBar>
            <ext:Toolbar ID="Toolbar2" runat="server" Dock="Top">
            <Items>
                  <ext:ToolbarFill />                     
                        <ext:Button ID="btnRefresh" runat="server" Text="Refresh..." Icon="Reload">
                        <Listeners>
                        <Click Handler="#{grdData}.store.reload();"/>
                        </Listeners>
                         </ext:Button>
            </Items>
            </ext:Toolbar>

 </TopBar>

            <Store>
                <ext:Store ID="storeItems" runat="server" OnReadData="ItemList_Refresh">
                <Model>
                
                    <ext:Model ID="modelItems" runat="server" IDProperty="Oid">
                    <Fields>
                        <ext:ModelField Name="Type" />
                        <ext:ModelField Name="CompleteDate"  SortType=AsDate Type=Date />
                        <ext:ModelField Name="Information"/>
                        <ext:ModelField Name="Programme"/>
                        <ext:ModelField Name="Project"/>
                        <ext:ModelField Name="FileName"/>
                        <ext:ModelField Name="Amount" SortType="AsFloat" Type="Float"/>
                    </Fields>
                </ext:Model>
                </Model>
                </ext:Store>
               </Store>
                <ColumnModel>
                <Columns>
                 <ext:Column ID="colID" runat="server" Text="Request Id" DataIndex="Oid" Width="80" Sortable="True"/>
                 <ext:Column ID="colInformation" runat="server" Text="Information" DataIndex="Information" Width="200" Flex="1"/>
                 <ext:Column ID="colAmount" runat="server" Text="Amount" DataIndex="Amount" Width="150" SummaryType="Sum" Align="Right">
                     <Renderer Format="UsMoney"/>
                  </ext:Column>
                  <ext:DateColumn ID="colCompleteDate" Format="yyyy-MM-dd" runat="server" Text="Authorised Date" DataIndex="CompleteDate" Width="130" Align="Right"/>             
                  <ext:Column ID="colProgramme" runat="server" Text="Programme" DataIndex="Programme" Width="150" Sortable="True"/>
                  <ext:Column ID="colProject" runat="server" Text="Project" DataIndex="Project" Width="150"/>
            </Columns>            
        </ColumnModel> 
        <Features>               
                <ext:Summary ID="Summary1" runat="server" />                   
        </Features>
        <SelectionModel>
            <ext:CheckboxSelectionModel>
            <Listeners>
                <BeforeDeselect Handler="if (record == null) {return true;} else {return (record.data.style != 'selected');}"/>
                <BeforeSelect Handler="if (record == null) {return true;} else {return (record.data.style != 'selected');}" />
                <Select Handler="updateTotal(#{txtPaymentTotal}, record.data.Amount,1);" />
                <DeSelect Handler="updateTotal(#{txtPaymentTotal}, record.data.Amount,0);" />
            </Listeners>
        </ext:CheckboxSelectionModel>
        </SelectionModel>
           <View>
             <ext:GridView runat="server">
                 <GetRowClass Fn="getRowClass" />
            </ext:GridView>
          </View>
</ext:GridPanel>
</Items>
         </ext:Panel>
            <ext:Panel ID="pnlPastelFooterInstruct" runat="server" Title="Export Summary" Icon="Information" Margins="0 0 0 0" BodyPadding="0"  Layout="VBoxLayout" Frame="true" Visible=true Region="South">
                    <LayoutConfig>
                    <ext:VBoxLayoutConfig Align="Stretch"></ext:VBoxLayoutConfig>
                    </LayoutConfig>
                    <Items>
                        <ext:Container ID="Container1" runat="server" Layout="Column" AnchorHorizontal="100%">
                        <Items>
                            <ext:DisplayField ID="txtPaymentTotal" runat="server" FieldLabel="Export Total" ColumnWidth=".5" Padding="2" LabelStyle="font-weight:bold"/>
                            <ext:DisplayField ID="txtOutstandingTotal" runat="server" FieldLabel="Outstanding Export Total" ColumnWidth=".5" Padding="2" LabelStyle="font-weight:bold" LabelWidth="200" />
                        </Items>
                        </ext:Container>
                        
                    </Items>
            </ext:Panel>
</Items>
            <Buttons>
                <ext:Button ID="SaveButton" runat="server" Text="Update" ToolTip="click here to Update Changes" Icon="Accept">
                    <DirectEvents>
                        <Click OnEvent="SaveClick" Success="#{grdData}.store.reload();"/>
                    </DirectEvents>
                </ext:Button>
            </Buttons>
</ext:FormPanel>
        </Items>
       </ext:Viewport>
    </form>
</body>
</html>