saas-platform/frontend/saas-web/app/view/home/Home.js

Ext.define('saas.view.home.Home', {
    extend: 'Ext.container.Container',
    xtype: 'home',
    id: 'home',

    requires: [
        'Ext.ux.layout.ResponsiveColumn'
    ],

    controller: 'home',
    viewModel: {
        type: 'home'
    },

    cls: 'x-home-panel',

    layout: 'responsivecolumn',

    scrollable: true,

    REFRESH_INTERVALS: 5 * 60 * 1000, // 刷新间隔

    defaults: {
        shadow: true,
        cls: 'x-home-box',
        userCls: 'big-100 small-100',
    },

    items: [{
        style: {
            marginRight: '0',
        },
        xtype: 'infocard'
    }, {
        xtype: 'panel',
        style: {
            background: '#EEF4F9',
        },

        latyout: 'responsivecolumn',
        defaults: {
            margin: '0 16 0 0',
            userCls: 'x-home-chart big-33 small-50',
        },
        items: [{
            xtype: 'month-sale',
            padding: '0 0 0 14',
        }, {
            xtype: 'month-purchase',
            padding: '0 0 0 14',
        }, {
            xtype: 'key-data',
            margin: 0,
            padding: '0 14 0 14',
        }]
    }, {
        xtype: 'panel',
        latyout: 'responsivecolumn',
        style: {
            background: '#EEF4F9',
        },
        defaults: {
            margin: '0 16 0 0',
            userCls: 'x-home-chart big-33 small-50',
        },
        items: [{
            xtype: 'month-io',
            padding: '0 0 0 14',
        }, {
            xtype: 'sale-trend',
            padding: '0 0 0 14',
        }, {
            xtype: 'stock-amount',
            margin: 0,
            padding: '0 14 0 14',
        }]
    }],

    initComponent: function() {
        this.lastTime = Ext.Date.now();
        this.callParent(arguments);
    },

    listeners: {
        onTabActivate: function(p) {
            p.refreshId = window.setInterval((p.refreshStores.bind(p)()).bind(p), p.REFRESH_INTERVALS);
        },
        onTabDeactivate: function(p) {
            p.lastTime = 0;
            window.clearInterval(p.refreshId);
        }
    },

    refreshStores: function() {
        var me = this,
        lastTime = me.lastTime || 0,
        now = Ext.Date.now(),
        viewModel = me.getViewModel(),
        stores = viewModel.storeInfo;

        if(now - lastTime > me.REFRESH_INTERVALS) {
            for(var key in stores) {
                var store = stores[key];
                store.load();
            }
            me.lastTime = Ext.Date.now();
        }
        return me.refreshStores;
    }
});