|
|
@@ -18,7 +18,7 @@
|
|
|
<el-row :gutter="1">
|
|
|
<el-form-item label="风场">
|
|
|
<el-input
|
|
|
- v-model="formInline.windfarm"
|
|
|
+ v-model="formInline.wpIds"
|
|
|
id="windfarm"
|
|
|
placeholder="风场"
|
|
|
></el-input>
|
|
|
@@ -42,20 +42,26 @@
|
|
|
></el-input>
|
|
|
</el-form-item>
|
|
|
|
|
|
- <el-form-item label="选择时间：">
|
|
|
+ <el-form-item label="开始时间">
|
|
|
<el-date-picker
|
|
|
- v-model="timedate"
|
|
|
- type="daterange"
|
|
|
- range-separator="至"
|
|
|
- start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期"
|
|
|
- @click="checktime"
|
|
|
+ v-model="beginDate"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择日期"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="结束时间">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="endDate"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择日期"
|
|
|
>
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item>
|
|
|
- <el-button type="primary" @click="queryApData" :plain="true"
|
|
|
+ <el-button type="primary" @click="queryPowerAll" :plain="true"
|
|
|
>查询</el-button
|
|
|
>
|
|
|
</el-form-item>
|
|
|
@@ -89,6 +95,7 @@
|
|
|
>
|
|
|
<el-card
|
|
|
shadow="always"
|
|
|
+ ref="fc_zzt_card"
|
|
|
style="
|
|
|
height: 440px;
|
|
|
width: 45%;
|
|
|
@@ -97,60 +104,254 @@
|
|
|
"
|
|
|
>
|
|
|
<div
|
|
|
- id="chartLineBox"
|
|
|
+ id="histogram_fc"
|
|
|
+ ref="fc_zzt"
|
|
|
style="width: 800px; height: 400px; margin: auto"
|
|
|
></div>
|
|
|
</el-card>
|
|
|
|
|
|
- <el-card shadow="always" style="width: 45%" height="400px" id="moban">
|
|
|
+ <el-card
|
|
|
+ shadow="always"
|
|
|
+ style="width: 45%"
|
|
|
+ height="400px"
|
|
|
+ id="moban"
|
|
|
+ >
|
|
|
<el-table
|
|
|
- :data="tableData"
|
|
|
+ id="fc_table"
|
|
|
+ :data="fc_date"
|
|
|
style="width: 100%"
|
|
|
max-height="400px"
|
|
|
>
|
|
|
<el-table-column label="项目列表">
|
|
|
<el-table-column fixed type="index" width="45">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="date" label="名称" width="150">
|
|
|
+ <el-table-column prop="wtName" label="名称" width="150">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="name" label="理论发电量" width="120">
|
|
|
+ <el-table-column
|
|
|
+ prop="total"
|
|
|
+ label="理论发电量"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="province"
|
|
|
+ prop="daydl2"
|
|
|
label="SCADA发电量"
|
|
|
width="120"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="city" label="风速" width="120">
|
|
|
+ <el-table-column prop="dayspeed" label="风速" width="120">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- prop="address"
|
|
|
+ prop="daynhgzssdl"
|
|
|
label="非计划检修"
|
|
|
width="300"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="zip" label="计划检修" width="120">
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhwhssdl"
|
|
|
+ label="计划检修"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="zip" label="受累" width="120">
|
|
|
+ <el-table-column prop="daynhcfdl" label="受累" width="120">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="zip" label="限电" width="120">
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhxdssdl"
|
|
|
+ label="限电"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="zip" label="性能" width="120">
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhxdssdl"
|
|
|
+ label="性能"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="zip" label="风能利用率%" width="120">
|
|
|
+ <el-table-column prop="lyl" label="风能利用率%" width="120">
|
|
|
</el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-card>
|
|
|
+ </el-row>
|
|
|
+ </el-tab-pane>
|
|
|
+
|
|
|
+ <el-tab-pane label="项目" name="second" id="xm">
|
|
|
+ <el-row
|
|
|
+ style="
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <el-card
|
|
|
+ shadow="always"
|
|
|
+ style="
|
|
|
+ height: 440px;
|
|
|
+ width: 45%;
|
|
|
+ display: table-cell;
|
|
|
+ vertical-align: middle;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ id="histogram_xm"
|
|
|
+ style="width: 800px; height: 400px; margin: auto"
|
|
|
+ ></div>
|
|
|
+ </el-card>
|
|
|
|
|
|
- <!-- <el-table-column fixed="right" label="受累" width="120">
|
|
|
- </el-table-column> -->
|
|
|
+ <el-card
|
|
|
+ shadow="always"
|
|
|
+ style="width: 45%"
|
|
|
+ height="400px"
|
|
|
+ id="moban"
|
|
|
+ >
|
|
|
+ <el-table
|
|
|
+ id="pj_table"
|
|
|
+ :data="pj_date"
|
|
|
+ style="width: 100%"
|
|
|
+ max-height="400px"
|
|
|
+ >
|
|
|
+ <el-table-column label="项目列表">
|
|
|
+ <el-table-column fixed type="index" width="45">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wtName" label="名称" width="150">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="total"
|
|
|
+ label="理论发电量"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daydl2"
|
|
|
+ label="SCADA发电量"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="dayspeed" label="风速" width="120">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhgzssdl"
|
|
|
+ label="非计划检修"
|
|
|
+ width="300"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhwhssdl"
|
|
|
+ label="计划检修"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="daynhcfdl" label="受累" width="120">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhxdssdl"
|
|
|
+ label="限电"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhxdssdl"
|
|
|
+ label="性能"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="lyl" label="风能利用率%" width="120">
|
|
|
+ </el-table-column>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-card>
|
|
|
</el-row>
|
|
|
</el-tab-pane>
|
|
|
|
|
|
- <el-tab-pane label="项目" name="second" id="xm"> </el-tab-pane>
|
|
|
+ <el-tab-pane label="集电线路" name="jdxl" id="jdxl">
|
|
|
+ <el-row
|
|
|
+ style="
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <el-card
|
|
|
+ shadow="always"
|
|
|
+ style="
|
|
|
+ width: 45%;
|
|
|
+ display: table-cell;
|
|
|
+ vertical-align: middle;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ id="histogram_jdxl"
|
|
|
+ style="width: 800px; margin: auto"
|
|
|
+ :style="{height : judge === true ? '1200px' : '600px'}"
|
|
|
+ ></div>
|
|
|
+ </el-card>
|
|
|
|
|
|
- <el-tab-pane label="集电线路" name="third" id="jcxl"> </el-tab-pane>
|
|
|
+ <el-card
|
|
|
+ shadow="always"
|
|
|
+ style="width: 45%"
|
|
|
+ height="400px"
|
|
|
+ id="moban"
|
|
|
+ >
|
|
|
+ <el-table
|
|
|
+ id="xl_table"
|
|
|
+ :data="xl_date"
|
|
|
+ style="width: 100%"
|
|
|
+ max-height="600px"
|
|
|
+ >
|
|
|
+ <el-table-column label="项目列表">
|
|
|
+ <el-table-column fixed type="index" width="45">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="wtName" label="名称" width="150">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="total"
|
|
|
+ label="理论发电量"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daydl2"
|
|
|
+ label="SCADA发电量"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="dayspeed" label="风速" width="120">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhgzssdl"
|
|
|
+ label="非计划检修"
|
|
|
+ width="300"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhwhssdl"
|
|
|
+ label="计划检修"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="daynhcfdl" label="受累" width="120">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhxdssdl"
|
|
|
+ label="限电"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="daynhxdssdl"
|
|
|
+ label="性能"
|
|
|
+ width="120"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="lyl" label="风能利用率%" width="120">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-card>
|
|
|
+ </el-row>
|
|
|
+ </el-tab-pane>
|
|
|
</el-tabs>
|
|
|
</el-card>
|
|
|
</el-main>
|
|
|
@@ -159,114 +360,183 @@
|
|
|
|
|
|
<script>
|
|
|
import * as echarts from "echarts";
|
|
|
+import excelHelper from "@/utils/excelHelper";
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ judge:true,
|
|
|
+ autoHeight:1200,
|
|
|
formInline: {
|
|
|
- windfarm: "",
|
|
|
- project: "",
|
|
|
- line: "",
|
|
|
+ wpIds: "NSS_FDC",
|
|
|
+ project: "NSS01_GC",
|
|
|
+ line: "NSS01_XL",
|
|
|
},
|
|
|
- timedate: "",
|
|
|
- activeName: "second",
|
|
|
- tableData: [
|
|
|
- {
|
|
|
- date: "2016-05-03",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-02",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-04",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-01",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-08",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-06",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-07",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- ,
|
|
|
- {
|
|
|
- date: "2016-05-07",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-07",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- {
|
|
|
- date: "2016-05-07",
|
|
|
- name: "王小虎",
|
|
|
- province: "上海",
|
|
|
- city: "普陀区",
|
|
|
- address: "上海市普陀区金沙江路 1518 弄",
|
|
|
- zip: 200333,
|
|
|
- },
|
|
|
- ],
|
|
|
+ fc_date: [],
|
|
|
+ pj_date: [],
|
|
|
+ xl_date: [],
|
|
|
+ beginDate: "2021-01-01",
|
|
|
+ endDate: "2021-01-02",
|
|
|
+ activeName: "first",
|
|
|
+ tableid: "fc",
|
|
|
+ celname: [],
|
|
|
+ histogram_fc: {},
|
|
|
+ histogram_xm: {},
|
|
|
+ histogram_jdxl: {},
|
|
|
+ table_fc: {},
|
|
|
+ table_xm: {},
|
|
|
+ table_jdxl: {},
|
|
|
+ queryAll_querybutton: {},
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
onSubmit() {
|
|
|
console.log("submit!");
|
|
|
},
|
|
|
- handleClick() {},
|
|
|
+ handleClick(tab) {
|
|
|
+ if (tab.name === "first") {
|
|
|
+ this.tableid = "fc";
|
|
|
+ this.query();
|
|
|
+ } else if (tab.name === "second") {
|
|
|
+ this.tableid = "pj";
|
|
|
+ this.query();
|
|
|
+ } else if (tab.name === "jdxl") {
|
|
|
+ this.tableid = "xl";
|
|
|
+ this.query();
|
|
|
+ }
|
|
|
+ },
|
|
|
deleteRow(index, rows) {
|
|
|
rows.splice(index, 1);
|
|
|
},
|
|
|
- queryApData() {
|
|
|
- if (this.formInline.line == "") {
|
|
|
- this.$message.error("请选择路线！");
|
|
|
+ query() {
|
|
|
+ this.fc_date = "";
|
|
|
+ this.xl_date = "";
|
|
|
+ this.pj_date = "";
|
|
|
+ this.$http
|
|
|
+ .get(
|
|
|
+ "powercompare/queryPowerAll?wpIds=" +
|
|
|
+ this.formInline.wpIds +
|
|
|
+ "&beginDate=" +
|
|
|
+ this.beginDate +
|
|
|
+ "&endDate=" +
|
|
|
+ this.endDate +
|
|
|
+ "&queryType=" +
|
|
|
+ this.tableid
|
|
|
+ )
|
|
|
+ .then((res) => {
|
|
|
+ let that = this;
|
|
|
+ if (this.tableid === "fc") {
|
|
|
+ that.drawhistogram_fc(res.data.data);
|
|
|
+ } else if (this.tableid === "pj") {
|
|
|
+ that.drawhistogram_pj(res.data.data);
|
|
|
+ } else if (this.tableid === "xl") {
|
|
|
+ this.autoHeight = 1200;
|
|
|
+ that.drawhistogram_xl(res.data.data);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //表格数据获取
|
|
|
+ this.$http
|
|
|
+ .get(
|
|
|
+ "powercompare/powerAjaxAll?wpIds=" +
|
|
|
+ this.formInline.wpIds +
|
|
|
+ "&beginDate=" +
|
|
|
+ this.beginDate +
|
|
|
+ "&endDate=" +
|
|
|
+ this.endDate +
|
|
|
+ "&queryType=" +
|
|
|
+ this.tableid +
|
|
|
+ "&sortName=" +
|
|
|
+ this.formInline.wpIds +
|
|
|
+ "&sortOrder=" +
|
|
|
+ "Asc"
|
|
|
+ )
|
|
|
+ .then((res) => {
|
|
|
+ let that = this;
|
|
|
+
|
|
|
+ console.log(res);
|
|
|
+ let queryAll_table = res.data.data;
|
|
|
+ if (this.tableid === "fc") {
|
|
|
+ that.fc_date = queryAll_table;
|
|
|
+ } else if (this.tableid === "pj") {
|
|
|
+ that.pj_date = queryAll_table;
|
|
|
+ } else if (this.tableid === "xl") {
|
|
|
+ that.xl_date = queryAll_table;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async queryPowerAll() {
|
|
|
+ this.judge = false;
|
|
|
+ this.autoHeight = 600;
|
|
|
+ let that = this;
|
|
|
+ if (this.beginDate == "" || this.endDate == "" || this.beginDate == undefined || this.endDate == undefined) {
|
|
|
+ this.beginDate = "2021-01-01";
|
|
|
+ that.endDate = "2021-01-02";
|
|
|
+ that.$message.error("请选时间！");
|
|
|
return;
|
|
|
}
|
|
|
+ this.fc_date = "";
|
|
|
+ this.xl_date = "";
|
|
|
+ this.pj_date = "";
|
|
|
+
|
|
|
+ if (
|
|
|
+ that.formInline.wpIds == "" ||
|
|
|
+ that.formInline.wpIds == null ||
|
|
|
+ that.formInline.wpIds == undefined
|
|
|
+ ) {
|
|
|
+ that.query();
|
|
|
+ } else {
|
|
|
+ this.$http
|
|
|
+ .get(
|
|
|
+ "powercompare/queryPower?wpIds=" +
|
|
|
+ this.formInline.wpIds +
|
|
|
+ "&pjIds=" +
|
|
|
+ this.formInline.project +
|
|
|
+ "&lineIds=" +
|
|
|
+ this.formInline.line +
|
|
|
+ "&beginDate=" +
|
|
|
+ this.beginDate +
|
|
|
+ "&endDate=" +
|
|
|
+ this.endDate
|
|
|
+ )
|
|
|
+ .then((res) => {
|
|
|
+ let that = this;
|
|
|
+ let queryAll = res.data.data;
|
|
|
+ if (this.tableid === "fc") {
|
|
|
+ that.drawhistogram_fc(queryAll);
|
|
|
+ } else if (this.tableid === "pj") {
|
|
|
+ that.drawhistogram_pj(queryAll);
|
|
|
+ } else if (this.tableid === "xl") {
|
|
|
+ that.drawhistogram_xl(queryAll);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.$http
|
|
|
+ .get(
|
|
|
+ "powercompare/powerAjax?wpIds=" +
|
|
|
+ this.formInline.wpIds +
|
|
|
+ "&pjIds=" +
|
|
|
+ this.formInline.project +
|
|
|
+ "&lineIds=" +
|
|
|
+ this.formInline.line +
|
|
|
+ "&beginDate=" +
|
|
|
+ this.beginDate +
|
|
|
+ "&endDate=" +
|
|
|
+ this.endDate +
|
|
|
+ "&sortName=" +
|
|
|
+ this.formInline.wpIds +
|
|
|
+ "&sortOrder=" +
|
|
|
+ "Asc"
|
|
|
+ )
|
|
|
+ .then((res) => {
|
|
|
+ let that = this;
|
|
|
+ let queryAll_table = res.data.data;
|
|
|
+ if (this.tableid === "fc") {
|
|
|
+ that.fc_date = queryAll_table;
|
|
|
+ } else if (this.tableid === "pj") {
|
|
|
+ that.pj_date = queryAll_table;
|
|
|
+ } else if (this.tableid === "xl") {
|
|
|
+ that.xl_date = queryAll_table;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
checkwindfarm() {
|
|
|
if (this.formInline.windfarm == "") {
|
|
|
@@ -293,148 +563,447 @@ export default {
|
|
|
queryApDataMx() {
|
|
|
this.$router.push({ path: "/new_performanceList_fan" });
|
|
|
},
|
|
|
- toExcel() {},
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.chartLine = echarts.init(document.getElementById("chartLineBox"));
|
|
|
- var option;
|
|
|
+ toExcel() {
|
|
|
+ let that = this;
|
|
|
+ if (this.tableid === "fc") {
|
|
|
+ excelHelper.exportExcel("fc_table","fc数据",".xls",true);
|
|
|
+ } else if (this.tableid === "pj") {
|
|
|
+ excelHelper.exportExcel("pj_table","pj数据",".xls",true);
|
|
|
+ } else if (this.tableid === "xl") {
|
|
|
+ excelHelper.exportExcel("xl_table","xl数据",".xls",true);
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ drawhistogram_fc(date) {
|
|
|
+ this.chartLine = echarts.init(document.getElementById("histogram_fc"));
|
|
|
|
|
|
- option = {
|
|
|
- title: {
|
|
|
- text: "风机绩效榜单",
|
|
|
- left: 300,
|
|
|
- top: -5,
|
|
|
- textStyle: {
|
|
|
- fontSize: 13,
|
|
|
+ var option;
|
|
|
+ option = {
|
|
|
+ title: {
|
|
|
+ text: "风机绩效榜单",
|
|
|
+ left: 300,
|
|
|
+ top: -5,
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 13,
|
|
|
+ },
|
|
|
},
|
|
|
- },
|
|
|
- tooltip: {
|
|
|
- trigger: "axis",
|
|
|
- axisPointer: {
|
|
|
- // Use axis to trigger tooltip
|
|
|
- type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ axisPointer: {
|
|
|
+ // Use axis to trigger tooltip
|
|
|
+ type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
|
|
|
+ },
|
|
|
},
|
|
|
- },
|
|
|
- legend: {
|
|
|
- left: 15,
|
|
|
- top: 30,
|
|
|
- data: [
|
|
|
- "实发电量",
|
|
|
- "计划检修损失",
|
|
|
- "非计划检修损失",
|
|
|
- "限电损失",
|
|
|
- "受累损失",
|
|
|
- "性能损失",
|
|
|
- "总和",
|
|
|
+ legend: {
|
|
|
+ left: 15,
|
|
|
+ top: 30,
|
|
|
+ data: [
|
|
|
+ "实发电量",
|
|
|
+ "计划检修损失",
|
|
|
+ "非计划检修损失",
|
|
|
+ "限电损失",
|
|
|
+ "受累损失",
|
|
|
+ "性能损失",
|
|
|
+ "总和",
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: "3%",
|
|
|
+ right: "4%",
|
|
|
+ bottom: "3%",
|
|
|
+ containLabel: true,
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: "value",
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ type: "category",
|
|
|
+ data: date.names,
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "实发电量",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.sfdl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "计划检修损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.whdl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "非计划检修损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.gzdl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "限电损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.xddl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "受累损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.sldl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "性能损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: date.qfdl,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.qfdl,
|
|
|
+ },
|
|
|
+ //曲线
|
|
|
+ {
|
|
|
+ name: "总和",
|
|
|
+ data: date.yfdl,
|
|
|
+ type: "line",
|
|
|
+ symbol: "circle",
|
|
|
+ symbolSize: 20,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#5470C6",
|
|
|
+ width: 4,
|
|
|
+ type: "dashed",
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ borderWidth: 3,
|
|
|
+ borderColor: "#EE6666",
|
|
|
+ color: "yellow",
|
|
|
+ },
|
|
|
+ },
|
|
|
],
|
|
|
- },
|
|
|
- grid: {
|
|
|
- left: "3%",
|
|
|
- right: "4%",
|
|
|
- bottom: "3%",
|
|
|
- containLabel: true,
|
|
|
- },
|
|
|
- xAxis: {
|
|
|
- type: "value",
|
|
|
- },
|
|
|
- yAxis: {
|
|
|
- type: "category",
|
|
|
- data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: "实发电量",
|
|
|
- type: "bar",
|
|
|
- stack: "total",
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
+ };
|
|
|
+ this.chartLine.setOption(option);
|
|
|
+ },
|
|
|
+ drawhistogram_pj(date) {
|
|
|
+ this.chartLine = echarts.init(document.getElementById("histogram_xm"));
|
|
|
+ var option;
|
|
|
+
|
|
|
+ var option;
|
|
|
+ option = {
|
|
|
+ title: {
|
|
|
+ text: "风机绩效榜单",
|
|
|
+ left: 300,
|
|
|
+ top: -5,
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 13,
|
|
|
},
|
|
|
- emphasis: {
|
|
|
- focus: "series",
|
|
|
+ },
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ axisPointer: {
|
|
|
+ // Use axis to trigger tooltip
|
|
|
+ type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
|
|
|
},
|
|
|
- data: [320, 302, 301, 334, 390, 330, 320],
|
|
|
},
|
|
|
- {
|
|
|
- name: "计划检修损失",
|
|
|
- type: "bar",
|
|
|
- stack: "total",
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
+ legend: {
|
|
|
+ left: 15,
|
|
|
+ top: 30,
|
|
|
+ data: [
|
|
|
+ "实发电量",
|
|
|
+ "计划检修损失",
|
|
|
+ "非计划检修损失",
|
|
|
+ "限电损失",
|
|
|
+ "受累损失",
|
|
|
+ "性能损失",
|
|
|
+ "总和",
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: "3%",
|
|
|
+ right: "4%",
|
|
|
+ bottom: "3%",
|
|
|
+ containLabel: true,
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: "value",
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ type: "category",
|
|
|
+ data: date.names,
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "实发电量",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.sfdl,
|
|
|
},
|
|
|
- emphasis: {
|
|
|
- focus: "series",
|
|
|
+ {
|
|
|
+ name: "计划检修损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.whdl,
|
|
|
},
|
|
|
- data: [120, 132, 101, 134, 90, 230, 210],
|
|
|
- },
|
|
|
- {
|
|
|
- name: "非计划检修损失",
|
|
|
- type: "bar",
|
|
|
- stack: "total",
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
+ {
|
|
|
+ name: "非计划检修损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.gzdl,
|
|
|
},
|
|
|
- emphasis: {
|
|
|
- focus: "series",
|
|
|
+ {
|
|
|
+ name: "限电损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.xddl,
|
|
|
},
|
|
|
- data: [220, 182, 191, 234, 290, 330, 310],
|
|
|
- },
|
|
|
- {
|
|
|
- name: "限电损失",
|
|
|
- type: "bar",
|
|
|
- stack: "total",
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
+ {
|
|
|
+ name: "受累损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.sldl,
|
|
|
},
|
|
|
- emphasis: {
|
|
|
- focus: "series",
|
|
|
+ {
|
|
|
+ name: "性能损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: date.qfdl,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.qfdl,
|
|
|
},
|
|
|
- data: [150, 212, 201, 154, 190, 330, 410],
|
|
|
- },
|
|
|
- {
|
|
|
- name: "受累损失",
|
|
|
- type: "bar",
|
|
|
- stack: "total",
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
+ //曲线
|
|
|
+ {
|
|
|
+ name: "总和",
|
|
|
+ data: date.yfdl,
|
|
|
+ type: "line",
|
|
|
+ symbol: "circle",
|
|
|
+ symbolSize: 20,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#5470C6",
|
|
|
+ width: 4,
|
|
|
+ type: "dashed",
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ borderWidth: 3,
|
|
|
+ borderColor: "#EE6666",
|
|
|
+ color: "yellow",
|
|
|
+ },
|
|
|
},
|
|
|
- emphasis: {
|
|
|
- focus: "series",
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ this.chartLine.setOption(option);
|
|
|
+ },
|
|
|
+ drawhistogram_xl(date) {
|
|
|
+ this.chartLine = echarts.init(document.getElementById("histogram_jdxl"));
|
|
|
+ this.chartLine.clear();
|
|
|
+ this.chartLine.resize({height: this.autoHeight})
|
|
|
+ var option;
|
|
|
+
|
|
|
+ var option;
|
|
|
+ option = {
|
|
|
+ title: {
|
|
|
+ text: "风机绩效榜单",
|
|
|
+ left: 300,
|
|
|
+ top: -5,
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 13,
|
|
|
},
|
|
|
- data: [820, 832, 901, 934, 1290, 1330, 1320],
|
|
|
},
|
|
|
- {
|
|
|
- name: "性能损失",
|
|
|
- type: "bar",
|
|
|
- stack: "total",
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
+ tooltip: {
|
|
|
+ trigger: "axis",
|
|
|
+ axisPointer: {
|
|
|
+ // Use axis to trigger tooltip
|
|
|
+ type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
|
|
|
},
|
|
|
- emphasis: {
|
|
|
- focus: "series",
|
|
|
- },
|
|
|
- data: [820, 832, 901, 934, 1290, 1330, 1320],
|
|
|
},
|
|
|
- //曲线
|
|
|
- {
|
|
|
- name: "总和",
|
|
|
- data: [2500, 2600, 2700, 2900, 3000, 3500, 4000],
|
|
|
- type: "line",
|
|
|
- symbol: "circle",
|
|
|
- symbolSize: 20,
|
|
|
- lineStyle: {
|
|
|
- color: "#5470C6",
|
|
|
- width: 4,
|
|
|
- type: "dashed",
|
|
|
+ legend: {
|
|
|
+ left: 15,
|
|
|
+ top: 30,
|
|
|
+ data: [
|
|
|
+ "实发电量",
|
|
|
+ "计划检修损失",
|
|
|
+ "非计划检修损失",
|
|
|
+ "限电损失",
|
|
|
+ "受累损失",
|
|
|
+ "性能损失",
|
|
|
+ "总和",
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: "3%",
|
|
|
+ right: "4%",
|
|
|
+ bottom: "3%",
|
|
|
+ containLabel: true,
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: "value",
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ type: "category",
|
|
|
+ data: date.names,
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "实发电量",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.sfdl,
|
|
|
},
|
|
|
- itemStyle: {
|
|
|
- borderWidth: 3,
|
|
|
- borderColor: "#EE6666",
|
|
|
- color: "yellow",
|
|
|
+ {
|
|
|
+ name: "计划检修损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.whdl,
|
|
|
},
|
|
|
- },
|
|
|
- ],
|
|
|
- };
|
|
|
- this.chartLine.setOption(option);
|
|
|
+ {
|
|
|
+ name: "非计划检修损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.gzdl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "限电损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.xddl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "受累损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.sldl,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "性能损失",
|
|
|
+ type: "bar",
|
|
|
+ stack: "total",
|
|
|
+ label: {
|
|
|
+ show: date.qfdl,
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ focus: "series",
|
|
|
+ },
|
|
|
+ data: date.qfdl,
|
|
|
+ },
|
|
|
+ //曲线
|
|
|
+ {
|
|
|
+ name: "总和",
|
|
|
+ data: date.yfdl,
|
|
|
+ type: "line",
|
|
|
+ symbol: "circle",
|
|
|
+ symbolSize: 20,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#5470C6",
|
|
|
+ width: 4,
|
|
|
+ type: "dashed",
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ borderWidth: 3,
|
|
|
+ borderColor: "#EE6666",
|
|
|
+ color: "yellow",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ this.chartLine.setOption(option);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.query();
|
|
|
},
|
|
|
};
|
|
|
</script>
|
zhaomiao