Merge branch 'bjxz-dev' of http://139.9.66.234:18023/dhp/zhgdyunapp into bjxz-dev

This commit is contained in:
Vce 2024-05-28 11:03:34 +08:00
commit 8e6b41b9f9
3 changed files with 287 additions and 317 deletions

View File

@ -100,10 +100,10 @@
<view class="uni-form-label">
车牌照片
</view>
<view class="uni-form-input" style="display: inline-flex;">
<view class="imgBox" v-show="form.carPhotosUrl">
<image :src="url_config+'image/'+form.carPhotosUrl" class="img"></image>
<uni-icons @click="deleteImg(1)" class="deleteImg" type="clear" size="24"></uni-icons>
<view class="uni-form-input" style="display: flex;align-items: center;flex-wrap: wrap;">
<view class="imgBox" v-for="(item,index) in form.carPhotosUrl" :key="index">
<image :src="url_config+'image/'+item.url" class="img"></image>
<uni-icons2 @click="deleteImg(1,index)" class="deleteImg" type="clear" size="24"></uni-icons2>
</view>
<view class="addImgBox" @click="selectImg(1)">
<image src="/static/icon-add.png" class="icon-add"></image>
@ -114,10 +114,10 @@
<view class="uni-form-label">
驾驶证
</view>
<view class="uni-form-input" style="display: inline-flex;">
<view class="imgBox" v-show="form.jsz">
<image :src="url_config+'image/'+form.jsz" class="img"></image>
<uni-icons @click="deleteImg(2)" class="deleteImg" type="clear" size="24"></uni-icons>
<view class="uni-form-input" style="display: flex;align-items: center;flex-wrap: wrap;">
<view class="imgBox" v-for="(item,index) in form.jsz" :key="index">
<image :src="url_config+'image/'+item.url" class="img"></image>
<uni-icons2 @click="deleteImg(2,index)" class="deleteImg" type="clear" size="24"></uni-icons2>
</view>
<view class="addImgBox" @click="selectImg(2)">
<image src="/static/icon-add.png" class="icon-add"></image>
@ -128,10 +128,10 @@
<view class="uni-form-label">
行驶证
</view>
<view class="uni-form-input" style="display: inline-flex;">
<view class="imgBox" v-show="form.xsz">
<image :src="url_config+'image/'+form.xsz" class="img"></image>
<uni-icons @click="deleteImg(3)" class="deleteImg" type="clear" size="24"></uni-icons>
<view class="uni-form-input" style="display: flex;align-items: center;flex-wrap: wrap;">
<view class="imgBox" v-for="(item,index) in form.xsz" :key="index">
<image :src="url_config+'image/'+item.url" class="img"></image>
<uni-icons2 @click="deleteImg(3,index)" class="deleteImg" type="clear" size="24"></uni-icons2>
</view>
<view class="addImgBox" @click="selectImg(3)">
<image src="/static/icon-add.png" class="icon-add"></image>
@ -142,10 +142,10 @@
<view class="uni-form-label">
交强险
</view>
<view class="uni-form-input" style="display: inline-flex;">
<view class="imgBox" v-show="form.jqx">
<image :src="url_config+'image/'+form.jqx" class="img"></image>
<uni-icons @click="deleteImg(4)" class="deleteImg" type="clear" size="24"></uni-icons>
<view class="uni-form-input" style="display: flex;align-items: center;flex-wrap: wrap;">
<view class="imgBox" v-for="(item,index) in form.jqx" :key="index">
<image :src="url_config+'image/'+item.url" class="img"></image>
<uni-icons2 @click="deleteImg(4,index)" class="deleteImg" type="clear" size="24"></uni-icons2>
</view>
<view class="addImgBox" @click="selectImg(4)">
<image src="/static/icon-add.png" class="icon-add"></image>
@ -156,10 +156,10 @@
<view class="uni-form-label">
其他证明
</view>
<view class="uni-form-input" style="display: inline-flex;">
<view class="imgBox" v-show="form.otherProve">
<image :src="url_config+'image/'+form.otherProve" class="img"></image>
<uni-icons @click="deleteImg(5)" class="deleteImg" type="clear" size="24"></uni-icons>
<view class="uni-form-input" style="display: flex;align-items: center;flex-wrap: wrap;">
<view class="imgBox" v-for="(item,index) in form.otherProve" :key="index">
<image :src="url_config+'image/'+item.url" class="img"></image>
<uni-icons2 @click="deleteImg(5,index)" class="deleteImg" type="clear" size="24"></uni-icons2>
</view>
<view class="addImgBox" @click="selectImg(5)">
<image src="/static/icon-add.png" class="icon-add"></image>
@ -203,7 +203,7 @@
</view>
</view>
<view class="uni-form-item">
<view class="uni-form-item" v-show="[1,2].includes(form.carModuleType)">
<view class="uni-form-label">
<text class="star">*</text>
司机姓名
@ -330,18 +330,19 @@
carModuleType: 1,
carColor: "",
carNumber: "",
carPhotosUrl: "",
jsz: "",
xsz: "",
jqx: "",
otherProve: "",
carPhotosUrl: [],
jsz: [],
xsz: [],
jqx: [],
otherProve: [],
carType: "",
driverName: "",
driverTelephone: "",
driverWorkerName: "",
outsideDriverIdCard: "",
isBlack: '',
projectSn: ''
projectSn: '',
entryAndExitPermit: 0
},
personList: [],
projectDetail: {},
@ -467,37 +468,35 @@
success: (uploadFileRes) => {
console.log(uploadFileRes.data);
if (type == 1) {
that.form.carPhotosUrl = JSON.parse(uploadFileRes.data).data[0]
.imageUrl
that.form.carPhotosUrl.push({name: "",url: JSON.parse(uploadFileRes.data).data[0].imageUrl})
// that.form.carPhotosUrl = JSON.parse(uploadFileRes.data).data[0]
// .imageUrl
} else if (type == 2) {
that.form.jsz = JSON.parse(uploadFileRes.data).data[0]
.imageUrl
that.form.jsz.push({name: "",url: JSON.parse(uploadFileRes.data).data[0].imageUrl})
} else if (type == 3) {
that.form.xsz = JSON.parse(uploadFileRes.data).data[0]
.imageUrl
that.form.xsz.push({name: "",url: JSON.parse(uploadFileRes.data).data[0].imageUrl})
} else if (type == 4) {
that.form.jqx = JSON.parse(uploadFileRes.data).data[0]
.imageUrl
that.form.jqx.push({name: "",url: JSON.parse(uploadFileRes.data).data[0].imageUrl})
} else if (type == 5) {
that.form.otherProve = JSON.parse(uploadFileRes.data).data[0]
.imageUrl
that.form.otherProve.push({name: "",url: JSON.parse(uploadFileRes.data).data[0].imageUrl})
}
}
});
}
})
},
deleteImg(type) {
deleteImg(type,index) {
if (type == 1) {
this.form.carPhotosUrl = ''
this.form.carPhotosUrl.splice(index,1)
// this.form.carPhotosUrl = ''
} else if (type == 2) {
this.form.jsz = ''
this.form.jsz.splice(index,1)
} else if (type == 3) {
this.form.xsz = ''
this.form.xsz.splice(index,1)
} else if (type == 4) {
this.form.jqx = ''
this.form.jqx.splice(index,1)
} else if (type == 5) {
this.form.otherProve = ''
this.form.otherProve.splice(index,1)
}
},
radioChange(e) {
@ -588,53 +587,53 @@
if (that.form.carPhotosUrl) {
var arr = JSON.parse(that.form.carPhotosUrl)
if (arr.length > 0) {
that.form.carPhotosUrl = arr[0].url
that.form.carPhotosUrl = arr
} else {
that.form.carPhotosUrl = ''
that.form.carPhotosUrl = []
}
} else {
that.form.carPhotosUrl = ''
that.form.carPhotosUrl = []
}
if (that.form.jsz) {
var arr = JSON.parse(that.form.jsz)
if (arr.length > 0) {
that.form.jsz = arr[0].url
that.form.jsz = arr
} else {
that.form.jsz = []
}
} else {
that.form.jsz = ''
that.form.jsz = []
}
} else {
that.form.jsz = ''
}
if (that.form.xsz) {
var arr = JSON.parse(that.form.xsz)
if (arr.length > 0) {
that.form.xsz = arr[0].url
that.form.xsz = arr
} else {
that.form.xsz = []
}
} else {
that.form.xsz = ''
that.form.xsz = []
}
} else {
that.form.xsz = ''
}
if (that.form.jqx) {
var arr = JSON.parse(that.form.jqx)
if (arr.length > 0) {
that.form.jqx = arr[0].url
that.form.jqx = arr
} else {
that.form.jqx = []
}
} else {
that.form.jqx = ''
that.form.jqx = []
}
} else {
that.form.jqx = ''
}
if (that.form.otherProve) {
var arr = JSON.parse(that.form.otherProve)
if (arr.length > 0) {
that.form.otherProve = arr[0].url
that.form.otherProve = arr
} else {
that.form.otherProve = []
}
} else {
that.form.otherProve = ''
that.form.otherProve = []
}
} else {
that.form.otherProve = ''
}
}
})
},
@ -710,6 +709,7 @@
return false;
}
if([1,2].includes(this.form.carModuleType)){
delete params.driverWorkerName;
if (this.driverNameIndex == null) {
uni.showToast({
title: '请选择司机姓名',
@ -729,13 +729,15 @@
}
let idCardReg = /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i
if([3].includes(this.form.carModuleType)){
if (!reg.test(params.outsideDriverIdCard)) {
if (!idCardReg.test(params.outsideDriverIdCard)) {
uni.showToast({
title: '请输入正确的身份证格式',
icon: 'none'
})
return false;
}
} else {
delete params.outsideDriverIdCard;
}
if (params.carNumber == '') {
uni.showToast({
@ -766,34 +768,23 @@
return false;
}
if (this.form.carPhotosUrl) {
params.carPhotosUrl = JSON.stringify([{
name: '',
url: this.form.carPhotosUrl
}])
params.carPhotosUrl = JSON.stringify(this.form.carPhotosUrl)
}
if (this.form.jsz) {
params.jsz = JSON.stringify([{
name: '',
url: this.form.jsz
}])
params.jsz = JSON.stringify(this.form.jsz)
}
if (this.form.xsz) {
params.xsz = JSON.stringify([{
name: '',
url: this.form.xsz
}])
params.xsz = JSON.stringify(this.form.xsz)
// params.xsz = JSON.stringify([{
// name: '',
// url: this.form.xsz
// }])
}
if (this.form.jqx) {
params.jqx = JSON.stringify([{
name: '',
url: this.form.jqx
}])
params.jqx = JSON.stringify(this.form.jqx)
}
if (this.form.otherProve) {
params.otherProve = JSON.stringify([{
name: '',
url: this.form.otherProve
}])
params.otherProve = JSON.stringify(this.form.otherProve)
}
params.carColor = this.colorList[this.selectIndex]
if (this.driverNameList[this.driverNameIndex]) {
@ -839,7 +830,6 @@
}
console.log(params, "params");
this.sendRequest({
url: url,
data: params,
@ -852,7 +842,7 @@
// })
uni.navigateTo({
url: './index'
url: './index?listType=1'
});
}
@ -897,7 +887,7 @@
display: inline-flex;
position: relative;
margin-right: 15px;
margin-bottom: 15rpx;
.img {
width: 100%;
height: 100%;

View File

@ -50,7 +50,7 @@
<text class="value">{{ item.location }}</text>
</view>
<view class="alarmItem">
<text class="label">颜色</text>
<text class="label">颜色</text>
<text class="value">{{ item.carColor }}</text>
</view>
<view class="alarmItem">

View File

@ -10,21 +10,20 @@
<video class="videoBox" id="myVideo" :custom-cache="false" :src="playUrlFilter" controls autoplay></video>
<view class="videoName">
{{videoInfo.videoName}}
<button v-if="videoInfo.videoType==3" type="primary" class="changeBtn btn"
@click="changeStreamFn">{{streamType==1?'切换到主码流':'切换到子码流'}}</button>
<button v-if="videoInfo.videoType==3" type="primary" class="changeBtn btn" @click="changeStreamFn">{{streamType==1?'切换到主码流':'切换到子码流'}}</button>
</view>
<view class="videoOperateBox">
<view class="box">
<image src="../../static/videoControlIcon/bg.png" class="bg"></image>
<view class="pic top" @click="controlVideoFn(0,0.2,0,'UP')"></view>
<view class="pic left" @click="controlVideoFn(-0.2,0,0,'LEFT')"></view>
<view class="pic bottom" @click="controlVideoFn(0,-0.2,0,'DOWN')"></view>
<view class="pic right" @click="controlVideoFn(0.2,0,0,'RIGHT')"></view>
<view class="pic top" :style="{backgroundImage: typeName == 'UP' && videoFlag?'url(../../static/videoControlIcon/top-active.png)':'url(../../static/videoControlIcon/top.png)'}" @click="controlVideoFn(0,0.2,0,'UP')"></view>
<view class="pic left" :style="{backgroundImage: typeName == 'LEFT' && videoFlag?'url(../../static/videoControlIcon/left-active.png)':'url(../../static/videoControlIcon/left.png)'}" @click="controlVideoFn(-0.2,0,0,'LEFT')"></view>
<view class="pic bottom" :style="{backgroundImage: typeName == 'DOWN' && videoFlag?'url(../../static/videoControlIcon/bottom-active.png)':'url(../../static/videoControlIcon/bottom.png)'}" @click="controlVideoFn(0,-0.2,0,'DOWN')"></view>
<view class="pic right" :style="{backgroundImage: typeName == 'RIGHT' && videoFlag?'url(../../static/videoControlIcon/right-active.png)':'url(../../static/videoControlIcon/right.png)'}" @click="controlVideoFn(0.2,0,0,'RIGHT')"></view>
<!-- <view class="pic center" @click="stop()"></view> -->
</view>
<view class="box2">
<view class="zoom zoomin" @click="controlVideoFn(0,0,0.2,'ZOOM_IN')"></view>
<view class="zoom zoomout" @click="controlVideoFn(0,0,-0.2,'ZOOM_OUT')"></view>
<view class="zoom zoomin" :style="{backgroundImage: typeName == 'ZOOM_IN' && videoFlag?'url(../../static/videoControlIcon/2.png)':'url(../../static/videoControlIcon/1.png)'}" @click="controlVideoFn(0,0,0.2,'ZOOM_IN')"></view>
<view class="zoom zoomout" :style="{backgroundImage: typeName == 'ZOOM_OUT' && videoFlag?'url(../../static/videoControlIcon/4.png)':'url(../../static/videoControlIcon/3.png)'}" @click="controlVideoFn(0,0,-0.2,'ZOOM_OUT')"></view>
</view>
</view>
<view class="video-playback" @click="toBackList">
@ -36,82 +35,70 @@
<script>
import headers from '../../components/headers/headers.vue'
export default {
components: {
headers
},
components:{headers},
data() {
return {
url: '', //rtsp://admin:jxj12345@192.168.0.64:554/h264/ch1/main/av_stream
videoInfo: {
videoName: '',
videoType: null
},
url:'',//rtsp://admin:jxj12345@192.168.0.64:554/h264/ch1/main/av_stream
videoInfo:{videoName:'',videoType:null},
streamType: 1, //1 2
videoResponseInfo: {},
videoFlag: false,
typeName: ""
};
},
onLoad(options) {
//videoType 123ISC456
// this.url = options.url
this.videoInfo = uni.getStorageSync('videoInfo')
if (this.videoInfo.videoType == 2) {
this.url = this.videoInfo.liveRadioUrl
} else {
this.videoInfo=uni.getStorageSync('videoInfo')
if(this.videoInfo.videoType==2){
this.url= this.videoInfo.liveRadioUrl
}else{
this.getPlayUrl()
}
},
computed: {
playUrlFilter() {
return this.url ? 'rtsp://42.180.188.17' + this.url.substring(20) : ""
playUrlFilter(){
return this.url?'rtsp://42.180.188.17'+this.url.substring(20):""
}
},
methods: {
methods:{
//
toBackList() {
toBackList(){
uni.navigateTo({
url: './playBackList?obj=' + JSON.stringify({
...this.videoResponseInfo,
...this.videoInfo
})
url: './playBackList?obj=' + JSON.stringify({...this.videoResponseInfo,...this.videoInfo})
})
},
changeStreamFn() {
if (this.streamType == 1) {
this.streamType = 2
} else {
this.streamType = 1
changeStreamFn(){
if(this.streamType==1){
this.streamType=2
}else{
this.streamType=1
}
this.getPlayUrl()
},
getPlayUrl() {
getPlayUrl(){
var that = this
var json = {
itemId: this.videoInfo.itemId
}
if (this.videoInfo.videoType == 3) {
json.streamType = this.streamType
json.type = 'rtsp' //rtsphls
var json ={itemId:this.videoInfo.itemId}
if(this.videoInfo.videoType==3){
json.streamType=this.streamType
json.type='rtsp' //rtsphls
}
this.sendRequest({
url: "xmgl/videoItem/getVideoItemInfo",
data: json,
method: "post",
success(res) {
switch (that.videoInfo.videoType) {
success(res){
switch (that.videoInfo.videoType){
case 1:
that.url = res.result.videoInfo.hdFlvAddress
that.url=res.result.videoInfo.hdFlvAddress
break;
default:
that.url = res.result.videoInfo.url
that.url=res.result.videoInfo.url
break;
}
that.videoResponseInfo = {
...res.result.projectVideoConfig,
...res.result.videoInfo
};
for (let i in that.videoResponseInfo) {
if (!that.videoResponseInfo[i]) {
that.videoResponseInfo = {...res.result.projectVideoConfig,...res.result.videoInfo};
for(let i in that.videoResponseInfo){
if(!that.videoResponseInfo[i]){
delete that.videoResponseInfo[i]
}
}
@ -119,41 +106,42 @@
})
},
controlVideoFn(pan, tilt, zoom, opType) {
this.typeName = opType
if (this.videoFlag) {
uni.showToast({
title: '不要重复点击',
icon: 'none'
title:'不要重复点击',
icon:'none'
})
return
}
if (this.videoInfo.deviceType != 2) {
if(this.videoInfo.deviceType!=2){
uni.showToast({
title: '该设备不是球机,不支持此操作',
icon: 'none'
title:'该设备不是球机,不支持此操作',
icon:'none'
})
return false
}
switch (this.videoInfo.videoType) {
switch (this.videoInfo.videoType){
case 3:
this.videoFlag = true;
this.videoFlag = true;
this.controlVideoFn_isc(opType)
break;
case 4:
this.videoFlag = true;
this.videoFlag = true;
this.controlVideoFn_dh(pan, tilt, zoom)
break;
default:
uni.showToast({
title: '暂不支持',
icon: 'none'
title:'暂不支持',
icon:'none'
})
break;
}
},
controlVideoFn_isc(opType) {
controlVideoFn_isc(opType){
let json = {
// cameraId: this.videoInfo.deviceSerial,
itemId: this.videoInfo.itemId,
itemId:this.videoInfo.itemId,
opType: opType,
opSize: 20,
opCode: 1
@ -163,18 +151,18 @@
url: "xmgl/videoItem/getHikPtzControl",
data: json,
method: "post",
success(res) {
success(res){
uni.showToast({
title: '控制成功',
icon: 'none'
title:'控制成功',
icon:'none'
})
},
complete() {
this.videoFlag = false;
that.videoFlag = false;
}
})
},
controlVideoFn_dh(pan, tilt, zoom) {
controlVideoFn_dh(pan, tilt, zoom){
var code = '';
var jsonStr = {
pan: pan,
@ -196,14 +184,14 @@
url: "xmgl/video/putPTZ",
data: json,
method: "get",
success(res) {
success(res){
uni.showToast({
title: '控制成功',
icon: 'none'
title:'控制成功',
icon:'none'
})
},
complete() {
this.videoFlag = false;
that.videoFlag = false;
}
})
}
@ -212,175 +200,167 @@
</script>
<style lang="scss" scoped>
/* #ifdef H5 */
.fullHeight {
background-color: #F4F5FD;
height: 100vh;
}
/* #ifdef H5 */
.fullHeight{
background-color: #F4F5FD;
height: 100vh;
}
/* #endif */
/* #endif */
/* #ifdef MP-WEIXIN */
.fullHeight{
background-color: #F4F5FD;
height: 100vh;
}
/* #endif */
/* #ifdef MP-WEIXIN */
.fullHeight {
background-color: #F4F5FD;
height: 100vh;
}
/* #endif */
/* #ifdef APP-PLUS */
.fullHeight {
background-color: #F4F5FD;
height: auto;
padding-bottom: 60rpx;
}
/* #endif */
.videoBox {
width: 100%;
}
.videoName {
font-size: 16px;
color: $uni-text-color;
font-weight: bold;
margin: 10px 15px;
position: relative;
.changeBtn {
position: absolute;
right: 0;
top: 0;
font-size: 12px;
}
}
.video-playback {
width: 454rpx;
height: 108rpx;
background: #FFFFFF;
border-radius: 31rpx;
text-align: center;
line-height: 108rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 40rpx;
color: #8D8D8D;
margin: 0 auto;
margin-top: 80rpx;
// position: fixed;
// bottom: 80rpx;
// left: 145rpx;
}
.videoOperateBox {
text-align: center;
padding-top: 10px;
.bg {
width: 220px;
height: 220px;
}
}
.videoOperateBox .box {
position: relative;
display: inline-block;
margin: auto;
height: 220px;
}
.videoOperateBox .pic {
/* #ifdef APP-PLUS */
.fullHeight{
background-color: #F4F5FD;
height: auto;
padding-bottom: 60rpx;
}
/* #endif */
.videoBox{
width: 100%;
}
.videoName{
font-size: 16px;
color: $uni-text-color;
font-weight: bold;
margin: 10px 15px;
position: relative;
.changeBtn{
position: absolute;
cursor: pointer;
right: 0;
top: 0;
font-size: 12px;
}
}
.video-playback{
width: 454rpx;
height: 108rpx;
background: #FFFFFF;
border-radius: 31rpx;
text-align: center;
line-height: 108rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 40rpx;
color: #8D8D8D;
margin: 0 auto;
margin-top: 80rpx;
// position: fixed;
// bottom: 80rpx;
// left: 145rpx;
}
.videoOperateBox {
text-align: center;
padding-top: 10px;
.bg{
width: 220px;
height: 220px;
}
}
.videoOperateBox .zoom {
width: 106px;
height: 69px;
display: inline-block;
cursor: pointer;
}
.videoOperateBox .box {
position: relative;
display: inline-block;
margin: auto;
height: 220px;
}
.videoOperateBox .zoomin:hover {
background: url("../../static/videoControlIcon/4.png");
}
.videoOperateBox .pic {
position: absolute;
cursor: pointer;
}
.videoOperateBox .zoomout:hover {
background: url("../../static/videoControlIcon/2.png");
}
.videoOperateBox .zoom {
width: 106px;
height: 69px;
display: inline-block;
cursor: pointer;
}
.videoOperateBox .zoomin {
background: url("../../static/videoControlIcon/3.png");
}
.videoOperateBox .zoomin:hover {
background: url("../../static/videoControlIcon/4.png");
}
.videoOperateBox .zoomout {
background: url("../../static/videoControlIcon/1.png");
}
.videoOperateBox .zoomout:hover {
background: url("../../static/videoControlIcon/2.png");
}
.videoOperateBox .left {
width: 28px;
height: 33px;
background: url("../../static/videoControlIcon/left.png");
left: 25px;
top: 50%;
margin-top: -16px;
}
.videoOperateBox .zoomin {
background: url("../../static/videoControlIcon/3.png");
}
.videoOperateBox .left:hover {
background: url("../../static/videoControlIcon/left-active.png");
}
.videoOperateBox .zoomout {
background: url("../../static/videoControlIcon/1.png");
}
.videoOperateBox .right:hover {
background: url("../../static/videoControlIcon/right-active.png");
}
.videoOperateBox .left {
width: 28px;
height: 33px;
background: url("../../static/videoControlIcon/left.png");
left: 25px;
top: 50%;
margin-top: -16px;
}
.videoOperateBox .top:hover {
background: url("../../static/videoControlIcon/top-active.png");
}
.videoOperateBox .left:hover {
background: url("../../static/videoControlIcon/left-active.png");
}
.videoOperateBox .bottom:hover {
background: url("../../static/videoControlIcon/bottom-active.png");
}
.videoOperateBox .right:hover {
background: url("../../static/videoControlIcon/right-active.png");
}
// .videoOperateBox .center:hover {
// background: url("../../static/videoControlIcon/center-active.png");
// }
.videoOperateBox .top:hover {
background: url("../../static/videoControlIcon/top-active.png");
}
.videoOperateBox .right {
width: 28px;
height: 33px;
background: url("../../static/videoControlIcon/right.png");
right: 25px;
top: 50%;
margin-top: -16px;
}
.videoOperateBox .bottom:hover {
background: url("../../static/videoControlIcon/bottom-active.png");
}
.videoOperateBox .top {
width: 33px;
height: 28px;
background: url("../../static/videoControlIcon/top.png");
top: 25px;
left: 50%;
margin-left: -16px;
}
// .videoOperateBox .center:hover {
// background: url("../../static/videoControlIcon/center-active.png");
// }
.videoOperateBox .bottom {
width: 33px;
height: 28px;
background: url("../../static/videoControlIcon/bottom.png");
bottom: 25px;
left: 50%;
margin-left: -16px;
}
.videoOperateBox .right {
width: 28px;
height: 33px;
background: url("../../static/videoControlIcon/right.png");
right: 25px;
top: 50%;
margin-top: -16px;
}
// .videoOperateBox .center {
// width: 44px;
// height: 40px;
// background: url("../../static/videoControlIcon/center.png");
// left: 50%;
// top: 50%;
// margin-top: -20px;
// margin-left: -22px;
// }
.videoOperateBox .top {
width: 33px;
height: 28px;
background: url("../../static/videoControlIcon/top.png");
top: 25px;
left: 50%;
margin-left: -16px;
}
.videoOperateBox .bottom {
width: 33px;
height: 28px;
background: url("../../static/videoControlIcon/bottom.png");
bottom: 25px;
left: 50%;
margin-left: -16px;
}
// .videoOperateBox .center {
// width: 44px;
// height: 40px;
// background: url("../../static/videoControlIcon/center.png");
// left: 50%;
// top: 50%;
// margin-top: -20px;
// margin-left: -22px;
// }
</style>