import * as echarts from "echarts";

const getBarChart = (nameList, valueList, isPer) => {
  const colorList = ['#ce4f51', '#1778ff']
  const option = {
    tooltip: {},
    grid: {
      top: '3%',
      right: '3%',
      bottom: '1%',
      left: '1%',
      containLabel: true
    },
    color: ['#ce4f51', '#1778ff'],
    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
      }
    },
    series: [{
      type: 'bar',
      data: valueList.map((item, index) => {
        return {
          value: item,
          label: {
            textStyle: {
              color: index < 3 ? '#ce4f51' : '#1778ff'
            }
          }
        };
      }),
      label: {
        show: true,
        position: [670, 0],
        formatter: function (params) {
          return isPer ? params.value + '%' : params.value
        }
      },
      barWidth: 8,
      itemStyle: {
        color: function (params) {
          if (params.dataIndex < 3) {
            return new echarts.graphic.LinearGradient(0, 0, 1, 0,
              [{
                offset: 0,
                color: 'rgba(255,255,255,0)'
              },
              {
                offset: 1,
                color: colorList[0]
              }
              ]);
          } else {
            return new echarts.graphic.LinearGradient(0, 0, 1, 0,
              [{
                offset: 0,
                color: 'rgba(255,255,255,0)'
              },
              {
                offset: 1,
                color: colorList[1]
              }
              ]);
          }

        },
        barBorderRadius: 4,
      }
    }]
  }
  return option
}

export default getBarChart