index.html 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468
  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. <style>
  11. </style>
  12. </head>
  13. <body>
  14. <!-- 页面加载loading -->
  15. <div class="page-loading">
  16. <div class="ball-loader">
  17. <span></span><span></span><span></span><span></span>
  18. </div>
  19. </div>
  20. <!-- 正文开始 -->
  21. <div class="layui-fluid">
  22. <div class="layui-card">
  23. <div class="layui-card-body">
  24. <div class="layui-form toolbar">
  25. <div class="layui-form-item text-right">
  26. <div class="layui-inline pull-left">
  27. <button id="btnAdd" class="layui-btn icon-btn"><i class="layui-icon">&#xe654;</i>添加</button>
  28. </div>
  29. <div class="layui-inline">
  30. <label class="layui-form-label w-auto">搜索:</label>
  31. <div class="layui-input-inline mr0">
  32. <input name="keyword" class="layui-input" type="text" placeholder="输入关键字"/>
  33. </div>
  34. </div>
  35. <div class="layui-inline">
  36. <button class="layui-btn icon-btn" lay-filter="formSubSearch" lay-submit>
  37. <i class="layui-icon">&#xe615;</i>搜索
  38. </button>
  39. </div>
  40. </div>
  41. </div>
  42. <table class="layui-table" id="datatable" lay-filter="datatable"></table>
  43. </div>
  44. </div>
  45. </div>
  46. <!-- 表格操作列TPL -->
  47. <script type="text/html" id="optionTpl">
  48. <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
  49. <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
  50. </script>
  51. <!-- 检查分类表格操作列TPL -->
  52. <script type="text/html" id="checkTypeOptionTpl">
  53. <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delCheckType">删除</a>
  54. </script>
  55. <!-- 选择分类 -->
  56. <script type="text/html" id="checkDefTypeTpl">
  57. {{# if(d.checkDefTypeName != null && d.checkDefTypeName != ''){ }}
  58. <a href="javascript:void(0)" style="cursor:pointer;color: #5b9bd1;" class="checkType" data-val="{{d.checkDefId}}"
  59. data-nameType="{{d.checkDefTypeId}}">{{d.checkDefTypeName}}</a>
  60. {{# } else { }}
  61. <a href="javascript:void(0)" style="cursor:pointer;color:#5b9bd1;" class="checkType" data-val="{{d.checkDefId}}"
  62. data-nameType="">选择分类</a>
  63. {{# } }}
  64. </script>
  65. <!-- 检查项 -->
  66. <script type="text/html" id="checkItemDefTpl">
  67. <a href="javascript:void(0)" onclick="goCheckItem('{{d.checkDefId}}','{{d.checkDefName}}')"
  68. style="cursor:pointer;color:#5b9bd1;">检查项({{d.itemCount}})</a>
  69. </script>
  70. <!-- 表单弹窗 -->
  71. <script type="text/html" id="modelTpl">
  72. <form id="modelForm" lay-filter="modelForm" class="layui-form model-form">
  73. <input hidden name="checkDefId"/>
  74. <div class="layui-form-item">
  75. <label class="layui-form-label">检查表名称</label>
  76. <div class="layui-input-block">
  77. <input type="text" class="layui-input" id="checkDefName" name="checkDefName" placeholder="请输入标题"
  78. maxlength="128"
  79. lay-verType="tips" lay-verify="required" required/>
  80. </div>
  81. </div>
  82. <div class="layui-form-item">
  83. <label class="layui-form-label">检查方法</label>
  84. <div class="layui-input-block">
  85. <textarea id="checkDefMethod" name="checkDefMethod"
  86. placeholder="检查方法,最多输入255个汉字"
  87. class="layui-textarea" maxlength="255"></textarea>
  88. </div>
  89. </div>
  90. <div class="layui-form-item">
  91. <label class="layui-form-label">检查依据</label>
  92. <div class="layui-input-block">
  93. <textarea id="checkDefRule" name="checkDefRule"
  94. placeholder="检查依据,最多输入255个汉字"
  95. class="layui-textarea" maxlength="255"></textarea>
  96. </div>
  97. </div>
  98. <div class="layui-form-item">
  99. <label class="layui-form-label">处罚依据</label>
  100. <div class="layui-input-block">
  101. <textarea class="layui-textarea" id="punishDefRule" name="punishDefRule"
  102. placeholder="处罚依据,最多输入255个汉字" maxlength="255"></textarea>
  103. </div>
  104. </div>
  105. <div class="layui-form-item">
  106. <label class="layui-form-label">检查描述</label>
  107. <div class="layui-input-block">
  108. <textarea class="layui-textarea" id="checkDefDesc" name="checkDefDesc"
  109. placeholder="检查描述,最多输入255个汉字" maxlength="255"></textarea>
  110. </div>
  111. </div>
  112. <div class="layui-form-item text-right">
  113. <button type="button" class="layui-btn" lay-filter="modelSubmit" lay-submit>保存</button>
  114. <button type="button" class="layui-btn layui-btn-primary" ew-event="closePageDialog">取消</button>
  115. </div>
  116. </form>
  117. </script>
  118. <!-- 选择分类弹窗 -->
  119. <script type="text/html" id="checkTypeModelTpl">
  120. <form id="modelForm2" lay-filter="modelForm2" class="layui-form model-form" hidden style="min-height: 30px;">
  121. <div class="layui-inline layui-col-md8">
  122. <div class="layui-form-item">
  123. <label class="layui-form-label">分类名称</label>
  124. <div class="layui-input-block">
  125. <input type="text" class="layui-input" id="checkDefTypeName" name="checkDefTypeName"
  126. placeholder="请输入标题" maxlength="128"
  127. lay-verType="tips" lay-verify="required" required/>
  128. </div>
  129. </div>
  130. </div>
  131. <div class="layui-inline layui-col-md4">
  132. <div class="layui-form-item text-right">
  133. <button type="button" class="layui-btn" lay-filter="checkTypeSubmit" lay-submit>保存</button>
  134. <button type="button" class="layui-btn layui-btn-primary" id="cancelFormBtn">取消</button>
  135. </div>
  136. </div>
  137. </form>
  138. <div class="layui-fluid">
  139. <div class="layui-card">
  140. <div class="layui-card-body">
  141. <div class="layui-form toolbar" id="addBtnDiv">
  142. <div class="layui-form-item text-right">
  143. <div class="layui-inline pull-right" style="margin-right:0px;">
  144. <button id="addCheckType" class="layui-btn icon-btn"><i class="layui-icon">&#xe654;</i>添加分类
  145. </button>
  146. </div>
  147. </div>
  148. </div>
  149. <table class="layui-table" id="checkTypeTable" lay-filter="checkTypeTable"></table>
  150. <div class="text-center pull-right" style="padding-top: 15px">
  151. <button type="button" class="layui-btn" id="selectCheckType">&emsp;确定&emsp;</button>
  152. <button type="button" class="layui-btn layui-btn-normal" ew-event="closePageDialog">&emsp;关闭&emsp;
  153. </button>
  154. </div>
  155. </div>
  156. </div>
  157. </div>
  158. </script>
  159. <!-- js部分 -->
  160. <script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
  161. <script type="text/javascript" src="../../../assets/js/common.js?v=312"></script>
  162. <script>
  163. layui.use(['layer', 'form', 'table', 'admin', 'uParas'], function () {
  164. var $ = layui.jquery;
  165. var layer = layui.layer;
  166. var form = layui.form;
  167. var table = layui.table;
  168. var admin = layui.admin;
  169. var uParas = layui.uParas;
  170. var checkDefId = '';
  171. var typeTb;
  172. // 渲染表格
  173. var insTb = table.render({
  174. elem: '#datatable',
  175. url: uParas.baseUrl + '/org/checkDef/queryPage',
  176. page: true,
  177. method: 'post',
  178. cellMinWidth: 100,
  179. cols: [[
  180. {type: 'numbers', title: '序号', width: 80},
  181. {field: 'checkDefName', sort: false, title: '检查表名称'},
  182. {field: 'checkDefDesc', sort: false, title: '检查描述'},
  183. {field: 'checkDefTypeName', sort: false, title: '检查分类', templet: '#checkDefTypeTpl'},
  184. {field: 'itemCount', align: 'center', sort: false, title: '检查项', templet: '#checkItemDefTpl'},
  185. {align: 'center', toolbar: '#optionTpl', title: '操作', width: 200}
  186. ]]
  187. });
  188. // 添加
  189. $('#btnAdd').click(function () {
  190. showAddModel();
  191. });
  192. // 搜索
  193. form.on('submit(formSubSearch)', function (data) {
  194. insTb.reload({where: data.field}, 'data');
  195. });
  196. // 工具条点击事件
  197. table.on('tool(datatable)', function (obj) {
  198. var data = obj.data;
  199. var layEvent = obj.event;
  200. if (layEvent == 'edit') { // 修改
  201. showEditModel(data);
  202. } else if (layEvent == 'del') { // 删除
  203. doDel(data);
  204. }
  205. });
  206. // 删除
  207. function doDel(data) {
  208. layer.confirm('确定要删除“' + data.checkDefName + '”吗?', {
  209. skin: 'layui-layer-admin',
  210. shade: .1
  211. }
  212. , function (i) {
  213. layer.close(i);
  214. layer.load();
  215. admin.req(uParas.baseUrl + '/org/checkDef/delete/' + data.checkDefId, {}, function (res) {
  216. layer.closeAll('loading');
  217. if (res.code == 1) {
  218. layer.msg(res.msg);
  219. insTb.reload({}, 'data');
  220. } else {
  221. layer.msg(res.msg);
  222. }
  223. }, 'GET');
  224. });
  225. }
  226. // 显示新增弹窗
  227. function showAddModel() {
  228. admin.open({
  229. type: 1,
  230. title: '添加检查表',
  231. offset: 'auto',
  232. area: '500px',
  233. content: $('#modelTpl').html(),
  234. success: function (layero, dIndex) {
  235. var url = uParas.baseUrl + '/org/checkDef/saveOrUpdate';
  236. // 保存处理
  237. form.on('submit(modelSubmit)', function (data) {
  238. layer.load();
  239. admin.req(url, data.field, function (resp) {
  240. layer.closeAll('loading');
  241. if (resp.code == 1) {
  242. layer.close(dIndex);
  243. layer.msg(resp.msg);
  244. insTb.reload({}, 'data');
  245. } else {
  246. layer.msg(resp.msg);
  247. }
  248. }, 'POST');
  249. return false;
  250. });
  251. }
  252. });
  253. }
  254. // 显示编辑弹窗
  255. function showEditModel(data) {
  256. admin.open({
  257. type: 1,
  258. title: '修改检查表',
  259. offset: 'auto',
  260. area: '500px',
  261. content: $('#modelTpl').html(),
  262. success: function (layero, dIndex) {
  263. var url1 = uParas.baseUrl + '/org/checkDef/getById/' + data.checkDefId;
  264. admin.req(url1, {}, function (resp) {
  265. if (resp.code == 1) {
  266. form.val('modelForm', resp.data); // 回显数据
  267. } else {
  268. layer.msg(resp.msg)
  269. }
  270. }, 'GET');
  271. // 保存处理
  272. form.on('submit(modelSubmit)', function (modelData) {
  273. layer.load();
  274. var url = uParas.baseUrl + '/org/checkDef/saveOrUpdate';
  275. admin.req(url, modelData.field, function (resp) {
  276. layer.closeAll('loading');
  277. if (resp.code == 1) {
  278. layer.close(dIndex);
  279. layer.msg(resp.msg);
  280. insTb.reload({}, 'data');
  281. } else {
  282. layer.msg(resp.msg);
  283. }
  284. }, 'POST');
  285. return false;
  286. });
  287. }
  288. });
  289. }
  290. //选择检查分类
  291. function checkTypeDef(checkDefId, checkDefTypeId) {
  292. admin.open({
  293. type: 1,
  294. title: '选择检查表分类',
  295. area: '800px',
  296. content: $('#checkTypeModelTpl').html(),
  297. success: function (layero, dIndex) {
  298. typeTb = table.render({
  299. elem: '#checkTypeTable',
  300. url: uParas.baseUrl + '/org/checkDefType/queryPage',
  301. page: true,
  302. method: 'post',
  303. where: {"checkDefTypeId": checkDefTypeId},
  304. cellMinWidth: 100,
  305. cols: [[
  306. {type: 'radio'},
  307. {field: 'checkDefTypeName', sort: false, title: '分类名称', edit: 'text'},
  308. /*{field: 'checkDefDesc' , sort:false , title:'检查描述' },*/
  309. {align: 'center', toolbar: '#checkTypeOptionTpl', title: '操作', width: 200}
  310. ]]
  311. });
  312. // 保存处理
  313. form.on('submit(checkTypeSubmit)', function (data) {
  314. layer.load();
  315. $("#modelForm2").hide();
  316. $("#checkDefTypeName").val('');
  317. $("#addBtnDiv").show();
  318. saveCheckType(data.field);
  319. return false;
  320. });
  321. },
  322. end: function () {
  323. insTb.reload({}, 'data');
  324. }
  325. });
  326. }
  327. //监听单元格编辑
  328. table.on('edit(checkTypeTable)', function (obj) {
  329. var value = obj.value //得到修改后的值
  330. var data = obj.data //得到所在行所有键值
  331. var checkDefTypeId = data.checkDefTypeId;
  332. saveCheckType({"checkDefTypeId": checkDefTypeId, "checkDefTypeName": value});
  333. });
  334. //选择分类
  335. $(document).on('click', '.checkType', function (e) {
  336. //防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数
  337. e.stopPropagation();
  338. checkDefId = $(this).attr("data-val");
  339. var checkDefTypeId = $(this).attr("data-nameType");
  340. checkTypeDef(checkDefId, checkDefTypeId);
  341. });
  342. // 检查分类工具条点击事件
  343. table.on('tool(checkTypeTable)', function (obj) {
  344. var data = obj.data;
  345. var layEvent = obj.event;
  346. if (layEvent == 'delCheckType') { // 删除
  347. delCheckType(data);
  348. }
  349. });
  350. //添加检查分类
  351. $(document).on('click', '#addCheckType', function (e) {
  352. //防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数
  353. e.stopPropagation();
  354. $("#modelForm2").show();
  355. $("#addBtnDiv").hide();
  356. });
  357. //取消添加
  358. $(document).on('click', '#cancelFormBtn', function (e) {
  359. //防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数
  360. e.stopPropagation();
  361. $("#modelForm2").hide();
  362. $("#checkDefTypeName").val('');
  363. $("#addBtnDiv").show();
  364. });
  365. //选择分类后保存
  366. $(document).on('click', '#selectCheckType', function (e) {
  367. var checkStatus = table.checkStatus('checkTypeTable');
  368. var checkData = checkStatus.data;
  369. if (checkData.length < 1) {
  370. layer.msg("请选择分类数据!");
  371. return;
  372. }
  373. var checkDefTypeId = checkData[0].checkDefTypeId;
  374. $.ajax({
  375. type: "post",
  376. url: uParas.baseUrl + "/org/checkDef/saveOrUpdate",
  377. data: {checkDefId: checkDefId, checkDefTypeId: checkDefTypeId},
  378. dataType: "json",
  379. success: function (result) {
  380. if (result.code === 1) {
  381. layer.closeAll();
  382. } else {
  383. layer.msg(result.msg);
  384. }
  385. }
  386. });
  387. })
  388. //保存或者修改分类
  389. function saveCheckType(data) {
  390. var url = uParas.baseUrl + '/org/checkDefType/saveCheckDefType';
  391. admin.req(url, data, function (resp) {
  392. layer.closeAll('loading');
  393. if (resp.code == 1) {
  394. //layer.close(dIndex);
  395. layer.msg(resp.msg);
  396. typeTb.reload({}, 'data');
  397. } else {
  398. layer.msg(resp.msg);
  399. }
  400. }, 'POST');
  401. }
  402. //删除分类
  403. function delCheckType(data) {
  404. layer.confirm('确定要删除“' + data.checkDefTypeName + '”吗?', {
  405. skin: 'layui-layer-admin',
  406. shade: .1
  407. }, function (i) {
  408. layer.close(i);
  409. layer.load();
  410. admin.req(uParas.baseUrl + '/org/checkDefType/delCheckDefType', {checkDefTypeId: data.checkDefTypeId}, function (res) {
  411. layer.closeAll('loading');
  412. if (res.code == 1) {
  413. layer.msg(res.msg);
  414. typeTb.reload({}, 'data');
  415. } else {
  416. layer.msg(res.msg);
  417. }
  418. }, 'POST');
  419. });
  420. }
  421. });
  422. //去检查项列表
  423. function goCheckItem(checkDefId, checkDefName) {
  424. location.href = './itemIndex.html?checkDefId=' + checkDefId + '&checkDefName=' + checkDefName;
  425. }
  426. </script>
  427. </body>
  428. </html>