const colors = [
  "rgba(67, 80, 136, 0.8)",
  "rgba(151, 94, 229, 0.8)",
  "rgba(61, 160, 255, 0.8)",
  "rgba(48, 203, 203, 0.8)",
  "rgba(75, 203, 116, 0.8)",
  "rgba(250, 212, 68, 0.8)",
  "rgba(217, 217, 217, 0.8)",
];
const textStyle = {
  color: "#555",
  fontFamily:
    '"PingFang SC", "Microsoft YaHei", Tahoma,Helvetica, Arial, sans-serif',
};
const animationIsOpen = false;

export const initOption = {
  renderer: "svg",
};

function getArrayMaxNum(arr) {
  return Math.max.apply(null, arr);
}
//  chart -------------------------->
export function getScoreBarOptions(dataObj) {
  let series = [
    {
      type: "bar",
      data: dataObj.map((item) => item.studentCount),
      barWidth: 12,
    },
  ];

  return {
    animation: animationIsOpen,
    textStyle: textStyle,
    color: colors,
    grid: {
      left: 40,
      top: 20,
      bottom: 30,
      right: 40,
      show: true,
      borderColor: "rgba(230,230,230,1)",
    },
    yAxis: [
      {
        type: "value",
        z: 1,
        axisTick: {
          show: false,
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLabel: {
          fontSize: 14,
        },
      },
    ],
    xAxis: [
      {
        type: "category",
        data: dataObj.map((item) => `${item.minScore}-`),
        // data: dataObj.map((item) => `${item.minScore}~${item.maxScore}`),
        axisTick: {
          show: false,
        },
        splitArea: {
          show: true,
          areaStyle: {
            color: ["rgba(250,250,250,1)", "rgba(255,255,255,1)"],
          },
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLabel: {
          fontSize: 14,
          margin: 10,
        },
      },
    ],
    series: series,
  };
}
export function getBarsOptions(dataObj) {
  let xAxisData = dataObj.map((item) => item.name);
  let avgDatas = dataObj.map((item) => item.avgScore);
  let maxDatas = dataObj.map((item) => item.maxScore);
  let minDatas = dataObj.map((item) => item.minScore);

  return {
    animation: animationIsOpen,
    textStyle: textStyle,
    color: colors,
    legend: {
      itemGap: 30,
      itemWidth: 14,
      bottom: 10,
      textStyle: {
        fontSize: 14,
      },
    },
    grid: {
      top: 15,
      bottom: 70,
      left: 40,
      right: 40,
      show: true,
      borderColor: "rgba(230,230,230,1)",
    },
    xAxis: {
      type: "category",
      data: xAxisData,
      axisTick: {
        show: false,
      },
      splitArea: {
        show: true,
        areaStyle: {
          color: ["rgba(255,255,255,1)", "rgba(250,250,250,1)"],
        },
      },
      splitLine: {
        show: true,
        lineStyle: {
          color: "rgba(233,233,233,1)",
        },
      },
      axisLabel: {
        fontSize: 14,
        margin: 10,
        interval: 0,
        formatter: function (value) {
          if (value.length > 6) {
            return [value.substring(0, 6), value.substring(6)].join("\n");
          }
          return value;
        },
      },
      axisLine: {
        lineStyle: {
          color: "rgba(233,233,233,1)",
        },
      },
    },
    yAxis: [
      {
        type: "value",
        z: 1,
        axisTick: {
          show: false,
        },
        axisLine: {
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLabel: {
          fontSize: 14,
          color: "#555",
        },
      },
    ],
    series: [
      {
        type: "bar",
        data: avgDatas,
        name: "平均分",
        barWidth: 12,
      },
      {
        type: "bar",
        data: maxDatas,
        name: "最高分",
        barWidth: 12,
      },
      {
        type: "bar",
        data: minDatas,
        name: "最低分",
        barWidth: 12,
      },
    ],
  };
}
export function getBarPointTopicOptions(dataObj) {
  let yAxisLabels = dataObj.map((item) => {
    const title =
      item.title.length > 5 ? item.title.substr(0, 5) + "..." : item.title;
    return `${title} ${item.mainNumber}-${item.subNumber}`;
  });
  let avgDatas = dataObj.map((item) => item.avgScore);
  let scoreRateDatas = dataObj.map((item) => item.scoreRate);
  let fullRateDatas = dataObj.map((item) => item.fullScoreRate);
  const xAxisTopMax = Math.ceil(getArrayMaxNum(avgDatas));

  let legendData = ["单题平均分", "得分率", "满分率"];
  let series = [
    {
      type: "bar",
      data: avgDatas,
      barWidth: 6,
      barGap: "50%",
      name: "单题平均分",
      xAxisIndex: 0,
      itemStyle: {
        color: "rgba(61, 160, 255, 0.8)",
      },
    },
    {
      type: "line",
      data: scoreRateDatas,
      symbol: "circle",
      symbolSize: 8,
      name: "得分率",
      xAxisIndex: 1,
      itemStyle: {
        color: "rgba(67, 80, 136, 0.8)",
      },
    },
    {
      type: "line",
      data: fullRateDatas,
      symbol: "circle",
      symbolSize: 8,
      name: "满分率",
      xAxisIndex: 1,
      itemStyle: {
        color: "rgba(250, 212, 68, 0.8)",
      },
    },
  ];

  return {
    animation: animationIsOpen,
    textStyle: textStyle,
    legend: {
      data: legendData,
      itemGap: 30,
      itemWidth: 14,
      bottom: 10,
      textStyle: {
        fontSize: 14,
      },
    },
    grid: [
      {
        left: "20%",
        top: 30,
        width: "66%",
        bottom: 70,
        show: true,
        borderColor: "rgba(230,230,230,1)",
      },
    ],
    xAxis: [
      {
        type: "value",
        position: "top",
        min: 0,
        max: xAxisTopMax,
        interval: xAxisTopMax / 10,
        axisTick: {
          show: false,
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLine: {
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLabel: {
          fontSize: 14,
          formatter: function (value, index) {
            if (!index) return "0";
            return value.toFixed(2);
          },
        },
      },
      {
        type: "value",
        min: 0,
        max: 1,
        interval: 0.1,
        position: "bottom",
        axisTick: {
          show: false,
        },
        axisLine: {
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLabel: {
          fontSize: 14,
          formatter: function (value, index) {
            if (!index) return "0";
            return parseInt(value * 100) + "%";
          },
        },
      },
    ],
    yAxis: [
      {
        type: "category",
        gridIndex: 0,
        data: yAxisLabels,
        inverse: true,
        axisTick: {
          show: false,
        },
        splitArea: {
          show: true,
          areaStyle: {
            color: ["rgba(250,250,250,1)", "rgba(255,255,255,1)"],
          },
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLine: {
          lineStyle: {
            color: "rgba(233,233,233,1)",
          },
        },
        axisLabel: {
          fontSize: 14,
          margin: 10,
        },
      },
    ],
    series: series,
  };
}
export function getBarTeachersOptions(datas) {
  let xAxisData = [
    // "实考人数",
    "最高分",
    "最低分",
    "及格人数",
    "及格率",
    "优秀人数",
    "优秀率",
    "平均分",
    // "相对平均分",
  ];

  let legendData = datas.map(function (item) {
    return item.name;
  });
  let series = datas.map(function (item) {
    return {
      type: "bar",
      data: [
        // item.totalCount,
        item.maxScore,
        item.minScore,
        item.passCount,
        item.passRate,
        item.excellentCount,
        item.excellentRate,
        item.avgScore,
        // item.relativeAvgScore,
      ],
      barWidth: 12,
      name: item.name,
    };
  });

  return {
    animation: animationIsOpen,
    textStyle: textStyle,
    color: colors,
    legend: {
      data: legendData,
      left: "center",
      bottom: 10,
      itemGap: 20,
      itemWidth: 14,
      textStyle: {
        fontSize: 14,
      },
    },
    grid: {
      show: true,
      top: 15,
      bottom: 70,
      left: 40,
      right: 40,
      borderColor: "rgba(230,230,230,1)",
    },
    xAxis: {
      type: "category",
      data: xAxisData,
      axisTick: {
        show: false,
      },
      splitArea: {
        show: true,
        areaStyle: {
          color: ["rgba(255,255,255,1)", "rgba(250,250,250,1)"],
        },
      },
      splitLine: {
        show: true,
        lineStyle: {
          color: "rgba(233,233,233,1)",
        },
      },
      axisLabel: {
        fontSize: 14,
        margin: 10,
        interval: 0,
      },
    },
    yAxis: {
      type: "value",
      z: 1,
      axisTick: {
        show: false,
      },
      axisLine: {
        lineStyle: {
          color: "rgba(233,233,233,1)",
        },
      },
      splitLine: {
        show: true,
        lineStyle: {
          color: "rgba(233,233,233,1)",
        },
      },
      axisLabel: {
        fontSize: 14,
        color: "#555",
      },
    },
    series: series,
  };
}
