cq

ui/src/views/dashboard/productProportion.vue

@@ -57,7 +57,7 @@ export default {
           right: 5,
           top: 40,
           bottom: 20,
-          data: ["Offags", "LPG", "C4", "RPG"],
+          data: ["Offgas", "LPG", "C4", "RPG"],
           textStyle: {
             color: "#fff"
           }
@@ -90,7 +90,7 @@ export default {
               { value: 555, name: "C2H4" },
               { value: 1555, name: "CH4" },
               { value: 2555, name: "C3H6" },
-              { value: 250, name: "Offags" },
+              { value: 250, name: "Offgas" },
               { value: 3555, name: "LPG" },
               { value: 350, name: "C4" },
               { value: 4555, name: "RPG" }

ui/src/views/front/materialBalance.vue

@@ -116,7 +116,7 @@
             <div class="luzi2">
                 <div class="ebo2Box">EBO</div>
                 <div class="imgBox">
-                  
+
                   <img src="@/assets/img/luzi2-img-arror2.png" class="luzi2-img2 move2 ar-animated">
                   <img src="@/assets/img/arror4.png" class="arror4 luzi2-img3 move3 ar-animated">
                   <img src="@/assets/img/arror4.png" class="arror4 luzi2-img4 move3 ar-animated">
@@ -136,20 +136,20 @@
                     <img src="@/assets/img/arror6.png" class="arror6">
                     <img src="@/assets/img/sanjiao.png" class="sanjiao2 move9 ar-animated1">
                   </div>
-                  
+
                   <div class="xixian">
                     <img src="@/assets/img/arror7.png" class="arror7">
                     <img src="@/assets/img/sanjiao.png" class="sanjiao3 move10 ar-animated1">
                   </div>
 
                      <img src="@/assets/img/arror8.png" class="arror8">
-                    
+
 
                   <div class="xixian">
                     <img src="@/assets/img/arror9.png" class="arror9">
                     <img src="@/assets/img/sanjiao.png" class="sanjiao4 move11 ar-animated">
                   </div>
-                  
+
                    <div class="xixian">
                     <img src="@/assets/img/arror9.png" class="arror10">
                     <img src="@/assets/img/sanjiao.png" class="sanjiao5 move12 ar-animated">
@@ -167,7 +167,7 @@
                     <img src="@/assets/img/arror10.png" class="arror13">
                     <img src="@/assets/img/sanjiao.png" class="sanjiao8 move15 ar-animated">
                   </div>
-                </div> 
+                </div>
 
                 <div class="wordBox">
                     <span class="location loc1">Compressor</span>
@@ -182,7 +182,7 @@
 
                     <span class="location loc9">1884</span>
                     <span class="location loc10">1621</span>
-                </div> 
+                </div>
 
                 <div class="elementBox elementBoxLoc1">
                     <div class="box_one elementItem">RPG</div>
@@ -218,7 +218,7 @@
                     <div class="box_one elementItem">H2</div>
                     <div class="box_one elementItem">C2H4</div>
                     <div class="box_one elementItem">CH4</div>
-                    <div class="box_one elementItem">Offags</div>
+                    <div class="box_one elementItem">Offgas</div>
                     <div class="box_one elementItem">LPG</div>
                     <div class="box_one elementItem">C3H6</div>
                     <div class="box_one elementItem">C4</div>
@@ -333,7 +333,7 @@
 
                 </div>
 
-                <div class="elementBox elementBoxLoc5"> 
+                <div class="elementBox elementBoxLoc5">
 
                   <img src="@/assets/img/arror15.png" class="arror24">
 
@@ -342,7 +342,7 @@
                   <img src="@/assets/img/arror17.png" class="arror26">
 
                 </div>
-                
+
             </div>
           </div>
 
@@ -691,7 +691,7 @@
 }
 
 #materialBalance .layout .layout_left img.arrorDown1{
- 
+
   margin-top: 0;
   width: 18px;
   height: 64px;
@@ -700,7 +700,7 @@
 }
 
 #materialBalance .layout .layout_left img.arrorDown2{
