import * as echarts from "echarts";
import { DOUBLECHARTCOLORS } from '@/common/constant'
import { hexToRgba } from '@/views/marketAccessRestrictions/utils/index.ts'

const getSerie = (index, data) => {
  return {
    name: data[index].name,
    type: 'bar',
    data: data[index].list,
    label: {
      show: true,
      position: 'top',
      color: DOUBLECHARTCOLORS[index],
      fontWeight: 'bold',  // 文字加粗
      fontSize: 14,
      formatter: (params) => params.value,
    },
    barWidth: 20,
    itemStyle: {
      color: function (params) {
        return new echarts.graphic.LinearGradient(0, 1, 0, 0,
          [{
            offset: 0,
            color: hexToRgba(DOUBLECHARTCOLORS[index], 0.3)
          },
          {
            offset: 1,
            color: hexToRgba(DOUBLECHARTCOLORS[index], 1)
          }
          ]);
      },
      barBorderRadius: 10,
    }
  }
}

const getBarChart = (dataX, dataY) => {
  const option = {
    color: DOUBLECHARTCOLORS,
    legend: {
      show: true,
      top: 0,
      icon: 'circle',
      textStyle: {
        color: 'rgba(95, 101, 108, 1)',
        fontFamily: 'Microsoft YaHei',
        fontSize: '14px',
      }
    },
    tooltip: {},
    grid: {
      top: '8%',
      right: '3%',
      bottom: '3%',
      left: '3%',
      containLabel: true
    },
    yAxis: {
      type: 'value',
      name: '项',
      nameTextStyle: { align: 'right' },
      splitLine: {
        show: true,
        lineStyle: {
          color: '#e7f3ff',
        }
        
      },
      axisLine: {
        show: false,
        lineStyle: {
          color: 'rgba(95, 101, 108, 1)',
        }
      },
      show: true,
      textStyle: {
        color: 'rgba(95, 101, 108, 1)',
        fontFamily: 'Microsoft YaHei',
        fontsize: 14,
      }
    },
    xAxis: {
      type: 'category',
      data: dataX,
      splitLine: {
        show: false
      },
      axisTick: {
        show: true
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#e7f3ff',
        }
      },
      axisLabel: {
        show: true,
        textStyle: {
          color: 'rgba(95, 101, 108, 1)',
          fontFamily: 'Microsoft YaHei',
          fontsize: 14,
        }
      }
    },
    series: [ getSerie(0, dataY), getSerie(1, dataY) ]
  }
  return option
}

export default getBarChart