cultivationApp/pages/live/liveIos.nvue

121 lines
3.0 KiB
Plaintext
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view>
<view>
<!-- :style="`width: ${videoHidth}px;height:${videoHeight}px;top:${videoOffset}px;left:${-videoOffset}px`" -->
<!-- style="width: 770px;height: 414px;top: 147px;left: -147px;" -->
<video v-if="shwovideo" @play="playVedio" @fullscreenchange="fullscreenchange" :controls="true"
:autoplay="true" :show-fullscreen-btn='false' :muted="true" :src="videoUrl" id="video" :style="`
width: ${videoWidth};
height: ${videoHeight};`"></video>
</view>
</view>
</template>
<script>
export default {
data() {
return {
imgSrc: "",
subNvue: "",
videoUrl: "",
videoUrl1: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4",
videoWidth: "",
videoHeight: "",
videoOffset: "",
object_fit: 'contain', //视频样式默认包含🌟
windowWidth: '',
deviceId: "",
shwovideo: false,
flag: true,
SocketTask: "",
}
},
onLoad(option) {
this.deviceId = option.device
this.videoUrl = option.url
this.videoUrl = this.replaceLastThreeChars(this.videoUrl, "mp4");
this.subNvue = uni.getSubNVueById('subNvueIos'); //获取
// let datas = {
// username: option.user,
// device: 'lihai_lot_walnutpi_dev_' + option.device,
// scene: 'app',
// }
// this.openScoket(datas)
let platform = uni.getSystemInfoSync()
this.videoHeight = platform.windowHeight
this.videoWidth = platform.windowWidth
this.videoOffset = platform.screenHeight - platform.windowHeight + platform.statusBarHeight
this.shwovideo = true
},
methods: {
replaceLastThreeChars(str, replacement) {
if (str.length < 3) {
return replacement + str;
} else {
return str.slice(0, -3) + replacement;
}
},
openScoket(datas) {
let that = this
this.SocketTask = uni.connectSocket({
url: 'wss://iot.lihaink.cn/test',
complete: () => {
console.log(that.socket, "socketTASK")
}
});
this.SocketTask.onOpen(function(res) {
that.SocketTask.send({
data: JSON.stringify(datas)
});
that.SocketTask.onMessage(function(res) {
console.log(res, "收到消息")
if (JSON.parse(res.data).code == 200) {
that.shwovideo = true
}
});
});
this.SocketTask.onError(function(res) {
console.log('WebSocket连接打开失败请检查');
});
this.SocketTask.onClose(function(res) {
console.log('WebSocket 已关闭!');
});
},
playVedio() {
this.subNvue.hide()
this.flag = false
},
fullscreenchange(e) {
if (!e.detail.fullScreen) { // 退出全屏,锁定竖屏
plus.screen.lockOrientation('portrait-primary');
}
},
}
,
onUnload() {
this.SocketTask.close();
this.SocketTask = null
console.log(this.socket, 'sosddsdsd')
},
}
</script>
<style lang="scss">
.video {
// transform: rotate(90deg);
// position: absolute;
// width: 770;
// height: 414;
// top: 174px;
// left: -174px;
// transform: translate(-50%, -50%);
}
</style>