球机播放关闭以及选择播放功能优化
This commit is contained in:
BianLzhaoMin
parent
db50e1f9d9
commit
0de27cb8b7
|
|
@ -13,8 +13,8 @@ export default {
|
|||
return {
|
||||
jessibuca: null,
|
||||
playUrl: '',
|
||||
qxToken: '',
|
||||
qxInfo: {},
|
||||
qxToken: null,
|
||||
qxInfo: null,
|
||||
fixedData: [],
|
||||
}
|
||||
},
|
||||
|
|
@ -47,6 +47,41 @@ export default {
|
|||
},
|
||||
},
|
||||
methods: {
|
||||
// 父组件要求播放视频
|
||||
childPlayVideo(e) {
|
||||
if (this.qxToken && this.qxInfo) {
|
||||
const { puid, ballIndex } = e
|
||||
this.playUrl =
|
||||
this.qxInfo.q2Url + 'stream.flv?puid=' + puid + '&idx=' + ballIndex + '&stream=0&token=' + this.qxToken
|
||||
if (this.jessibuca) {
|
||||
// await this.jessibuca.destroy()
|
||||
this.playvideo()
|
||||
} else {
|
||||
this.createJessibuca()
|
||||
this.playvideo()
|
||||
}
|
||||
} else {
|
||||
Promise.all([this.getQxToken(), this.selectVideoLoginInfo()]).then(async () => {
|
||||
// 2. Promise.all 等待两个异步请求结束后 再组装url
|
||||
const { puid, ballIndex } = e
|
||||
this.playUrl =
|
||||
this.qxInfo.q2Url + 'stream.flv?puid=' + puid + '&idx=' + ballIndex + '&stream=0&token=' + this.qxToken
|
||||
})
|
||||
|
||||
if (this.jessibuca) {
|
||||
// await this.jessibuca.destroy()
|
||||
this.playvideo()
|
||||
} else {
|
||||
this.createJessibuca()
|
||||
this.playvideo()
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 父组件要求关闭
|
||||
childClosedVideo() {
|
||||
this.stopvideo()
|
||||
},
|
||||
createJessibuca() {
|
||||
this.jessibuca = new window.Jessibuca({
|
||||
container: this.$refs.containerPlayer,
|
||||
|
|
@ -99,7 +134,7 @@ export default {
|
|||
async stopvideo() {
|
||||
if (this.jessibuca) {
|
||||
await this.jessibuca.destroy()
|
||||
jessibuca = null
|
||||
this.jessibuca = null
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ export default {
|
|||
},
|
||||
// 警告消息
|
||||
msgWarning(content) {
|
||||
Message.closeAll()
|
||||
Message.warning(content)
|
||||
},
|
||||
// 弹出提示
|
||||
|
|
|
|||
|
|
@ -6,12 +6,12 @@ const cbc_iv = CryptoJS.enc.Utf8.parse('1234567812345678')
|
|||
* 默认参数需要加密
|
||||
* @type {boolean}
|
||||
*/
|
||||
const jia_mi = false
|
||||
const jia_mi = true
|
||||
/**
|
||||
* 默认后台会自动加密
|
||||
* @type {boolean}
|
||||
*/
|
||||
const jie_mi = false
|
||||
const jie_mi = true
|
||||
/**
|
||||
* 加密
|
||||
* @param word
|
||||
|
|
|
|||
|
|
@ -161,8 +161,9 @@ export default {
|
|||
},
|
||||
//播放视频
|
||||
playVideo(e) {
|
||||
this.playItem = e
|
||||
this.$refs.videoPlay.play(e)
|
||||
// this.playItem = e
|
||||
// this.$refs.videoPlay.play(e)
|
||||
this.$refs.videoPlay.videoPlayNew(e)
|
||||
},
|
||||
//设置图标样式
|
||||
getImageSrc(type) {
|
||||
|
|
|
|||
|
|
@ -127,8 +127,15 @@
|
|||
<div class="right">
|
||||
<div class="cell">
|
||||
<div class="cell-player">
|
||||
<div class="player-container" v-for="i in cellCount" :key="i" :class="cellClassNew">
|
||||
<JessibucaH265 :playerInfo="fixedData[i - 1]" />
|
||||
<div
|
||||
class="player-container"
|
||||
v-for="i in cellCount"
|
||||
:key="i"
|
||||
:class="cellClassNew"
|
||||
@click="onSelectVideo(i)"
|
||||
:style="i === activeVideo ? 'border: 2px solid green' : ''"
|
||||
>
|
||||
<JessibucaH265 :playerInfo="fixedData[i - 1]" :ref="`JessibucaH265_${i}`" />
|
||||
</div>
|
||||
<!-- <div :class="cellClass(i)" v-for="i in cellCount" :key="i">
|
||||
<player
|
||||
|
|
@ -276,6 +283,8 @@ export default {
|
|||
blob: '',
|
||||
fullscreen: false,
|
||||
fixedData: [],
|
||||
activeVideo: null,
|
||||
activePlayVideo: null,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -338,12 +347,25 @@ export default {
|
|||
},
|
||||
closeVideos(type) {
|
||||
if (type === 2) {
|
||||
this.$emit('changeTimingStatus', 2)
|
||||
while (this.activeArray.length > 0) {
|
||||
this.closeVideoOne(this.activeArray[0])
|
||||
// this.$emit('changeTimingStatus', 2)
|
||||
// while (this.activeArray.length > 0) {
|
||||
// this.closeVideoOne(this.activeArray[0])
|
||||
// }
|
||||
|
||||
// 循环窗口全部关闭
|
||||
for (let i = 0; i < this.cellCount; i++) {
|
||||
this.$refs[`JessibucaH265_${i + 1}`][0].childClosedVideo()
|
||||
}
|
||||
} else {
|
||||
this.closeVideoOne(this.activePlayer)
|
||||
// this.closeVideoOne(this.activePlayer)
|
||||
if (this.activeVideo === null) {
|
||||
this.$modal.msgWarning('请选择需要关闭的窗口')
|
||||
return
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
this.$refs[`JessibucaH265_${this.activeVideo}`][0].childClosedVideo()
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
closeVideoOne(playerIndex) {
|
||||
|
|
@ -525,6 +547,25 @@ export default {
|
|||
})
|
||||
this.fixedData = res.data
|
||||
},
|
||||
|
||||
// 点击视频盒子事件
|
||||
onSelectVideo(index) {
|
||||
console.log(index, '当前选择的索引')
|
||||
this.activeVideo = index
|
||||
},
|
||||
|
||||
// 点击视频播放时
|
||||
videoPlayNew(e) {
|
||||
console.log('需要播放的球机', e)
|
||||
if (this.activeVideo === null) {
|
||||
this.$modal.msgWarning('请选择播放的窗口！')
|
||||
return
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
this.$refs[`JessibucaH265_${this.activeVideo}`][0].childPlayVideo(e)
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
cellClass() {
|
||||
|
|
@ -699,4 +740,8 @@ export default {
|
|||
.container-4:nth-child(2n) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.player-container {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -39,9 +39,9 @@ module.exports = {
|
|||
// target: 'http://192.168.0.176:18080',
|
||||
// target: 'http://192.168.0.58:19090', // 杰
|
||||
// target: 'http://192.168.0.14:18080', // 测试环境
|
||||
// target: 'http://218.21.27.6:1999/prod-api', // 生产环境
|
||||
target: 'http://218.21.27.6:1999/prod-api', // 生产环境
|
||||
// target: 'http://192.168.0.38:18080', // 郝志权
|
||||
target: 'http://192.168.2.125:18080', // 梁超
|
||||
// target: 'http://192.168.2.125:18080', // 梁超
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
['^' + process.env.VUE_APP_BASE_API]: '',
|
||||
|
|
|
|||
Loading…
Reference in New Issue