Ver Fonte

dashborad修改

liu85600613 há 3 anos atrás
pai
commit
4ea9a74fe0
2 ficheiros alterados com 55 adições e 17 exclusões
  1. 48 12
      ui/src/views/front/materialBalance.vue
  2. 7 5
      ui/src/views/front/steamBalance.vue

+ 48 - 12
ui/src/views/front/materialBalance.vue

@@ -57,51 +57,75 @@
           <div class="layout_left">
             <div class="box_two">
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-110</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-111</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-112</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-113</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-114</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-115</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-116</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-yellow.png">
+                      <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">
                       <p class="text2">310-H-117</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-118</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-red.png">
+                      <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">
                       <p class="text2">310-H-130</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-109A</p>
                 </div>
                 <div class="luziBox">
-                      <img src="@/assets/img/luzi-blue.png">
+                      <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">
                       <p class="text2">310-H-109B</p>
                 </div>
             </div>
@@ -357,6 +381,18 @@
     props: ['dashboarddata'],
     data () {
       return {
+        status110: 15,
+        status111: 15,
+        status112: 15,
+        status113: 20,
+        status114: 15,
+        status115: 15,
+        status116: 45,
+        status117: 15,
+        status118: 20,
+        status130: 15,
+        status109A: 15,
+        status109B: 45,
 
         // 查询参数
         queryParams: {

+ 7 - 5
ui/src/views/front/steamBalance.vue

@@ -42,7 +42,7 @@
 
         <div class="lu2-2">
           <img src="@/assets/steamImg/4.png" style="width:80px;height:90px">
-          <p class="word1-1">AUE/PGE</p>
+          <p class="word1-1">AEU/PGE</p>
         </div>
 
         <div class="lu2-3">
@@ -52,7 +52,7 @@
 
         <div class="lu2-4">
           <img src="@/assets/steamImg/2.png" style="width:145px;height:35px">
-          <p class="word1-1">H520/C32</p>
+          <p class="word1-1">H520/230</p>
         </div>
 
          <div class="lu2-5">
@@ -262,7 +262,7 @@
         </div>
 
         <div class="kuang pos-1">
-            <p>阀门</p>
+            <p>Letdown</p>
         </div>
 
         <div class="kuang pos-2">
@@ -278,7 +278,7 @@
         </div>
 
         <div class="kuang pos-5">
-            <p>TRANCING</p>
+            <p>Steam Tracing</p>
         </div>
         <div class="kuang pos-6">
             <p>V900</p>
@@ -287,7 +287,7 @@
             <p>V303</p>
         </div>
         <div class="kuang pos-8">
-            <p>TRANCING</p>
+            <p>Steam Tracing</p>
         </div>
 
         <div class="jiantoulan pos-1">
@@ -1111,6 +1111,7 @@
     &.pos-5{
       top: 450px;
       left: 1060px;
+      width: 120px;
       p{
         transform: scale(.8,.8);
       }
@@ -1126,6 +1127,7 @@
     &.pos-8{
         top: 640px;
         left: 480px;
+        width: 120px;
          p{
           transform: scale(.8,.8);
         }