|
|
@@ -1,10 +1,10 @@
|
|
|
<template>
|
|
|
<div class="videoBroadcastHls">
|
|
|
+ <div class="top-button-box">
|
|
|
+ <p :class="checkType == 1?'checkP':''" @click="checkButton(1)">实验室监控</p>
|
|
|
+ <p :class="checkType == 2?'checkP':''" @click="checkButton(2)">楼道监控</p>
|
|
|
+ </div>
|
|
|
<div class="top-video-box">
|
|
|
- <div class="top-button-box">
|
|
|
- <p :class="checkType == 1?'checkP':''" @click="checkButton(1)">实验室监控</p>
|
|
|
- <p :class="checkType == 2?'checkP':''" @click="checkButton(2)">楼道监控</p>
|
|
|
- </div>
|
|
|
<p class="null-text" v-if="nullType">{{nullType}}</p>
|
|
|
<div class="video-max-box" v-if="buttonType&&!fullVideoType">
|
|
|
<video class="video-box" id="video" controls autoplay muted
|
|
|
@@ -140,7 +140,6 @@
|
|
|
response.data[i].type = false;
|
|
|
}
|
|
|
this.$set(this, 'trumpetList', response.data)
|
|
|
- this.$set(this, 'voiceType', true)
|
|
|
})
|
|
|
iotCameraFindByCondition(obj).then(response => {
|
|
|
if (!response.data.records[0]){
|
|
|
@@ -287,25 +286,26 @@
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
overflow: hidden;
|
|
|
+ .top-button-box{
|
|
|
+ display: flex;
|
|
|
+ border-bottom:1px solid #999;
|
|
|
+ height:80px;
|
|
|
+ p{
|
|
|
+ flex:1;
|
|
|
+ text-align: center;
|
|
|
+ font-size:36px;
|
|
|
+ line-height:80px;
|
|
|
+ height:80px;
|
|
|
+ color:#999;
|
|
|
+ }
|
|
|
+ .checkP{
|
|
|
+ background-color: #0183FA;
|
|
|
+ color:#fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
.top-video-box{
|
|
|
flex:1;
|
|
|
overflow-y: scroll;
|
|
|
- .top-button-box{
|
|
|
- display: flex;
|
|
|
- border-bottom:1px solid #999;
|
|
|
- p{
|
|
|
- flex:1;
|
|
|
- text-align: center;
|
|
|
- font-size:36px;
|
|
|
- line-height:80px;
|
|
|
- height:80px;
|
|
|
- color:#999;
|
|
|
- }
|
|
|
- .checkP{
|
|
|
- background-color: #0183FA;
|
|
|
- color:#fff;
|
|
|
- }
|
|
|
- }
|
|
|
.null-text{
|
|
|
text-align: center;
|
|
|
font-size:16px;
|