import * as echarts from 'echarts';

export const lineOption: (data?: any) => echarts.EChartsOption = (
  data = [
    {
      name: 1,
      value: 1,
    },
    {
      name: 12,
      value: 12,
    },
    {
      name: 13,
      value: 13,
    },
    {
      name: 14,
      value: 14,
    },
  ],
) => {
  return {
    tooltip: {
      show: true,
      trigger: 'axis',
      axisPointer: {
        lineStyle: {
          color: '#3791FD',
        },
      },
    },
    legend: {
      show: false,
    },
    grid: {
      top: '10%',
      left: 0,
      right: 0,
      bottom: '1%',
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: data?.map((it: any) => it.name),
      show: false,
    },
    yAxis: {
      type: 'value',
      splitLine: {
        show: false,
      },
      show: false,
      axisLabel: {
        show: false,
      },
    },

    series: [
      {
        type: 'line',
        symbol: 'none',
        smooth: false,
        data: data?.map((it: any) => it.value),
        lineStyle: {
          width: 3,
          color: 'rgb(68, 242, 255)',
        },
        areaStyle: {
          color: new echarts.graphic.LinearGradient(
            0,
            0,
            0,
            1,
            [
              {
                offset: 0,
                color: 'rgb(68, 242, 255)',
              },
              {
                offset: 1,
                color: 'rgba(68, 242, 255, 0)',
              },
            ],
            false,
          ),
        },
      },
    ],
  };
};
