namin 3 lat temu
rodzic
commit
ed7fa72fdd
1 zmienionych plików z 115 dodań i 37 usunięć
  1. 115 37
      src/views/mining/machines/index.vue

+ 115 - 37
src/views/mining/machines/index.vue

@@ -13,47 +13,47 @@
           <div class="details">
               <div>运行速度:
               <span>
-                 {{ data.transporter_speed }}m/s
+                 {{ data[0].transporter_speed }}m/s
               </span>
              </div>
             <div>电机功率:
               <span>
-                {{ data.transporter_power }}W
+                {{ data[0].transporter_power }}W
               </span>
             </div>
             <div>减速器油温:
               <span>
-                {{ data.transporter_reducerOilTemperature }}℃
+                {{ data[0].transporter_reducerOilTemperature }}℃
                 </span>
               </div>
             <div>电机电流:
               <span>
-                {{ data.transporter_current }}A
+                {{ data[0].transporter_current }}A
               </span>
             </div>
             <div>电机轴温:
               <span>
-                {{ data.transporter_motorTemperature }}℃
+                {{ data[0].transporter_motorTemperature }}℃
               </span>
             </div>
             <div>冷却水水压:
              <span>
-               {{ data.transporter_pressure }}Pa
+               {{ data[0].transporter_pressure }}Pa
               </span> 
               </div>
             <div>电机电压:
              <span>
-               {{ data.transporter_voltage }}V
+               {{ data[0].transporter_voltage }}V
              </span> 
               </div>
             <div>减速器轴温:
               <span>
-                {{ data.transporter_reducerShaftTemperature }}℃
+                {{ data[0].transporter_reducerShaftTemperature }}℃
               </span>
             </div>
             <div>冷却水水温:
               <span>
-                {{ data.transporter_waterTemperature }}℃
+                {{ data[0].transporter_waterTemperature }}℃
               </span>
            </div>
           </div>
@@ -64,49 +64,49 @@
         <div class="inf">
           <div style="height: 20%;font-size: 20px;color: #4adefe;">破碎机 运行状态</div>
           <div class="details">
-             <div>运行速度:
+           <div>运行速度:
               <span>
-                 {{ data.transporter_speed }}m/s
+                 {{ data[1].transporter_speed }}m/s
               </span>
              </div>
             <div>电机功率:
               <span>
-                {{ data.transporter_power }}W
+                {{ data[1].transporter_power }}W
               </span>
             </div>
             <div>减速器油温:
               <span>
-                {{ data.transporter_reducerOilTemperature }}℃
+                {{ data[1].transporter_reducerOilTemperature }}℃
                 </span>
               </div>
             <div>电机电流:
               <span>
-                {{ data.transporter_current }}A
+                {{ data[1].transporter_current }}A
               </span>
             </div>
             <div>电机轴温:
               <span>
-                {{ data.transporter_motorTemperature }}℃
+                {{ data[1].transporter_motorTemperature }}℃
               </span>
             </div>
             <div>冷却水水压:
              <span>
-               {{ data.transporter_pressure }}Pa
+               {{ data[1].transporter_pressure }}Pa
               </span> 
               </div>
             <div>电机电压:
              <span>
-               {{ data.transporter_voltage }}V
+               {{ data[1].transporter_voltage }}V
              </span> 
               </div>
             <div>减速器轴温:
               <span>
-                {{ data.transporter_reducerShaftTemperature }}℃
+                {{ data[1].transporter_reducerShaftTemperature }}℃
               </span>
             </div>
             <div>冷却水水温:
               <span>
-                {{ data.transporter_waterTemperature }}℃
+                {{ data[1].transporter_waterTemperature }}℃
               </span>
            </div>
           </div>
@@ -117,49 +117,49 @@
         <div class="inf">
           <div style="height: 20%; font-size: 20px; color: #4adefe;">转载机 运行状态</div>
           <div class="details">
-            <div>运行速度:
+          <div>运行速度:
               <span>
-                 {{ data.transporter_speed }} m/s
+                 {{ data[2].transporter_speed }}m/s
               </span>
              </div>
             <div>电机功率:
               <span>
-                {{ data.transporter_power }}W
+                {{ data[2].transporter_power }}W
               </span>
             </div>
             <div>减速器油温:
               <span>
-                {{ data.transporter_reducerOilTemperature }}℃
+                {{ data[2].transporter_reducerOilTemperature }}℃
                 </span>
               </div>
             <div>电机电流:
               <span>
