cq

master/src/main/java/com/ruoyi/project/aspen/domain/TDashboardday.java

@@ -67,7 +67,7 @@ public class TDashboardday extends BaseEntity
     private Date dataDate;
 
     /** 抓取数据日 */
-    private String dataDay;
+    private String dateDay;
 
     public void setId(Long id)
     {
@@ -177,9 +177,9 @@ public class TDashboardday extends BaseEntity
     {
         return dataDate;
     }
-    public String getDataDay() { return dataDay; }
+    public String getDateDay() { return dateDay; }
 
-    public void setDataDay(String dataDay) { this.dataDay = dataDay; }
+    public void setDateDay(String dateDay) { this.dateDay = dateDay; }
 
     @Override
     public String toString() {

master/src/main/resources/mybatis/aspen/TDashboarddayMapper.xml

@@ -17,11 +17,11 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
         <result property="energyConsumption"    column="energy_consumption"    />
         <result property="productPutput"    column="product_putput"    />
         <result property="dataDate"    column="data_date"    />
-        <result property="dataDay"    column="data_day"    />
+        <result property="dateDay"    column="date_day"    />
     </resultMap>
 
     <sql id="selectTDashboarddayVo">
-        select id, del_flag, creater_code, createdate, updater_code, updatedate, daily_yixi, daily_bingxi, loss_rate, energy_consumption, product_putput, data_date, data_day from t_dashboardday
+        select id, del_flag, creater_code, createdate, updater_code, updatedate, daily_yixi, daily_bingxi, loss_rate, energy_consumption, product_putput, data_date, date_day from t_dashboardday
     </sql>
 
     <select id="selectTDashboarddayList" parameterType="TDashboardday" resultMap="TDashboarddayResult">
@@ -44,7 +44,7 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
     </select>
 
     <select id="selectLast" parameterType="TDashboardday" resultMap="TDashboarddayResult">
-        select * from ( select * from t_dashboardday where del_flag = 0 order by id desc ) WHERE 32 > ROWNUM
+        select * from ( select * from t_dashboardday where del_flag = 0 order by id asc ) WHERE 32 > ROWNUM
     </select>
     
     <select id="selectTDashboarddayById" parameterType="Long" resultMap="TDashboarddayResult">

ui/src/views/front/acrylicTank.vue

@@ -14,47 +14,47 @@
       </div>
       <div style="text-align: center;padding-bottom: 2px;display: flex;justify-content: space-between;margin-top: 10px;">
         <div style="position: relative;">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="0<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<20">
-          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="20<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<40">
-          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="40<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<60">
-          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="60<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<80">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="80<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<100">
+          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="0<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<20">
+          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="20<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<40">
+          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="40<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<60">
+          <img src="@/assets/image/Spherical4.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="60<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<80">
+          <img src="@/assets/image/Spherical5.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="80<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<100">
           <span class="modelTop pos1">STT1011</span>
           <div class="ModelFont">{{ dashboarddata.acrOne }}%</div>
         </div>
         <div style="position: relative;">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="0<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<20">
-          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="20<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<40">
-          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="40<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<60">
-          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="60<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<80">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="80<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<100">
+          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="0<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<20">
+          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="20<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<40">
+          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="40<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<60">
+          <img src="@/assets/image/Spherical4.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="60<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<80">
+          <img src="@/assets/image/Spherical5.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="80<=(dashboarddata.acrTwo) && (dashboarddata.acrTwo)<100">
           <span class="modelTop pos2">STT1012</span>
           <div class="ModelFont">{{ dashboarddata.acrTwo }}%</div>
         </div>
         <div style="position: relative;">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="0<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<20">
-          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="20<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<40">
-          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="40<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<60">
-          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="60<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<80">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="80<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<100">
+          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="0<=(dashboarddata.acrThree) && (dashboarddata.acrThree)<20">
+          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="20<=(dashboarddata.acrThree) && (dashboarddata.acrThree)<40">
+          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="40<=(dashboarddata.acrThree) && (dashboarddata.acrThree)<60">
+          <img src="@/assets/image/Spherical4.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="60<=(dashboarddata.acrThree) && (dashboarddata.acrThree)<80">
+          <img src="@/assets/image/Spherical5.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="80<=(dashboarddata.acrThree) && (dashboarddata.acrThree)<100">
           <span class="modelTop pos3">STT1013</span>
           <div class="ModelFont">{{ dashboarddata.acrThree }}%</div>
         </div>
         <div style="position: relative;">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="0<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<20">
-          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="20<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<40">
-          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="40<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<60">
-          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="60<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<80">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="80<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<100">
+          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="0<=(dashboarddata.acrFour) && (dashboarddata.acrFour)<20">
+          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="20<=(dashboarddata.acrFour) && (dashboarddata.acrFour)<40">
+          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="40<=(dashboarddata.acrFour) && (dashboarddata.acrFour)<60">
+          <img src="@/assets/image/Spherical4.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="60<=(dashboarddata.acrFour) && (dashboarddata.acrFour)<80">
+          <img src="@/assets/image/Spherical5.png" style="height: 100px;width: 80px; margin-top: 0.1rem" v-if="80<=(dashboarddata.acrFour) && (dashboarddata.acrFour)<100">
           <span class="modelTop pos4">STT1014</span>
           <div class="ModelFont">{{ dashboarddata.acrFour }}%</div>
         </div>
         <div style="position: relative;">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="0<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<20">
-          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="20<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<40">
-          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="40<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<60">
-          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="60<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<80">
-          <img src="@/assets/image/spherical.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="80<=(dashboarddata.acrOne) && (dashboarddata.acrOne)<100">
+          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="0<=(dashboarddata.acrZero) && (dashboarddata.acrZero)<20">
+          <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="20<=(dashboarddata.acrZero) && (dashboarddata.acrZero)<40">
+          <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="40<=(dashboarddata.acrZero) && (dashboarddata.acrZero)<60">
+          <img src="@/assets/image/Spherical4.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="60<=(dashboarddata.acrZero) && (dashboarddata.acrZero)<80">
+          <img src="@/assets/image/Spherical5.png" style="height: 100px;width: 80px; margin-top: 0.7rem" v-if="80<=(dashboarddata.acrZero) && (dashboarddata.acrZero)<100">
           <span class="modelTop pos5">STT1040</span>
           <div class="ModelFont">{{ dashboarddata.acrZero }}%</div>
         </div>

ui/src/views/front/bottomEnergy.vue

@@ -39,28 +39,6 @@ export default {
   },
   data() {
     return {
-      /*config: {
-        header: ["", "BCC", "SUB", "EU", "PGU/AEU"],
-        data: [
-          ["SS(HS)自产", "509", "132", "376", "1"],
-          ["HHP", "46", "46", "", ""],
-          ["HS", "-36", "161", "85", "41"],
-          ["MS", "-44", "", "-69", "25"],
-          ["LS", "-16", "", "-11", "-5"],
-          ["TOTAL", "-49", "", "5", ""],
-          ["总消耗", "459", "", "381", "62"]
-          /!*["TOTAL", "-49", "<span  class='colorRed'>28</span>"],
-          ["总消耗", "459", "<span  class='colorRed'>27</span>"]*!/
-        ],
-        rowNum: 6, //表格行数
-        headerHeight: 35,
-        headerBGC: "#0f1325", //表头
-        oddRowBGC: "#0f1325", //奇数行
-        evenRowBGC: "#171c33", //偶数行
-        columnWidth: [110, 70, 70, 70, 90],
-        align: ["center", "center", "center", "center", "center"]
-      }*/
-
       chart: null
     };
   },
@@ -81,6 +59,12 @@ export default {
     initChart() {
       // 基于准备好的dom，初始化echarts实例
       this.chart = this.echarts.init(document.getElementById('monthEnergyChart'))
+      const dateDay = [];
+      const dateNum = [];
+      for (let i = 0; i < this.monthData.length; i++) {
+        dateDay[i] = this.monthData[i].dateDay
+        dateNum[i] = this.monthData[i].energyConsumption
+      }
 
       this.chart.setOption({
         /* 周围边距 */
@@ -93,14 +77,14 @@ export default {
         },
         xAxis: {
           type: 'category',
-          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: dateDay
         },
         yAxis: {
           type: 'value'
         },
         series: [
           {
-            data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
+            data: dateNum,
             type: 'line',
             itemStyle: {
               color: 'rgb(78,109,60)'

ui/src/views/front/bottomLeft.vue

@@ -19,7 +19,6 @@
 </template>
 
 <script>
-import valveChart from "../dashboard/ValveChart";
 require('echarts/theme/macarons') // echarts theme
 
 import resize from "../dashboard/mixins/resize";
@@ -39,34 +38,9 @@ export default {
   },
   data() {
     return {
-      /*config: {
-        header: ["", "BCC", "SUB", "EU", "PGU/AEU"],
-        data: [
-          ["SS(HS)自产", "509", "132", "376", "1"],
-          ["HHP", "46", "46", "", ""],
-          ["HS", "-36", "161", "85", "41"],
-          ["MS", "-44", "", "-69", "25"],
-          ["LS", "-16", "", "-11", "-5"],
-          ["TOTAL", "-49", "", "5", ""],
-          ["总消耗", "459", "", "381", "62"]
-          /!*["TOTAL", "-49", "<span  class='colorRed'>28</span>"],
-          ["总消耗", "459", "<span  class='colorRed'>27</span>"]*!/
-        ],
-        rowNum: 6, //表格行数
-        headerHeight: 35,
-        headerBGC: "#0f1325", //表头
-        oddRowBGC: "#0f1325", //奇数行
-        evenRowBGC: "#171c33", //偶数行
-        columnWidth: [110, 70, 70, 70, 90],
-        align: ["center", "center", "center", "center", "center"]
-      }*/
-
       chart: null
     };
   },
-  components: {
-    valveChart
-  },
   mounted() {
     this.initChart()
   },
@@ -81,6 +55,12 @@ export default {
     initChart() {
       // 基于准备好的dom，初始化echarts实例
       this.chart = this.echarts.init(document.getElementById('monthProductChart'))
+      const dateDay = [];
+      const dateNum = [];
+      for (let i = 0; i < this.monthData.length; i++) {
+        dateDay[i] = this.monthData[i].dateDay
+        dateNum[i] = this.monthData[i].productPutput
+      }
 
       this.chart.setOption({
         /* 周围边距 */
@@ -93,14 +73,14 @@ export default {
         },
         xAxis: {
           type: 'category',
-          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: dateDay,
         },
         yAxis: {
           type: 'value'
         },
         series: [
           {
-            data: [150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 150, 230, 224, 218, 135, 147, 260, 23, 147, 123],
+            data: dateNum,
             type: 'line',
             itemStyle: {
               color: 'rgb(93,145,255)'

ui/src/views/front/energyConsumption.vue

@@ -25,16 +25,7 @@ import resize from "../dashboard/mixins/resize";
 export default {
   components: {},
   mixins: [resize],
-  props: {
-    width: {
-      type: String,
-      default: '100%'
-    },
-    height: {
-      type: String,
-      default: '180px'
-    },
-  },
+  props: ['monthData'],
   data() {
     return {
       chart: null
@@ -54,6 +45,12 @@ export default {
     initChart() {
       // 基于准备好的dom，初始化echarts实例
       this.chart = this.echarts.init(document.getElementById('LossrateChart'))
+      const dateDay = [];
+      const dateNum = [];
+      for (let i = 0; i < this.monthData.length; i++) {
+        dateDay[i] = this.monthData[i].dateDay
+        dateNum[i] = this.monthData[i].lossRate
+      }
 
       this.chart.setOption({
         color: ['#37A2FF'],
@@ -69,7 +66,7 @@ export default {
         /* 周围边距 */
         grid: {
           left: '3%',
-          right: '3%',
+          right: '7%',
           bottom: '1%',
           top: '13%',
           containLabel: true
@@ -77,19 +74,19 @@ export default {
         xAxis: {
           type: 'category',
           boundaryGap: false,
-          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+          data: dateDay
         },
         yAxis: {
           type: 'value',
           axisLabel: {
-            formatter: '{value} °C'
+            formatter: '{value}%'
           }
         },
         series: [
           {
             name: 'Lowest',
             type: 'line',
-            data: [1, -2, 2, 5, 3, 2, 0],
+            data: dateNum,
             markPoint: {
               data: [{ name: '周最低', value: -2, xAxis: 1, yAxis: -1.5 }]
             },

ui/src/views/front/ethyleneTank.vue

@@ -65,8 +65,6 @@
 </template>
 
 <script>
-import { selectLast } from "@/api/aspen/dashboarddata";
-
 export default {
   props: ['dashboarddata'],
   data () {
@@ -76,25 +74,6 @@ export default {
       },
     }
   },
-  created() {
-    // this.getList();
-    // 每隔30秒请求一次数据
-    // window.setInterval(() => {undefined
-    //   setTimeout(() => {undefined
-    //     ///调取接口获取数据
-    //     this.getList();
-    //   }, 0)
-    // }, 10000)
-  },
-  methods: {
-    /** 查询dashboard抓取数据列表 */
-    // getList()
-    // {
-    //   selectLast(this.queryParams).then(response => {
-    //     this.dashboarddata = response.data;
-    //   });
-    // }
-  }
 }
 </script>
 

ui/src/views/front/napTank.vue

@@ -12,24 +12,43 @@
           </div>
         </div>
       </div>
-      <div style="text-align: center; margin-top: 0.3rem;position: relative;">
-        <span class="span-num1">T1621</span>
-        <nap />
-        <span class="span-num2">T1622</span>
-        <nap />
-        <span class="span-num3">T1623</span>
-        <nap />
+      <div style="text-align: center; display: flex;justify-content: space-between;margin-top: 10px;">
+        <div style="position: relative;">
+          <span class="span-num1">T1621</span>
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="0<=(dashboarddata.napOne) && (dashboarddata.napOne)<20">
+          <img src="@/assets/image/warehouse2.png" style="height: 100px;width:120px" v-if="20<=(dashboarddata.napOne) && (dashboarddata.napOne)<40">
+          <img src="@/assets/image/warehouse3.png" style="height: 100px;width:120px" v-if="40<=(dashboarddata.napOne) && (dashboarddata.napOne)<60">
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="60<=(dashboarddata.napOne) && (dashboarddata.napOne)<80">
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="80<=(dashboarddata.napOne) && (dashboarddata.napOne)<100">
+          <div class="ModelFont">{{ dashboarddata.napOne }}%</div>
+        </div>
+        <div style="position: relative;">
+          <span class="span-num2">T1622</span>
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="0<=(dashboarddata.napTwo) && (dashboarddata.napTwo)<20">
+          <img src="@/assets/image/warehouse2.png" style="height: 100px;width:120px" v-if="20<=(dashboarddata.napTwo) && (dashboarddata.napTwo)<40">
+          <img src="@/assets/image/warehouse3.png" style="height: 100px;width:120px" v-if="40<=(dashboarddata.napTwo) && (dashboarddata.napTwo)<60">
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="60<=(dashboarddata.napTwo) && (dashboarddata.napTwo)<80">
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="80<=(dashboarddata.napTwo) && (dashboarddata.napTwo)<100">
+          <div class="ModelFont">{{ dashboarddata.napTwo }}%</div>
+        </div>
+        <div style="position: relative;">
+          <span class="span-num3">T1623</span>
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="0<=(dashboarddata.napThree) && (dashboarddata.napThree)<20">
+          <img src="@/assets/image/warehouse2.png" style="height: 100px;width:120px" v-if="20<=(dashboarddata.napThree) && (dashboarddata.napThree)<40">
+          <img src="@/assets/image/warehouse3.png" style="height: 100px;width:120px" v-if="40<=(dashboarddata.napThree) && (dashboarddata.napThree)<60">
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="60<=(dashboarddata.napThree) && (dashboarddata.napThree)<80">
+          <img src="@/assets/image/warehouse1.png" style="height: 100px;width:120px" v-if="80<=(dashboarddata.napThree) && (dashboarddata.napThree)<100">
+          <div class="ModelFont">{{ dashboarddata.napThree }}%</div>
+        </div>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import nap from "../dashboard/nap";
 export default {
-  components: {
-    nap
-  },
+  components: {},
+  props: ['dashboarddata'],
 }
 </script>
 
@@ -53,19 +72,19 @@ export default {
 
     .span-num1{
         position: absolute;
-        left: 44px;
+        left: 32%;
         top: -16px;
     }
 
     .span-num2{
         position: absolute;
-        left: 174px;
+        left: 32%;
         top: -16px;
     }
 
     .span-num3{
         position: absolute;
-        left: 304px;
+        left: 32%;
         top: -16px;
     }
   }

ui/src/views/front/productTank.vue

@@ -13,22 +13,38 @@
         </div>
       </div>
       <div style="float: left; margin-left: 0.1rem;position: relative">
-        <img src="@/assets/image/warehouse1.png" style="height: 124px;margin-top: 0.3rem">
-        <div class="ModelFont" style="margin-left: 0.2rem">65%</div>
+        <img src="@/assets/image/warehouse1.png" style="height: 124px;margin-top: 0.3rem" v-if="0<=(dashboarddata.proTwo) && (dashboarddata.proTwo)<20">
+        <img src="@/assets/image/warehouse2.png" style="height: 124px;margin-top: 0.3rem" v-if="20<=(dashboarddata.proTwo) && (dashboarddata.proTwo)<40">
+        <img src="@/assets/image/warehouse3.png" style="height: 124px;margin-top: 0.3rem" v-if="40<=(dashboarddata.proTwo) && (dashboarddata.proTwo)<60">
+        <img src="@/assets/image/warehouse1.png" style="height: 124px;margin-top: 0.3rem" v-if="60<=(dashboarddata.proTwo) && (dashboarddata.proTwo)<80">
+        <img src="@/assets/image/warehouse1.png" style="height: 124px;margin-top: 0.3rem" v-if="80<=(dashboarddata.proTwo) && (dashboarddata.proTwo)<100">
+        <div class="ModelFont" style="margin-left: 0.2rem">{{ dashboarddata.proTwo }}%</div>
         <span class="modelTop pos1">STT1520</span>
       </div>
       <div style="float: left; margin-left: 0.2rem;position: relative">
         <div style="text-align: center">
-          <img src="@/assets/image/warehouse1.png" style="height:80px">
-          <div class="ModelFont ModelFont2" style="top: 80px;left: 88px;">65%</div>
+          <img src="@/assets/image/warehouse1.png" style="height:80px" v-if="0<=(dashboarddata.proOne) && (dashboarddata.proOne)<20">
+          <img src="@/assets/image/warehouse2.png" style="height:80px" v-if="20<=(dashboarddata.proOne) && (dashboarddata.proOne)<40">
+          <img src="@/assets/image/warehouse3.png" style="height:80px" v-if="40<=(dashboarddata.proOne) && (dashboarddata.proOne)<60">
+          <img src="@/assets/image/warehouse1.png" style="height:80px" v-if="60<=(dashboarddata.proOne) && (dashboarddata.proOne)<80">
+          <img src="@/assets/image/warehouse1.png" style="height:80px" v-if="80<=(dashboarddata.proOne) && (dashboarddata.proOne)<100">
+          <div class="ModelFont ModelFont2" style="top: 80px;left: 88px;">{{ dashboarddata.proOne }}%</div>
           <span class="modelTop pos2">STT1510</span>
         </div>
         <div style="text-align: center;">
-          <img src="@/assets/image/warehouse3.png" style="height: 80px">
-          <div class="ModelFont ModelFont2"  style="top: 170px;left: 40px;">65%</div>
+          <img src="@/assets/image/warehouse1.png" style="height:80px" v-if="0<=(dashboarddata.proThree) && (dashboarddata.proThree)<20">
+          <img src="@/assets/image/warehouse2.png" style="height:80px" v-if="20<=(dashboarddata.proThree) && (dashboarddata.proThree)<40">
+          <img src="@/assets/image/warehouse3.png" style="height:80px" v-if="40<=(dashboarddata.proThree) && (dashboarddata.proThree)<60">
+          <img src="@/assets/image/warehouse1.png" style="height:80px" v-if="60<=(dashboarddata.proThree) && (dashboarddata.proThree)<80">
+          <img src="@/assets/image/warehouse1.png" style="height:80px" v-if="80<=(dashboarddata.proThree) && (dashboarddata.proThree)<100">
+          <div class="ModelFont ModelFont2"  style="top: 170px;left: 40px;">{{ dashboarddata.proThree }}%</div>
           <span class="modelTop pos3">STT1360</span>
-          <img src="@/assets/image/warehouse2.png" style="height:80px; margin-left: 0.2rem">
-          <div class="ModelFont ModelFont2"  style="top: 170px;left: 140px;">65%</div>
+          <img src="@/assets/image/warehouse1.png" style="height:80px; margin-left: 0.2rem" v-if="0<=(dashboarddata.proFour) && (dashboarddata.proFour)<20">
+          <img src="@/assets/image/warehouse2.png" style="height:80px; margin-left: 0.2rem" v-if="20<=(dashboarddata.proFour) && (dashboarddata.proFour)<40">
+          <img src="@/assets/image/warehouse3.png" style="height:80px; margin-left: 0.2rem" v-if="40<=(dashboarddata.proFour) && (dashboarddata.proFour)<60">
+          <img src="@/assets/image/warehouse1.png" style="height:80px; margin-left: 0.2rem" v-if="60<=(dashboarddata.proFour) && (dashboarddata.proFour)<80">
+          <img src="@/assets/image/warehouse1.png" style="height:80px; margin-left: 0.2rem" v-if="80<=(dashboarddata.proFour) && (dashboarddata.proFour)<100">
+          <div class="ModelFont ModelFont2"  style="top: 170px;left: 140px;">{{ dashboarddata.proFour }}%</div>
           <span class="modelTop pos4">STT1410</span>
         </div>
       </div>
@@ -38,6 +54,7 @@
 
 <script>
 export default {
+  props: ['dashboarddata'],
   components: {
   },
 }

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

@@ -73,7 +73,7 @@
                     </div>
                     <div class="middle">
                       <dv-border-box-13>
-                        <energy-consumption :dashboarddata = 'dashboarddata'/>
+                        <energy-consumption :monthData = 'monthData'/>
                       </dv-border-box-13>
                     </div>
                     <div class="down">
@@ -303,7 +303,15 @@
           instantaneous: null,
           cumulative: null
         },
-        monthData: {}
+        monthData: {
+          dailyYixi: null,
+          dailyBingxi: null,
+          lossRate: null,
+          energyConsumption: null,
+          productPutput: null,
+          dataDate: null,
+          dateDay: null
+        }
       };
     },
     components: {