*

ui/.env.development

@@ -2,8 +2,8 @@
 ENV = 'development'
 
 # CPMS管理系统/开发环境
-VUE_APP_BASE_API = '/dev-api'
-#VUE_APP_BASE_API = 'http://47.114.101.16:8090'
+#VUE_APP_BASE_API = '/dev-api'
+VUE_APP_BASE_API = 'http://47.114.101.16:8090'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

ui/src/views/front/acrylicTank.vue

@@ -12,25 +12,30 @@
           </div>
         </div>
       </div>
-      <div style="text-align: center;padding-bottom: 2px">
-        <div style="float: left">
+      <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">
+          <span class="modelTop pos1">we1234</span>
           <div class="ModelFont">55%</div>
         </div>
-        <div style="float: left">
+        <div style="position: relative;">
           <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: 0.1rem">
+          <span class="modelTop pos2">we1234</span>
           <div class="ModelFont">55%</div>
         </div>
-        <div style="float: left">
+        <div style="position: relative;">
           <img src="@/assets/image/Spherical2.png" style="height: 100px;width: 80px; margin-top: 0.7rem">
+          <span class="modelTop pos3">we1234</span>
           <div class="ModelFont">55%</div>
         </div>
-        <div style="float: left">
+        <div style="position: relative;">
           <img src="@/assets/image/Spherical3.png" style="height: 100px;width: 80px; margin-top: 0.1rem">
+          <span class="modelTop pos4">we1234</span>
           <div class="ModelFont">55%</div>
         </div>
-        <div style="float: left">
-          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px; margin-top: -0.5rem;margin-left: 0.7rem">
+        <div style="position: relative;">
+          <img src="@/assets/image/Spherical1.png" style="height: 100px;width: 80px;margin-top: 0.7rem;">
+          <span class="modelTop pos5">we1234</span>
           <div class="ModelFont">55%</div>
         </div>
       </div>
@@ -60,7 +65,7 @@ export default {
     min-width: 3.75rem;
     border-radius: 0.0625rem;
     .bg-color-black {
-      height: 2rem;
+      height: 4rem;
       border-radius: 0.125rem;
     }
     .text {
@@ -78,5 +83,28 @@ export default {
         padding-top: 0.125rem;
       }
     }
+    .modelTop{
+      position: absolute;
+      &.pos1{
+        left: 20px;
+        top: 20px;
+      }
+      &.pos2{
+        left: 20px;
+        top: -15px;
+      }
+      &.pos3{
+        left: 20px;
+        top: 20px;
+      }
+      &.pos4{
+        left: 20px;
+        top: -15px;
+      }
+      &.pos5{
+        left: 20px;
+        top: 20px;
+      }
+    }
   }
 </style>

ui/src/views/front/bottomEnergy.vue

