453 lines
15 KiB
JavaScript
453 lines
15 KiB
JavaScript
|
// import {layuiElement} from '../../tool/tool.js';
|
|||
|
|
// import {deviceHash} from '../../api/moveDeviceWebsocket.js';
|
|||
|
|
// import {mainMap,mapPlugin} from "../../pages/index/js/httpInit.js";
|
|||
|
|
// import {openMapInfo} from "../index/js/moveDeviceMarker.js"
|
|||
|
|
// import {aloneVideo,aloneTalk} from "../index/js/tree.js";
|
|||
|
|
// import {popTalkPage} from "./popTalk.js";
|
|||
|
|
// import {popTask} from "./popTask.js";
|
|||
|
|
// import {getOptionsToolPerson,drawMoserToolMarker} from "../index/js/mapOperEvent.js";
|
|||
|
|
import { deviceHash } from "../api/moveDeviceWebsocket.js";
|
|||
|
|
import { layuiObj,mainMap,mapPlugin } from "./index.js";
|
|||
|
|
import { moveDeviceMarkerHash } from "./marker/moveDeviceMarker.js";
|
|||
|
|
import { drawMoserToolMarker } from "./pageEventTool.js";
|
|||
|
|
import { aloneOpenVideo } from "./openMoveDeviceVideo.js";
|
|||
|
|
let eventHandleIndex=null;
|
|||
|
|
let alarmCirclePerson=[];//保存框选里面的人员
|
|||
|
|
let routerTempArr=[];//计算行驶里程用的。
|
|||
|
|
let alarmManageInfo={
|
|||
|
|
"alarmR":100,
|
|||
|
|
"circle":null,
|
|||
|
|
"longitude":0,
|
|||
|
|
"latitude":0
|
|||
|
|
}
|
|||
|
|
//处置事件
|
|||
|
|
function openEventHandle(){
|
|||
|
|
var deviceid=alarmManageInfo["deviceid"];
|
|||
|
|
if(eventHandleIndex==null){
|
|||
|
|
eventHandleIndex=layuiObj["layer"].open({
|
|||
|
|
type: 1,
|
|||
|
|
title: false, //不显示标题栏
|
|||
|
|
closeBtn: false,
|
|||
|
|
area: ['588px', '322px'],
|
|||
|
|
shade: 0,
|
|||
|
|
id: new Date().getTime(), //设定一个id，防止重复弹出
|
|||
|
|
offset: ['100px',"-10px"],
|
|||
|
|
move:'.layui-move',
|
|||
|
|
offset:'rt',
|
|||
|
|
moveType: 1, //拖拽模式，0或者1
|
|||
|
|
content:`<div class="popTaskSendListEvent popWindows">
|
|||
|
|
<div class="taskSendListEventInfo">
|
|||
|
|
<div class="taskSendListEventTitle">
|
|||
|
|
<span class="layui-move">选择对象</span>
|
|||
|
|
<img src="./pages/cmddispatch/image/closeInfoWindow.png">
|
|||
|
|
</div>
|
|||
|
|
<div class="taskSendEventOperTime">
|
|||
|
|
<div class="taskRange">
|
|||
|
|
<span>范围</span>
|
|||
|
|
<button class="layui-btn layui-border-blue delRange">-</button>
|
|||
|
|
<input type="text" value='${alarmManageInfo["alarmR"]}' class="freeAlarmRange">
|
|||
|
|
<button class="layui-btn layui-border-blue addRange">+</button>
|
|||
|
|
<span>米</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="taskSendOptions">
|
|||
|
|
<ul>
|
|||
|
|
<li>
|
|||
|
|
<span></span>
|
|||
|
|
<span>对象列表</span>
|
|||
|
|
<span class="alarmTaskCount">(0)</span>
|
|||
|
|
</li>
|
|||
|
|
<li>
|
|||
|
|
<button type="button" class="layui-btn " id="alarmManageDeletePerson">删除人员</button>
|
|||
|
|
<button type="button" class="layui-btn " id="alarmManageAddPerson">添加人员</button>
|
|||
|
|
</li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
<div class="taskSendL"></div>
|
|||
|
|
<div class="taskSendHandle">
|
|||
|
|
<p>
|
|||
|
|
<button type="button" class="layui-btn alarmGroupTask">群任务</button>
|
|||
|
|
</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>`,
|
|||
|
|
success:function(layero){
|
|||
|
|
//loadOffsetLeft=parseFloat($(".taskSendL").offset().left)+240
|
|||
|
|
//loadOffsetTop=parseFloat($(".taskSendL").offset().top)+40
|
|||
|
|
initAlarmInfo();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}else{
|
|||
|
|
closeEventIndex();
|
|||
|
|
openEventHandle(deviceid);
|
|||
|
|
}
|
|||
|
|
//关闭
|
|||
|
|
$(".taskSendListEventTitle>img").click(function(){
|
|||
|
|
//关闭画圈
|
|||
|
|
if(alarmManageInfo["circle"]!=null){
|
|||
|
|
mainMap.remove(alarmManageInfo["circle"]);
|
|||
|
|
alarmManageInfo["circle"]=null;
|
|||
|
|
}
|
|||
|
|
closeEventIndex()
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initAlarmInfo(){
|
|||
|
|
//画1.5公里的圈圈
|
|||
|
|
alarmEmpty();
|
|||
|
|
var circle=drawAlarmCircle();
|
|||
|
|
alarmManageInfo["circle"]=circle;
|
|||
|
|
var circlePerson=getOptionsToolPerson(alarmManageInfo["circle"]);
|
|||
|
|
alarmCirclePerson=JSON.parse(JSON.stringify(circlePerson));
|
|||
|
|
routerTempArr=JSON.parse(JSON.stringify(circlePerson));
|
|||
|
|
selectAlarmWalking();
|
|||
|
|
taskSendEvent();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
//通过工具获取圈里里面的人员
|
|||
|
|
function getOptionsToolPerson(overlayPath){
|
|||
|
|
var alarmCirclePerson=[];
|
|||
|
|
for(var deviceid in moveDeviceMarkerHash){
|
|||
|
|
var lnglat=moveDeviceMarkerHash[deviceid].getPosition();
|
|||
|
|
var point=[lnglat["lng"],lnglat["lat"]];
|
|||
|
|
var range=overlayPath.contains(point);
|
|||
|
|
if(range){//在圈里面,在去显示
|
|||
|
|
var flag=0;
|
|||
|
|
for(var i=0;i<alarmCirclePerson.length;i++){
|
|||
|
|
if(alarmCirclePerson[i]["deviceid"]==deviceid){
|
|||
|
|
flag++;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(flag==0){
|
|||
|
|
if(deviceid in deviceHash){
|
|||
|
|
var devicetype=deviceHash[deviceid]["devicetype"];
|
|||
|
|
if(devicetype!="room"){
|
|||
|
|
alarmCirclePerson.push(deviceHash[deviceid]);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return alarmCirclePerson;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function closeEventIndex(){
|
|||
|
|
if(eventHandleIndex!=null){
|
|||
|
|
layuiObj["layer"].close(eventHandleIndex);
|
|||
|
|
eventHandleIndex=null;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//根据内环，中环，外环，画等级圈
|
|||
|
|
function drawAlarmCircle(){
|
|||
|
|
var longitude=alarmManageInfo["longitude"];
|
|||
|
|
var latitude=alarmManageInfo["latitude"];
|
|||
|
|
var r=alarmManageInfo["alarmR"];
|
|||
|
|
var circle=new AMap.Circle({//圆形编辑器的样式
|
|||
|
|
center:new AMap.LngLat(longitude, latitude),
|
|||
|
|
radius:r,
|
|||
|
|
fillColor:"#842517",//填充颜色
|
|||
|
|
fillOpacity:0.6,//填充透明度
|
|||
|
|
strokeColor: "#842517", //线颜色
|
|||
|
|
strokeOpacity:1, //线透明度
|
|||
|
|
strokeWeight:2, //线粗细度
|
|||
|
|
zIndex:4
|
|||
|
|
});
|
|||
|
|
mainMap.setZoomAndCenter(18,[longitude, latitude]);
|
|||
|
|
circle.setMap(mainMap);
|
|||
|
|
return circle;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
var routerFlag=0;
|
|||
|
|
var routerTempDeviceid="";
|
|||
|
|
function selectAlarmWalking(){
|
|||
|
|
//load([loadOffsetTop+"px",loadOffsetLeft+"px"]);
|
|||
|
|
var routerTimer=setInterval(function(){
|
|||
|
|
if(routerTempArr.length==0){
|
|||
|
|
clearInterval(routerTimer);
|
|||
|
|
routerFlag=0;
|
|||
|
|
alarmCirclePerson.sort(ridingTimeSort);
|
|||
|
|
//加载列表
|
|||
|
|
getTotalTaskList();
|
|||
|
|
//closeLoad();
|
|||
|
|
}
|
|||
|
|
if(routerFlag==0){
|
|||
|
|
if(routerTempArr.length!=0){
|
|||
|
|
var startLng=routerTempArr[0]["longitude"];
|
|||
|
|
var startLat=routerTempArr[0]["latitude"];
|
|||
|
|
routerTempDeviceid=routerTempArr[0]["deviceid"];
|
|||
|
|
totalMileageTime(startLng,startLat);
|
|||
|
|
routerFlag=1;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//计算里程跟时间
|
|||
|
|
function totalMileageTime(startLng,startLat){
|
|||
|
|
//构造路线导航类
|
|||
|
|
AMap.plugin('AMap.Driving', function() {
|
|||
|
|
var riding = new AMap.Driving();
|
|||
|
|
// 根据起终点经纬度规划骑车路线(这是异步调用)
|
|||
|
|
riding.search(new AMap.LngLat(startLng,startLat), new AMap.LngLat(alarmManageInfo["longitude"],alarmManageInfo["latitude"]), function(status, result) {
|
|||
|
|
routerTempArr.splice(0,1);
|
|||
|
|
routerFlag=0;
|
|||
|
|
if (status === 'complete') {
|
|||
|
|
var routes=result["routes"][0];
|
|||
|
|
var time=parseFloat(routes["time"]/60).toFixed(2);
|
|||
|
|
var distance=parseFloat(routes["distance"]/1000).toFixed(2);
|
|||
|
|
for(var i=0;i<alarmCirclePerson.length;i++){
|
|||
|
|
if(routerTempDeviceid==alarmCirclePerson[i]["deviceid"]){
|
|||
|
|
alarmCirclePerson[i]["ridingTime"]=time;
|
|||
|
|
alarmCirclePerson[i]["ridingDistance"]=distance;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*升序排列*/
|
|||
|
|
function ridingTimeSort(a,b){
|
|||
|
|
return a.ridingTime-b.ridingTime;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getTotalTaskList(){
|
|||
|
|
|
|||
|
|
var div="";
|
|||
|
|
for(var i=0;i<alarmCirclePerson.length;i++){
|
|||
|
|
var showname=alarmCirclePerson[i]["showname"];
|
|||
|
|
var ridingTime=alarmCirclePerson[i]["ridingTime"];
|
|||
|
|
var ridingDistance=alarmCirclePerson[i]["ridingDistance"];
|
|||
|
|
var deviceid=alarmCirclePerson[i]["deviceid"];
|
|||
|
|
div+=` <div deviceid='${deviceid}'>
|
|||
|
|
<p>
|
|||
|
|
<span></span>
|
|||
|
|
<span class="alarmShowName">${showname}</span>
|
|||
|
|
<span>(预计<i>${ridingTime}</i>分钟,共<i>${ridingDistance}</i>千米)</span>
|
|||
|
|
</p>
|
|||
|
|
<p>
|
|||
|
|
<img src="./pages/cmddispatch/image/indexVideoOnline.png" class="alarmVideo">
|
|||
|
|
</p>
|
|||
|
|
</div>`;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
$(".taskSendL").html(div);
|
|||
|
|
$(".alarmTaskCount").html(`(${alarmCirclePerson.length})`);
|
|||
|
|
taskSendEvent();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function addCirclePerson(overlayPath){
|
|||
|
|
for(var deviceid in deviceHash){
|
|||
|
|
var status=deviceHash[deviceid]["status"];
|
|||
|
|
if(status!="offline"){
|
|||
|
|
var point=[deviceHash[deviceid]["longitude"],deviceHash[deviceid]["latitude"]];
|
|||
|
|
var range=overlayPath.contains(point);
|
|||
|
|
if(range){//在圈里面,在去显示
|
|||
|
|
var flag=0;
|
|||
|
|
for(var i=0;i<alarmCirclePerson.length;i++){
|
|||
|
|
if(alarmCirclePerson[i]["deviceid"]==deviceid){
|
|||
|
|
flag++;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(flag==0){
|
|||
|
|
alarmCirclePerson.push(deviceHash[deviceid]);
|
|||
|
|
routerTempArr.push(deviceHash[deviceid]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function alarmManageGroupData(){
|
|||
|
|
var receivers = $(".taskSendL>div>p>span:first-child");
|
|||
|
|
var totalArr = []
|
|||
|
|
for(var i = 0; i < receivers.length; i++) {
|
|||
|
|
var receiver= receivers[i];
|
|||
|
|
var length=$(receiver).children().length
|
|||
|
|
var deviceid=$(receiver).parent().parent().attr("deviceid");
|
|||
|
|
if(length>0){
|
|||
|
|
if(deviceid in deviceHash){
|
|||
|
|
totalArr.push(deviceHash[deviceid]);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return totalArr;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function taskSendEvent(){
|
|||
|
|
//全选
|
|||
|
|
$(".taskSendOptions>ul>li>span:first-child").off('click');
|
|||
|
|
$(".taskSendOptions>ul>li>span:first-child").on('click',function(){
|
|||
|
|
var spanOption=$(this).children().length;
|
|||
|
|
var otherOption=$(".taskSendL>div>p>span:nth-child(1)");
|
|||
|
|
if(spanOption>0){
|
|||
|
|
$(this).empty();
|
|||
|
|
$(otherOption).empty();
|
|||
|
|
}else{
|
|||
|
|
var img="<img src='./pages/cmddispatch/image/indexOk.png'>"
|
|||
|
|
$(this).append(img);
|
|||
|
|
for(var i=0;i<otherOption.length;i++){
|
|||
|
|
var thisOption=otherOption[i];
|
|||
|
|
var thisL=$(thisOption).children().length;
|
|||
|
|
if(thisL==0){
|
|||
|
|
$(thisOption).append(img);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
//单选
|
|||
|
|
$(".taskSendL>div>p>span:first-child").off('click');
|
|||
|
|
$(".taskSendL>div>p>span:first-child").on('click',function(){
|
|||
|
|
var spanOption=$(this).children().length;
|
|||
|
|
var otherOption=$(".taskSendOptions>ul>li>span:first-child");
|
|||
|
|
if(spanOption>0){
|
|||
|
|
$(this).empty();
|
|||
|
|
$(otherOption).empty();
|
|||
|
|
}else{
|
|||
|
|
var img="<img src='./pages/cmddispatch/image/indexOk.png'>"
|
|||
|
|
$(this).append(img);
|
|||
|
|
var thisSpan=$(".taskSendL>div>p>span:first-child");
|
|||
|
|
var flag=0;
|
|||
|
|
for(var i=0;i<thisSpan.length;i++){
|
|||
|
|
var thisOption=thisSpan[i];
|
|||
|
|
var thisL=$(thisOption).children().length;
|
|||
|
|
if(thisL==0){
|
|||
|
|
flag++;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(flag==0){
|
|||
|
|
var otherC=$(otherOption).children();
|
|||
|
|
if(otherC.length==0){
|
|||
|
|
$(otherOption).append(img);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
//添加设备
|
|||
|
|
$("#alarmManageAddPerson").unbind();
|
|||
|
|
$("#alarmManageAddPerson").click(function(){
|
|||
|
|
drawMoserToolMarker('rectangle');
|
|||
|
|
mapPlugin["mouseToolIndexMap"].on('draw',function(e){
|
|||
|
|
var overlayPath=e.obj;
|
|||
|
|
addCirclePerson(overlayPath);
|
|||
|
|
selectAlarmWalking();//查询步行的路径
|
|||
|
|
mapPlugin["mouseToolIndexMap"].close(true);//关闭，并清除覆盖物
|
|||
|
|
});
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
//删除设备
|
|||
|
|
$("#alarmManageDeletePerson").unbind();
|
|||
|
|
$("#alarmManageDeletePerson").click(function(){
|
|||
|
|
$(".taskSendOptions>ul>li>span:first-child").empty();
|
|||
|
|
var alarmManageData=alarmManageGroupData();
|
|||
|
|
for(var i=0;i<alarmManageData.length;i++){
|
|||
|
|
var deviceid=alarmManageData[i]["deviceid"];
|
|||
|
|
for(var j=0;j<alarmCirclePerson.length;j++){
|
|||
|
|
if(deviceid==alarmCirclePerson[j]["deviceid"]){
|
|||
|
|
routerTempArr.splice(j,1);
|
|||
|
|
alarmCirclePerson.splice(j,1);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(alarmCirclePerson.length==0){
|
|||
|
|
//加载列表
|
|||
|
|
getTotalTaskList();
|
|||
|
|
}else{
|
|||
|
|
selectAlarmWalking();//查询步行的路径
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
//点击设备显示设备信息
|
|||
|
|
$(".alarmShowName").on('click',function(){
|
|||
|
|
var deviceid=$(this).parent().parent().attr("deviceid");
|
|||
|
|
openMapInfo(deviceid);
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
//当前设备的事件视频
|
|||
|
|
$(".alarmVideo").off('click');
|
|||
|
|
$(".alarmVideo").on('click',function(){
|
|||
|
|
var deviceid=$(this).parent().parent().attr("deviceid");
|
|||
|
|
if(deviceid in deviceHash){
|
|||
|
|
aloneOpenVideo(deviceHash[deviceid])
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
//事件的群任务
|
|||
|
|
$(".alarmGroupTask").off('click');
|
|||
|
|
$(".alarmGroupTask").on('click',function(){
|
|||
|
|
var taskArr=alarmManageGroupData();
|
|||
|
|
if(taskArr.length!=0){
|
|||
|
|
popTask(taskArr,"alarm");
|
|||
|
|
}else{
|
|||
|
|
layer.msg("请选择设备");
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
//添加范围
|
|||
|
|
$(".addRange").off('click');
|
|||
|
|
$(".addRange").on('click',function(){
|
|||
|
|
var range=parseInt($(".freeAlarmRange").val());
|
|||
|
|
range+=100;
|
|||
|
|
updateRange(range);
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
//删除范围
|
|||
|
|
$(".delRange").off('click');
|
|||
|
|
$(".delRange").on('click',function(){
|
|||
|
|
var range=parseInt($(".freeAlarmRange").val());
|
|||
|
|
range-=100;
|
|||
|
|
updateRange(range);
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
//调框选的大小,失去焦点的时候，触发
|
|||
|
|
$(".freeAlarmRange").off('blur');
|
|||
|
|
$(".freeAlarmRange").blur('input propertychange', function() {
|
|||
|
|
var range=parseInt($(this).val());
|
|||
|
|
updateRange(range);
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function updateRange(range){
|
|||
|
|
$(".taskSendOptions>ul>li>span:first-child").empty();
|
|||
|
|
if(range<100){
|
|||
|
|
layer.msg("最小范围为100");
|
|||
|
|
return;
|
|||
|
|
}else{
|
|||
|
|
alarmManageInfo["alarmR"]=range;
|
|||
|
|
initAlarmInfo();
|
|||
|
|
}
|
|||
|
|
$(".freeAlarmRange").val(range);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function alarmEmpty(){
|
|||
|
|
routerTempArr=[];
|
|||
|
|
alarmCirclePerson=[];
|
|||
|
|
if(alarmManageInfo["circle"]!=null){
|
|||
|
|
mainMap.remove(alarmManageInfo["circle"]);
|
|||
|
|
alarmManageInfo["circle"]=null;
|
|||
|
|
}
|
|||
|
|
if('alarminfo' in alarmManageInfo){
|
|||
|
|
delete alarmManageInfo["alarminfo"];
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export {
|
|||
|
|
openEventHandle,
|
|||
|
|
alarmEmpty,
|
|||
|
|
closeEventIndex,
|
|||
|
|
alarmManageInfo,
|
|||
|
|
initAlarmInfo
|
|||
|
|
}
|