Dashboard - BCC首页物料平衡表裂解炉颜色关联裂解巡检裂解炉状态

ui/src/api/production/temperature.js

@@ -1,5 +1,13 @@
 import request from '@/utils/request'
 
+// 裂解炉测温列表Summary（APP）
+export function getTemperatureSummary() {
+  return request({
+    url: '/production/temperature/summary',
+    method: 'get'
+  })
+}
+
 // 获取裂解炉炉管测温详细信息
 export function getInfoByDate(data) {
   return request({

ui/src/views/front/materialBalanceHome.vue

@@ -57,75 +57,111 @@
                 <div class="layout_left">
                     <div class="box_two">
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status110) && (this.status110)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status110) && (this.status110)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status110) && (this.status110)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status110) && (this.status110)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status110) && (this.status110)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status110) && (this.status110)<60">-->
+                            <img src="@/assets/img/luzi-blue.png" v-if="this.status110=='0'">
+                            <img src="@/assets/img/luzi-yellow.png" v-if="this.status110=='1'">
+                            <img src="@/assets/img/luzi-red.png" v-if="this.status110=='2'">
                             <p class="text2">310-H-110</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status111) && (this.status111)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status111) && (this.status111)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status111) && (this.status111)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status111) && (this.status111)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status111) && (this.status111)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status111) && (this.status111)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status111=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status111=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status111=='2'">
                             <p class="text2">310-H-111</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status112) && (this.status112)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status112) && (this.status112)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status112) && (this.status112)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status112) && (this.status112)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status112) && (this.status112)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status112) && (this.status112)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status112=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status112=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status112=='2'">
                             <p class="text2">310-H-112</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status113) && (this.status113)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status113) && (this.status113)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status113) && (this.status113)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status113) && (this.status113)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status113) && (this.status113)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status113) && (this.status113)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status113=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status113=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status113=='2'">
                             <p class="text2">310-H-113</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status114) && (this.status114)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status114) && (this.status114)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status114) && (this.status114)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status114) && (this.status114)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status114) && (this.status114)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status114) && (this.status114)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status114=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status114=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status114=='2'">
                             <p class="text2">310-H-114</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status115) && (this.status115)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status115) && (this.status115)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status115) && (this.status115)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status115) && (this.status115)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status115) && (this.status115)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status115) && (this.status115)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status115=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status115=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status115=='2'">
                             <p class="text2">310-H-115</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status116) && (this.status116)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status116) && (this.status116)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status116) && (this.status116)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status116) && (this.status116)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status116) && (this.status116)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status116) && (this.status116)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status116=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status116=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status116=='2'">
                             <p class="text2">310-H-116</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status117) && (this.status117)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status117) && (this.status117)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status117) && (this.status117)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status117) && (this.status117)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status117) && (this.status117)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status117) && (this.status117)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status117=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status117=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status117=='2'">
                             <p class="text2">310-H-117</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status118) && (this.status118)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status118) && (this.status118)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status118) && (this.status118)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status118) && (this.status118)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status118) && (this.status118)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status118) && (this.status118)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status118=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status118=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status118=='2'">
                             <p class="text2">310-H-118</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status130) && (this.status130)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status130) && (this.status130)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status130) && (this.status130)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status130) && (this.status130)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status130) && (this.status130)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status130) && (this.status130)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status130=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status130=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status130=='2'">
                             <p class="text2">310-H-130</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status109A) && (this.status109A)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status109A) && (this.status109A)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status109A) && (this.status109A)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status109A) && (this.status109A)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status109A) && (this.status109A)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status109A) && (this.status109A)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status109A=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status109A=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status109A=='2'">
                             <p class="text2">310-H-109A</p>
                         </div>
                         <div class="luziBox" @click="newTabClick">
-                            <img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status109B) && (this.status109B)<20">
-                            <img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status109B) && (this.status109B)<40">
-                            <img src="@/assets/img/luzi-red.png" v-if="40<=(this.status109B) && (this.status109B)<60">
+                            <!--<img src="@/assets/img/luzi-blue.png" v-if="0<=(this.status109B) && (this.status109B)<20">-->
+                            <!--<img src="@/assets/img/luzi-yellow.png" v-if="20<=(this.status109B) && (this.status109B)<40">-->
+                            <!--<img src="@/assets/img/luzi-red.png" v-if="40<=(this.status109B) && (this.status109B)<60">-->
+                          <img src="@/assets/img/luzi-blue.png" v-if="this.status109B=='0'">
+                          <img src="@/assets/img/luzi-yellow.png" v-if="this.status109B=='1'">
+                          <img src="@/assets/img/luzi-red.png" v-if="this.status109B=='2'">
                             <p class="text2">310-H-109B</p>
                         </div>
                     </div>
@@ -381,6 +417,7 @@
 
 <script>
 import { selectLast } from "@/api/aspen/dashboarddata";
+import { getTemperatureSummary } from "@/api/production/temperature";
 
 export default {
     name: "materialBalance",
@@ -404,8 +441,40 @@ export default {
             queryParams: {},
         }
     },
-    created() {},
+    created() {
+      this.getTemperatureSummary();
+    },
     methods: {
+      getTemperatureSummary() {
+        getTemperatureSummary().then(response => {
+          for (let i = 0; i < response.data.length; i++) {
+            if (response.data[i].furnanceName == 'H109') {
+              this.status109A = response.data[i].status;
+              this.status109B = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H110') {
+              this.status110 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H111') {
+              this.status111 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H112') {
+              this.status112 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H113') {
+              this.status113 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H114') {
+              this.status114 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H115') {
+              this.status115 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H116') {
+              this.status116 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H117') {
+              this.status117 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H118') {
+              this.status118 = response.data[i].status;
+            } else if (response.data[i].furnanceName == 'H130') {
+              this.status130 = response.data[i].status;
+            }
+          }
+        });
+      },
         handleLuzi() {
           this.$router.push({ path: '/monitor/pfd', query: { pageId: 'LJL' }});
         },