王子文 电厂大屏

master/src/main/java/com/ruoyi/project/aspen/controller/TElecdashboardDayController.java

@@ -33,6 +33,18 @@ public class TElecdashboardDayController extends BaseController
     @Autowired
     private ITElecdashboardDayService tElecdashboardDayService;
 
+    /**
+     * 查询日期最靠前的30条电厂大屏每日数据
+     */
+    @PreAuthorize("@ss.hasPermi('aspen:day:list')")
+    @GetMapping("/listLatest30")
+    public TableDataInfo listLatest30()
+    {
+        startPage();
+        List<TElecdashboardDay> list = tElecdashboardDayService.selectTElecdashboardDayListLatest30();
+        return getDataTable(list);
+    }
+
     /**
      * 查询日期最靠前的7条电厂大屏每日数据
      */

master/src/main/java/com/ruoyi/project/aspen/mapper/TElecdashboardDayMapper.java

@@ -13,6 +13,13 @@ import com.ruoyi.project.aspen.domain.TElecdashboardRealtime;
  */
 public interface TElecdashboardDayMapper 
 {
+    /**
+     * 查询日期最靠前的30条电厂大屏每日数据
+     *
+     * @return 日期最靠前的30条电厂大屏每日数据
+     */
+    public List<TElecdashboardDay> selectTElecdashboardDayListLatest30();
+
     /**
      * 查询日期最靠前的7条电厂大屏每日数据
      *

master/src/main/java/com/ruoyi/project/aspen/service/ITElecdashboardDayService.java

@@ -11,6 +11,13 @@ import com.ruoyi.project.aspen.domain.TElecdashboardDay;
  */
 public interface ITElecdashboardDayService 
 {
+    /**
+     * 查询日期最靠前的30条电厂大屏每日数据
+     *
+     * @return 日期最靠前的30条电厂大屏每日数据
+     */
+    public List<TElecdashboardDay> selectTElecdashboardDayListLatest30();
+
     /**
      * 查询日期最靠前的7条电厂大屏每日数据
      *

master/src/main/java/com/ruoyi/project/aspen/service/impl/TElecdashboardDayServiceImpl.java

@@ -19,6 +19,16 @@ public class TElecdashboardDayServiceImpl implements ITElecdashboardDayService
     @Autowired
     private TElecdashboardDayMapper tElecdashboardDayMapper;
 
+    /**
+     * 查询日期最靠前的30条电厂大屏每日数据
+     *
+     * @return 日期最靠前的30条电厂大屏每日数据
+     */
+    @Override
+    public List<TElecdashboardDay> selectTElecdashboardDayListLatest30() {
+        return tElecdashboardDayMapper.selectTElecdashboardDayListLatest30();
+    }
+
     /**
      * 查询日期最靠前的7条电厂大屏每日数据
      *

ui/src/api/aspen/day.js

@@ -1,5 +1,13 @@
 import request from '@/utils/request'
 
+// 查询日期最靠前的30条电厂大屏每日数据
+export function listDayLatest30() {
+  return request({
+    url: '/aspen/day/listLatest30',
+    method: 'get'
+  })
+}
+
 // 查询日期最靠前的7条电厂大屏每日数据
 export function listDayLatest7() {
   return request({

ui/src/views/monitor/elec/bottomLeft.vue

@@ -11,7 +11,7 @@
       </div>
       <div>
         <span style="padding-left:15px;color:#74777F;fontWeight:bold;">Unit:(t/h)</span>
-        <bottomLeftChart :monthData="monthData"/>
+        <bottomLeftChart :monthData="monthData" v-bind="$attrs"/>
       </div>
     </div>
   </div>

ui/src/views/monitor/elec/centerLeft1.vue

@@ -51,6 +51,7 @@ import centreLeft1Chart from "./echart/centerLeft2/centreLeft1Chart";
 export default {
   props: {
     monthData: {},
+    latest30DayData: {},
     width: {
       type: String,
       default: '100%'
@@ -185,14 +186,17 @@ export default {
       });
     },
     initOneChart() {
+      console.log(this.latest30DayData);
       // 基于准备好的dom，初始化echarts实例
       this.chart = this.echarts.init(document.getElementById('oneGTGyChart'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].gtg1Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].gtg3PowerGenLevel;
       }
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart.setOption({
         /* 周围边距 */
         grid: {
@@ -250,10 +254,12 @@ export default {
       this.chart1 = this.echarts.init(document.getElementById('oneGTGyChart1'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].gtg1Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].gtg3PowerGenLevel;
       }
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart1.setOption({
         /* 周围边距 */
         grid: {
@@ -302,10 +308,12 @@ export default {
       this.chart = this.echarts.init(document.getElementById('twoGTGyChart'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].gtg2Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].stgPowerGenLevel;
       }
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart.setOption({
         /* 周围边距 */
         grid: {
@@ -363,10 +371,12 @@ export default {
       this.chart2 = this.echarts.init(document.getElementById('twoGTGyChart1'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].gtg2Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].stgPowerGenLevel;
       }
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart2.setOption({
         /* 周围边距 */
         grid: {
@@ -425,11 +435,12 @@ export default {
       this.chart = this.echarts.init(document.getElementById('threeGTGyChart'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].gtg3Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].gtg1PowerGenLevel;
       }
-
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart.setOption({
         /* 周围边距 */
         grid: {
@@ -487,11 +498,12 @@ export default {
       this.chart3 = this.echarts.init(document.getElementById('threeGTGyChart1'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].gtg3Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].gtg1PowerGenLevel;
       }
-
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart3.setOption({
         /* 周围边距 */
         grid: {
@@ -550,11 +562,12 @@ export default {
       this.chart = this.echarts.init(document.getElementById('fourGTGyChart'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].stg1Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].gtg2PowerGenLevel;
       }
-
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart.setOption({
         /* 周围边距 */
         grid: {
@@ -612,11 +625,12 @@ export default {
       this.chart4 = this.echarts.init(document.getElementById('fourGTGyChart1'))
       const dateDay = [];
       const dateNum = [];
-      for (let i = 0; i < this.monthData.length; i++) {
-        dateDay[i] = this.monthData[i].dateDay
-        dateNum[i] = this.monthData[i].stg1Lv
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].gtg2PowerGenLevel;
       }
-
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart4.setOption({
         /* 周围边距 */
         grid: {

ui/src/views/monitor/elec/centerRight1.vue

@@ -37,7 +37,7 @@
 
 <script>
 export default {
-  props:['fiftydayData'],
+  props:['fiftydayData','latest30DayData'],
   data() {
     return {
       openChartBYCChart: false,
@@ -71,10 +71,12 @@ export default {
       this.chart = this.echarts.init(document.getElementById('BYCChart'));
       const dateNum = [];
       const dateDay=[];
-      for (let i = 0; i < this.fiftydayData.length; i++) {
-        dateDay[i]=  this.fiftydayData[i].dataDate
-        dateNum[i] = this.fiftydayData[i].bycElec
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i]=  this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].elecBycUsed;
       }
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart.setOption({
         /* 周围边距 */
         grid: {
@@ -131,10 +133,12 @@ export default {
 
       const dateNum = [];
       const dateDay=[];
-      for (let i = 0; i < this.fiftydayData.length; i++) {
-        dateDay[i]=  this.fiftydayData[i].dataDate
-        dateNum[i] = this.fiftydayData[i].bycElec
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i]=  this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].elecBycUsed;
       }
+      dateDay.reverse();
+      dateNum.reverse();
       this.chart1.setOption({
         /* 周围边距 */
         grid: {
@@ -199,11 +203,12 @@ export default {
 
       const dateNum = [];
       const dateDay=[];
-      for (let i = 0; i < this.fiftydayData.length; i++) {
-        dateDay[i]=  this.fiftydayData[i].dataDate;
-        dateNum[i] = this.fiftydayData[i].bocElec;
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i]=  this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].elecBocUsed;
       }
-
+      dateDay.reverse();
+      dateNum.reverse();
       // 基于准备好的dom，初始化echarts实例
       this.chart = this.echarts.init(document.getElementById('BOCChart'))
 
@@ -260,10 +265,12 @@ export default {
     initBocChartDialog() {
       const dateNum = [];
       const dateDay=[];
-      for (let i = 0; i < this.fiftydayData.length; i++) {
-        dateDay[i]=  this.fiftydayData[i].dataDate;
-        dateNum[i] = this.fiftydayData[i].bocElec;
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateDay[i]=  this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        dateNum[i] = this.latest30DayData[i].elecBocUsed;
       }
+      dateDay.reverse();
+      dateNum.reverse();
       // 基于准备好的dom，初始化echarts实例
       this.chart2 = this.echarts.init(document.getElementById('BOCChart1'))
       this.chart2.setOption({

ui/src/views/monitor/elec/centerRight2.vue

@@ -32,7 +32,7 @@
 <script>
   import centreRight2Chart1 from "@/components/echart/centreRight2/centreRight2Chart1";
   export default {
-    props:['dashboardelecdata'],
+    props:['dashboardelecdata', 'latest30DayData'],
     data() {
       return {
         openChart: false,
@@ -79,11 +79,12 @@
         this.chart = this.echarts.init(document.getElementById('peakToValley'))
         const dateDay = [];
         const dateNum = [];
-        for (let i = 0; i < this.dashboarddayelecmonth.length; i++) {
-          dateDay[i] = this.dashboarddayelecmonth[i].dateDay;
-          dateNum[i] = this.dashboarddayelecmonth[i].fenggucha;
+        for (let i = 0; i < this.latest30DayData.length; i++) {
+          dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+          dateNum[i] = this.latest30DayData[i].elecDiff;
         }
-
+        dateDay.reverse();
+        dateNum.reverse();
         this.chart.setOption({
           /* 周围边距 */
           grid: {
@@ -137,11 +138,12 @@
         this.chart1 = this.echarts.init(document.getElementById('peakToValleyDialog'))
         const dateDay = [];
         const dateNum = [];
-        for (let i = 0; i < this.dashboarddayelecmonth.length; i++) {
-          dateDay[i] = this.dashboarddayelecmonth[i].dateDay;
-          dateNum[i] = this.dashboarddayelecmonth[i].fenggucha;
+        for (let i = 0; i < this.latest30DayData.length; i++) {
+          dateDay[i] = this.latest30DayData[i].pullDate.toString().substr(5, 5);
+          dateNum[i] = this.latest30DayData[i].elecDiff;
         }
-
+        dateDay.reverse();
+        dateNum.reverse();
         this.chart1.setOption({
           /* 周围边距 */
           grid: {

ui/src/views/monitor/elec/echart/analysisChart/analysisChartBottomLeft3.vue

@@ -32,6 +32,18 @@ export default {
         },
         init() {
             this.chart = this.echarts.init(document.getElementById("analysisChartBottomLeft3"), 'dark');
+            const dateArray = [];
+            const wasteArray = [];
+            const rainArray = [];
+            let data = this.dashboarddata.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              wasteArray[i] = data[i].wastePh;
+              rainArray[i] = data[i].rainPh;
+            }
+            dateArray.reverse();
+            wasteArray.reverse();
+            rainArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 title: {
@@ -60,15 +72,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.dashboarddata.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.c[0].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -90,15 +103,16 @@ export default {
                         name: 'Waste Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].wastePh,
-                          this.dashboarddata.latest7DayData[1].wastePh,
-                          this.dashboarddata.latest7DayData[2].wastePh,
-                          this.dashboarddata.latest7DayData[3].wastePh,
-                          this.dashboarddata.latest7DayData[4].wastePh,
-                          this.dashboarddata.latest7DayData[5].wastePh,
-                          this.dashboarddata.latest7DayData[6].wastePh
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].wastePh,
+                        //   this.dashboarddata.latest7DayData[1].wastePh,
+                        //   this.dashboarddata.latest7DayData[2].wastePh,
+                        //   this.dashboarddata.latest7DayData[3].wastePh,
+                        //   this.dashboarddata.latest7DayData[4].wastePh,
+                        //   this.dashboarddata.latest7DayData[5].wastePh,
+                        //   this.dashboarddata.latest7DayData[6].wastePh
+                        // ],
+                        data: wasteArray,
                         symbolSize: 10,
                         color: '#5470c6',
                         lineStyle: {
@@ -113,15 +127,16 @@ export default {
                         name: 'Rain Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].rainPh,
-                          this.dashboarddata.latest7DayData[1].rainPh,
-                          this.dashboarddata.latest7DayData[2].rainPh,
-                          this.dashboarddata.latest7DayData[3].rainPh,
-                          this.dashboarddata.latest7DayData[4].rainPh,
-                          this.dashboarddata.latest7DayData[5].rainPh,
-                          this.dashboarddata.latest7DayData[6].rainPh
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].rainPh,
+                        //   this.dashboarddata.latest7DayData[1].rainPh,
+                        //   this.dashboarddata.latest7DayData[2].rainPh,
+                        //   this.dashboarddata.latest7DayData[3].rainPh,
+                        //   this.dashboarddata.latest7DayData[4].rainPh,
+                        //   this.dashboarddata.latest7DayData[5].rainPh,
+                        //   this.dashboarddata.latest7DayData[6].rainPh
+                        // ],
+                        data: rainArray,
                         symbolSize: 10,
                         color: '#73c0de',
                         lineStyle: {
@@ -138,6 +153,18 @@ export default {
         },
         init2() {
             this.chart2 = this.echarts.init(document.getElementById("analysisChartBottomLeft33"));
+            const dateArray = [];
+            const wasteArray = [];
+            const rainArray = [];
+            let data = this.dashboarddata.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              wasteArray[i] = data[i].wastePh;
+              rainArray[i] = data[i].rainPh;
+            }
+            dateArray.reverse();
+            wasteArray.reverse();
+            rainArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 tooltip: {
@@ -160,15 +187,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.dashboarddata.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.dashboarddata.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -184,15 +212,16 @@ export default {
                         name: 'Waste Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].wastePh,
-                          this.dashboarddata.latest7DayData[1].wastePh,
-                          this.dashboarddata.latest7DayData[2].wastePh,
-                          this.dashboarddata.latest7DayData[3].wastePh,
-                          this.dashboarddata.latest7DayData[4].wastePh,
-                          this.dashboarddata.latest7DayData[5].wastePh,
-                          this.dashboarddata.latest7DayData[6].wastePh
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].wastePh,
+                        //   this.dashboarddata.latest7DayData[1].wastePh,
+                        //   this.dashboarddata.latest7DayData[2].wastePh,
+                        //   this.dashboarddata.latest7DayData[3].wastePh,
+                        //   this.dashboarddata.latest7DayData[4].wastePh,
+                        //   this.dashboarddata.latest7DayData[5].wastePh,
+                        //   this.dashboarddata.latest7DayData[6].wastePh
+                        // ],
+                        data: wasteArray,
                         symbolSize: 10,
                         color: '#5470c6',
                         lineStyle: {
@@ -207,15 +236,16 @@ export default {
                         name: 'Rain Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].rainPh,
-                          this.dashboarddata.latest7DayData[1].rainPh,
-                          this.dashboarddata.latest7DayData[2].rainPh,
-                          this.dashboarddata.latest7DayData[3].rainPh,
-                          this.dashboarddata.latest7DayData[4].rainPh,
-                          this.dashboarddata.latest7DayData[5].rainPh,
-                          this.dashboarddata.latest7DayData[6].rainPh
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].rainPh,
+                        //   this.dashboarddata.latest7DayData[1].rainPh,
+                        //   this.dashboarddata.latest7DayData[2].rainPh,
+                        //   this.dashboarddata.latest7DayData[3].rainPh,
+                        //   this.dashboarddata.latest7DayData[4].rainPh,
+                        //   this.dashboarddata.latest7DayData[5].rainPh,
+                        //   this.dashboarddata.latest7DayData[6].rainPh
+                        // ],
+                        data: rainArray,
                         symbolSize: 10,
                         color: '#73c0de',
                         lineStyle: {

ui/src/views/monitor/elec/echart/analysisChart/analysisChartBottomLeft4.vue

@@ -32,6 +32,18 @@ export default {
         },
         init() {
             this.chart = this.echarts.init(document.getElementById("analysisChartBottomLeft4"), 'dark');
+            const dateArray = [];
+            const wasteArray = [];
+            const rainArray = [];
+            let data = this.dashboarddata.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              wasteArray[i] = data[i].wasteCod;
+              rainArray[i] = data[i].rainCod;
+            }
+            dateArray.reverse();
+            wasteArray.reverse();
+            rainArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 title: {
@@ -60,15 +72,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.dashboarddata.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.dashboarddata.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -91,15 +104,16 @@ export default {
                         name: 'Waste Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].wasteCod,
-                          this.dashboarddata.latest7DayData[1].wasteCod,
-                          this.dashboarddata.latest7DayData[2].wasteCod,
-                          this.dashboarddata.latest7DayData[3].wasteCod,
-                          this.dashboarddata.latest7DayData[4].wasteCod,
-                          this.dashboarddata.latest7DayData[5].wasteCod,
-                          this.dashboarddata.latest7DayData[6].wasteCod
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].wasteCod,
+                        //   this.dashboarddata.latest7DayData[1].wasteCod,
+                        //   this.dashboarddata.latest7DayData[2].wasteCod,
+                        //   this.dashboarddata.latest7DayData[3].wasteCod,
+                        //   this.dashboarddata.latest7DayData[4].wasteCod,
+                        //   this.dashboarddata.latest7DayData[5].wasteCod,
+                        //   this.dashboarddata.latest7DayData[6].wasteCod
+                        // ],
+                        data: wasteArray,
                         symbolSize: 10,
                         color: '#5470c6',
                         lineStyle: {
@@ -114,15 +128,16 @@ export default {
                         name: 'Rain Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].rainCod,
-                          this.dashboarddata.latest7DayData[1].rainCod,
-                          this.dashboarddata.latest7DayData[2].rainCod,
-                          this.dashboarddata.latest7DayData[3].rainCod,
-                          this.dashboarddata.latest7DayData[4].rainCod,
-                          this.dashboarddata.latest7DayData[5].rainCod,
-                          this.dashboarddata.latest7DayData[6].rainCod
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].rainCod,
+                        //   this.dashboarddata.latest7DayData[1].rainCod,
+                        //   this.dashboarddata.latest7DayData[2].rainCod,
+                        //   this.dashboarddata.latest7DayData[3].rainCod,
+                        //   this.dashboarddata.latest7DayData[4].rainCod,
+                        //   this.dashboarddata.latest7DayData[5].rainCod,
+                        //   this.dashboarddata.latest7DayData[6].rainCod
+                        // ],
+                        data: rainArray,
                         symbolSize: 10,
                         color: '#73c0de',
                         lineStyle: {
@@ -139,6 +154,18 @@ export default {
         },
         init2() {
             this.chart2 = this.echarts.init(document.getElementById("analysisChartBottomLeft44"));
+            const dateArray = [];
+            const wasteArray = [];
+            const rainArray = [];
+            let data = this.dashboarddata.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              wasteArray[i] = data[i].wasteCod;
+              rainArray[i] = data[i].rainCod;
+            }
+            dateArray.reverse();
+            wasteArray.reverse();
+            rainArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 tooltip: {
@@ -161,15 +188,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.dashboarddata.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.dashboarddata.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.dashboarddata.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -186,15 +214,16 @@ export default {
                         name: 'Waste Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].wasteCod,
-                          this.dashboarddata.latest7DayData[1].wasteCod,
-                          this.dashboarddata.latest7DayData[2].wasteCod,
-                          this.dashboarddata.latest7DayData[3].wasteCod,
-                          this.dashboarddata.latest7DayData[4].wasteCod,
-                          this.dashboarddata.latest7DayData[5].wasteCod,
-                          this.dashboarddata.latest7DayData[6].wasteCod
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].wasteCod,
+                        //   this.dashboarddata.latest7DayData[1].wasteCod,
+                        //   this.dashboarddata.latest7DayData[2].wasteCod,
+                        //   this.dashboarddata.latest7DayData[3].wasteCod,
+                        //   this.dashboarddata.latest7DayData[4].wasteCod,
+                        //   this.dashboarddata.latest7DayData[5].wasteCod,
+                        //   this.dashboarddata.latest7DayData[6].wasteCod
+                        // ],
+                        data: wasteArray,
                         symbolSize: 10,
                         color: '#5470c6',
                         lineStyle: {
@@ -209,15 +238,16 @@ export default {
                         name: 'Rain Water',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.dashboarddata.latest7DayData[0].rainCod,
-                          this.dashboarddata.latest7DayData[1].rainCod,
-                          this.dashboarddata.latest7DayData[2].rainCod,
-                          this.dashboarddata.latest7DayData[3].rainCod,
-                          this.dashboarddata.latest7DayData[4].rainCod,
-                          this.dashboarddata.latest7DayData[5].rainCod,
-                          this.dashboarddata.latest7DayData[6].rainCod
-                        ],
+                        // data: [
+                        //   this.dashboarddata.latest7DayData[0].rainCod,
+                        //   this.dashboarddata.latest7DayData[1].rainCod,
+                        //   this.dashboarddata.latest7DayData[2].rainCod,
+                        //   this.dashboarddata.latest7DayData[3].rainCod,
+                        //   this.dashboarddata.latest7DayData[4].rainCod,
+                        //   this.dashboarddata.latest7DayData[5].rainCod,
+                        //   this.dashboarddata.latest7DayData[6].rainCod
+                        // ],
+                        data: rainArray,
                         symbolSize: 10,
                         color: '#73c0de',
                         lineStyle: {

ui/src/views/monitor/elec/echart/analysisChart/analysisChartTopCenter.vue

@@ -32,6 +32,21 @@ export default {
         },
         init() {
             this.chart = this.echarts.init(document.getElementById("analysisChartTopCenter"), 'dark');
+            const dateArray = [];
+            const smokeArray = [];
+            const so2Array = [];
+            const noxArray = [];
+            let data = this.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              smokeArray[i] = data[i].hrsg2SmokeConvert;
+              so2Array[i] = data[i].hrsg2So2Convert;
+              noxArray[i] = data[i].hrsg2NoxConvert;
+            }
+            dateArray.reverse();
+            smokeArray.reverse();
+            so2Array.reverse();
+            noxArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 title: {
@@ -60,15 +75,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -91,15 +107,16 @@ export default {
                         name: '烟尘',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg2SmokeConvert,
-                          this.latest7DayData[1].hrsg2SmokeConvert,
-                          this.latest7DayData[2].hrsg2SmokeConvert,
-                          this.latest7DayData[3].hrsg2SmokeConvert,
-                          this.latest7DayData[4].hrsg2SmokeConvert,
-                          this.latest7DayData[5].hrsg2SmokeConvert,
-                          this.latest7DayData[6].hrsg2SmokeConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg2SmokeConvert,
+                        //   this.latest7DayData[1].hrsg2SmokeConvert,
+                        //   this.latest7DayData[2].hrsg2SmokeConvert,
+                        //   this.latest7DayData[3].hrsg2SmokeConvert,
+                        //   this.latest7DayData[4].hrsg2SmokeConvert,
+                        //   this.latest7DayData[5].hrsg2SmokeConvert,
+                        //   this.latest7DayData[6].hrsg2SmokeConvert
+                        // ],
+                        data: smokeArray,
                         symbolSize: 10,
                         color: '#FF9800',
                         lineStyle: {
@@ -114,15 +131,16 @@ export default {
                         name: 'SO2',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg2So2Convert,
-                          this.latest7DayData[1].hrsg2So2Convert,
-                          this.latest7DayData[2].hrsg2So2Convert,
-                          this.latest7DayData[3].hrsg2So2Convert,
-                          this.latest7DayData[4].hrsg2So2Convert,
-                          this.latest7DayData[5].hrsg2So2Convert,
-                          this.latest7DayData[6].hrsg2So2Convert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg2So2Convert,
+                        //   this.latest7DayData[1].hrsg2So2Convert,
+                        //   this.latest7DayData[2].hrsg2So2Convert,
+                        //   this.latest7DayData[3].hrsg2So2Convert,
+                        //   this.latest7DayData[4].hrsg2So2Convert,
+                        //   this.latest7DayData[5].hrsg2So2Convert,
+                        //   this.latest7DayData[6].hrsg2So2Convert
+                        // ],
+                        data: so2Array,
                         symbolSize: 10,
                         color: '#9D00FF',
                         lineStyle: {
@@ -137,15 +155,16 @@ export default {
                         name: 'NOx',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg2NoxConvert,
-                          this.latest7DayData[1].hrsg2NoxConvert,
-                          this.latest7DayData[2].hrsg2NoxConvert,
-                          this.latest7DayData[3].hrsg2NoxConvert,
-                          this.latest7DayData[4].hrsg2NoxConvert,
-                          this.latest7DayData[5].hrsg2NoxConvert,
-                          this.latest7DayData[6].hrsg2NoxConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg2NoxConvert,
+                        //   this.latest7DayData[1].hrsg2NoxConvert,
+                        //   this.latest7DayData[2].hrsg2NoxConvert,
+                        //   this.latest7DayData[3].hrsg2NoxConvert,
+                        //   this.latest7DayData[4].hrsg2NoxConvert,
+                        //   this.latest7DayData[5].hrsg2NoxConvert,
+                        //   this.latest7DayData[6].hrsg2NoxConvert
+                        // ],
+                        data: noxArray,
                         symbolSize: 10,
                         color: '#00FF0D',
                         lineStyle: {
@@ -162,6 +181,21 @@ export default {
         },
         init2() {
             this.chart2 = this.echarts.init(document.getElementById("analysisChartTopCenter2"));
+            const dateArray = [];
+            const smokeArray = [];
+            const so2Array = [];
+            const noxArray = [];
+            let data = this.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              smokeArray[i] = data[i].hrsg2SmokeConvert;
+              so2Array[i] = data[i].hrsg2So2Convert;
+              noxArray[i] = data[i].hrsg2NoxConvert;
+            }
+            dateArray.reverse();
+            smokeArray.reverse();
+            so2Array.reverse();
+            noxArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 tooltip: {
@@ -184,15 +218,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -209,15 +244,16 @@ export default {
                         name: '烟尘',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg2SmokeConvert,
-                          this.latest7DayData[1].hrsg2SmokeConvert,
-                          this.latest7DayData[2].hrsg2SmokeConvert,
-                          this.latest7DayData[3].hrsg2SmokeConvert,
-                          this.latest7DayData[4].hrsg2SmokeConvert,
-                          this.latest7DayData[5].hrsg2SmokeConvert,
-                          this.latest7DayData[6].hrsg2SmokeConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg2SmokeConvert,
+                        //   this.latest7DayData[1].hrsg2SmokeConvert,
+                        //   this.latest7DayData[2].hrsg2SmokeConvert,
+                        //   this.latest7DayData[3].hrsg2SmokeConvert,
+                        //   this.latest7DayData[4].hrsg2SmokeConvert,
+                        //   this.latest7DayData[5].hrsg2SmokeConvert,
+                        //   this.latest7DayData[6].hrsg2SmokeConvert
+                        // ],
+                        data: smokeArray,
                         symbolSize: 10,
                         color: '#FF9800',
                         lineStyle: {
@@ -232,15 +268,16 @@ export default {
                         name: 'SO2',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg2So2Convert,
-                          this.latest7DayData[1].hrsg2So2Convert,
-                          this.latest7DayData[2].hrsg2So2Convert,
-                          this.latest7DayData[3].hrsg2So2Convert,
-                          this.latest7DayData[4].hrsg2So2Convert,
-                          this.latest7DayData[5].hrsg2So2Convert,
-                          this.latest7DayData[6].hrsg2So2Convert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg2So2Convert,
+                        //   this.latest7DayData[1].hrsg2So2Convert,
+                        //   this.latest7DayData[2].hrsg2So2Convert,
+                        //   this.latest7DayData[3].hrsg2So2Convert,
+                        //   this.latest7DayData[4].hrsg2So2Convert,
+                        //   this.latest7DayData[5].hrsg2So2Convert,
+                        //   this.latest7DayData[6].hrsg2So2Convert
+                        // ],
+                        data: so2Array,
                         symbolSize: 10,
                         color: '#9D00FF',
                         lineStyle: {
@@ -255,15 +292,16 @@ export default {
                         name: 'NOx',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg2NoxConvert,
-                          this.latest7DayData[1].hrsg2NoxConvert,
-                          this.latest7DayData[2].hrsg2NoxConvert,
-                          this.latest7DayData[3].hrsg2NoxConvert,
-                          this.latest7DayData[4].hrsg2NoxConvert,
-                          this.latest7DayData[5].hrsg2NoxConvert,
-                          this.latest7DayData[6].hrsg2NoxConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg2NoxConvert,
+                        //   this.latest7DayData[1].hrsg2NoxConvert,
+                        //   this.latest7DayData[2].hrsg2NoxConvert,
+                        //   this.latest7DayData[3].hrsg2NoxConvert,
+                        //   this.latest7DayData[4].hrsg2NoxConvert,
+                        //   this.latest7DayData[5].hrsg2NoxConvert,
+                        //   this.latest7DayData[6].hrsg2NoxConvert
+                        // ],
+                        data: noxArray,
                         symbolSize: 10,
                         color: '#00FF0D',
                         lineStyle: {

ui/src/views/monitor/elec/echart/analysisChart/analysisChartTopLeft.vue

@@ -32,6 +32,21 @@ export default {
         },
         init() {
             this.chart = this.echarts.init(document.getElementById("analysisChartTopLeft"), 'dark');
+            const dateArray = [];
+            const smokeArray = [];
+            const so2Array = [];
+            const noxArray = [];
+            let data = this.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              smokeArray[i] = data[i].hrsg1SmokeConvert;
+              so2Array[i] = data[i].hrsg1So2Convert;
+              noxArray[i] = data[i].hrsg1NoxConvert;
+            }
+            dateArray.reverse();
+            smokeArray.reverse();
+            so2Array.reverse();
+            noxArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 title: {
@@ -60,15 +75,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -91,15 +107,16 @@ export default {
                         name: '烟尘',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg1SmokeConvert,
-                          this.latest7DayData[1].hrsg1SmokeConvert,
-                          this.latest7DayData[2].hrsg1SmokeConvert,
-                          this.latest7DayData[3].hrsg1SmokeConvert,
-                          this.latest7DayData[4].hrsg1SmokeConvert,
-                          this.latest7DayData[5].hrsg1SmokeConvert,
-                          this.latest7DayData[6].hrsg1SmokeConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg1SmokeConvert,
+                        //   this.latest7DayData[1].hrsg1SmokeConvert,
+                        //   this.latest7DayData[2].hrsg1SmokeConvert,
+                        //   this.latest7DayData[3].hrsg1SmokeConvert,
+                        //   this.latest7DayData[4].hrsg1SmokeConvert,
+                        //   this.latest7DayData[5].hrsg1SmokeConvert,
+                        //   this.latest7DayData[6].hrsg1SmokeConvert
+                        // ],
+                        data: smokeArray,
                         symbolSize: 10,
                         color: '#FF9800',
                         lineStyle: {
@@ -114,15 +131,16 @@ export default {
                         name: 'SO2',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg1So2Convert,
-                          this.latest7DayData[1].hrsg1So2Convert,
-                          this.latest7DayData[2].hrsg1So2Convert,
-                          this.latest7DayData[3].hrsg1So2Convert,
-                          this.latest7DayData[4].hrsg1So2Convert,
-                          this.latest7DayData[5].hrsg1So2Convert,
-                          this.latest7DayData[6].hrsg1So2Convert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg1So2Convert,
+                        //   this.latest7DayData[1].hrsg1So2Convert,
+                        //   this.latest7DayData[2].hrsg1So2Convert,
+                        //   this.latest7DayData[3].hrsg1So2Convert,
+                        //   this.latest7DayData[4].hrsg1So2Convert,
+                        //   this.latest7DayData[5].hrsg1So2Convert,
+                        //   this.latest7DayData[6].hrsg1So2Convert
+                        // ],
+                        data: so2Array,
                         symbolSize: 10,
                         color: '#9D00FF',
                         lineStyle: {
@@ -137,15 +155,16 @@ export default {
                         name: 'NOx',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg1NoxConvert,
-                          this.latest7DayData[1].hrsg1NoxConvert,
-                          this.latest7DayData[2].hrsg1NoxConvert,
-                          this.latest7DayData[3].hrsg1NoxConvert,
-                          this.latest7DayData[4].hrsg1NoxConvert,
-                          this.latest7DayData[5].hrsg1NoxConvert,
-                          this.latest7DayData[6].hrsg1NoxConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg1NoxConvert,
+                        //   this.latest7DayData[1].hrsg1NoxConvert,
+                        //   this.latest7DayData[2].hrsg1NoxConvert,
+                        //   this.latest7DayData[3].hrsg1NoxConvert,
+                        //   this.latest7DayData[4].hrsg1NoxConvert,
+                        //   this.latest7DayData[5].hrsg1NoxConvert,
+                        //   this.latest7DayData[6].hrsg1NoxConvert
+                        // ],
+                        data: noxArray,
                         symbolSize: 10,
                         color: '#00FF0D',
                         lineStyle: {
@@ -162,6 +181,21 @@ export default {
         },
         init2() {
             this.chart2 = this.echarts.init(document.getElementById("analysisChartTopLeft2"));
+            const dateArray = [];
+            const smokeArray = [];
+            const so2Array = [];
+            const noxArray = [];
+            let data = this.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              smokeArray[i] = data[i].hrsg1SmokeConvert;
+              so2Array[i] = data[i].hrsg1So2Convert;
+              noxArray[i] = data[i].hrsg1NoxConvert;
+            }
+            dateArray.reverse();
+            smokeArray.reverse();
+            so2Array.reverse();
+            noxArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 tooltip: {
@@ -184,15 +218,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -209,15 +244,16 @@ export default {
                         name: '烟尘',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg1SmokeConvert,
-                          this.latest7DayData[1].hrsg1SmokeConvert,
-                          this.latest7DayData[2].hrsg1SmokeConvert,
-                          this.latest7DayData[3].hrsg1SmokeConvert,
-                          this.latest7DayData[4].hrsg1SmokeConvert,
-                          this.latest7DayData[5].hrsg1SmokeConvert,
-                          this.latest7DayData[6].hrsg1SmokeConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg1SmokeConvert,
+                        //   this.latest7DayData[1].hrsg1SmokeConvert,
+                        //   this.latest7DayData[2].hrsg1SmokeConvert,
+                        //   this.latest7DayData[3].hrsg1SmokeConvert,
+                        //   this.latest7DayData[4].hrsg1SmokeConvert,
+                        //   this.latest7DayData[5].hrsg1SmokeConvert,
+                        //   this.latest7DayData[6].hrsg1SmokeConvert
+                        // ],
+                        data: smokeArray,
                         symbolSize: 10,
                         color: '#FF9800',
                         lineStyle: {
@@ -232,15 +268,16 @@ export default {
                         name: 'SO2',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg1So2Convert,
-                          this.latest7DayData[1].hrsg1So2Convert,
-                          this.latest7DayData[2].hrsg1So2Convert,
-                          this.latest7DayData[3].hrsg1So2Convert,
-                          this.latest7DayData[4].hrsg1So2Convert,
-                          this.latest7DayData[5].hrsg1So2Convert,
-                          this.latest7DayData[6].hrsg1So2Convert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg1So2Convert,
+                        //   this.latest7DayData[1].hrsg1So2Convert,
+                        //   this.latest7DayData[2].hrsg1So2Convert,
+                        //   this.latest7DayData[3].hrsg1So2Convert,
+                        //   this.latest7DayData[4].hrsg1So2Convert,
+                        //   this.latest7DayData[5].hrsg1So2Convert,
+                        //   this.latest7DayData[6].hrsg1So2Convert
+                        // ],
+                        data: so2Array,
                         symbolSize: 10,
                         color: '#9D00FF',
                         lineStyle: {
@@ -255,15 +292,16 @@ export default {
                         name: 'NOx',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg1NoxConvert,
-                          this.latest7DayData[1].hrsg1NoxConvert,
-                          this.latest7DayData[2].hrsg1NoxConvert,
-                          this.latest7DayData[3].hrsg1NoxConvert,
-                          this.latest7DayData[4].hrsg1NoxConvert,
-                          this.latest7DayData[5].hrsg1NoxConvert,
-                          this.latest7DayData[6].hrsg1NoxConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg1NoxConvert,
+                        //   this.latest7DayData[1].hrsg1NoxConvert,
+                        //   this.latest7DayData[2].hrsg1NoxConvert,
+                        //   this.latest7DayData[3].hrsg1NoxConvert,
+                        //   this.latest7DayData[4].hrsg1NoxConvert,
+                        //   this.latest7DayData[5].hrsg1NoxConvert,
+                        //   this.latest7DayData[6].hrsg1NoxConvert
+                        // ],
+                        data: noxArray,
                         symbolSize: 10,
                         color: '#00FF0D',
                         lineStyle: {

ui/src/views/monitor/elec/echart/analysisChart/analysisChartTopRight.vue

@@ -32,6 +32,21 @@ export default {
         },
         init() {
             this.chart = this.echarts.init(document.getElementById("analysisChartTopRight"), 'dark');
+            const dateArray = [];
+            const smokeArray = [];
+            const so2Array = [];
+            const noxArray = [];
+            let data = this.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              smokeArray[i] = data[i].hrsg3SmokeConvert;
+              so2Array[i] = data[i].hrsg3So2Convert;
+              noxArray[i] = data[i].hrsg3NoxConvert;
+            }
+            dateArray.reverse();
+            smokeArray.reverse();
+            so2Array.reverse();
+            noxArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 title: {
@@ -60,15 +75,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -91,15 +107,16 @@ export default {
                         name: '烟尘',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg3SmokeConvert,
-                          this.latest7DayData[1].hrsg3SmokeConvert,
-                          this.latest7DayData[2].hrsg3SmokeConvert,
-                          this.latest7DayData[3].hrsg3SmokeConvert,
-                          this.latest7DayData[4].hrsg3SmokeConvert,
-                          this.latest7DayData[5].hrsg3SmokeConvert,
-                          this.latest7DayData[6].hrsg3SmokeConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg3SmokeConvert,
+                        //   this.latest7DayData[1].hrsg3SmokeConvert,
+                        //   this.latest7DayData[2].hrsg3SmokeConvert,
+                        //   this.latest7DayData[3].hrsg3SmokeConvert,
+                        //   this.latest7DayData[4].hrsg3SmokeConvert,
+                        //   this.latest7DayData[5].hrsg3SmokeConvert,
+                        //   this.latest7DayData[6].hrsg3SmokeConvert
+                        // ],
+                        data: smokeArray,
                         symbolSize: 10,
                         color: '#FF9800',
                         lineStyle: {
@@ -114,15 +131,16 @@ export default {
                         name: 'SO2',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg3So2Convert,
-                          this.latest7DayData[1].hrsg3So2Convert,
-                          this.latest7DayData[2].hrsg3So2Convert,
-                          this.latest7DayData[3].hrsg3So2Convert,
-                          this.latest7DayData[4].hrsg3So2Convert,
-                          this.latest7DayData[5].hrsg3So2Convert,
-                          this.latest7DayData[6].hrsg3So2Convert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg3So2Convert,
+                        //   this.latest7DayData[1].hrsg3So2Convert,
+                        //   this.latest7DayData[2].hrsg3So2Convert,
+                        //   this.latest7DayData[3].hrsg3So2Convert,
+                        //   this.latest7DayData[4].hrsg3So2Convert,
+                        //   this.latest7DayData[5].hrsg3So2Convert,
+                        //   this.latest7DayData[6].hrsg3So2Convert
+                        // ],
+                        data: so2Array,
                         symbolSize: 10,
                         color: '#9D00FF',
                         lineStyle: {
@@ -137,15 +155,16 @@ export default {
                         name: 'NOx',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg3NoxConvert,
-                          this.latest7DayData[1].hrsg3NoxConvert,
-                          this.latest7DayData[2].hrsg3NoxConvert,
-                          this.latest7DayData[3].hrsg3NoxConvert,
-                          this.latest7DayData[4].hrsg3NoxConvert,
-                          this.latest7DayData[5].hrsg3NoxConvert,
-                          this.latest7DayData[6].hrsg3NoxConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg3NoxConvert,
+                        //   this.latest7DayData[1].hrsg3NoxConvert,
+                        //   this.latest7DayData[2].hrsg3NoxConvert,
+                        //   this.latest7DayData[3].hrsg3NoxConvert,
+                        //   this.latest7DayData[4].hrsg3NoxConvert,
+                        //   this.latest7DayData[5].hrsg3NoxConvert,
+                        //   this.latest7DayData[6].hrsg3NoxConvert
+                        // ],
+                        data: noxArray,
                         symbolSize: 10,
                         color: '#00FF0D',
                         lineStyle: {
@@ -162,6 +181,21 @@ export default {
         },
         init2() {
             this.chart2 = this.echarts.init(document.getElementById("analysisChartTopRight2"));
+            const dateArray = [];
+            const smokeArray = [];
+            const so2Array = [];
+            const noxArray = [];
+            let data = this.latest7DayData;
+            for (let i = 0; i < data.length; i++) {
+              dateArray[i]=  data[i].pullDate.toString().substr(5, 5);
+              smokeArray[i] = data[i].hrsg3SmokeConvert;
+              so2Array[i] = data[i].hrsg3So2Convert;
+              noxArray[i] = data[i].hrsg3NoxConvert;
+            }
+            dateArray.reverse();
+            smokeArray.reverse();
+            so2Array.reverse();
+            noxArray.reverse();
             let option = {
                 backgroundColor: 'transparent',
                 tooltip: {
@@ -184,15 +218,16 @@ export default {
                 xAxis: {
                     type: 'category',
                     boundaryGap: false,
-                    data: [
-                      this.latest7DayData[0].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[1].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[2].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[3].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[4].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[5].pullDate.toString().substr(5, 5),
-                      this.latest7DayData[6].pullDate.toString().substr(5, 5)
-                    ],
+                    // data: [
+                    //   this.latest7DayData[0].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[1].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[2].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[3].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[4].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[5].pullDate.toString().substr(5, 5),
+                    //   this.latest7DayData[6].pullDate.toString().substr(5, 5)
+                    // ],
+                    data: dateArray,
                     axisLabel: {
                         color: '#808080'
                     },
@@ -209,15 +244,16 @@ export default {
                         name: '烟尘',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg3SmokeConvert,
-                          this.latest7DayData[1].hrsg3SmokeConvert,
-                          this.latest7DayData[2].hrsg3SmokeConvert,
-                          this.latest7DayData[3].hrsg3SmokeConvert,
-                          this.latest7DayData[4].hrsg3SmokeConvert,
-                          this.latest7DayData[5].hrsg3SmokeConvert,
-                          this.latest7DayData[6].hrsg3SmokeConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg3SmokeConvert,
+                        //   this.latest7DayData[1].hrsg3SmokeConvert,
+                        //   this.latest7DayData[2].hrsg3SmokeConvert,
+                        //   this.latest7DayData[3].hrsg3SmokeConvert,
+                        //   this.latest7DayData[4].hrsg3SmokeConvert,
+                        //   this.latest7DayData[5].hrsg3SmokeConvert,
+                        //   this.latest7DayData[6].hrsg3SmokeConvert
+                        // ],
+                        data: smokeArray,
                         symbolSize: 10,
                         color: '#FF9800',
                         lineStyle: {
@@ -232,15 +268,16 @@ export default {
                         name: 'SO2',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg3So2Convert,
-                          this.latest7DayData[1].hrsg3So2Convert,
-                          this.latest7DayData[2].hrsg3So2Convert,
-                          this.latest7DayData[3].hrsg3So2Convert,
-                          this.latest7DayData[4].hrsg3So2Convert,
-                          this.latest7DayData[5].hrsg3So2Convert,
-                          this.latest7DayData[6].hrsg3So2Convert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg3So2Convert,
+                        //   this.latest7DayData[1].hrsg3So2Convert,
+                        //   this.latest7DayData[2].hrsg3So2Convert,
+                        //   this.latest7DayData[3].hrsg3So2Convert,
+                        //   this.latest7DayData[4].hrsg3So2Convert,
+                        //   this.latest7DayData[5].hrsg3So2Convert,
+                        //   this.latest7DayData[6].hrsg3So2Convert
+                        // ],
+                        data: so2Array,
                         symbolSize: 10,
                         color: '#9D00FF',
                         lineStyle: {
@@ -255,15 +292,16 @@ export default {
                         name: 'NOx',
                         type: 'line',
                         smooth: true,
-                        data: [
-                          this.latest7DayData[0].hrsg3NoxConvert,
-                          this.latest7DayData[1].hrsg3NoxConvert,
-                          this.latest7DayData[2].hrsg3NoxConvert,
-                          this.latest7DayData[3].hrsg3NoxConvert,
-                          this.latest7DayData[4].hrsg3NoxConvert,
-                          this.latest7DayData[5].hrsg3NoxConvert,
-                          this.latest7DayData[6].hrsg3NoxConvert
-                        ],
+                        // data: [
+                        //   this.latest7DayData[0].hrsg3NoxConvert,
+                        //   this.latest7DayData[1].hrsg3NoxConvert,
+                        //   this.latest7DayData[2].hrsg3NoxConvert,
+                        //   this.latest7DayData[3].hrsg3NoxConvert,
+                        //   this.latest7DayData[4].hrsg3NoxConvert,
+                        //   this.latest7DayData[5].hrsg3NoxConvert,
+                        //   this.latest7DayData[6].hrsg3NoxConvert
+                        // ],
+                        data: noxArray,
                         symbolSize: 10,
                         color: '#00FF0D',
                         lineStyle: {

ui/src/views/monitor/elec/echart/bottom/bottomLeftChart.vue

@@ -11,7 +11,7 @@
 <script>
 import echartMixins from "@/utils/resizeMixins";
 export default {
-  props:['monthData'],
+  props:['monthData', 'latest30DayData'],
   data() {
     return {
       chart: null,
@@ -40,87 +40,96 @@ export default {
       let HPData=[];
       let LPData=[];
       let MPData=[];
-      for(let i=0;i<this.monthData.length;i++){
-        category[i]=this.monthData[i].dataDate;
-        HHPData[i]=this.monthData[i].hhp;
-        HPData[i]=this.monthData[i].hp;
-        LPData[i]=this.monthData[i].lp;
-        MPData[i]=this.monthData[i].mp;
+      for(let i=0;i<this.latest30DayData.length;i++){
+        category[i]=this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        HHPData[i]=this.latest30DayData[i].steamHhp;
+        HPData[i]=this.latest30DayData[i].steamHp;
+        LPData[i]=this.latest30DayData[i].steamLp;
+        MPData[i]=this.latest30DayData[i].steamMp;
       }
-      let lineData = [
-        18092,
-        20728,
-        24045,
-        28348,
-        32808,
-        36097,
-        39867,
-        44715,
-        48444,
-        50415,
-        56061,
-        62677,
-        59521,
-        67560,
-        18092,
-        20728,
-        24045,
-        28348,
-        32808,
-        36097,
-        39867,
-        44715,
-        48444,
-        50415,
-        36097,
-        39867,
-        44715,
-        48444,
-        50415,
-        50061,
-        32677,
-        49521,
-        32808
-      ];
-      let barData = [
-        4600,
-        5000,
-        5500,
-        6500,
-        7500,
-        8500,
-        9900,
-        12500,
-        14000,
-        21500,
-        23200,
-        24450,
-        25250,
-        33300,
-        4600,
-        5000,
-        5500,
-        6500,
-        7500,
-        8500,
-        9900,
-        22500,
-        14000,
-        21500,
-        8500,
-        9900,
-        12500,
-        14000,
-        21500,
-        23200,
-        24450,
-        25250,
-        7500
-      ];
+      // let lineData = [
+      //   18092,
+      //   20728,
+      //   24045,
+      //   28348,
+      //   32808,
+      //   36097,
+      //   39867,
+      //   44715,
+      //   48444,
+      //   50415,
+      //   56061,
+      //   62677,
+      //   59521,
+      //   67560,
+      //   18092,
+      //   20728,
+      //   24045,
+      //   28348,
+      //   32808,
+      //   36097,
+      //   39867,
+      //   44715,
+      //   48444,
+      //   50415,
+      //   36097,
+      //   39867,
+      //   44715,
+      //   48444,
+      //   50415,
+      //   50061,
+      //   32677,
+      //   49521,
+      //   32808
+      // ];
+      // let barData = [
+      //   4600,
+      //   5000,
+      //   5500,
+      //   6500,
+      //   7500,
+      //   8500,
+      //   9900,
+      //   12500,
+      //   14000,
+      //   21500,
+      //   23200,
+      //   24450,
+      //   25250,
+      //   33300,
+      //   4600,
+      //   5000,
+      //   5500,
+      //   6500,
+      //   7500,
+      //   8500,
+      //   9900,
+      //   22500,
+      //   14000,
+      //   21500,
+      //   8500,
+      //   9900,
+      //   12500,
+      //   14000,
+      //   21500,
+      //   23200,
+      //   24450,
+      //   25250,
+      //   7500
+      // ];
+      // let rateData = [];
+      // for (let i = 0; i < 33; i++) {
+      //   let rate = barData[i] / lineData[i];
+      //   rateData[i] = rate.toFixed(2);
+      // }
       let rateData = [];
-      for (let i = 0; i < 33; i++) {
-        let rate = barData[i] / lineData[i];
-        rateData[i] = rate.toFixed(2);
+      for (let i = 0; i < category.length; i++) {
+        rateData.push(
+          Number(HHPData[i]) +
+          Number(HPData[i]) +
+          Number(LPData[i]) +
+          Number(MPData[i])
+        );
       }
 
       let option = {
@@ -202,7 +211,7 @@ export default {
             showAllSymbol: true,
             symbol: "emptyCircle",
             symbolSize: 8,
-            yAxisIndex: 1,
+            // yAxisIndex: 1,
             itemStyle: {
               normal: {
                 color: "#F02FC2"
@@ -214,6 +223,7 @@ export default {
           {
             name: 'HHP',
             type: "bar",
+            stack: 'Ad',
             barWidth: 10,
             itemStyle: {
               normal: {
@@ -307,87 +317,96 @@ export default {
       let HPData=[];
       let LPData=[];
       let MPData=[];
-      for(let i=0;i<this.monthData.length;i++){
-        category[i]=this.monthData[i].dataDate;
-        HHPData[i]=this.monthData[i].hhp;
-        HPData[i]=this.monthData[i].hp;
-        LPData[i]=this.monthData[i].lp;
-        MPData[i]=this.monthData[i].mp;
+      for(let i=0;i<this.latest30DayData.length;i++){
+        category[i]=this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        HHPData[i]=this.latest30DayData[i].steamHhp;
+        HPData[i]=this.latest30DayData[i].steamHp;
+        LPData[i]=this.latest30DayData[i].steamLp;
+        MPData[i]=this.latest30DayData[i].steamMp;
       }
-      let lineData = [
-        18092,
-        20728,
-        24045,
-        28348,
-        32808,
-        36097,
-        39867,
-        44715,
-        48444,
-        50415,
-        56061,
-        62677,
-        59521,
-        67560,
-        18092,
-        20728,
-        24045,
-        28348,
-        32808,
-        36097,
-        39867,
-        44715,
-        48444,
-        50415,
-        36097,
-        39867,
-        44715,
-        48444,
-        50415,
-        50061,
-        32677,
-        49521,
-        32808
-      ];
-      let barData = [
-        4600,
-        5000,
-        5500,
-        6500,
-        7500,
-        8500,
-        9900,
-        12500,
-        14000,
-        21500,
-        23200,
-        24450,
-        25250,
-        33300,
-        4600,
-        5000,
-        5500,
-        6500,
-        7500,
-        8500,
-        9900,
-        22500,
-        14000,
-        21500,
-        8500,
-        9900,
-        12500,
-        14000,
-        21500,
-        23200,
-        24450,
-        25250,
-        7500
-      ];
+      // let lineData = [
+      //   18092,
+      //   20728,
+      //   24045,
+      //   28348,
+      //   32808,
+      //   36097,
+      //   39867,
+      //   44715,
+      //   48444,
+      //   50415,
+      //   56061,
+      //   62677,
+      //   59521,
+      //   67560,
+      //   18092,
+      //   20728,
+      //   24045,
+      //   28348,
+      //   32808,
+      //   36097,
+      //   39867,
+      //   44715,
+      //   48444,
+      //   50415,
+      //   36097,
+      //   39867,
+      //   44715,
+      //   48444,
+      //   50415,
+      //   50061,
+      //   32677,
+      //   49521,
+      //   32808
+      // ];
+      // let barData = [
+      //   4600,
+      //   5000,
+      //   5500,
+      //   6500,
+      //   7500,
+      //   8500,
+      //   9900,
+      //   12500,
+      //   14000,
+      //   21500,
+      //   23200,
+      //   24450,
+      //   25250,
+      //   33300,
+      //   4600,
+      //   5000,
+      //   5500,
+      //   6500,
+      //   7500,
+      //   8500,
+      //   9900,
+      //   22500,
+      //   14000,
+      //   21500,
+      //   8500,
+      //   9900,
+      //   12500,
+      //   14000,
+      //   21500,
+      //   23200,
+      //   24450,
+      //   25250,
+      //   7500
+      // ];
+      // let rateData = [];
+      // for (let i = 0; i < 33; i++) {
+      //   let rate = barData[i] / lineData[i];
+      //   rateData[i] = rate.toFixed(2);
+      // }
       let rateData = [];
-      for (let i = 0; i < 33; i++) {
-        let rate = barData[i] / lineData[i];
-        rateData[i] = rate.toFixed(2);
+      for (let i = 0; i < category.length; i++) {
+        rateData.push(
+          Number(HHPData[i]) +
+          Number(HPData[i]) +
+          Number(LPData[i]) +
+          Number(MPData[i])
+        );
       }
 
       let option = {
@@ -462,6 +481,7 @@ export default {
           {
             name: 'HHP',
             type: "bar",
+            stack: 'Ad',
             barWidth: 10,
             itemStyle: {
               normal: {

ui/src/views/monitor/elec/echart/bottom/bottomRightChart1.vue

@@ -11,6 +11,7 @@
 <script>
 import echartMixins from "@/utils/resizeMixins";
 export default {
+  props:['latest30DayData'],
   data() {
     return {
       chart:null,
@@ -33,6 +34,17 @@ export default {
     draw() {
       // 基于准备好的dom，初始化echarts实例
       this.chart = this.echarts.init(document.getElementById('bottomRightChart1'))
+      const dateArray = [];
+      const planArray=[];
+      const actualArray=[];
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateArray[i]=  this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        planArray[i] = this.latest30DayData[i].gasPlan;
+        actualArray[i] = this.latest30DayData[i].gasUsed;
+      }
+      dateArray.reverse();
+      planArray.reverse();
+      actualArray.reverse();
       let Option={
         color: ['#00DDFF', '#37A2FF'],
         tooltip: {
@@ -58,7 +70,7 @@ export default {
           {
             type: 'category',
             boundaryGap: false,
-            data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'],
+            data: dateArray,
             axisLabel: {//x轴文字的配置
               show: true,
               textStyle: {
@@ -91,13 +103,13 @@ export default {
             name: this.$t('实际'),
             type: 'bar',
             symbol: "none",
-            data: [9,20, 32, 42, 57, 63, 77, 89, 90, 102, 114, 124, 135, 145, 151, 169, 179, 189, 192, 201, 210, 219, 224, 235, 247, 258, 260, 270, 289,299,304]
+            data: actualArray
           },
           {
             name: this.$t('计划'),
             type: 'bar',
             symbol: "none",
-            data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200, 210, 220, 230, 240, 250, 260, 270, 280,290,300]
+            data: planArray
           },
         ]
       };
@@ -106,6 +118,17 @@ export default {
     drawDialog() {
       // 基于准备好的dom，初始化echarts实例
       this.chart1 = this.echarts.init(document.getElementById('bottomRightChart1Dialog'))
+      const dateArray = [];
+      const planArray=[];
+      const actualArray=[];
+      for (let i = 0; i < this.latest30DayData.length; i++) {
+        dateArray[i]=  this.latest30DayData[i].pullDate.toString().substr(5, 5);
+        planArray[i] = this.latest30DayData[i].gasPlan;
+        actualArray[i] = this.latest30DayData[i].gasUsed;
+      }
+      dateArray.reverse();
+      planArray.reverse();
+      actualArray.reverse();
       let Option={
         color: ['#00DDFF', '#37A2FF'],
         tooltip: {
@@ -128,7 +151,7 @@ export default {
           {
             type: 'category',
             boundaryGap: false,
-            data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'],
+            data: dateArray,
             axisLabel: {//x轴文字的配置
               show: true,
             },
@@ -151,13 +174,13 @@ export default {
             name: this.$t('实际'),
             type: 'bar',
             symbol: "none",
-            data: [9,20, 32, 42, 57, 63, 77, 89, 90, 102, 114, 124, 135, 145, 151, 169, 179, 189, 192, 201, 210, 219, 224, 235, 247, 258, 260, 270, 289,299,304]
+            data: actualArray,
           },
           {
             name: this.$t('计划'),
             type: 'bar',
             symbol: "none",
-            data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200, 210, 220, 230, 240, 250, 260, 270, 280,290,300]
+            data: planArray,
           },
         ]
       };

ui/src/views/monitor/elec/elecindex.vue

@@ -65,7 +65,7 @@
         <div class="content-box">
           <div>
             <dv-border-box-12>
-              <centerLeft1 :monthData="monthData"/>
+              <centerLeft1 :monthData="monthData" :latest30DayData="latest30DayData"/>
             </dv-border-box-12>
           </div>
           <!-- 中间 -->
@@ -74,11 +74,11 @@
           </div>
           <!-- 中间 -->
           <div>
-            <centerRight2 :dashboardelecdata="[dashboardelecdata,monthData]"/>
+            <centerRight2 :dashboardelecdata="[dashboardelecdata,monthData]" :latest30DayData="latest30DayData"/>
           </div>
           <div>
             <dv-border-box-13>
-              <centerRight1 :fiftydayData="fiftydayData"/>
+              <centerRight1 :fiftydayData="fiftydayData" :latest30DayData="latest30DayData"/>
             </dv-border-box-13>
           </div>
         </div>
@@ -86,7 +86,7 @@
         <!-- 第四行数据 -->
         <div class="bototm-box">
           <dv-border-box-13>
-            <bottomLeft :monthData="monthData"/>
+            <bottomLeft :monthData="monthData" :latest30DayData="latest30DayData"/>
           </dv-border-box-13>
           <div class="bototm-box1">
             <dv-border-box-12>
@@ -104,7 +104,7 @@
                     </div>
                   </div>
                   <div>
-                      <bottom-right1 />
+                      <bottom-right1 :latest30DayData="latest30DayData"/>
                   </div>
                 </div>
               </dv-border-box-12>
@@ -165,7 +165,7 @@ import dayjs from "dayjs";
 import {selectLast,selectMonth,selecctfiftyday} from "@/api/aspen/dashboarddayelec";
 import {selectWeek} from "@/api/aspen/dashboarddayeleceight";
 import {getRealtimeByMaxDate} from "@/api/aspen/realtime.js";
-import {listDayLatest7} from "@/api/aspen/day.js";
+import {listDayLatest7, listDayLatest30} from "@/api/aspen/day.js";
 export default {
   data() {
     return {
@@ -184,6 +184,8 @@ export default {
       tAlign:"left",
       // 最近7天的数据
       latest7DayData: [],
+      // 最近30天的数据
+      latest30DayData: {},
       // 电厂大屏实时数据
       dashboardelecdata: {
         pageNum: 1,
@@ -371,6 +373,8 @@ export default {
     }, 5000);
     // 抓取最近7天的数据
     this.getLatest7DayData();
+    // 抓取最近30天的数据
+    this.getLatest30DayData();
 
     // this.getList1();
     // this.getMonthList1();
@@ -383,7 +387,6 @@ export default {
     //     this.getList1();
     //   }, 0)
     // }, 30000)
-    //
     // // 一天请求一次数据
     // window.setInterval(() => {
     //   setTimeout(() => {
@@ -409,6 +412,13 @@ export default {
     // }, 1000 * 10 * 6 * 60 * 6)
   },
   methods: {
+    /** 抓取最近30天的数据 */
+    getLatest30DayData() {
+      listDayLatest30().then(response => {
+        // 最近30天的数据
+        this.latest30DayData = response.rows;
+      });
+    },
     /** 抓取最近7天的数据 */
     getLatest7DayData() {
       listDayLatest7().then(response => {