大屏

dcit-hcsystem-hcsystem-master/src/utils/mapUtil.js

@@ -197,10 +197,11 @@ export default class Mutil {
         
     }
     closeAllOverlays(){
-        let lays=this.MAP.getOverlays().getArray();
-        lays.forEach((ele)=>{
-            ele.setPosition(undefined)
-        })
+        let lays=this.MAP.getOverlays().clear();
+   //      lays.forEach((ele)=>{
+   //          ele.setPosition(undefined)
+			// that.MAP.addOverlay(overlay);
+   //      })
     }
     //增加标注弹窗
     addPopup(popConHtml, id, longitude, latitude) {

dcit-hcsystem-hcsystem-master/src/views/qyMap/qyMap.vue

@@ -10,7 +10,9 @@
                 <!-- <button @click="Mutil.tianSlC()" class="map-botton">切换3</button> -->
             </div>
         
-        
+        <div v-show="isShowVideo" style="display: none;position:absolute;left:1000px;top:10px;z-index: 2;background-color: #0BD30B;width: 400px;height: 300px;">
+			<div id="div_video"></div>
+        </div>
 
 		
 		</div>
@@ -100,7 +102,6 @@
                         </div>
                         <div class="markbox-div">
                             <el-tooltip :disabled="disabled" content="职业危害场所" placement="left" effect="light">
-                                <div>
                                     <img width="20px" src="@/assets/mark/weihaichangsuo.png" />
                                 </div>
                                 
@@ -164,7 +165,8 @@ export default class GIS extends Vue {
     @Provide() Mutil: any;
     @Provide() mapLoadDone = false;
     @Provide() MAP: any;
-
+	@Provide() isShowVideo:boolean=false;
+	@Provide() player:any;
     @Provide() mapOption = {
         plugin: [{
                 pName: "MapType",
@@ -190,6 +192,7 @@ export default class GIS extends Vue {
     //     city: "石家庄",
     //     citylimit: true,
     // };
+	@Provide() lastVideoPlayId:any="";
     @Provide() markersB: any = [];
     @Provide() toolobj: any;
     @Provide() mouseTool: any; //测量工具
@@ -306,31 +309,28 @@ export default class GIS extends Vue {
     }
     getshipinWindowInfo(deviceId: string) {
         let that = this;
-        // (window as any).checkDetail = function (param: string) {
-        //     that.$router.push({
-        //         path: "/EnDetail",
-        //         query: {
-        //             enterpriseId: param
-        //         }
-        //     });
-        // };
+		this.closeVideo();
         METHOD.axiosGet(
             that,
             `/safetyDeviceInfo/getSafetyDeviceInfoById/${deviceId}`,
             function (res: any) {
                 if (res.code == 0) {
-                    let device = res.data,
-                html = `<div class="windowDg"><h3>${device.deviceName}</h3>` + `<div id="playerWindow" class="playerWindow"></div>` + `</div>`;
-
-                that.Mutil.addPopup(html, device.id, device.longitude, device.latitude)
-                alert(2)
-                var player = new WasmPlayer(null, "playerWindow", null, {Height: true});
-                player.play('http://27.128.189.137:18000/flv/hls/stream_88_0.flv' , 1);
+                    let device = res.data;
+                that.isShowVideo=true;
+                that.player.play('http://27.128.189.137:18000/flv/hls/stream_88_0.flv' , 1);
+				that.lastVideoPlayId="stream_88_0";//记录上次播放的视频ID
                 console.log(device,"de-----")
                 }
             }
         );
     }
+	//关闭视频方法
+	closeVideo(){
+		if(this.lastVideoPlayId!=""){
+			this.player.stop('http://27.128.189.137:18000/flv/hls/'+this.lastVideoPlayId+'.flv' , 1);
+		}
+		this.isShowVideo=false;
+	}
     addMark(obj: any, index: any) {
         let icon,
             that = this;
@@ -481,6 +481,8 @@ export default class GIS extends Vue {
     }
     mounted() {
         let that = this;
+		
+		that.player = new WasmPlayer(null, "div_video", null, {Height: true});
         that.mapLoadDone = true;
         that.Mutil = new Mutil("mapbox");
         that.MAP = that.Mutil.MAP;