添加了部分页面的随机数据生成

src/components/tunneling/worklog.vue

@@ -1,60 +1,93 @@
+
 <template>
-<div>
- <ul class="xcspwt-box js-xcspwt">
-	 <span style="font-size: 26px;
-							color: #FFFFFF;
-							
-							padding-top: 6%;">日志信息</span>
-                        <li>
-                            <span>掘进机控制系统</span>
-                            <span >启动中...</span>
-                            <!-- <span title="视频信号不稳定">视频信号不稳定</span> -->
-                        </li>
-                        <li>
-                            <span>油缸温度</span>
-                            <span>温度过高...</span>
-                        </li>
-                        <li>
-                            <span>粉尘浓度</span>
-                            <span>超出正常范围...</span>
-                        </li>
- </ul></div>
-</template>
 
+  <div class="table-wrapper main">
+    <span class="title">日志信息</span>
+    <el-table :data="tableData"  max-height="260" >
+      <el-table-column prop="name" label="时间" width="240"> </el-table-column>
+      <el-table-column prop="problem" label="记录" width="280">
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
 <script>
   export default {
-
+  data() {
+    return {
+      tableData: [
+        {
+          name: "掘进机控制系统",
+          problem: "启动中.....",
+        }
+      ],
+    };
+  },
+    mounted() {
+    let interval = setInterval(() => {
+      let temp = {
+        name: Math.random() > 0.5 ? "采煤刀磨损" : "电铃温度",
+        problem:
+          Math.random() > 0.5 ? "正常" : "异常",
+      };
+      this.tableData.unshift(temp);
+      console.log(this.tableData);
+    }, 3000);
+    this.$once("hook:beforeDestroy", () => {
+      clearInterval(interval);
+    });
+  },
   }
 </script>
-<style scoped>
-.xcspwt-box{
-    padding-top: 15px;
-}
-.xcspwt-box li{
-    width: 100%;
-    height: 20px;
-    line-height: 20px;
-    color:#4ADEFE;
-    font-size: 18px;
-    margin-top: 14px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    cursor:default;
-}
-.xcspwt-box li span{
-    display: block;
-    float: left;
-}
-.xcspwt-box li span:nth-of-type(1){
-    padding: 0 5px;
-    line-height: 20px;
-    text-align: center;
-    background-size: 100% 100%;
+<style lang="scss" scoped>
+.table-wrapper {
+  height: 80%;
+  // margin-top: 10px;
+  ::v-deep .el-table--enable-row-hover .el-table__body tr:hover > td {
+    background-color: rgba(9, 12, 14, 0.2);
+    color: #fff;
+  }
+} /* 删除表格下横线 */
+.table-wrapper ::v-deep .el-table::before {
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  height: 0px;
+  border: none;
+}
+.table-wrapper ::v-deep .el-table,
+.el-table__expanded-cell {
+  background-color: transparent;
+  border: none;
+}
+.table-wrapper ::v-deep .el-table tr {
+  background-color: transparent !important;
+  border: none;
+}
+.table-wrapper ::v-deep .el-table th {
+  background-color: transparent !important;
+  border: none;
+  color: #4adefe;
+  font-size: 16px;
+}
+.table-wrapper ::v-deep .el-table td,
+.el-table th.is-leaf {
+  background-color: transparent !important;
+  color: #f3db5c;
+  font-size: 15px;
+  border: none;
+}
+.title {
+  margin-left: 80px;
+  font-size: 23px;
+  color: #4adefe;
 }
 
-.xcspwt-box li span:nth-of-type(2){
-    color:#F3DB5C;
-    width: 138px;
+.table-wrapper ::v-deep .el-table__body-wrapper::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+.table-wrapper ::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
+  // color: #4adefe;
+  // background-color: #f3db5c;
 }
 </style>

src/views/mining/machines/index.vue

@@ -224,7 +224,23 @@ computed: {
 //     this.initWebSocket(data1, "data1");
 // let data2 = new WebSocket(`ws://${this.websocketIP}/hbase/ws/belt/8`);
 //     this.initWebSocket(data2, "data2");
-
+   let interval = setInterval(() => {
+     for(let i=0;i<3;i++){
+     this.data[i].transporter_speed = this.getRandomNum(10, 100);
+      this.data[i].transporter_power = this.getRandomNum(90, 1000);
+       this.data[i].transporter_reducerOilTemperature = this.getRandomNum(70, 140);
+        this.data[i].transporter_current=this.getRandomNum(2,10);
+         this.data[i].transporter_motorTemperature=this.getRandomNum(2,10);
+          this.data[i].transporter_pressure=this.getRandomNum(100,1100);
+           this.data[i].transporter_voltage=this.getRandomNum(1,3000);
+           this.data[i].transporter_reducerShaftTemperature=this.getRandomNum(2,10000);
+            this.data[i].transporter_waterTemperature=this.getRandomNum(2,100);
+     }
+ 
+    }, 3000);
+    this.$once("hook:beforeDestroy", () => {
+      clearInterval(interval);
+    });
   },
   methods: {
     getData0(data) {

src/views/tunnelling/zutai.vue

@@ -1,5 +1,9 @@
 <template>
   <div class="main1">
+      
+     <el-row style="margin-top: 0px">
+    <headline title="掘进系统图"></headline>
+    </el-row>
     <div class="datas">
       <div class="data_left">
         <div class="left_top">
@@ -130,6 +134,7 @@ import rtop from "@/components/tunneling/rtop.vue";
 import worklog from "../../components/tunneling/worklog.vue";
 import rtone from "@/components/tunneling/rtone.vue";
 import lmid from "@/components/tunneling/lmid.vue";
+import headline from "@/common/headline"
 import lbottom from "@/components/tunneling/lbottom.vue";
 export default {
   name: "personnelPositioning",
@@ -150,6 +155,7 @@ export default {
     worklog,
     lmid,
     lbottom,
+    headline
   },
 };
 </script>
@@ -158,7 +164,7 @@ export default {
 .main1 {
   position: relative;
   width: 100%;
-  height: 850px;
+  height: 900px;
   background-image: linear-gradient(
     to right,
     rgb(6, 19, 60) 0%,

src/views/ventilate/dataBoard/runningMsg.vue

@@ -4,6 +4,7 @@
     <el-table
       :data="tableData"
       style="width: 100%"
+      max-height="160px"
     >
       <el-table-column
         prop="name"
@@ -36,15 +37,29 @@ export default {
         },
       ],
     };
+  },
+     mounted() {
+    let interval = setInterval(() => {
+      let temp = {
+        name: Math.random() > 0.5 ? "2#风机" : "3#风机",
+        problem:
+          Math.random() > 0.5 ? "开启" : "关闭",
+      };
+      this.tableData.unshift(temp);
+      console.log(this.tableData);
+    }, 3000);
+    this.$once("hook:beforeDestroy", () => {
+      clearInterval(interval);
+    });
   },
 };
 </script>
 <style lang='scss' scoped>
 .table-wrapper {
-  padding-top: 20px;
-  margin-left: 110px;
+  // padding-top: 20px;
+  // margin-left: 110px;
   height: 80%;
-  margin-top: 10px;
+ 
   ::v-deep .el-table--enable-row-hover .el-table__body tr:hover > td {
     background-color: rgba(9, 12, 14, 0.2);
     color: #fff;