- 
+
   margin-top: 0;
   width: 18px;
   height: 48px;
@@ -711,21 +711,21 @@
   position: absolute;
   top: 380px;
   left: 250px;
- 
+
 }
 
 #materialBalance .layout .layout_left img.luzi2-img6{
   position: absolute;
   top: 150px;
   left: 470px;
- 
+
 }
 
 #materialBalance .layout .layout_left img.luzi2-img7{
   position: absolute;
   top: 380px;
   left: 470px;
- 
+
 }
 
 #materialBalance .layout .layout_left img.arror5{
@@ -739,7 +739,7 @@
   position: absolute;
   top: 620px;
   left: -90px;
- 
+
 }
 
 #materialBalance .layout .layout_left img.arror6{
@@ -1007,7 +1007,7 @@
     left: -50px;
     font-size: 12px;
     color: rgb(32, 99, 255);
-    
+
 }
 
 .elementBox{
@@ -1019,20 +1019,20 @@
 }
 .elementBox.elementBoxLoc2{
   top: 470px;
-  left: 250px; 
+  left: 250px;
 }
 .elementBox.elementBoxLoc3{
   top: 14px;
-  left: 820px; 
+  left: 820px;
 }
 .elementBox.elementBoxLoc4{
   top: 14px;
-  left: 1030px; 
+  left: 1030px;
 }
 
 .elementBox.elementBoxLoc5{
   top: 14px;
-  left: 1020px; 
+  left: 1020px;
 }
 
 .elementBox .elementItem span{
@@ -1157,159 +1157,159 @@
   margin-bottom: 20px;
 }
 
-@keyframes move { 
+@keyframes move {
 	  0% {left: -50%;	 opacity: 0; }
 	  60% { left: 10%; opacity: 1 }
 	  100% {left: 50%;opacity: 0;}
-	}		 
+	}
 	.move{
     -webkit-animation-name:move;
     animation-name:move;
     position:relative;
   }
 
-@keyframes move2 { 
+@keyframes move2 {
 	  0% { opacity: 0; }
     25% { opacity: 0.5;}
 	  50% { opacity: 1 }
     75% { opacity: 0.5 }
 	  100% {opacity: 0;}
-	}		 
+	}
 	.move2{
     -webkit-animation-name:move2;
     animation-name:move2;
   }
 
 
-@keyframes move3 { 
+@keyframes move3 {
 	  0% {left: 530px;	 opacity: 0; }
 	  50% { left: 550px; opacity: 1 }
 	  100% {left: 570px;opacity: 0;}
-	}		 
+	}
 	.move3{
     -webkit-animation-name:move3;
     animation-name:move3;
   }
 
 
-  @keyframes move4 { 
+  @keyframes move4 {
 	  0% {top: 360px;	 opacity: 0; }
 	  50% { top: 370px; opacity: 1 }
 	  100% {top: 380px;opacity: 0;}
-	}		 
+	}
 	.move4{
     -webkit-animation-name:move4;
     animation-name:move4;
   }
 
 
-  @keyframes move5 { 
+  @keyframes move5 {
 	  0% {top: 130px;	 opacity: 0; }
 	  50% { top: 140px; opacity: 1 }
 	  100% {top: 150px;opacity: 0;}
-	}		 
+	}
 	.move5{
     -webkit-animation-name:move5;
     animation-name:move5;
   }
 
 
-  @keyframes move6 { 
+  @keyframes move6 {
 	  0% {top: 360px;	 opacity: 0; }
 	  50% { top: 370px; opacity: 1 }
 	  100% {top: 380px;opacity: 0;}
-	}		 
+	}
 
 	.move6{
     -webkit-animation-name:move6;
     animation-name:move6;
   }
 
-  @keyframes move7 { 
+  @keyframes move7 {
 	  0% {left: -110px;	 opacity: 0; }
 	  50% { left: -100px; opacity: 1 }
 	  100% {left: -90px;opacity: 0;}
-	}		 
-  
+	}
+
 	.move7{
     -webkit-animation-name:move7;
     animation-name:move7;
   }
 
