采煤 支架 安全监控

config/index.js

@@ -1,21 +0,0 @@
-// let proxyObj = {};
-
-
-// proxyObj['/'] = {
-//     ws: false,
-//     // target: ' http://192.168.1.124:8081',
-//     target: ' http://localhost:8085',
-//     // target: 'http://192.168.1.103:8081',
-//     changeOrigin: true,
-//     pathRewrite: {
-//         '^/': ''
-//     }
-// };
-// /*这部分将请求转发到后端，前端端口是8081，后端端口是8085*/
-// module.exports = {
-//     devServer: {
-//         host: 'localhost',
-//         port: 8080,
-//         proxy: proxyObj
-//     }
-// }

package.json

@@ -36,6 +36,8 @@
   "devDependencies": {
     "@vue/cli-plugin-babel": "^3.0.4",
     "@vue/cli-service": "^3.0.4",
+    "jsdoc": "^3.6.10",
+    "jsdoc-vuejs": "^4.0.0",
     "less": "^4.1.2",
     "node-sass": "^7.0.1",
     "sass": "^1.25.0",

src/components/monitor/rightTable.vue

@@ -1,7 +1,7 @@
 <template>
   <!-- 采煤工作面设备 的 故障记录 -->
   <div class="table-wrapper main">
-    <span class="title">区域隐患</span>
+    <h1 class="top_title">区域隐患</h1>
     <el-table :data="tableData" max-height="420">
       <el-table-column prop="name" label="隐患名称" width="80">
       </el-table-column>
@@ -93,7 +93,7 @@ export default {
   // border:3px solid #96c2f1;
   height: 400px;
   // margin-top: -20px;
-  padding-left: 40px;
+  padding-left: 10px;
   background: url(../../assets/img/tunneling/dataBg.png) no-repeat;
   background-size: 100%;
 }
@@ -148,4 +148,13 @@ export default {
   width: 6px;
   height: 6px;
 }
+.top_title {
+  border-bottom: #5ddcf8 1px solid;
+  height: 40px;
+  font-size: 18px;
+  line-height: 2;
+  padding: 5px;
+  font-weight: 500;
+  color: #4adefe;
+}
 </style>

src/router/index.js

@@ -662,14 +662,14 @@ const router = new Router({
     },
   ],
 });
-router.beforeEach((to, from, next) => {
-    let token = Vue.cookie.get('token')
-    if (!token || !/\S/.test(token)) {
-    //   clearLoginInfo()
-      // next({ name: 'login' })
-        window.location.href = "http://112.126.68.148/#/"
-    }else{
-        next()
-    }
-  })
+// router.beforeEach((to, from, next) => {
+//     let token = Vue.cookie.get('token')
+//     if (!token || !/\S/.test(token)) {
+//     //   clearLoginInfo()
+//       // next({ name: 'login' })
+//         window.location.href = "http://112.126.68.148/#/"
+//     }else{
+//         next()
+//     }
+//   })
 export default router;

src/views/gas/configImg/Chart.vue

@@ -24,6 +24,10 @@
 </template>
 
 <script>
