焦煤大屏2版

cokingCoal/cokingCoalC.html

@@ -176,22 +176,22 @@
             </div>
             <div class="center4-footer flex items-center justify-around mx-auto">
               <div>
-                <div style="background: url('./images/bottom-right1.png') no-repeat center bottom;color:#6682F5;">2800
+                <div style="background: url('./images/bottom-right1.gif') no-repeat center bottom;color:#6682F5;">2800
                 </div>
                 <span>终止合同人员</span>
               </div>
               <div>
-                <div style="background: url('./images/bottom-right2.png') no-repeat center bottom;color:#40A9FF;">1308
+                <div style="background: url('./images/bottom-right2.gif') no-repeat center bottom;color:#40A9FF;">1308
                 </div>
                 <span>双创人员</span>
               </div>
               <div>
-                <div style="background: url('./images/bottom-right3.png') no-repeat center bottom;color:#45DAD1;">1600
+                <div style="background: url('./images/bottom-right3.gif') no-repeat center bottom;color:#45DAD1;">1600
                 </div>
                 <span>待岗闲置人员</span>
               </div>
               <div>
-                <div style="background: url('./images/bottom-right4.png') no-repeat center bottom;color:#B889EA;">1220
+                <div style="background: url('./images/bottom-right4.gif') no-repeat center bottom;color:#B889EA;">1220
                 </div>
                 <span>解除合同人员</span>
               </div>

cokingCoal/cokingCoalE.html

@@ -93,7 +93,7 @@
                   <div>实际参训人数<span class="text-style" style="color: #43EDE3;">128</span>人</div>
                 </div>
               </div>
-              <dv-water-level-pond :config="config" style="width:150px;height:200px" />
+              <dv-water-level-pond :config="config" style="width:160px;height:160px" />
             </div>
           </dv-border-box-8>
 

cokingCoal/styles/cokingCoalC.css

@@ -314,6 +314,30 @@ a {
   background-size: 100% 100%;
   cursor: pointer;
 }
+.el-progress-bar__outer {
+  background-color: #102f53;
+  overflow: visible;
+}
+
+.el-progress-bar__inner:after {
+  content: '';
+  background-size: 100% 100%;
+  width: 40px;
+  height: 40px;
+  bottom: -12px;
+  right: -15px;
+  position: absolute;
+  z-index: 999 !important;
+}
+ul > .list-item:nth-child(1) .el-progress-bar__inner:after {
+  background: url('../images/blue.png') no-repeat;
+}
+ul > .list-item:nth-child(2) .el-progress-bar__inner:after {
+  background: url('../images/green.png') no-repeat;
+}
+ul > .list-item:nth-child(3) .el-progress-bar__inner:after {
+  background: url('../images/purple.png') no-repeat;
+}
 /* zhb */
 /* 宽高纵横比 */
 .aspect-auto {

cokingCoal/styles/cokingCoalD.css

@@ -147,8 +147,37 @@ a {
 .header-item {
   color: #69c0ff;
 }
-.row-item > .ceil:nth-child(2) {
-  color: rgb(180, 197, 29) !important;
+.row-item .ceil:nth-child(2) {
+  width: 100px !important;
+  margin-left: 80px;
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+.red {
+  color: #ed3248;
+}
+.red:after {
+  background: url('../images/up.png') no-repeat;
+}
+.green {
+  color: #39f6b2;
+}
+.green:after {
+  background: url('../images/down2.png') no-repeat;
+}
+.row-item .ceil:nth-child(2):after {
+  content: '';
+  background-size: 100% 100%;
+  width: 15px;
+  height: 15px;
+  top: 16px;
+  left: 10px;
+  position: relative;
+  display: inline-block;
+}
+.el-progress-bar__outer {
+  background-color: #102f53;
+  overflow: visible;
 }
 .list {
   list-style-type: none;
@@ -157,13 +186,6 @@ a {
   width: 100%;
   padding: 0 5%;
 }
-/* .center1-footer > .list span {
-  font-size: 20px;
-  color: #69c0ff;
-  font-style: italic;
-  font-weight: bold;
-  margin: 0 10px;
-} */
 .list {
   height: 80%;
 }
@@ -175,19 +197,24 @@ a {
   font-size: 20px;
   margin-right: 10px;
 }
-.list > .list-item:nth-child(1) .el-progress-bar__inner {
+.list > .list-item:nth-child(1) .el-progress-bar__inner,
+.list .list-item:first-child .serial {
   background: linear-gradient(to right, #092854, #40a8fe);
 }
-.list > .list-item:nth-child(2) .el-progress-bar__inner {
+.list > .list-item:nth-child(2) .el-progress-bar__inner,
+.list .list-item:nth-child(2) .serial {
   background: linear-gradient(to right, #0b2855, #5d78e3);
 }
-.list > .list-item:nth-child(3) .el-progress-bar__inner {
+.list > .list-item:nth-child(3) .el-progress-bar__inner,
+.list .list-item:nth-child(3) .serial {
   background: linear-gradient(to right, #0a2a54, #3fc9c1);
 }
-.list > .list-item:nth-child(4) .el-progress-bar__inner {
+.list > .list-item:nth-child(4) .el-progress-bar__inner,
+.list .list-item:nth-child(4) .serial {
   background: linear-gradient(to right, #0a2a54, #ca8317);
 }
-.list > .list-item:nth-child(5) .el-progress-bar__inner {
+.list > .list-item:nth-child(5) .el-progress-bar__inner,
+.list .list-item:nth-child(5) .serial {
   background: linear-gradient(to right, #0a2a54, #9c1765);
 }
 .el-progress {
@@ -198,7 +225,8 @@ a {
   height: 40px;
   line-height: 40px;
   background-color: #163a5d;
-  color: #69c0ff;
+  /* color: #69c0ff; */
+  color: #fff;
   font-style: italic;
   font-weight: bold;
   text-align: center;

cokingCoal/styles/cokingCoalE.css

@@ -192,6 +192,16 @@ item-tr {
   font-size: 16px;
   width: 140px;
   margin-bottom: 30px;
+  filter: brightness(0.7);
+  animation: fadenum 2s infinite linear;
+}
+@keyframes fadenum {
+  50% {
+    filter: brightness(1.3);
+  }
+  100% {
+    filter: brightness(0.7);
+  }
 }
 .item-tl-item > div:last-child {
   width: 100%;