inde_bakx.html 64 KB

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