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

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

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

    cls: 'x-home-panel',
    padding: '0 16 0 0',
    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: '#f4f4f4',
        },

        latyout: 'responsivecolumn',
        defaults: {
            margin: '0 16 0 0',
            userCls: 'x-home-chart big-33 small-50',
        },
        items: []
    }, {
        xtype: 'panel',
        latyout: 'responsivecolumn',
        style: {
            background: '#f4f4f4',
        },
        defaults: {
            margin: '0 16 0 0',
            userCls: 'x-home-chart big-33 small-50',
        },
        items: []
    }],

    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;
    }
});