import { $echarts } from '../../index.js';
import echartstyle from '../../libs/echarts-style.js';
import * as $switch from '../../extend/bar-simple.js';

export default ({ dom, param, opt }) => {
    const { $color, $tooltip, $grid } = echartstyle();

    const { data } = param;

    /**
     * 导出配置项
     */
    const option = {
        grid: {
            top: 24,
            bottom: 20,
            right: 230,
        },
        xAxis: {
            type: 'time',
            position: 'top',
            splitLine: {
                show: false,
            },
            minInterval: 3600 * 24 * 1000,
            axisLabel: {
                fontSize: 14,
                color: '#fff',
                fontWeight: 'bold',
            },
        },
        yAxis: {
            inverse: true,
            data: data.yAxis,
            axisTick: 'none',
            axisLine: 'none',
            axisLabel: {
                fontSize: 14,
                color: '#fff',
                fontWeight: 'bold',
            },
        },
        tooltip: 'none',
        series: [
            {
                name: '农事活动开始时间',
                type: 'bar',
                stack: 'Total',
                itemStyle: {
                    color: '#062952',
                    borderColor: '#062952',
                    shadowColor: '#062952'
                },
                emphasis:{
                    disabled: true
                },
                z: 3,
                data: data.startData
            },
            {
                name: '农事活动结束时间',
                type: 'bar',
                barMaxWidth: 24,
                stack: 'Total',
                label: {
                    show: true,
                    position: 'right',
                    fontSize: 14,
                    textBorderColor: '#fff',
                    color: '#fff',
                    formatter: (params) => {
                        return params.data.dateStr
                    }
                },
                data: data.endData
            }
        ],
    };


    /**
     * 插拔式开关（整块可移除，或者移除其中一项，也不会有任何影响）
     */
    $switch.handleDirection(param, option); // 改变方向

    option.series = option.series.map((item, index) => {
        $switch.handleStack(param, item); // 堆叠
        $switch.handleBackground(param, item); // 背景色
        $switch.handleColor(param, item, index); // 颜色
        $switch.handleBorder(param, item, index, $color); // 边框
        $switch.handleBarWidth(param, item); // 柱状图尺寸

        return item;
    });

    /**
     * 渲染
     */
    const extensOption = $echarts.extens(opt, option);

    const echarts = $echarts.render(dom, extensOption);

    return echarts;
};