+/**
+ * 浓度或流量曲线
+ * @module Chart
+ */
 import { mapState } from "vuex";
 
 export default {
@@ -236,6 +240,10 @@ export default {
     ...mapState(["websocketIP"]),
   },
   methods: {
+    /**
+     * 选择浓度或流量，显示对应的数据
+     * @function selectChart
+     */
     selectChart() {
       for (let i in this.chartoptions) {
         if (this.chartoptions[i].id == this.currentChartId) {
@@ -271,6 +279,11 @@ export default {
       }
       console.log("gasId", this.type["name1"]);
     },
+    /**
+     * 将后端传来的数据存放在对应数组中
+     * @function addData
+     * @param {Array} data 后端传来的数据
+     */
     addData(data) {
       // 先扩展数组，然后删除多余元素
       console.log("data", data);
@@ -313,6 +326,10 @@ export default {
       // console.log("this.chouqidata", this.chouqidata);
       // console.log("this.xData", this.xData);
     },
+    /**
+     * @function 初始化WebSocket连接
+     * @function initWebSocket
+     */
     initWebSocket() {
       // 连接错误
       this.websocket.onerror = () => {

src/views/gas/configImg/bottomRight.vue

@@ -6,6 +6,10 @@
 </template>
 
 <script>
+/**
+ * 瓦斯泵电流
+ * @module bottomRight
+ */
 import { mapState } from "vuex";
 
 export default {
@@ -138,8 +142,19 @@ export default {
   computed: {
     ...mapState(["websocketIP"]),
   },
+  /**
+   * Props 接受父组件的传值
+   * @prop {String} id 子设备Id
+   * @prop {String} title 图表名称
+   * @prop {String} unit 图表纵坐标单位
+   */
   props: ["id", "title", "unit"],
   methods: {
+    /**
+     * 将后端传来的数据存放在对应数组中
+     * @function addData
+     * @param {Array} data 后端传来的数据
+     */
     addData(data) {
       // 先扩展数组，然后删除多余元素
       console.log("data", data);
@@ -179,6 +194,10 @@ export default {
       // console.log("this.chouqidata", this.chouqidata);
       // console.log("this.xData", this.xData);
     },
+    /**
+     * 初始化webWebSocket连接
+     * @function initWebSocket
+     */
     initWebSocket() {
       // 连接错误
       this.websocket.onerror = () => {

src/views/gas/configImg/center.vue

@@ -17,7 +17,10 @@
 </template>
 
 <script>
-
+/**
+ * 瓦斯泵参数显示
+ * @module center
+ */
 export default {
   data() {
     return {

src/views/gas/configImg/centerLeft1.vue

@@ -22,6 +22,10 @@
   </div>
 </template>
 <script>
+/**
+ * 瓦斯泵故障记录
+ * @module centerLeft1
+ */
 export default {
   data() {
     return {

src/views/gas/configImg/centerRight1.vue

@@ -11,6 +11,10 @@
 </template>
 
 <script>
+/**
+ * 瓦斯泵启停记录
+ * @module centerRight1
+ */
 export default {
   data() {
     return {

src/views/gas/configImg/dianliuChart.vue

@@ -6,6 +6,10 @@
 </template>
 
 <script>
+/**
+ * 电机电流曲线
+ * @module dianliuChart
+ */
 import { mapState } from "vuex";
 
 export default {
@@ -140,8 +144,19 @@ export default {
   computed: {
     ...mapState(["websocketIP"]),
   },
+  /**
+   * Props 接受父组件的传值
+   * @prop {String} id 子设备Id
+   * @prop {String} title 图表名称
+   * @prop {String} unit 图表纵坐标单位
+   */
   props: ["id", "title", "unit"],
   methods: {
+    /**
+     * 将后端传来的数据存放在对应数组中
+     * @function addData
+     * @param {Array} data 后端传来的数据
+     */
     addData(data) {
       console.log("data", data);
       if (this.count < 30) {
@@ -174,6 +189,10 @@ export default {
         ],
       });
     },
+    /**
+     * @function 初始化WebSocket连接
+     * @function initWebSocket
+     */
     initWebSocket() {
       // 连接错误
       this.websocket.onerror = () => {

src/views/gas/configImg/index.vue

@@ -30,6 +30,10 @@
 </template>
 
 <script>
+/**
+ * 瓦斯抽放泵的图表显示
+ * @module index
+ */
 import Chart from "./Chart";
 import centerLeft1 from "./centerLeft1";
 import dianliuChart from "./dianliuChart";
@@ -40,6 +44,14 @@ export default {
     return {};
   },
   methods: {},
+    /**
+   * Components 包含子组件
+   * @prop {Component} centerLeft1 瓦斯泵故障记录
+   * @prop {Component} Chart 浓度或流量曲线
+   * @prop {Component} dianliuChart 瓦斯泵电流
+   * @prop {Component} centerRight1 瓦斯泵启停记录
+   * @prop {Component} center 瓦斯泵参数说明
+   */
   components: {
     centerLeft1,
     Chart,

src/views/gas/configImg/main.vue

@@ -291,6 +291,10 @@
   </div>
 </template>
 <script>
+/**
+ * 瓦斯抽放系统图
+ * @module main
+ */
 import { mapState } from "vuex";
 import headline from "@/common/headline"
 export default {
@@ -421,16 +425,33 @@ export default {
     });
   },
   methods: {
+    /**
+     * 查看某个瓦斯泵的详细信息
+     * @function changeWebState
+     * @param {String} id 瓦斯泵Id
+     */
     changeWebState(id) {
       this.$router.push({
         path: `/gas/dataview/${id}`,
       });
     },
+    /**
+     * 获取电机的相关参数信息
+     * @function getMotorData
+     * @param {String} data 后端传来的数据
+     * @param {String} select 瓦斯泵Id
+     */
     getMotorData(data, select) {
       if (select == 1) {
         this.motor1 = data[0];
       }
     },
+    /**
+     * 获取泵的启停信息
+     * @function getPumpData
+     * @param {String} data 后端传来的数据
+     * @param {String} select 瓦斯泵Id
+     */
     getPumpData(data, select) {
       if (select == 1) {
         this.buttonstate[0]["isStart"] =
@@ -439,13 +460,30 @@ export default {
           data[0]["choufangbengbentiwendu_after"] || 0;
       }
     },
+    /**
+     * 获取阀门的开闭信息
+     * @function getValveData
+     * @param {String} data 后端传来的数据
+     */
     getValveData(data) {
       this.valvestate[7] = data[0]["jinqifakaibi_after"];
       this.valvestate[8] = data[0]["paiqifakaibi_after"];
     },
+    /**
+     * 获取管道相关数据
+     * @function getPipeData
+     * @param {String} data 后端传来的数据
+     */
     getPipeData(data) {
       this.pipe = data[0];
     },
+     /**
+     * 初始化WebSocket连接
+     * @function initWebSocket
+     * @param {String} data 后端传来的数据
+     * @param {String} type 瓦斯泵中各器件名称
+     * @param {String} select 瓦斯泵Id
+     */
     initWebSocket(websocket, type, select) {
       // 连接错误
       websocket.onerror = () => {

src/views/gas/gas.vue

@@ -7,11 +7,13 @@
       </el-tab-pane>
       <el-tab-pane label="系统数据" name="first">
         <systemData v-if="activeName == 'first'"></systemData>
-        </el-tab-pane>
+      </el-tab-pane>
       <el-tab-pane label="数据标准" name="second">
-        <dataStandard v-if="activeName == 'second'" :dataQualitySystemId=6></dataStandard>
+        <dataStandard
+          v-if="activeName == 'second'"
+          :dataQualitySystemId="6"
+        ></dataStandard>
       </el-tab-pane>
-      
     </el-tabs>
   </div>
 </template>
@@ -74,8 +76,8 @@ export default {
   mounted() {
     this.getSubsystemOption();
     this.$router.push({
-          path: "/gas/mainpage",
-        })
+      path: "/gas/mainpage",
+    });
     // this.currentsubSystem = this.options[0].subSystem;
     // this.currentSubSystemId = this.options[0].id;//将当前煤矿与id设置为下拉框第一个
     // this.initData();
@@ -160,7 +162,7 @@ export default {
       if (tab.name == "third") {
         this.$router.push({
           path: "/gas/mainpage",
-        })
+        });
         // this.$nextTick(() => {
         //   this.activeName = "first";
         // });
@@ -173,20 +175,13 @@ export default {
   },
   components: {
     dataStandard,
-    systemData
+    systemData,
   },
 };
 </script>
 
+// watchSubDevice(row) { // this.$router.push({ // path: '/gasSubDeviceList' //
+}) // window.sessionStorage.setItem("device_id", row.id);
+//存到sessionStorage中，下一个页面获取 // }
 
-            // watchSubDevice(row) {
-            //     this.$router.push({
-            //         path: '/gasSubDeviceList'
-            //     })
-            //     window.sessionStorage.setItem("device_id", row.id); //存到sessionStorage中，下一个页面获取
-            // }
- 
-
-
-<style scoped>
-</style>
+<style scoped></style>

src/views/mining/Monitor/CoalMining.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="coal-mining">
     <div class="value">
-      <span v-for="item in 50" :key="item"> {{ 51 - item }}# </span>
+      <span v-for="item in 38" :key="item"> {{ (39 - item )*5}}# </span>
     </div>
     <div class="content">
       <div class="car" :style="{ left: `${car}px` }">
@@ -47,6 +47,10 @@
 </template>
 
 <script>
+/**
+ * 小车监控组件
+ * @module CoalMining
+ */
 import { mapState } from "vuex";
 export default {
   data() {
@@ -89,6 +93,12 @@ export default {
     ...mapState(["websocketIP"]),
   },
   methods: {
+    /**
+     * 获取小车速度、左摇臂、右摇臂高度
+     * @function getData
+     * @param {String} data 后端传来的数据
+     * @param {String} type 所需数据类型
+     */
     getData(data, type) {
       switch (type) {
         case "leftArm":
@@ -102,6 +112,10 @@ export default {
           break;
       }
     },
+    /**
+     * 初始化webWebSocket连接
+     * @function initWebSocket
+     */
     initWebSocket(websocket, type) {
       // 连接错误
       websocket.onerror = () => {

src/views/mining/Monitor/Emulsion.vue

@@ -89,6 +89,10 @@
 </template>
 
 <script>
+/**
+ * 乳液自动化配比
+ * @module Emulsion
+ */
 import { mapState } from "vuex";
 export default {
   data() {
@@ -111,6 +115,12 @@ export default {
     ...mapState(["websocketIP"]),
   },
   methods: {
+    /**
+     * 获取乳液自动化配比相关数据
+     * @function getData
+     * @param {String} data 后端传来的数据
+     * @param {String} type 所需数据类型
+     */
     getData(data, type) {
       switch (type) {
         case "tank":
@@ -130,6 +140,10 @@ export default {
           break;
       }
     },
+    /**
+     * 初始化webWebSocket连接
+     * @function initWebSocket
+     */
     initWebSocket(websocket, type) {
       // 连接错误
       websocket.onerror = () => {

src/views/mining/Monitor/Index.vue

@@ -4,21 +4,30 @@
       <headline title="采煤工作面系统图"></headline>
     </el-row>
     <el-row :gutter="20">
-      <el-col :span="12">
+      <el-col :span="14">
         <div class="grid-content bg-purple">
           <bar></bar>
         </div>
       </el-col>
-      <el-col :span="12">
+      <el-col :span="10">
         <div class="grid-content bg-purple">
           <emulsion></emulsion>
         </div>
       </el-col>
     </el-row>
-    <el-row style="margin-top: 40px" :gutter="20">
-      <el-col :span="8"> <processStatistics></processStatistics></el-col>
-      <el-col :span="8"> <errorRecording></errorRecording></el-col>
-      <el-col :span="8"> <safetyStatistics></safetyStatistics></el-col>
+    <el-row
+      style="margin-top: 40px"
+      :gutter="20"
+    >
+      <el-col :span="8">
+        <processStatistics></processStatistics>
+      </el-col>
+      <el-col :span="8">
+        <errorRecording></errorRecording>
+      </el-col>
+      <el-col :span="8">
+        <safetyStatistics></safetyStatistics>
+      </el-col>
     </el-row>
     <el-row :gutter="10">
       <coal-mining></coal-mining>
@@ -27,14 +36,28 @@
 </template>
 
 <script>
-import Emulsion from "./Emulsion.vue"; 
+/**
+ * 采煤工作面系统图
+ * @module index
+ */
+import Emulsion from "./Emulsion.vue";
 import errorRecording from "../../../components/mining/monitor/error_recording";
 import processStatistics from "../../../components/mining/monitor/process_statistics";
 import safetyStatistics from "../../../components/mining/monitor/safety_statistics";
 import CoalMining from "./CoalMining.vue";
 import bar from "./echarts/Bars.vue";
-import headline from "@/common/headline"
+import headline from "@/common/headline";
 export default {
+  /**
+   * Components 包含子组件
+   * @prop {Component} Emulsion 乳液自动化配比
+   * @prop {Component} CoalMining 小车监控组件
+   * @prop {Component} bar 支架压力监控
+   * @prop {Component} errorRecording 故障记录
+   * @prop {Component} processStatistics 生产统计
+   * @prop {Component} safetyStatistics 安全统计
+   * @prop {Component} headline 标题组件
+   */
   components: {
     Emulsion,
     CoalMining,
@@ -42,7 +65,7 @@ export default {
     errorRecording,
     processStatistics,
     safetyStatistics,
-    headline
+    headline,
   },
   data() {
     return {};
@@ -55,11 +78,18 @@ export default {
   width: 100%;
   height: 900px;
   position: relative;
-  background-image: linear-gradient(
+  background: linear-gradient(to bottom, #323232 0%, #3f3f3f 40%, #1c1c1c 150%),
+    linear-gradient(
+      to top,
+      rgba(255, 255, 255, 0.4) 0%,
+      rgba(0, 0, 0, 0.25) 200%
+    );
+  background-blend-mode: multiply;
+  /* background-image: linear-gradient(
     to right,
     #06133c 0%,
     #011669 50%,
     #06133c 100%
-  );
+  ); */
 }
 </style>

src/views/mining/Monitor/echarts/Bars.vue

@@ -1,188 +1,210 @@
 <template>
   <!-- 支架压力柱状图 -->
-  <div id="bar" style="height: 300px; width: 600px; margin-top: 10px"></div>
+  <div
+    ref="bar"
+    style="height: 240px; width: 800px; margin-top: 30px;margin-left:40px"
+  ></div>
 </template>
 
 <script>
+/**
+ * 支架压力监控
+ * @module Bars
+ */
 export default {
   name: "Bars",
   data() {
     return {
       myChart: null,
-      option: {
-        title: {
-          text: "支架压力监控",
-          padding: [5, 230],
-          textStyle: {
-            fontWeight: "normal", //标题颜色
-            color: "#4ADEFE",
-          },
+      zhijiaId: [],
+      barData: [],
+    };
+  },
+  mounted() {
+    const option = {
+      title: {
+        text: "支架压力监控",
+        padding: [5, 230],
+        textStyle: {
+          fontWeight: "normal", //标题颜色
+          color: "#4ADEFE",
+        },
+      },
+      tooltip: {
+        trigger: "axis",
+        axisPointer: {
+          type: "shadow",
+        },
+        formatter: (params) => {
+          if (params[0].data > 64) {
+            return params[0].marker + "压力过高:" + params[0].data;
+          } else if (params[0].data < 24) {
+            return params[0].marker + "压力过低:" + params[0].data;
+          } else {
+            return params[0].marker + "压力正常:" + params[0].data;
+          }
+        },
+      },
+      color: ["#FF6666", "#99CC66", "#FFFF66"],
+      legend: {
+        orient: "vertical",
+        left: "right",
+        icon: "rect",
+        textStyle: {
+          color: "#fff",
         },
-        tooltip: {
-          trigger: "axis",
-          axisPointer: {
-            type: "shadow",
+        data: ["压力超限", "压力正常", "压力过低"],
+      },
+      grid: {
+        left: "3%",
+        right: "4%",
+        bottom: "3%",
+        containLabel: true,
+      },
+      xAxis: [
+        {
+          type: "category",
+          axisLabel: {
+            color: "#fff",
+            fontSize: 11,
           },
-          formatter: (params) => {
-            if (params[0].data > 64) {
-              return params[0].marker + "压力过高:" + params[0].data;
-            } else if (params[0].data < 24) {
-              return params[0].marker + "压力过低:" + params[0].data;
-            } else {
-              return params[0].marker + "压力正常:" + params[0].data;
-            }
+          axisLine: {
+            show: true,
           },
+          data: this.zhijiaId,
         },
-        color: ["#FF6666", "#99CC66", "#FFFF66"],
-        legend: {
-          orient: "vertical",
-          left: "right",
-          icon: "rect",
-          textStyle: {
+      ],
+      yAxis: [
+        {
+          type: "value",
+          axisLabel: {
             color: "#fff",
+            // fontSize: 11,
           },
-          data: ["压力超限", "压力正常", "压力过低"],
-        },
-        grid: {
-          left: "3%",
-          right: "4%",
-          bottom: "3%",
-          containLabel: true,
-        },
-        xAxis: [
-          {
-            type: "category",
-            axisLabel: {
+          splitLine: {
+            show: true,
+            lineStyle: {
+              type: "dotted",
               color: "#fff",
-              fontSize: 11,
-            },
-            axisLine: {
-              show: true,
             },
-            data: [
-              198, 190, 180, 170, 160, 150, 140, 130, 120, 110, 100, 90, 80, 70,
-              60, 50, 40, 30, 20, 10, 1,
-            ],
           },
-        ],
-        yAxis: [
-          {
-            type: "value",
-            axisLabel: {
-              color: "#fff",
-              fontSize: 11,
-            },
-            splitLine: {
-              show: true,
-              lineStyle: {
-                type: "dotted",
-                color: "#fff",
+        },
+      ],
+      series: [
+        {
+          name: "数据",
+          type: "bar",
+          itemStyle: {
+            normal: {
+              color: function (params) {
+                if (params.data > 64) {
+                  return "#FF6666";
+                } else if (params.data < 24) {
+                  return "#FFFF66";
+                } else {
+                  return "#99CC66";
+                }
               },
             },
           },
-        ],
-        series: [
-          {
-            name: "数据",
-            type: "bar",
-            itemStyle: {
-              normal: {
-                color: function (params) {
-                  if (params.data > 64) {
-                    return "#FF6666";
-                  } else if (params.data < 24) {
-                    return "#FFFF66";
-                  } else {
-                    return "#99CC66";
-                  }
-                },
-              },
-            },
-            barWidth: "10",
-            barCategoryGap: "5%",
+          // barWidth: "10",
+          barCategoryGap: "5%",
+          data: this.barData,
+        },
+        {
+          //这两组数据用来模拟markLine线段开关,data可以为空
+          name: "压力超限",
+          type: "line",
+          markLine: {
             data: [
-              99, 66, 76, 12, 79, 42, 15, 56, 13, 29, 20, 4, 22, 12, 38, 9, 31,
-              66, 90, 77, 14,
-            ],
-          },
-          {
-            //这两组数据用来模拟markLine线段开关,data可以为空
-            name: "压力超限",
-            type: "line",
-            markLine: {
-              data: [
-                {
-                  name: "压力超限",
-                  yAxis: "64",
-                  itemStyle: {
-                    normal: {
-                      show: true,
-                      color: "#FF6666",
-                    },
+              {
+                name: "压力超限",
+                yAxis: "64",
+                itemStyle: {
+                  normal: {
+                    show: true,
+                    color: "#FF6666",
                   },
                 },
-              ],
-            },
+              },
+            ],
           },
-          {
-            //这两组数据用来模拟markLine线段开关,data可以为空
-            name: "压力正常",
-            type: "line",
-            markLine: {
-              data: [
-                {
-                  name: "压力正常",
-                  yAxis: "24",
-                  itemStyle: {
-                    normal: {
-                      show: true,
-                      color: "#FFFF66",
-                    },
+        },
+        {
+          //这两组数据用来模拟markLine线段开关,data可以为空
+          name: "压力正常",
+          type: "line",
+          markLine: {
+            data: [
+              {
+                name: "压力正常",
+                yAxis: "24",
+                itemStyle: {
+                  normal: {
+                    show: true,
+                    color: "#FFFF66",
                   },
                 },
-              ],
-            },
-          },
-          {
-            name: "压力过低",
-            type: "line",
-            itemStyle: {
-              normal: {
-                color: "#FFFF66",
               },
+            ],
+          },
+        },
+        {
+          name: "压力过低",
+          type: "line",
+          itemStyle: {
+            normal: {
+              color: "#FFFF66",
             },
           },
-        ],
-      },
+        },
+      ],
     };
+
+    this.myChart = this.$echarts.init(this.$refs.bar);
+    // 获取数据
+    this.myChart.setOption(option);
+    this.timer = setInterval(() => {
+      this.getData();
+    }, 3000);
   },
-  mounted() {
-    console.log(this.$echarts);
-    this.myChart = this.$echarts.init(document.getElementById("bar"));
-    this.setBar();
-    let interval = setInterval(() => {
-      let chartData = [];
-      for (let i = 0; i < 21; i++) {
-        chartData.push(this.getRandomNum(0, 120));
-      }
+
+  methods: {
+    getData() {
+      var count = 0;
+
+      this.barData.shift(this.barData[0]);
+      this.barData.push(parseInt(Math.random() * (40 - 25 + 1) + 25, 10));
+
+      console.log(this.barData);
       this.myChart.setOption({
+        xAxis: [
+          {
+            data: this.zhijiaId,
+          },
+        ],
         series: [
           {
-            name: "数据",
-            data: chartData,
+            data: this.barData,
           },
         ],
       });
-    }, 3000);
-    this.$once("hook:beforeDestroy", () => {
-      clearInterval(interval);
-    });
-  },
-  methods: {
-    setBar() {
-      this.myChart.setOption(this.option);
     },
   },
+  created() {
+    // this.getData();
+    var index = 190;
+    for (var i = 0; i < 190; i++) {
+      this.zhijiaId.push(index--);
+      var data = parseInt(Math.random() * (40 - 25 + 1) + 25, 10);
+      this.barData.push(data);
+    }
+    console.log(this.zhijiaId);
+  },
+
+  destroyed() {
+    clearInterval(this.timer);
+  },
 };
 </script>
 

src/views/mining/envTest/externalFire.vue

@@ -4,6 +4,10 @@
 </template>
 
 <script>
+/**
+ * 外因火灾图表
+ * @module externalFire
+ */
 export default {
   name: "Bars",
   data() {

src/views/mining/envTest/index.vue

@@ -144,6 +144,10 @@
 </template>
 
 <script>
+/**
+ * 采煤工作面环境监测
+ * @module index
+ */
 import waterStorage from "@/views/mining/envTest/waterStorage";
 import waterLevel from "@/views/mining/envTest/waterLevel";
 import pieChart from "@/common/pieChart";
@@ -217,6 +221,16 @@ export default {
       clearInterval(interval);
     });
   },
+   /**
+   * Components 包含子组件
+   * @prop {Component} waterStorage 工作区蓄水图
+   * @prop {Component} waterLevel 工作区水害图
+   * @prop {Component} pieChart 饼状图
+   * @prop {Component} internalFire 内因火灾图表
+   * @prop {Component} externalFire 外因火灾图表
+   * @prop {Component} minePressure 支架压力图
+   * @prop {Component} headline 标题组件
+   */
   components: {
     waterStorage,
     waterLevel,

src/views/mining/envTest/internalFire.vue

@@ -4,6 +4,10 @@
 </template>
 
 <script>
+/**
+ * 内因火灾图表
+ * @module internalFire
+ */
 export default {
   name: "Bars",
   data() {

src/views/mining/envTest/minePressure.vue

@@ -4,6 +4,10 @@
 </template>
 
 <script>
+/**
+ * 瓦斯抽放系统图
+ * @module main
+ */
 export default {
   name: "Bars",
   data() {

src/views/mining/envTest/waterLevel.vue

@@ -4,6 +4,10 @@
 </template>
 
 <script>
+/**
+ * 工作区水害图
+ * @module waterLevel
+ */
 export default {
   name: "Bars",
   data() {

src/views/mining/envTest/waterStorage.vue

@@ -5,6 +5,10 @@
 </template>
 
 <script>
+/**
+ * 工作区蓄水图
+ * @module waterStorage
+ */
 export default {
   props: {
     title: {

src/views/mining/mining.vue

@@ -38,6 +38,7 @@ import systemData from "./systemData";
 import envTest from "./envTest";
 import Monitor from "./Monitor/Index.vue";
 import machines from "./machines";
+import headline from "@/common/headline"
 export default {
   name: "mining",
   data() {
@@ -57,6 +58,7 @@ export default {
     envTest,
     Monitor,
     machines,
+    headline
   },
 };
 </script>

src/views/mining/supporting/suppEchart.vue

@@ -6,6 +6,10 @@
 </template>
 
 <script>
+/**
+ * 顶板压力图
+ * @module suppEchart
+ */
 import { mapState } from "vuex";
 
 export default {
@@ -78,6 +82,10 @@ export default {
     ...mapState(["websocketIP"]),
   },
   methods: {
+    /**
+     * 获取各个支架顶板压力值
+     * @function getData
+     */
     getData() {
       var count = 0;
 

src/views/mining/supporting/supporting.vue

@@ -18,6 +18,10 @@
   </div>
 </template>
 <script>
+/**
+ * 采煤工作面支护系统
+ * @module supporting
+ */
 import suppEchart from "./suppEchart";
 import tuiyiEchart from "./tuiyiEchart";
 import headline from "@/common/headline"
@@ -121,6 +125,12 @@ export default {
     //     });
     // },
   },
+   /**
+   * Components 包含子组件
+   * @prop {Component} suppEchart 顶板压力图
+   * @prop {Component} tuiyiEchart 推移行程图
+   * @prop {Component} headline 标题组件
+   */
   components: {
     suppEchart,
     tuiyiEchart,

src/views/mining/supporting/tuiyiEchart.vue

@@ -6,6 +6,10 @@
 </template>
 
 <script>
+/**
+ * 推移行程图
+ * @module tuiyiEchart
+ */
 import { mapState } from "vuex";
 
 export default {
@@ -78,6 +82,10 @@ export default {
     ...mapState(["websocketIP"]),
   },
   methods: {
+    /**
+     * 获取各个支架推移行程值
+     * @function getData
+     */
     getData() {
       var count = 0;
 

src/views/monitor/configImg/safetyAssess.vue

@@ -1,6 +1,6 @@
 <template>
-  <div style="margin-left: -20px">
-    <span class="title">总体安全评价</span>
+  <div style="padding: 6px;">
+    <h1 class="top_title">总体安全评价</h1>
     <!-- <h2>总体安全评价</h2> -->
     <el-row style="margin-left:25px">
       <el-col :span="8"
@@ -29,6 +29,15 @@ export default {
 </script>
 
 <style scoped>
+.top_title {
+  border-bottom: #5ddcf8 1px solid;
+  height: 40px;
+  font-size: 18px;
+  line-height: 2;
+  padding: 5px;
+  font-weight: 500;
+  color: #4adefe;
+}
 .title {
   /* border-bottom: #5ddcf8 1px solid; */
   height: 40px;

src/views/tunnelling/tunnelling.vue

@@ -19,6 +19,10 @@
 </template>
 
 <script>
+/**
+ * 掘进系统tab标签
+ * @module tunnelling
+ */
 import zutai from "./zutai";
 import dataStandard from "./dataStandard/dataStandard";
 import systemData from "./systemData";
@@ -35,6 +39,12 @@ export default {
       console.log(tab, event);
     },
   },
+   /**
+   * Components 掘进tab标签包含子组件
+   * @prop {Component} dataStandard 数据标准
+   * @prop {Component} systemData 系统数据
+   * @prop {Component} zutai 系统图
+   */
   components: {
     dataStandard,
     systemData,

src/views/tunnelling/zutai.vue

@@ -119,6 +119,10 @@
 </template>
 
 <script>
+/**
+ * 掘进系统图
+ * @module zutai
+ */
 import ruler from "@/components/tunneling/ruler.vue";
 import hard from "@/components/tunneling/hard.vue";
 import dashBoard from "@/components/tunneling/dashBoard.vue";
@@ -138,6 +142,26 @@ import headline from "@/common/headline"
 import lbottom from "@/components/tunneling/lbottom.vue";
 export default {
   name: "personnelPositioning",
+  /**
+   * Components 掘进系统图包含子组件
+   * @prop {Component} ruler 行走轨迹
+   * @prop {Component} hard 割截轨迹
+   * @prop {Component} dashBoard 系统电压仪表盘
+   * @prop {Component} one 油泵电流仪表盘
+   * @prop {Component} two 截低电流仪表盘
+   * @prop {Component} three 截高电流仪表盘
+   * @prop {Component} four 二运电流仪表盘
+   * @prop {Component} five 风机电流仪表盘
+   * @prop {Component} tempChart 油缸温度组件
+   * @prop {Component} tempChart2 油位组件
+   * @prop {Component} mbl2 掘进机工作状态
+   * @prop {Component} rtop 瓦斯粉尘信息
+   * @prop {Component} rtone 日完成情况信息
+   * @prop {Component} worklog 日志信息
+   * @prop {Component} lmid 压入式风机信息
+   * @prop {Component} lbottom 除尘风机信息
+   * @prop {Component} headline 标题组件
+   */
   components: {
     ruler,
     hard,

vue.config.js

@@ -1,5 +1,5 @@
 module.exports = {
-    publicPath:"./",
+    // publicPath:"./",
     lintOnSave: false,
     devServer: {
         host: 'localhost',