Merge branch 'master' of http://47.115.223.229:8888/yangjun/dbsd_kczx
This commit is contained in:
commit
6521014e90
|
|
@ -149,13 +149,14 @@ function handleZgtpf() {
|
|||
}
|
||||
|
||||
function handleHqjg(record){
|
||||
console.log(record);
|
||||
// console.log(record);
|
||||
// defHttp.post({url:'/wjxDjxx/updateDjjg',params:record}).then(res=>{
|
||||
// console.log('-->',res)
|
||||
// reload();
|
||||
// })
|
||||
loadingCeshi.value = true;
|
||||
defHttp.post({url:'/wjxDjxx/getDjjg',params:record}).then(res=>{
|
||||
console.log('-->',res)
|
||||
// console.log('-->',res)
|
||||
loadingCeshi.value = false;
|
||||
reload();
|
||||
})
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<a-layout-content>
|
||||
<div style="width:100%;height: 100%;margin-top: 1rem;" v-if="!isError">
|
||||
<a-row :gutter="[16,16]">
|
||||
<a-col :xs="{ span: 24 }" :sm="{ span: 19 }" :lg="{ span: 19 }">
|
||||
<a-col span="24">
|
||||
<div>
|
||||
<a-card class="videoCardMain" style="width:100%">
|
||||
<template #title>
|
||||
|
|
@ -53,33 +53,134 @@
|
|||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-row>
|
||||
<a-col :span="fpxsShow=='1'?24:18" style="padding: 4px;">
|
||||
<a-row style="background: black;line-height: 70px;">
|
||||
<!-- 单屏及双屏显示 -->
|
||||
<a-col :span="fpxsShow=='1'?24:12" v-show="fpxsShow==1 || fpxsShow==2" style="padding: 4px;">
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo ref="mainVideo" videoId="mainVideo" :videoOption="{ autoplay: true}" @load-end="mainVideoLoadEnd"/>
|
||||
</div>
|
||||
<div class="s-full" v-if="fpxsShow != '1'">
|
||||
{{checkTitle}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="s-video" >
|
||||
<bVideo ref="mainVideo" videoId="mainVideo" :videoOption="{ autoplay: true}" @load-end="mainVideoLoadEnd"/>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="6" v-show="fpxsShow=='2'">
|
||||
<a-row :class="videoFpName">
|
||||
<a-col :span="24" style="padding: 3px;" v-for="(item,index) in fpData" @click="changeLive2(item)" v-show="item.sfxs=='1' && checkTitle != item.xm">
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo :key="'other2-'+index" :ref="el=> bVideoRefs['other2-'+item.id] = el" :videoId="'other2-'+item.id" :src="item.pullUrl" :videoOption="{ autoplay: true, controls: false }" @load-end="loadEnd"/>
|
||||
</div>
|
||||
<div class="s-full">
|
||||
{{item.xm}}
|
||||
</div>
|
||||
<!-- 双屏显示 -->
|
||||
<a-col :span="12" v-show="fpxsShow==2">
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo ref="mainVideo2" videoId="mainVideo2" :videoOption="{ autoplay: true}" @load-end="loadEnd"/>
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
<!-- 四屏显示 -->
|
||||
<a-col :span="12" style="padding: 5px;" v-show="fpxsShow=='3' && item.sfxs=='1' && checkTitle != item.xm" v-for="(item,index) in fpData">
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo :key="'other2-'+index" :ref="el=> bVideoRefs['other2-'+item.id] = el" :videoId="'other2-'+item.id" :src="item.pullUrl" :videoOption="{ autoplay: true, controls: false }" @load-end="loadEnd"/>
|
||||
</div>
|
||||
<div class="s-full">
|
||||
{{item.xm}}
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
<!-- 讲座模式 -->
|
||||
<!-- 1单屏 2双屏 3四屏 4讲座模式1 5讲座模式2 6讲座模式3 -->
|
||||
<a-col :span="24" style="padding: 5px;" v-show="fpxsShow=='4'|| fpxsShow=='5' || fpxsShow=='6'" >
|
||||
<a-row>
|
||||
<a-col :span="18" style="padding: 4px;">
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo ref="mainJzmsPPTVideo" videoId="mainJzmsPPTVideo" :videoOption="{ autoplay: true, controls: false}" @load-end="loadEnd"/>
|
||||
</div>
|
||||
<div class="s-full" v-if="fpxsShow != '1'">
|
||||
PPT
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="6" :style="`margin-top:${fpxsShow=='4'?'130px':fpxsShow=='5'?'80px':''}`">
|
||||
<a-row :class="videoFpName">
|
||||
<a-col :span="24" style="padding: 3px;" v-show="fpxsShow=='4' || fpxsShow=='5' || fpxsShow=='6'">
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo ref="mainJzms1Video" videoId="mainJzms1Video" :videoOption="{ autoplay: true, controls: false}" @load-end="loadEnd"/>
|
||||
</div>
|
||||
<div class="s-full">
|
||||
教师近景
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="24" style="padding: 3px;" v-show="fpxsShow=='5' || fpxsShow=='6'" >
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo ref="mainJzms2Video" videoId="mainJzms2Video" :videoOption="{ autoplay: true, controls: false}" @load-end="loadEnd"/>
|
||||
</div>
|
||||
<div class="s-full">
|
||||
学生全景
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="24" style="padding: 3px;" v-show="fpxsShow=='6'" >
|
||||
<div class="s-video-all" >
|
||||
<div class="s-video" >
|
||||
<bVideo ref="mainJzms3Video" videoId="mainJzms3Video" :videoOption="{ autoplay: true, controls: false}" @load-end="loadEnd"/>
|
||||
</div>
|
||||
<div class="s-full">
|
||||
教师全景
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
|
||||
|
||||
<a-col span="24" style="background: black;line-height: 70px;">
|
||||
<a-row style="text-align: center;">
|
||||
<a-col span="4">
|
||||
<a-popover>
|
||||
<template #content>
|
||||
<a-radio-group v-model:value="spyCheck">
|
||||
<template v-for="(item,i) in fpData" :key="i">
|
||||
<a-radio :value="item.xm" @click="changeLive(item)">{{ item.xm }}</a-radio><br/>
|
||||
</template>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
<a-button type="primary" @click="handlePmms('1')">单屏模式</a-button>
|
||||
</a-popover>
|
||||
</a-col>
|
||||
<a-col span="4">
|
||||
<a-popover>
|
||||
<template #content>
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
<div>左屏幕</div>
|
||||
<a-radio-group v-model:value="spyCheck">
|
||||
<template v-for="(item,i) in fpData" :key="i">
|
||||
<a-radio :value="item.xm" @click="changeLeftLive(item)" >{{ item.xm }}</a-radio><br/>
|
||||
</template>
|
||||
</a-radio-group>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div>右屏幕</div>
|
||||
<a-radio-group v-model:value="spy2Check">
|
||||
<template v-for="(item,i) in fpData" :key="i">
|
||||
<a-radio :value="item.xm" @click="changeRightLive(item)">{{ item.xm }}</a-radio><br/>
|
||||
</template>
|
||||
</a-radio-group>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
<a-button type="primary" @click="handlePmms('2')">双屏模式</a-button>
|
||||
</a-popover>
|
||||
</a-col>
|
||||
<a-col span="4"><a-button type="primary" @click="handlePmms('3')">四屏模式</a-button></a-col>
|
||||
<a-col span="4"><a-button type="primary" @click="handlePmms('4')">讲座模式1</a-button></a-col>
|
||||
<a-col span="4"><a-button type="primary" @click="handlePmms('5')">讲座模式2</a-button></a-col>
|
||||
<a-col span="4"><a-button type="primary" @click="handlePmms('6')">讲座模式3</a-button></a-col>
|
||||
</a-row>
|
||||
</a-col>
|
||||
|
||||
|
||||
<div class="jxDiv">
|
||||
<a-space>
|
||||
|
|
@ -107,7 +208,7 @@
|
|||
</a-card>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :xs="{ span: 24 }" :sm="{ span: 5 }" :lg="{ span: 5 }">
|
||||
<!-- <a-col :xs="{ span: 24 }" :sm="{ span: 5 }" :lg="{ span: 5 }">
|
||||
<a-row>
|
||||
|
||||
<a-col :span="24" v-for="(item,index) of tableData" style="text-align: center;" :key="'col-'+index">
|
||||
|
|
@ -149,7 +250,7 @@
|
|||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-col>
|
||||
</a-col> -->
|
||||
</a-row>
|
||||
</div>
|
||||
<div v-else style="height: 100%;display: flex;justify-content: center;align-items: center;">
|
||||
|
|
@ -212,6 +313,7 @@ const tingKeZuJiAddModal = ref<any>({});
|
|||
const curentPlayerVideo = ref<any>({});
|
||||
const kcCardBoxTitle = ref<any>('');
|
||||
const spyCheck = ref<any>([]);
|
||||
const spy2Check = ref<any>([]);
|
||||
const ktangInfo = ref<any>({});
|
||||
// const jxdgInfo = ref<any>({});
|
||||
const mainVideoCardBoxTitle = ref<any>('');
|
||||
|
|
@ -266,9 +368,7 @@ function handleSpy(record){
|
|||
}
|
||||
|
||||
var ttb = spyCheck.value.join(",").replaceAll(checkTitle.value,"");
|
||||
console.log("🚀 ~ handleSpy ~ ttb:", ttb)
|
||||
var ttc = ttb.split(",").filter(item => item.trim() !== '');
|
||||
console.log("🚀 ~ handleSpy ~ ttc:", ttc)
|
||||
if(ttc.length == 2){
|
||||
videoFpName.value = "className3"
|
||||
}else if(ttc.length == 1){
|
||||
|
|
@ -279,6 +379,70 @@ function handleSpy(record){
|
|||
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param pmtype 1单屏 2双屏 3四屏 4讲座模式1 5讲座模式2 6讲座模式3
|
||||
*/
|
||||
function handlePmms(pmtype){
|
||||
fpxsShow.value = pmtype;
|
||||
|
||||
if(pmtype == '4'){
|
||||
|
||||
let item= tableData.value.find(x => x.xm == 'PPT') || {};
|
||||
let url = item.pullUrl;
|
||||
let mainJzmsPPTVideo = document.querySelector<any>('#mainJzmsPPTVideo');
|
||||
mainJzmsPPTVideo?.player?.src([{ type:'application/x-mpegURL',src: url }]);
|
||||
|
||||
|
||||
let item2= tableData.value.find(x => x.xm == '教师近景') || {};
|
||||
let url2 = item2.pullUrl;
|
||||
let mainJzms1Video = document.querySelector<any>('#mainJzms1Video');
|
||||
mainJzms1Video?.player?.src([{ type:'application/x-mpegURL',src: url2 }]);
|
||||
}else if(pmtype == '5'){
|
||||
let item= tableData.value.find(x => x.xm == 'PPT') || {};
|
||||
let url = item.pullUrl;
|
||||
let mainJzmsPPTVideo = document.querySelector<any>('#mainJzmsPPTVideo');
|
||||
mainJzmsPPTVideo?.player?.src([{ type:'application/x-mpegURL',src: url }]);
|
||||
|
||||
|
||||
let item2= tableData.value.find(x => x.xm == '教师近景') || {};
|
||||
let url2 = item2.pullUrl;
|
||||
let mainJzms1Video = document.querySelector<any>('#mainJzms1Video');
|
||||
mainJzms1Video?.player?.src([{ type:'application/x-mpegURL',src: url2 }]);
|
||||
|
||||
let item3= tableData.value.find(x => x.xm == '学生全景') || {};
|
||||
let url3 = item3.pullUrl;
|
||||
let mainJzms2Video = document.querySelector<any>('#mainJzms2Video');
|
||||
mainJzms2Video?.player?.src([{ type:'application/x-mpegURL',src: url3 }]);
|
||||
|
||||
}else if(pmtype == '6'){
|
||||
let item= tableData.value.find(x => x.xm == 'PPT') || {};
|
||||
let url = item.pullUrl;
|
||||
let mainJzmsPPTVideo = document.querySelector<any>('#mainJzmsPPTVideo');
|
||||
mainJzmsPPTVideo?.player?.src([{ type:'application/x-mpegURL',src: url }]);
|
||||
|
||||
|
||||
let item2= tableData.value.find(x => x.xm == '教师近景') || {};
|
||||
let url2 = item2.pullUrl;
|
||||
let mainJzms1Video = document.querySelector<any>('#mainJzms1Video');
|
||||
mainJzms1Video?.player?.src([{ type:'application/x-mpegURL',src: url2 }]);
|
||||
|
||||
let item3= tableData.value.find(x => x.xm == '学生全景') || {};
|
||||
let url3 = item3.pullUrl;
|
||||
let mainJzms2Video = document.querySelector<any>('#mainJzms2Video');
|
||||
mainJzms2Video?.player?.src([{ type:'application/x-mpegURL',src: url3 }]);
|
||||
|
||||
let item4= tableData.value.find(x => x.xm == '教师全景') || {};
|
||||
let url4 = item4.pullUrl;
|
||||
let mainJzms3Video = document.querySelector<any>('#mainJzms3Video');
|
||||
mainJzms3Video?.player?.src([{ type:'application/x-mpegURL',src: url4 }]);
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
if(route.query.id){
|
||||
model.notes = '';
|
||||
|
|
@ -394,24 +558,24 @@ function changeLive(item:any){
|
|||
fpxsShow.value = '1'
|
||||
let url = item.pullUrl
|
||||
let mainVideo = document.querySelector<any>('#mainVideo');
|
||||
// mainVideo?.player?.src([{ type:'application/x-mpegURL',src: 'http://127.0.0.1/live_hls/a.m3u8' }])
|
||||
mainVideo?.player?.src([{ type:'application/x-mpegURL',src: url }])
|
||||
|
||||
mainVideoCardBoxTitle.value = item.jsmc+" "+item.xm;
|
||||
console.log(`🚀 --------------------------------------------------------------------------------🚀`);
|
||||
console.log(`🚀 ~ file: viewPage.vue:164 ~ changeLive ~ mainVideo?.player:`, mainVideo?.player);
|
||||
console.log(`🚀 --------------------------------------------------------------------------------🚀`);
|
||||
// let buttonEl = mainVideo?.player.el().querySelector('.changeDefinitionBtn');
|
||||
//赋值原URL
|
||||
// if(buttonEl){
|
||||
// buttonEl.dataset.url = url;
|
||||
// }
|
||||
|
||||
curentPlayerVideo.value = item;
|
||||
// nextTick(() => {
|
||||
//增加自动播放功能
|
||||
//mainVideo?.player?.play();
|
||||
// })
|
||||
}
|
||||
//选择左屏
|
||||
function changeLeftLive(item:any){
|
||||
fpxsShow.value = '2'
|
||||
let url = item.pullUrl
|
||||
let mainVideo = document.querySelector<any>('#mainVideo');
|
||||
mainVideo?.player?.src([{ type:'application/x-mpegURL',src: url }])
|
||||
}
|
||||
|
||||
//选择右屏
|
||||
function changeRightLive(item:any){
|
||||
fpxsShow.value = '2'
|
||||
let url = item.pullUrl
|
||||
let mainVideo = document.querySelector<any>('#mainVideo2');
|
||||
mainVideo?.player?.src([{ type:'application/x-mpegURL',src: url }])
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -722,6 +886,8 @@ video::-webkit-media-controls-timeline {
|
|||
cursor: pointer;
|
||||
background: #c0c0c0;
|
||||
border-radius: 5px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@
|
|||
<a-col :lg="6">
|
||||
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
|
||||
<a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls" style="margin-left: 8px"> 导出</a-button>
|
||||
<a-button type="primary" preIcon="ant-design:export-outlined" @click="handleCsbz" style="margin-left: 8px" hidden> 修复次数不足的问题</a-button>
|
||||
<a-button type="primary" preIcon="ant-design:export-outlined" @click="handleCsbz" style="margin-left: 8px" hidden > 修复次数不足的问题</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-col>
|
||||
|
|
|
|||
Loading…
Reference in New Issue