// import EC from 'echarts'
import * as EC from 'echarts';
const color = ["#00FFF0", "#014EB5", "#A800FF", "#e82edb", "#B5454C", "#443bff", "#e8cb25", "#3dffb0", "#e8a425", "#ff7aab", "#e84b1e", "#552ce2", "#ffae21", "#e8861e", "#d441ff", "#35e8e4", "#9c7aff", "#e86fd8", "#ffee38"];

/*
 *  柱状图(非堆叠柱状图)
 *  id: 元素ID
 *  data 数据
 * [
          {
            name: "限电损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.xdss,
          },
          {
            name: "故障损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.gzss,
          },
          ,
          {
            name: "检修损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.jxss,
          },
          {
            name: "性能损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.xnss,
          },
          {
            name: "受累损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.slss,
          },
        ]
 *  xdata :  横坐标数据
 * */
export function getGradeEvaluationChartData(id, data, indicator, legenddata) {
  if (data === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    tooltip: {},
    legend: {
      x: "center", //可设定图例在左、右、居中
      y: "bottom",
      data: legenddata,
    },
    radar: {
      name: {
        textStyle: {
          color: "#fff",//字体颜色
          backgroundColor: "#999",//图例颜色
          borderRadius: 3,
          padding: [3, 5],//距离
        },
      },
      indicator: indicator,
    },
    series: [
      {
        name: "预算 vs 开销（Budget vs spending）",
        type: "radar",
        // areaStyle: {normal: {}},
        data: data
      },
    ],
  };
  myChart.setOption(option, true);
}

export function getSingleMachineSaturationChart(id, gridDataChartX, data, legend) {
  if (data === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    title: {
      left: 'center',
      text: '功率曲线'
    },
    tooltip: {
      trigger: 'axis'
    },
    legend: {
      data: legend,
      x: 'right',

    },
    grid: {
      left: '3%',
      right: '4%',
      bottom: '1%',
      containLabel: true
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: gridDataChartX
    },
    yAxis: {
      type: 'value',
      name: '功率(KW)',
      nameLocation: 'center',
      nameTextStyle: {
        padding: [0, 0, 30, 0]    // 四个数字分别为上右下左与原位置距离
      },
      max: 2000,
      axisLabel: {
        formatter: function (value) {
          var texts = [];
          if (value < 1000) {
            value = value / 1000;
            texts.push(value + 'k');
          }
          if (value >= 1000) {
            value = value / 1000;
            texts.push(value + 'k');
          }
          return texts;
        }
      },
    },
    series: data
  }
  myChart.setOption(option, true);
}

export function getSingleMachineAnalysisOperationChart(id, fdldata, legend, date, fsdata,) {
  if (fdldata === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (fsdata === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        crossStyle: {
          color: '#999'
        }
      }
    },
    legend: {
      orient: 'vertical',
      left: 'center',
      bottom: 'bottom',
      data: legend
    },
    xAxis: [
      {
        type: 'category',
        data: date,
        axisPointer: {
          type: 'shadow'
        },
        splitLine: {
          show: true,
        }
      }
    ],
    yAxis: [
      {
        type: 'value',
        // name: '发电量',
        min: 0,
        max: 30000,
        interval: 30000,
        axisLabel: {
          formatter: '{value} kwh'
        },
      },
      {
        type: 'value',
        // name: '风速',
        min: 0,
        max: 15,
        interval: 5,
        axisLabel: {
          formatter: '{value} .00'
        }
      }
    ],
    series: [
      {
        name: '发电量(万千瓦时)',
        type: 'bar',
        itemStyle: {
          normal: {
            color: '#0000D3'
          }
        },
        data: fdldata
      },
      {
        name: '风速(m/s)',
        type: 'line',
        yAxisIndex: 1,
        itemStyle: {
          normal: {
            color: '#C248C2',
            lineStyle: {
              color: '#C248C2'
            }
          }
        },
        data: fsdata
      }
    ]
  };
  myChart.setOption(option, true);
}

