zhangzengfei
2022-07-20 4a800a8fc83c6bd1f86a8e847b079a51a7532c09
src/components/wasmPlayer/index.vue
@@ -12,7 +12,9 @@
      </div>
      <transition name="fade">
        <div class="popuptext" id="myPopup" v-if="fullScreenNotice">资源下载中,请稍后...</div>
        <div class="popuptext" id="myPopup" v-if="fullScreenNotice">
          资源下载中,请稍后...
        </div>
      </transition>
      <!-- 控制条 -->
@@ -58,7 +60,7 @@
        <!-- 播放失败 -->
        <span class="video-error" v-show="playerStatus == -1">
          <i class="el-icon-warning-outline" style="font-size:40px"></i>
          <i class="el-icon-warning-outline" style="font-size: 40px"></i>
          <br />
          视频加载失败 无效的视频地址
        </span>
@@ -135,7 +137,7 @@
    return {
      player: null,
      playerId: 0,
      Camera: new VideoRuleData(),
      Camera: new VideoRuleData(this.cameraID, this.isGb),
      showCanvas: true,
      canvasData: {
        line: [],
@@ -172,6 +174,17 @@
          !!this.algoDataSocket && this.algoDataSocket.close()
        }
        this.$nextTick(() => {
          this.playVideo()
        })
      }
    },
    videoUrl: function(newVal, oldVal) {
      if (newVal !== oldVal) {
        if (this.player) {
          this.player.stop()
        }
        this.$nextTick(() => {
          this.player.preloadFlag = 0
          this.playVideo()
        })
      }
@@ -247,9 +260,10 @@
        _this.canvas.style.cursor = "default"
      })
      _this.canvasData.polygon.forEach(function(v, i) {
        if (v.location.length === 0) {
        if (v.location && v.location.length === 0) {
          return
        }
        _this.ctx.strokeStyle = "yellow"
        _this.ctx.beginPath()
        _this.ctx.moveTo(v.location[0].x / _this.showProportion, v.location[0].y / _this.showProportionY)
@@ -406,7 +420,8 @@
    },
    setPlayerStatus(stat) {
      this.videoLoading = false
      this.playerStatus = 1
      // 控制加载后的播放按钮状态,实时流为自动播放,视频为preload
      this.playerStatus = this.isStream ? 1 : 0
    },
    stopVideo() {
      if (this.player.hPlayer == 0) return
@@ -498,7 +513,9 @@
  width: 100%;
  height: 100%;
}
#area-canvas {
  z-index: 1;
}
video {
  object-fit: fill;
  width: 100%;