Ext.define("App.view.WorkshopForm", {
    extend: "Ext.form.Panel",
    xtype: "workshopForm",
    params: {},
    scrollable: true,
    layout: {
        type: 'table',
        columns: 2,
    },

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

    initComponent: function() {
        var me = this;

        me.bbar = {
            defaultButtonUI: "default",
            layout: "hbox",
            padding: 8,
            items: [
                '->',
                {
                    xtype: 'button',
                    text: App.localeRes('Save'),
                    ui: "blue",
                    handler: function(button, event){
                        var data = button.up('form').getValues();
                        Ext.Ajax.request({
                            url: App.url('/order/workshop/change-status'),
                            params: { 
                                id: data.id,
                                workshopStatus: data.workshopStatus,
                                outStatus: data.outStatus,
                            },
                            success: function(response, opts) {
                                App.showMsg('Saved');
                            },
                            failure: function(response, opts) {
                                App.showError('Cannot Save : ' + response.status);
                            },
                            scope: this
                        });
                    }
                }
            ]
        };

        me.defaults = {
            width: '90%',
        };
        me.items = [
            {
                xtype: 'hidden',
                name: 'id',
            },
            {
                xtype: 'textfield',
                fieldLabel: App.localeRes('Order No.'),
                name: 'orderNo',
                padding: '10 0 10 0',
                readOnly: true,
                fieldStyle: 'background-color: #eee;'
            },
            {
                xtype: 'workshopStatusCombo',
                name: 'workshopStatus',
                width: "100%",
                fieldLabel: App.localeRes('Status'),
            },
            {
                xtype: 'textfield',
                fieldLabel: App.localeRes('Ref. To'),
                name: 'refNo',
                readOnly: true,
                fieldStyle: 'background-color: #eee;'
            },
            {
                xtype: 'textarea',
                fieldLabel: App.localeRes('Receive Remarks'),
                name: "outRemark",
                width: "100%",
                rowspan: 2,
                maxLength: 200,
                height: 70,
                readOnly: true,
                fieldStyle: 'background-color: #eee;'
            },
            {
                xtype: 'customerCombo',
                fieldLabel: App.localeRes('Customer'),
                name: 'custId',
                readOnly: true,
                fieldStyle: 'background-color: #eee;'
            },
            {
                xtype: 'container',
                layout: 'hbox',
                padding: '0 0 10 0',
                items: [
                    {
                        xtype: 'datefield',
                        fieldLabel: App.localeRes('Received Date'),
                        flex:1,
                        name: 'outDate',
                        readOnly: true,
                        fieldStyle: 'background-color: #eee;'
                    },
                    {
                        xtype: 'stockInOutStatusCombo',
                        fieldLabel: App.localeRes('Receive Status'),
                        labelWidth:120,
                        labelStyle : "text-align:right;",
                        name: 'outStatus',
                        flex:1,
                    }
                ]
            },
            {
                xtype: 'textarea',
                fieldLabel: App.localeRes('Remarks'),
                name: "remarks",
                width: "100%",
                height: 70,
                maxLength: 200,
                rowspan: 2,
                readOnly: true,
                fieldStyle: 'background-color: #eee;'
            },
            {
                xtype: 'datefield',
                fieldLabel: App.localeRes('Target Date'),
                name: 'targetCompleteDate',
                readOnly: true,
                fieldStyle: 'background-color: #eee;'
            },
            
        ];

        me.callParent(arguments);
    }
});
