import { Injectable } from '@angular/core';

@Injectable()
export class ChartsConfigService {
    BUILDINGS_COLOR = {
        ENABLED: '#79C447',
        PROBLEM: '#FABB3D',
        DISABLED: '#FF4F4F'
    }
    constructor() {
    }
    getChartConfig(dataValue) {
        return {
            chart: {
                type: 'column'
            },
            title: {
                text: dataValue[0].districtName
            },
            xAxis: {
                type: 'category'
            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            plotOptions: {
                series: {
                    minPointLength: 3
                },
                column: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: true
                }
            },
            tooltip: {
                headerFormat: '<span style="font-size:11px">Подача ЦО</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y}</b> будинків<br/>'
            },
            series: [{
                name: 'Building',
                colorByPoint: true,
                data: [
                    {
                    name: 'Підключено',
                    y: dataValue[2].buildingsCount,
                    color: this.BUILDINGS_COLOR.ENABLED
                    },
                    {
                     name: 'Є проблеми',
                     y: dataValue[1].buildingsCount,
                     color: this.BUILDINGS_COLOR.PROBLEM
                    },
                    {
                     name: 'Відключено аварійно',
                     y: dataValue[0].buildingsCount,
                     color: this.BUILDINGS_COLOR.DISABLED
                    }]
            }]
        };
    }
}