2023年4月22日 修改播放标题
This commit is contained in:
parent
1eb83893d1
commit
fff7d41efa
|
@ -36,9 +36,9 @@
|
||||||
<!-- </a-col> -->
|
<!-- </a-col> -->
|
||||||
<!-- </a-row> -->
|
<!-- </a-row> -->
|
||||||
<div>
|
<div>
|
||||||
|
<a-card :title="mainVideoCardBoxTitle" class="videoCardMain">
|
||||||
|
<video id="mainVideo" v-bind="videoOption" style="width:100%" @click.prevent.stop></video>
|
||||||
<video id="mainVideo" v-bind="videoOption" style="width:100%" @click.prevent.stop></video>
|
</a-card>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;flex-direction: row;flex-wrap: nowrap;overflow-x: scroll;">
|
<div style="display: flex;flex-direction: row;flex-wrap: nowrap;overflow-x: scroll;">
|
||||||
<div v-for="(item,index) of calcOtherVideo()" class="videoMax">
|
<div v-for="(item,index) of calcOtherVideo()" class="videoMax">
|
||||||
|
@ -95,6 +95,7 @@ const _document = window.document;
|
||||||
const leftList = <any>ref([]);
|
const leftList = <any>ref([]);
|
||||||
const currentItem = <any>ref({});
|
const currentItem = <any>ref({});
|
||||||
const topWidth = <any>ref('0');
|
const topWidth = <any>ref('0');
|
||||||
|
const mainVideoCardBoxTitle = <any>ref('');
|
||||||
|
|
||||||
const videoOption = reactive({
|
const videoOption = reactive({
|
||||||
// width: '800', //播放器高度
|
// width: '800', //播放器高度
|
||||||
|
@ -180,12 +181,12 @@ function playerVideo(item){
|
||||||
console.log(`🚀 ~ file: index.vue:148 ~ playerVideo ~ x:`, x);
|
console.log(`🚀 ~ file: index.vue:148 ~ playerVideo ~ x:`, x);
|
||||||
console.log(`🚀 ----------------------------------------------🚀`);
|
console.log(`🚀 ----------------------------------------------🚀`);
|
||||||
// x.connectFn('rtsp://admin:admin@10.250.116.235:8554/live','external')
|
// x.connectFn('rtsp://admin:admin@10.250.116.235:8554/live','external')
|
||||||
// if(Number(Number(Math.random()).toFixed(1))*10 >= 5){
|
if(Number(Number(Math.random()).toFixed(1))*10 >= 5){
|
||||||
// x.connectFn('rtsp://127.0.0.1:8554/video','external');
|
x.connectFn('rtsp://127.0.0.1:8554/video','external');
|
||||||
// }else{
|
}else{
|
||||||
// x.connectFn(`rtsp://${x.ip}/live`,'external')
|
x.connectFn(`rtsp://${x.ip}/live`,'external')
|
||||||
// }
|
}
|
||||||
// return;
|
return;
|
||||||
if(x.changshang == '奥威亚'){
|
if(x.changshang == '奥威亚'){
|
||||||
x.connectFn(`rtsp://${x.ip}/stream/0?config.login=web`,'external')
|
x.connectFn(`rtsp://${x.ip}/stream/0?config.login=web`,'external')
|
||||||
}else if(x.changshang == '卓智'){
|
}else if(x.changshang == '卓智'){
|
||||||
|
@ -217,8 +218,14 @@ function switchVideoToMain(){
|
||||||
console.log(`🚀 ------------------------------------------------------------------------------------🚀`);
|
console.log(`🚀 ------------------------------------------------------------------------------------🚀`);
|
||||||
|
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
|
let firstBox = <HTMLVideoElement> document.querySelector('.videoMax');
|
||||||
|
let titleBox = <HTMLVideoElement> firstBox?.querySelector('.ant-card-head-title');
|
||||||
|
let title = titleBox?.textContent;
|
||||||
|
|
||||||
|
mainVideoCardBoxTitle.value = title;
|
||||||
|
|
||||||
let mainVideo = <HTMLVideoElement> document.querySelector('#mainVideo');
|
let mainVideo = <HTMLVideoElement> document.querySelector('#mainVideo');
|
||||||
let firstVideo = <HTMLVideoElement> document.querySelector('.videoMax video');
|
let firstVideo = <HTMLVideoElement> firstBox.querySelector('video');
|
||||||
mainVideo.srcObject = firstVideo.srcObject
|
mainVideo.srcObject = firstVideo.srcObject
|
||||||
mainVideo.play();
|
mainVideo.play();
|
||||||
});
|
});
|
||||||
|
@ -227,6 +234,13 @@ function switchVideoToMain(){
|
||||||
function bVideoClick(e){
|
function bVideoClick(e){
|
||||||
let mainVideo = <HTMLVideoElement> document.querySelector('#mainVideo');
|
let mainVideo = <HTMLVideoElement> document.querySelector('#mainVideo');
|
||||||
let currentVideo = <HTMLVideoElement> e.srcElement;
|
let currentVideo = <HTMLVideoElement> e.srcElement;
|
||||||
|
|
||||||
|
let title = currentVideo?.parentElement?.parentElement?.querySelector('.ant-card-head-title')?.textContent
|
||||||
|
mainVideoCardBoxTitle.value = title;
|
||||||
|
console.log(`🚀 --------------------------------------------------------------------🚀`);
|
||||||
|
console.log(`🚀 ~ file: index.vue:238 ~ bVideoClick ~ currentVideo:`, currentVideo);
|
||||||
|
console.log(`🚀 --------------------------------------------------------------------🚀`);
|
||||||
|
|
||||||
mainVideo.srcObject = currentVideo.srcObject
|
mainVideo.srcObject = currentVideo.srcObject
|
||||||
mainVideo.play();
|
mainVideo.play();
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue