trafficMap.html 58 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8"/>
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  7. <title>可视化编辑</title>
  8. <link rel="stylesheet" href="../../../../assets/libs/layui/css/layui.css"/>
  9. <link rel="stylesheet" href="../../../../assets/module/admin.css?v=312"/>
  10. <link rel="stylesheet" href="../../../../assets/css/editormap.css?v=312"/>
  11. <link rel="stylesheet" type="text/css" href="../../../../assets/libs/leaflet/leaflet-draw/leaflet.draw-src.css">
  12. <link rel="stylesheet" type="text/css" href="../../../../assets/libs/leaflet/leaflet.css">
  13. <link rel="stylesheet" href="../../../../assets/module/formSelects/formSelects-v4.css"/>
  14. <style>
  15. .risk_point_dot {
  16. width: 30px;
  17. height: 30px;
  18. border-radius: 15px !important;
  19. text-align: center;
  20. color: #fff;
  21. vertical-align: middle;
  22. display: table-cell;
  23. }
  24. .level_ {
  25. background-color: #0b0b0b;
  26. }
  27. .level1_ {
  28. background-color: red;
  29. }
  30. .level2_ {
  31. background-color: #FB7437;
  32. }
  33. .level3_ {
  34. background-color: #FFDC44;
  35. }
  36. .level4_ {
  37. background-color: #14C2FB;
  38. }
  39. .risk_point_text {
  40. display: table-cell;
  41. vertical-align: middle;
  42. height: 30px;
  43. padding-left: 10px;
  44. }
  45. .info li {
  46. font-size: 15px;
  47. color: #222;
  48. line-height: 29px;
  49. margin-top: 10px;
  50. }
  51. .layui-layer-content {
  52. overflow: auto !important;
  53. }
  54. </style>
  55. </head>
  56. <body>
  57. <!-- 页面加载loading -->
  58. <div class="page-loading">
  59. <div class="ball-loader">
  60. <span></span><span></span><span></span><span></span>
  61. </div>
  62. </div>
  63. <!-- 正文开始 -->
  64. <div class="layui-fluid">
  65. <div class="layui-card">
  66. <div class="layui-card-header">
  67. 可视化编辑
  68. </div>
  69. <div class="layui-card-body">
  70. <div class="layui-form toolbar" lay-filter="formFilter">
  71. <div class="layui-row">
  72. <div class="layui-col-md5">
  73. <div class="layui-form-item">
  74. <div class="layui-inline">
  75. <label class="layui-form-label w-auto w-padding">部门:</label>
  76. <div class="layui-input-inline mr0">
  77. <input type="text" id="groupName" name="groupName" value=""
  78. placeholder="点击选择"
  79. class="layui-input" readonly>
  80. <input type="hidden" id="groupId" name="groupId">
  81. <div id="menuContent" class="menuContent">
  82. <ul id="groupTree" class="ztree" style="margin-top:0;"></ul>
  83. </div>
  84. </div>
  85. </div>
  86. <div class="layui-inline">
  87. <label class="layui-form-label w-auto w-padding">选择背景图:</label>
  88. <div class="layui-input-inline mr0">
  89. <select id="entMapList" name="entMapList" lay-filter="entMapList" lay-verType="tips"
  90. class="layui-input-block">
  91. <option value="">选择背景图</option>
  92. </select>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. <div class="col-md-2 pull-right">
  98. <a id="showUploadDlg1" class="layui-link" href="javascript:;">➕更换地图背景</a>
  99. </div>
  100. </div>
  101. </div>
  102. <div class="layui-row">
  103. <div class="layui-col-xs6 layui-col-sm6 layui-col-md2">
  104. <div class="layui-tab layui-tab-card" lay-filter="dangerSource" style="height: 715px;overflow:auto">
  105. <ul class="layui-tab-title">
  106. <li class="layui-this" lay-id="6">矿下交通库</li>
  107. </ul>
  108. <div class="layui-tab-content" style="height: 655px;">
  109. <div class="layui-tab-item layui-show">
  110. <ul id="facilityIconList" class="icon-box-ul">
  111. </ul>
  112. </div>
  113. <div class="layui-tab-item">
  114. <ul id="jobIconList" class="icon-box-ul">
  115. </ul>
  116. </div>
  117. </div>
  118. </div>
  119. </div>
  120. <div class="layui-col-xs6 layui-col-sm6 layui-col-md8">
  121. <div class="right-map" style="height: 715px">
  122. <div class="map-container" id="map"></div>
  123. </div>
  124. </div>
  125. <div class="layui-col-xs4 layui-col-sm12 layui-col-md2">
  126. <div class="icon-form-box" style="display: none">
  127. <form class="layui-form">
  128. <input type="hidden" name="entMapId" id="entMapId">
  129. <div class="my-form-group">
  130. <h3 class="riskp-detail">风险点基本信息:</h3>
  131. <div class="my-form-item">
  132. <label>主危险源:</label>
  133. <div id="my-marker">
  134. </div>
  135. <div id="my-marker-title">
  136. </div>
  137. </div>
  138. <div class="my-form-item my-marker-type">
  139. <!--<label>类型:</label>-->
  140. <!--<span id="markerType"></span>-->
  141. </div>
  142. <div class="my-form-item">
  143. <label for="riskPointName" class="marker-name">名称:</label>
  144. <input type="text" id="riskPointName" name="riskPointName" placeholder="请输入风险点名称">
  145. </div>
  146. <div class="my-form-item">
  147. <label class="control-label">责任部门:</label>
  148. <div style="position: relative;float: left;">
  149. <input type="text" id="liableGroupIdName" name="liableGroupIdName" value=""
  150. placeholder="点击选择" class="form-control" readonly>
  151. <input type="hidden" id="liableGroupId" name="liableGroupId">
  152. <div id="menuContent_" class="menuContent">
  153. <ul id="groupTree_" class="ztree" style="margin-top:0;"></ul>
  154. </div>
  155. </div>
  156. </div>
  157. <div class="my-form-item">
  158. <label for="riskPointName" class="marker-name">描述:</label>
  159. <textarea placeholder="请输入内容" name="riskPointDesc" id="riskPointDesc"
  160. class="layui-textarea"></textarea>
  161. </div>
  162. <div class="my-form-item" style="display: none;">
  163. <label for="riskPointName" class="marker-name">是否激活:</label>
  164. <input type="radio" lay-filter="isActive" name="isActive" value="1" title="激活"
  165. checked>
  166. <input type="radio" lay-filter="isActive" name="isActive" value="0" title="未激活">  
  167. </div>
  168. </div>
  169. <!-- <div class="btn-group my-btn-group">-->
  170. <div class="layui-btn-group my-btn-group">
  171. <a href="javascript:;" class="layui-btn " id="saveMarker" lay-filter="saveMarker"
  172. lay-submit>保存</a>
  173. <a href="javascript:;" class="layui-btn layui-btn-primary " id="deleteMarker">撤销</a>
  174. <a href="javascript:;" class="layui-btn layui-btn-danger " id="deleteMarker_"
  175. style="display: none">删除</a>
  176. </div>
  177. </form>
  178. </div>
  179. <div id="info" class="info">
  180. <fieldset class="layui-elem-field">
  181. <legend>使用说明</legend>
  182. <div class="layui-field-box">
  183. <ul>
  184. <li>1.点击选中设备设施或者作业活动分组下面的图标</li>
  185. <li>2.点击地图绘制点</li>
  186. <li>3.编辑信息保存风险点</li>
  187. </ul>
  188. </div>
  189. </fieldset>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. </div>
  195. </div>
  196. <!-- js部分 -->
  197. <script type="text/javascript" src="../../../../assets/libs/layui/layui.js"></script>
  198. <script type="text/javascript" src="../../../../assets/js/common.js?v=312"></script>
  199. <script type="text/javascript" src="../../../../assets/libs/jquery/jquery-3.2.1.min.js"></script>
  200. <script src="../../../../assets/libs/leaflet/leaflet.js"></script>
  201. <script src="../../../../assets/libs/leaflet/leaflet-draw/leaflet.draw-src.js"></script>
  202. <script src="../../../../assets/libs/leaflet/leaflet-draw/local.js"></script>
  203. <script src="../../../../assets/libs/leaflet/proj4-compressed.js"></script>
  204. <script src="../../../../assets/libs/leaflet/proj4leaflet.js"></script>
  205. <script type="text/html" id="upTpl">
  206. <form id="modelUserForm" lay-filter="modelUserForm" class="layui-form model-form">
  207. <div class="layui-form-item">
  208. <label class="layui-form-label w-padding">名称:</label>
  209. <div class="layui-input-block">
  210. <input name="entMapName" id="entMapName" placeholder="请输入名称" type="text" class="layui-input"/>
  211. </div>
  212. </div>
  213. <div class="layui-form-item">
  214. <label class="layui-form-label w-padding">地图类型:</label>
  215. <div class="layui-input-block">
  216. <select id="useType" name="useType">
  217. <option value="">请选择</option>
  218. <option value="1">四色风险地图</option>
  219. <option value="2">示意图</option>
  220. <option value="3">点位图</option>
  221. </select>
  222. </div>
  223. </div>
  224. <div class="layui-form-item">
  225. <label class="layui-form-label w-padding">背景图:</label>
  226. <div class="layui-input-block" id="uploadImg">
  227. <div class="layui-upload-drag">
  228. <i class="layui-icon"></i>
  229. <p>点击上传,或将文件拖拽到此处</p>
  230. </div>
  231. <img src="" id="vMapImg" width="100px">
  232. </div>
  233. <input name="mapImg" id="mapImg" type="hidden" class="layui-input">
  234. </div>
  235. <div class="layui-form-item">
  236. <label class="layui-form-label w-padding">序号:</label>
  237. <div class="layui-input-block">
  238. <input name="sortNo" id="sortNo" placeholder="请输入序号" type="number" min="1" class="layui-input"/>
  239. </div>
  240. </div>
  241. <div class="layui-form-item text-right">
  242. <button class="layui-btn" lay-filter="modelSubmit" lay-submit>保存</button>
  243. <button class="layui-btn layui-btn-primary" type="button" ew-event="closePageDialog">取消</button>
  244. </div>
  245. </form>
  246. </script>
  247. <script>
  248. var resultData;
  249. var imgPath, viewImgPath, map;
  250. var entMapList;
  251. var loadFlag = true;
  252. layui.use(['index', 'layer', 'form', 'table', 'util', 'admin', 'zTree', 'uParas', '_groupTree', 'element', 'laydate', 'notice', '_zTree', 'upload'], function () {
  253. var $ = layui.jquery;
  254. var layer = layui.layer;
  255. var element = layui.element;
  256. var form = layui.form;
  257. var index = layui.index;
  258. var table = layui.table;
  259. var util = layui.util;
  260. var admin = layui.admin;
  261. var uParas = layui.uParas;
  262. var _groupTree = layui._groupTree;
  263. var laydate = layui.laydate;
  264. var notice = layui.notice;
  265. var _zTree = layui._zTree;
  266. var upload = layui.upload;
  267. date = new Date();
  268. var insTb = {
  269. reload: function (obj, p) {
  270. $.getJSON(uParas.baseUrl + "/ent/riskPoint/riskPointLvCount", {gId: $("#groupId").val()}, function (result) {
  271. if (result.code == 1) {
  272. var allCount = 0, lv1Count = 0, lv2Count = 0, lv3Count = 0, lv4Count = 0;
  273. $.each(result.data, function (i, field) {
  274. if (field.riskPointLevel == 1) {
  275. lv1Count = field.lvCount;
  276. }
  277. if (field.riskPointLevel == 2) {
  278. lv2Count = field.lvCount;
  279. }
  280. if (field.riskPointLevel == 3) {
  281. lv3Count = field.lvCount;
  282. }
  283. if (field.riskPointLevel == 4) {
  284. lv4Count = field.lvCount;
  285. }
  286. if (field.riskPointLevel != null) {
  287. allCount += field.lvCount;
  288. }
  289. });
  290. $(".risk_point_dot.level1_").html(lv1Count);
  291. $(".risk_point_dot.level2_").html(lv2Count);
  292. $(".risk_point_dot.level3_").html(lv3Count);
  293. $(".risk_point_dot.level4_").html(lv4Count);
  294. $(".risk_point_dot.level_").html(allCount);
  295. setTimeout(function () {
  296. loadMapData.init(_riskPointType, uParas, riskPointLevelFunc, _zTree);
  297. }, 1000)
  298. }
  299. });
  300. }
  301. }
  302. _groupTree.init(insTb);
  303. var entMapId = uParas.getUrlParam("entMapId");
  304. if (entMapId != null && entMapId != undefined) {
  305. $("#entMapId").val(entMapId);
  306. }
  307. // 加载地图数据
  308. function requestMapData() {
  309. $.getJSON(uParas.baseUrl + "/ent/map/getList", {mapType: 2,useType: 3}, function (result) {
  310. var entMap;
  311. if (result.data != null) {
  312. entMapList = result.data;
  313. if (entMapId != null && entMapId != undefined) {
  314. $.each(result.data, function (i, field) {
  315. if (field.mapId.toString() === entMapId) {
  316. imgPath = field.mapRasterLayer;
  317. uParas.initSimpleSelectX("entMapList", "formFilter", result, "mapName", "mapId", entMapId);
  318. return;
  319. }
  320. });
  321. } else {
  322. entMap = result.data[0];
  323. imgPath = entMap.mapRasterLayer;
  324. uParas.initSimpleSelectX("entMapList", "formFilter", result, "mapName", "mapId", entMap.mapId);
  325. $("#entMapId").val(entMap.mapId);
  326. }
  327. }
  328. });
  329. }
  330. requestMapData();
  331. var url = uParas.baseUrl + "/ent/dangerSource/query?limit=1000";
  332. /*初始化危险源数据*/
  333. $.getJSON(url, function (result) {
  334. resultData = result;
  335. loadDangerSource(result, 6);
  336. uParas.cache("dangerSourceList", result.data);
  337. });
  338. //监听下拉选择
  339. form.on('select(entMapList)', function (data) {
  340. if (data.value != "") {
  341. $.each(entMapList, function (i, field) {
  342. if (field.mapId.toString() === data.value) {
  343. imgPath = field.mapRasterLayer;
  344. return;
  345. }
  346. });
  347. $("#entMapId").val(data.value);
  348. myBmap.clearMapController();
  349. myBmap.init(form, uParas, riskPointLevelFunc, _zTree);
  350. loadMapData.init(_riskPointType, uParas, riskPointLevelFunc, _zTree);
  351. }
  352. });
  353. // 渲染laydate
  354. var myDate = new Date();
  355. laydate.render({
  356. elem: '#activeStartTime',
  357. format: 'yyyy-MM-dd HH:mm:ss',
  358. type: 'datetime',
  359. min: myDate.toLocaleString()
  360. });
  361. laydate.render({
  362. elem: '#activeEndTime',
  363. format: 'yyyy-MM-dd HH:mm:ss',
  364. type: 'datetime',
  365. min: myDate.toLocaleString()
  366. });
  367. //监听Tab切换,以改变地址hash值
  368. var _riskPointType;
  369. element.on('tab(dangerSource)', function () {
  370. var riskPointType = this.getAttribute('lay-id');
  371. loadDangerSource(resultData, riskPointType);
  372. });
  373. //监听是否激活
  374. form.on('radio(isActive)', function (data) {
  375. if (data.value == 0) {
  376. $("#activeTime").hide();
  377. } else {
  378. $("#activeTime").show();
  379. }
  380. });
  381. function loadDangerSource(result, riskPointType) {
  382. var out = {};
  383. var array = new Array();
  384. $.each(result.data, function (i, field) {
  385. if (field.riskPointType == riskPointType) {
  386. array.push(field);
  387. }
  388. });
  389. out.data = array;
  390. loadIcon(out, riskPointType);
  391. loadMapData.init(riskPointType, uParas, riskPointLevelFunc, _zTree);
  392. _riskPointType = riskPointType;
  393. }
  394. $('#showUploadDlg1').on('click', function () {
  395. saveMap(2);
  396. });
  397. $('#showUploadDlg2').on('click', function () {
  398. saveMap(3);
  399. });
  400. function saveMap(type) {
  401. admin.open({
  402. type: 1,
  403. title: '上传图片',
  404. content: $('#upTpl').html(),
  405. success: function (layero, index) {
  406. form.render();
  407. upload.render({
  408. elem: '#uploadImg'
  409. , url: uParas.baseUrl + '/admin/uploadImages'
  410. , done: function (res) {
  411. $("#mapImg").val(res.data[0]);
  412. $("#vMapImg").attr("src", uParas.baseUrl + res.data[0]);
  413. }
  414. });
  415. var url = uParas.baseUrl + '/ent/map/save';
  416. form.on('submit(modelSubmit)', function (data) {
  417. layer.load();
  418. var obj = data.field;
  419. obj.mapRasterLayer = $("#mapImg").val();
  420. obj.mapType = type;
  421. obj.mapName = $("#entMapName").val();
  422. admin.req(url, obj, function (resp) {
  423. layer.closeAll('loading');
  424. if (resp.code == 1) {
  425. layer.close(index);
  426. layer.msg(resp.msg);
  427. requestMapData();
  428. } else {
  429. layer.msg(resp.msg);
  430. }
  431. }, 'POST');
  432. return false;
  433. });
  434. }
  435. });
  436. }
  437. /**
  438. * 1f 2J
  439. * @param resp
  440. * @param type
  441. * @param ulDivName
  442. */
  443. function loadIcon(resp, type) {
  444. var defImgPath = "";
  445. var jobPng = "../../../../assets/images/icon/job.png";
  446. var facilityPng = "../../../../assets/images/icon/facility.png";
  447. // if (type == "1") {
  448. defImgPath = facilityPng;
  449. // } else {
  450. // defImgPath = jobPng;
  451. // }
  452. var li = "";
  453. $.each(resp.data, function (i, field) {
  454. var riskPointLevel = riskPointLevelFunc(field.dangerSourceLevel);
  455. var imgPath = field.dangerImg;
  456. if (imgPath == null || imgPath == "") {
  457. imgPath = defImgPath;
  458. } else {
  459. imgPath = imgPath;
  460. }
  461. if (field.parentDangerSrcId == -1) {
  462. if (field.riskCount == field.riskCountParent) {
  463. li += '<li class="iconCategory">' + field.dangerSrcName + '</li>';
  464. li += `<li><a href="javascript:;" id="${field.dangerSrcId}" class="marker-icon">
  465. <img src="${imgPath}" id="${field.dangerSrcId}" type="${type}" lv="${field.dangerSourceLevel}" name="${field.dangerSrcName}"></a>
  466. <span>${field.dangerSrcName}</span>${riskPointLevel}</li>`;
  467. } else {
  468. li += '<li class="iconCategory">' + field.dangerSrcName + '</li>';
  469. $.each(resp.data, function (i, _field) {
  470. if (field.dangerSrcId == _field.parentDangerSrcId) {
  471. riskPointLevel = riskPointLevelFunc(_field.dangerSourceLevel);
  472. li += `<li><a href="javascript:;" id="${_field.dangerSrcId}" class="marker-icon">
  473. <img src="${imgPath}" id="${_field.dangerSrcId}" type="${type}" lv="${_field.dangerSourceLevel}" name="${_field.dangerSrcName}"></a>
  474. <span>${_field.dangerSrcName}</span>${riskPointLevel}</li>`;
  475. }
  476. });
  477. }
  478. }
  479. else {
  480. li += `<li><a href="javascript:;" id="${field.dangerSrcId}" class="marker-icon">
  481. <img src="${imgPath}" id="${field.dangerSrcId}" type="${type}" lv="${field.dangerSourceLevel}" name="${field.dangerSrcName}"></a>
  482. <span>${field.dangerSrcName}</span>${riskPointLevel}</li>`;
  483. }
  484. });
  485. if (type === "2") {
  486. $("#jobIconList").html('');
  487. $("#jobIconList").append(li);
  488. } else {
  489. $("#facilityIconList").html('');
  490. $("#facilityIconList").append(li);
  491. }
  492. }
  493. function riskPointLevelFunc(value) {
  494. var opts = '<div class="riskPointLevel">';
  495. if (value == 1) {
  496. opts += "<div class='notify'><span class='heartbit'></span><span><img src='../../../../assets/images/lv/red.png' style='width: 28px;height: 28px;'/></span></div>";
  497. } else if (value == 2) {
  498. opts += "<img src='../../../../assets/images/lv/orange.png' style='width: 28px;height: 28px;'/>";
  499. } else if (value == 3) {
  500. opts += "<img src='../../../../assets/images/lv/yellow.png' style='width: 28px;height: 28px;'/>";
  501. } else if (value == 4) {
  502. opts += "<img src='../../../../assets/images/lv/blue.png' style='width: 28px;height: 28px;'/>";
  503. } else {
  504. opts += "无";
  505. }
  506. opts += "</div>"
  507. return opts;
  508. }
  509. $("#deleteMarker_").click(function () {
  510. layer.confirm('确定要删除么?', {
  511. skin: 'layui-layer-admin',
  512. shade: .1
  513. }, function (i) {
  514. $.getJSON(uParas.baseUrl + "/ent/riskPoint/delete/" + $("#riskPointId").val(), {}, function (result) {
  515. layer.closeAll();
  516. if (result.code == 1) {
  517. notice.msg(result.msg, {icon: 1});
  518. $(".icon-form-box").hide();
  519. $("#info").show();
  520. setTimeout(function () {
  521. loadMapData.init(_riskPointType, uParas, riskPointLevelFunc, _zTree);
  522. }, 1000)
  523. }
  524. });
  525. });
  526. })
  527. setTimeout(function () {
  528. myBmap.init(form, uParas, riskPointLevelFunc, _zTree);
  529. }, 1000);
  530. });
  531. var myBmap = {
  532. mapContainer: "map", //地图容器
  533. mapTile: "http://online{s}.map.bdimg.com/tile/?qt=vtile&x={x}&y={y}&z={z}&styles=pl&scaler=2&udt=20181205", //切片图层
  534. myIcon: null, //保存创建的icon
  535. myMarker: null, //保存自己创建marker
  536. myMarkerType: 0, //marker类型
  537. myMarkerId: null, //markerId
  538. isSave: true, //是否保存标记
  539. checkedIcon: null, //保存选中的icon
  540. title: null,
  541. deleteMarkerId: null, //保存删除得markerId
  542. myMarkerGroup: L.layerGroup(),
  543. myMarkerGroupInit: L.layerGroup(),
  544. mapControl: null, // 地图控制器,用来清除叠加控制
  545. data: {},
  546. plotLayer: null,
  547. init: function (form, uParas, riskPointLevelFunc, _zTree) {
  548. _form = form;
  549. var _this = this;
  550. // 初始化默认操作
  551. this.clearPlotLayer() // 默认清空绘制点位
  552. this.myMarkerGroup.clearLayers(); // 图层
  553. this.isSave = true
  554. clearForm()
  555. //初始化地图
  556. var map_type = 2;
  557. if (map_type == 4) {
  558. baidu_map();
  559. } else {
  560. image_map();
  561. }
  562. // 增加区域绘制工具栏
  563. this.plotLayer = plotLayer = this.plotLayer != null ? this.plotLayer : L.featureGroup(), map.addLayer(plotLayer);
  564. var e = {
  565. position: "topright",
  566. draw: {
  567. polyline: {shapeOptions: {color: "#0000ff", weight: 3}},
  568. polygon: {allowIntersection: !0, showArea: !0, shapeOptions: {color: "#0000ff", weight: 2}},
  569. rectangle: {shapeOptions: {color: "#0000ff", weight: 2}},
  570. circle: false,
  571. circlemarker: false,
  572. marker: false
  573. },
  574. edit: {
  575. featureGroup: plotLayer,
  576. remove: !0,
  577. edit: false
  578. }
  579. }, n = mapControl = new L.Control.Draw(e);
  580. map.addControl(n)
  581. function draw_createdHandler(t) {
  582. t.layerType;
  583. var o = t.layer;
  584. plotLayer.addLayer(o)
  585. var all = o.toGeoJSON();
  586. var drawIds = $("#drawIds").val();
  587. $("#drawIds").remove();
  588. if (drawIds != undefined) {
  589. drawIds = drawIds + "#" + JSON.stringify(all.geometry.coordinates) + ";" + all.geometry.type;
  590. } else {
  591. drawIds = JSON.stringify(all.geometry.coordinates) + ";" + all.geometry.type
  592. }
  593. $(".my-marker-type").append('<input type="hidden" id="drawIds" name="drawIds" value="' + drawIds + '">');
  594. }
  595. function draw_deletedHandler(t) {
  596. $("#drawIds").remove();
  597. }
  598. // baidu_map()
  599. //地图鼠标事件
  600. map.off('click').on('click', function (e) {
  601. var point = [];
  602. if (_this.myIcon != null) {
  603. var myIcon1 = L.icon({
  604. iconUrl: _this.myIcon,
  605. iconSize: [40, 40],
  606. // iconAnchor: [0, 0]
  607. })
  608. // console.log(myIcon1);
  609. _this.myIcon = null; //将myIcon 置为null 防止鼠标在地图上移动或者点击再次做绘制
  610. point.push(e.latlng.lat, e.latlng.lng);
  611. _this.myMarker = L.marker([e.latlng.lat, e.latlng.lng], {icon: myIcon1});
  612. _this.myMarker.on('click', markerClick); //标记点击事件
  613. //_this.myMarker.addTo(map); //添加marker到地图上
  614. _this.myMarkerGroup.addLayer(_this.myMarker);
  615. _this.myMarkerGroup.addTo(map);
  616. _this.deleteMarkerId = _this.myMarker._leaflet_id; //保存当前markerId
  617. clearForm(); //清空函数
  618. $("#my-marker").append(_this.checkedIcon); //在表单中进行回显
  619. $("#my-marker-title").append(_this.title); //在表单中进行回显
  620. $("#markerType").html('矿下交通库');
  621. $(".my-marker-type").append('<input type="hidden" id="type" name="type" value="' + _this.data.type + '">');
  622. var latlngArray = "[" + e.latlng.lat + "," + e.latlng.lng + "]";
  623. $(".my-marker-type").append('<input type="hidden" id="latlng" name="latlng" value="' + latlngArray + '">');
  624. $(".my-marker-type").append('<input type="hidden" id="dangerSourceId" name="dangerSourceId" value="' + _this.myMarkerId + '">');
  625. $(".my-marker-type").append('<input type="hidden" id="riskPointMinLevel" name="riskPointMinLevel" value="' + _this.data.riskPointMinLevel + '">');
  626. map.on(L.Draw.Event.CREATED, draw_createdHandler), map.on(L.Draw.Event.DELETED, draw_deletedHandler)
  627. $(".icon-form-box").show();
  628. $("#info").hide();
  629. $("#deleteMarker_").hide();
  630. $("#deleteMarker").show();
  631. var inGroupNumber = {
  632. reload: function (obj) {
  633. uParas.initFormSelects("liablePerson", uParas.baseUrl + '/admin/common/getUsersByGroupId?gId=' + obj.where.groupId, "accountRealName", "aId");
  634. }
  635. }
  636. _zTree._init('/admin/common/getGroupLists', 'gId', 'groupParent', 'groupName', 'gId', 0, 'groupTree_', inGroupNumber, 'menuContent_', 'liableGroupIdName', 'liableGroupId');
  637. }
  638. })
  639. //左侧icon得点击事件
  640. $(".icon-box-ul").off('click').on('click', 'a', function (event) {
  641. if (_this.isSave) {
  642. _this.isSave = false;
  643. var curParent = $(event.currentTarget).parent();
  644. var tarSrc = $(event.target).attr('src');
  645. var title = $(event.target).attr('name');
  646. var id = $(event.target).attr('id');
  647. var type = $(event.target).attr('type');
  648. var riskPointMinLevel = $(event.target).attr('lv');
  649. _this.data.riskPointMinLevel = riskPointMinLevel;
  650. _this.data.type = type;
  651. $('.icon-active').removeClass('icon-active');
  652. $(event.currentTarget).addClass('icon-active');
  653. _this.myIcon = tarSrc;
  654. //复制icon进行拖动
  655. _this.myMarkerId = id;
  656. // _this.myMarkerType = type;
  657. _this.checkedIcon = '<img src="' + tarSrc + '" width="40px" height="40px"/>';
  658. // //console.log(_this.checkedIcon)
  659. _this.title = title;
  660. } else {
  661. layer.msg('请先保存标记!');
  662. }
  663. })
  664. _form.on('submit(saveMarker)', function (data) {
  665. var sendData = data.field;
  666. if (sendData.type == undefined || sendData.type == null) {
  667. layer.msg("请先绘制风险点!");
  668. return;
  669. }
  670. if (sendData.riskPointName == "") {
  671. layer.msg("请输入名称!");
  672. return;
  673. }
  674. sendData.riskPointType = sendData.type;
  675. // sendData.drawIds = $("#drawIds").val();
  676. sendData.riskPointMinLevelSon = $("#riskPointMinLevelSon").val();
  677. // sendData.dangerSourceIds = $("#dangerSourceIds").val();
  678. // console.log(sendData);
  679. $.ajax({
  680. type: "post",
  681. url: uParas.baseUrl + "/ent/riskPointMap/saveDangerSourceMap",
  682. data: sendData,
  683. dataType: "json",
  684. success: function (result) {
  685. if (result.code === 1) {
  686. layer.msg("保存成功");
  687. _this.isSave = true;
  688. $(".my-marker-box>ul>li:not(:last-child)").remove();
  689. if (map._layers[_this.deleteMarkerId] != null) {
  690. map.removeLayer(map._layers[_this.deleteMarkerId]);
  691. }
  692. clearForm(); //清空函数
  693. setTimeout(function () {
  694. loadMapData.init(sendData.type, uParas, riskPointLevelFunc, _zTree);
  695. }, 1000)
  696. $(".icon-form-box").hide();
  697. $("#info").show();
  698. } else {
  699. layer.msg(result.msg);
  700. }
  701. }
  702. });
  703. });
  704. // 标记click事件
  705. function markerClick(e) {
  706. _this.deleteMarkerId = e.target._leaflet_id;
  707. }
  708. //删除marker事件
  709. $("#deleteMarker").click(function () {
  710. _this.isSave = true;
  711. $(".my-marker-box>ul>li:not(:last-child)").remove();
  712. if (map._layers[_this.deleteMarkerId] != null) {
  713. map.removeLayer(map._layers[_this.deleteMarkerId]);
  714. }
  715. plotLayer.clearLayers();
  716. clearForm(); //清空函数
  717. });
  718. // 添加标注
  719. $("#addMarker").click(function () {
  720. layerOpen();
  721. })
  722. // 删除单个标记
  723. $(".my-marker-box>ul").on('click', 'span', function (e) {
  724. $(e.target).parent().remove();
  725. var eles = $(".my-marker-box>ul>li");
  726. var ids = '';
  727. var lv = 4;
  728. $.each(eles, function (index, item) {
  729. var id = $(item).find('img').attr('id');
  730. var lvSon = $(item).find('img').attr('lv');
  731. if (id != undefined) {
  732. ids += id + ",";
  733. if (Number(lvSon) < Number(lv)) {
  734. lv = lvSon;
  735. }
  736. }
  737. });
  738. $("#dangerSourceIds").remove();
  739. $("#riskPointMinLevelSon").remove();
  740. $(".my-marker-type").append('<input type="hidden" id="riskPointMinLevelSon" name="riskPointMinLevelSon" value="' + lv + '">');
  741. $(".my-marker-type").append('<input type="hidden" id="dangerSourceIds" name="dangerSourceIds" value="' + ids + '">');
  742. })
  743. //底图为图片
  744. function image_map() {
  745. if (map == undefined || map._loaded == undefined) {
  746. map = L.map(_this.mapContainer, {
  747. crs: L.CRS.Simple,
  748. center: L.latLng(50.5, 30.5),
  749. minZoom: 0,
  750. zoom: 0,
  751. attributionControl: false
  752. });
  753. } else {
  754. loadFlag = false;
  755. }
  756. var yx = L.latLng;
  757. var xy = function xy(x, y) {
  758. if (L.Util.isArray(x)) {
  759. return yx(x[1], x[0]);
  760. }
  761. return yx(y, x);
  762. };
  763. // map.eachLayer(function (layer) {
  764. // map.removeLayer(layer);
  765. // });
  766. map.addLayer(_this.myMarkerGroupInit);
  767. map.addLayer(_this.myMarkerGroup);
  768. // var bounds = [xy(-600, -600), xy(300, 300)];
  769. var bounds = [xy(-1000, -500), xy(1000, 500)];
  770. L.imageOverlay(imgPath, bounds).addTo(map);
  771. map.fitBounds(bounds);
  772. }
  773. //底图为百度地图
  774. function baidu_map() {
  775. var maxZoom = 26;
  776. var crs = new L.Proj.CRS('EPSG:3395',
  777. '+proj=merc +lon_0=0 +k=1 +x_0=0 +y_0=0 +datum=WGS84 +units=m +no_defs', {
  778. resolutions: function () {
  779. level = 19;
  780. var res = [];
  781. res[0] = Math.pow(2, 18);
  782. for (var i = 1; i < level; i++) {
  783. res[i] = Math.pow(2, (18 - i))
  784. }
  785. return res;
  786. }(),
  787. origin: [0, 0],
  788. bounds: L.bounds([20037508.342789244, 0], [0, 20037508.342789244])
  789. });
  790. var image = new L.TileLayer(_this.mapTile, {
  791. maxZoom: maxZoom,
  792. minZoom: 10,
  793. subdomains: [0, 1, 2],
  794. tms: true
  795. });
  796. map = L.map(_this.mapContainer, {
  797. crs: crs,
  798. layers: [image]
  799. });
  800. map.setView([34.474387, 109.490437], 14);
  801. }
  802. function clearForm() {
  803. $("#my-marker").html(""); //清除icon;
  804. $('.icon-active').removeClass('icon-active'); //移除已选class
  805. $(".my-marker-type>input").remove(); //移除标记类型中得input
  806. $("#markerType").html(""); //清空标记类型
  807. $("#riskPointName").val(""); //清空标记类型
  808. $(".my-marker-box>ul>li:not(:last-child)").remove();
  809. $("#drawIds").remove();
  810. $("#drawType").remove();
  811. $("#my-marker-title").html("");
  812. $("#riskPointDesc").val('');
  813. $("#activeStartTime").val('');
  814. $("#activeEndTime").val('');
  815. $("#riskPointPlaces").val('');
  816. $('#liableGroupIdName').val('');
  817. $('#liablePerson').html('');
  818. }
  819. function layerOpen() {
  820. var outIds = $("#dangerSourceId").val();
  821. if ($("#dangerSourceIds").val() != undefined) {
  822. outIds += "," + $("#dangerSourceIds").val();
  823. }
  824. if (outIds == undefined) {
  825. outIds = new Array();
  826. }
  827. var defImgPath = "";
  828. var jobPng = "../../../../assets/images/icon/job.png";
  829. var facilityPng = "../../../../assets/images/icon/facility.png";
  830. //var dangerSourceList = layui.data(uParas.tableName).dangerSourceList;
  831. var html = '<div class="">';
  832. html += '<div class="danger-src-date popup-icon-box" style="width: 550px;float: left;margin-left: 20px;"><ul>';
  833. $.each(resultData.data, function (i, field) {
  834. var type = field.riskPointType;
  835. var riskPointLevel = riskPointLevelFunc(field.dangerSourceLevel);
  836. var imgPath = field.dangerImg;
  837. if (type == 1) {
  838. defImgPath = facilityPng;
  839. } else {
  840. defImgPath = jobPng;
  841. }
  842. if (imgPath == null || imgPath == "") {
  843. imgPath = defImgPath;
  844. } else {
  845. imgPath = uParas.baseUrl + imgPath;
  846. }
  847. var id = field.dangerSrcId;
  848. if (field.riskPointType == 1) {
  849. if (outIds.indexOf(id) == -1) {
  850. if (field.parentDangerSrcId == -1) {
  851. if (field.riskCount == field.riskCountParent) {
  852. html += '<li class="iconCategory_">' + field.dangerSrcName + '</li>';
  853. html += `<li onclick="iconClick(this)"><a href="javascript:;" id="${field.dangerSrcId}" class="marker-icon"><span style='font-size: 18px;margin-top: 10px;'>✦ </span>
  854. <img src="${imgPath}" id="${field.dangerSrcId}" type="${type}" lv="${field.dangerSourceLevel}" name="${field.dangerSrcName}" style='width: 25px;height: 25px;'></a>
  855. <span style="margin-left: 10px;color: #0c5df1;">${field.dangerSrcName}</span>${riskPointLevel}</li>`;
  856. } else {
  857. html += '<li class="iconCategory_">' + field.dangerSrcName + '</li>';
  858. }
  859. } else {
  860. html += `<li onclick="iconClick(this)"><a href="javascript:;" id="${field.dangerSrcId}" class="marker-icon"><span style='font-size: 18px;margin-top: 10px;'>✦ </span>
  861. <img src="${imgPath}" id="${field.dangerSrcId}" type="${type}" lv="${field.dangerSourceLevel}" name="${field.dangerSrcName}" style='width: 25px;height: 25px;'></a>
  862. <span style="margin-left: 10px;color: #0c5df1;">${field.dangerSrcName}</span>${riskPointLevel}</li>`;
  863. }
  864. }
  865. }
  866. });
  867. html += '</ul></div>';
  868. html += '<div class="danger-src-date popup-icon-box" style="float: left;width: 550px;"><ul>';
  869. $.each(resultData.data, function (i, field) {
  870. var type = field.riskPointType;
  871. var riskPointLevel = riskPointLevelFunc(field.dangerSourceLevel);
  872. var imgPath = field.dangerImg;
  873. if (type == 1) {
  874. defImgPath = facilityPng;
  875. } else {
  876. defImgPath = jobPng;
  877. }
  878. if (imgPath == null || imgPath == "") {
  879. imgPath = defImgPath;
  880. } else {
  881. imgPath = uParas.baseUrl + imgPath;
  882. }
  883. var id = field.dangerSrcId;
  884. if (field.riskPointType == 2) {
  885. if (outIds.indexOf(id) == -1) {
  886. if (field.parentDangerSrcId == -1) {
  887. if (field.riskCount == field.riskCountParent) {
  888. html += '<li class="iconCategory_">' + field.dangerSrcName + '</li>';
  889. html += `<li onclick="iconClick(this)"><a href="javascript:;" id="${field.dangerSrcId}" class="marker-icon"><span style='font-size: 18px;margin-top: 10px;'>➢ </span>
  890. <img src="${imgPath}" id="${field.dangerSrcId}" type="${type}" lv="${field.dangerSourceLevel}" name="${field.dangerSrcName}" style='width: 25px;height: 25px;'></a>
  891. <span style="margin-left: 10px;color: #0c5df1;">${field.dangerSrcName}</span>${riskPointLevel}</li>`;
  892. } else {
  893. html += '<li class="iconCategory_">' + field.dangerSrcName + '</li>';
  894. }
  895. } else {
  896. html += `<li onclick="iconClick(this)"><a href="javascript:;" id="${field.dangerSrcId}" class="marker-icon"><span style='font-size: 18px;margin-top: 10px;'>➢ </span>
  897. <img src="${imgPath}" id="${field.dangerSrcId}" type="${type}" lv="${field.dangerSourceLevel}" name="${field.dangerSrcName}" style='width: 25px;height: 25px;'></a>
  898. <span style="margin-left: 10px;color: #0c5df1;">${field.dangerSrcName}</span>${riskPointLevel}</li>`;
  899. }
  900. }
  901. }
  902. });
  903. html += '</ul></div></div>';
  904. layer.open({
  905. title: '【设备设施】' + '<span style="margin-left: 470px;">【作业活动】</span>',
  906. btn: ['确定', '取消'],
  907. type: 1,
  908. area: ['1200px', '60%'], //宽高
  909. content: html,
  910. yes: yes
  911. });
  912. }
  913. function yes(index) {
  914. var eles = $(".popup-icon-box>ul>li");
  915. var li = '';
  916. var ids = '';
  917. var lv = 4;
  918. $.each(eles, function (index, item) {
  919. if ($(item).hasClass('icon-active')) {
  920. var imgSrc = $(item).find('img').attr('src');
  921. var id = $(item).find('img').attr('id');
  922. var title = $(item).find('img').attr('name');
  923. var div = $(item).find('div').html();
  924. var lvSon = $(item).find('img').attr('lv');
  925. li += '<li><img src="' + imgSrc + '" id="' + id + '"lv=' + lvSon + ' ><span>x</span><p>' + title + '</p><div class="riskPointLevel">' + div + '</div></li>';
  926. if (id != undefined) {
  927. ids += id + ",";
  928. if (Number(lvSon) < lv) {
  929. lv = lvSon;
  930. }
  931. }
  932. }
  933. });
  934. $("#myMarkerBox>ul").prepend(li);
  935. if ($("#dangerSourceIds").val() != undefined) {
  936. ids += $("#dangerSourceIds").val();
  937. }
  938. $("#dangerSourceIds").remove();
  939. $("#riskPointMinLevelSon").remove();
  940. $(".my-marker-type").append('<input type="hidden" id="riskPointMinLevelSon" name="riskPointMinLevelSon" value="' + lv + '">');
  941. $(".my-marker-type").append('<input type="hidden" id="dangerSourceIds" name="dangerSourceIds" value="' + ids + '">');
  942. layer.close(index);
  943. }
  944. },
  945. clearPlotLayer: function () {
  946. if (this.plotLayer != null) {
  947. this.plotLayer.clearLayers()
  948. }
  949. },
  950. clearMapController() { // 清除地图控制器
  951. map.removeControl(mapControl)
  952. }
  953. }
  954. var loadMapData = {
  955. jobPng: "../../../../assets/images/icon/job.png",
  956. facilityPng: "../../../../assets/images/icon/facility.png",
  957. init: function (type, uParas, riskPointLevelFunc, _zTree) {
  958. var _uParas = uParas;
  959. var riskPointLevelFunc = riskPointLevelFunc;
  960. var _zTree = _zTree;
  961. var jobIcon = L.icon({
  962. iconUrl: loadMapData.jobPng,
  963. iconSize: [38, 45],
  964. popupAnchor: [0, -16]
  965. });
  966. var facilityIcon = L.icon({
  967. iconUrl: loadMapData.facilityPng,
  968. iconSize: [38, 45],
  969. popupAnchor: [0, -16]
  970. });
  971. function icon(imgUrl) {
  972. return L.icon({
  973. iconUrl: imgUrl,
  974. iconSize: [38, 45],
  975. popupAnchor: [0, -16]
  976. });
  977. }
  978. initMapData(type, uParas);
  979. function initMapData(type, uParas) {
  980. var groupId = $("#groupId").val();
  981. if (type == undefined) {
  982. type = 6
  983. } else {
  984. myBmap.myMarkerGroupInit.clearLayers();
  985. }
  986. myBmap.myMarkerGroupInit.clearLayers();
  987. var entMapId = $("#entMapId").val();
  988. $.getJSON(uParas.baseUrl + "/ent/riskPointMap/getRiskPointMap", {
  989. riskPointType: type,
  990. gId: groupId,
  991. entMapId: entMapId
  992. }, function (result) {
  993. if (result.code == 1) {
  994. $.each(result.data, function (index, item) {
  995. var markerData = item.markerData;
  996. if (markerData != null) {
  997. var optionsData = {
  998. mapId: item.id,
  999. riskPointId: item.riskPointId,
  1000. type: type,
  1001. title: item.markerTitle
  1002. };
  1003. if (item.dangerImg != null && item.dangerImg != "") {
  1004. optionsData.iconUrl = imgPathFun(item.dangerImg, type);
  1005. } else {
  1006. if (type === 2) {
  1007. optionsData.iconUrl = loadMapData.jobPng;
  1008. } else {
  1009. optionsData.iconUrl = loadMapData.facilityPng;
  1010. }
  1011. }
  1012. if (item.markerType == 3) {
  1013. var data = new Array();
  1014. $.each($.parseJSON(markerData), function (index, item) {
  1015. data[index] = new Array(item[1], item[0]);
  1016. });
  1017. L.polygon(data, optionsData).addTo(myBmap.myMarkerGroupInit).bindPopup(item.markerTitle).on('click', onMapClick);
  1018. } else if (item.markerType == 1) {
  1019. if (item.dangerImg != null && item.dangerImg != "") {
  1020. optionsData.icon = icon(uParas.baseUrl + item.dangerImg);
  1021. } else {
  1022. if (type == 2) {
  1023. optionsData.icon = jobIcon;
  1024. } else {
  1025. optionsData.icon = facilityIcon;
  1026. }
  1027. }
  1028. L.marker($.parseJSON(markerData), optionsData).addTo(myBmap.myMarkerGroupInit).bindPopup(item.markerTitle).on('click', onMapClick);
  1029. } else if (item.markerType == 2) {
  1030. var data = new Array();
  1031. $.each($.parseJSON(markerData), function (index, item) {
  1032. data[index] = new Array(item[1], item[0]);
  1033. });
  1034. L.polyline(data, optionsData).addTo(myBmap.myMarkerGroupInit).bindPopup(item.markerTitle).on('click', onMapClick);
  1035. }
  1036. }
  1037. });
  1038. }
  1039. });
  1040. }
  1041. function imgPathFun(imgPath, type) {
  1042. var defImgPath = "";
  1043. var jobPng = "../../../../assets/images/icon/job.png";
  1044. var facilityPng = "../../../../assets/images/icon/facility.png";
  1045. if (type == "1") {
  1046. defImgPath = facilityPng;
  1047. } else {
  1048. defImgPath = jobPng;
  1049. }
  1050. if (imgPath == null || imgPath == "") {
  1051. return defImgPath;
  1052. } else {
  1053. if (imgPath.indexOf("http:") != -1) {
  1054. defImgPath = imgPath;
  1055. } else {
  1056. defImgPath = uParas.baseUrl + imgPath;
  1057. }
  1058. }
  1059. return defImgPath;
  1060. }
  1061. function onMapClick(e) {
  1062. $(".icon-form-box").show();
  1063. $("#info").hide();
  1064. var options = e.target.options;
  1065. var data = {};
  1066. data.mapId = options.mapId;
  1067. data.riskPointId = options.riskPointId;
  1068. $("#deleteMarker").hide();
  1069. $("#deleteMarker_").show();
  1070. $("#my-marker").html('<img src="' + options.iconUrl + '"/>');
  1071. $("#markerType").html(options.type == 2 ? '作业活动' : '设备设施');
  1072. $("#riskPointName").val(options.title);
  1073. $.getJSON("/ent/riskPointMap/findMapDataById", data, function (result) {
  1074. if (result.code == 1) {
  1075. var item = result.data[0];
  1076. var index = item.dangerSourceIds;
  1077. var arr = new Array();
  1078. if (index != null) {
  1079. if (index.indexOf(',') != -1) {
  1080. arr = index.split(',');
  1081. } else {
  1082. arr = [index];
  1083. }
  1084. }
  1085. $("#riskPointPlaces").val(item.riskPointPlaces);
  1086. $("#riskPointDesc").val(item.riskPointDesc);
  1087. $("#activeEndTime").val(item.activeEndTime);
  1088. $("#activeStartTime").val(item.activeStartTime);
  1089. $("#my-marker-title").html("");
  1090. $("#my-marker-title").append(item.dangerSrcName);
  1091. $("#type").remove();
  1092. $(".my-marker-type").append('<input type="hidden" id="type" name="type" value="' + options.type + '">');
  1093. $("#riskPointId").remove();
  1094. $(".my-marker-type").append('<input type="hidden" id="riskPointId" name="riskPointId" value="' + item.riskPointId + '">');
  1095. $("#dangerSourceId").remove();
  1096. $(".my-marker-type").append('<input type="hidden" id="dangerSourceId" name="dangerSourceId" value="' + item.dangerSrcId + '">');
  1097. $("#riskPointMinLevel").remove();
  1098. $(".my-marker-type").append('<input type="hidden" id="riskPointMinLevel" name="riskPointMinLevel" value="' + item.riskPointLevel + '">');
  1099. if (arr.length > 0) {
  1100. var majorIndex = arr.indexOf(item.dangerSrcId + "");
  1101. if (majorIndex > -1) {
  1102. arr.splice(majorIndex, 1);
  1103. }
  1104. $("#dangerSourceIds").remove();
  1105. $(".my-marker-type").append('<input type="hidden" id="dangerSourceIds" name="dangerSourceIds" value="' + arr.join(',') + '">');
  1106. }
  1107. $(".my-marker-box>ul>li:not(:last-child)").remove();
  1108. var li = '';
  1109. var _lv = 4;
  1110. var dangerSourceList = layui.data(_uParas.tableName).dangerSourceList;
  1111. $.each(arr, function (i, field) {
  1112. $.each(dangerSourceList, function (index, item) {
  1113. if (item.dangerSrcId == field) {
  1114. var title = item.dangerSrcName;
  1115. var lvSon = item.dangerSourceLevel;
  1116. if (lvSon < _lv) {
  1117. _lv = lvSon;
  1118. }
  1119. var div = riskPointLevelFunc(lvSon);
  1120. var imgPath = imgPathFun(item.dangerImg, item.riskPointType);
  1121. li += '<li><img src="' + imgPath + '" id="' + field + '" lv=' + lvSon + ' ><span>x</span><p>' + title + '</p><div class="riskPointLevel">' + div + '</div></li>';
  1122. return;
  1123. }
  1124. });
  1125. });
  1126. $("#riskPointMinLevelSon").remove();
  1127. $(".my-marker-type").append('<input type="hidden" id="riskPointMinLevelSon" name="riskPointMinLevelSon" value="' + _lv + '">');
  1128. $("#myMarkerBox>ul").prepend(li);
  1129. myBmap.data.type = options.type;
  1130. $("#liableGroupIdName").val(item.groupName);
  1131. $("#liableGroupId").val(item.liableGroupId);
  1132. if (item.liableGroupId != null) {
  1133. var inGroupNumber = {
  1134. reload: function (obj) {
  1135. uParas.initFormSelects("liablePerson", uParas.baseUrl + '/admin/common/getUsersByGroupId?gId=' + obj.where.groupId, "accountRealName", "aId");
  1136. }
  1137. }
  1138. _zTree._init('/admin/common/getGroupLists', 'gId', 'groupParent', 'groupName', 'gId', 0, 'groupTree_', inGroupNumber, 'menuContent_', 'liableGroupIdName', 'liableGroupId');
  1139. uParas.initFormSelects("liablePerson", uParas.baseUrl + '/admin/common/getUsersByGroupId?gId=' + item.liableGroupId, "accountRealName", "aId", item.personList);
  1140. }
  1141. }
  1142. });
  1143. }
  1144. }
  1145. }
  1146. function iconClick(e) {
  1147. $(e).toggleClass('icon-active')
  1148. }
  1149. </script>
  1150. </body>
  1151. </html>