/* * @Description: * @Version: 1.0 * @Author: yangsx * @Date: 2019-12-09 19:01:40 * @LastEditors: yangsx * @LastEditTime: 2019-12-14 14:44:57 */ define([ "dojo", "dojo/_base/declare", "dojo/_base/lang", "base/BaseWidget", "dojo/text!widgets/supervisoryMap/template.html", "base/AppEvent", "base/ConfigData", "widgets/supervisoryMap/config", "dojo/dom", "dojo/dom-construct", "dojo/dom-attr", "dojo/dom-style", "dojo/on", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ArcGISTiledMapServiceLayer", "esri/layers/FeatureLayer", "controls/tab/TabControl", "esri/dijit/SymbolStyler", "esri/styles/basic", "dojo/_base/array", "esri/InfoTemplate", "esri/tasks/query", "esri/tasks/QueryTask", "esri/Color", "esri/toolbars/edit", "esri/graphic", "esri/geometry/Point", "esri/geometry/Polyline", "esri/geometry/Polygon", "esri/geometry/Extent", "esri/tasks/FeatureSet", "esri/renderers/HeatmapRenderer", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "esri/symbols/PictureMarkerSymbol", "esri/symbols/SimpleMarkerSymbol", "esri/SpatialReference", "esri/tasks/GeometryService", "esri/tasks/ProjectParameters", "esri/layers/GraphicsLayer", "esri/layers/LabelLayer", "esri/symbols/TextSymbol", "esri/renderers/SimpleRenderer", "esri/renderers/ClassBreaksRenderer", "esri/tasks/Geoprocessor", "esri/tasks/DataFile", "esri/geometry/webMercatorUtils", "esri/symbols/Font", "esri/geometry/ScreenPoint", "esri/layers/ImageParameters", "esri/geometry/geometryEngine", "esri/dijit/PopupTemplate", "widgets/supervisoryMap/FlareClusterLayer_v3", "dojo/domReady!" ], function ( dojo, declare, lang, BaseWidget, template, AppEvent, ConfigData, config, dom, domConstruct, domAttr, domStyle, on, ArcGISDynamicMapServiceLayer, ArcGISTiledMapServiceLayer, FeatureLayer, TabControl, SymbolStyler, basic, arrayUtils, InfoTemplate, Query, QueryTask, Color, Edit, Graphic, Point, Polyline, Polygon, Extent, FeatureSet, HeatmapRenderer, SimpleLineSymbol, SimpleFillSymbol, PictureMarkerSymbol, SimpleMarkerSymbol, SpatialReference, GeometryService, ProjectParameters, GraphicsLayer, LabelLayer, TextSymbol, SimpleRenderer, ClassBreaksRenderer, Geoprocessor, DataFile, webMercatorUtils, Font, ScreenPoint, ImageParameters, geometryEngine, PopupTemplate, FlareClusterLayer ) { var Widget = declare([BaseWidget], { widgetName: "AlertSecurity", label: "地图模式", templateString: template, _map: null, objThis: null, _siteLayer: new GraphicsLayer(), layuiLayer: null, layuiLadate: null, tabIndex: 0, heatmapfeatureLayer: null,//liu热力图 // 保留添加实体图层的变量 addEntitys: null, entitysData: [], // 巡逻区域或者巡逻路线的描述 routeOrRegionDescribe: null, // 用来记录巡逻区域或者巡逻路线的下标的 patrolIndex: 0, // 拖拽 isDown: false, x: 0, y: 0, offset: null, moveThis: null, // 电子围栏需要新增的Id newElectronicFenceId: null, // 新增路线时,派发人员,人员名称,以及人员id peopleRealName: null, pepleRealId: null, //存放聚合实体 clusterLayer: null, //左侧控制栏 entityData: [], analysisAddEntitys: null, //防抖 onceTimeMethodS: null, onceTime: 300, constructor: function (options, srcRefNode) { this._map = options.map; objThis = this; this.addEntitys = new GraphicsLayer({ id: 'addEntitys' }); // 添加点面线的图层 this.addPolygonEntitys = new GraphicsLayer({ id: 'addPolygonEntitys' }); // 添加所有图层的地方 this.entityPolygonAll = new GraphicsLayer({ id: 'entityPolygonAll' }); this._map.addLayer(this.addEntitys); this._map.addLayer(this.addPolygonEntitys); this._map.addLayer(this.entityPolygonAll); this.analysisAddEntitys = new GraphicsLayer({ id: 'analysisAddEntitys' }); // this.addOneEntitys = new GraphicsLayer({ id: 'addOneEntitys' }); // this.addTwoEntitys = new GraphicsLayer({ id: 'addTwoEntitys' }); // this.addThreeEntitys = new GraphicsLayer({ id: 'addThreeEntitys' }); this._map.addLayer(this.analysisAddEntitys); this._map.addLayer(this.addOneEntitys); }, open: function () { var that = this; $.ajax({ url: "/api/blade-jfpts/equipment/equipment/listAll", type: 'get', dataType: 'JSON', success: function (res) { var datas = res.data; var heatmapRenderer = null; that.entityData = []; for (var i = 0; i < datas.length; i++) { datas[i].x = Number(datas[i].jd); datas[i].y = Number(datas[i].wd); that.entityData.push({ lgtd: Number(datas[i].jd), lttd: Number(datas[i].wd) }) } that.flareClusterLayer(datas); that.heatmapfeatureLayer = that.heatmFeaLayers(); that._map.addLayer(that.heatmapfeatureLayer); // that.checkBoxSelect();//左侧控制热力图重复 } }) var that = this; var intTime = () => { var time = this.getTime(); $("#tabcontainer").css("width", "360px"); $('#mapcontentClass').addClass('client-max-map'); //追加样式 AppEvent.dispatchAppEvent(AppEvent.APPLICATION_RESIZE, {}); that.tabIndex = 0; $('.analysis-and-judgment-tab li:eq(0)').addClass('on').siblings().removeClass('on'); $($('.analysis-container > div')[0]).stop().show().siblings().stop().hide(); that.heatmapfeatureLayer_1 = that.heatmFeaLayers(); that._map.addLayer(that.heatmapfeatureLayer_1); $('#analysis_select_time_start').val(time.tomorrow); $('#analysis_select_time_end').val(time.current); layui.use('laydate', function () { that.layuiLadate = layui.laydate; //执行一个laydate实例 开始 that.layuiLadate.render({ elem: '#analysis_select_time_start', //指定元素 type: "datetime", format: 'yyyy-MM-dd HH:mm', trigger: 'click' }); // 结束 that.layuiLadate.render({ elem: '#analysis_select_time_end', //指定元素 type: "datetime", format: 'yyyy-MM-dd HH:mm', trigger: 'click' }); }); that.getArea($('#policeArea')); that.getPoliceTableAnalysis($('.analysis-container-police').find('.tbody tbody'), time.tomorrow, time.current, '', ''); that.clickHand(); } intTime(); }, startup: function () { var mySelf = this; objThis._map.addLayer(objThis._siteLayer); var that = this; that.getEquipmentTable($('.analysis-container-equipment').find('.tbody tbody'), ''); // 顶部tab得切换事件 $('.analysis-and-judgment-tab li').click(function () { // if (that.tabIndex == $(this).index()) return; // if ($(this).index() == 1) { return }; // if ($(this).index() == 2) { return }; if (that.entitysData.length > 0) { that.analysisAddEntitys.clear(); that.entitysData = []; } if (that.heatmapfeatureLayer_1.graphics.length > 0) { that.heatmapfeatureLayer_1.clear(); that.heatmapfeatureLayer_1.setRenderer(); $('.analysis-category input').prop('checked', false); } $(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 == 0) { 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 == 1) { that.getOwnerType($('#ownerCategory')); that.getOwnerDj($('#ownerLevel'), ''); that.getOwnerTable($($('.analysis-container > div')[ind]).find('.tbody tbody'), '', ''); } else if (ind == 2) { that.getEquipmentTable($($('.analysis-container > div')[ind]).find('.tbody tbody'), ''); } that.tabIndex = $(this).index(); }) // 时间查询 $('#policeSelectTime').off('click').click(function () { var times = $(this).prevAll(); layui.use('layer', function () { var layer = layui.layer; // 开始时间 var startTime = $(times[2]).val(); // 结束时间 var endTime = $(times[0]).val(); if (startTime == '') { layer.msg('请选择开始时间!', { icon: 5, time: 2000 //2秒关闭(如果不配置,默认是3秒) }); return; } else { if (endTime == '') { layer.msg('请选择结束时间!', { icon: 5, time: 2000 //2秒关闭(如果不配置,默认是3秒) }); return; } else { var text = $('#policeCategory div:eq(0)').text().trim(); var levelText = $('#policeArea > div:eq(0)').text().trim() == '全部' ? '' : $('#policeArea > div:eq(0)').attr('areaid'); that.getPoliceTableAnalysis($('.analysis-container-police').find('.tbody tbody'), startTime, endTime, text == '全部' ? '' : text, levelText); } } }) }) // 警情列表中的点击事件 $('.analysis-container-police .analysis-table-content .tbody').off('click', 'tr').on('click', 'tr', function () { 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, }); }) }) $('.analysis-container-police .analysis-table-content .tbody').off('click', '.location').on('click', '.location', function (event) { event.stopPropagation(); }) $('.analysis-container-police .analysis-table-content .tbody').off('click', '.location input').on('click', '.location input', function (event) { event.stopPropagation(); var lgtd = Number($(this).attr('lgtd')); var lttd = Number($(this).attr('lttd')); var position = new esri.geometry.Point(lgtd, lttd, new esri.SpatialReference({ wkid: 4326 }));//根据输入坐标信息找地图上的点 that._map.centerAndZoom(position, 18);//缩放,10是缩放级别,可以自定义,数值越大缩放越大 }) // 业主列表中的点击事件 $('.analysis-container-owner .analysis-table-content .tbody').off('click', 'tr').on('click', 'tr', function () { var id = $(this).attr('term-list'); var url = './popup/html/owner-details.html?id=' + id; layui.use('layer', function () { that.layuiLayer = layui.layer; that.layuiLayer.config({ extend: 'myskin/owner-details.css' }); that.layuiLayer.close(that.layuiLayer.index); that.layuiLayer.open({ title: '业主详情', type: 2, shadeClose: true, shade: false, maxmin: false, //开启最大化最小化按钮 area: ['500px', '340px'], offset: 'auto', skin: 'owner-details', content: url, closeBtn: 1, }); }) }) $('.analysis-container-owner .analysis-table-content .tbody').off('click', '.location').on('click', '.location', function (event) { event.stopPropagation(); }) $('.analysis-container-owner .analysis-table-content .tbody').off('click', '.location input').on('click', '.location input', function (event) { event.stopPropagation(); var lgtd = Number($(this).attr('lgtd')); var lttd = Number($(this).attr('lttd')); var position = new esri.geometry.Point(lgtd, lttd, new esri.SpatialReference({ wkid: 4326 }));//根据输入坐标信息找地图上的点 that._map.centerAndZoom(position, 18);//缩放,10是缩放级别,可以自定义,数值越大缩放越大 }) // 设备列表中的点击事件 $('.analysis-container-equipment .analysis-table-content .tbody').off('click', 'tr').on('click', 'tr', function (event) { var id = $(this).attr('term-listid'); // // var url = './popup/html/equipment-details.html?obj=' + id;//设备每一项钟打开警情窗口 // // layui.use('layer', function () { // // that.layuiLayer = layui.layer; // // that.layuiLayer.config({ // // extend: 'myskin/equipment-details.css' // // }); // // that.layuiLayer.close(that.layuiLayer.index); // // that.layuiLayer.open({ // // title: '警情详情', // // type: 2, // // shadeClose: true, // // shade: false, // // maxmin: false, //开启最大化最小化按钮 // // area: ['520px', '320px'], // // offset: 'auto', // // skin: 'equipment-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.indexs); 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-equipment .analysis-table-content .tbody').off('click', '.location').on('click', '.location', function (event) { // event.stopPropagation(); // }) $('.analysis-container-equipment .analysis-table-content .tbody').off('click', '.location input').on('click', '.location input', function (event) { event.stopPropagation(); var lgtd = Number($(this).attr('lgtd')); var lttd = Number($(this).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.indexs); 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 { }; }) // 警情列表中得热力图是否选中事件 $('#policeHeatMap').click(function () { that.checkBoxSelect(this); }) // 业主信息列表中得热力图是否选中事件 $('#ownerHeatMap').click(function () { that.checkBoxSelect(this); }) // 设备信息列表的热力图是否选中事件 $('#equipmentHeatMap').click(function () { that.checkBoxSelect(this); }) // 警情信息中类别移入事件 $('#policeCategory').mouseenter(function () { if ($('#policeCategory .select-list').is(':hidden')) { $('#policeCategory .select-list').stop().slideDown(0); } }) // 警情信息中得类别移出事件 $('#policeCategory').mouseleave(function () { if (!$('#policeCategory .select-list').is(':hidden')) { $('#policeCategory .select-list').stop().slideUp(0); } }) // 警情信息中行政区移入事件 $('#policeArea').mouseenter(function () { if ($('#policeArea .select-list').is(':hidden')) { $('#policeArea .select-list').stop().slideDown(0); } }) // 警情信息中得行政区移出事件 $('#policeArea').mouseleave(function () { if (!$('#policeArea .select-list').is(':hidden')) { $('#policeArea .select-list').stop().slideUp(0); } }) // 业主信息中类别移入事件 $('#ownerCategory').mouseenter(function () { if ($('#ownerCategory .select-list').is(':hidden')) { $('#ownerCategory .select-list').stop().slideDown(0); } }) // 业主信息中得类别移出事件 $('#ownerCategory').mouseleave(function () { if (!$('#ownerCategory .select-list').is(':hidden')) { $('#ownerCategory .select-list').stop().slideUp(0); } }) // 业主信息中的等级移入事件 $('#ownerLevel').mouseenter(function () { if ($('#ownerLevel .select-list').is(':hidden')) { $('#ownerLevel .select-list').stop().slideDown(0); } }) // 业主信息中的等级移出事件 $('#ownerLevel').mouseleave(function () { if (!$('#ownerLevel .select-list').is(':hidden')) { $('#ownerLevel .select-list').stop().slideUp(0); } }) // 设备信息中类别移入事件 $('#equipmentCategory').mouseenter(function () { if ($('#equipmentCategory .select-list').is(':hidden')) { $('#equipmentCategory .select-list').stop().slideDown(0); } }) // 设备信息中得类别移出事件 $('#equipmentCategory').mouseleave(function () { if (!$('#equipmentCategory .select-list').is(':hidden')) { $('#equipmentCategory .select-list').stop().slideUp(0); } }) // 警情信息类,业主信息类,设备信息类别,具体项的点击事件 $('.analysis-container > div .select-list').off('click', 'li').on('click', 'li', function (event) { // console.log(event.currentTarget.innerHTML,'innerhtml') var text = $(this).text().trim(); // console.log(text,'text()') // console.log(that.tabIndex,'tabIndex') $(this).parent().parent().prev().html(text + ''); $(this).parent().parent().stop().slideUp(0); if ($(this).attr('areaid')) { $(this).parent().parent().prev().attr('areaid', $(this).attr('areaid')); } else if ($(this).attr('ownerid')) { $(this).parent().parent().prev().attr('ownerid', $(this).attr('ownerid')); } if (that.tabIndex == 1) { var levelText = $('#policeArea > div:eq(0)').text().trim() == '全部' ? '' : $('#policeArea > div:eq(0)').attr('areaid'); var overText = $('#policeCategory > div:eq(0)').text().trim() == '全部' ? '' : $('#policeCategory > div:eq(0)').text().trim(); if ($(this).attr('areaid')) { that.getPoliceTableAnalysis($('.analysis-container-police').find('.tbody tbody'), $('#analysis_select_time_start').val(), $('#analysis_select_time_end').val(), overText, levelText); } else { that.getPoliceTableAnalysis($('.analysis-container-police').find('.tbody tbody'), $('#analysis_select_time_start').val(), $('#analysis_select_time_end').val(), overText, levelText); } } else if (that.tabIndex == 2) { var categoryText = $('#ownerCategory > div:eq(0)').text().trim() == '全部' ? '' : $('#ownerCategory > div:eq(0)').attr('ownerid'); var levelText = $('#ownerLevel > div:eq(0)').text().trim() == '全部' ? '' : $('#ownerLevel > div:eq(0)').text().trim(); var parentId = $(this).parent().parent().parent().attr('id'); if (parentId == 'ownerCategory') { that.getOwnerDj($('#ownerLevel'), categoryText); that.getOwnerTable($('.analysis-container-owner').find('.tbody tbody'), categoryText, ''); } else { that.getOwnerTable($('.analysis-container-owner').find('.tbody tbody'), categoryText, levelText); } } else if (that.tabIndex == 0) { that.getEquipmentTable($('.analysis-container-equipment').find('.tbody tbody'), text == '全部' ? '' : text); } }) }, getQueryStringByKey: function (key) { return (document.location.search.match(new RegExp("(?:^\\?|&)" + key + "=(.*?)(?=&|$)")) || ['', null])[1]; }, //左侧控制栏 getArea: function (dom) { dom.children('.select-list').children('ul').empty(); dom.children('.select-list').children('ul').append($("