@@ -132,7 +132,7 @@ export default {
   min-width: 3.75rem;
   border-radius: 0.0625rem;
   .bg-color-black {
-    height: 2rem;
+    height: 4rem;
     border-radius: 0.125rem;
   }
   .text {

ui/src/views/front/bottomLeft.vue

@@ -132,7 +132,7 @@ export default {
   min-width: 3.75rem;
   border-radius: 0.0625rem;
   .bg-color-black {
-    height: 2rem;
+    height: 4rem;
     border-radius: 0.125rem;
   }
   .text {

ui/src/views/front/bottomRight.vue

@@ -59,7 +59,7 @@ export default {
   min-width: 3.75rem;
   border-radius: 0.0625rem;
   .bg-color-black {
-    height: 2rem;
+    height: 4rem;
     border-radius: 0.125rem;
   }
   .text {

ui/src/views/front/ethyleneTank.vue

@@ -12,17 +12,33 @@
           </div>
         </div>
       </div>
-      <div style="text-align: center;">
-        <img src="@/assets/image/cylindrical1.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
-        <span class="ModelFont">55%</span>
-        <img src="@/assets/image/cylindrical2.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
-        <span class="ModelFont">55%</span>
-        <img src="@/assets/image/cylindrical3.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
-        <span class="ModelFont">55%</span>
-        <img src="@/assets/image/cylindrical4.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
-        <span class="ModelFont">55%</span>
-        <img src="@/assets/image/cylindrical5.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
-        <span class="ModelFont">55%</span>
+      <div style="text-align: center; display: flex;justify-content: space-between;margin-top: 10px;">
+        <div style="position: relative;">
+            <img src="@/assets/image/cylindrical1.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
+            <span class="modelTop pos">we1234</span>
+            <span class="ModelFont">55%</span>
+        </div>
+        <div style="position: relative;">
+            <img src="@/assets/image/cylindrical2.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
+            <span class="modelTop pos">we1234</span>
+            <span class="ModelFont">55%</span>
+        </div>
+
+        <div style="position: relative;">
+          <img src="@/assets/image/cylindrical3.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
+          <span class="modelTop pos">we1234</span>
+          <span class="ModelFont">55%</span>
+        </div>
+        <div style="position: relative;">
+          <img src="@/assets/image/cylindrical4.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
+          <span class="modelTop pos">we1234</span>
+          <span class="ModelFont">55%</span>
+        </div>
+        <div style="position: relative;">
+          <img src="@/assets/image/cylindrical5.png" style="width:40px;height: 170px;margin-left: 0.1rem;">
+          <span class="modelTop pos">we1234</span>
+          <span class="ModelFont">55%</span>
+        </div>
       </div>
     </div>
   </div>
@@ -45,7 +61,7 @@ export default {
     min-width: 3.75rem;
     border-radius: 0.0625rem;
     .bg-color-black {
-      height: 2rem;
+      height: 4rem;
       border-radius: 0.125rem;
     }
     .text {
@@ -65,9 +81,21 @@ export default {
     }
     .ModelFont {
       position: relative;
-      top: 0.2rem;
-      right: 0.35rem;
+      top: 0.3rem;
+      right: 0.5rem;
       // font-size: 12px;
     }
+
+    .modelTop{
+      position: absolute;
+      width: 12px; 
+      display: block; 
+       word-break: break-all;
+      top: 25%;
+      
+      &.pos{
+        right: 8%;
+      }
+    }
   }
 </style>

ui/src/views/front/napTank.vue

@@ -12,9 +12,12 @@
           </div>
         </div>
       </div>
-      <div style="text-align: center; margin-top: 0.3rem">
+      <div style="text-align: center; margin-top: 0.3rem;position: relative;">
+        <span class="span-num1">we1234</span>
         <nap />
+        <span class="span-num2">we1234</span>
         <nap />
+        <span class="span-num3">we1234</span>
         <nap />
       </div>
     </div>
@@ -37,6 +40,7 @@ export default {
     border-radius: 0.0625rem;
     .bg-color-black {
       border-radius: 0.125rem;
+      height: 4rem;
     }
     .text {
       color: #c3cbde;
@@ -46,5 +50,23 @@ export default {
       position: absolute;
       right: 0.125rem;
     }
+
+    .span-num1{
+        position: absolute;
+        left: 44px;
+        top: -16px;
+    }
+
+    .span-num2{
+        position: absolute;
+        left: 174px;
+        top: -16px;
+    }
+
+    .span-num3{
+        position: absolute;
+        left: 304px;
+        top: -16px;
+    }
   }
 </style>

ui/src/views/front/productTank.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="app-container-product">
-    <div class="bg-color-black">
+    <div class="bg-color-black" style=";">
       <div class="d-flex pt-2 pl-2">
         <span style="color:#5cd9e8">
           <icon name="chart-area"></icon>
@@ -12,17 +12,21 @@
           </div>
         </div>
       </div>
-      <div style="float: left; margin-left: 0.1rem">
+      <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>
+        <span class="modelTop pos1">we1234</span>
       </div>
-      <div style="float: left; margin-left: 0.2rem">
+      <div style="float: left; margin-left: 0.2rem;position: relative">
         <div style="text-align: center">
           <img src="@/assets/image/warehouse1.png" style="height:80px">
+          <span class="modelTop pos2">we1234</span>
         </div>
-        <div style="text-align: center">
+        <div style="text-align: center;">
           <img src="@/assets/image/warehouse3.png" style="height: 80px">
+          <span class="modelTop pos3">we1234</span>
           <img src="@/assets/image/warehouse2.png" style="height:80px; margin-left: 0.2rem">
+          <span class="modelTop pos4">we1234</span>
         </div>
       </div>
     </div>
@@ -43,7 +47,7 @@ export default {
     min-width: 3.75rem;
     border-radius: 0.0625rem;
     .bg-color-black {
-      height: 2rem;
+      height: 4rem;
       border-radius: 0.125rem;
     }
     .text {
@@ -54,5 +58,25 @@ export default {
       position: absolute;
       right: 0.125rem;
     }
+
+    .modelTop{
+      position: absolute;
+      &.pos1{
+        left: 44px;
+        top: 0px;
+      }
+      &.pos2{
+        left: 80px;
+        top: -15px;
+      }
+      &.pos3{
+        left: 24px;
+        top: 70px;
+      }
+      &.pos4{
+        left: 130px;
+        top: 70px;
+      }
+    }
   }
 </style>

ui/src/views/front/steamBalance.vue

@@ -177,10 +177,12 @@
 
         <div class="jiantou11">
           <img src="@/assets/steamImg/jiantou3.png" style="width:8px;height:39px">
+          <p class="num">99</p>
         </div>
 
         <div class="jiantou12">
           <img src="@/assets/steamImg/jiantou3.png" style="width:8px;height:39px">
+          <p class="num">99</p>
         </div>
 
         <div class="jiantou13">
@@ -236,7 +238,7 @@
 
         <div class="jiantou23">
           <img src="@/assets/steamImg/jiantou13.png" style="width:111px;height:33px">
-           <p class="num">41</p>
+           <!-- <p class="num">41</p> -->
         </div>
 
         <div class="jiantou24">
@@ -317,6 +319,7 @@
           <img src="@/assets/steamImg/jiantoulan3.png" style="width:80px;height:347px">
           <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan5">
           <img src="@/assets/steamImg/arror1.png" style="width:32px;height:31px" class="aniMovelan5-2">
+          <p class="num2">33</p>
         </div>
         <div class="jiantoulan pos-6">
           <img src="@/assets/steamImg/jiantoulan4.png" style="width:31px;height:150px">
@@ -560,6 +563,12 @@
       &.pos-5{
         top: 200px;
         left: 52px;
+        .num2{
+          top: 50px;
+          left: 20px;
+          color: #3659ab;
+          position: absolute;
+        }
          .aniMovelan5{
             -webkit-animation-name:aniMovelan5;
               animation-name:aniMovelan5;
@@ -1507,12 +1516,24 @@
     position: absolute;
     top: 200px;
     left: 950px;
+    .num{
+      color: #3694b0;
+      position: absolute;
+      left: 7px;
+      top: 10px;
+    }
   }
 
   .jiantou12{
     position: absolute;
     top: 200px;
     left: 1100px;
+    .num{
+      color: #3694b0;
+      position: absolute;
+      left: 7px;
+      top: 10px;
+    }
   }
 
   .jiantou13{
@@ -1664,7 +1685,7 @@
       color: #3694b0;
       position: absolute;
       left: 10px;
-      top: 24px;
+      top: 0;
     }
   }