import * as echarts from "echarts";

const getBarChart = (nameList, valueList) => {
  const colorList = ['#b37feb', '#ffc53e', '#36cfc9', '#5c80f7', '#ff7d7a', '#4a9cff']
  const option = {
    tooltip: {},
    grid: {
      top: '3%',
      right: 40,
      bottom: '1%',
      left: '1%',
      containLabel: true
    },
    xAxis: {
      type: 'value',
      splitLine: {
        show: false
      },
      show: false
    },
    yAxis: {
      type: 'category',
      data: nameList,
      splitLine: {
        show: false
      },
      axisTick: {
        show: false
      },
      axisLine: {
        show: false
      },
      axisLabel: {
        show: true,
        textStyle: {
          fontSize: 16,
          fontFamily: 'Microsoft YaHei',
          color: 'rgba(59, 65, 75, 1)'
        }
      }
    },
    series: [{
      type: 'bar',
      data: valueList.map((item,index) => {
        return {
          value: item,
          label: {
            textStyle: {
              color: colorList[index]
            }
          }
        };
      }
      ),
      barWidth: 8,
      label: {
        show: true,
        position: [330, 0],
        formatter: function(params) {
          return params.value
        }
      },
      itemStyle: {
        color: function (params) {
          var colorList = [
            ['rgba(179, 127, 235, 0.1)', 'rgba(179, 127, 235, 1)'],
            ['rgba(255, 197, 61, 0.1)', 'rgba(255, 197, 61, 1)'],
            ['rgba(54, 207, 201, 0.1)', 'rgba(54, 207, 201, 1)'],
            ['rgba(89, 126, 247, 0.1)', 'rgba(89, 126, 247, 1)'],
            ['rgba(255, 192, 105, 0.1)', 'rgba(255, 192, 105, 1)'],
            // ['#fff', '#4a9cff'],
          ];
          var index = params.dataIndex;
          if (params.dataIndex >= colorList.length) {
            index = params.dataIndex - colorList.length;
          }
          return new echarts.graphic.LinearGradient(0, 0, 1, 0,
            [{
              offset: 0,
              color: colorList[index][0]
            },
            {
              offset: 1,
              color: colorList[index][1]
            }
            ]);
        },
        barBorderRadius: 4,
      }
    }]
  }
  return option
}

export default getBarChart