preinflow.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="renderer" content="webkit|ie-comp|ie-stand">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  8. <meta http-equiv="Cache-Control" content="no-siteapp" />
  9. <link rel="stylesheet" href="${ctx}/assets/lib/bootstrap-3.3.7/css/bootstrap.min.css">
  10. <link rel="stylesheet" href="${ctx}/assets/lib/bootstrap-upload/css/default.css">
  11. <link rel="stylesheet" href="${ctx}/assets/lib/bootstrap-upload/css/fileinput.css">
  12. <link rel="stylesheet" type="text/css" media="screen" href="${ctx}/assets/lib/zTree/v3/css/zTreeStyle/zTreeStyle.css" >
  13. <script type="text/javascript" src="${ctx}/assets/lib/jquery/1.9.1/jquery.min.js"></script>
  14. <script type="text/javascript" src="${ctx}/assets/lib/jquery.form/jquery.form.min.js"></script>
  15. <script type="text/javascript" src="${ctx}/assets/lib/layer/3.0.3/layer.js"></script>
  16. <script type="text/javascript" src="${ctx}/assets/lib/My97DatePicker/WdatePicker.js"></script>
  17. <script type="text/javascript" src="${ctx}/assets/lib/bootstrap-upload/js/fileinput.js"></script>
  18. <script type="text/javascript" src="${ctx}/assets/lib/bootstrap-upload/js/locales/zh.js"></script>
  19. <script type="text/javascript" src="${ctx}/assets/lib/bootstrap-3.3.7/js/bootstrap.min.js"></script>
  20. <script type="text/javascript" src="${ctx}/assets/lib/zTree/v3/js/jquery.ztree.all-3.5.min.js"></script>
  21. <script type="text/javascript" src="${ctx}/assets/js/base.js"></script>
  22. <script src="${ctx}/assets/js/validate.js" ></script>
  23. <script type="text/javascript">
  24. function setCollapseIcon(collapseIcon)
  25. {
  26. var curCollapseIconClass=$("#"+collapseIcon).attr("class");
  27. if(curCollapseIconClass=="glyphicon glyphicon-menu-up")
  28. {
  29. $("#"+collapseIcon).attr("class","glyphicon glyphicon-menu-down");
  30. }
  31. else
  32. {
  33. $("#"+collapseIcon).attr("class","glyphicon glyphicon-menu-up");
  34. }
  35. }
  36. function setOrgAndJob(jobid,jobname,orgid)
  37. {
  38. $('#DoWorkDutiesID').val(jobid);
  39. $('#DoWorkDutiesName').val(jobname);
  40. $('#NodeDeptID').val(orgid);
  41. $('#orgModal').modal('hide');
  42. }
  43. function setOrg()
  44. {
  45. var zTreeObj;
  46. var zNodes;
  47. function zTreeChecked(event, treeId, treeNode) {
  48. setOrgAndJob(treeNode.id,treeNode.name,treeNode.pId);
  49. };
  50. //异步获取数据
  51. function ajaxDataFilter(treeId, parentNode, data) {
  52. if(data == "") return;
  53. var zNodes = [];
  54. var orgN = data.Org;
  55. orgN.forEach(function(item,index){
  56. zNodes.push({id:item.orgid,pId:item.parentid,name:item.orgname,istype:false, isParent:true,"nocheck":true});
  57. })
  58. var jobN = data.Job;
  59. jobN.forEach(function(item,index){
  60. zNodes.push({id:item.keyid,pId:item.orgid,name:item.jobname,istype:true,checked:false});
  61. })
  62. return zNodes;
  63. }
  64. var setting = { //初始化树
  65. check: {
  66. enable: true,
  67. chkboxType: { "Y" : "", "N" : "" },
  68. autoCheckTrigger: true
  69. },
  70. data: {
  71. simpleData: {
  72. idKey:"id",
  73. pIdKey:"pId",
  74. enable:true,
  75. rootPId:"0"
  76. }
  77. },
  78. callback: {
  79. onCheck: zTreeChecked
  80. },
  81. async:{
  82. enable:true,
  83. url:"${ctx}/myconsole/complaint/preinflow/getOrgAndJobTree",
  84. autoParam:["id", "name"] ,
  85. dataFilter: ajaxDataFilter
  86. }
  87. };
  88. //初始化获取数据
  89. $.ajax({
  90. url : "${ctx}/myconsole/complaint/preinflow/getOrgAndJobTree?name=init",
  91. type : "post",
  92. dataType : "json",
  93. success : function(data) {
  94. if(data == "") return;
  95. var zNodes = [];
  96. var orgN = data.Org;
  97. if(orgN!=null)
  98. {
  99. orgN.forEach(function(item,index){
  100. zNodes.push({id:item.orgid,pId:item.parentid,name:item.orgname,istype:false, isParent:true,"nocheck":true});
  101. })
  102. }
  103. var jobN = data.Job;
  104. if(jobN!=null)
  105. {
  106. jobN.forEach(function(item,index){
  107. zNodes.push({id:item.keyid,pId:item.orgid,name:item.jobname,istype:true,checked:false});
  108. })
  109. }
  110. zTreeObj = $.fn.zTree.init($("#UserTree"), setting, zNodes);//初始化树节点时,添加同步获取的数据
  111. }
  112. });
  113. $('#orgModal').modal({
  114.  backdrop: 'static',
  115.  keyboard: false
  116. })
  117. }
  118. //预设流程开发
  119. function getNewFlowNodeNum()
  120. {
  121. $('#form1').attr('action','${ctx}/myconsole/complaint/preinflow/getNewFlowNodeNum');
  122. $('#form1').ajaxSubmit(getNewFlowNodeNumHandle);
  123. }
  124. function getNewFlowNodeNumHandle(data)
  125. {
  126. $("#FlowNode").val(data);
  127. }
  128. function showFlowNode()
  129. {
  130. $('#form1').attr('action','${ctx}/myconsole/complaint/preinflow/getFlowNode');
  131. $('#form1').ajaxSubmit(getFlowNodeHandle);
  132. }
  133. function getFlowNodeHandle(data)
  134. {
  135. $("#FlowShow").empty();
  136. $("#FlowShow").append(data);
  137. $('#FlowModal').modal({
  138.  backdrop: 'static',
  139.  keyboard: false
  140. })
  141. $("#DoFlowNodeButton").removeAttr('disabled');
  142. }
  143. function setFlowNode()
  144. {
  145. if(doValidate(form1))
  146. {
  147. $('#form1').attr('action','${ctx}/myconsole/complaint/preinflow/setFlowNode');
  148. $('#form1').ajaxSubmit(resultFlowNodeHandle);
  149. }
  150. }
  151. function resultFlowNodeHandle(data){
  152. var res=eval('(' + data + ')');
  153. if(res.flag){
  154. layer.alert(res.message, {skin: 'layui-layer-molv',closeBtn: 1},
  155. function(){
  156. var strArrow="";
  157. if(res.FlowNode!="1")
  158. {
  159. strArrow="<div class='row' style='padding:5px'>"+
  160. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' >"+
  161. "</div>"+
  162. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' align=center>"+
  163. " <span class='glyphicon glyphicon-arrow-down'></span> "+
  164. "</div>"+
  165. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' >"+
  166. "</div>"+
  167. "</div>";
  168. }
  169. var strContent="";
  170. var strEditNode="<button type='button' class='btn btn-warning' id='EditNodeButton' onclick=editNode('"+res.FlowNode+"','"+res.DoWorkDutiesID+"','"+res.DoWorkDutiesName+"','"+res.NoNormalPay+"','"+res.NodeDeptID+"') ><span class='glyphicon glyphicon-pencil'></span></button>";
  171. strContent="<div class='row' style='padding:5px' id=FlowNode_"+res.FlowNode+">"+
  172. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' >"+
  173. "</div>"+
  174. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' align=center>"+
  175. " <button type='button' class='btn btn-success' style='width:300px'>"+res.NodeOrgName+"-"+res.NodeDeptName+"-"+res.DoWorkDutiesName+"("+res.NoNormalPay+"元)</button> "+
  176. "</div>"+
  177. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' >"+strEditNode+
  178. "</div>"+
  179. "</div>";
  180. var iFlowNode=parseInt(res.FlowNode);
  181. iFlowNode=iFlowNode+1;
  182. $("#NoNormalPay").val("");
  183. $("#NodeDeptID").val("");
  184. $("#DoWorkDutiesID").val("");
  185. $("#DoWorkDutiesName").val("");
  186. $("#FlowNode").val(iFlowNode);
  187. $("#FlowShow").append(strArrow);
  188. $("#FlowShow").append(strContent);
  189. layer.closeAll('dialog');
  190. });
  191. }else{
  192. if(res.flag == false)
  193. {
  194. layer.alert(res.message, {skin: 'layui-layer-molv',closeBtn: 0}, function(){layer.closeAll('dialog');});
  195. }
  196. }
  197. }
  198. function editNode(strFlowNode,strDoWorkDutiesID,strDoWorkDutiesName,strNoNormalPay,strNodeDeptID)
  199. {
  200. $("#FlowNode").val(strFlowNode);
  201. $('#DoWorkDutiesID').val(strDoWorkDutiesID);
  202. $('#DoWorkDutiesName').val(strDoWorkDutiesName);
  203. $('#NoNormalPay').val(strNoNormalPay);
  204. $('#NodeDeptID').val(strNodeDeptID);
  205. $("#DoFlowNodeButton").attr("onclick","editFlowNode()");
  206. }
  207. function editFlowNode()
  208. {
  209. if(doValidate(form1))
  210. {
  211. $('#form1').attr('action','${ctx}/myconsole/complaint/preinflow/editFlowNode');
  212. $('#form1').ajaxSubmit(resultEditFlowNodeHandle);
  213. }
  214. }
  215. function resultEditFlowNodeHandle(data){
  216. var res=eval('(' + data + ')');
  217. if(res.flag){
  218. layer.alert(res.message, {skin: 'layui-layer-molv',closeBtn: 1},
  219. function(){
  220. var strContent="";
  221. var strEditNode="<button type='button' class='btn btn-warning' id='EditNodeButton' onclick=editNode('"+res.FlowNode+"','"+res.DoWorkDutiesID+"','"+res.DoWorkDutiesName+"','"+res.NoNormalPay+"','"+res.NodeDeptID+"') ><span class='glyphicon glyphicon-pencil'></span></button>";
  222. strContent="<div class='row' style='padding:5px' id=FlowNode_"+res.FlowNode+">"+
  223. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' >"+
  224. "</div>"+
  225. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' align=center>"+
  226. " <button type='button' class='btn btn-success' style='width:300px'>"+res.NodeOrgName+"-"+res.NodeDeptName+"-"+res.DoWorkDutiesName+"("+res.NoNormalPay+"元)</button> "+
  227. "</div>"+
  228. "<div class='col-xs-4 col-sm-4 col-md-4 col-lg-4' >"+strEditNode+
  229. "</div>"+
  230. "</div>";
  231. $("#NoNormalPay").val("");
  232. $("#DisabledNum").val("");
  233. $("#DoWorkDutiesID").val("");
  234. $("#DoWorkDutiesName").val("");
  235. $("#FlowNode_"+res.FlowNode).empty();
  236. $("#FlowNode_"+res.FlowNode).append(strContent);
  237. $("#DoFlowNodeButton").attr("onclick","setFlowNode()");
  238. layer.closeAll('dialog');
  239. });
  240. }else{
  241. if(res.flag == false)
  242. {
  243. layer.alert(res.message, {skin: 'layui-layer-molv',closeBtn: 0}, function(){layer.closeAll('dialog');});
  244. }
  245. }
  246. }
  247. function deleteEndNode()
  248. {
  249. $('#form1').attr('action','${ctx}/myconsole/complaint/preinflow/deleteEndNode');
  250. $('#form1').ajaxSubmit(deleteEndNodeHandle);
  251. }
  252. function deleteEndNodeHandle(data){
  253. var res=eval('(' + data + ')');
  254. if(res.flag)
  255. {
  256. layer.alert(res.message, {skin: 'layui-layer-molv',closeBtn: 0}, function(){layer.closeAll('dialog');showFlowNode();});
  257. }
  258. else
  259. {
  260. if(res.flag == false)
  261. {
  262. layer.alert(res.message, {skin: 'layui-layer-molv',closeBtn: 0}, function(){layer.closeAll('dialog');});
  263. }
  264. }
  265. }
  266. </script>
  267. <title>流程设置</title>
  268. <meta name="keywords" content="">
  269. <meta name="description" content="">
  270. </head>
  271. <body >
  272. <form id="form1" method="post" class="form-horizontal" role="form">
  273. <div style="display: none">
  274. <input type="hidden" id="DoOrgID" name="DoOrgID" value="${DoOrgID!''}"/>
  275. <input type="hidden" id="DoOrgName" name="DoOrgName" value="${DoOrgName!''}"/>
  276. <input type="hidden" id="DoWorkDutiesID" name="DoWorkDutiesID" value=""/>
  277. <input type="hidden" id="NodeDeptID" name="NodeDeptID" value=""/>
  278. </div>
  279. <div class="container-fluid" style="margin-top:15px;">
  280. <div class="panel panel-primary">
  281. <div class="panel-heading">
  282. <div style="display:inline;" >预设流程 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;机构:${DoOrgName!''} </div>
  283. </div>
  284. <div id="collapseFlow" class="panel-collapse collapse in">
  285. <div class="panel-body" style="font-size:14px">
  286. <div class="row" style="padding:5px">
  287. <div class="col-xs-12 col-sm-1 col-md-1 col-lg-1" >
  288. <label class="control-label" for="NoNormalPay" style="padding-top:5px">金额大于</label>
  289. </div>
  290. <div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
  291. <div class="input-group">
  292. <span class="input-group-addon">¥</span>
  293. <input type="text" class="form-control" value="" placeholder="协议赔偿金合计" id="NoNormalPay" name="NoNormalPay" vmode="not null" vdisp="金额大于" vtype="int" >
  294. <span class="input-group-addon">元</span>
  295. </div>
  296. </div>
  297. <div class="col-xs-12 col-sm-1 col-md-1 col-lg-1" >
  298. <label class="control-label" for="DoWorkDutiesName" style="padding-top:5px">所选岗位</label>
  299. </div>
  300. <div class="col-xs-12 col-sm-3 col-md-3 col-lg-3" >
  301. <div class="input-group">
  302. <input type="text" class="form-control" value="" placeholder="所选岗位" id="DoWorkDutiesName" name="DoWorkDutiesName" vmode="not null" vdisp="所选岗位" vtype="string" readonly>
  303. <div class="input-group-btn">
  304. <button type="button" class="btn btn-default" aria-label="Left Align" onclick="setOrg()" id="ButtonToOrgInfo" title="选择案件审批岗位">
  305. <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
  306. </button>
  307. </div>
  308. </div>
  309. </div>
  310. <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1" >
  311. <label class="control-label" for="ReasonID1" style="padding-top:5px">节点顺序</label>
  312. </div>
  313. <div class="col-xs-12 col-sm-3 col-md-3 col-lg-3" >
  314. <div class="input-group">
  315. <input type="text" class="form-control" value="1" id="FlowNode" name="FlowNode" vmode="not null" vdisp="节点顺序" vtype="int" readonly>
  316. <div class="input-group-btn">
  317. <button type="button" class="btn btn-success" id="DoFlowNodeButton" onclick="setFlowNode()" >保存</button>
  318. </div>
  319. </div>
  320. </div>
  321. </div>
  322. </div>
  323. </div>
  324. </div>
  325. <div class="panel panel-success">
  326. <div class="panel-heading">
  327. <div style="display:inline;" >流程展示 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
  328. <div style="display:inline;" ><a class="panel-title" data-toggle="collapse" data-parent="#accordion" href="#collapseFlowList"><span id="FlowListCollapseIcon" onClick="setCollapseIcon('FlowListCollapseIcon')" class="glyphicon glyphicon-menu-up" aria-hidden="true"></span></a></div>
  329. </div>
  330. <div id="collapseFlowList" class="panel-collapse collapse in">
  331. <div class="panel-body" style="font-size:14px" id=FlowShow>
  332. </div>
  333. </div>
  334. </div>
  335. <div class="row" style="padding:5px">
  336. <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" align=center>
  337. <button type="button" class="btn btn-primary" id="FlowSetButton" onclick=deleteEndNode() ><span class="glyphicon glyphicon-save"></span>&nbsp;&nbsp;删除最后节点</button>
  338. </div>
  339. </div>
  340. </form>
  341. </div>
  342. <!-- 选择单位弹出页面,模态框(Modal) -->
  343. <div class="modal fade" id="orgModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  344. <div class="modal-dialog"  role="document" style="width:600px;height:500px;">
  345. <div class="modal-content">
  346. <div class="modal-header">
  347. <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
  348. &times;
  349. </button>
  350. </div>
  351. <div class="modal-body">
  352. <div class="row" style="padding:1px" >
  353. <ul id="UserTree" class="ztree"></ul>
  354. </div>
  355. </div>
  356. <div class="modal-footer">
  357. </div>
  358. </div><!-- /.modal-content -->
  359. </div><!-- /.modal -->
  360. </div> 
  361. <script type="text/javascript">
  362. getNewFlowNodeNum();
  363. showFlowNode();
  364. </script>
  365. </body>
  366. </html>