施工管控

This commit is contained in:
cwchen 2024-08-22 17:08:15 +08:00
parent 157a826585
commit da61132e87
1 changed files with 34 additions and 7 deletions

View File

@ -49,12 +49,19 @@
<!-- 视频 -->
<div class="center">
<div class="change-box layout">
<el-button type="primary" plain>1</el-button>
<el-button type="primary" plain>4</el-button>
<el-button type="primary" plain @click="changePlayVideo(1)">1</el-button>
<el-button type="primary" plain @click="changePlayVideo(4)">4</el-button>
</div>
<!-- 球机视频 -->
<div class="video-box">
<video id="videoPlayer1" class="ball-content" autoplay="autoplay" loop="loop" muted controls="controls"></video>
<div class="video-box layout">
<video v-if="boxNum == 1 || boxNum == 4" id="videoPlayer1" :class="classStyle" autoplay="autoplay" loop="loop"
muted controls="controls"></video>
<video v-if="boxNum == 4" id="videoPlayer2" :class="classStyle" autoplay="autoplay" loop="loop" muted
controls="controls"></video>
<video v-if="boxNum == 4" id="videoPlayer3" :class="classStyle" autoplay="autoplay" loop="loop" muted
controls="controls"></video>
<video v-if="boxNum == 4" id="videoPlayer4" :class="classStyle" autoplay="autoplay" loop="loop" muted
controls="controls"></video>
</div>
<!-- 违章识别 -->
<div class="vio-box">
@ -129,7 +136,10 @@ export default {
loading: false,
//
isHasData: true,
busy: true
busy: true,
//
boxNum: 1,
classStyle: 'ball-content'
};
},
created() {
@ -262,8 +272,15 @@ export default {
//
loadVioInfos(newIndex, oldIndex) {
this.loadPhotosById(newIndex);
// alert(newIndex)
// alert(oldIndex)
},
//
changePlayVideo(type) {
this.boxNum = type;
if (type == 1) {
this.classStyle = 'ball-content'
} else {
this.classStyle = 'ball-content-4'
}
},
//icon
renderContent(h, { node, data }) {
@ -497,6 +514,9 @@ export default {
.video-box {
width: 100%;
height: calc(100% - 275px);
flex-wrap: wrap;
align-items: center;
justify-content: space-around;
}
.ball-content {
@ -506,6 +526,13 @@ export default {
object-fit: fill;
}
.ball-content-4 {
width: 49.5%;
height: 49%;
pointer-events: none;
object-fit: fill;
}
.vio-box {
width: 100%;
height: 200px;