松原燃气地图首页流量计、压力表添加实时数据

gassafety-web/src/components/PopWindowGis/markerInfoWindow.vue

@@ -63,6 +63,72 @@
         <div>报警状态：<span>报警</span></div>
         <div>详细信息：<span>管线两端设备压差较大，管线可能泄漏</span></div>
       </div> -->
+      <template v-if="data.deviceType ==3 || data.deviceType==4">
+          <div v-if="data.deviceType==3" class="windowwarn-content" style="
+          border-bottom: 1px solid #e2e2e2;
+          padding: 10px 0 2px 22px;
+          height: 150px;padding-bottom: 2px;
+          ">
+            <el-col :span="11">
+              <div class="windowwarn">
+                标况累积量：<span class="standardConditionAccumulation"></span>
+              </div>
+            </el-col>
+            <el-col :span="11">
+              <div class="windowwarn">
+                工况累积量：<span class="workingConditionAccumulation"></span>
+              </div>
+            </el-col>
+            <el-col :span="11">
+              <div class="windowwarn">
+                剩余量：<span class="residualQuantity"></span>
+              </div>
+            </el-col>
+            <el-col :span="11">
+              <div class="windowwarn">
+                标况流量：<span class="standardConditionFlow"></span>
+              </div>
+            </el-col>
+            <el-col :span="11">
+              <div class="windowwarn">
+                工况流量：<span class="workingConditionFlow"></span>
+              </div>
+            </el-col>
+            <el-col :span="11">
+              <div class="windowwarn">
+                温度：<span class="temperature"></span>
+              </div>
+            </el-col>
+            <el-col :span="11">
+              <div class="windowwarn">
+                压力：<span class="pressure"></span>
+              </div>
+            </el-col>
+            <el-col :span="15">
+              <div class="windowwarn">
+                上报时间：<span class="reportTime"></span>
+              </div>
+            </el-col>
+          </div> 
+          <div v-if="data.deviceType==4" class="windowwarn-content" style="
+          border-bottom: 1px solid #e2e2e2;
+          padding: 10px 0 2px 22px;
+          height: 45px;padding-bottom: 2px;
+          ">
+            <el-col :span="11">
+              <div class="windowwarn">
+                压力：<span class="pressure"></span>
+              </div>
+            </el-col>
+            <el-col :span="11">
+              <div class="windowwarn">
+                上报时间：<span class="reportTime"></span>
+              </div>
+            </el-col>
+          </div>
+      </template>
+
+
       <div class="btn">
         <span @mousedown.stop="deviceMore">
           <el-button class="elbtn" type="primary">设备详情</el-button>
@@ -74,6 +140,7 @@
 </template>
 
 <script>
+import { realtimeData, getData } from "@/api/dataMonitoring/reportData";
 import moment from "moment";
 //line移入时的的infowindow
 export default {
@@ -83,6 +150,22 @@ export default {
     data: {},
     map: null,
   },
+  data(){
+    return{
+      deviceId:"",
+      alarm:{},
+    }
+  },
+  mounted() {
+      clearInterval(this.data.class.view.deviceTimer);
+
+
+      if (this.data.deviceType == 3 || this.data.deviceType == 4) {
+        this.getDataid();
+        this.data.class.view.deviceTimer = setInterval(this.getDataid, 5000);
+      }
+
+    },
   methods: {
     moment,
     deviceMore() {
@@ -95,6 +178,21 @@ export default {
         },
       });
     },
+    getDataid() {
+        getData(this.data.deviceId).then(response => {
+          this.changeValue(response.data)
+
+        })
+      },
+      changeValue(data) {
+        const keyArr = Object.keys(data);
+        keyArr.forEach((item) => {
+          const dom = document.getElementsByClassName(item)[0];
+          if (dom) {s
+            dom.innerHTML = data[item];
+          }
+        })
+      },
     close() {
       this.map.clearInfoWindow();
       this.data.class.view.domAllShow()
@@ -104,9 +202,18 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+  .windowwarn-content{
+    div{
+      font-size: 14px;
+      font-wwight: 400;
+      .windowwarn{
+        margin-bottom: 7px;
+      }
+    }
+  }
 .wrapper {
   width: 406px;
-  max-height: 430px;
+  max-height: 600px;
   // background: #fff;
   border-radius: 4px;
   background: rgba(7, 29, 51, 0.9);

gassafety-web/src/views/enterprise/mapView/index.vue

@@ -469,6 +469,9 @@ export default {
       //抽屉是否收回
       backFlag: true,
       mapStyle: true,
+      
+      // 设备轮询用的定时器
+      deviceTimer:null,
     };
   },
   created() {