负荷

ems-ui/src/views/mgr/powergrid.vue

@@ -276,27 +276,34 @@ export default {
         ],
         series: [
           {
-            name: '用电量',
+            name: '供电量',
             type: 'bar',
-            data: quantity.reverse(),
+            stack: '总数',
             barWidth: 30,
+            label: {
+              show: false,
+              position: 'insideRight'
+            },
+            data: quantity.reverse(),
             itemStyle: {
               normal: {
-                color: '#6395FA'
+                color: '#6395FA',
+
               }
             }
           },
           {
-            name: '用电电费',
+            name: '供电电费',
             type: 'line',
             yAxisIndex: 1,
             data: cost.reverse(),
-            showSymbol: true,
+            smooth: false,
             itemStyle: {
               normal: {
-                color: '#5BD9A5'
-              }
-            }
+                color: '#5BD9A5',
+
+                  }
+                }
           }
         ]
       }
@@ -618,5 +625,6 @@ export default {
     overflow: initial;
   }
 }
+
 </style>
 <style lang="scss" src="./index.scss"></style>

ems-ui/src/views/mgr/powerstore.vue

@@ -261,6 +261,7 @@ export default {
       this.$refs.tree.filter(val)
     }
   },
+
   async created() {
     this.facsCategory = 'C'
     await this.getAreaList()
@@ -298,6 +299,7 @@ export default {
         this.elecStoreHList = response.rows
         this.total = response.total
         this.loading = false
+
       })
     },
     getTodayChart() {
@@ -331,6 +333,7 @@ export default {
       this.queryParams.areaCode = data.id
       this.selectedLabel = data.label
       this.getList()
+      this.getTodayChart();
     },
     /** 搜索按钮操作 */
     tabClick() {

ems-ui/src/views/mgr/poweruse.vue

@@ -31,8 +31,11 @@
             </el-form>
           </div>
           <div class="container-block">
+            <BaseChart width="100%" height="300px" :option="barChartOptions"/>
+          </div>
+          <div class="container-block">
             <div class="ctl-container">
-              <el-select v-model="objCode" placeholder="选择设施"  @visible-change="handleObjSelectClick" @change="getList">
+              <el-select v-model="objCode" placeholder="选择设施" clearable  @visible-change="handleObjSelectClick" @change="getList">
                 <el-option v-for="item in objOptions"
                            :label="item.facsName"
                            :value="item.facsCode"
@@ -200,6 +203,42 @@ export default {
     this.getAreaTree(this.facsCategory, this.facsSubCategory)
     this.getList()
   },
+  computed: {
+    barChartOptions() {
+      const xAxisData = this.hList.map(item => item.time);
+      const seriesData = this.hList.map(item => item.elecQuantity);
+      return {
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow'
+          }
+        },
+        legend: {
+          data: ['用电量']
+        },
+        xAxis: {
+          type: 'category',
+          data: xAxisData
+        },
+        yAxis: {
+          name: 'kW·h（千瓦时）',
+          type: 'value',
+        },
+        series: [{
+          name: '用电量',
+          type: 'bar',
+          data: seriesData,
+          barWidth: 20,
+          itemStyle: {
+            normal: {
+              color: '#6395FA'
+            }
+          }
+        }]
+      };
+    }
+  },
   methods: {
     /** 查询用能计量-小时列表 */
     getList() {