saas-platform/frontend/saas-web/app/view/home/infoCardList/InfoList.js

Ext.define('saas.view.home.infoCardList.InfoList', {
    extend: 'Ext.grid.Panel',
    xtype: 'home-infocardlist-infolist',

    cls: 'x-infocardlist',

    //基础属性
    border: 1,
    loadMask: true,
    showIndex: true,
    columnWidth: 1.0,
    showRowNum: true,

    codeField: '',
    columns: [],
    condition: '1=1',

    initComponent: function () {
        var me = this,
        listUrl = me.listUrl,
        condition = me.initCondition(me.condition);

        if(me.idField == 'id') {
            me.idField = '_id';
        }

        Ext.apply(me, {
            actions: {
                copy: {
                    iconCls: 'x-fa fa-copy',
                    text: '复制单元格',
                    handler: function() {
                        me.onCopy(me.selectedData);
                    }
                }
            },
            viewConfig: {
                deferEmptyText: false,
                listeners: {
                    itemcontextmenu: function(view, rec, node, index, e) {
                        e.stopEvent();
                        me.getContextMenu().show().setLocalXY(e.getXY());
                        me.selectedData = e.target.innerText;
                        return false;
                    }
                }
            },
            columns: me.initColumns(),
            store: Ext.create('Ext.data.Store', {
                fields: me.getFields(),
                autoLoad: true,
                pageSize: 15,
                data: [],
                proxy: {
                    type: 'ajax',
                    url: listUrl,
                    timeout: 8000,
                    actionMethods: {
                        read: 'GET'
                    },
                    reader: {
                        type: 'json',
                        rootProperty: 'data.list',
                        totalProperty: 'data.total',
                    },
                    listeners: {
                        exception: function(proxy, response, operation, eOpts) {
                            if(operation.success) {
                                if(response.timedout) {
                                    saas.util.BaseUtil.showErrorToast('请求超时');
                                }
                            }else {
                                if(response.timedout) {
                                    saas.util.BaseUtil.showErrorToast('请求超时');
                                }else{
                                    saas.util.BaseUtil.showErrorToast('查询失败：' + response.responseJson.message);
                                }
                            }
                        }
                    }
                },
                listeners: {
                    beforeload: function (store, op) {
                        var conditions = [{
                            type: 'condition',
                            value: condition
                        }];

                        Ext.apply(store.proxy.extraParams, {
                            number: store.exportNumber?store.exportNumber:op._page,
                            size: store.exportPageSize?store.exportPageSize:store.pageSize,
                            mode: 'DETAIL',
                            condition: JSON.stringify(conditions)
                        });
    
                    },
                    load: function(store, records, successful, operation, eOpts) {
                        var datas = [];

                        Ext.Array.each(records, function(r, i) {
                            var d = Object.assign({}, r.data, { _id: r.data.id, id: Ext.id() });
                            datas.push(d);
                        });

                        store.loadData(datas, false);
                        me.reconfigure(store, me.initColumns());
                    }
                }
            }),
            dockedItems: [{
                xtype: 'pagingtoolbar',
                cls: 'core-query-pagingtoolbar',
                dock: 'bottom',
                displayInfo: true,
                store: me.store
            }]
        });
        me.callParent(arguments);
    },
    listeners: {
        boxready: function(grid, width, height, eOpts) {
            var store = grid.getStore(),
            gridBodyBox = grid.body.dom.getBoundingClientRect(),
            gridBodyBoxHeight = gridBodyBox.height;

            var pageSize = Math.floor(gridBodyBoxHeight / 32);

            store.setPageSize(pageSize);
        },
        itemClick: function(tableView, record, item, index, e, eOpts) {
            var grid = tableView.up('grid');

            if(!grid.fireEvent('beforeopendetail', grid, record)) {
                return false;
            }

            var idField = grid.idField,
            codeField = grid.codeField,
            detailTitle = grid.detailTitle,
            detailXType = grid.detailXType;

            if(e.target.parentElement.classList.contains('x-code-column')) {
                var idValue = record.get(idField),
                codeValue = record.get(codeField),
                id = detailXType + '-' + idValue;
                saas.util.BaseUtil.openTab(detailXType, detailTitle+"("+codeValue+")", id, {
                    initId: idValue
                });
            }
        },
    },

    initCondition: function(condition) {
        var companyId = saas.util.BaseUtil.getCurrentUser().companyId;
        return condition.replace('#{companyId}', companyId);;
    },

    initColumns: function() {
        var me = this,
        columns = me.listColumns;

        Ext.Array.each(columns, function(c) {
            if(c.dataIndex == me.codeField) {
                Ext.applyIf(c, {
                    tdCls: 'x-code-column'
                });
            }
        });

        return columns;
    },
    getFields: function() {
        var me = this;

        return me.columns.filter(function(c) {
            return !!c.dataIndex;
        }).map(function(c) {
            return c.dataIndex;
        });
    },

    getContextMenu: function() {
        var me = this;

        return me.contextMenu || (me.contextMenu = me.add({
            xtype: 'menu',
            items: [
                // Actions can be converted into MenuItems
                '@copy',
            ]
        }));
    },

    onCopy: function(text) {
		var target = Ext.DomHelper.append(document.body, {
			tag: 'textarea',
			style: 'opacity: 0;position: absolute;top: -10000px;right: 0;',
			html: text
		});
		target.focus();
		target.select();
	    document.execCommand('Copy');
	    target.blur();
	    document.body.removeChild(target);
    },
    
    refresh: function() {
        var me = this;
        me.store.reload();
    }
});