select-worksite-person.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311
  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/module/uParas.css?v=312"/>
  11. <style>
  12. .layui-table-cell {
  13. height: auto;
  14. }
  15. .badge-warning {
  16. background-color: #ffcc33;
  17. background-image: none;
  18. height: 18px;
  19. padding: 3px 6px 3px 6px;
  20. font-weight: 300;
  21. border-radius: 12px !important;
  22. text-shadow: none !important;
  23. text-align: center;
  24. vertical-align: middle;
  25. line-height: 1;
  26. color: #fff;
  27. white-space: nowrap;
  28. display: inline-block;
  29. min-width: 10px;
  30. font-size: 13px !important;
  31. }
  32. .badge-success {
  33. background-color: rgb(69, 182, 175);
  34. background-image: none;
  35. font-weight: 300;
  36. height: 18px;
  37. text-align: center;
  38. vertical-align: middle;
  39. font-size: 13px !important;
  40. padding: 3px 6px;
  41. border-radius: 12px !important;
  42. min-width: 10px;
  43. line-height: 1;
  44. color: rgb(255, 255, 255);
  45. white-space: nowrap;
  46. }
  47. </style>
  48. </head>
  49. <body>
  50. <!-- 页面加载loading -->
  51. <div class="page-loading">
  52. <div class="ball-loader">
  53. <span></span><span></span><span></span><span></span>
  54. </div>
  55. </div>
  56. <!-- 正文开始 -->
  57. <div class="layui-fluid">
  58. <div class="layui-row layui-col-space15">
  59. <div class="layui-card">
  60. <!--<div class="layui-card-header">-->
  61. <!--选择现场人员-->
  62. <!--</div>-->
  63. <div class="layui-card-body" style="height: 580px;">
  64. <div class="layui-col-sm5 layui-col-lg5" style="padding-top: 43px;">
  65. <div class="layui-card-body">
  66. <table class="layui-table" id="alreadyTable" lay-filter="alreadyTable"></table>
  67. </div>
  68. </div>
  69. <div class="layui-col-sm7 layui-col-lg7">
  70. <div class="layui-card-body">
  71. <div class="layui-form toolbar">
  72. <div class="layui-form-item text-right">
  73. <div class="layui-inline pull-left">
  74. <label class="layui-form-label w-auto w-padding">部门:</label>
  75. <div class="layui-input-inline mr0">
  76. <input type="text" id="groupName" name="groupName" value=""
  77. placeholder="点击选择"
  78. class="layui-input" readonly>
  79. <input type="hidden" id="groupId" name="groupId">
  80. <div id="menuContent" class="menuContent">
  81. <ul id="groupTree" class="ztree" style="margin-top:0;"></ul>
  82. </div>
  83. </div>
  84. </div>
  85. <div class="layui-inline">
  86. <label class="layui-form-label w-auto w-padding">搜索:</label>
  87. <div class="layui-input-inline mr0">
  88. <input name="keyword" class="layui-input" type="text" placeholder="输入关键字"/>
  89. </div>
  90. </div>
  91. <div class="layui-inline">
  92. <button class="layui-btn icon-btn" lay-filter="formSubSearch" lay-submit>
  93. <i class="layui-icon">&#xe615;</i>搜索
  94. </button>
  95. </div>
  96. </div>
  97. </div>
  98. <table class="layui-table" id="selectTable" lay-filter="selectTable"></table>
  99. </div>
  100. </div>
  101. </div>
  102. </div>
  103. </div>
  104. </div>
  105. <!--状态TPL-->
  106. <script type="text/html" id="statusTpl">
  107. {{# if(d.accountStatus != null && d.accountStatus == 1){ }}
  108. <span class="badge-success">活动</span>
  109. {{# } else { }}
  110. <span class="badge-warning">锁定</span>
  111. {{# } }}
  112. </script>
  113. <!--状态TPL-->
  114. <script type="text/html" id="statusTpl2">
  115. {{# if(d.status != null && d.status == 1){ }}
  116. <span style="color: mediumseagreen">在线</span>
  117. {{# } else { }}
  118. <span style="color:#F3565D">下线</span>
  119. {{# } }}
  120. </script>
  121. <!-- 表格操作列TPL -->
  122. <script type="text/html" id="optionTpl">
  123. {{# if(d.ifChecked != null && d.ifChecked == 1){ }}
  124. <input type="checkbox" checked name="checkBox1" lay-skin="primary"/>
  125. {{# } else { }}
  126. <input type="checkbox" name="checkBox1" lay-skin="primary"/>
  127. {{# } }}
  128. </script>
  129. <!-- 表格操作列TPL -->
  130. <script type="text/html" id="alreadyOptionTpl">
  131. {{# if(d.status != null && d.status != 1){ }}
  132. <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="onLine">上线</a>
  133. {{# } else { }}
  134. <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="downLine">下线</a>
  135. {{# } }}
  136. <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
  137. </script>
  138. <!-- js部分 -->
  139. <script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
  140. <script type="text/javascript" src="../../../assets/js/common.js?v=312"></script>
  141. <script>
  142. layui.use(['layer', 'form', 'table', 'admin', 'uParas', '_groupTree'], function () {
  143. var $ = layui.jquery;
  144. var layer = layui.layer;
  145. var form = layui.form;
  146. var table = layui.table;
  147. var admin = layui.admin;
  148. var uParas = layui.uParas;
  149. var _groupTree = layui._groupTree;
  150. var riskPointId = uParas.getUrlParam("riskPointId");
  151. //var riskPointId = "1265";
  152. //console.log("riskPointId_________________"+riskPointId);
  153. //debugger
  154. // 部门人员表格
  155. var selectTable = table.render({
  156. elem: '#selectTable',
  157. url: uParas.baseUrl + '/ent/groupAccount/queryAccountAndStatus',
  158. where: {riskPointId: riskPointId},
  159. page: true,
  160. method: 'post',
  161. cellMinWidth: 100,
  162. cols: [[
  163. {type: 'checkbox'},
  164. {field: 'accountName', sort: false, title: '用户名', width: 100},
  165. {field: 'accountRealName', sort: false, title: '姓名'},
  166. {field: 'accountTel', sort: false, title: '手机'},
  167. {field: 'groupName', sort: false, title: '所属部门'},
  168. {field: 'roleName', sort: false, title: '角色'},
  169. {field: 'positionTitle', sort: false, title: '岗位'},
  170. {field: 'accountStatus', sort: false, title: '状态', width: 80, templet: '#statusTpl'},
  171. //{align: 'center' , toolbar: '#optionTpl', title:'操作', width: 100}
  172. //{type: 'checkbox', title :'操作'}
  173. ]],
  174. done: function (res, curr, count) {
  175. // 根据条件移除全选 checkbox
  176. $('div[lay-id="selectTable"] th[data-field="0"] div').replaceWith('<div class="layui-table-cell laytable-cell-1-0-0"><span></span></div>');
  177. }
  178. });
  179. _groupTree.init(selectTable);
  180. //选中的人员表格
  181. var alreadyTable = table.render({
  182. elem: '#alreadyTable',
  183. url: uParas.baseUrl + '/ent/worksitePerson/alreadySelected',
  184. where: {riskPointId: riskPointId},
  185. page: true,
  186. method: 'post',
  187. cellMinWidth: 100,
  188. cols: [[
  189. // {type : 'numbers' , title :'序号'} ,
  190. {field: 'accountRealName', sort: false, title: '姓名'},
  191. {field: 'groupName', sort: false, title: '所属部门'},
  192. {field: 'status', sort: false, title: '状态', width: 60, templet: '#statusTpl2'},
  193. {align: 'center', toolbar: '#alreadyOptionTpl', title: '操作', width: 120}
  194. ]]
  195. });
  196. // 搜索
  197. form.on('submit(formSubSearch)', function (data) {
  198. selectTable.reload({where: data.field}, 'data');
  199. });
  200. // 工具条点击事件
  201. table.on('tool(alreadyTable)', function (obj) {
  202. var data = obj.data;
  203. var layEvent = obj.event;
  204. if (layEvent == 'onLine') { // 修改
  205. onLine(data.aId);
  206. } else if (layEvent == 'downLine') {
  207. downLine(data.aId);
  208. } else {
  209. deleteRelation(data);
  210. }
  211. });
  212. //选择取消
  213. table.on('checkbox(selectTable)', function (obj) {
  214. var checked = obj.checked;
  215. //console.log("checkBox_______________"+checked);
  216. var data = obj.data;
  217. //console.log("data_______________"+data);
  218. var status = "";
  219. if (checked) {
  220. //选择
  221. status = "1";
  222. } else {
  223. //取消
  224. status = "0";
  225. }
  226. maintainRelation(data.aId, status);
  227. });
  228. //维护关系
  229. function maintainRelation(accountId, status) {
  230. //状态(0取消;1选择)
  231. var url = uParas.baseUrl + '/ent/worksitePerson/maintainWorksitePerson';
  232. $.ajax({
  233. type: "post",
  234. url: url,
  235. data: {"accountId": accountId, "riskPointId": riskPointId, "status": status},
  236. dataType: 'json',
  237. success: function (resp) {
  238. if (resp.code == 1) {
  239. layer.msg(resp.msg);
  240. alreadyTable.reload({}, 'data');
  241. selectTable.reload({}, 'data');
  242. layer.closeAll();
  243. } else {
  244. layer.msg(resp.msg);
  245. }
  246. }
  247. });
  248. }
  249. //用户下线
  250. function downLine(accountId) {
  251. updateStatus(accountId, riskPointId, "0");
  252. }
  253. //用户上线
  254. function onLine(accountId) {
  255. updateStatus(accountId, riskPointId, "1");
  256. }
  257. function updateStatus(accountId, riskPointId, status) {
  258. //状态(1在线 0 下线)
  259. var url = uParas.baseUrl + '/ent/worksitePerson/updateWorksitePersonStatus';
  260. $.ajax({
  261. type: "post",
  262. url: url,
  263. data: {"accountId": accountId, "riskPointId": riskPointId, "status": status},
  264. dataType: 'json',
  265. success: function (resp) {
  266. if (resp.code == 1) {
  267. layer.msg(resp.msg);
  268. alreadyTable.reload({}, 'data');
  269. } else {
  270. layer.msg(resp.msg);
  271. }
  272. }
  273. });
  274. }
  275. // 删除关系
  276. function deleteRelation(data) {
  277. layer.confirm('确定要删除现场人员“' + data.accountRealName + '”吗?', {
  278. skin: 'layui-layer-admin',
  279. shade: .1
  280. }
  281. , function (i) {
  282. layer.close(i);
  283. layer.load();
  284. maintainRelation(data.aId, "0");
  285. });
  286. }
  287. });
  288. </script>
  289. </body>
  290. </html>