mapvideo2.vue 3.07 KB
<template>
  <div class="item">
    <div class="player">
      <div class="ocx-box">
        <!-- <object id="VionVideo" classid="clsid:96DFBBAF-4220-4978-9681-4ABA534A7718"
          width="98%" height="450" style="margin-left:.9%">
        </object> -->
         <object height="90%" width="100%" id="nvrTotalOcx" name="nvrTotalOcx"
              classid="CLSID:96DFBBAF-4220-4978-9681-4ABA534A7718"
              style="margin-top:20px"
              >
              <param name="BorderStyle" value="1" />
              <param name="MousePointer" value="0" />
              <param name="Enabled" value="1" />
              <param name="Min" value="0" />
              <param name="Max" value="10" />
              <embed wmode="opaque"></embed>
              <param name="wmode" value="transparent">
         </object>
      </div>
    </div>
  </div>
</template>
<script>

export default {
    data() {
      return {
        playlist:{
          video1:'',
          video2:'',
          video3:'',
          video4:'',
        }
      };
    },
    props: ["playersrc", "vnum"],
    methods: {
      initocx(){
         VionVideo.Init(2, 'Null', 4);
      },
      downloadOCx() {
        if (navigator.userAgent.indexOf('Trident') > -1) {
          this.axios.get(IP + "/api/v1/device/dlfile", {
              params: {
                file_type: "video_ocx"
              }
            })
            .then(response => {
              location.href = response.data.file_url;
            });
        } else {
          this.$message.error("视频控件加载失败请用IE10及以上版本打开!");
        }
      },
      playurl() {
         this.$api.show.getShowUrl().then(res => {
        if (res.length > 0 && res[0].conf.length > 0) {
          this.playlist = {
            video1: res[0].conf[0].url,
            video2: res[0].conf[1].url,
            video3: res[0].conf[2].url,
            video4: res[0].conf[3].url
          };
          res[0].conf.map(ele => {
            nvrTotalOcx.PlayRealVideo(ele.url,1,'video','192.168.9.133',0);
          })
        }
      });
      },
      checkIE() {
        var agent = navigator.userAgent.toLowerCase();
        if (/(msie\s|trident.*rv:)([\w.]+)/.test(agent) && document.documentMode < 10) {
          this.$message.error("IE 版本过低请升级到IE10级以上版本!");
        }
      }
    },
    created() {
      this.checkIE();
    },
   
    mounted() {
      var testStr = 'Null';
      setTimeout(()=> {
        nvrTotalOcx.Init(2, testStr, 4);
        nvrTotalOcx.SetSingleWindow(true);
        nvrTotalOcx.SetParam("SetLanguage", "Chinese");
        nvrTotalOcx.SetParam("VideoSize", 0);
      this.playurl();

      },3000)
    	
      var medianame = '视频0';
    },
    watch: {},
    beforeDestroy: function () {
      // if (this.videoplayer.techName_ == "Flash" && this.videoplayer.pause) {
      //   this.videoplayer.pause();
      // }
    }
  };

</script>

<style lang="stylus" scoped>
.ocx-box{
  height 50vh
  width 35vw
  background:rgba(255,255,255,1);
  box-shadow:0px 2px 18px 0px rgba(0,26,70,0.3);
  border-radius:10px;
}
</style>