export function getSingleMachineAnalysisOperationChart2(id, legend, date, xdData, xnwdbData, jxssData, gzssData, slssData) {
  if (xdData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (xnwdbData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (jxssData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (gzssData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (slssData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        crossStyle: {
          color: '#999'
        }
      }
    },
    legend: {
      orient: 'vertical',
      left: 'center',
      bottom: 'bottom',
      data: legend
    },
    xAxis: [
      {
        type: 'category',
        data: date,
        axisPointer: {
          type: 'shadow'
        },
        splitLine: {
          show: true,
        },

      }
    ],
    yAxis: [
      {
        type: 'value'
      }
    ],
    series: [
      {
        name: '限电损失电量(万千瓦时)',
        type: 'bar',
        stack: 'vistors',
        label: {
          show: false
        },
        emphasis: {
          focus: 'series'
        },
        itemStyle: {
          normal: {
            color: '#99CCFF'
          }
        },
        data: xdData
      },
      {
        name: '性能未达标损失电量(万千瓦时)',
        type: 'bar',
        stack: 'vistors',
        label: {
          show: false
        },
        emphasis: {
          focus: 'series'
        },
        itemStyle: {
          normal: {
            color: '#FF00FF'
          }
        },
        data: xnwdbData
      },
      {
        name: '检修损失电量(万千瓦时)',
        type: 'bar',
        stack: 'vistors',
        label: {
          show: false
        },
        emphasis: {
          focus: 'series'
        },
        itemStyle: {
          normal: {
            color: '#FFCC00'
          }
        },
        data: jxssData
      },
      {
        name: '故障损失电量(万千瓦时)',
        type: 'bar',
        stack: 'vistors',
        label: {
          show: false
        },
        emphasis: {
          focus: 'series'
        },
        itemStyle: {
          normal: {
            color: '#800080'
          }
        },
        data: gzssData
      },
      {
        name: '受累损失电量(万千瓦时)',
        type: 'bar',
        stack: 'vistors',
        label: {
          show: false
        },
        emphasis: {
          focus: 'series'
        },
        itemStyle: {
          normal: {
            color: '#A6A6A6'
          }
        },
        data: slssData
      },
    ]
  };
  myChart.setOption(option, true);
}

export function getSingleMachineAnalysisOperationChart3(id, legend, date, jfData, djData,) {
  if (jfData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (djData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    tooltip: {
      trigger: 'axis'
    },
    legend: {
      orient: 'vertical',
      left: 'center',
      bottom: 'bottom',
      data: legend
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      axisPointer: {
        type: 'shadow'
      },
      splitLine: {
        show: true,
      },
      data: date
    },
    yAxis: {
      type: 'value',
      axisLabel: {
        formatter: '{value} .00'
      }
    },
    series: [
      {
        name: '静风频率（小时）',
        type: 'line',
        stack: '总量',
        data: jfData,
        itemStyle: {
          normal: {
            color: '#F64A4A',
            lineStyle: {
              color: '#F64A4A'
            }
          }
        },
      },
      {
        name: '待机时间（小时）',
        type: 'line',
        stack: '总量',
        data: djData,
        itemStyle: {
          normal: {
            color: '#4343F8',
            lineStyle: {
              color: '#4343F8'
            }
          }
        },
      }
    ]
  };
  myChart.setOption(option, true);
}

export function getcallThePoliceChart(id, charNameData, charFreData) {
  if (charNameData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (charFreData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    title: {
      text: '报警数据统计分析',
      left: 'center'
    },
    xAxis: {
      type: 'category',
      data: charNameData,
      axisLabel: {
        interval: 0,
      }

    },
    yAxis: {
      type: 'value'
    },
    series: [{
      data: charFreData,
      type: 'bar'
    }]
  };
  myChart.setOption(option, true);
}

// 
export function getCurveDeviationRate(id, legend, Xdata, sjdata, bzdata) {
  if (Xdata === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (sjdata === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (bzdata === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        crossStyle: {
          color: '#999'
        }
      }
    },
    title: {
      text: '曲线偏差率排行',
      left: 'center'
    },
    tooltip: {
      trigger: 'axis'
    },
    legend: {
      orient: 'vertical',
      left: 'center',
      bottom: 'bottom',
      data: legend
    },
    // grid: {
    //     left: '3%',
    //     right: '4%',
    //     bottom: '3%',
    //     containLabel: true
    // },
    xAxis: {
      type: 'category',
      // boundaryGap: false,
      axisPointer: {
        type: 'shadow'
      },
      // splitLine: {
      //      show: true,
      // },
      data: Xdata
    },
    yAxis: {
      type: 'value'
    },
    series: [
      {
        name: '实际功率(kw)',
        type: 'line',
        stack: '总量',
        data: sjdata
      },
      {
        name: '保证功率(kw)',
        type: 'line',
        stack: '总量',
        data: bzdata,
        itemStyle: {
          normal: {
            color: '#000000'
          }
        },
      },
    ]
  }
  myChart.setOption(option, true);
}

//五项损失圆形图左
export function getFiveLossSectorLeft(id, getChartDataValue) {
  if (getChartDataValue === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    title: {
      text: '发电量占比',
      left: 'center'
    },
    color: ['#90ED7D', '#F7A35C', '#7CB5EC', '#434348', '#8085E9'],
    tooltip: {
      trigger: 'item'
    },
    legend: {
      orient: 'vertical',
      left: 'left',
    },
    series: [
      {
        type: 'pie',
        radius: '50%',
        data: getChartDataValue,
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      }
    ]
  };
  myChart.setOption(option, true);
}


//五项损失圆形图右
export function getFiveLossSectorRight(id, chartsAName2, getChartDataValue2) {
  if (chartsAName2 === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (getChartDataValue2 === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    title: {
      text: chartsAName2,
      left: "center",
    },
    color: ["#90ED7D", "#F7A35C", "#7CB5EC", "#434348", "#8085E9"],
    tooltip: {
      trigger: "item",
    },
    legend: {
      orient: "vertical",
      left: "left",
    },
    series: [
      {
        type: "pie",
        radius: "50%",
        data: getChartDataValue2,
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: "rgba(0, 0, 0, 0.5)",
          },
        },
      },
    ],
  };
  myChart.setOption(option, true);
}

//五项损失柱状图
export function getFiveLossHistogram(id, dimensions, getChartData) {
  if (dimensions === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (getChartData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    title: {
      text: '损失电量分析',
      left: 'center'
    },
    legend: {
      orient: 'vertical',
      left: 'right'
    },
    tooltip: {},
    dataset: {
      dimensions: dimensions,
      source: getChartData
    },
    xAxis: { type: 'category' },
    yAxis: {},
    // Declare several bar series, each will be mapped
    // to a column of dataset.source by default.
    series: [
      {
        // barGap:'100%',/*多个并排柱子设置柱子之间的间距*/
        type: 'bar',
        barWidth: 30,
        itemStyle: {
          normal: {
            color: '#D201D8'
          }
        }
      },
      {

        type: 'bar',
        barWidth: 30,
        itemStyle: {
          normal: {
            color: '#FD0100'
          }
        }
      },
      {

        type: 'bar',
        barWidth: 30,
        itemStyle: {
          normal: {
            color: '#FF7B16'
          }
        }
      },
      {

        type: 'bar',
        barWidth: 30,
        itemStyle: {
          normal: {
            color: '#8085E9'
          }
        }
      },
      {

        type: 'bar',
        barWidth: 30,
        itemStyle: {
          normal: {
            color: '#A6A6A6'
          }
        }
      },

    ]
  };
  myChart.setOption(option, true);
}


//健康报告近一周曲线偏差率对比
export function getHealthCurve(id, legend, xqxpcldata, qxpclData, qxpcljzzData) {
  if (xqxpcldata === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (qxpclData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (qxpcljzzData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        crossStyle: {
          color: '#999'
        }
      }
    },
    legend: {
      orient: 'vertical',
      left: 'center',
      bottom: 'bottom',
      data: legend
    },
    xAxis: {
      type: 'category',
      data: xqxpcldata,
      splitLine: {
        show: true,
      }
    },
    yAxis: {
      type: 'value',
      axisLine: {       //y轴
        show: true
      },
      splitLine: {     //网格线
        show: true
      },
      max: 15,
      axisLabel: {
        formatter: '{value} .00'
      }

    },
    series: [{
      name: '曲线偏差率',
      data: qxpclData,
      type: 'line',
      symbol: 'triangle',
      symbolSize: 20,
      lineStyle: {
        color: '#CC0400',
        width: 4,
      },
      itemStyle: {
        borderWidth: 3,
        color: '#CC0400'
      }
    },
    {
      name: '基准值',
      data: qxpcljzzData,
      type: 'line',
      symbol: 'circle',
      symbolSize: 20,
      lineStyle: {
        color: '#0072C5',
        width: 4,
      },
      itemStyle: {
        borderWidth: 3,
        color: '#0072C5'
      }
    }]
  };
  myChart.setOption(option, true);
}

//健康报告健康走势图
export function getHealthTrendChart(id, legend, xfdldata, max, fdlData) {
  console.log(legend)
  if (xfdldata === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  if (fdlData === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        crossStyle: {
          color: '#999'
        }
      }
    },
    legend: {
      orient: 'vertical',
      left: 'center',
      bottom: 'bottom',
      data: legend
    },
    xAxis: {
      type: 'category',
      data: xfdldata,
      splitLine: {
        show: true,
      }
    },
    yAxis: {
      type: 'value',
      axisLine: {       //y轴
        show: true
      },
      axisTick: {       //y轴刻度线
        show: true
      },
      splitLine: {     //网格线
        show: true
      },
      max: max,
      axisLabel: {
        formatter: '{value} .00'
      }
    },
    series: [{
      name: '发电量健康走势',
      symbol: "none",
      data: fdlData,
      type: 'line',
      lineStyle: {
        color: '#99CDFF',
        width: 2,
      },
    }]
  };
  myChart.setOption(option, true);
}


//五项损失对标分析雷达图
export function getFiveLossRadarMap(id, data) {
  if (data === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    title: {
        // text: '对标排名分析',
        left: 'center'
    },
    tooltip: {},
    // legend: {
    //     data: ['预算分配（Allocated Budget）', '实际开销（Actual Spending）'],
    //     left: 'right'
    // },
    radar: {
        // shape: 'circle',
        name: {
            textStyle: {
                color: '#fff',
                backgroundColor: '#999',
                borderRadius: 3,
                padding: [3, 5]
            }
        },
        indicator: [
            { name: '风能利用率', max: 150 },
            { name: '消缺及时率', max: 150 },
            { name: '状态转换率', max: 150 },
            { name: '复位及时率', max: 150 },
            { name: '受累损失率', max: 150 },
            { name: '性能损失率', max: 150 },
            { name: '弃风率', max: 150 },
            { name: '检修损失率', max: 150 },
            { name: '故障损失率', max: 150 },
        ]
    },
    series: [{
        name: '预算 vs 开销（Budget vs spending）',
        type: 'radar',
        // areaStyle: {normal: {}},
        data: data
    }]
}
  myChart.setOption(option, true);
}

//五项损失对标分析柱状图
export function getFiveLossRadarHistogram(id, dimensions,sortInOrde2) {
  if (dimensions === undefined) {
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  let option = {
    legend: {
        orient: 'vertical',
        left: 'right'
    },
    tooltip: {},
    dataset: {
        dimensions: dimensions,
        source: sortInOrde2
    },
    xAxis: { type: 'category' },
    yAxis: {},
    // Declare several bar series, each will be mapped
    // to a column of dataset.source by default.
    series: [
        {
            // barGap:'100%',/*多个并排柱子设置柱子之间的间距*/
            type: 'bar',
            barWidth: 30,
            itemStyle: {
                normal: {
                    color: '#D201D8'
                }
            }
        },
        {

            type: 'bar',
            barWidth: 30,
            itemStyle: {
                normal: {
                    color: '#FD0100'
                }
            }
        },
        {

            type: 'bar',
            barWidth: 30,
            itemStyle: {
                normal: {
                    color: '#FF7B16'
                }
            }
        },
        {

            type: 'bar',
            barWidth: 30,
            itemStyle: {
                normal: {
                    color: '#8085E9'
                }
            }
        },
        {
            type: 'bar',
            barWidth: 30,
            itemStyle: {
                normal: {
                    color: '#A6A6A6'
                }
            }
        },
    ]
}
  myChart.setOption(option, true);
}


export default {
  getGradeEvaluationChartData,
  getSingleMachineSaturationChart,
  getSingleMachineAnalysisOperationChart,
  getSingleMachineAnalysisOperationChart2,
  getSingleMachineAnalysisOperationChart3,
  getcallThePoliceChart,
  getCurveDeviationRate,
  getFiveLossSectorLeft,
  getFiveLossSectorRight,
  getFiveLossHistogram,
  getHealthCurve,
  getHealthTrendChart,
  getFiveLossRadarMap,
  getFiveLossRadarHistogram,
  color,
}