swhuanjieyonghu.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>湖北智慧水运</title>
  5. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  6. <meta http-equiv="description" content="this is my page">
  7. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
  9. <link>
  10. <link href="../css/base.min.css" rel="stylesheet">
  11. <link rel="stylesheet" type="text/css" href="../css/mui.min.css">
  12. <link rel="stylesheet" href="../css/zTreeStyle/zTreeStyle.css" type="text/css">
  13. <script type="text/javascript" src="../js/jquery-1.4.4.min.js"></script>
  14. <script type="text/javascript" src="../js/jquery.ztree.core-3.5.js"></script>
  15. <script type="text/javascript" src="../js/jquery.ztree.excheck-3.5.js"></script>
  16. </head>
  17. <script type="text/javascript">
  18. function back(){
  19. parent.huanjiewanchengclose();
  20. }
  21. $(function(){
  22. $("#wancheng").live("click",function(){
  23. var days = $("#dayss").val();
  24. if(bids==""){
  25. layer.open({
  26. content: '请选择下一环节办理人',
  27. style: 'background-color:rgba(0,0,0,0.5); color:white; border:none;font-size:20px;text-align:center',
  28. time: 1
  29. });
  30. return;
  31. }
  32. if(days.replace(/\s+/g,"")!=""){
  33. if(days <=0 || days!=parseInt(days)||days>10 ){
  34. layer.open({
  35. content: '请填写正确待办天数',
  36. style: 'background-color:rgba(0,0,0,0.5); color:white; border:none;font-size:20px;text-align:center',
  37. time: 1
  38. });
  39. $("#dayss").val("");
  40. return;
  41. }
  42. }
  43. $.ajax({
  44. type: 'post',
  45. url: '../../fwcontroller/submitfw.do',
  46. data:{id:parent.wfid,step:step,yj:parent.yj,usersStr:bids,days:days,uid:"402881e44e86c26d014e86c9ae8c0008"},
  47. dataType: 'json',
  48. success: function(data){
  49. if(data.resultCode=="0"){
  50. layer.open({
  51. content: '审批成功',
  52. style: 'background-color:rgba(0,0,0,0.5); color:white; border:none;font-size:20px;text-align:center',
  53. time: 1
  54. });
  55. setTimeout(function(){
  56. window.location.href=parent.iframurl;
  57. },1000);
  58. }else{
  59. layer.open({
  60. content: '审批失败',
  61. style: 'background-color:rgba(0,0,0,0.5); color:white; border:none;font-size:20px;text-align:center',
  62. time: 1
  63. });
  64. }
  65. }})
  66. })
  67. })
  68. </script>
  69. <SCRIPT type="text/javascript">
  70. var stepId;
  71. var step;
  72. var radiostepId;
  73. var bids = "";
  74. var bnames= "";
  75. function huanjiemingcheng(handlerNames,handlerIds,a,taskKey){
  76. step = taskKey;
  77. radiostepId = $(a).val();
  78. bids = handlerIds.substring(0, handlerIds.length-1)
  79. bnames = handlerNames.substring(0, handlerNames.length-2)
  80. $("#banliren").val(bnames);
  81. }
  82. $(function(){
  83. $.ajax({
  84. type: 'post',
  85. url: '../../wfcontroller/chooseuserwf.do',
  86. data:{taskId:parent.taskId,wfid:parent.wfid,flag:"pass"},
  87. dataType: 'json',
  88. success: function(data){
  89. stepId = data.stepId;
  90. step = data.step;
  91. console.log(data)
  92. var result = "";
  93. for(var i=0;i<data.taskNodeList.length;i++){
  94. var handlerNames = "";
  95. var handlerIds = "";
  96. for(var j=0;j<data.taskNodeList[i].handlerNames.length;j++){
  97. handlerNames+=data.taskNodeList[i].handlerNames[j]+", "
  98. }
  99. for(var k=0;k<data.taskNodeList[i].handlerIds.length;k++){
  100. handlerIds+=data.taskNodeList[i].handlerIds[k]+","
  101. }
  102. if(data.stepId==data.taskNodeList[i].stepId){
  103. radiostepId = data.taskNodeList[i].stepId;
  104. bids = handlerIds.substring(0, handlerIds.length-1)
  105. bnames = handlerNames.substring(0, handlerNames.length-2)
  106. $("#banliren").val(bnames);
  107. }
  108. result+='<span class="mui-radio">'+
  109. '<input name="style" onclick="huanjiemingcheng(\''+handlerNames+'\',\''+handlerIds+'\',this,\''+data.taskNodeList[i].taskKey+'\')" type="radio" '+(data.stepId==data.taskNodeList[i].stepId?"checked":"")+' value="'+data.taskNodeList[i].stepId+'">'+
  110. data.taskNodeList[i].taskName+
  111. '</span>' ;
  112. }
  113. $("#huanjiemingcheng").html(result);
  114. }})
  115. })
  116. function sumitrenyuan(){
  117. var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
  118. var nodes = treeObj.getCheckedNodes(true);
  119. bids="";
  120. bnames="";
  121. for(var i=0;i<nodes.length;i++){
  122. bids+=nodes[i].ids+",";
  123. bnames+=nodes[i].name+", ";
  124. }
  125. bids = bids.substring(0, bids.length-1)
  126. bnames = bnames.substring(0, bnames.length-2)
  127. $("#banliren").val(bnames);
  128. }
  129. var setting = {
  130. check: {
  131. enable: true
  132. },
  133. data: {
  134. simpleData: {
  135. enable: true
  136. }
  137. },
  138. callback: {
  139. onCheck:zTreeOnCheck,
  140. onClick: zTreeOnClick
  141. }
  142. };
  143. function zTreeOnCheck(event, treeId, treeNode) {
  144. };
  145. function zTreeOnClick(event, treeId, treeNode) {
  146. var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
  147. var nodes = treeObj.getSelectedNodes();
  148. for (var i=0, l=nodes.length; i < l; i++) {
  149. if(nodes[i].checked==false)
  150. treeObj.checkNode(nodes[i], true, true);
  151. else
  152. treeObj.checkNode(nodes[i], false, true);
  153. }
  154. for (var i=0, l=nodes.length; i < l; i++) {
  155. if(nodes[i].open==false)
  156. treeObj.expandNode(nodes[i], true, true, true);
  157. else
  158. treeObj.expandNode(nodes[i], false, true, true);
  159. }
  160. }
  161. var code;
  162. function setCheck() {
  163. var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
  164. py = $("#py").attr("checked")? "p":"",
  165. sy = $("#sy").attr("checked")? "s":"",
  166. pn = $("#pn").attr("checked")? "p":"",
  167. sn = $("#sn").attr("checked")? "s":"",
  168. type = { "Y":py + sy, "N":pn + sn};
  169. zTree.setting.check.chkboxType = type;
  170. showCode('setting.check.chkboxType = { "Y" : "' + type.Y + '", "N" : "' + type.N + '" };');
  171. }
  172. function showCode(str) {
  173. if (!code) code = $("#code");
  174. code.empty();
  175. code.append("<li>"+str+"</li>");
  176. }
  177. </SCRIPT>
  178. <script type="text/javascript">
  179. $(function(){
  180. $("#baocuns").click(function(){
  181. $("#div-alert").hide();
  182. $("#div-alert1").hide();
  183. })
  184. $("#quxiaos").click(function(){
  185. $("#div-alert").hide();
  186. $("#div-alert1").hide();
  187. })
  188. $("#qxz").click(function(){
  189. var zNodes =[
  190. ];
  191. $.ajax({
  192. type: 'post',
  193. url: '../../wfcontroller/showUserTree.do',
  194. data:{stepId:radiostepId,ids:bids},
  195. dataType: 'json',
  196. success: function(data){
  197. console.log(data)
  198. for(var i=0;i<data.nodeList.length;i++){
  199. zNodes.push({ id:(i+1),pId:0,ids:data.nodeList[i].id,name:data.nodeList[i].text,nocheck:true});
  200. for(var j=0;j<data.nodeList[i].children.length;j++){
  201. zNodes.push({ id:(i+1)+""+j,pId:(i+1),ids:data.nodeList[i].children[j].id,checked:data.nodeList[i].children[j].checked,name:data.nodeList[i].children[j].text});
  202. }
  203. }
  204. $.fn.zTree.init($("#treeDemo"), setting, zNodes);
  205. $("#div-alert").show();
  206. $("#div-alert1").show();
  207. }})
  208. })
  209. })
  210. function aaa(){
  211. layer.open({
  212. content: '审批完成',
  213. style: 'background-color:rgba(0,0,0,0.5); color:white; border:none;font-size:20px;text-align:center',
  214. time: 1
  215. });
  216. }
  217. </script>
  218. <style type="text/css">
  219. *{padding: 0px;margin: 0px;}
  220. .header {
  221. width:100%;
  222. height:45px;
  223. line-height:45px;
  224. padding:0;
  225. color:#eee;
  226. font-size:22px;
  227. text-align:center;
  228. color:white;
  229. background: #2196f3;
  230. }
  231. .layermcont {
  232. padding: 20px 15px;
  233. line-height: 22px;
  234. border-radius: 5px;
  235. text-align: center;
  236. }
  237. #header {
  238. position:fixed; z-index:2;
  239. top:0; left:0;
  240. width:100%;
  241. height:45px;
  242. line-height:45px;
  243. text-align:center;
  244. padding:0;
  245. font-size:22px;
  246. color:white;
  247. background: #2196f3;
  248. color: white;
  249. }
  250. #header a{
  251. color:white;
  252. }
  253. body,button,input,div{margin: 0px;padding: 0px}
  254. .mui-input-group:after {
  255. position: absolute;
  256. right: 0;
  257. bottom: 0;
  258. left: 0;
  259. height: 0px;
  260. content: '';
  261. background-color: #c8c7cc;
  262. -webkit-transform: scaleY(.5);
  263. transform: scaleY(.5);
  264. }
  265. input::-webkit-outer-spin-button,
  266. input::-webkit-inner-spin-button{
  267. -webkit-appearance: none !important;
  268. margin: 0;
  269. }
  270. .load-bar-content, .modal-content, .modal-dialog, .modal-heading, .nav, .nav .a, .nav a, .nav li, .progress {
  271. position: fixed;
  272. }
  273. .mui-checkbox input[type=checkbox], .mui-radio input[type=radio] {
  274. position:static;
  275. top: 0px;
  276. right: 20px;
  277. display: inline-block;
  278. width: 28px;
  279. height: 26px;
  280. -webkit-appearance: none;
  281. background-color: transparent;
  282. border: 0;
  283. outline: 0!important;
  284. }
  285. .laymshade {
  286. background-color: rgba(0,0,0,.0);
  287. /* pointer-events: auto; */
  288. }
  289. .mui-card{margin: 0px}
  290. </style>
  291. </head>
  292. <body>
  293. <header class="header">
  294. <ul class="nav nav-list pull-left">
  295. <li><a href="javascript:void(0);" id="goback" onclick="back()" ><span class="icon icon-arrow-back icback"></span>
  296. </a></li>
  297. </ul>
  298. <a href="#">选择环节用户</a>
  299. </header>
  300. <div class="mui-content" style="margin-top: 45px;background: white;padding-right: 10px">
  301. <table style="width: 100%" >
  302. <tr>
  303. <td style="text-align: right;"><h5 class="mui-content-padded" style="padding-top: 10px;">环节名称</h5></td>
  304. <td id="huanjiemingcheng">
  305. </td>
  306. </tr>
  307. <tr style="height: 30px"></tr>
  308. <tr style="height: 100px">
  309. <td width="80px" style="text-align: right;"><h5 class="mui-content-padded" style="padding: 0px">办理人</h5></td>
  310. <td><div class="mui-card" style="height: 100px;width: 70%;float:left;">
  311. <textarea rows="" id="banliren" cols="" style="height: 100%;border: 0px" disabled="disabled"></textarea>
  312. </div>
  313. <button class="mui-btn mui-btn-primary" id="qxz" style="margin-top:68px;background:#2196f3;border:0px;margin-left:10px" onclick="return false;">选择</button>
  314. </td>
  315. </tr>
  316. <tr style="height: 120px">
  317. <td ><h5 class="mui-content-padded" style="text-align: right;margin-top: -2px">限办天数</h5></td>
  318. <td style="position: relative;"> <input type="tel" name="days" id="dayss" min="1" max="10" style="width: 60px" /><span style="color: red;">&nbsp;可不填,最多可以设置10天</span></td>
  319. </tr>
  320. <tr >
  321. <td ></td>
  322. <td> <div style="width: 100%;">
  323. <button class="mui-btn mui-btn-positive" type="button" style="width: 40%;background: #2196f3;border: 0px;" id="wancheng">完成 </button>&nbsp;&nbsp;
  324. <button class="mui-btn mui-btn-positive" type="button" style="width: 40%;background: #2196f3;border: 0px;" onclick="back()">取消</button>
  325. </div></td>
  326. </tr>
  327. </table>
  328. </div>
  329. <div id="div-alert" style="position:fixed;padding-bottom:10px;display:none;top: 10%;left: 10%;z-index: 100;height:80%;border:4px solid #2196f3;border-radius:10px;width: 82%;background:white;overflow: auto">
  330. <form id="jhform">
  331. <input type="hidden" name="jid" id="jid" value="" />
  332. <div id="title" style="width:100%;height:30px;text-align: center;background:#2196f3;line-height: 30px;color: white;margin-bottom: 20px;font-size:20px;">选择人员</div>
  333. <ul id="treeDemo" class="ztree" style="zoom:1.5;" ></ul>
  334. </form>
  335. <div style="width: 100%;text-align: center;">
  336. <button class="mui-btn mui-btn-positive" type="button" style="width: 40%;background: #2196f3;border: 0px;" id="baocuns" onclick="sumitrenyuan()">确定</button>&nbsp;&nbsp;
  337. <button class="mui-btn mui-btn-positive" type="button" style="width: 40%;background: #2196f3;border: 0px;" id="quxiaos">取消</button>
  338. </div>
  339. </div>
  340. <div id="div-alert1" style="position:absolute;display:none;width:100%;height: 100%;z-index: 50;top:0px;background: black; opacity:0.2; "></div>
  341. </body>
  342. </html>