zhangzengfei
2022-11-17 82d8cf2628b7d8f741b53053855b9cfed97b13c9
src/pages/cameraPlayer/components/player/index.vue
@@ -38,7 +38,7 @@
      default: false
    }
  },
  computed: {
    poster() {
      return "/images/player/player_poster.gif?t=" + Math.random()
@@ -75,7 +75,7 @@
      if (id !== this.wfsId) {
        return
      }
      if (this.wfs.websocketLoader && this.wfs.websocketLoader.client) {
        if (this.wfs.websocketLoader.client.disconnected) {
          this.clickStart();
@@ -83,7 +83,7 @@
          return
        }
      }
      let _this = this;
      setTimeout(() => {
        _this.checkConnect(id)
@@ -93,11 +93,11 @@
      if (this.rtspUrl == "") {
        return;
      }
      if (this.cameraID == "") {
        this.cameraID = this.getUuid();
      }
      if (Wfs.isSupported()) {
        let wsAddr = this.wsAddr;
        let cameraInfo = {
@@ -106,14 +106,14 @@
          isRunning: this.isRunning,
          isGb28181: this.isGb
        };
        // let camera = document.getElementById(this.cameraID);
        let camera = this.$refs.videoPlayer;
        this.wfs = new Wfs();
        let randomId = this.getUuid();
        this.wfsId = randomId;
        this.wfs.attachMedia(camera, "chX", "H264Raw", wsAddr, cameraInfo);
        this.checkConnect(randomId)
      }
    },
@@ -123,8 +123,8 @@
      for (var i = 0; i < 36; i++) {
        s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
      }
      s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
      s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
      s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
      s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
      s[8] = s[13] = s[18] = s[23] = "-";
      var uuid = s.join("");
      return uuid;
@@ -135,7 +135,7 @@
  }
};
</script>
<style lang="scss">
#area-canvas {
  background: transparent;
@@ -146,7 +146,7 @@
  width: 100%;
  height: 100%;
}
video {
  object-fit: fill;
  width: 100%;
@@ -164,7 +164,7 @@
    width: 100%;
    height: 10%;
    background: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9));
    i {
      float: right;
      font-size: 15px;
@@ -179,10 +179,10 @@
    }
  }
}
.video-player:hover {
  .controls {
    display: block;
  }
}
</style>
</style>