209 lines
5.8 KiB
Vue
209 lines
5.8 KiB
Vue
<template>
|
||
<view class="page-view">
|
||
<live-player :src="videoMsg.url" autoplay
|
||
:orientation="isfullScreen ? 'horizontal': 'vertical'" class="live-player"
|
||
muted="false"
|
||
@fullscreenchange="fullscreenchange" :style="isfullScreen? `width: 750rpx;height:${windowHeight}px;`:'width:750rpx;'"
|
||
@statechange="videoChange"
|
||
@audiovolumenotify="audiovolumenotify"
|
||
>
|
||
</live-player>
|
||
|
||
<cover-image
|
||
src="https://eshangtech.com/ShopICO/ahyd-BID/video/full-video.png"
|
||
@click="isfullScreen=!isfullScreen"
|
||
class="screen-ico"
|
||
v-if="!isfullScreen"
|
||
style="right:40rpx" ></cover-image>
|
||
<cover-image
|
||
v-else
|
||
src="https://eshangtech.com/ShopICO/ahyd-BID/video/orgin-video.png"
|
||
@click="isfullScreen=!isfullScreen"
|
||
class="screen-ico"
|
||
style="left: 40rpx;"></cover-image>
|
||
<!-- <cover-view class="uni-icon uni-icon-scan" @click="isfullScreen=!isfullScreen"></cover-view> -->
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
let appinfo = uni.getSystemInfoSync()
|
||
return {
|
||
requestData: {
|
||
accessToken:"at.4ese57m70n5g281n9wlpfsyz4a4btbiw-58g0eoe6h4-02jhrfk-idxvwfdhh",
|
||
deviceSerial:"F79721547", //679417149
|
||
channelNo: "1",
|
||
protocol: 3,
|
||
type: "2",
|
||
startTime:"",//"2021-06-10 11:00:00",
|
||
stopTime:"",// "2021-06-10 11:30:00",
|
||
quality: 2,
|
||
supportH265: 0,
|
||
},
|
||
windowHeight: appinfo.windowHeight,
|
||
isfullScreen: false,
|
||
videoSrc: null,
|
||
videoMsg: null
|
||
}
|
||
},
|
||
methods: {
|
||
videoChange(detail){
|
||
console.log(detail)
|
||
},
|
||
audiovolumenotify(detail){
|
||
console.log(detail)
|
||
},
|
||
getVideo () {
|
||
let {requestData} = this
|
||
uni.request({
|
||
url:"https://open.ys7.com/api/lapp/v2/live/address/get",
|
||
method: "POST",
|
||
data: requestData,
|
||
header:{
|
||
"Content-Type": "application/x-www-form-urlencoded"
|
||
},
|
||
success:(response)=>{
|
||
console.log(response.data)
|
||
if(response.data.code!='200') {
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "播放失败!错误码:"+response.data.code+";"+response.data.msg
|
||
})
|
||
}
|
||
this.videoMsg = response.data.data
|
||
}
|
||
})
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
|
||
let {sc, hd, bt, et, token} = option
|
||
this.requestData.startTime= bt
|
||
this.requestData.stopTime= et
|
||
this.requestData.deviceSerial= sc
|
||
this.requestData.channelNo= hd
|
||
this.requestData.accessToken= token
|
||
// this.videoSrc = `ezopen://open.ys7.com/${sc}/${hd}.rec?begin=20210610110000&end=20210610110130`
|
||
this.getVideo()
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.page-view{
|
||
position: relative;
|
||
|
||
}
|
||
.live-player {
|
||
width: 750rpx;
|
||
}
|
||
.screen-ico {
|
||
position: absolute;
|
||
bottom: 40rpx;
|
||
right: 40rpx;
|
||
color: #fff;
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
z-index: 99;
|
||
}
|
||
.uni-icon-scan {
|
||
color: #444;
|
||
position: relative;
|
||
/* top: -68rpx;
|
||
margin-left: 40rpx; */
|
||
fnot-size: 24rpx;
|
||
}
|
||
</style>
|
||
<!--
|
||
<template>
|
||
<div>
|
||
<div
|
||
id="video-container"
|
||
style="width: 750rpx;height:7rem;"
|
||
></div>
|
||
|
||
</div>
|
||
</template>
|
||
<script>
|
||
|
||
export default {
|
||
name: 'HelloWorld',
|
||
props: {
|
||
msg: String
|
||
},
|
||
data() {
|
||
let width = uni.upx2px(750);
|
||
let height = width * 9 / 16;
|
||
|
||
return {
|
||
width: width,
|
||
height: height,
|
||
player: null,
|
||
isplay: true
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
console.group('mounted 组件挂载完毕状态===============》');
|
||
let _this = this
|
||
setTimeout(function() {
|
||
_this.createPlay(option); // 方法调用示例,10秒后关闭视频
|
||
}, 100)
|
||
},
|
||
methods: {
|
||
createPlay(option) {
|
||
let {sc, hd, bt, et, token} = option
|
||
let url = `ezopen://open.ys7.com/${sc}/${hd}.rec?begin=${bt}&end=${et}`
|
||
console.log(url)
|
||
|
||
let width = this.width
|
||
let height = this.height
|
||
let player = this.player = this.$util.playVideo({
|
||
autoplay: true,
|
||
id: 'video-container',
|
||
accessToken: token, // 'at.4ese57m70n5g281n9wlpfsyz4a4btbiw-58g0eoe6h4-02jhrfk-idxvwfdhh',
|
||
url: url,
|
||
|
||
// url: 'ezopen://open.ys7.com/F79721547/1.rec?begin=20210603211700&end=20210603233159',
|
||
|
||
// simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版;
|
||
template: 'simple',
|
||
|
||
// 视频上方头部控件
|
||
// controls: ['play', 'voice', 'fullScreen'],
|
||
|
||
// 如果templete参数不为simple,该字段将被覆盖
|
||
// header: ['capturePicture', 'save', 'zoom'],
|
||
// plugin: ['talk'], // 加载插件,talk-对讲
|
||
// 视频下方底部控件
|
||
footer: ['fullScreen'], // 如果template参数不为simple,该字段将被覆盖'talk', 'broadcast', 'hd',
|
||
audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
|
||
openSoundCallBack: data => console.log('开启声音回调', data),
|
||
closeSoundCallBack: data => console.log('关闭声音回调', data),
|
||
startSaveCallBack: data => console.log('开始录像回调', data),
|
||
stopSaveCallBack: data => console.log('end录像回调', data),
|
||
capturePictureCallBack: data => console.log('截图成功回调', data),
|
||
fullScreenCallBack: data => console.log('全屏回调', data),
|
||
getOSDTimeCallBack: data => console.log('获取OSDTime回调', data),
|
||
handleError: (data) => { console.log('错误', data) },
|
||
width: width,
|
||
height: height
|
||
});
|
||
console.log('player', player);
|
||
|
||
// setTimeout(() => {
|
||
// player.stop()
|
||
// }, 4 * 60 * 1000)
|
||
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
<style scoped>
|
||
.video-box {
|
||
width: 10rem;
|
||
height: 12.5rem;
|
||
}
|
||
</style>
|
||
-->
|