import * as echarts from 'echarts'
import _ from 'lodash';
export const getOption = (datas) => {
    const max = _.sumBy(datas, 'acreage')
    const data = datas.map(data => {
        return {
            ...data,
            name: data.grassMinType,
            value: data.acreage,
            sum: max
        }
    })
    const getArrByKey = (data, k) => {
        let key = k || "value";
        let res = [];
        if (data) {
            data.forEach(function (t) {
                res.push(t[key]);
            });
        }
        return res;
    };
    const color = ['#19B8FA', '#0FE2F5'];
    const color1 = ['#308BFB', '#0ACBEE'];
    return {
        grid: {
            top: 10,
            bottom: 10,
            right: 30,
            left: 10,
            // containLabel: true
        },
        xAxis: {
            show: false
        },
        yAxis: [{
            triggerEvent: true,
            show: true,
            inverse: true,
            data: getArrByKey(data, 'name'),
            axisLine: {
                show: false
            },
            splitLine: {
                show: false
            },
            axisTick: {
                show: false
            },
            axisLabel: {
                show: false,
                interval: 0,
                color: '#EFF0F1',
                align: 'left',
                margin: 80,
                fontSize: 15,
            },
        }, {
            triggerEvent: true,
            show: true,
            inverse: true,
            data: getArrByKey(data, 'name'),
            axisLine: {
                show: false
            },
            splitLine: {
                show: false
            },
            axisTick: {
                show: false
            },
            axisLabel: {
                interval: 0,
                // shadowOffsetX: '-20px',
                color: '#6ACBFF',
                align: 'right',
                verticalAlign: 'bottom',
                lineHeight: 24,
                fontSize: 14,
                padding: [0, 10, 0, 0],
                formatter: function (value, index) {
                    return data[index].value + ' ' + data[index].unit + ''
                },
            }
        }],
        series: [{
            name: '条',
            type: 'bar',
            showBackground: true,
            backgroundStyle: {
                borderRadius: 30
            },
            barBorderRadius: 30,
            yAxisIndex: 0,
            data: data,
            barWidth: 8,
            barMinHeight: 12,
            // align: left,
            itemStyle: {
                color: (val) => {
                    return new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
                        offset: 0,
                        color: val.dataIndex % 2 ? color1[0] : color[0]
                    }, {
                        offset: 1,
                        color: val.dataIndex % 2 ? color1[1] : color[1]
                    }])
                },
                barBorderRadius: 30,
            },
            label: {
                normal: {
                    color: '#EFF0F1',
                    show: true,
                    position: [0, '-16px'],
                    textStyle: {
                        fontSize: 14
                    },
                    formatter: function (a, b) {
                        return a.name
                    }
                }
            }
        }]
    };
}