Ext.define("App.view.OrderItemGrid", {
    extend: "Ext.grid.Panel",
    xtype: "orderItemGrid",
    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) { }
        });

        this.reconfigure(store);
    },

    initComponent: function () {
        var me = this;

        Ext.apply(me, {
            tbar: {
                defaultButtonUI: 'default',
                padding: 0,
                items: [
                    {
                        xtype: 'label',
                        html: "<b>"+App.localeRes('Item')+"</b>",
                    },
                    '->',
                    {
                        xtype: 'button',
                        text: App.localeRes('New Item'),
                        margin: '0 0 16 0',
                        handler: function (button, event) {
                            App.loadModuleWin('orderItemWindow', App.localeRes("Item"), {
                                params:{
                                    orderId: me.params.orderId
                                },
                                callbackOnClose: function () {
                                    me.loadStore(me.params.orderId);
                                }
                            });
                        }
                    }
                ]
            },
            store: Ext.create('App.store.OrderItemStore', {}),
            columns: [
                {
                    xtype: 'rownumberer',
                    text: '',
                    width: 30,
                },
                {
                    xtype: 'actioncolumn',
                    text: '',
                    width: 30,
                    align: 'center',
                    hidden: !App.isGranted(['ORDER_ITEM_DELETE']),
                    items: [
                        {
                            iconCls: 'silk-cross',
                            tooltip: App.localeRes('Delete'),
                            handler: function (view, rowIndex, colIndex, item, e, record) {
                                var _this = this;
                                App.confirm("Confirm Delete",
                                 "Do you want to Delete record?",
                                 function(buttonId, text, opt){
                                    if (buttonId === "yes") {
                                        Ext.Ajax.request({
                                            url: App.url("/order/item/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);
                                            },
                                            scope: _this,
                                        });
                                    }
                                 });

                                
                            },
                            scope: me
                        }
                    ]
                },
                {
                    xtype: 'gridcolumn',
                    dataIndex: 'name',
                    flex: 3,
                    text: App.localeRes('Item Name'),
                    cellWrap: true,
                    renderer: function (value, metaData, record, row, col, store, grid) {
                        var data = record.data;
                        htmlStr = '';
                        htmlStr += '<div style="padding: 5px 0px 0px 10px;">' + App.nl2br(value) + '</div>';

                        return htmlStr;
                    }
                },
                {
                    xtype: 'floatcolumn',
                    dataIndex: 'price',
                    flex: 1,
                    text: App.localeRes('Unit Price'),
                },
                {
                    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('orderItemWindow', App.localeRes("Item"), {
                                    params: {
                                        record: record
                                    },
                                    callbackOnClose: function () {
                                        me.loadStore(me.params.orderId);
                                    }
                                });
                            },
                            scope: me
                        }
                    ]
                },
            ],
        });

        me.callParent(arguments);
    }
});