-                {{ data.transporter_current }}A
+                {{ data[2].transporter_current }}A
               </span>
             </div>
             <div>电机轴温:
               <span>
-                {{ data.transporter_motorTemperature }}℃
+                {{ data[2].transporter_motorTemperature }}℃
               </span>
             </div>
             <div>冷却水水压:
              <span>
-               {{ data.transporter_pressure }}Pa
+               {{ data[2].transporter_pressure }}Pa
               </span> 
               </div>
             <div>电机电压:
              <span>
-               {{ data.transporter_voltage }}V
+               {{ data[2].transporter_voltage }}V
              </span> 
               </div>
             <div>减速器轴温:
               <span>
-                {{ data.transporter_reducerShaftTemperature }}℃
+                {{ data[2].transporter_reducerShaftTemperature }}℃
               </span>
             </div>
             <div>冷却水水温:
               <span>
-                {{ data.transporter_waterTemperature }}℃
+                {{ data[2].transporter_waterTemperature }}℃
               </span>
            </div>
           </div>
@@ -169,11 +169,13 @@
   </div>
 </template>
 <script>
+import { mapState } from "vuex";
 export default {
+  
   name: "compressors",
   data() {
     return {
-      data: {
+      data: [{
         transporter_speed:0,
         transporter_power:10,
         transporter_reducerOilTemperature:30,
@@ -183,19 +185,95 @@ export default {
         transporter_voltage:232,
         transporter_reducerShaftTemperature:10,
         transporter_waterTemperature:50,
-      },
+      
+      },{
+         transporter_speed:3,
+        transporter_power:10,
+        transporter_reducerOilTemperature:30,
+        transporter_current:20,
+        transporter_motorTemperature:60,
+        transporter_pressure:20,
+        transporter_voltage:232,
+        transporter_reducerShaftTemperature:10,
+        transporter_waterTemperature:50,
+
+      },{
+         transporter_speed:30,
+        transporter_power:10,
+        transporter_reducerOilTemperature:30,
+        transporter_current:20,
+        transporter_motorTemperature:60,
+        transporter_pressure:20,
+        transporter_voltage:232,
+        transporter_reducerShaftTemperature:10,
+        transporter_waterTemperature:50,
+
+      }
+      ]
     };
   },
-  props: {
-    url: String,
+
+computed: {
+    ...mapState(["websocketIP"]),
   },
   mounted() {
-    
-   
+    //如果id确定,再修改
+//     let data0 = new WebSocket(`ws://${this.websocketIP}/hbase/ws/belt/8`);
+//     this.initWebSocket(data0, "data0");
+//   let data1 = new WebSocket(`ws://${this.websocketIP}/hbase/ws/belt/8`);
+//     this.initWebSocket(data1, "data1");
+// let data2 = new WebSocket(`ws://${this.websocketIP}/hbase/ws/belt/8`);
+//     this.initWebSocket(data2, "data2");
+
   },
-  beforeDestroy() {
-    
+  methods: {
+    getData0(data) {
+      this.data[0]=data[0];
+
+    },
+        getData1(data) {
+      this.data[1]=data[1];
+
+    },
+        getData2(data) {
+      this.data[2]=data[2];
+
+    },
+    initWebSocket(websocket, type, select) {
+      // 连接错误
+      websocket.onerror = () => {
+        console.log("WebSocket连接发生错误   状态码:" + websocket.readyState);
+      };
+      // 连接成功
+      websocket.onopen = () => {
+        console.log("WebSocket连接成功    状态码:" + websocket.readyState);
+      };
+      // 收到消息的回调
+      websocket.onmessage = (event) => {
+        if (!JSON.parse(event.data).length) {
+          return;
+        }
+        if (type == "data0") {
+          this.getData0(JSON.parse(event.data));
+        } else if (type == "data1") {
+        this.getData1(JSON.parse(event.data));
+        } else if (type == "data2") {
+          this.getData2(JSON.parse(event.data));
+        } 
+      };
+      // 连接关闭的回调
+      websocket.onclose = () => {
+        console.log("WebSocket连接关闭    状态码:" + websocket.readyState);
+      };
+      // 通过$once来监听定时器,在beforeDestroy钩子可以被清除。
+      this.$once("hook:beforeDestroy", () => {
+        websocket.close();
+      });
+    },
   },
+
+
+
 };
 </script>