|
|
@@ -1,400 +0,0 @@
|
|
|
-import * as echarts from "echarts";
|
|
|
-//import ecStat from "echarts-stat";
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- wpIdslist: {
|
|
|
- name: "",
|
|
|
- id: "",
|
|
|
- },
|
|
|
- pjIdslist: {
|
|
|
- name: "麻黄山一期工程",
|
|
|
- id: "MHS01_GC",
|
|
|
- },
|
|
|
- xlIdslist: {
|
|
|
- name: "麻黄山一号集电线路",
|
|
|
- id: "MHS01_XL",
|
|
|
- },
|
|
|
- fc: "MHS_FDC",
|
|
|
- pj: "麻黄山一期工程",
|
|
|
- xl: "麻黄山一号集电线路",
|
|
|
- year: "2021",
|
|
|
- month: "01",
|
|
|
- activeName: "no_1",
|
|
|
- loading:true,
|
|
|
- loading2:true,
|
|
|
- loading3:true,
|
|
|
- xllist: [],
|
|
|
- scatter_1: [],
|
|
|
- scatter_2: [],
|
|
|
- scatter_3: [],
|
|
|
- };
|
|
|
- },
|
|
|
- created() {},
|
|
|
- methods: {
|
|
|
- query_wpid() {
|
|
|
- let that = this;
|
|
|
- let newData = new Date();
|
|
|
- this.year = newData.getFullYear()+'';
|
|
|
- let month = newData.getMonth()+1;
|
|
|
- if(month<10){that.month='0'+month};
|
|
|
- this.$http.get("powercompare/windfarmAjax?").then((res) => {
|
|
|
- this.wpIdslist = res.data.data;
|
|
|
- // this.query_xml();
|
|
|
- });
|
|
|
- },
|
|
|
- handleClick() {
|
|
|
- if (this.activeName == "no_1") {
|
|
|
- this.query_scatter_1();
|
|
|
- } else if (this.activeName == "no_2") {
|
|
|
- this.query_scatter_2();
|
|
|
- } else if (this.activeName == "no_3") {
|
|
|
- this.query_scatter_3();
|
|
|
- }
|
|
|
- },
|
|
|
- query_xl() {
|
|
|
- this.xl = "";
|
|
|
- Object.assign(this.$data.xlIdslist, this.$options.data().xlIdslist);
|
|
|
- this.$http
|
|
|
- .get("powercompare/lineAjax?pjIds=" + this.xllist)
|
|
|
- .then((res) => {
|
|
|
- this.xlIdslist = res.data.data;
|
|
|
- });
|
|
|
- },
|
|
|
- query_scatter_1() {
|
|
|
- let that = this;
|
|
|
- Object.assign(this.$data.scatter_1, this.$options.data().scatter_1);
|
|
|
- var digital = new URLSearchParams();
|
|
|
- digital.append("wpId", this.fc);
|
|
|
- digital.append("lnId", "");
|
|
|
- digital.append("pjId", "");
|
|
|
- digital.append("year", this.year);
|
|
|
- digital.append("month", this.month);
|
|
|
- this.$http.post("/scatter/scatterAjax", digital).then((res) => {
|
|
|
- this.scatter_1 = res.data.data;
|
|
|
- this.loading1=false;
|
|
|
- this.draw_scatter_diagram_1();
|
|
|
-
|
|
|
- });
|
|
|
- },
|
|
|
- query_scatter_2() {
|
|
|
- let that = this;
|
|
|
- Object.assign(this.$data.scatter_2, this.$options.data().scatter_2);
|
|
|
- var digital = new URLSearchParams();
|
|
|
- digital.append("wpId", this.fc);
|
|
|
- digital.append("lnId", "");
|
|
|
- digital.append("pjId", this.pj);
|
|
|
- digital.append("year", this.year);
|
|
|
- digital.append("month", this.month);
|
|
|
- this.$http.post("/scatter/scatterAjax", digital).then((res) => {
|
|
|
- this.scatter_2 = res.data.data;
|
|
|
- this.loading2=false;
|
|
|
- this.draw_scatter_diagram_2();
|
|
|
-
|
|
|
- });
|
|
|
- },
|
|
|
- query_scatter_3() {
|
|
|
- Object.assign(this.$data.scatter_3, this.$options.data().scatter_3);
|
|
|
- var digital = new URLSearchParams();
|
|
|
- digital.append("wpId", this.fc);
|
|
|
- digital.append("lnId", this.xl);
|
|
|
- digital.append("pjId", "");
|
|
|
- digital.append("year", this.year);
|
|
|
- digital.append("month", this.month);
|
|
|
- this.$http.post("/scatter/scatterAjax", digital).then((res) => {
|
|
|
- this.scatter_3 = res.data.data;
|
|
|
- this.loading3=false;
|
|
|
- this.draw_scatter_diagram_3();
|
|
|
- });
|
|
|
- },
|
|
|
- query_xml() {
|
|
|
- let that = this;
|
|
|
- Object.assign(this.$data.xllist, this.$options.data().xllist);
|
|
|
- Object.assign(this.$data.pjIdslist, this.$options.data().pjIdslist);
|
|
|
- this.pj = "";
|
|
|
- this.xl = "";
|
|
|
- this.xllist = [];
|
|
|
- this.$http
|
|
|
- .get("powercompare/projectAjax?wpIds=" + this.fc)
|
|
|
- .then((res) => {
|
|
|
- this.pjIdslist = res.data.data;
|
|
|
- for (let i = 0; i < Object.keys(this.pjIdslist).length; i++) {
|
|
|
- that.xllist.push(that.pjIdslist[i].id);
|
|
|
- }
|
|
|
- this.query_xl();
|
|
|
- });
|
|
|
- },
|
|
|
- filter() {
|
|
|
- for (let i = 0; i < Object.keys(this.QBlist).length; i++) {
|
|
|
- fjj = "";
|
|
|
- fjj = this.QBlist[i].id;
|
|
|
- if (fjj.endsWith("FDC")) {
|
|
|
- that.FClist.push(this.QBlist[i]);
|
|
|
- } else {
|
|
|
- that.GFlist.push(this.QBlist[i]);
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- draw_scatter_diagram_1() {
|
|
|
- var chartDom = document.getElementById("scatter_diagram_1");
|
|
|
- var myChart = echarts.init(chartDom);
|
|
|
- var option;
|
|
|
-
|
|
|
-
|
|
|
- option = {
|
|
|
- title: {
|
|
|
- text: "风机功率排布情况",
|
|
|
- lft: "300px",
|
|
|
- },
|
|
|
- legend: {
|
|
|
- data: ["功率"],
|
|
|
- right: "66px",
|
|
|
- },
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- show: false,
|
|
|
- trigger: "axis",
|
|
|
- axisPointer: {
|
|
|
- type: "cross",
|
|
|
- },
|
|
|
- },
|
|
|
- xAxis: {
|
|
|
- type: "value",
|
|
|
- scale: true,
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- type: "dashed",
|
|
|
- },
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- formatter: "{value} m/s",
|
|
|
- },
|
|
|
- splitNumber: 20,
|
|
|
- },
|
|
|
- yAxis: {
|
|
|
- type: "value",
|
|
|
- scale: true,
|
|
|
- min: -40,
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- type: "dashed",
|
|
|
- },
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- formatter: "{value} 万kw",
|
|
|
- },
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: "功率",
|
|
|
- type: "scatter",
|
|
|
- color: "#FF7F50",
|
|
|
- data: this.scatter_1,
|
|
|
- markPoint: {
|
|
|
- data: [
|
|
|
- { type: "max", name: "最大值" },
|
|
|
- { type: "min", name: "最小值" },
|
|
|
- ],
|
|
|
- symbol: "pin",
|
|
|
- symbolSize: 50,
|
|
|
- silent: true,
|
|
|
- },
|
|
|
- markLine: {
|
|
|
- data: [{ type: "average", name: "平均值" }],
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- name: "line",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- datasetIndex: 1,
|
|
|
- symbolSize: 0.1,
|
|
|
- symbol: "circle",
|
|
|
- color: "#87CEFA",
|
|
|
- label: { show: false },
|
|
|
- labelLayout: { dx: -20 },
|
|
|
- encode: { label: 2, tooltip: 1 },
|
|
|
- },
|
|
|
- ],
|
|
|
- };
|
|
|
-
|
|
|
- option && myChart.setOption(option);
|
|
|
- },
|
|
|
- draw_scatter_diagram_2() {
|
|
|
- var chartDom = document.getElementById("scatter_diagram_2");
|
|
|
- var myChart = echarts.init(chartDom);
|
|
|
- var option;
|
|
|
-
|
|
|
- option = {
|
|
|
- title: {
|
|
|
- text: "项目功率排布情况",
|
|
|
- left: "300px",
|
|
|
- },
|
|
|
- legend: {
|
|
|
- data: ["功率"],
|
|
|
- right: "66px",
|
|
|
- },
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- show: false,
|
|
|
- trigger: "axis",
|
|
|
- axisPointer: {
|
|
|
- type: "cross",
|
|
|
- },
|
|
|
- },
|
|
|
- xAxis: {
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- type: "dashed",
|
|
|
- },
|
|
|
- },
|
|
|
- scale: true,
|
|
|
- axisLabel: {
|
|
|
- formatter: "{value} m/s",
|
|
|
- },
|
|
|
- splitNumber: 20,
|
|
|
- },
|
|
|
- yAxis: {
|
|
|
- min: -40,
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- type: "dashed",
|
|
|
- },
|
|
|
- scale: true,
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- formatter: "{value} 万kw",
|
|
|
- },
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: "功率",
|
|
|
- type: "scatter",
|
|
|
- color: "#FF7F50",
|
|
|
- data: this.scatter_2,
|
|
|
- markPoint: {
|
|
|
- data: [
|
|
|
- { type: "max", name: "最大值" },
|
|
|
- { type: "min", name: "最小值" },
|
|
|
- ],
|
|
|
- symbol: "pin",
|
|
|
- symbolSize: 50,
|
|
|
- silent: true,
|
|
|
- },
|
|
|
- markLine: {
|
|
|
- data: [{ type: "average", name: "平均值" }],
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- name: "line",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- datasetIndex: 1,
|
|
|
- symbolSize: 0.1,
|
|
|
- symbol: "circle",
|
|
|
- color: "#87CEFA",
|
|
|
- label: { show: false },
|
|
|
- labelLayout: { dx: -20 },
|
|
|
- encode: { label: 2, tooltip: 1 },
|
|
|
- },
|
|
|
- ],
|
|
|
- };
|
|
|
-
|
|
|
- option && myChart.setOption(option);
|
|
|
- },
|
|
|
- draw_scatter_diagram_3() {
|
|
|
- var chartDom = document.getElementById("scatter_diagram_3");
|
|
|
- var myChart = echarts.init(chartDom);
|
|
|
- var option;
|
|
|
-
|
|
|
-
|
|
|
- option = {
|
|
|
- title: {
|
|
|
- text: "线路功率排布情况",
|
|
|
- left: "300px",
|
|
|
- },
|
|
|
- legend: {
|
|
|
- data: ["功率"],
|
|
|
- right: "66px",
|
|
|
- },
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- show: false,
|
|
|
- trigger: "axis",
|
|
|
- axisPointer: {
|
|
|
- type: "cross",
|
|
|
- },
|
|
|
- },
|
|
|
- xAxis: {
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- type: "dashed",
|
|
|
- },
|
|
|
- },
|
|
|
- scale: true,
|
|
|
- axisLabel: {
|
|
|
- formatter: "{value} m/s",
|
|
|
- },
|
|
|
- splitNumber: 20,
|
|
|
- },
|
|
|
- yAxis: {
|
|
|
- min: -40,
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- type: "dashed",
|
|
|
- },
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- formatter: "{value} 万kw",
|
|
|
- },
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: "功率",
|
|
|
- type: "scatter",
|
|
|
- color: "#FF7F50",
|
|
|
- data: this.scatter_3,
|
|
|
- markPoint: {
|
|
|
- data: [
|
|
|
- { type: "max", name: "最大值" },
|
|
|
- { type: "min", name: "最小值" },
|
|
|
- ],
|
|
|
- symbol: "pin",
|
|
|
- symbolSize: 50,
|
|
|
- silent: true,
|
|
|
- },
|
|
|
- // emphasis: {
|
|
|
- // label: {
|
|
|
- // show: true,
|
|
|
- // position: "top",
|
|
|
- // distance: 4,
|
|
|
- // fontStyle: "italic",
|
|
|
- // }
|
|
|
- // },
|
|
|
- markLine: {
|
|
|
- data: [{ type: "average", name: "平均值" }],
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- name: "line",
|
|
|
- type: "line",
|
|
|
- smooth: true,
|
|
|
- datasetIndex: 1,
|
|
|
- symbolSize: 0.1,
|
|
|
- symbol: "circle",
|
|
|
- color: "#87CEFA",
|
|
|
- label: { show: false },
|
|
|
- labelLayout: { dx: -20 },
|
|
|
- encode: { label: 2, tooltip: 1 },
|
|
|
- },
|
|
|
- ],
|
|
|
- };
|
|
|
-
|
|
|
- option && myChart.setOption(option);
|
|
|
- },
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.query_wpid();
|
|
|
- this.query_scatter_1();
|
|
|
- },
|
|
|
-};
|
九山