Ext.define("App.view.GroupForm", {
    extend: "Ext.tab.Panel",
    xtype: "groupForm",
    params: {},

    bodyPadding: "10px 30px 10px 30px",

    layout: "fit",
    deferredRender: false,

    defaults: {
        scrollable: "y",
        tab: {
            iconAlign: "top"
        }
    },

    tabBar: {
        layout: {
            pack: "center"
        }
    },

    onSaveBtnClick: function(button, event) {
        var me = this,
            bi = me
                .down("#firstTab")
                .down("#infoForm")
                .getForm(),
            biV = bi.getValues(),
            user = me
                .down("#firstTab")
                .down("#userContainer")
                .down("userGridLeft"),
            userV = user.getStore().getUpdatedRecords(),
            auth = me.down("#secondTab").down("groupAuthGridLeft"),
            authV = auth.getStore().getUpdatedRecords();

        userUpdatedRecordsData = new Array();
        authUpdatedRecordsData = new Array();
        if (bi.isValid()) {
            for (i in userV) {
                userUpdatedRecordsData.push(userV[i].data);
            }
            for (i in authV) {
                authUpdatedRecordsData.push(authV[i].data);
            }
            bi.submit({
                url: App.url("/user/group/save"),
                waitMsg: "Saving",
                params: {
                    userUpdatedRecordsData: Ext.encode(userUpdatedRecordsData),
                    authUpdatedRecordsData: Ext.encode(authUpdatedRecordsData)
                },
                success: function(form, action) {
                    App.showMsg("User Group saved");
                    me.up("groupWindow").close();
                },
                failure: function(form, action) {
                    if (
                        action.response.responseText == "DataIntegrityViolation"
                    ) {
                        App.showError(
                            "Data Integrity Violation<br><br>Possible Causes:<br><br>1. Username is duplicated.<br>2. Data length exceeded max limit.<br>3. Other database error."
                        );
                    } else {
                        App.showError("Action Failed!");
                    }
                }
            });
        } else {
            App.showError("Please Enter The Correct value");
        }
    },

    onSaveAsBtnClick: function(button, event) {
        var me = this,
            bi = me.down("#firstTab").down("#basicInfoForm"),
            biV = bi.getForm().getValues(),
            part = me.down("#secondTab").down("equipmentFormPartGridRight"),
            partV = part.getStore().getData().items,
            updatedRecordsData = new Array();

        ab = bi.down("#id").setValue(null);
        if (bi.isValid()) {
            for (i in partV) {
                updatedRecordsData.push(partV[i].data);
            }
            bi.submit({
                url: App.url("/common/equipment/save"),
                waitMsg: "Saving",
                params: { updatedRecordsData: Ext.encode(updatedRecordsData) },
                success: function(form, action) {
                    App.showMsg("Equipment saved");
                    me.up("equipmentWindow").close();
                },
                failure: function(form, action) {
                    if (
                        action.response.responseText == "DataIntegrityViolation"
                    ) {
                        App.showError(
                            "Data Integrity Violation<br><br>Possible Causes:<br><br>1. Username is duplicated.<br>2. Data length exceeded max limit.<br>3. Other database error."
                        );
                    } else {
                        App.showError("Action Failed!");
                    }
                }
            });
        } else {
            App.showError("Please Enter The Correct value");
        }
    },

    initComponent: function() {
        var me = this;

        Ext.apply(me, {
            style: {
                "border-radius": "0px",
                "box-shadow": null
            },
            items: [
                {
                    title: App.localeRes("Information"),
                    iconCls: "x-fa fa-info",
                    tabIndex: 0,
                    itemId: "firstTab",
                    layout: {
                        type: "vbox",
                        align: "stretch"
                    },
                    items: [
                        {
                            xtype: "form",
                            itemId: "infoForm",
                            defaultType: "textfield",
                            flex: 1,
                            layout: "fit",
                            width: "100%",
                            defaults: {
                                labelWidth: 10,
                                labelSeparator: "",
                                anchor: "100%"
                            },
                            style: {
                                "border-radius": "0px",
                                "box-shadow": null
                            },
                            items: [
                                {
                                    xtype: "fieldset",
                                    title: App.localeRes("Basic Information"),
                                    layout: {
                                        type: "vbox",
                                        align: "strech"
                                    },
                                    defaults: {
                                        width: 500,
                                        padding: '0px 0px 0px 30px'
                                    },
                                    items: [
                                        {
                                            xtype: "textfield",
                                            name: "id",
                                            hidden:true
                                        },
                                        {
                                            xtype: "textfield",
                                            fieldLabel: App.localeRes("Name"),
                                            allowBlank: false,
                                            name: "name"
                                        },
                                        {
                                            xtype: "textarea",
                                            fieldLabel: App.localeRes(
                                                "Description"
                                            ),
                                            name: "dexcription"
                                        }
                                    ]
                                }
                            ]
                        },
                        {
                            xtype: "container",
                            itemId: "userContainer",
                            flex: 2,
                            layout: {
                                type: "hbox",
                                align: "stretch"
                            },
                            defaults: {
                                style: {
                                    margin: "5px"
                                }
                            },
                            items: [
                                {
                                    xtype: "userGridLeft",
                                    flex: 1
                                },
                                {
                                    xtype: "userGridRight",
                                    flex: 1,
                                    params: me.params
                                }
                            ]
                        }
                    ]
                },
                {
                    title: App.localeRes("Group Authority"),
                    iconCls: "x-fa fa-shield",
                    layout: "fit",
                    tabIndex: 1,
                    itemId: "secondTab",
                    items: [
                        {
                            xtype: "container",
                            layout: {
                                type: "hbox",
                                align: "stretch"
                            },
                            width: "100%",
                            defaults: {
                                style: {
                                    margin: "5px"
                                }
                            },
                            items: [
                                {
                                    xtype: "groupAuthGridLeft",
                                    title: App.localeRes("Authority"),
                                    flex: 1
                                },
                                {
                                    xtype: "groupAuthGridRight",
                                    title: App.localeRes("Selected Authority"),
                                    flex: 1,
                                    params: me.params
                                }
                            ]
                        }
                    ]
                }
            ],
            dockedItems: [
                {
                    xtype: "toolbar",
                    itemId: "bottomtoolbar",
                    dock: "bottom",
                    ui: "tools",
                    margin: 8,
                    height: 42,
                    padding: "0px 30px 0px 30px",
                    items: [
                        {
                            iconCls: "x-fa fa-lg fa-chevron-circle-left",
                            weight: -20,
                            handler: function(button) {
                                var tabIndex = me.getActiveTab().tabIndex;
                                tabIndex -= 1;
                                me.setActiveTab(tabIndex);
                            }
                        },
                        {
                            iconCls: "x-fa fa-lg fa-chevron-circle-right",
                            weight: -10,
                            handler: function(button) {
                                var tabIndex = me.getActiveTab().tabIndex;
                                tabIndex += 1;
                                me.setActiveTab(tabIndex);
                            }
                        },
                        "->",
                        {
                            text: App.localeRes('Save'),
                            ui: "blue",
                            handler: me.onSaveBtnClick,
                            margin: "2px 10px 0px 0px",
                            scope: me
                        }
                        // {
                        //     text: "Save As New",
                        //     ui: "blue",
                        //     handler: me.onSaveAsBtnClick,
                        //     scope: me
                        // }
                    ]
                }
            ]
        });

        me.callParent(arguments);
    }
});
