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

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

    requires: [
        'Ext.slider.Single',
        'Ext.form.field.Display',
        'Ext.layout.container.Border',
        'Ext.ux.layout.ResponsiveColumn'
    ],

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

    cls: 'x-home-panel',

    layout: 'responsivecolumn',

    scrollable: true,

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

    items: [{
        xtype: 'infocard'
    }, {
        xtype: 'panel',
        title: '2018年11月经营分析',
        latyout: 'responsivecolumn',
        defaults: {
            cls: 'x-home-chart',
            margin: '0 0 0 14'
        },
        items: [{
            xtype: 'month-sale',
            userCls: 'big-33 small-50',
        }, {
            xtype: 'month-purchase',
            userCls: 'big-33 small-50',
        }, {
            xtype: 'core-chart-gauge',
            userCls: 'big-33 small-100',
        }]
    }, {
        title: '2018年11月经营分析',
        latyout: 'column',
        // items: [{
        //     xtype: 'core-chart-line',
        //     columnWidth: 0.33
        // }, {
        //     xtype: 'core-chart-pie',
        //     columnWidth: 0.33
        // }, {
        //     xtype: 'core-chart-pie3d',
        //     columnWidth: 0.33
        // }]
    }],

    items1: [{
        title: '2018年11月经营分析',
        userCls: 'big-50 small-100',
        items: [{
            xtype: 'core-chart-pie',
            columnWidth: 0.33,
            chartConfig: {
                captions: {
                    credits: {
                        text: 'Data: IDC Predictions - 2017\n' +
                            'Source: Internet',
                        align: 'left'
                    }
                },
            }
        }, {
            xtype: 'core-chart-bar',
            columnWidth: 0.33
        }, {
            xtype: 'core-chart-gauge',
            columnWidth: 0.33
        }]
    }, {
        title: '经营趋势分析',
        userCls: 'big-50 small-100',
        items: [{
            xtype: 'core-chart-line',
            columnWidth: 0.33
        }, {
            xtype: 'core-chart-pie',
            columnWidth: 0.33
        }, {
            xtype: 'core-chart-pie3d',
            columnWidth: 0.33
        }]
    }, {
        title: '待办事宜',
        userCls: 'big-100 small-100',
        items: [{
            xtype: 'core-chart-polar',
            columnWidth: 0.5
        }, {
            xtype: 'core-chart-stacked',
            columnWidth: 0.5
        }]
    }],
});