Ext.define("App.view.OrderPaymentGrid", {
    extend: "Ext.grid.Panel",
    xtype: "orderPaymentGrid",
    params: {},

    loadStore: function(orderId){
        var store = this.getStore();
        Ext.apply(store.getProxy().extraParams, {orderId:orderId});

        store.loadPage(1, {
            params: { start: 0 },
            callback: function (records, operation, success) { }
        });
    },

    initComponent: function () {
        var me = this;

        Ext.apply(me, {
            tbar: {
                defaultButtonUI: 'default',
                layout: 'hbox',
                padding: 0,
                items: [
                    {
                        xtype: 'label',
                        html: "<b>"+App.localeRes('Payment')+"</b>",
                    },
                    '->',
                    {
                        xtype: 'button',
                        text: App.localeRes('New Payment'),
                        margin: '0 0 16 0',
                        handler: function (button, event) {
                            App.loadModuleWin('orderPaymentWindow', App.localeRes("Payment"), {
                                params: {
                                    orderId: me.params.orderId
                                },
                                callbackOnClose: function () {
                                    me.loadStore(me.params.orderId);
                                }
                            });
                        }
                    }
                ]
            },
            store: Ext.create('App.store.OrderPaymentStore', {}),
            columns: [
                {
                    xtype: 'rownumberer',
                    text: '',
                    width: 30,
                },
                {
                    xtype: 'actioncolumn',
                    text: '',
                    width: 30,
                    align: 'center',
                    items: [
                        {
                            iconCls: 'silk-cross',
                            tooltip: App.localeRes('Delete'),
                            hidden: !App.isGranted(['PAYMENT_DELETE']),
                            handler: function (view, rowIndex, colIndex, item, e, record) {
                                Ext.Ajax.request({
                                    url: App.url("/order/payment/delete"),
                                    params: { id: record.get('id') },
                                    success: function(response, opts) {
                                        App.showMsg("Record Deleted");
                                        me.loadStore(me.params.orderId);
                                    },
                                    failure: function(response, opts) {
                                        App.showError('Cannot Delete : ' + response.status);
                                        me.loadStore(me.params.orderId);
                                    },
                                    scope: this
                                });
                            },
                            scope: me
                        }
                    ]
                },
                {
                    xtype: 'datecolumn',
                    dataIndex: 'date',
                    flex: 1,
                    text: App.localeRes('Payment Date'),
                },
                {
                    xtype: 'floatcolumn',
                    dataIndex: 'amount',
                    flex: 1,
                    text: App.localeRes('Amount'),
                },
                {
                    xtype: 'gridcolumn',
                    dataIndex: 'method',
                    flex: 1,
                    text: App.localeRes('Method'),
                    renderer: function (value, metaData, record, row, col, store, grid) {
                        return PaymentTypeCombo.convertToString(value);
                    },
                },
                {
                    xtype: 'gridcolumn',
                    dataIndex: 'refNo',
                    flex: 1,
                    text: App.localeRes('Reference No.'),
                },
                {
                    xtype: 'actioncolumn',
                    text: '',
                    width: 30,
                    align: 'center',
                    items: [
                        {
                            iconCls: 'silk-page-white-edit',
                            tooltip: App.localeRes('Edit'),
                            handler: function (view, rowIndex, colIndex, item, e, record) {
                                App.loadModuleWin('orderPaymentWindow', App.localeRes("Payment"), {
                                    params: {
                                        record: record
                                    },
                                    callbackOnClose: function () {
                                        me.loadStore(me.params.orderId);
                                        me.reconfigure(me.getStore());
                                    }
                                });
                            },
                            scope: me
                        }
                    ]
                },
            ],
        });

        me.callParent(arguments);
    }
});
