From b597204ef9e53ce47f48a412668be2a8df62282a Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Sat, 24 Apr 2021 15:31:32 +0800
Subject: [PATCH] 地图警情弹窗
---
public/map/widgets/supervisoryMap/SupervisoryMap.js | 322 +++++++++++++++++++++++++++++++----------------------
1 files changed, 187 insertions(+), 135 deletions(-)
diff --git a/public/map/widgets/supervisoryMap/SupervisoryMap.js b/public/map/widgets/supervisoryMap/SupervisoryMap.js
index 5ed8fd4..8e1c900 100644
--- a/public/map/widgets/supervisoryMap/SupervisoryMap.js
+++ b/public/map/widgets/supervisoryMap/SupervisoryMap.js
@@ -158,6 +158,12 @@
//防抖
onceTimeMethodS: null,
onceTime: 300,
+ // 警情缓存
+ Pdata: null,
+ //业主缓存
+ Ydata: null,
+ //设备缓存
+ Sdata: null,
constructor: function (options, srcRefNode) {
this._map = options.map;
@@ -283,20 +289,20 @@
$(this).addClass('on').siblings().removeClass('on');
var ind = $(this).index();
$($('.analysis-container > div')[ind]).stop().show().siblings().stop().hide();
- var overText = $('#policeCategory > div:eq(0)').text().trim() == '全部' ? '' : $('#policeCategory > div:eq(0)').text().trim();
- var levelText = $('#policeArea > div:eq(0)').text().trim() == '全部' ? '' : $('#policeArea > div:eq(0)').attr('areaid');
- if (ind == 1) {
+ // var overText = $('#policeCategory > div:eq(0)').text().trim() == '全部' ? '' : $('#policeCategory > div:eq(0)').text().trim();
+ // var levelText = $('#policeArea > div:eq(0)').text().trim() == '全部' ? '' : $('#policeArea > div:eq(0)').attr('areaid');
+ // if (ind == 1) {
that.getArea($('#policeArea'));
that.getPoliceTableAnalysis($($('.analysis-container > div')[ind]).find('.tbody tbody'),
$('#analysis_select_time_start').val() + ':00',
$('#analysis_select_time_end').val() + ':00', overText, levelText)
- } else if (ind == 2) {
- that.getOwnerType($('#ownerCategory'));
- that.getOwnerDj($('#ownerLevel'), '');
- that.getOwnerTable($($('.analysis-container > div')[ind]).find('.tbody tbody'), '', '');
- } else if (ind == 0) {
- that.getEquipmentTable($($('.analysis-container > div')[ind]).find('.tbody tbody'), '');
- }
+ // } else if (ind == 2) {
+ // that.getOwnerType($('#ownerCategory'));
+ // that.getOwnerDj($('#ownerLevel'), '');
+ // that.getOwnerTable($($('.analysis-container > div')[ind]).find('.tbody tbody'), '', '');
+ // } else if (ind == 0) {
+ // that.getEquipmentTable($($('.analysis-container > div')[ind]).find('.tbody tbody'), '');
+ // }
that.tabIndex = $(this).index();
})
@@ -351,68 +357,101 @@
// 警情列表中的点击事件
$('.analysis-container-police .analysis-table-content .tbody').off('click', 'tr').on('click', 'tr', function (event) {
var id = $(this).attr('term-list');
- // var url = './popup/html/police-details.html?obj=' + id;
- // layui.use('layer', function () {
- // that.layuiLayer = layui.layer;
- // that.layuiLayer.config({
- // extend: 'myskin/police-details.css'
- // });
- // that.layuiLayer.close(that.layuiLayer.index);
- // that.layuiLayer.open({
- // title: '警情详情',
- // type: 2,
- // shadeClose: true,
- // shade: false,
- // maxmin: false, //开启最大化最小化按钮
- // area: ['500px', '400px'],
- // offset: 'auto',
- // skin: 'police-details',
- // content: url,
- // closeBtn: 1,
- // });
- // })
-
- event.stopPropagation();
- var lgtd = Number($(this).find('input').attr('lgtd'));
- var lttd = Number($(this).find('input').attr('lttd'));
- // console.log($(this).find('input').attr('lttd'));
- var position = new esri.geometry.Point(lgtd, lttd, new esri.SpatialReference({ wkid: 4326 }));//根据输入坐标信息找地图上的点
- that._map.centerAndZoom(position, 18);//缩放，10是缩放级别，可以自定义，数值越大缩放越大
-
-
- var y = +window.innerHeight / 2 + 200;
- var x = (+window.innerWidth - 360) / 2 + 360 + 70;
- // document.elementFromPoint(x, y).click();
- // console.log(x, y)
-
- // var a = document.elementFromPoint(21, 122);
- // console.log(a);
-
- // console.log(that.clusterLayer, that._map, 6)
- // console.log(id, 'id');
- // console.log(that.clusterLayer);
- var Tattributes = null
- , ds = that.clusterLayer.allData;
- for (var key in ds) {
- if (ds[key].id == id) {
- Tattributes = ds[key];
+ var b = mySelf.Pdata;
+ for (var key in b) {
+ if (b[key].id == id) {
+ b = b[key];
+ break;
}
}
- if (mySelf.onceTimeMethod == null) {//防抖.限制时间内点击次数，否则会造成不能正确销毁前一个弹窗
- var evtdata = {};
- evtdata = {
- graphic: {
- attributes: Tattributes,
- },
- screenX: x,
- screenY: y,
- }
- that.clusterLayer._clickOpenOnclick(evtdata, '控制端', that.clusterLayer.indexs);
- mySelf.onceTimeMethod = setTimeout(() => {
- mySelf.onceTimeMethod = null;
- }, mySelf.onceTime);
+ console.log(b, id);
+ event.stopPropagation();
+ var winSize = [+window.innerHeight / 2 - 242 + 'px', +window.innerWidth - 380 + 'px']
+
+ if (b.jd == '' || b.wd == '') {
+ // console.log('无地图经纬度');
+ b.haveJW = '无地图经纬度';
} else {
- };
+ // console.log('有地图经纬度')
+ b.haveJW = '有地图经纬度';
+ var lgtd = Number($(this).find('input').attr('lgtd'));
+ var lttd = Number($(this).find('input').attr('lttd'));
+ // console.log($(this).find('input').attr('lttd'));
+ var position = new esri.geometry.Point(lgtd, lttd, new esri.SpatialReference({ wkid: 4326 }));//根据输入坐标信息找地图上的点
+ that._map.centerAndZoom(position, 18);//缩放，10是缩放级别，可以自定义，数值越大缩放越大
+ }
+ //解决重复JSON.stringify将循环结构转换为JSON。有几率出错，err：TypeError: Converting circular structure to JSON
+ //舍弃上面方法，原因是对象里面嵌入对象，造成不能转换成JSON，吧对象去掉就好，
+ var as = b;
+ // for (let key in as) {
+ // if (typeof as[key] == 'object') {
+ // as = as[key].attributes;
+ // // console.log('youduixang ')
+ // break;
+ // }
+ // }
+ var setdata = JSON.stringify(as);
+ // console.log(setdata,'setdata')
+
+ layui.use('layer', function () {
+ that.layuiLayer = layui.layer;
+ that.layuiLayer.config({
+ extend: 'myskin/FlareClusterLayer.css'
+ });
+ that.layuiLayer.close(that.layuiLayer.index);
+ that.layuiLayer.open({ //第二个iframe
+ title: '',
+ type: 2,
+ shadeClose: true,
+ shade: false,
+ skin: 'demo-class',
+ id: 'onelyTwo',
+ maxmin: false, //开启最大化最小化按钮
+ area: ['360px', '484px'],
+ // area: 'auto',
+ offset: winSize,
+ skin: 'flare',
+ isOutAnim: false,
+ closeBtn: 2, //关闭按钮，可通过配置1和2来展示,0关闭
+ content: ['./popup/html/SupervisoryMapPdata.html'],
+ resize: false,
+ scrollbar: false,
+ // tipsMore: true, //允许多个tipe
+ // content: num,
+ success: function (layero, index) { //成功后添加全局点击关闭
+ $("#layui-layer-iframe" + index).contents().find("#sidIput").val(setdata);
+
+ },
+ })
+ })
+ // // document.elementFromPoint(x, y).click();
+ // // console.log(x, y)
+
+ // // console.log(that.clusterLayer, that._map, 6)
+ // // console.log(id, 'id');
+ // // console.log(that.clusterLayer);
+ // var Tattributes = null
+ // , ds = that.clusterLayer.allData;
+ // for (var key in ds) {
+ // if (ds[key].id == id) {
+ // Tattributes = ds[key];
+ // }
+ // }
+ // if (mySelf.onceTimeMethod == null) {//防抖.限制时间内点击次数，否则会造成不能正确销毁前一个弹窗
+ // var evtdata = {};
+ // evtdata = {
+ // graphic: {
+ // attributes: Tattributes,
+ // },
+ // screenX: x,
+ // screenY: y,
+ // }
+ // that.clusterLayer._clickOpenOnclick(evtdata, '控制端', that.clusterLayer.indexs);
+ // mySelf.onceTimeMethod = setTimeout(() => {
+ // mySelf.onceTimeMethod = null;
+ // }, mySelf.onceTime);
+ // } else {
+ // };
})
$('.analysis-container-police .analysis-table-content .tbody').off('click', '.location').on('click', '.location', function (event) {
event.stopPropagation();
@@ -428,6 +467,14 @@
// 业主列表中的点击事件
$('.analysis-container-owner .analysis-table-content .tbody').off('click', 'tr').on('click', 'tr', function (event) {
var id = $(this).attr('term-list');
+ var b = mySelf.Ydata;
+ for (var key in b) {
+ if (b[key].id == id) {
+ b = b[key];
+ break;
+ }
+ }
+ console.log(b, id);
// var url = './popup/html/owner-details.html?id=' + id;
// layui.use('layer', function () {
// that.layuiLayer = layui.layer;
@@ -449,47 +496,48 @@
// });
// })
- event.stopPropagation();
- var lgtd = Number($(this).find('input').attr('lgtd'));
- var lttd = Number($(this).find('input').attr('lttd'));
- // console.log($(this).find('input').attr('lttd'));
- var position = new esri.geometry.Point(lgtd, lttd, new esri.SpatialReference({ wkid: 4326 }));//根据输入坐标信息找地图上的点
- that._map.centerAndZoom(position, 18);//缩放，10是缩放级别，可以自定义，数值越大缩放越大
+ // event.stopPropagation();
+ // var lgtd = Number($(this).find('input').attr('lgtd'));
+ // var lttd = Number($(this).find('input').attr('lttd'));
+ // // console.log($(this).find('input').attr('lttd'));
+ // var position = new esri.geometry.Point(lgtd, lttd, new esri.SpatialReference({ wkid: 4326 }));//根据输入坐标信息找地图上的点
+ // that._map.centerAndZoom(position, 18);//缩放，10是缩放级别，可以自定义，数值越大缩放越大
- var y = +window.innerHeight / 2 + 200;
- var x = (+window.innerWidth - 360) / 2 + 360 + 70;
- // document.elementFromPoint(x, y).click();
- // console.log(x, y)
+ // var y = +window.innerHeight / 2 + 200;
+ // var x = (+window.innerWidth - 360) / 2 + 360 + 70;
+ // // document.elementFromPoint(x, y).click();
+ // // console.log(x, y)
- // var a = document.elementFromPoint(21, 122);
- // console.log(a);
+ // // var a = document.elementFromPoint(21, 122);
+ // // console.log(a);
- // console.log(that.clusterLayer, that._map, 6)
- // console.log(id, 'id');
- // console.log(that.clusterLayer);
- var Tattributes = null
- , ds = that.clusterLayer.allData;
- for (var key in ds) {
- if (ds[key].id == id) {
- Tattributes = ds[key];
- }
- }
- if (mySelf.onceTimeMethod == null) {//防抖.限制时间内点击次数，否则会造成不能正确销毁前一个弹窗
- var evtdata = {};
- evtdata = {
- graphic: {
- attributes: Tattributes,
- },
- screenX: x,
- screenY: y,
- }
- that.clusterLayer._clickOpenOnclick(evtdata, '控制端', that.clusterLayer.indexs);
- mySelf.onceTimeMethod = setTimeout(() => {
- mySelf.onceTimeMethod = null;
- }, mySelf.onceTime);
- } else {
- };
+ // // console.log(that.clusterLayer, that._map, 6)
+ // // console.log(id, 'id');
+ // // console.log(that.clusterLayer);
+ // var Tattributes = null
+ // , ds = that.clusterLayer.allData;
+ // for (var key in ds) {
+ // if (ds[key].id == id) {
+ // Tattributes = ds[key];
+ // }
+ // }
+ // if (mySelf.onceTimeMethod == null) {//防抖.限制时间内点击次数，否则会造成不能正确销毁前一个弹窗
+ // var evtdata = {};
+ // evtdata = {
+ // graphic: {
+ // attributes: Tattributes,
+ // },
+ // screenX: x,
+ // screenY: y,
+ // }
+ // // console.log(that.clusterLayer,5555555555555);
+ // that.clusterLayer._clickOpenOnclick(evtdata, '控制端', that.clusterLayer.indexs);
+ // mySelf.onceTimeMethod = setTimeout(() => {
+ // mySelf.onceTimeMethod = null;
+ // }, mySelf.onceTime);
+ // } else {
+ // };
})
$('.analysis-container-owner .analysis-table-content .tbody').off('click', '.location').on('click', '.location', function (event) {
event.stopPropagation();
@@ -505,6 +553,7 @@
// 设备列表中的点击事件
$('.analysis-container-equipment .analysis-table-content .tbody').off('click', 'tr').on('click', 'tr', function (event) {
var id = $(this).attr('term-listid');
+ // console.log(mySelf.Sdata);
// // var url = './popup/html/equipment-details.html?obj=' + id;//设备每一项钟打开警情窗口
// // layui.use('layer', function () {
// // that.layuiLayer = layui.layer;
@@ -771,6 +820,7 @@
// var result = data.data.records;
var oldData = data.data.records
var result = oldData;
+ that.Pdata = oldData;
var str = '';
that.entitysData = [];
that.analysisAddEntitys.clear();
@@ -798,7 +848,7 @@
str += '<td title=' + result[i].waringType + '>' + result[i].waringType + '</td>';
str += '<td title=' + result[i].alarmPeople + '>' + result[i].alarmPeople + '</td>';
str += "<td><a href='javascript:;' title=" + time + ">" + y + ' ' + h + "</a></td>";
- str += "<td class='location'> <input type='button' value='定位'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
+ str += "<td class='location' style='display: none'> <input type='button' value='定位'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
// if (result[i].state != '') {
// stares = '故障';
// str += "<td class='location'> <input style='background-image:linear-gradient(to right, #F49966 , #F49966' type='button' value=" + stares + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
@@ -816,7 +866,7 @@
// str += "<td class='location'> <input style='background-image:linear-gradient(to right, #F35B5B , #F35B5B' type='button' value=" + stares + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
// }
// }
-
+
str += '</tr>';
dom.append(str);
str = '';
@@ -851,17 +901,17 @@
dom.children('div:eq(0)').html("全部 <i></i>");
dom.children('.select-list').children('ul').empty();
dom.children('.select-list').children('ul').append($("<li>全部</li>"));
- $.ajax({
- url: '/api/blade-jfpts/dj/dj/selectName?tnumbers=' + tnumbers,
- type: 'GET',
- dataType: 'JSON',
- success: function (data) {
- var res = data.data;
- for (var i = 0; i < res.length; i++) {
- dom.children('.select-list').children('ul').append($("<li>" + res[i].dj + "</li>"));
- }
- }
- })
+ // $.ajax({
+ // url: '/api/blade-jfpts/dj/dj/selectName?tnumbers=' + tnumbers,
+ // type: 'GET',
+ // dataType: 'JSON',
+ // success: function (data) {
+ // var res = data.data;
+ // for (var i = 0; i < res.length; i++) {
+ // dom.children('.select-list').children('ul').append($("<li>" + res[i].dj + "</li>"));
+ // }
+ // }
+ // })
},
// 获取业主信息列表
getOwnerTable: function (dom, type, dj) {
@@ -875,6 +925,7 @@
// var result = data.data;
var oldData = data.data
var result = oldData;
+ that.Ydata = oldData;
var str = '';
that.entitysData = [];
that.analysisAddEntitys.clear();
@@ -892,7 +943,7 @@
str += '<td>' + result[i].type + '</td>';
str += '<td>' + result[i].dj + '</td>';
str += '<td>' + result[i].yname + '</td>';
- str += "<td class='location'> <input type='button' value='定位'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
+ str += "<td class='location' style='display: none'> <input type='button' value='定位'" + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
str += '</tr>';
dom.append(str);
str = '';
@@ -923,41 +974,42 @@
type: 'GET',
dataType: 'JSON',
success: function (data) {
- var oldData = data.data
+ var oldData = data.data;
var result = [];
+ that.Sdata = oldData;
// console.log(result)
var str = '';
that.entitysData = [];
that.analysisAddEntitys.clear();
- if(deviceType == ''){
+ if (deviceType == '') {
result = oldData;
- }else if(deviceType == '在线'){
- for (var key in oldData){
+ } else if (deviceType == '在线') {
+ for (var key in oldData) {
// console.log(oldData[key]);
- if(oldData[key].state == '' && oldData[key].jtype != 1 && oldData[key].onlineStatus == 1){
+ if (oldData[key].state == '' && oldData[key].jtype != 1 && oldData[key].onlineStatus == 1) {
result.push(oldData[key]);
}
}
- }else if(deviceType == '离线'){
- for (var key in oldData){
+ } else if (deviceType == '离线') {
+ for (var key in oldData) {
// console.log(oldData[key]);
- if(oldData[key].state == '' && oldData[key].jtype != 1 && oldData[key].onlineStatus != 1){
+ if (oldData[key].state == '' && oldData[key].jtype != 1 && oldData[key].onlineStatus != 1) {
result.push(oldData[key]);
}
}
- }else if(deviceType == '警报'){
- for (var key in oldData){
+ } else if (deviceType == '警报') {
+ for (var key in oldData) {
// console.log(oldData[key]);
- if(oldData[key].state == '' && oldData[key].jtype == 1){
+ if (oldData[key].state == '' && oldData[key].jtype == 1) {
result.push(oldData[key]);
}
}
- }else if(deviceType == '故障'){
- for (var key in oldData){
+ } else if (deviceType == '故障') {
+ for (var key in oldData) {
// console.log(oldData[key]);
- if(oldData[key].state != ''){
+ if (oldData[key].state != '') {
result.push(oldData[key]);
}
}
@@ -980,7 +1032,7 @@
str += '<td>' + result[i].deviceNumber + '</td>';
// console.log(result[i].state);
-
+
if (result[i].state != '') {
stares = '故障';
str += "<td class='location'> <input style='background-image:linear-gradient(to right, #F49966 , #F49966' type='button' value=" + stares + ' lgtd=' + result[i].jd + ' lttd=' + result[i].wd + "></td>";
--
Gitblit v1.9.3