@@ -107,12 +107,12 @@ | |||
<div> | |||
<div class="dialogHeader"> | |||
<div></div> | |||
<!-- <div class="dialogBtn" @click="refreshUrl"> | |||
<div class="dialogBtn" @click="refreshUrl"> | |||
<el-icon color="#409efc" :size="20"> | |||
<Refresh /> | |||
</el-icon> | |||
<div>刷新视频</div> | |||
</div> --> | |||
</div> | |||
</div> | |||
<div v-if="visible || showVideo" class="prism-player" id="player-con"></div> | |||
<!-- <VideoPlay :videoUrl="detailData.videoUrl" :videoType="detailData.videoType" /> --> | |||
@@ -436,7 +436,7 @@ function onDetail(row: any) { | |||
visible.value = true; | |||
detailData.sensorId = row.sensorId; | |||
detailData.title = row.sensorName + "(" + row.sensorId + ")"; | |||
getUrl(row.sensorId); | |||
getUrl(); | |||
} | |||
// 刷新 | |||
const showVideo = ref(false); | |||
@@ -449,8 +449,7 @@ function refreshUrl() { | |||
}, 1000); | |||
} | |||
let num = 1; | |||
function getUrl(sensorId:any) { | |||
function getUrl() { | |||
detailData.videoType = "m3u8"; | |||
setTimeout(async () => { | |||
await monitorLIVEApi.detail({ sensorId: detailData.sensorId }).then((res:any) => { | |||
@@ -464,18 +463,7 @@ function getUrl(sensorId:any) { | |||
detailData.streamId = data.streamId; | |||
detailData.videoToken = data.videoToken; | |||
// getvideo1() | |||
let localurl = '' | |||
if(sensorId == 'SXT001') { | |||
localurl = 'http://123.57.209.16:8004/video/1.mp4' | |||
getvideo2(localurl); | |||
} else if(sensorId == 'SXT002'){ | |||
localurl = 'http://123.57.209.16:8004/video/5.mp4' | |||
getvideo2(localurl); | |||
} else if(sensorId == 'SXT003') { | |||
localurl = 'http://123.57.209.16:8004/video/2.mp4' | |||
getvideo2(localurl); | |||
} | |||
getvideo2(); | |||
} | |||
}); | |||
}); | |||
@@ -512,10 +500,10 @@ function getvideo1() { | |||
// aliRts.startLiveStream(pullStreamUrl, mediaEle); | |||
} | |||
let player = ref<any>(null); | |||
function getvideo2(url:any) { | |||
function getvideo2() { | |||
var options = { | |||
id: "player-con", | |||
source: url, | |||
source: detailData.videoUrl + "&subaudio=no&jitterbuffer=6000", | |||
// "rtsFallbackSource": "降级地址,如HLS", | |||
width: "100%", | |||
height: "500px", | |||
@@ -561,7 +549,7 @@ const handleClose = () => { | |||
visible.value = false; | |||
detailData.videoUrl = ""; | |||
detailData.videoType = ""; | |||
// stopUrl(); | |||
stopUrl(); | |||
if (player.value) { | |||
player.value.dispose(); | |||
} | |||
@@ -107,12 +107,12 @@ | |||
<div> | |||
<div class="dialogHeader"> | |||
<div></div> | |||
<div class="dialogBtn" @click="refreshUrl"> | |||
<!-- <div class="dialogBtn" @click="refreshUrl"> | |||
<el-icon color="#409efc" :size="20"> | |||
<Refresh /> | |||
</el-icon> | |||
<div>刷新视频</div> | |||
</div> | |||
</div> --> | |||
</div> | |||
<div v-if="visible || showVideo" class="prism-player" id="player-con"></div> | |||
<!-- <VideoPlay :videoUrl="detailData.videoUrl" :videoType="detailData.videoType" /> --> | |||
@@ -436,7 +436,7 @@ function onDetail(row: any) { | |||
visible.value = true; | |||
detailData.sensorId = row.sensorId; | |||
detailData.title = row.sensorName + "(" + row.sensorId + ")"; | |||
getUrl(); | |||
getUrl(row.sensorId); | |||
} | |||
// 刷新 | |||
const showVideo = ref(false); | |||
@@ -449,7 +449,8 @@ function refreshUrl() { | |||
}, 1000); | |||
} | |||
let num = 1; | |||
function getUrl() { | |||
function getUrl(sensorId:any) { | |||
detailData.videoType = "m3u8"; | |||
setTimeout(async () => { | |||
await monitorLIVEApi.detail({ sensorId: detailData.sensorId }).then((res:any) => { | |||
@@ -463,7 +464,18 @@ function getUrl() { | |||
detailData.streamId = data.streamId; | |||
detailData.videoToken = data.videoToken; | |||
// getvideo1() | |||
getvideo2(); | |||
let localurl = '' | |||
if(sensorId == 'SXT001') { | |||
localurl = 'http://123.57.209.16:8004/video/1.mp4' | |||
getvideo2(localurl); | |||
} else if(sensorId == 'SXT002'){ | |||
localurl = 'http://123.57.209.16:8004/video/5.mp4' | |||
getvideo2(localurl); | |||
} else if(sensorId == 'SXT003') { | |||
localurl = 'http://123.57.209.16:8004/video/2.mp4' | |||
getvideo2(localurl); | |||
} | |||
} | |||
}); | |||
}); | |||
@@ -500,10 +512,10 @@ function getvideo1() { | |||
// aliRts.startLiveStream(pullStreamUrl, mediaEle); | |||
} | |||
let player = ref<any>(null); | |||
function getvideo2() { | |||
function getvideo2(url:any) { | |||
var options = { | |||
id: "player-con", | |||
source: detailData.videoUrl + "&subaudio=no&jitterbuffer=6000", | |||
source: url, | |||
// "rtsFallbackSource": "降级地址,如HLS", | |||
width: "100%", | |||
height: "500px", | |||
@@ -549,7 +561,7 @@ const handleClose = () => { | |||
visible.value = false; | |||
detailData.videoUrl = ""; | |||
detailData.videoType = ""; | |||
stopUrl(); | |||
// stopUrl(); | |||
if (player.value) { | |||
player.value.dispose(); | |||
} |
@@ -16,7 +16,7 @@ | |||
<view class="botbox"> | |||
<view id="url-player-test"></view> | |||
</view> | |||
</view> | |||
<view class="bottom-content"> | |||
@@ -78,8 +78,7 @@ | |||
</view> | |||
</view> | |||
<view class="tableBox"> | |||
<u-empty marginTop="100rpx" :show="monitorList.length == 0&&status == 'nomore'" mode="list" | |||
text="暂无数据"></u-empty> | |||
<u-empty marginTop="100rpx" :show="monitorList.length == 0&&status == 'nomore'" mode="list" text="暂无数据"></u-empty> | |||
<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 0rpx);"> | |||
<u-list-item v-for="(item, index) in monitorList" :key="index"> | |||
<view class="liBox"> | |||
@@ -202,10 +201,10 @@ | |||
this.loadmore() | |||
}, | |||
onUnload() { | |||
if (this.showVideo) { | |||
if(this.showVideo) { | |||
this.closeDialog() | |||
} | |||
}, | |||
onPullDownRefresh() { | |||
uni.stopPullDownRefresh() | |||
@@ -223,7 +222,7 @@ | |||
// this.loadComponent().then(() => { | |||
this.player = new Aliplayer({ | |||
id: "url-player-test", | |||
source: this.videoUrl, | |||
source: this.videoUrl + "&subaudio=no&jitterbuffer=6000", | |||
width: "100%", | |||
height: "100%", | |||
isLive: true, | |||
@@ -251,14 +250,14 @@ | |||
} | |||
this.showVideo = false; | |||
// let params = { | |||
// sensorId: this.sensorId, | |||
// streamId: this.streamId, | |||
// videoToken: this.videoToken | |||
// }; | |||
// stopUrl(params).then(res => { | |||
// }) | |||
let params = { | |||
sensorId: this.sensorId, | |||
streamId: this.streamId, | |||
videoToken: this.videoToken | |||
}; | |||
stopUrl(params).then(res => { | |||
}) | |||
}, | |||
loadWebPlayerSDK() { | |||
return new Promise((resolve, reject) => { | |||
@@ -337,49 +336,27 @@ | |||
}); | |||
}, | |||
// 获取视频地址 | |||
startClick(id, name) { | |||
startClick(id,name) { | |||
this.sensorId = id; | |||
this.sensorName = name; | |||
this.showVideo = true; | |||
// startUrl({ | |||
// sensorId: id | |||
// }).then(res => { | |||
// let { | |||
// code, | |||
// data | |||
// } = res; | |||
// if (code == 200) { | |||
// if (this.sensorId == 'SXT001') { | |||
// this.videoUrl = 'http://123.57.209.16:8004/video/1.mp4' | |||
// } else if (this.sensorId == 'SXT002') { | |||
// this.videoUrl = 'http://123.57.209.16:8004/video/5.mp4' | |||
// } else if (this.sensorId == 'SXT003') { | |||
// this.videoUrl = 'http://123.57.209.16:8004/video/2.mp4' | |||
// } | |||
// // this.videoUrl = data.rtsPullStreamUrls[0].url; | |||
// this.streamId = data.streamId; | |||
// this.videoToken = data.videoToken; | |||
// this.setVideo() | |||
// } | |||
// }) | |||
if (this.sensorId == 'SXT001') { | |||
this.videoUrl = 'http://123.57.209.16:8004/video/1.mp4' | |||
} else if (this.sensorId == 'SXT002') { | |||
this.videoUrl = 'http://123.57.209.16:8004/video/5.mp4' | |||
} else if (this.sensorId == 'SXT003') { | |||
this.videoUrl = 'http://123.57.209.16:8004/video/2.mp4' | |||
} | |||
// this.videoUrl = data.rtsPullStreamUrls[0].url; | |||
startUrl({ | |||
sensorId: id | |||
}).then(res => { | |||
let { | |||
code, | |||
data | |||
} = res; | |||
if (code == 200) { | |||
this.videoUrl = data.rtsPullStreamUrls[0].url; | |||
this.streamId = data.streamId; | |||
this.videoToken = data.videoToken; | |||
this.setVideo() | |||
} | |||
}) | |||
this.setVideo() | |||
}, | |||
confirmVideo() { | |||
this.showVideo = false; | |||
@@ -466,20 +443,17 @@ | |||
align-items: center; | |||
padding: 0 25rpx; | |||
background: #fff; | |||
.title { | |||
font-weight: 700; | |||
font-size: 28rpx; | |||
} | |||
.closes { | |||
// background: #ccc; | |||
} | |||
} | |||
.botbox { | |||
height: calc(100% - 80rpx); | |||
height:calc(100% - 80rpx); | |||
} | |||
} | |||
@@ -16,7 +16,7 @@ | |||
<view class="botbox"> | |||
<view id="url-player-test"></view> | |||
</view> | |||
</view> | |||
<view class="bottom-content"> | |||
@@ -78,7 +78,8 @@ | |||
</view> | |||
</view> | |||
<view class="tableBox"> | |||
<u-empty marginTop="100rpx" :show="monitorList.length == 0&&status == 'nomore'" mode="list" text="暂无数据"></u-empty> | |||
<u-empty marginTop="100rpx" :show="monitorList.length == 0&&status == 'nomore'" mode="list" | |||
text="暂无数据"></u-empty> | |||
<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 0rpx);"> | |||
<u-list-item v-for="(item, index) in monitorList" :key="index"> | |||
<view class="liBox"> | |||
@@ -201,10 +202,10 @@ | |||
this.loadmore() | |||
}, | |||
onUnload() { | |||
if(this.showVideo) { | |||
if (this.showVideo) { | |||
this.closeDialog() | |||
} | |||
}, | |||
onPullDownRefresh() { | |||
uni.stopPullDownRefresh() | |||
@@ -222,7 +223,7 @@ | |||
// this.loadComponent().then(() => { | |||
this.player = new Aliplayer({ | |||
id: "url-player-test", | |||
source: this.videoUrl + "&subaudio=no&jitterbuffer=6000", | |||
source: this.videoUrl, | |||
width: "100%", | |||
height: "100%", | |||
isLive: true, | |||
@@ -250,14 +251,14 @@ | |||
} | |||
this.showVideo = false; | |||
let params = { | |||
sensorId: this.sensorId, | |||
streamId: this.streamId, | |||
videoToken: this.videoToken | |||
}; | |||
stopUrl(params).then(res => { | |||
}) | |||
// let params = { | |||
// sensorId: this.sensorId, | |||
// streamId: this.streamId, | |||
// videoToken: this.videoToken | |||
// }; | |||
// stopUrl(params).then(res => { | |||
// }) | |||
}, | |||
loadWebPlayerSDK() { | |||
return new Promise((resolve, reject) => { | |||
@@ -336,27 +337,49 @@ | |||
}); | |||
}, | |||
// 获取视频地址 | |||
startClick(id,name) { | |||
startClick(id, name) { | |||
this.sensorId = id; | |||
this.sensorName = name; | |||
this.showVideo = true; | |||
startUrl({ | |||
sensorId: id | |||
}).then(res => { | |||
let { | |||
code, | |||
data | |||
} = res; | |||
if (code == 200) { | |||
this.videoUrl = data.rtsPullStreamUrls[0].url; | |||
this.streamId = data.streamId; | |||
this.videoToken = data.videoToken; | |||
this.setVideo() | |||
} | |||
}) | |||
// startUrl({ | |||
// sensorId: id | |||
// }).then(res => { | |||
// let { | |||
// code, | |||
// data | |||
// } = res; | |||
// if (code == 200) { | |||
// if (this.sensorId == 'SXT001') { | |||
// this.videoUrl = 'http://123.57.209.16:8004/video/1.mp4' | |||
// } else if (this.sensorId == 'SXT002') { | |||
// this.videoUrl = 'http://123.57.209.16:8004/video/5.mp4' | |||
// } else if (this.sensorId == 'SXT003') { | |||
// this.videoUrl = 'http://123.57.209.16:8004/video/2.mp4' | |||
// } | |||
// // this.videoUrl = data.rtsPullStreamUrls[0].url; | |||
// this.streamId = data.streamId; | |||
// this.videoToken = data.videoToken; | |||
// this.setVideo() | |||
// } | |||
// }) | |||
if (this.sensorId == 'SXT001') { | |||
this.videoUrl = 'http://123.57.209.16:8004/video/1.mp4' | |||
} else if (this.sensorId == 'SXT002') { | |||
this.videoUrl = 'http://123.57.209.16:8004/video/5.mp4' | |||
} else if (this.sensorId == 'SXT003') { | |||
this.videoUrl = 'http://123.57.209.16:8004/video/2.mp4' | |||
} | |||
// this.videoUrl = data.rtsPullStreamUrls[0].url; | |||
this.setVideo() | |||
}, | |||
confirmVideo() { | |||
this.showVideo = false; | |||
@@ -443,17 +466,20 @@ | |||
align-items: center; | |||
padding: 0 25rpx; | |||
background: #fff; | |||
.title { | |||
font-weight: 700; | |||
font-size: 28rpx; | |||
} | |||
.closes { | |||
// background: #ccc; | |||
} | |||
} | |||
.botbox { | |||
height:calc(100% - 80rpx); | |||
height: calc(100% - 80rpx); | |||
} | |||
} | |||