单站监控首页更新

src/views/ems/dzjk/home/ActiveChart.vue

@@ -15,7 +15,6 @@
 <script>
 import * as echarts from 'echarts'
 import resize from '@/mixins/ems/resize'
-import {formatNumber} from "@/filters/ems";
 
 export default {
   mixins: [resize],
@@ -40,67 +39,19 @@ export default {
     initChart() {
       this.chart = echarts.init(document.querySelector('#activeChart'))
     },
+    showLoading(){
+      this.chart && this.chart.showLoading()
+    },
     setOption(data) {
-      const {siteMonitorDataVo=[],gridNrtPower,loadNrtPower,energyStorageNrtPower,energyStorageAvailElec} = data
-      const source = [['日期','充电量','放电量']]
-      siteMonitorDataVo.forEach(item=>{
-        source.push([item.ammeterDate, item.chargedCap,item.disChargedCap])
+      const source = [['日期','电网功率']]
+      data.forEach((item)=>{
+        source.push([item.statisDate,item.gridPower])
       })
       this.chart.setOption({
-        title: [
-          // 右上角
-          {
-            text: `电网 实时功率：${formatNumber(gridNrtPower)} kW`,
-            top: 10,
-            right: 10,
-            textStyle:{
-              fontSize:12,
-              color:'#666666'
-            }
-          },
-          // 右下角
-          {
-            text: `负载 实时功率：${formatNumber(loadNrtPower)} kW`,
-            bottom: 10,
-            right: 10,
-            textStyle:{
-              fontSize:12,
-              color:'#666666'
-            }
-          },
-          // 左下角第一行
-          {
-            text: '储能',
-            bottom: 40,
-            left: 10,
-            textStyle:{
-              fontSize:12,
-              color:'#666666'
-            }
-          },
-          // 左下角第二行
-          {
-            text: `实时功率：${formatNumber(energyStorageNrtPower)} kW`,
-            bottom: 26,
-            left: 10,
-            textStyle:{
-              fontSize:12,
-              color:'#666666'
-            }
-          },
-          // 左下角第三行
-          {
-            text: `可用电量：${formatNumber(energyStorageAvailElec)} kWh`,
-            bottom: 10,
-            left: 10,
-            textStyle:{
-              fontSize:12,
-              color:'#666666'
-            }
-          }
-        ],
-        grid:{
-          left:200
+        color:['#FFBD00','#3C81FF'],
+        legend: {
+          left: 'center',
+          bottom: '10',
         },
         tooltip: {
           trigger: 'axis',
@@ -113,34 +64,21 @@ export default {
         },
         xAxis: {
           type: 'category',
-          axisLine: {
-            lineStyle:{
-              color: '#333333',
-            }
-          }
         },
         yAxis: {
           type: 'value',
-          axisLine: {
-            lineStyle:{
-              color: '#333333',
-            }
-          }
-        },
-        dataset:{
-          source
-          // source: [['日期','充电量','放电量']]
         },
+        dataset:{source},
         series: [
           {
-            name:'充电量',
+            name:'电网功率',
             type: 'line',
-          },{
-            name:'放电量',
-            type: 'line',
-          }]
+          }
+        ]
       })
-    }
+      this.chart.hideLoading()
+    },
+
   }
 }