视频功能完成

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

@@ -3,6 +3,7 @@
     :title="title"
     :visible.sync="dialogVisible"
     :before-close="handleClose"
+    ref="workView"
   >
     <el-form :model="formData" ref="formData" :rules="rules">
       <el-row>
@@ -138,7 +139,13 @@ export default {
     this.formData.beginTime = moment().format("YYYY-MM-DD HH:mm:ss");
     this.formData.endTime = moment().add(2, "h").format("YYYY-MM-DD HH:mm:ss");
   },
-
+  watch: {
+    dialogVisible(val) {
+      if (!val) {
+        document.body.removeChild(this.$refs.workView.$el);
+      }
+    },
+  },
   methods: {
     // 下拉框选项
     selectChange(e) {

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

@@ -184,7 +184,11 @@
                 <!-- 有数据 -->
                 <template v-if="item.list.length > 0">
                   <!-- 设备以及管道 展示内容是一样的 -->
-                  <template v-if="item.value != 8 && item.value != 9">
+                  <template
+                    v-if="
+                      item.value != 8 && item.value != 9 && item.value != 10
+                    "
+                  >
                     <div class="list-wrapper">
                       <div class="thead">
                         <div class="no"></div>
@@ -263,6 +267,31 @@
                       </div>
                     </div>
                   </template>
+                  <!-- 摄像头 -->
+                  <template v-else-if="item.value == 10">
+                    <div class="list-wrapper">
+                      <div class="thead">
+                        <div class="no"></div>
+                        <div class="code">监控名称</div>
+                        <div class="name">监控位置</div>
+                      </div>
+                      <div
+                        class="deviceList"
+                        :class="{ topActive: index == 0 }"
+                        v-for="(iten, index) in item.list"
+                        :key="iten.deviceId + `` + index"
+                        @click.stop="panToo(iten, item)"
+                      >
+                        <div class="no">{{ iten.no + 1 }}</div>
+                        <div :title="iten.deviceName" class="code">
+                          {{ iten.deviceName }}
+                        </div>
+                        <div :title="iten.deviceAddress" class="name">
+                          {{ iten.deviceAddress ? iten.deviceAddress : "-" }}
+                        </div>
+                      </div>
+                    </div>
+                  </template>
 
                   <!-- 翻页 -->
                   <div class="goback">
@@ -623,6 +652,7 @@ export default {
     getVideoList(queryParams) {
       return videoList(queryParams).then((res) => {
         if (res.code == 200) {
+          this.videoClassify(res.rows);
           console.log("摄像头", res.rows);
           res.rows.forEach((item) => {
             this.gaoMap.addMarker(DEVICE_TYPE.VIDEO, item);
@@ -985,7 +1015,9 @@ export default {
         this.workerManInfoWindowShow(iten, lat, lng);
       } else if (item.value == 8) {
         this.trouleInfoWindowShow(iten, lat, lng);
-      } else {
+      }else if(item.value == 10){
+        this.videoInfoWindowShow(iten, lat, lng)
+      }else {
         // 其他设备
         this.diveceInfoWindowShow(iten, lat, lng);
       }
@@ -1091,6 +1123,29 @@ export default {
         this.gaoMap.wokerManOpen(e);
       };
     },
+    videoInfoWindowShow(iten, lat, lng) {
+      // console.log("iten",iten.userId)
+      const target = this.gaoMap.markers.filter((item) => {
+        return item.getExtData().videoManagerId == iten.videoManagerId;
+      })[0];
+      console.log("target", target);
+      const e = {
+        target,
+        lnglat: iten.path,
+      };
+      // 如果是原地不动，就直接执行
+      // if (iten.path[0] == lng && iten.path[1] == lat + 0.08) {
+      // console.log(iten.path[0] , iten.path[1] ,lat+0.06,lng)
+      if (iten.path[0] == lng && iten.path[1] >= lat + 0.08 - 0.000001) {
+        this.gaoMap.leftListClick = false;
+        this.gaoMap.videoOpen(e);
+        return;
+      }
+      // 因为地图移动的时候infowindow无法显示
+      this.gaoMap.handleInfoWindowOpenFunc = () => {
+        this.gaoMap.wokerManOpen(e);
+      };
+    },
 
     // 向右的箭头的动画
     arrowRightChange(item) {
@@ -1226,6 +1281,21 @@ export default {
       console.log("值班人员", workManArr);
       this.allList[6] = workManArr;
     },
+    // 监控
+    videoClassify(videoData) {
+      const videoArr = videoData.map((item, index) => {
+        return {
+          path: [item.longitude, item.latitude],
+          no: index,
+          videoManagerId: item.videoManagerId,
+          deviceName: item.videoName,
+          deviceAddress: item.videoAddress,
+          // userPhone: item.phonenumber,
+        };
+      });
+      // console.log("值班人员", workManArr);
+      this.allList[7] = videoArr;
+    },
     // 左边设备翻页
     async pipeList(pageNum) {
       const num = pageNum ? pageNum : 10;