<template>
|
<div class="content" :style="fullScreenStyle">
|
<Fmap ref="fmap" @initPosCameras="initPosCameras" :defaultMapScaleLevel="isShowMapTool?19:19" />
|
<div class="mapTool" v-if="isShowMapTool">
|
<i
|
class="iconfont iconcar"
|
style="margin-right:30px"
|
:style="iconSelectIndex == 4 ? 'color:#ffffff' : ''"
|
></i>
|
<i
|
class="iconfont iconintruder-alarm"
|
@click="selected(3)"
|
:style="iconSelectIndex == 3 ? 'color:#ffffff' : ''"
|
></i>
|
<i
|
class="iconfont iconsousuoren"
|
@click="selected(2)"
|
:style="iconSelectIndex == 2 ? 'color:#ffffff' : ''"
|
></i>
|
<i
|
class="iconfont iconjuxing"
|
@click="selected(1)"
|
:style="iconSelectIndex == 1 ? 'color:#ffffff' : ''"
|
></i>
|
<i class="iconfont iconquanping" @click="toggleFullScreen"></i>
|
</div>
|
<div class="countDiv" v-if="isShowMapTool">
|
<div class="curCountDiv">
|
<div class="curTime">{{ curTime }}</div>
|
</div>
|
</div>
|
<div class="deviceInfo" v-if="!isShowMapTool">
|
<div class="analy-came">
|
<div class="out-div1">
|
<div class="in-line flex-center">
|
<span class="iconfont iconfenxishexiangji" style="color:#2124C8"></span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 14px;
|
color: #222222;
|
margin-left: 10px;
|
margin-right: 10px;
|
line-height: 26px;"
|
>分析摄像机</span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 24px;
|
color: #FF7733;"
|
>{{DeviceManage.deviceStatus.AICamera.total}}</span>
|
</div>
|
<div class="flex-center" style="margin-top: 12px;
|
line-height: 20px;">
|
<div style="padding-right: 12px;" title="在线">
|
<span
|
style="font-size: 22px;
|
margin-right: 5px;"
|
class="iconfont iconzaixian"
|
></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AICamera.onLine}}</span>
|
</div>
|
<div style="padding-right: 12px;" title="离线">
|
<span style="margin-right: 5px;" class="iconfont iconlixian"></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AICamera.offLine}}</span>
|
</div>
|
<div title="故障">
|
<span style="margin-right: 5px;" class="iconfont iconguzhang"></span>
|
<span
|
style=" font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AICamera.fault}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<el-divider class="div-1px" direction="vertical"></el-divider>
|
<div class="analy-came">
|
<div class="out-div1">
|
<div class="in-line flex-center">
|
<span class="iconfont iconjiankongshexiangji" style="color:#2124C8"></span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 14px;
|
color: #222222;
|
margin-left: 10px;
|
margin-right: 10px;
|
line-height: 26px;"
|
>监控摄像机</span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 24px;
|
color: #FF7733;"
|
>{{DeviceManage.deviceStatus.VideoCamera.total}}</span>
|
</div>
|
<div class="flex-center" style="margin-top: 12px;
|
line-height: 20px;">
|
<div style="padding-right: 12px;" title="在线">
|
<span
|
style="font-size: 22px;
|
margin-right: 5px;"
|
class="iconfont iconzaixian"
|
></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.VideoCamera.onLine}}</span>
|
</div>
|
<div style="padding-right: 12px;" title="离线">
|
<span style="margin-right: 5px;" class="iconfont iconlixian"></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.VideoCamera.offLine}}</span>
|
</div>
|
<div title="故障">
|
<span style="margin-right: 5px;" class="iconfont iconguzhang"></span>
|
<span
|
style=" font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.VideoCamera.fault}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<el-divider class="div-1px" direction="vertical"></el-divider>
|
<div class="analy-came">
|
<div class="out-div1">
|
<div class="in-line flex-center">
|
<span class="iconfont iconjinchurushebei" style="color:#2124C8;font-size: 18px;"></span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 14px;
|
color: #222222;
|
margin-left: 10px;
|
margin-right: 10px;
|
line-height: 26px;"
|
>进出入设备</span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 24px;
|
color: #FF7733;"
|
>{{DeviceManage.deviceStatus.PAD.total}}</span>
|
</div>
|
<div class="flex-center" style="margin-top: 12px;
|
line-height: 20px;">
|
<div style="padding-right: 12px;" title="在线">
|
<span
|
style="font-size: 22px;
|
margin-right: 5px;"
|
class="iconfont iconzaixian"
|
></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.PAD.onLine}}</span>
|
</div>
|
<div style="padding-right: 12px;" title="离线">
|
<span style="margin-right: 5px;" class="iconfont iconlixian"></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.PAD.offLine}}</span>
|
</div>
|
<div title="故障">
|
<span style="margin-right: 5px;" class="iconfont iconguzhang"></span>
|
<span
|
style=" font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.PAD.fault}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<el-divider class="div-1px" direction="vertical"></el-divider>
|
<div class="analy-came">
|
<div class="out-div1">
|
<div class="in-line flex-center">
|
<span class="iconfont iconzhinengjisuanjiedian" style="color:#2124C8;font-size: 20px;"></span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 14px;
|
color: #222222;
|
margin-left: 10px;
|
margin-right: 10px;
|
line-height: 26px;"
|
>智能计算节点</span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 24px;
|
color: #FF7733;"
|
>{{DeviceManage.deviceStatus.AnalysisServer.total}}</span>
|
</div>
|
<div class="flex-center" style="margin-top: 12px;
|
line-height: 20px;">
|
<div style="padding-right: 12px;" title="在线">
|
<span
|
style="font-size: 22px;
|
margin-right: 5px;"
|
class="iconfont iconzaixian"
|
></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AnalysisServer.onLine}}</span>
|
</div>
|
<div style="padding-right: 12px;" title="离线">
|
<span style="margin-right: 5px;" class="iconfont iconlixian"></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AnalysisServer.offLine}}</span>
|
</div>
|
<div title="故障">
|
<span style="margin-right: 5px;" class="iconfont iconguzhang"></span>
|
<span
|
style=" font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AnalysisServer.fault}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<el-divider class="div-1px" direction="vertical"></el-divider>
|
<div class="analy-came">
|
<div class="out-div1">
|
<div class="in-line flex-center">
|
<span class="iconfont iconcunchushebei" style="color:#2124C8;font-size: 18px;"></span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 14px;
|
color: #222222;
|
margin-left: 10px;
|
margin-right: 10px;
|
line-height: 26px;"
|
>存储设备</span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 24px;
|
color: #FF7733;"
|
>{{DeviceManage.deviceStatus.Storage.total}}</span>
|
</div>
|
<div class="flex-center" style="margin-top: 12px;
|
line-height: 20px;">
|
<div style="padding-right: 12px;" title="在线">
|
<span
|
style="font-size: 22px;
|
margin-right: 5px;"
|
class="iconfont iconzaixian"
|
></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.Storage.onLine}}</span>
|
</div>
|
<div style="padding-right: 12px;" title="离线">
|
<span style="margin-right: 5px;" class="iconfont iconlixian"></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.Storage.offLine}}</span>
|
</div>
|
<div title="故障">
|
<span style="margin-right: 5px;" class="iconfont iconguzhang"></span>
|
<span
|
style=" font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.Storage.fault}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<el-divider class="div-1px" direction="vertical"></el-divider>
|
<div class="analy-came">
|
<div class="out-div1">
|
<div class="in-line flex-center">
|
<span class="iconfont iconguanlipingtai1" style="color:#2124C8;font-size: 18px;"></span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 14px;
|
color: #222222;
|
margin-left: 10px;
|
margin-right: 10px;
|
line-height: 26px;"
|
>管理平台</span>
|
<span
|
style="font-family: PingFangSC-Medium;
|
font-size: 24px;
|
color: #FF7733;"
|
>{{DeviceManage.deviceStatus.AnalysisPlatform.total}}</span>
|
</div>
|
<div class="flex-center" style="margin-top: 12px;
|
line-height: 20px;">
|
<div style="padding-right: 12px;" title="在线">
|
<span
|
style="font-size: 22px;
|
margin-right: 5px;"
|
class="iconfont iconzaixian"
|
></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AnalysisPlatform.onLine}}</span>
|
</div>
|
<div style="padding-right: 12px;" title="离线">
|
<span style="margin-right: 5px;" class="iconfont iconlixian"></span>
|
<span
|
style="font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AnalysisPlatform.offLine}}</span>
|
</div>
|
<div title="故障">
|
<span style="margin-right: 5px;" class="iconfont iconguzhang"></span>
|
<span
|
style=" font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;"
|
>{{DeviceManage.deviceStatus.AnalysisPlatform.fault}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="change-map">
|
<fTemplate authority="device:map:cluster:show">
|
<span
|
class="iconfont iconjiqun"
|
style="font-size:28px;float: left;
|
margin-left: 30px;"
|
@click="changeMap"
|
></span>
|
</fTemplate>
|
</div>
|
</div>
|
<div class="left-tool">
|
<div class="d2d-3d">
|
<span class style="font-size: 16px;" @click="changeMode(this)">{{planarFlag?'2D':'3D'}}</span>
|
</div>
|
<div class="dev-list">
|
<el-popover
|
placement="right"
|
width="260"
|
popper-class="ml20"
|
:popper-options="{
|
removeOnDestroy:false
|
}"
|
trigger="hover"
|
@show="clickPopover"
|
>
|
<ul style="max-height: 300px;overflow-y: overlay;">
|
<li
|
class="list-title"
|
style="background: #F5F5F5;border-radius: 4px 4px 0px 0px;height:45px;line-height: 45px;padding:0px 0px 0px 10px;"
|
>
|
<div>
|
<span>列表</span>
|
</div>
|
</li>
|
<li
|
class="flex-box"
|
v-for="(item,index) in MapData.deviceList"
|
:key="index"
|
style="background: #FFF;border-radius: 4px 4px 0px 0px;height:45px;line-height: 45px;"
|
>
|
<div
|
class="flex-row-left"
|
style="font-size:20px;width:8%;color: rgb(61, 104, 225);
|
margin-left: 10px;"
|
>
|
<span
|
:class="item.run_type === -1?'iconfont iconjiankongshexiangji':'iconfont iconfenxishexiangji'"
|
></span>
|
</div>
|
<div
|
style="margin-left: 10px;
|
width: 70%;
|
max-width: 190px;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;"
|
>
|
<span :title="item.name">{{item.name}}</span>
|
</div>
|
<div class="device-list" style="position: relative;right: 0%;">
|
<draggerBox
|
class="flex-row-right"
|
style
|
:data="item"
|
toDOMId="map"
|
@_getContainerRect="addMapIconIteam"
|
>
|
<div class="cursor-move" style="color: rgb(61, 104, 225);">
|
<span class="iconfont icontuozhuai img-icon"></span>
|
</div>
|
</draggerBox>
|
</div>
|
</li>
|
</ul>
|
<span slot="reference" class="iconfont iconjiankong" style="font-size: 21px;"></span>
|
</el-popover>
|
</div>
|
<!-- <div class="add-marker" @click="addMarker">
|
</div>-->
|
</div>
|
<div :class="isShowMapTool?'logo' : 'logo-device'"></div>
|
</div>
|
</template>
|
<script>
|
import Fmap from "./3d/fmap";
|
import draggerBox from "../common/draggerBox";
|
import fTemplate from '../common/fTemplate'
|
export default {
|
components: {
|
Fmap,
|
draggerBox,
|
fTemplate
|
},
|
props: {
|
isShowMapTool: {
|
type: Boolean,
|
default: true
|
}
|
},
|
computed: {
|
fullScreenStyle() {
|
return this.isFullScreen
|
? {
|
position: "fixed",
|
top: 0,
|
left: 0,
|
width: "100%",
|
height: "100%",
|
backgroundColor: "#051130",
|
zIndex: 1000
|
}
|
: "";
|
}
|
},
|
data() {
|
return {
|
iconSelectIndex: 0,
|
isFullScreen: false,
|
curTime: "",
|
gridData: [],
|
dataList: [
|
{
|
picUrl: "/images/visual/nobody.png",
|
picTime: "2019-09-26 17:22:35",
|
picAddr: "164摄像机",
|
picType: "陌生人"
|
}
|
],
|
planarFlag: false,
|
};
|
},
|
created() {
|
// console.log(this.DeviceManage.deviceStatus.AICamera.total,"map index")
|
setInterval(() => {
|
this.refreshCurTime();
|
}, 1000);
|
},
|
methods: {
|
initPosCameras() {
|
console.log("this.initPosCameras()", this.MapData.onMapDeviceList);
|
if (
|
this.MapData.onMapDeviceList &&
|
this.MapData.onMapDeviceList.length !== 0
|
) {
|
this.$refs.fmap.initPosCameras(this.MapData.onMapDeviceList);
|
}
|
},
|
refreshCurTime() {
|
let d = new Date();
|
let year = d.getFullYear();
|
let month = d.getMonth() + 1;
|
let day = d.getDate();
|
let hours = d.getHours();
|
let minutes = d.getMinutes();
|
let seconds = d.getSeconds();
|
month = month < 10 ? "0" + month : month;
|
day = day < 10 ? "0" + day : day;
|
hours = hours < 10 ? "0" + hours : hours;
|
minutes = minutes < 10 ? "0" + minutes : minutes;
|
seconds = seconds < 10 ? "0" + seconds : seconds;
|
this.curTime =
|
year +
|
"." +
|
month +
|
"." +
|
day +
|
" " +
|
hours +
|
":" +
|
minutes +
|
":" +
|
seconds;
|
},
|
selected(num) {
|
this.iconSelectIndex = num;
|
console.log("选中图标：", this.CategoryData.intervalId);
|
if (num === 1) {
|
this.CategoryData.dataStatus = "default";
|
this.CategoryData.personList = [];
|
window.clearInterval(this.CategoryData.intervalId)
|
this.CategoryData.realTimeCapture()
|
this.CategoryData.setInterval()
|
}
|
if (num === 2) {
|
this.CategoryData.dataStatus = "person";
|
this.CategoryData.dataTitle = "人员";
|
this.CategoryData.personList = [];
|
window.clearInterval(this.CategoryData.intervalId)
|
this.CategoryData.realTimeCapture()
|
this.CategoryData.setInterval()
|
}
|
if (num === 3) {
|
this.CategoryData.dataStatus = "action";
|
this.CategoryData.dataTitle = "行为";
|
this.CategoryData.personList = [];
|
window.clearInterval(this.CategoryData.intervalId)
|
this.CategoryData.realTimeCapture()
|
this.CategoryData.setInterval()
|
}
|
},
|
addMapIconIteam({ x, y, data, index, tags }) {
|
/* 默认返回的x,y为画板坐标 */
|
console.log(data, "拖拽回调 data", { x, y, data, index, tags });
|
let cameraId = data.id;
|
this.$refs.fmap.addMarker(
|
cameraId,
|
x,
|
y,
|
data.name,
|
data.addr,
|
data.run_type,
|
data.rtsp,
|
data.is_running,
|
data.type
|
);
|
},
|
refreshDeviceList() {
|
this.MapData.findOnMap(-9999, true);
|
this.MapData.findOnMap(-9999, false);
|
},
|
checkFull() {
|
return (
|
document.fullscreenElement ||
|
document.msFullscreenElement ||
|
document.mozFullScreenElement ||
|
document.webkitFullscreenElement ||
|
false
|
);
|
},
|
FullScreen(el) {
|
if (!this.isFullScreen) {
|
//退出全屏
|
if (document.exitFullscreen) {
|
document.exitFullscreen();
|
} else if (document.mozCancelFullScreen) {
|
document.mozCancelFullScreen();
|
} else if (document.webkitExitFullscreen) {
|
document.webkitExitFullscreen();
|
} else if (!document.msRequestFullscreen) {
|
document.msExitFullscreen();
|
}
|
} else {
|
//进入全屏
|
if (el.requestFullscreen) {
|
el.requestFullscreen();
|
} else if (el.mozRequestFullScreen) {
|
el.mozRequestFullScreen();
|
} else if (el.webkitRequestFullscreen) {
|
el.webkitRequestFullscreen();
|
} else if (el.msRequestFullscreen) {
|
this.isFullScreen = true;
|
el.msRequestFullscreen();
|
}
|
}
|
},
|
toggleFullScreen(e) {
|
this.isFullScreen = !this.isFullScreen;
|
let ele = document.getElementsByClassName("content");
|
this.FullScreen(ele[0]);
|
},
|
clickPopover() {
|
var content = document.getElementsByClassName("content")
|
var element = document.getElementsByClassName("el-popover")
|
content[0].appendChild(element[0])
|
},
|
changeMode(domObj) {
|
this.$refs.fmap.changeMode(domObj)
|
this.planarFlag = !this.planarFlag
|
},
|
addMarker() {
|
this.$refs.fmap.TestaddMarker()
|
},
|
reciveNodeId(id) {
|
this.$refs.fmap.reciveNodeId(id)
|
},
|
changeMap() {
|
this.$emit('changeMap')
|
}
|
},
|
mounted() {
|
// this.$nextTick(()=>{
|
// this.initPosCameras()
|
// })
|
|
let _that = this;
|
window.onresize = function () {
|
if (!_that.checkFull()) {
|
_that.isFullScreen = false;
|
}
|
};
|
|
// window.setTimeout(() => {
|
// _that.initPosCameras();
|
// }, 5 * 1000);
|
}
|
};
|
</script>
|
<style lang="scss">
|
.content {
|
width: 100%;
|
height: 100%;
|
position: relative;
|
.countDiv {
|
position: absolute;
|
left: 70px;
|
top: 20px;
|
height: 25px;
|
width: 300px;
|
.curCountDiv {
|
height: 30px;
|
margin: 3px 10px 3px 0px;
|
font-size: 14pt;
|
.curCapDiv {
|
color: white;
|
float: left;
|
}
|
.curTime {
|
float: left;
|
margin-left: 60px;
|
font-size: 14pt;
|
color: rgb(223, 174, 69);
|
}
|
}
|
}
|
.deviceInfo {
|
position: absolute;
|
top: 6px;
|
left: 10px;
|
width: 85%;
|
height: 98px;
|
opacity: 0.84;
|
background: #ffffff;
|
box-shadow: 0 10px 14px 0 rgba(0, 0, 0, 0.07);
|
border-radius: 4px;
|
.analy-came {
|
position: relative;
|
width: 14.96%;
|
height: 100%;
|
float: left;
|
.out-div1 {
|
padding: 20px 0;
|
.in-line {
|
line-height: 26px;
|
}
|
}
|
}
|
.div-1px {
|
float: left;
|
height: 88px;
|
}
|
.change-map {
|
position: relative;
|
width: 13.45%;
|
height: 100%;
|
float: right;
|
left: 180px;
|
top: -60px;
|
cursor: pointer;
|
}
|
}
|
.logo {
|
position: absolute;
|
right: 0px;
|
bottom: 40px;
|
height: 5%;
|
width: 100%;
|
background-image: url("/images/visual/mapbg.png");
|
background-size: 100% 100%;
|
}
|
.logo-device {
|
position: absolute;
|
right: 0px;
|
bottom: 5px;
|
height: 5%;
|
width: 100%;
|
background-image: url("/images/visual/deviceMaplogo.png");
|
background-size: 100% 100%;
|
}
|
}
|
.mapTool {
|
width: 100%;
|
height: 40px;
|
background-color: rgb(26, 43, 95);
|
i {
|
float: right;
|
font-size: 26px;
|
margin: 8px 15px;
|
color: #7280a1;
|
cursor: pointer;
|
}
|
}
|
#map {
|
width: 100%;
|
height: calc(100% - 40px);
|
font-family: "Avenir", Helvetica, Arial, sans-serif;
|
-webkit-font-smoothing: antialiased;
|
-moz-osx-font-smoothing: grayscale;
|
text-align: center;
|
color: #2c3e50;
|
}
|
.left-tool {
|
position: absolute;
|
top: 201px;
|
left: 10px;
|
.dev-list {
|
width: 42px;
|
height: 42px;
|
background: #fff;
|
margin-top: 1px;
|
border-radius: 4px;
|
text-align: center;
|
line-height: 44px;
|
cursor: pointer;
|
color: #000;
|
box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 3px;
|
border-radius: 2px;
|
.list-title {
|
height: 45px;
|
background: #f5f5f5;
|
border-radius: 4px 4px 0px 0px;
|
}
|
.device-list {
|
width: 100%;
|
position: absolute;
|
right: 10px;
|
}
|
}
|
.d2d-3d {
|
width: 42px;
|
height: 42px;
|
margin-top: 1px;
|
background: #fff;
|
border-radius: 4px;
|
text-align: center;
|
line-height: 44px;
|
cursor: pointer;
|
color: #000;
|
box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 3px;
|
border-radius: 2px;
|
}
|
.add-marker {
|
width: 42px;
|
height: 42px;
|
margin-top: 1px;
|
background: #fff;
|
border-radius: 4px;
|
text-align: center;
|
line-height: 44px;
|
cursor: pointer;
|
color: #000;
|
box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 3px;
|
border-radius: 2px;
|
}
|
}
|
.el-popover {
|
position: absolute;
|
background: #fff;
|
min-width: 150px;
|
border: 1px solid #ebeef5;
|
padding: 0px;
|
z-index: 2000;
|
color: #606266;
|
line-height: 1.4;
|
text-align: justify;
|
font-size: 14px;
|
-webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
word-break: break-all;
|
}
|
.cursor-move {
|
cursor: move;
|
/* 抑制选中 */
|
-moz-user-select: none;
|
-webkit-user-select: none;
|
user-select: none;
|
}
|
.img-icon {
|
font-size: 20px;
|
background-size: cover;
|
/* 抑制选中 */
|
-moz-user-select: none;
|
-webkit-user-select: none;
|
user-select: none;
|
}
|
</style>
|