-@keyframes move8 { 
+@keyframes move8 {
 	  0% {top: 200px;	 opacity: 0; }
     25% { top: 170px; opacity: .3; }
 	  50% { top: 140px; opacity: .5; }
     75% { top: 110px; opacity: .7; }
 	  100% {top: 55px;opacity: 1;}
-	}		 
-  
+	}
+
 	.move8{
     -webkit-animation-name:move8;
     animation-name:move8;
   }
 
-  @keyframes move9 { 
+  @keyframes move9 {
 	  0% {left: 390px;	 opacity: 0; }
     75% { left: -170px;top: 444px; opacity: .7; transform: rotate(-180deg);}
 	  100% {left: -170px;top:490px; opacity: 1;transform: rotate(-180deg);}
-	}		 
-  
+	}
+
 	.move9{
     -webkit-animation-name:move9;
     animation-name:move9;
   }
 
-  @keyframes move10 { 
+  @keyframes move10 {
 	  0% {left: 520px;	top:465px; opacity: 0; }
     25% {left: 556px; top: 465px;	 opacity: .3; transform: rotate(0deg);}
     50% { left: 556px;top: 398px; opacity: .7; transform: rotate(90deg);}
 	  100% {left: 768px;top:398px; opacity: 1;transform: rotate(90deg);}
-	}		 
-  
+	}
+
 	.move10{
     -webkit-animation-name:move10;
     animation-name:move10;
   }
 
-@keyframes move11 { 
+@keyframes move11 {
 	  0% {top: 498px;left: 130px;	 opacity: 0; }
 	  100% {left: 215px; opacity: 1;}
-	}		 
-  
+	}
+
 	.move11{
     -webkit-animation-name:move11;
     animation-name:move11;
   }
 
 
-@keyframes move12 { 
+@keyframes move12 {
 	  0% {top: 550px;left: 130px;	 opacity: 0; }
 	  100% {left: 215px; opacity: 1;}
-	}		 
-  
+	}
+
 	.move12{
     -webkit-animation-name:move12;
     animation-name:move12;
   }
 
 
-@keyframes move13 { 
+@keyframes move13 {
 	  0% {top: 600px;left: 130px;	 opacity: 0; }
 	  100% {left: 215px; opacity: 1;}
-	}		 
-  
+	}
+
 	.move13{
     -webkit-animation-name:move13;
     animation-name:move13;
   }
 
 
-@keyframes move14 { 
+@keyframes move14 {
 	  0% {top: 650px;left: 130px;	 opacity: 0; }
 	  100% {left: 215px; opacity: 1;}
-	}		 
-  
+	}
+
 	.move14{
     -webkit-animation-name:move14;
     animation-name:move14;
@@ -1318,33 +1318,33 @@
 
 
 
-@keyframes move15 { 
+@keyframes move15 {
 	  0% {top: 596px;left: 346px;	 opacity: 0; }
 	  100% {left: 570px; opacity: 1;}
-	}		 
-  
+	}
+
 	.move15{
     -webkit-animation-name:move15;
     animation-name:move15;
   }
-@keyframes move16 { 
+@keyframes move16 {
 	  0% {left: -90px;	 opacity: 0; }
 	  100% {left: -50px; opacity: 1;}
-	}		 
-  
+	}
+
 	.move16{
     -webkit-animation-name:move16;
     animation-name:move16;
   }
 
-  @keyframes move17 { 
+  @keyframes move17 {
 	  0% {top:150px;left:-150px;transform: rotate(-180deg); opacity: 0;}
     25%{top:175px;left:-150px;transform: rotate(-270deg);}
     50%{top:175px;left:-105px;transform: rotate(-180deg);}
     75%{top:200px;left:-105px;transform: rotate(-270deg);}
 	  100% {top:200px;left:-40px;transform: rotate(-270deg);opacity: 1;}
-	}		 
-  
+	}
+
 	.move17{
     -webkit-animation-name:move17;
     animation-name:move17;