Browse Source

30天发电量柱图新增数据及弹窗

mw_666 3 years ago
parent
commit
5c84ef3d10
1 changed files with 75 additions and 16 deletions
  1. 75 16
      src/views/WindSite/pages/Home/Home.vue

+ 75 - 16
src/views/WindSite/pages/Home/Home.vue

@@ -365,10 +365,18 @@
         </panel>
         </Col>
         <Col :span="8">
-        <panel title="日发电量对比">
+        <panel title="日发电量对比" subTitle="详情" @click='rfdl'>
           <multiple-bar-chart height="21.296vh" :list="CompleteElectricity.data" :units="CompleteElectricity.units"
             :showLegend="true" />
         </panel>
+		<el-dialog title="日发电量对比" v-model="rfdlDialog" width="70%" top="15vh" custom-class="modal" :close-on-click-modal="false">
+			<el-row type="flex">
+				<ComTable :data="tableData" height="15vh"></ComTable>
+			</el-row>
+			<el-row type="flex">
+				<multiple-bar-chart height="45vh" :list="CompleteElectricity.data" :units="CompleteElectricity.units" :showLegend="true" />
+			</el-row>
+		</el-dialog>
         </Col>
         <Col :span="8">
         <panel title="月发电量对比">
@@ -396,12 +404,13 @@ import LightMatrix from "./light-matrix.vue";
 import Station from "./Station.vue";
 import WindSiteWeather from "./wind-site-weather.vue";
 import BtnGroup2 from "@com/coms/btn/btn-group-double.vue";
+import ComTable from "@com/coms/table/table.vue";
 
 export default {
   // 名称
   name: "WindSiteHome",
   // 使用组件
-  components: { BtnGroup2, WindSiteWeather, Row, Col, Panel, DualPieChart, MultipleLineChart, Panel3, SvgIcon, HoverBarChart, MultipleBarChart, NormalLineChart, LightMatrix, BtnGroupDouble, Station },
+  components: { BtnGroup2, WindSiteWeather, Row, Col, Panel, DualPieChart, MultipleLineChart, Panel3, SvgIcon, HoverBarChart, MultipleBarChart, NormalLineChart, LightMatrix, BtnGroupDouble, Station ,ComTable},
   // 数据
   data () {
     return {
@@ -505,6 +514,11 @@ export default {
           btns: [],
         },
       ],
+	  rfdlDialog:false,
+	  tableData: {
+	  	column: [],
+	  	data: [],
+	  },
     };
   },
   // 函数
@@ -838,10 +852,16 @@ export default {
           wpId: that.wpId,
         },
         success (res) {
-			console.log(111111111,res)
+			let column = [{
+				name: '',
+				field: 'tit',
+				is_num: false,
+				is_light: false,
+			 }],
+			tableData = [];
           let data = [
             {
-              title: "发电量",
+              title: "发电量",
               yAxisIndex: 0,
               value: [],
             },
@@ -850,20 +870,56 @@ export default {
               yAxisIndex: 0,
               value: [],
             },
+			{
+			  title: "风速",
+			  yAxisIndex: 0,
+			  value: [],
+			},
+			{
+			  title: "上网电量",
+			  yAxisIndex: 0,
+			  value: [],
+			},
           ];
-
-          res.data.forEach((ele) => {
-            data[0].value.push({
-              text: ele.timestr,
-              value: ele.value1 || 0,
-            });
-            data[1].value.push({
-              text: ele.timestr,
-              value: ele.value2 || 0,
-            });
+	
+          res.data.forEach((ele,idx) => {
+			  data[0].value.push({
+				text: ele.timestr,
+				value: ele.value1 || 0,
+			  });
+			 data[1].value.push({
+				text: ele.timestr,
+				value: ele.value2 || 0,
+			 });
+			 data[2].value.push({
+				text: ele.timestr,
+				value: ele.value3 || 0,
+			 });
+			 data[3].value.push({
+				text: ele.timestr,
+				value: ele.value4 || 0,
+			 });
+			 
+			 column.push({
+				name: ele.timestr,
+				field: idx,
+				is_num: false,
+				is_light: false,
+			 });
           });
-
-          that.CompleteElectricity.data = data;
+			that.CompleteElectricity.data = data;
+			data.forEach((ele,idx)=>{
+				let obj = [];
+				ele.value.forEach((ele2,idx2)=>{
+				  obj[idx2] = ele2.value;
+				})
+				obj['tit'] = ele.title;
+				tableData.push(obj)
+			})
+		  that.tableData = {
+			  column:column,
+			  data:tableData
+		  }
         },
       });
     },
@@ -907,6 +963,9 @@ export default {
         },
       });
     },
+	rfdl(){
+		this.rfdlDialog = true;
+	}
   },
 
   created () {