Ext.define("App.view.CustomerForm", {
    extend: "Ext.form.Panel",
    xtype: "customerForm",
    params: {},
    layout: "vbox",
    scrollable: true,

    onSave: function () {
        var me = this,
        f = me.getForm();

        if (f.isValid()) {
            f.submit({
                url: App.url("/customer/save"),
                method: 'POST',
                submitEmptyText: false,
                success: function (form, action) {
                    App.showMsg('Saved');
                    if(me.callbackOnSave){
                        me.callbackOnSave(action.result.id);
                    }
                }
            });
        }
    },

    loadForm: function(p){
        if(!p.id) return;
        var me = this,
        f = me.getForm();
        f.load({
            url: App.url("/customer/load"),
            method: 'POST',
            params:{
                id: p.id
            },
            success: function(form, action) {
                if(me.callbackOnLoad){
                    me.callbackOnLoad(form.getValues());
                }
            }
        });        
    },

    initComponent: function () {
        var me = this;

        Ext.apply(me, {
            bbar: {
                defaultButtonUI: 'default',
                layout: 'hbox',
                padding: 0,
                items: [
                    '->',
                    {
                        xtype: 'button',
                        text: App.localeRes("New Order"),
                        itemId: 'newOrderBtn',
                        ui:"green",
                        hidden: true,
                        handler: function(button, event){
                            App.loadModuleWin("orderWindow", App.localeRes("Order"), {
                                params: {
                                    custId: me.getForm().getValues().id
                                },
                                callbackOnClose: function() {
                                    me.callbackOnSave(me.getForm().getValues().id);
                                }
                            });
                        }
                    },
                    {
                        xtype: 'button',
                        text: App.localeRes('Save'),
                        ui: "blue",
                        margin: '0 0 16 0',
                        handler: function (button, event) {
                            me.onSave();
                        }
                    }
                ]
            },
            items: [
                {
                    xtype: 'hidden',
                    name: 'id'
                },
                {
                    xtype: 'container',
                    width: '100%',
                    margin: '20 0 10 0',
                    layout: 'hbox',
                    items: [
                        {
                            xtype: 'textfield',
                            fieldLabel: App.localeRes("Name"),
                            emptyText: App.localeRes("Surname")+ " *",
                            name: 'surname',
                            width: '100%',
                            flex: 5,
                            maxLength: 200,
                            allowBlank: false
                        },
                        {
                            xtype: 'textfield',
                            emptyText: App.localeRes("First Name"),
                            fieldLabel: App.localeRes("&nbsp"),
                            labelSeparator: '',
                            labelWidth: 5,
                            name: 'firstName',
                            width: '100%',
                            flex: 4,
                            maxLength: 200
                        },
                    ]
                },
                {
                    xtype: 'textfield',
                    fieldLabel: App.localeRes("Chinese Name"),
                    name: 'nameCh',
                    width: '100%',
                    maxLength: 200
                },
                {
                    xtype: 'container',
                    width: '100%',
                    margin: '0 0 10 0',
                    layout: 'hbox',
                    items: [
                        {
                            xtype: 'textfield',
                            fieldLabel: App.localeRes("Mobile"),
                            name: 'phone1',
                            flex: 5,
                            maxLength: 200
                        },
                        {
                            xtype: 'textfield',
                            name: 'phone2',
                            fieldLabel: App.localeRes("/"),
                            labelWidth: 5,
                            labelSeparator: '',
                            flex: 4,
                            maxLength: 200
                        }
                    ]
                },
                {
                    xtype: 'textfield',
                    fieldLabel: App.localeRes("Email"),
                    name: 'email',
                    width: '100%',
                    maxLength: 200
                },
                {
                    xtype: 'textarea',
                    fieldLabel: App.localeRes("Address"),
                    name: 'address',
                    width: '100%',
                    height: 80,
                    maxLength: 200
                },
                {
                    xtype: 'fieldset',
                    title: App.localeRes("Company"),
                    width: '100%',
                    items: [
                        {
                            xtype: 'textfield',
                            fieldLabel: App.localeRes("Company Name"),
                            name: 'companyName',
                            width: '100%',
                            maxLength: 200
                        },
                        {
                            xtype: 'textfield',
                            fieldLabel: App.localeRes("Phone"),
                            name: 'companyPhone',
                            width: '100%',
                            maxLength: 200
                        },
                        {
                            xtype: 'textfield',
                            fieldLabel: App.localeRes("Email"),
                            name: 'companyEmail',
                            width: '100%',
                            maxLength: 200
                        },
                        {
                            xtype: 'textarea',
                            fieldLabel: App.localeRes("Address"),
                            name: 'companyAddress',
                            width: '100%',
                            height: 80,
                            maxLength: 200
                        },
                    ]
                },
                {
                    xtype: 'customerCombo',
                    fieldLabel: App.localeRes("Referral"),
                    width: '100%',
                    name: 'ref',
                },
                {
                    xtype: 'textarea',
                    fieldLabel: App.localeRes("Remarks"),
                    name: 'remarks',
                    width: '100%',
                    height: 80,
                    maxLength: 200
                },
                {
                    xtype: 'textarea',
                    fieldLabel: App.localeRes("Tags"),
                    name: 'tag',
                    width: '100%',
                    height: 80,
                    maxLength: 200
                }
            ],
        });

        me.callParent(arguments);
    }
});
