95 lines
2.3 KiB
Vue
95 lines
2.3 KiB
Vue
<template>
|
|
<view class="webview-box">
|
|
<view class="loading-box">
|
|
<u-loading size="100" :show="true"></u-loading>
|
|
<view>加载中。。。</view>
|
|
</view>
|
|
<web-view v-if="isWebview" :src="webviewUrl"></web-view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data(){
|
|
return{
|
|
isWebview:false,
|
|
deviceObj:null,
|
|
channeList:[],
|
|
webviewHost:'',
|
|
webviewUrl:''
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
let configList = uni.getStorageSync('configList');
|
|
let configIndex = uni.getStorageSync('configIndex');
|
|
this.webviewHost = configList[configIndex].protocol + configList[configIndex].address;
|
|
this.webviewUrl = configList[configIndex].protocol + configList[configIndex].address + '/video/web/h5/index.html';
|
|
console.log("option",option)
|
|
let deviceObj = JSON.parse(decodeURIComponent(option.deviceObj));
|
|
this.deviceObj = deviceObj;
|
|
this.getChanneList(deviceObj.id)
|
|
},
|
|
methods:{
|
|
getChanneList(id){
|
|
console.log("id",id)
|
|
this.$api.videoApi.getVideoChannelList({pid: id,page:1,pageSize:999}).then(res => {
|
|
if(res.code == 0){
|
|
if(res.data.list && res.data.list.length>0){
|
|
let channeList = res.data.list||[];
|
|
// let arr = channeList.map(item=>{
|
|
// return {
|
|
// channeId:item.channeId,
|
|
// name:item.name,
|
|
// hdlUrl:item.hdlUrl,
|
|
// }
|
|
// })
|
|
this.$nextTick(()=>{
|
|
this.$set(this,'channeList',res.data.list);
|
|
let url = this.webviewHost + '/video/web/h5/index.html?deviceObj=' + encodeURIComponent(JSON.stringify(this.deviceObj)) + '&channeList='+encodeURIComponent(JSON.stringify(channeList))
|
|
this.$set(this,'webviewUrl',url);
|
|
this.isWebview = true;
|
|
})
|
|
}else{
|
|
this.$u.toast('通道为空');
|
|
this.$nextTick(()=>{
|
|
this.$set(this,'channeList',[])
|
|
})
|
|
}
|
|
|
|
}else{
|
|
this.$u.toast(res.msg);
|
|
}
|
|
}, error => {
|
|
this.$u.toast('服务器开小差了呢，请您稍后再试')
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
page{
|
|
height: 100%;
|
|
}
|
|
</style>
|
|
|
|
<style scoped lang="less">
|
|
.webview-box{
|
|
height: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
position: relative;
|
|
}
|
|
.loading-box{
|
|
position: absolute;
|
|
left: auto;
|
|
right: auto;
|
|
top: auto;
|
|
bottom: auto;
|
|
text-align: center;
|
|
>view{
|
|
font-size: 30rpx;
|
|
line-height: 80rpx;
|
|
}
|
|
}
|
|
</style> |