| | |
| | | </div> |
| | | |
| | | <transition name="fade"> |
| | | <div class="popuptext" id="myPopup" v-if="fullScreenNotice">资源下载中,请稍后...</div> |
| | | <div class="popuptext" id="myPopup" v-if="fullScreenNotice"> |
| | | 资源下载中,请稍后... |
| | | </div> |
| | | </transition> |
| | | |
| | | <!-- 控制条 --> |
| | |
| | | |
| | | <!-- 播放失败 --> |
| | | <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> |
| | |
| | | return { |
| | | player: null, |
| | | playerId: 0, |
| | | Camera: new VideoRuleData(), |
| | | Camera: new VideoRuleData(this.cameraID, this.isGb), |
| | | showCanvas: true, |
| | | canvasData: { |
| | | line: [], |
| | |
| | | !!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() |
| | | }) |
| | | } |
| | |
| | | _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) |
| | |
| | | }, |
| | | setPlayerStatus(stat) { |
| | | this.videoLoading = false |
| | | this.playerStatus = 1 |
| | | // 控制加载后的播放按钮状态,实时流为自动播放,视频为preload |
| | | this.playerStatus = this.isStream ? 1 : 0 |
| | | }, |
| | | stopVideo() { |
| | | if (this.player.hPlayer == 0) return |
| | |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | #area-canvas { |
| | | z-index: 1; |
| | | } |
| | | video { |
| | | object-fit: fill; |
| | | width: 100%; |