<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Main.aspx.cs" Inherits="GigaTech.CMS.Web.Apps.MailSystem.Main" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<script language="javascript">
    var DeviceAreaList = "<%=DeviceAreaList %>";

    Ext.onReady(function () {

        Ext.QuickTips.init();

        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
            items: [{
                xtype: 'grid',
                id: 'grid1',
                title:'<%=GetGlobalResourceObject("CMSResource", "MailPackage")%>',
                border: true,
                store: Ext.create('Ext.data.Store', {
                    fields: ['Ident', 'device_id', 'addr', 'name','ol','rl','pk'],
                    autoLoad: true,
                    proxy: {
                        type: 'ajax',
                        url: 'Handler.ashx?action=GetAddrList',
                        reader: {
                            type: 'json',
                            root: 'items'
                        }
                    }
                }),
                columns: [
                    { text: '<%=GetGlobalResourceObject("CMSResource", "ResidentName")%>', dataIndex: 'name',hidden:true },
                    { text: '<%=GetGlobalResourceObject("CMSResource", "ResidentNo")%>', dataIndex: 'device_id' },
                    { text: '<%=GetGlobalResourceObject("CMSResource", "Location")%>', dataIndex: 'addr', flex: 1 },
                    { text: '<%=GetGlobalResourceObject("CMSResource", "Letter")%>', dataIndex: 'ol',width:80 },
                    { text: '<%=GetGlobalResourceObject("CMSResource", "RegLetter")%>', dataIndex: 'rl', width: 80 },
                    { text: '<%=GetGlobalResourceObject("CMSResource", "Package")%>', dataIndex: 'pk', width: 80 },
                         {
                width:100,
                renderer: function(value, meta, record) {
                    var id = Ext.id();
                    setTimeout(function () {
                        var button = Ext.create('Ext.button.Button', {
                            text: '<%=GetGlobalResourceObject("CMSResource", "MailKeyin-1")%>',
                            icon: '/Common/DMZ/Images/16x16/mail_yellow.png',
                            record: record,
                            cls: 'x-btn-default-small',
                            border: 1,
                            style: {
                                borderColor: 'gray',
                                borderStyle: 'solid'
                            },
                            handler: function () {
                                var w=Ext.create('Ext.window.Window', {
                                    title: '【' + this.record.get("addr") + '】<%=GetGlobalResourceObject("CMSResource", "MailKeyin-2")%>',
                                    layout: 'fit',
                                    modal: true,
                                    items: [

                                        {
                                            xtype: 'form',
                                            bodyPadding: 5,
                                            layout: 'anchor',
                                            border: false,
                                            url: 'Handler.ashx?action=SaveUserMailInfo',
                                            items: [
                                                                                        {
                                                                                            xtype: 'hiddenfield',
                                                                                            name: 'UserID',
                                                                                            value: this.record.get("device_id")
                                                                                        },
                                             {
                                                 xtype: 'numberfield',
                                                 anchor: '100%',
                                                 name: 'OL',
                                                 fieldLabel: '<%=GetGlobalResourceObject("CMSResource", "Letter")%>',
                                                 value: this.record.get("ol"),
                                                 minValue: 0,
                                                 allowBlank:false
                                             },
                                              {
                                                  xtype: 'numberfield',
                                                  anchor: '100%',
                                                  name: 'RL',
                                                  fieldLabel: '<%=GetGlobalResourceObject("CMSResource", "RegLetter")%>',
                                                  value: this.record.get("rl"),
                                                  minValue: 0,
                                                  allowBlank: false
                                              },
                                               {
                                                   xtype: 'numberfield',
                                                   anchor: '100%',
                                                   name: 'PK',
                                                   fieldLabel: '<%=GetGlobalResourceObject("CMSResource", "Package")%>',
                                                   value: this.record.get("pk"),
                                                   minValue: 0,
                                                   allowBlank: false
                                               }
                                            ],
                                            buttons: [
                                                {
                                                    text: '<%=GetGlobalResourceObject("CMSResource", "OK")%>',
                                                    border: 1,
                                                    style: {
                                                        borderColor: 'gray',
                                                        borderStyle: 'solid'
                                                    },
                                                    formBind: true,
                                                    handler: function () {
                                                        var form = this.up("form");
                                                        //console.log(form.url);
                                                        form.submit({
                                                            waitMsg: '<%=GetGlobalResourceObject("CMSResource", "Saving")%>',
                                                            success: function () {
                                                                var g1 = Ext.getCmp('grid1');
                                                                g1.store.load();
                                                                w.close();
                                                            }
                                                        });
                                                        
                                                    }
                                                },
                                                {
                                                    text: '<%=GetGlobalResourceObject("CMSResource", "Cancel")%>',
                                                    border: 1,
                                                    style: {
                                                        borderColor: 'gray',
                                                        borderStyle: 'solid'
                                                    },
                                                    handler: function () {
                                                        w.close();
                                                    }
                                                }
                                            ]
                                        }
                                    ]
                                }).show();
                            },
                        });
                        if (Ext.get(id)) {
                            button.render(Ext.get(id));
                        }
                    }, 1);
                    return '<div id="' + id + '"></div>';

                }
            }
                ],
                tbar: Ext.create('Ext.toolbar.Toolbar', {
                    id: 'grid_tbar'
                }),
                listeners: {
                    'itemclick': function (g, record, item, index, e, eOpts) {
                        if (record.get("device_id") != "") updateSpot('panel3');
                    }
                }
            }
            ]
        });

        var grid_tbar = Ext.getCmp("grid_tbar");

        var arrayOfStrings = DeviceAreaList.split(",");
        for (var i = 0; i < arrayOfStrings.length; i++) {

            grid_tbar.add({
                xtype: 'combo',
                id: 'comboArea_' + i,
                width: 100,
                store: Ext.create('Ext.data.Store', {
                    fields: ['abbr', 'name'],
                    //                    autoLoad: true,
                    proxy: {
                        type: 'ajax',
                        url: '/Apps/GuestSystem/Handler.ashx?action=GetDeviceAddr&Field=' + arrayOfStrings[i].split("@")[1] + '&Length=' + arrayOfStrings[i].split("@")[2],
                        extraParams: {
                            Level: i + 1,
                            Text: arrayOfStrings[i].split("@")[0]
                        },
                        reader: {
                            type: 'json',
                            root: 'data'
                        }
                    }
                }),
                editable: false,
                queryMode: 'remote',
                displayField: 'name',
                valueField: 'abbr',
                listeners: {
                    'change': function (combo, newValue, oldValue, eOpts) {
                        var index = parseInt(combo.id.split("_")[1]) + 1;
                        var obj = Ext.getCmp("comboArea_" + index);
                        if (obj) {
                            obj.store.getProxy().setExtraParam('ParentValue', combo.getValue());
                            obj.clearValue();

                            obj.store.load(function (records, operation, success) {
                                obj.setValue("-1");
                            });
                        }


                        //更新Grid List
                        var whereValue = "";
                        for (var k = 5; k >= 0; k--) {
                            var obj1 = Ext.getCmp("comboArea_" + k);
                            if (obj1) {
                                if (obj1.getValue() != "-2" && obj1.getValue() != "-1") {
                                    whereValue = obj1.getValue();
                                    break;
                                }
                            }
                        }
                        if (whereValue != null && whereValue != '') {
                            console.log(whereValue);
                            var g1 = Ext.getCmp('grid1');
                            g1.store.getProxy().setExtraParam('whereValue', whereValue);
                            g1.store.load();
                        }

                    }
                }
            });
        }
        Ext.getCmp('comboArea_0').store.load(function (records, operation, success) {
            Ext.getCmp('comboArea_0').setValue("-2");
        });

    });

</script>
<body>
    <form id="form1" runat="server">
    <div style="margin: 5">
    
    </div>
    </form>
</body>
</html>
