<template>
|
<div class="pr" style="height:100%;width:100%;">
|
<a-map ref="aMap" newId="amap" :zoomSize="12" @toDetails="toDetails" @updatePos="updatePos"></a-map>
|
<!-- 左下角小地图 start -->
|
<div class="list clearfix">
|
<div class="flex-center">
|
<span style="color:#5cc9e9">未标记:{{deviceList.length}}</span>
|
</div>
|
<div>
|
<div
|
:class="['float-left',item.isZindex?'zIndex1':'zIndex0']"
|
:style="`top:${item.top}px;left:${item.left}px;position:absolute`"
|
:data="item"
|
toDOMId="amap"
|
@_getContainerRect="addMapIconIteam"
|
v-for="item in deviceList"
|
:key="item.id"
|
>
|
<div class="cursor-move" tabindex="-1">
|
<div
|
:style="`background-image: url(${item.url});`"
|
:class="item.isActive?'img-icon2':'img-icon'"
|
></div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- 左下角小地图 end -->
|
<div class="status">
|
<el-row class="pt10" :gutter="10">
|
<el-col :span="12" class="flex-center">
|
<div class="iconClass flex-center mr10" title="分析摄像机">
|
<specia-button>
|
<i class="d-block fas fa-hdd"></i>
|
</specia-button>
|
</div>
|
<span class="spanfontright fb" :title="'正常设备：'+okServerNum">{{okServerNum}}</span>
|
<span style="font-size: 18px;">|</span>
|
<span class="spanfontcenter fb" :title="'异常设备：'+exServerNum">{{exServerNum}}</span>
|
<span style="font-size: 18px;">|</span>
|
<span class="spanfontwarn fb" :title="'报警设备：'+repaireDeviceNum">{{repaireDeviceNum}}</span>
|
</el-col>
|
<el-col :span="12" class="flex-center">
|
<div class="iconClass flex-center mr10" title="监控摄像机">
|
<specia-button>
|
<i class="ion d-block ion-ios-videocam"></i>
|
</specia-button>
|
</div>
|
<span class="spanfontright fb" :title="'正常设备：'+okDeviceNum">{{okDeviceNum}}</span>
|
<span style="font-size: 18px;">|</span>
|
<span class="spanfontleft fb" :title="'异常设备：'+exDeviceNum">{{exDeviceNum}}</span>
|
</el-col>
|
</el-row>
|
</div>
|
<map-model1 ref="model1"></map-model1>
|
<map-model2 ref="model2"></map-model2>
|
<mapModel3 ref="model3"></mapModel3>
|
<!-- <layer-model id="layerModel" v-show="false"></layer-model> -->
|
</div>
|
</template>
|
<script>
|
import { Row, Col, Dialog, Button } from 'element-ui'
|
import aMap from './components/AMap'
|
import draggerBox from './components/draggerBox'
|
import mapDeviceModel from './components/mapDeviceModel'
|
import mapModel1 from './components/mapModel1'
|
import mapModel2 from './components/mapModel2'
|
import mapModel3 from './components/mapModel3'
|
import { findAllDeviceByArea, getcameraRecord } from '@/server/map.js'
|
import { findLikerPics } from '@/server/searchImg.js'
|
import {
|
findAllDevices,
|
updatePosById,
|
getLocalDeviceList,
|
getColonyList,
|
getDeviceById
|
} from '@/server/home.js'
|
import speciaButton from '@/components/specialButton/speciaButton.vue'
|
import layerModel from '../Home/components/model/siliderModelLayer'
|
export default {
|
components: {
|
elDialog: Dialog,
|
elRow: Row,
|
elCol: Col,
|
elButton: Button,
|
mapDeviceModel,
|
draggerBox,
|
aMap,
|
speciaButton,
|
mapModel1,
|
mapModel2,
|
mapModel3,
|
layerModel
|
},
|
props: {
|
currentOrgItem: {
|
default: () => ({ id: '0', type: 'MENU', name: '平台设备' }),
|
type: Object
|
},
|
searchName: {
|
default: '',
|
type: String
|
},
|
currentColonyItem: {
|
default: () => ({ id: '0', type: '1', name: '集群设备' }),
|
type: Object
|
},
|
content: {
|
default: () => ({}),
|
type: Object
|
}
|
},
|
data() {
|
return {
|
// 查询类型
|
searchType: '',
|
result: [],
|
// 存储临时的设备信息
|
tempDevice: {},
|
// 未使用的设备列表
|
deviceList: [],
|
// 临时存储百度地图的坐标
|
bPoint: {},
|
// 用于存放临时标记点
|
markerObject: {},
|
// 接收正常摄像头设备数量
|
okDeviceNum: 0,
|
// 接收维修摄像头设备数量
|
repaireDeviceNum: 0,
|
// 接收异常摄像头设备数量
|
exDeviceNum: 0,
|
// 正常服务器设备数量
|
okServerNum: 0,
|
// 异常服务器设备数量
|
exServerNum: 0
|
}
|
},
|
methods: {
|
/* eslint-disable */
|
async showlayer(data) {
|
console.log('come in')
|
/** 查询设备报警记录 */
|
let res = await getcameraRecord({
|
videoReqNum: data.id,
|
page: 1,
|
size: 10,
|
personIsHub: '1'
|
})
|
if (res && res.success) {
|
if (res.data && res.data.equList) {
|
let personData = res.data.equList[0]
|
let BigPicParam = {
|
videoNum: personData.videoNum,
|
picDate: personData.picDate,
|
videoIp: personData.videoIp,
|
indeviceid: personData.indeviceid
|
}
|
let accompanyPersonParam = {
|
videoReqNum: personData.videoReqNum,
|
picDate: personData.picDate,
|
personId: personData.personId,
|
Id: personData.Id
|
}
|
this.$layer.iframe({
|
content: {
|
content: layerModel, //传递的组件对象
|
parent: this, //当前的vue对象
|
data: {
|
parentData: JSON.stringify(personData),
|
BigPicParam: JSON.stringify(BigPicParam),
|
accompanyPersonParam: JSON.stringify(accompanyPersonParam)
|
} //props
|
},
|
shade: false,
|
area: ['850px'],
|
title: '报警详情'
|
})
|
}
|
}
|
},
|
showModel(data) {
|
if (data) {
|
if (data.Trajectory) {
|
let index = parseInt(localStorage.getItem('index'))
|
const esList = localStorage.getItem('esList')
|
? JSON.parse(localStorage.getItem('esList'))
|
: []
|
let arrlength = data.allData.result.smallPhotoPath.length
|
data.allData.result.index = index && index < arrlength ? index : 0
|
if (esList.length !== 0) {
|
data.allData.result.esList = esList
|
}
|
this.$set(data, 'params', this.content)
|
this.$refs.model2.showModel(data)
|
this.$refs.model2.$refs.siliderForMapModel2.selectInit()
|
// this.$nextTick(()=>{
|
// this.$refs.model2.$refs.siliderForMapModel2.selectInit()
|
// })
|
|
} else {
|
if (data.data.nodeId !== undefined && data.data.nodeId !== null) {
|
this.$refs.model1.showModel(data)
|
} else {
|
this.$refs.model3.showModel(data)
|
}
|
}
|
}
|
},
|
toDetails(data) {
|
console.log(data, '接收点击详情后回调函数 toDetails')
|
if (data) {
|
if (data.data.isAlarm) {
|
if (data.Trajectory) {
|
this.showModel(data)
|
} else {
|
// this.showlayer(data)
|
this.showModel(data)
|
}
|
} else {
|
this.showModel(data)
|
}
|
}
|
},
|
/** 查询所有设备 */
|
async findAllDevice() {
|
let res = await findAllDevices()
|
|
if (res && res.success) {
|
// 存储正常数量
|
let n1 = 0
|
// 存储异常数量
|
let n2 = 0
|
// 没有坐标信息的设备，存入左下角
|
let noPosList = JSON.parse(JSON.stringify(res.data.noPosList))
|
this.deviceList = noPosList
|
if (noPosList.length !== 0) {
|
// noPosList.forEach(item => {
|
// if (item.status === 0) {
|
// n1 += 1
|
// if (item.type === '101') {
|
// this.okDeviceNum += 1
|
// } else if (item.type === '103') {
|
// this.okServerNum += 1
|
// }
|
// } else if (item.status === -1) {
|
// this.repaireDeviceNum += 1
|
// if (item.type === '101') {
|
// this.okDeviceNum += 1
|
// } else if (item.type === '103') {
|
// this.okServerNum += 1
|
// }
|
// } else {
|
// n2 += 1
|
// if (item.type === '101') {
|
// this.exDeviceNum += 1
|
// } else if (item.type === '103') {
|
// this.exServerNum += 1
|
// }
|
// }
|
// })
|
}
|
this.createPic(noPosList)
|
// 有坐标信息的设备，在地图上进行打点
|
let posList = JSON.parse(JSON.stringify(res.data.posList))
|
// console.log(posList,'res findAllDevice----')
|
if (posList.length !== 0) {
|
posList.forEach(async item => {
|
if (item.subType === '10101') {
|
/**需要等C通了之后才能使用status来判断设备状态 */
|
// if(item.status === 0){
|
// this.okServerNum +=1
|
// }else if(item.status === -1){
|
// this.exServerNum += 1
|
// }else if(item.status === 1){
|
// this.repaireDeviceNum += 1
|
// }
|
let res = await getcameraRecord({
|
videoReqNum: item.id,
|
page: 1,
|
size: 10,
|
personIsHub: '1'
|
})
|
if (res && res.success) {
|
if (res.data && res.data.total) {
|
if (res.data.total !== '0') {
|
this.repaireDeviceNum += 1
|
} else {
|
this.okServerNum += 1
|
}
|
}
|
}
|
} else if (item.subType === '10102') {
|
if (item.status === 0) {
|
this.okDeviceNum += 1
|
} else if (item.status === -1) {
|
this.exDeviceNum += 1
|
}
|
}
|
})
|
}
|
// this.okDeviceNum = n1
|
// this.exDeviceNum = n2
|
this.$refs.aMap.amapCreateMarker(posList)
|
} else {
|
this.$toast({
|
type: 'error',
|
message: '查询设备信息失败！'
|
})
|
}
|
},
|
// 地图 添加设备
|
addMapIconIteam({ x, y, data, index, tags }) {
|
/* 默认返回的x,y为画板坐标 */
|
console.log(data, 'addMapIconIteam data', { x, y, data, index, tags })
|
if (x > 160 && 790 - y > 120) {
|
if (Object.keys(data).length !== 0) {
|
if (Object.keys(this.tempDevice).length !== 0) {
|
if (data.id === this.tempDevice.id) {
|
this.$refs.aMap.receveLnglat(data)
|
}
|
}
|
}
|
}
|
},
|
// 地图 设备移动
|
iconIteamDrag({ x, y, data }) {
|
let deviceArr = this.deviceArr.map(iteam => {
|
if (iteam.id === data.id) {
|
iteam.position = JSON.stringify({ x, y })
|
}
|
return iteam
|
})
|
this.deviceArr = deviceArr
|
},
|
// 获取拖放物的坐标
|
getPoint(data) {
|
console.log(data, '放置的百度地图坐标')
|
this.bPoint = {}
|
if (data) {
|
this.bPoint = data
|
// this.$nextTick(() => {
|
if (Object.keys(this.markerObject).length !== 0) {
|
this.markerObject.lat = data.lat
|
this.markerObject.lng = data.lng
|
console.log(this.markerObject, 'this.markerObject')
|
let arr = []
|
arr.push(this.markerObject)
|
this.setMarker(arr)
|
/** 打点成功后从未使用设备列表中去掉该设备 */
|
let newArr = this.deviceList.filter((item, index) => {
|
if (this.markerObject.id === item.id) {
|
return false
|
} else {
|
return true
|
}
|
})
|
console.log(newArr, '----------------newArr', this.deviceList)
|
this.markerObject = {}
|
}
|
// })
|
}
|
},
|
// 拖拽成功后在地图上打点
|
setMarker(arr) {
|
this.$refs.baiduMap.bmapCreateMarker(arr)
|
},
|
// 获取随机数
|
getRandomNum(limit, isTop) {
|
let num
|
while (true) {
|
num = Math.random() * 1000
|
if (isTop === 'top') {
|
if (num <= limit && num > 20) {
|
break
|
}
|
} else {
|
if (num <= limit && num > 0) {
|
break
|
}
|
}
|
}
|
return parseInt(num)
|
},
|
// 渲染图片
|
createPic(arr) {
|
if (arr.length !== 0) {
|
arr.forEach((item, index) => {
|
let y = this.getRandomNum(80, 'top')
|
let x = this.getRandomNum(130, 'left')
|
this.$set(item, 'top', y)
|
this.$set(item, 'left', x)
|
|
if (item.status === 0) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/green_camer.png')
|
this.$set(item, 'isZindex', false)
|
this.$set(item, 'isActive', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/green_server.png')
|
this.$set(item, 'isActive', false)
|
this.$set(item, 'isZindex', false)
|
}
|
} else if (item.status === 1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/red_camer.png')
|
this.$set(item, 'isActive', false)
|
this.$set(item, 'isZindex', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/red_server.png')
|
this.$set(item, 'isActive', false)
|
this.$set(item, 'isZindex', false)
|
}
|
} else if (item.status === -1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/gray_camer.png')
|
this.$set(item, 'isActive', false)
|
this.$set(item, 'isZindex', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/gray_server.png')
|
this.$set(item, 'isActive', false)
|
this.$set(item, 'isZindex', false)
|
}
|
}
|
})
|
// console.log(arr, 'arr')
|
this.deviceList = arr
|
}
|
},
|
/** 保存设备经纬度 */
|
async updatePos(marker) {
|
let json = {
|
id: marker.data.id,
|
type: marker.data.type,
|
longitude: marker.Mg.position.lng,
|
latitude: marker.Mg.position.lat
|
}
|
let res = await updatePosById(json)
|
if (res && res.success) {
|
let noPosList = this.deviceList.filter(
|
item => item.id !== marker.data.id
|
)
|
if (this.deviceList !== noPosList.length) {
|
this.createPic(noPosList)
|
if (noPosList.length === 0) {
|
this.deviceList = noPosList
|
}
|
}
|
this.$toast({
|
type: 'success',
|
message: '更新设备坐标成功！'
|
})
|
} else {
|
this.$toast({
|
type: 'error',
|
message: '更新设备坐标失败！'
|
})
|
}
|
},
|
/** 根据选择的树和搜索条件查询地图上的设备 */
|
async findDeviceByParams(params) {
|
if (!params) {
|
return false
|
}
|
console.log(params, 'params')
|
let res = null
|
if (
|
params &&
|
params.currentItem &&
|
params.currentItem.type === 'monitorTree'
|
) {
|
res = await getLocalDeviceList({
|
orgId: params.currentItem.node.id,
|
type: params.currentItem.node.type,
|
length: 9999,
|
start: 0,
|
condition: params.content
|
})
|
} else if (
|
params &&
|
params.currentItem &&
|
params.currentItem.type === 'analysisTree'
|
) {
|
// const { type = '1', id = '0' } = this.currentColonyItem
|
res = await getColonyList({
|
id: params.currentItem.node.id,
|
type: params.currentItem.node.type,
|
condition: params.content
|
})
|
} else if (
|
params &&
|
params.currentItem !== undefined &&
|
params.currentItem.type === 'areaTree'
|
) {
|
if (
|
params.currentItem.node &&
|
params.currentItem.node.type === 'MENU'
|
) {
|
res = await findAllDeviceByArea({
|
condition: params.content,
|
orgId: params.currentItem.node.id,
|
type: params.currentItem.node.type
|
})
|
} else {
|
res = await getDeviceById({
|
id: params.currentItem.node.id
|
})
|
}
|
}
|
console.log(res, '通过左侧树查询过滤出来的数据', params)
|
if (res && res.data) {
|
// debugger
|
if (params.currentItem.node.id === '0') {
|
this.$refs.aMap.setDeviceMarkersAlarm(res.data)
|
this.cancelActiveNoPos()
|
} else {
|
this.$refs.aMap.removeActiveDeviceMarkers()
|
if (res.data instanceof Array) {
|
console.log(res.data)
|
// 通过判断是否有child来判断是选择的平台设备还是集群设备
|
// if (res.data[0] && res.data[0].child) {
|
// this.$refs.aMap.setActiveDeviceMarkers(res.data)
|
// // this.setActiveForNoPos(res.data)
|
// } else {
|
// this.Iteart(res.data)
|
// console.log(this.result, 'this.result')
|
// this.$refs.aMap.setActiveDeviceMarkers(this.result)
|
// // this.setActiveForNoPos(this.result)
|
// }
|
this.Iteart(res.data)
|
console.log(this.result, 'this.result')
|
this.$refs.aMap.setActiveDeviceMarkers(this.result)
|
this.setActiveForNoPos(this.result)
|
} else {
|
/** 返回的data是一个对象 */
|
let arr = []
|
arr.push(res.data)
|
console.log(arr, 'arr数组')
|
setTimeout(() => {
|
this.$refs.aMap.setActiveDeviceMarkers(arr)
|
}, 500)
|
}
|
}
|
} else {
|
this.$toast({
|
type: 'error',
|
message: res && res.msg ? res.msg : '设备查询失败！'
|
})
|
}
|
},
|
/** 报警列表点击高亮 */
|
async setActiveAlarm(json) {
|
if (json && json.id) {
|
let arr = []
|
arr.push(json)
|
console.log(arr, '报警列表传过来的设备id')
|
this.$refs.aMap.setActiveDeviceMarkers(arr)
|
}
|
},
|
/** 迭代函数 */
|
Iteart(arr) {
|
this.result = []
|
arr.forEach((item, index) => {
|
this.result.push(item)
|
if (item && item.child && item.child.length !== 0) {
|
this.Iteart(item.child)
|
}
|
})
|
},
|
/** 未标记的点高亮设置 */
|
setActiveForNoPos(arr) {
|
let idArr = arr || []
|
console.log(idArr,'idArr')
|
let markers = this.deviceList || []
|
/** 在设置高亮之前先把之前设置的高亮去掉 */
|
if (idArr.length === 0) {
|
for (let item of markers) {
|
if (item.status === 0) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/green_camer.png')
|
this.$set(item, 'isActive', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/green_server.png')
|
this.$set(item, 'isActive', false)
|
}
|
} else if (item.status === 1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/red_camer.png')
|
this.$set(item, 'isActive', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/red_server.png')
|
this.$set(item, 'isActive', false)
|
}
|
} else if (item.status === -1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/gray_camer.png')
|
this.$set(item, 'isActive', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/gray_server.png')
|
this.$set(item, 'isActive', false)
|
}
|
}
|
}
|
return false
|
}
|
let activeDevices = []
|
// 遍历id查找高亮
|
idArr.forEach((idItem, index) => {
|
for (let item of markers) {
|
if (item.id === idItem.id) {
|
activeDevices.push(item)
|
}
|
}
|
})
|
// 设置高亮图标
|
for (let item of activeDevices) {
|
if (item.status === 0) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/green_camer_active.gif')
|
this.$set(item, 'isActive', true)
|
this.$set(item, 'isZindex', true)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/green_server_active.gif')
|
this.$set(item, 'isActive', true)
|
this.$set(item, 'isZindex', true)
|
}
|
} else if (item.status === 1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/red_camer_active.gif')
|
this.$set(item, 'isActive', true)
|
this.$set(item, 'isZindex', true)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/red_server_active.gif')
|
this.$set(item, 'isActive', true)
|
this.$set(item, 'isZindex', true)
|
}
|
} else if (item.status === -1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/gray_camer_active.gif')
|
this.$set(item, 'isActive', true)
|
this.$set(item, 'isZindex', true)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/gray_server_active.gif')
|
this.$set(item, 'isActive', true)
|
this.$set(item, 'isZindex', true)
|
}
|
}
|
}
|
},
|
/** 清除没有坐标的标记点高亮 */
|
cancelActiveNoPos(){
|
let markers = this.deviceList || []
|
for (let item of markers) {
|
if (item.status === 0) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/green_camer.png')
|
this.$set(item, 'isActive', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/green_server.png')
|
this.$set(item, 'isActive', false)
|
}
|
} else if (item.status === 1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/red_camer.png')
|
this.$set(item, 'isActive', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/red_server.png')
|
this.$set(item, 'isActive', false)
|
}
|
} else if (item.status === -1) {
|
if (item.type === '101') {
|
this.$set(item, 'url', '/static/img/icon/gray_camer.png')
|
this.$set(item, 'isActive', false)
|
} else if (item.type === '103') {
|
this.$set(item, 'url', '/static/img/icon/gray_server.png')
|
this.$set(item, 'isActive', false)
|
}
|
}
|
}
|
},
|
/** 获取焦点后修改层级关系 */
|
focusChange(data) {
|
// console.log(data, '获取焦点的元素')
|
this.tempDevice = data
|
},
|
/** 画轨迹的方法 */
|
drawline(data) {
|
if (data) {
|
this.$refs.aMap.drawLine(data)
|
}
|
},
|
/** 取消设备高亮，全部取消 */
|
cancelActive() {
|
this.$refs.aMap.removeActiveDeviceMarkers()
|
},
|
/** 接收人员轨迹参数，然后调用接口查询轨迹数据 */
|
async reciveParams(params) {
|
if (params) {
|
let json = {
|
liker: params.liker,
|
path: params.path,
|
page: 1,
|
length: 10000,
|
startDate: params.startDate,
|
endDate: params.endDate,
|
personId: localStorage.getItem('personId')
|
}
|
console.log(json, '轨迹参数')
|
let res = await findLikerPics(json)
|
console.log(res, '查询返回数据')
|
if (res && res.success) {
|
let data = {}
|
let smallPhotoPath = []
|
let datasource = {}
|
datasource.path = params.path
|
smallPhotoPath.push(datasource)
|
res.data.smallPhotoPath = smallPhotoPath
|
res.data.index = 0
|
res.data.param = json
|
data.result = res.data
|
this.$refs.aMap.drawLine(data)
|
}
|
}
|
}
|
},
|
mounted() {
|
// this.$refs.aMap.InitMap()
|
this.findAllDevice()
|
},
|
watch: {
|
currentOrgItem: {
|
handler(newVal, oldVal) {
|
if (newVal !== oldVal) {
|
// 触发 org 查询平台设备列表
|
this.searchType = 'currentOrgItem'
|
this.findDeviceByParams()
|
}
|
},
|
deep: true
|
},
|
currentColonyItem: {
|
handler(newVal, oldVal) {
|
if (newVal !== oldVal) {
|
// 触发 org 查询平台设备列表
|
this.searchType = 'currentColonyItem'
|
this.findDeviceByParams()
|
}
|
},
|
deep: true
|
}
|
},
|
directives: {
|
focus: {
|
inserted: function(el) {
|
console.log(el, 'el')
|
el.focus()
|
}
|
}
|
}
|
}
|
</script>
|
<style>
|
.list {
|
width: 160px;
|
height: 140px;
|
background-color: beige;
|
position: absolute;
|
left: 0;
|
bottom: 0;
|
}
|
.dialog {
|
width: 60%;
|
height: 800px;
|
}
|
.status {
|
width: 300px;
|
height: 50px;
|
border: 1px solid rgba(130, 130, 130, 0.4);
|
background-color: #ffffff;
|
opacity: 0.8;
|
position: absolute;
|
left: 0;
|
top: 0;
|
}
|
.iconClass {
|
width: 30px;
|
height: 30px;
|
border-radius: 50%;
|
overflow: hidden;
|
}
|
.dragger-content {
|
line-height: 30px;
|
/* 抑制选中 */
|
-moz-user-select: none;
|
-webkit-user-select: none;
|
user-select: none;
|
}
|
.cursor-move {
|
cursor: move;
|
/* 抑制选中 */
|
-moz-user-select: none;
|
-webkit-user-select: none;
|
user-select: none;
|
}
|
|
.img-icon {
|
width: 30px;
|
height: 30px;
|
/* background-image: url('/static/assets/img/noneImg.png'); */
|
background-size: cover;
|
/* 抑制选中 */
|
-moz-user-select: none;
|
-webkit-user-select: none;
|
user-select: none;
|
}
|
.img-icon2 {
|
width: 48px;
|
height: 48px;
|
/* background-image: url('/static/assets/img/noneImg.png'); */
|
background-size: cover;
|
/* 抑制选中 */
|
-moz-user-select: none;
|
-webkit-user-select: none;
|
user-select: none;
|
}
|
.status-wa {
|
width: 122px;
|
height: 38px;
|
background: #e20808;
|
border-radius: 5px;
|
}
|
.status-ok {
|
width: 122px;
|
height: 38px;
|
background: #2d7110;
|
border-radius: 5px;
|
}
|
.status-et {
|
width: 122px;
|
height: 38px;
|
background: #686868;
|
border-radius: 5px;
|
}
|
.spanfontleft {
|
font-size: 18px;
|
color: #686868;
|
padding-left: 5px;
|
}
|
.spanfontright {
|
font-size: 18px;
|
color: #2d7110;
|
padding-right: 5px;
|
}
|
.spanfontcenter {
|
font-size: 18px;
|
color: #686868;
|
padding-right: 5px;
|
padding-left: 5px;
|
}
|
.spanfontwarn {
|
font-size: 18px;
|
color: #e20808;
|
padding-left: 5px;
|
}
|
.zIndex0 {
|
z-index: 0;
|
}
|
.zIndex1 {
|
z-index: 1;
|
}
|
</style>
|
