|
@@ -0,0 +1,502 @@
|
|
|
+
|
|
|
+import * as echarts from "echarts";
|
|
|
+// import formateDate from "@/utils/date";
|
|
|
+// import formateDate1 from "@/utils/date_1";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ FClist: {
|
|
|
+ name: "",
|
|
|
+ id: "",
|
|
|
+ },
|
|
|
+ fdcName1: "",
|
|
|
+ fdcName2: "",
|
|
|
+ date1: "2021-01-01",
|
|
|
+ date2: "2020-01-03",
|
|
|
+ wp_n_1: {},
|
|
|
+ wp_n_2: {},
|
|
|
+ selectrowdate: {},
|
|
|
+ histogram: {
|
|
|
+ date: [],
|
|
|
+ xdss: [],
|
|
|
+ gzss: [],
|
|
|
+ jxss: [],
|
|
|
+ xnss: [],
|
|
|
+ slss: [],
|
|
|
+ },
|
|
|
+ wpId: [],
|
|
|
+ wpName: [],
|
|
|
+ lineDataOption: [],
|
|
|
+ beginDate: "2021-01-01",
|
|
|
+ endDate: "2021-01-03",
|
|
|
+ fc: "",
|
|
|
+ tableData: [],
|
|
|
+ dialogTableVisible: false,
|
|
|
+ getChartDataValue: [],
|
|
|
+ getChartDataValue2: [],
|
|
|
+ getTableData: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ dialog() {
|
|
|
+ this.dialogTableVisible = true;
|
|
|
+ this.check_wpid();
|
|
|
+ this.$nextTick(function () {
|
|
|
+ this.drawleidatu();
|
|
|
+ this.drawhistogram_n();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ headStyle() {
|
|
|
+ return "text-align:left";
|
|
|
+ },
|
|
|
+ check_wpid() {
|
|
|
+ this.wp_n_1 = "";
|
|
|
+ this.wp_n_2 = "";
|
|
|
+ this.fdcName1 = "";
|
|
|
+ this.fdcName2 = "";
|
|
|
+ this.getChartDataValue = [];
|
|
|
+ this.getChartDataValue2 = [];
|
|
|
+ this.getTableData = [];
|
|
|
+ if (Object.keys(this.selectrowdate).length != 2) {
|
|
|
+ this.alert_jg();
|
|
|
+ return;
|
|
|
+ } else {
|
|
|
+ this.wp_n_1 = this.selectrowdate[0];
|
|
|
+ this.wp_n_2 = this.selectrowdate[1];
|
|
|
+ this.fdcName1 = this.wp_n_1.wpId;
|
|
|
+ this.fdcName2 = this.wp_n_2.wpId;
|
|
|
+ this.getChartDataValue.push(
|
|
|
+ this.wp_n_1.fnlyl,
|
|
|
+ this.wp_n_1.gzssl,
|
|
|
+ this.wp_n_1.jxssl,
|
|
|
+ this.wp_n_1.qfl,
|
|
|
+ this.wp_n_1.xnssl,
|
|
|
+ this.wp_n_1.slssl,
|
|
|
+ this.wp_n_1.fwjsl,
|
|
|
+ this.wp_n_1.ztzhl,
|
|
|
+ this.wp_n_1.xqjsl
|
|
|
+ );
|
|
|
+ this.getChartDataValue2.push(
|
|
|
+ this.wp_n_2.fnlyl,
|
|
|
+ this.wp_n_2.gzssl,
|
|
|
+ this.wp_n_2.jxssl,
|
|
|
+ this.wp_n_2.qfl,
|
|
|
+ this.wp_n_2.xnssl,
|
|
|
+ this.wp_n_2.slssl,
|
|
|
+ this.wp_n_2.fwjsl,
|
|
|
+ this.wp_n_2.ztzhl,
|
|
|
+ this.wp_n_2.xqjsl
|
|
|
+ );
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "发电量",
|
|
|
+ data1: this.wp_n_1.scadafdl,
|
|
|
+ data2: this.wp_n_2.scadafdl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "故障损失电量",
|
|
|
+ data1: this.wp_n_1.gzss,
|
|
|
+ data2: this.wp_n_2.gzss,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "检修损失电量",
|
|
|
+ data1: this.wp_n_1.jxssl,
|
|
|
+ data2: this.wp_n_2.jxssl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "性能未达标损失电量",
|
|
|
+ data1: this.wp_n_1.xnsslfraction,
|
|
|
+ data2: this.wp_n_2.xnsslfraction,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "受累损失电量",
|
|
|
+ data1: this.wp_n_1.slss,
|
|
|
+ data2: this.wp_n_2.slss,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "风能利用率",
|
|
|
+ data1: this.wp_n_1.fnlyl,
|
|
|
+ data2: this.wp_n_2.fnlyl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "故障损失率",
|
|
|
+ data1: this.wp_n_1.gzssl,
|
|
|
+ data2: this.wp_n_2.gzssl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "检修损失率",
|
|
|
+ data1: this.wp_n_1.jxssl,
|
|
|
+ data2: this.wp_n_2.jxssl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "弃风率",
|
|
|
+ data1: this.wp_n_1.qfl,
|
|
|
+ data2: this.wp_n_2.qfl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "性能损失率",
|
|
|
+ data1: this.wp_n_1.xnssl,
|
|
|
+ data2: this.wp_n_2.xnssl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "受累损失率",
|
|
|
+ data1: this.wp_n_1.slssl,
|
|
|
+ data2: this.wp_n_2.slssl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "复位及时率",
|
|
|
+ data1: this.wp_n_1.fwjsl,
|
|
|
+ data2: this.wp_n_2.fwjsl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "消缺及时率",
|
|
|
+ data1: this.wp_n_1.xqjsl,
|
|
|
+ data2: this.wp_n_2.xqjsl,
|
|
|
+ });
|
|
|
+ this.getTableData.push({
|
|
|
+ index: "状态转换率",
|
|
|
+ data1: this.wp_n_1.ztzhjsl,
|
|
|
+ data2: this.wp_n_2.ztzhjsl,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changeFun(val) {
|
|
|
+ this.selectrowdate = val;
|
|
|
+ },
|
|
|
+ query_fc() {
|
|
|
+ var newData = new Date();
|
|
|
+ this.beginDate = this.BASE.getBzDate(newData.getTime(), -1);
|
|
|
+ this.endDate = this.BASE.getBzDate(newData.getTime(), 0);
|
|
|
+ this.$http.get("powercompare/windfarmAjax?").then((res) => {
|
|
|
+ this.FClist = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ alert_jg() {
|
|
|
+ this.$message({
|
|
|
+ message: "只能选择两条数据",
|
|
|
+ type: "warning",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ },
|
|
|
+ handleEdit(a, b) {
|
|
|
+ this.wpId = [];
|
|
|
+ this.lineDataOption = [];
|
|
|
+ if (this.selectrowdate.length == 2) {
|
|
|
+ for (let i = 0; i < this.selectrowdate.length; i++) {
|
|
|
+ this.wpId.push(this.selectrowdate[i].wpId);
|
|
|
+ this.wpName.push(this.selectrowdate[i].wpName);
|
|
|
+ this.lineDataOption.push({
|
|
|
+ id: this.selectrowdate[i].wpId,
|
|
|
+ name: this.selectrowdate[i].wpName,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.$router.push({
|
|
|
+ path: "/YardBenchmark_particulars",
|
|
|
+ query: {
|
|
|
+ wpId: this.wpId,
|
|
|
+ beginDate: this.beginDate,
|
|
|
+ endDate: this.endDate,
|
|
|
+ wpName: this.wpName,
|
|
|
+ select: this.lineDataOption,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.lineDataOption.push({ id: b.wpId, name: b.wpName });
|
|
|
+ this.$router.push({
|
|
|
+ path: "/YardBenchmark_particulars",
|
|
|
+ query: {
|
|
|
+ wpId: b.wpId,
|
|
|
+ beginDate: this.beginDate,
|
|
|
+ endDate: this.endDate,
|
|
|
+ wpName: b.wpName,
|
|
|
+ select: this.lineDataOption,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ query_benchmarkWpList() {
|
|
|
+ Object.assign(this.$data.histogram, this.$options.data().histogram);
|
|
|
+ let that = this;
|
|
|
+ var page = new URLSearchParams();
|
|
|
+ page.append("wpId", this.fc);
|
|
|
+ page.append("beginDate", this.beginDate);
|
|
|
+ page.append("endDate", this.endDate);
|
|
|
+ this.$http.post("/contrast/benchmarkWpList", page).then((res) => {
|
|
|
+ this.tableData = res.data.data;
|
|
|
+ let len = this.tableData.length;
|
|
|
+ for (let i = 0; i < len; i++) {
|
|
|
+ // that.histogram.date[i] = formateDate(
|
|
|
+ // new Date(res.data.data[i].recordDate) / 1000
|
|
|
+ // );
|
|
|
+
|
|
|
+ that.histogram.xdss[i] = res.data.data[i].xdss;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ that.histogram.gzss[i] = res.data.data[i].gzss;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ that.histogram.jxss[i] = res.data.data[i].whss;
|
|
|
+
|
|
|
+ that.histogram.xnss[i] = res.data.data[i].qfss;
|
|
|
+
|
|
|
+ that.histogram.slss[i] = res.data.data[i].slss;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ this.drawhistogram();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ filter_date(cellValue) {
|
|
|
+ let date = new Date(cellValue.recordDate);
|
|
|
+
|
|
|
+ // return formateDate(date / 1000);
|
|
|
+ },
|
|
|
+ drawleidatu() {
|
|
|
+ var chartDom = document.getElementById("leidatu");
|
|
|
+ var myChart = echarts.init(chartDom);
|
|
|
+ var option;
|
|
|
+
|
|
|
+ option = {
|
|
|
+ title: {
|
|
|
+ text: "对标排名分析",
|
|
|
+ left: 400,
|
|
|
+ top: -5,
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 13,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "10%",
|
|
|
+ left: "10%",
|
|
|
+ right: "10%",
|
|
|
+ bottom: "0",
|
|
|
+ },
|
|
|
+ tooltip: {},
|
|
|
+ legend: {
|
|
|
+ orient: "vertical",
|
|
|
+ x: "left", //可设定图例在左、右、居中
|
|
|
+ y: "0", //可设定图例在上、下、居中
|
|
|
+ padding: [0, 50, 0, 0],
|
|
|
+ },
|
|
|
+ radar: {
|
|
|
+ // shape: 'circle',
|
|
|
+ name: {
|
|
|
+ textStyle: {
|
|
|
+ color: "#fff",
|
|
|
+ backgroundColor: "#999",
|
|
|
+ borderRadius: 3,
|
|
|
+ padding: [3, 5],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ indicator: [
|
|
|
+ { name: "风能利用率", max: 100 },
|
|
|
+ { name: "故障损失率", max: 100 },
|
|
|
+ { name: "检修损失率", max: 100 },
|
|
|
+ { name: "弃风率", max: 100 },
|
|
|
+ { name: "性能损失率", max: 100 },
|
|
|
+ { name: "受累损失率", max: 100 },
|
|
|
+ { name: "复位及时率", max: 100 },
|
|
|
+ { name: "状态转换率", max: 100 },
|
|
|
+ { name: "消缺及时率", max: 100 },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "预算 vs 开销(Budget vs spending)",
|
|
|
+ type: "radar",
|
|
|
+ // areaStyle: {normal: {}},
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ value: this.getChartDataValue,
|
|
|
+ name: formateDate(new Date(this.wp_n_1.recordDate) / 1000),
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: this.getChartDataValue2,
|
|
|
+ name: formateDate(new Date(this.wp_n_2.recordDate) / 1000),
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+
|
|
|
+ option && myChart.setOption(option);
|
|
|
+ },
|
|
|
+ drawhistogram_n() {
|
|
|
+ var chartDom = document.getElementById("histogram_n");
|
|
|
+ var myChart = echarts.init(chartDom);
|
|
|
+ var option;
|
|
|
+
|
|
|
+ option = {
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ axisPointer: {
|
|
|
+ type: "cross",
|
|
|
+ crossStyle: {
|
|
|
+ color: "#999",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ text: "损失电量分析",
|
|
|
+ left: 100,
|
|
|
+ top: 8,
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 13,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: "90",
|
|
|
+ left: "10%",
|
|
|
+ right: "10%",
|
|
|
+ bottom: "30",
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ orient: "vertical",
|
|
|
+ x: "right", //可设定图例在左、右、居中
|
|
|
+ y: 0, //可设定图例在上、下、居中
|
|
|
+ padding: [0, 50, 200, 0],
|
|
|
+ data: [
|
|
|
+ "限电损失电量(单位:万kwh)",
|
|
|
+ "故障损失电量(单位:万kwh)",
|
|
|
+ "检修损失电量(单位:万kwh)",
|
|
|
+ "性能损失电量(单位:万kwh)",
|
|
|
+ "受累损失电量(单位:万kwh)",
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ xAxis: [
|
|
|
+ {
|
|
|
+ type: "category",
|
|
|
+ data: [
|
|
|
+ formateDate(new Date(this.wp_n_1.recordDate) / 1000),
|
|
|
+ formateDate(new Date(this.wp_n_2.recordDate) / 1000),
|
|
|
+ ],
|
|
|
+ axisPointer: {
|
|
|
+ type: "shadow",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ yAxis: [
|
|
|
+ {
|
|
|
+ type: "value",
|
|
|
+ name: "电量",
|
|
|
+
|
|
|
+ interval: 50,
|
|
|
+ axisLabel: {
|
|
|
+ formatter: "{value} 万kw",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "限电损失电量(单位:万kwh)",
|
|
|
+ type: "bar",
|
|
|
+ yAxisIndex: 0,
|
|
|
+ data: [this.wp_n_1.xdss, this.wp_n_2.xdss],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "故障损失电量(单位:万kwh)",
|
|
|
+ type: "bar",
|
|
|
+ yAxisIndex: 0,
|
|
|
+ data: [this.wp_n_1.zzss, this.wp_n_2.gzss],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "检修损失电量(单位:万kwh)",
|
|
|
+ type: "bar",
|
|
|
+ yAxisIndex: 0,
|
|
|
+ data: [this.wp_n_1.jxss, this.wp_n_2.jxss],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "性能损失电量(单位:万kwh)",
|
|
|
+ type: "bar",
|
|
|
+ yAxisIndex: 0,
|
|
|
+ data: [this.wp_n_1.xnss, this.wp_n_2.xnss],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "受累损失电量(单位:万kwh)",
|
|
|
+ type: "bar",
|
|
|
+ yAxisIndex: 0,
|
|
|
+ data: [this.wp_n_1.slss, this.wp_n_2.slss],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+
|
|
|
+ option && myChart.setOption(option);
|
|
|
+ },
|
|
|
+ drawhistogram() {
|
|
|
+ var app = {};
|
|
|
+ var chartDom = document.getElementById("histogram");
|
|
|
+
|
|
|
+ var myChart = echarts.init(chartDom);
|
|
|
+ var option;
|
|
|
+
|
|
|
+ option = {
|
|
|
+ title: {
|
|
|
+ text: "损失电量分析",
|
|
|
+ },
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ axisPointer: {
|
|
|
+ type: "shadow",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ legend: {
|
|
|
+ data: [
|
|
|
+ "限电损失电量(单位:万kwh)",
|
|
|
+ "故障损失电量(单位:万kwh)",
|
|
|
+ "检修损失电量(单位:万kwh)",
|
|
|
+ "性能损失电量(单位:万kwh)",
|
|
|
+ "受累损失电量(单位:万kwh)",
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: "3%",
|
|
|
+ right: "4%",
|
|
|
+ bottom: "3%",
|
|
|
+ containLabel: true,
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ type: "value",
|
|
|
+ boundaryGap: [0, 0.01],
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: "category",
|
|
|
+ data: this.histogram.date,
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ 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,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ option && myChart.setOption(option);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.query_fc();
|
|
|
+ // this.query_benchmarkWpList();
|
|
|
+ },
|
|
|
+};
|