{"size": 4665, "ext": "js", "max_stars_repo_path": "Chapter07/resources/ext-6.2.0-gpl/ext-6.2.0/templates/admin-dashboard/classic/src/view/dashboard/Services.js", "max_stars_repo_name": "PacktPublishing/Mastering-Postgis", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "Chapter07/resources/ext-6.2.0-gpl/ext-6.2.0/templates/admin-dashboard/classic/src/view/dashboard/Services.js", "max_issues_repo_name": "PacktPublishing/Mastering-Postgis", "max_issues_repo_issues_event_min_datetime": "2021-03-10T11:45:17.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-27T15:05:54.000Z", "max_forks_repo_path": "Chapter07/resources/ext-6.2.0-gpl/ext-6.2.0/templates/admin-dashboard/classic/src/view/dashboard/Services.js", "max_forks_repo_name": "PacktPublishing/Mastering-Postgis", "max_forks_repo_forks_event_min_datetime": "2020-07-01T05:57:47.000Z", "max_forks_repo_forks_event_max_datetime": "2021-03-02T09:25:51.000Z"}
{"max_stars_count": null, "max_issues_count": 15, "max_forks_count": 4, "avg_line_length": 34.3014705882, "max_line_length": 119, "alphanum_fraction": 0.351982851}
Ext.define('Admin.view.dashboard.Services', {
    extend: 'Ext.Panel',
    xtype: 'services',

    requires: [
        'Ext.chart.series.Pie',
        'Ext.chart.series.sprite.PieSlice',
        'Ext.chart.interactions.Rotate'
    ],

    cls: 'service-type shadow',
    height: 320,
    bodyPadding: 15,
    title: 'Services',
    layout: {
        type: 'hbox',
        align: 'stretch'
    },

    items: [
        {
            xtype: 'container',
            width: 140,
            defaults: {
                height:126,
                insetPadding: '7.5 7.5 7.5 7.5',
                background: 'rgba(255, 255, 255, 1)',
                colors: [
                    '#6aa5dc',
                    '#fdbf00',
                    '#ee929d'
                ],
                bind: '{servicePerformance}',
                series: [
                    {
                        type: 'pie',
                        label: {
                            field: 'xField',
                            display: 'rotate',
                            contrast: true,
                            font: '12px Arial'
                        },
                        useDarkerStrokeColor: false,
                        xField: 'yvalue',
                        donut: 50,
                        padding:0
                    }
                ],
                interactions: [
                    {
                        type: 'rotate'
                    }
                ]
            },
            items: [
                {
                    xtype: 'polar'
                },
                {
                    xtype: 'polar'
                }
            ]
        },
        {
            xtype: 'container',
            flex: 1,
            layout: {
                type: 'vbox',
                align: 'stretch'
            },
            items: [
                {
                    xtype:'component',
                    data: {
                        name: 'Finance',
                        value: '20%'
                    },
                    tpl: '<div class="left-aligned-div">{name}</div><div class="right-aligned-div">{value}</div>'
                },
                {
                    xtype: 'progressbar',
                    cls: 'bottom-indent service-finance',
                    height: 4,
                    minHeight: 4,
                    value: 0.2
                },
                {
                    xtype:'component',
                    data: {
                        name: 'Research',
                        value: '68%'
                    },
                    tpl: '<div class="left-aligned-div">{name}</div><div class="right-aligned-div">{value}</div>'
                },
                {
                    xtype: 'progressbar',
                    cls: 'bottom-indent service-research',
                    height: 4,
                    minHeight: 4,
                    value: 0.68
                },
                {
                    xtype:'component',
                    data: {
                        name: 'Marketing',
                        value: '12%'
                    },
                    tpl: '<div class="left-aligned-div">{name}</div><div class="right-aligned-div">{value}</div>'
                },
                {
                    xtype: 'progressbar',
                    cls: 'bottom-indent service-marketing',
                    height: 4,
                    value: 0.12
                },
                {
                    xtype:'component',
                    html: '<div class="services-text">'+
                        'The year 2015 saw a significant change in the job market '+
                        'for the industry. With increasing goverment expenditure on research & development, jobs in '+
                        'the research sector rose to 68% from 47% in the previous financial year. Share of jobs in '+
                        'the finance sector remained more or less constant while that in marketing sector dropped to '+
                        '12%. The reduction in marketing jobs is attributed to increasing use of online advertising '+
                        'in recent years, which is largely automated.'+
                    '</div>' +
                    '<div class="services-legend">' +
                        '<span><div class="legend-finance"></div>Finance</span>' +
                        '<span><div class="legend-research"></div>Research</span>' +
                        '<span><div class="legend-marketing"></div>Marketing</span>' +
                    '<div>'
                }
            ]
        }
    ]
});
