Explorar el Código

焦煤大屏修改

zhbyyy hace 1 año
padre
commit
a4fb438552

+ 18 - 5
cokingCoal/cokingCoalC.html

@@ -21,7 +21,10 @@
 <body>
   <div id="app">
     <dv-full-screen-container>
-      <header class="my-header"><span>焦煤集团驾驶舱数字看板</span></header>
+      <header class="my-header relative">
+        <span>焦煤集团驾驶舱数字看板</span>
+        <span class="right">2023-1-16 10:23:00</span>
+      </header>
       <div class="main">
         <div class="top flex justify-between">
           <div class="flex items-center justify-center">
@@ -143,19 +146,29 @@
         <div class="bottom flex justify-between">
           <dv-border-box-8 class="bottom-item">
             <div class="center-title mx-auto flex flex-col justify-center">
-              <div class="flex items-center items-center">
-                <img src="./images/arrow.png" alt="" class="arrow">
-                <span>入池、出池人数</span>
+              <div class="flex items-center justify-between">
+                <div class="flex items-center">
+                  <img src="./images/arrow.png" alt="" class="arrow">
+                  <span>入池、出池人数</span>
+                </div>
+                <div class="calendar flex items-center ">
+                  <span>2023-01</span>
+                  <img src="./images/down.png" style="width:10px;height:7px;margin-left: 5px;" alt="" class="arrow">
+                </div>
               </div>
               <img src="./images/line.png" style="width: 100%;display: block;margin-top: 2px;" alt="">
             </div>
             <div class="aiQuality dis-flex flex-dir-column ">
               <div id="aiQuality" class="mx-auto" style="width: 100%; height: 100%"></div>
             </div>
+            <div class="top-title absolute">
+              <div class="">入池人数<span style="color: #45DAD1;font-weight: bold;margin: 0 10px;">1000</span></div>
+              <div class="">出池人数<span style="color: #45DAD1;font-weight: bold;margin: 0 10px;">1800</span></div>
+            </div>
           </dv-border-box-8>
           <dv-border-box-8 class="bottom-item">
             <div class="center-title mx-auto flex flex-col justify-center">
-              <div class="flex items-center items-center">
+              <div class="flex items-center">
                 <img src="./images/arrow.png" alt="" class="arrow">
                 <span>待岗池</span>
               </div>

+ 5 - 2
cokingCoal/cokingCoalD.html

@@ -21,7 +21,10 @@
 <body>
   <div id="app">
     <dv-full-screen-container>
-      <header class="my-header"><span>焦煤集团驾驶舱数字看板</span></header>
+      <header class="my-header relative">
+        <span>焦煤集团驾驶舱数字看板</span>
+        <span class="right">2023-1-16 10:23:00</span>
+      </header>
       <div class="main">
         <dv-border-box-8 class="center-item relative">
           <div class="center-title mx-auto flex flex-col justify-center">
@@ -59,7 +62,7 @@
             <img src="./images/line.png" style="width: 100%;display: block;margin-top: 2px;" alt="">
           </div>
           <div class="center1-footer flex justify-center items-end  mx-auto">
-            <dv-scroll-board :config="config5" style="width: 100%; height: 80%" />
+            <dv-scroll-board :config="config5" style="width: 100%; height: 90%" />
           </div>
           <div class="top-title1 absolute">集团公司增幅<span
               style="color: #45DAD1;font-weight: bold;margin: 0 10px;">63%</span></div>

+ 4 - 1
cokingCoal/cokingCoalE.html

@@ -21,7 +21,10 @@
 <body>
   <div id="app">
     <dv-full-screen-container>
-      <header class="my-header"><span>焦煤集团驾驶舱数字看板</span></header>
+      <header class="my-header relative">
+        <span>焦煤集团驾驶舱数字看板</span>
+        <span class="right">2023-1-16 10:23:00</span>
+      </header>
       <div class="main">
         <div class="top flex">
           <dv-border-box-8 class="top-left">

+ 0 - 0
cokingCoal/images/下拉框.png → cokingCoal/images/down-back.png


+ 0 - 0
cokingCoal/images/下拉按钮.png → cokingCoal/images/down.png


+ 8 - 0
cokingCoal/js/cokingCoalD.js

@@ -80,6 +80,10 @@ let app = new Vue({
           },
         },
         yAxis: {
+          name: "单位吨:工",
+          nameTextStyle: {//y轴上方单位的颜色
+            color: '#fff',
+          },
           axisTick: {
             lineStyle: {
               color: "#18416F",
@@ -194,6 +198,10 @@ let app = new Vue({
           },
         },
         yAxis: {
+          name: "单位吨:人",
+          nameTextStyle: {//y轴上方单位的颜色
+            color: '#fff'
+          },
           axisTick: {
             lineStyle: {
               color: "#18416F",

+ 4 - 0
cokingCoal/js/cokingCoalE.js

@@ -94,6 +94,10 @@ let app = new Vue({
         ],
       }
       myChart.setOption(option)
+      tools.loopShowTooltip(myChart, option, {
+        nterval: 2000,
+        loopSeries: true,
+      });
     },
     aiQualityECharts2 () {
       let chart = echarts.init(document.getElementById("aiQuality2"));

La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
cokingCoal/libs/datav.min.js


+ 27 - 0
cokingCoal/styles/cokingCoalC.css

@@ -287,6 +287,33 @@ a {
 .list > .list-item:nth-child(3) .el-progress-bar__inner {
   background: linear-gradient(to right, #0a2a54, #3fc9c1);
 }
+.my-header span.right {
+  position: absolute;
+  right: 100px;
+  bottom: 10px;
+  font-size: 14px;
+}
+.top-title {
+  display: flex;
+  align-items: center;
+  height: 50px;
+  line-height: 50px;
+  left: 15%;
+  top: 17%;
+}
+.top-title div {
+  background: url('../images/title.png') no-repeat;
+  padding-left: 50px;
+  background-size: 100% 100%;
+  width: 270px;
+}
+.calendar {
+  padding: 0 10px;
+  height: 100%;
+  background: url('../images/down-back.png') no-repeat;
+  background-size: 100% 100%;
+  cursor: pointer;
+}
 /* zhb */
 /* 宽高纵横比 */
 .aspect-auto {

+ 6 - 0
cokingCoal/styles/cokingCoalD.css

@@ -226,6 +226,12 @@ a {
   background-size: 100% 100%;
   padding-left: 50px;
 }
+.my-header span.right {
+  position: absolute;
+  right: 100px;
+  bottom: 10px;
+  font-size: 14px;
+}
 /* zhb */
 /* 宽高纵横比 */
 .aspect-auto {

+ 6 - 0
cokingCoal/styles/cokingCoalE.css

@@ -258,6 +258,12 @@ item-tr {
   background-size: 100% 100%;
   padding-left: 50px;
 }
+.my-header span.right {
+  position: absolute;
+  right: 100px;
+  bottom: 10px;
+  font-size: 14px;
+}
 /* zhb */
 /* 宽高纵横比 */
 .aspect-auto {

Algunos archivos no se mostraron porque demasiados archivos cambiaron en este cambio