import * as echarts from "echarts";
export default {
  data() {
    return {
      formInline: {
        windfarm: "",
        project: "",
        line: "",
      },
      timedate: [
      ],
      pj:'',
      fc:'',
      isAsc: "asc",
      beginDate: "2021-01-01",
      endDate: "2021-01-04",
      gridData: [],
      multipleSelection: [],
      sortInOrder: [],
      sortInOrderTop: [],
      sortInOrde2: [],
      getTableData: [],
      sortInOrderTop2: [],
      pjName1: "",
      pjName2: "",
      currentPage2: 1,
      pagesize: 10,
      fdcLineData: [],
      wpIdslist:{
        name:"",
        id:"",
      },
      projectlist:{
        name:"",
        id:"",
      },
      options: [
        {
          value: "MHS_FDC",
          label: "麻黄山风电场",
        },
        {
          value: "NSS_FDC",
          label: "牛首山风电场",
        },
        {
          value: "SBQ_FDC",
          label: "石板泉风电场",
        },
        {
          value: "QS_FDC",
          label: "青山风电场",
        },
        {
          value: "XS_FDC",
          label: "香山风电场",
        },
      ],
      loading:true,
      value: "",
      pjId: [],
      pjName: [],
      orderByColumn: "",
      dialogTableVisible: false,
      lineDataOption: [],
      getChartDataValue: [],
      getChartDataValue2: [],
      getChartData:[]
    };
  },
  components: {
  },
  created() {
      this.query_wpid();
    this.FiveLossInformation();
  },
  methods: {
    changeFun(val) {
      this.selectrowdate = val;
    },
    filter_date(cellValue) {
      let date = new Date(cellValue.recordDate);

      return this.BASE.getBzDate(date,0);
    },
    query_xml(){
      this.pj = "";
      this.xl = "";
      this.API.get("powercompare/projectAjax?wpIds=" + this.fc).then((res) => {
        this.projectlist = res.data;
        
      });
    },
    headStyle() {
      return "text-align:left";
    },
    onSubmit() {
    },
    handleClick() {},
    deleteRow(index, rows) {
      rows.splice(index, 1);
    },
    query_wpid() {
      var newData = new Date();
       this.timedate[0] = this.BASE.getBzDate(newData.getTime(),-1);
       this.timedate[1] = this.BASE.getBzDate(newData.getTime(),0);
      this.API.get("powercompare/windfarmAjax?").then((res) => {
        this.wpIdslist = res.data;
        
      });
    },
    queryApData() {
      this.FiveLossInformation();
    },
    handleEdit(a, b) {
      this.pjId = [];
      this.lineDataOption = [];
      if (this.multipleSelection.length == 2) {
        for (let i = 0; i < this.multipleSelection.length; i++) {
          this.pjId.push(this.multipleSelection[i].pjId);
          this.pjName.push(this.multipleSelection[i].pjName);
          this.wtId.push(this.multipleSelection[i].wtId);
          this.wtName.push(this.multipleSelection[i].wtName);
          this.lineDataOption.push({
            id: this.multipleSelection[i].pjId,
            name: this.multipleSelection[i].pjName,
          });
        }
        this.$router.push({
          path: "/projectBenchmarkParticulars",
          query: {
            date:b,
            pjId: this.pjId,
            beginDate: this.beginDate,
            endDate: this.endDate,
            pjName: this.pjName,
            wtId:this.wtId,
            wtName:this.wtName,
            select: this.lineDataOption,
          },
        });
      } else {
        this.lineDataOption.push({ id: b.pjId, name: b.pjName });
        this.$router.push({
          path: "/projectBenchmarkParticulars",
          query: {
            pjId: b.pjId,
            beginDate: this.beginDate,
            endDate: this.endDate,
            pjName: b.pjName,
            select: this.lineDataOption,
            wtId:b.wpId,
            wtName:b.wpName,
          },
        });
      }
    },
    checkwindfarm() {
      if (this.formInline.windfarm == "") {
        this.$message.error("请选择风场！");
        return;
      }
    },
    filter_fdl(cellValue){
             return parseFloat(cellValue.fdl).toFixed(2);
    },
    checkproject() {
      if (this.formInline.project == "") {
        this.$message.error("请选择项目！");
        return;
      }
      if (new Date(this.timedate) == null) {
        this.$message.error("请选择时间");
        return;
      }
    },
    querycheck(){
      if(this.multipleSelection.length == 2){
        this.queryApDataMx();
      }else{
        this.$message({
          message:"请选择两个项目！",
          type:'error'
        });
        return
      }
    },
    queryApDataMx() {
      this.dialogTableVisible = true;
      this.$nextTick(function () {
        this.drawPie("leiDaTu");
      });
      this.$nextTick(function () {
        this.drawPie2("leiDaTu2");
      });
    },
    handleSelectionChange(val) {
      this.sortInOrder = [];
      this.sortInOrderTop = [];
      this.getTableData = [];
      this.sortInOrde2 = [];
      this.multipleSelection = val;
      if (this.multipleSelection.length == 2) {
        this.pjName1 = this.multipleSelection[0].pjName;
        this.pjName2 = this.multipleSelection[1].pjName;
        this.sortInOrder.push(
          this.multipleSelection[0].fnlyl,
          this.multipleSelection[0].xqjsl,
          this.multipleSelection[0].ztzhjsl,
          this.multipleSelection[0].fwjsl,
          this.multipleSelection[0].slssl,
          this.multipleSelection[0].xnssl,
          this.multipleSelection[0].qfl,
          this.multipleSelection[0].jxssl,
          this.multipleSelection[0].gzssl
        );
        this.sortInOrderTop.push(
          this.multipleSelection[1].fnlyl,
          this.multipleSelection[1].xqjsl,
          this.multipleSelection[1].ztzhjsl,
          this.multipleSelection[1].fwjsl,
          this.multipleSelection[1].slssl,
          this.multipleSelection[1].xnssl,
          this.multipleSelection[1].qfl,
          this.multipleSelection[1].jxssl,
          this.multipleSelection[1].gzssl
        );
        for (let i = 0; i < this.multipleSelection.length; i++) {
          this.sortInOrde2.push({
            product: this.multipleSelection[i].pjName,
            "限电损失电量单位:万KWh": this.multipleSelection[i].xdss,
            "故障损失电量单位:万KWh": this.multipleSelection[i].gzss,
            "检修损失电量单位:万KWh": this.multipleSelection[i].jxssl,
            "性能损失电量单位:万KWh": this.multipleSelection[i].xnssl,
            "受累损失电量单位:万KWh": this.multipleSelection[i].slss,
          });
        }
        this.getTableData.push({
          index: "发电量",
          data1: this.multipleSelection[0].fdl,
          data2: this.multipleSelection[1].fdl,
        });
        this.getTableData.push({
          index: "故障损失电量",
          data1: this.multipleSelection[0].gzss,
          data2: this.multipleSelection[1].gzss,
        });
        this.getTableData.push({
          index: "检修损失电量",
          data1: this.multipleSelection[0].jxssl,
          data2: this.multipleSelection[1].jxssl,
        });
        this.getTableData.push({
          index: "性能未达标损失电量",
          data1: this.multipleSelection[0].xnsslfraction,
          data2: this.multipleSelection[1].xnsslfraction,
        });
        this.getTableData.push({
          index: "受累损失电量",
          data1: this.multipleSelection[0].slss,
          data2: this.multipleSelection[1].slss,
        });
        this.getTableData.push({
          index: "风能利用率",
          data1: this.multipleSelection[0].fnlyl,
          data2: this.multipleSelection[1].fnlyl,
        });
        this.getTableData.push({
          index: "故障损失率",
          data1: this.multipleSelection[0].gzssl,
          data2: this.multipleSelection[1].gzssl,
        });
        this.getTableData.push({
          index: "检修损失率",
          data1: this.multipleSelection[0].jxssl,
          data2: this.multipleSelection[1].jxssl,
        });
        this.getTableData.push({
          index: "弃风率",
          data1: this.multipleSelection[0].qfl,
          data2: this.multipleSelection[1].qfl,
        });
        this.getTableData.push({
          index: "性能损失率",
          data1: this.multipleSelection[0].xnssl,
          data2: this.multipleSelection[1].xnssl,
        });
        this.getTableData.push({
          index: "受累损失率",
          data1: this.multipleSelection[0].slssl,
          data2: this.multipleSelection[1].slssl,
        });
        this.getTableData.push({
          index: "复位及时率",
          data1: this.multipleSelection[0].fwjsl,
          data2: this.multipleSelection[1].fwjsl,
        });
        this.getTableData.push({
          index: "消缺及时率",
          data1: this.multipleSelection[0].xqjsl,
          data2: this.multipleSelection[1].xqjsl,
        });
        this.getTableData.push({
          index: "状态转换率",
          data1: this.multipleSelection[0].ztzhjsl,
          data2: this.multipleSelection[1].ztzhjsl,
        });
      }
    },
    handleCurrentChange(val) {
    },
    handleSizeChange(val) {
      this.pagesize = val;
    },
    changeTableSort(column) {
      this.orderByColumn = column.prop;
      if (column.order == "descending") {
        this.isAsc = "desc";
      } else if (column.order == "ascending") {
        this.isAsc = "asc";
      }
      this.FiveLossInformation();
    },
    FiveLossInformation() {
      let that = this;
      this.API.get("/powercompare/windfarmAjax").then((res) => {
        that.options = res.data;
      });
      if (this.timedate == "") {
        this.timedate[0] = "2021-01-01";
        this.timedate[1] = "2021-01-04";
        this.beginDate = this.timedate[0];
        this.endDate = this.timedate[1];
      } else {
        this.beginDate = this.timedate[0];
        this.endDate = this.timedate[1];
      }
      var fiveLossData = new URLSearchParams();
      fiveLossData.append("wpId", this.fc);
      fiveLossData.append("beginDate", this.beginDate);
      fiveLossData.append("endDate", this.endDate);
      fiveLossData.append("pjId", this.pj);
      this.API
        .post("/contrast/benchmarkPjList", fiveLossData)
        .then((res) => {
          that.gridData = res.data;
          that.loading=false;
          that.getPackageData(that.gridData);
          that.getPackageData2(that.gridData);
        });
    },
    drawPie() {
      var charts;
      if (charts != null && charts != "" && charts != undefined) {
        charts.dispose();
      }
      charts = echarts.init(document.getElementById("leiDaTu"));
      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: [
              {
                value: this.sortInOrder,
                name: this.pjName1,
              },
              {
                value: this.sortInOrderTop,
                name: this.pjName2,
              },
            ],
          },
        ],
      };
      charts.clear();
      charts.setOption(option);
    },
    drawPie2() {
      var charts2;
      if (charts2 != null && charts2 != "" && charts2 != undefined) {
        charts2.dispose();
      }
      charts2 = echarts.init(document.getElementById("leiDaTu2"));
      let option2 = {
        legend: {
          orient: "vertical",
          left: "right",
        },
        tooltip: {},
        dataset: {
          dimensions: [
            "product",
            "限电损失电量单位:万KWh",
            "故障损失电量单位:万KWh",
            "检修损失电量单位:万KWh",
            "性能损失电量单位:万KWh",
            "受累损失电量单位:万KWh",
          ],
          source: this.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",
              },
            },
          },
        ],
      };
      charts2.clear();
      charts2.setOption(option2);
    },
    toExcel() {},
    getPackageData(gridData) {
      for (let i = 0; i < gridData.length; i++) {
        this.getChartDataValue.push({
          value: gridData[i].fdl,
          name: gridData[i].pjName,
        });
        this.getChartDataValue2.push({
          value: gridData[i].gzss,
          name: gridData[i].pjName,
        });
      }
      this.getChartDataImport();
      this.getChartDataValue = [];
      this.getChartDataValue2 = [];
    },
    getChartDataImport() {
      var charts = echarts.init(document.getElementById("chartPie"));
      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: this.getChartDataValue,
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: "rgba(0, 0, 0, 0.5)",
              },
            },
          },
        ],
      };
      charts.setOption(option);

      var charts2 = echarts.init(document.getElementById("chartPieRight"));
      let option2 = {
        title: {
          text: "损失电量占比",
          left: "center",
        },
        color: ["#90ED7D", "#F7A35C", "#7CB5EC", "#434348", "#8085E9"],
        tooltip: {
          trigger: "item",
        },
        legend: {
          orient: "vertical",
          left: "left",
        },
        series: [
          {
            type: "pie",
            radius: "50%",
            data: this.getChartDataValue2,
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: "rgba(0, 0, 0, 0.5)",
              },
            },
          },
        ],
      };
      charts2.setOption(option2);
    },
    getPackageData2(gridData){
            this.getChartData = [];
            for(let i=0;i<gridData.length;i++){
                this.getChartData.push({product:gridData[i].pjName,'限电损失电量单位:万KWh':gridData[i].xdss,
                '故障损失电量单位:万KWh':gridData[i].gzss,'检修损失电量单位:万KWh':gridData[i].jxssl,
                '性能损失电量单位:万KWh':gridData[i].xnssl,'受累损失电量单位:万KWh':gridData[i].slss})
            }
            this.getChartDataImport2();
        },
        getChartDataImport2(){
            var charts =echarts.init(document.getElementById("chartHistogram"));
            let option = {
            title: {
                text: '损失电量分析',
                left: 'center'
            },
            legend: {
                orient: 'vertical',
                left: 'right'
            },
            tooltip: {},
            dataset: {
                 dimensions: ['product', '限电损失电量单位:万KWh', '故障损失电量单位:万KWh', '检修损失电量单位:万KWh', '性能损失电量单位:万KWh', '受累损失电量单位:万KWh'],
                 source: this.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'
                        }
                    }
                },
                
            ]
        };
        charts.setOption(option);
        },
        mounted() {
            this.query_wpid();
    },
  },
};
