tpl_dept.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>选择人员</title>
  6. <link rel="stylesheet" type="text/css" href="<?=$da['p']?>/css/css.css"/>
  7. <script type="text/javascript" src="js/jquery.js"></script>
  8. <script type="text/javascript" src="js/js.js"></script>
  9. <script type="text/javascript">
  10. function initbody(){
  11. c.init();
  12. }
  13. companymode = <?=(getconfig('companymode')? 'true' : 'false')?>;
  14. uidid = <?=$da['adminid']?>;
  15. var c = {
  16. maxshow:300,
  17. grouparr:[],
  18. userarr:[],
  19. deptarr:[],
  20. firstpid:0,
  21. init:function(){
  22. this.changevalue = js.request('changevalue');//默认值
  23. this.changerange = js.request('changerange');
  24. var us = js.getoption('userjson');
  25. if(us)this.userarr = js.decode(us);
  26. us = js.getoption('groupjson');
  27. if(us)this.grouparr = js.decode(us);
  28. us = js.getoption('deptjson');
  29. if(us)this.deptarr = js.decode(us);
  30. if(!us || this.changerange!=''){
  31. this.loaddata(true);
  32. }else{
  33. this.firstpid = this.deptarr[0].pid;
  34. this.showlist(this.firstpid,0);
  35. this.initxuan();
  36. }
  37. this.resets();
  38. $(window).resize(this.resets);
  39. $('#keywords').keydown(function(e){
  40. c._searchkeys(e)
  41. });
  42. $('#keywords').keyup(function(e){
  43. c._searchkeys(e)
  44. });
  45. },
  46. resets:function(lx){
  47. var he = winHb()-80;
  48. $('#zxuandiv').css('height',''+he+'px');
  49. $('#xuandiv').css('height',''+he+'px');
  50. $('#showtype').css('height',''+he+'px');
  51. },
  52. loaddata:function(iscs){
  53. var url = js.getajaxurl('deptuserjson','dept','system',{'changerange':this.changerange});
  54. $('#showdiv_0').html('<div align="center" style="margin-top:30px"><img src="images/mloading.gif"></div>')
  55. $.get(url,function(ret){
  56. var d = js.decode(ret);
  57. ret = d.data;
  58. if(c.changerange==''){
  59. js.setoption('deptjson', ret.deptjson);
  60. js.setoption('userjson', ret.userjson);
  61. js.setoption('groupjson', ret.groupjson);
  62. }
  63. c.userarr = js.decode(ret.userjson);
  64. c.deptarr = js.decode(ret.deptjson);
  65. c.grouparr = js.decode(ret.groupjson);
  66. c.firstpid = 0;
  67. if(c.deptarr[0])c.firstpid=c.deptarr[0].pid;
  68. c.showlist(c.firstpid,0);
  69. if(iscs)c.initxuan();
  70. });
  71. },
  72. showlist:function(pid,oi){
  73. var a=this.deptarr,len=a.length,i,s='',ssu='',wjj,s2='',hw=24;
  74. var s1='<div style="width:'+(hw*oi)+'px"></div>';
  75. this.fid = 1;
  76. for(i=0;i<len;i++){
  77. if(a[i].pid==pid){
  78. if(this.fid==1)this.fid = a[i].id;
  79. wjj= 'images/files.png';
  80. if(a[i].ntotal=='0')wjj= 'images/file.png';
  81. s+='<div id="showssd'+a[i].id+'" class="listss">';
  82. s+='<table width="100%"><tr><td height="36">'+s1+'</td><td><img deptxu="'+i+'_'+oi+'" align="absmiddle" height="20" height="20" src="'+wjj+'"></td><td onclick="c.deptstr('+a[i].id+','+i+', \'showssd'+a[i].id+'\')" width="100%">'+a[i].name+'</td></tr></table>';
  83. s+='</div>';
  84. s+='<span show="false" id="showdiv_'+a[i].id+'"></span>';
  85. }
  86. }
  87. var xud = (oi==0)?'0' : pid;
  88. $('#showdiv_'+xud+'').html(s).attr('show','true');
  89. if(oi==0){
  90. this.showlist(this.fid, 1);
  91. this.showgroup();
  92. }
  93. $('#showdiv_0 [deptxu]').unbind('click').click(function(){
  94. c._deptclicks(this);
  95. });
  96. },
  97. showgroup:function(){
  98. var a = this.grouparr,len=a.length,i,s='';
  99. for(i=0;i<len;i++){
  100. s+='<div onclick="c.groupstr('+a[i].id+','+i+', this.id)" id="showssg'+a[i].id+'" class="listsss">';
  101. s+=''+a[i].name+'';
  102. s+='</div>';
  103. }
  104. $('#groupshow').html(s);
  105. },
  106. _deptclicks:function(o){
  107. var sxu = $(o).attr('deptxu').split('_');
  108. var a = this.deptarr[sxu[0]];
  109. var o1 = $('#showdiv_'+a.id+'');
  110. var lx = o1.attr('show');
  111. if(lx=='false'){
  112. this.showlist(a.id, parseFloat(sxu[1])+1);
  113. }else{
  114. o1.toggle();
  115. }
  116. },
  117. initxuan:function(){
  118. var val = this.changevalue;
  119. if(!val)return;
  120. var vals = ','+val+',';
  121. var a = this.deptarr,i,len=a.length,d,s='';
  122. for(i=0;i<len;i++){
  123. d = a[i];
  124. if(vals.indexOf(',d'+d.id+',')>-1){
  125. this.xuan('d',i);
  126. }
  127. }
  128. a = this.userarr;len=a.length;
  129. for(i=0;i<len;i++){
  130. d = a[i];
  131. if(vals.indexOf(',u'+d.id+',')>-1){
  132. this.xuan('u',i);
  133. }
  134. }
  135. a = this.grouparr;len=a.length;
  136. for(i=0;i<len;i++){
  137. d = a[i];
  138. if(vals.indexOf(',g'+d.id+',')>-1){
  139. this.xuan('g',i);
  140. }
  141. }
  142. },
  143. chcangdi:function(ids){
  144. $('#'+ids+'').addClass('tract');
  145. if(this.changeids)$('#'+this.changeids+'').removeClass('tract');
  146. this.changeids = ids;
  147. },
  148. deptstr:function(did,oi, ids){
  149. this.chcangdi(ids);
  150. var d = this.deptarr[oi];
  151. var s = '<div onclick="c.xuan(\'d\','+oi+',this)" class="listsss">['+d.id+'.部门]'+d.name+'</div>';
  152. var a=this.userarr,len=a.length,i,oi=0;
  153. for(i=0;i<len;i++){
  154. if(a[i].deptpath && a[i].deptpath.indexOf('['+did+']')>-1){
  155. oi++;
  156. if(oi>this.maxshow)break;
  157. s+='<div temuoi="'+i+'" onclick="c.xuan(\'u\','+i+',this)" class="listsss"><img src="'+a[i].face+'" height="24" width="24" align="absmiddle"> &nbsp;'+a[i].name+'<span style="font-size:12px;color:#888888">('+a[i].ranking+')</span></div>';
  158. }
  159. }
  160. $('#showtype').html(s);
  161. },
  162. groupstr:function(did,oi,ids){
  163. this.chcangdi(ids);
  164. var d = this.grouparr[oi];
  165. var s = '<div onclick="c.xuan(\'g\','+oi+',this)" class="listsss">['+d.id+'.组]'+d.name+'</div>';
  166. var a=this.userarr,len=a.length,i,oi=0,gids;
  167. for(i=0;i<len;i++){
  168. gids = a[i].groupname;
  169. if(isempt(gids))continue;
  170. gids = ','+gids+',';
  171. if(gids.indexOf(','+did+',')>-1){
  172. oi++;
  173. s+='<div temuoi="'+i+'" onclick="c.xuan(\'u\','+i+',this)" class="listsss"><img src="'+a[i].face+'" height="24" width="24" align="absmiddle"> &nbsp;'+a[i].name+'<span style="font-size:12px;color:#888888">('+a[i].ranking+')</span></div>';
  174. }
  175. }
  176. $('#showtype').html(s);
  177. },
  178. quanx:function(){
  179. $('#showtype div[temuoi]').each(function(){
  180. var o1 = $(this);
  181. c.xuan('u', parseFloat(o1.attr('temuoi')), this);
  182. });
  183. },
  184. xuan:function(lx,oi,o1){
  185. var d = false,s='',id='',s1;
  186. if(lx=='d'){
  187. d = this.deptarr[oi];
  188. id= d.id;
  189. s1='['+d.id+'.部门]';
  190. if(id==1)s1='<span class="label">全员</span>';
  191. s='<div id="d_'+d.id+'" onclick="$(this).remove()" class="listsss">'+s1+'<font>'+d.name+'</font></div>';
  192. if(companymode && id==1 && uidid>1){
  193. s='';
  194. js.msg('msg','多单位模式下不能选择最高的顶级部门');
  195. }
  196. if(this.changerange && id==1){
  197. s='';
  198. js.msg('msg','不能选最顶级部门');
  199. }
  200. }
  201. if(lx=='g'){
  202. d = this.grouparr[oi];
  203. id= d.id;
  204. s1='['+d.id+'.组]';
  205. s='<div id="g_'+d.id+'" onclick="$(this).remove()" class="listsss">'+s1+'<font>'+d.name+'</font></div>';
  206. }
  207. if(lx=='u'){
  208. d = this.userarr[oi];
  209. id= d.id;
  210. s='<div id="u_'+d.id+'" onclick="$(this).remove()" class="listsss"><img src="'+d.face+'" height="24" width="24" align="absmiddle"> &nbsp;<font>'+d.name+'</font><span style="font-size:12px;color:#888888">('+d.ranking+')</span></div>';
  211. }
  212. if(!d)return;
  213. var sid = ''+lx+'_'+id+'';
  214. if(sid!='d_1' && get('d_1')){
  215. js.msg('msg','已经选了最顶级部门,已包含全体人员了');
  216. return;
  217. }
  218. if(get(sid))return;
  219. $('#'+lx+'_'+id+'').remove();
  220. $('#xuandiv').append(s);
  221. },
  222. queding:function(){
  223. var sid='',sna='';
  224. $('#xuandiv').find('div').each(function(){
  225. var id = this.id.replace('_','');
  226. sid+=','+id+'';
  227. sna+=','+$(this).find('font').text();
  228. });
  229. if(sid!=''){
  230. sid = sid.substr(1);
  231. sna = sna.substr(1);
  232. }
  233. var call = js.request('callback');
  234. if(call){
  235. try{parent[call](sna,sid);}catch(e){}
  236. }else{
  237. console.log(sna+'|'+sid);
  238. }
  239. },
  240. cancel:function(){
  241. try{
  242. parent.js.tanclose('changeaction');
  243. }catch(e){}
  244. },
  245. _searchkeys:function(e){
  246. clearTimeout(this._searchkeystime);
  247. this._searchkeystime=setTimeout(function(){
  248. c._searchkey(false);
  249. },500);
  250. },
  251. _searchkey:function(bo){
  252. var key = $('#keywords').val(),a=[],d=[],len,i,oi=0,s='';
  253. a=this.userarr;
  254. if(bo && key=='')return;
  255. len=a.length;
  256. if(key!='')for(i=0;i<len;i++)if(a[i].name.indexOf(key)>-1 || a[i].pingyin.indexOf(key)==0 || a[i].deptname.indexOf(key)>-1 || a[i].ranking.indexOf(key)>-1){
  257. s+='<div onclick="c.xuan(\'u\','+i+',this)" class="listsss"><img src="'+a[i].face+'" height="24" width="24" align="absmiddle"> &nbsp;'+a[i].name+'<span style="font-size:12px;color:#888888">('+a[i].ranking+')</span></div>';
  258. }
  259. if(bo && s=='' && key!='')js.msg('msg','无相关['+key+']的记录', 2);
  260. $('#showtype').html(s);
  261. }
  262. };
  263. </script>
  264. <style>
  265. *{font-size:14px}
  266. .headers{line-height:30px; background-color:#dddddd;color:#1389D3;font-size:14px;height:30px;overflow:hidden}
  267. .lists{line-height:34px; background-color:white;font-size:14px;padding-left:5px;border-bottom:1px #eeeeee solid;color:#888888;height:34px;overflow:hidden}
  268. .active{ background-color:#eeeeee;color:#000000;font-weight:bold}
  269. .listsss{padding:8px; background:white;border-bottom:1px #eeeeee solid;cursor:default;font-size:14px}
  270. .listsss:hover{background-color:#f1f1f1}
  271. .listss{background:white;border-bottom:1px #eeeeee solid;cursor:default;font-size:14px;padding:0px 5px}
  272. .listss:hover{background-color:#f1f1f1}
  273. .listhui{color:#888888}
  274. .listhui img{opacity:0.5}
  275. .changeuserbotton{height:30px;width:50px; background:#d9534f;color:white;font-size:14px;border:none;padding:0px;margin:0px;line-height:20px;cursor:pointer;opacity:1;outline:none;border-radius:5px}
  276. .changeuserbotton:hover{color:white;border:none;opacity:0.8}
  277. .label{font-size:12px;background:#1389D3;color:white;padding:1px 3px;border-radius:5px}
  278. .tract{ background-color:#d6edf9;}
  279. .tract:hover{background-color:#d6edf9;}
  280. </style>
  281. </head>
  282. <body style="padding:0px;margin:0px; overflow:hidden;" scroll="no">
  283. <table height="100%" width="100%">
  284. <tr>
  285. <td valign="top" width="35%" style="border:1px #eeeeee solid">
  286. <div class="headers">&nbsp;选择部门/组</div>
  287. <div style="height:300px;overflow:auto" id="zxuandiv">
  288. <div class="lists active">根据部门选择 v</div>
  289. <div id="showdiv_0"></div>
  290. <div class="lists">根据组选择 v</div>
  291. <div id="groupshow"></div>
  292. </div>
  293. </td>
  294. <td valign="top" width="30%" style="border:1px #eeeeee solid">
  295. <div class="headers">&nbsp;选择人员</div>
  296. <div style="height:300px;overflow:auto" id="showtype"></div>
  297. </td>
  298. <td style="padding:5px;width:10px" valign="center">
  299. <div><input type="button" onclick="c.quanx()" value="全选"></div>
  300. <div style="height:20px"></div>
  301. <div><input type="button" onclick="$('#xuandiv').html('')" value="清空"></div>
  302. </td>
  303. <td valign="top" width="35%" style="border:1px #eeeeee solid">
  304. <div class="headers">&nbsp;√已选择</div>
  305. <div style="height:300px;overflow:auto" id="xuandiv"></div>
  306. </td>
  307. </tr>
  308. <tr>
  309. <td style="background-color:#dddddd" colspan="5">
  310. <table width="100%">
  311. <tr>
  312. <td height="50" width="10" nowrap>&nbsp;</td>
  313. <td width="100%">
  314. <input type="text" id="keywords" style="border:1px #cccccc solid;height:26px;padding:2px;width:180px" placeholder="关键词搜索人员"><input onclick="c._searchkey(true)" type="button" value="搜索" style="background:#888888" class="changeuserbotton">
  315. </td>
  316. <td><input style="width:70px;border:none" type="button" onclick="c.loaddata()" class="changeuserbotton" value="刷新数据" ></td>
  317. <td width="20" nowrap>&nbsp;</td>
  318. <td><input class="changeuserbotton" type="button" onclick="c.cancel()" value="取消" ></td>
  319. <td width="20" nowrap>&nbsp;</td>
  320. <td height="50"><input style="background:#1389D3;" onclick="c.queding()" type="button" value="确定" class="changeuserbotton"></td>
  321. <td width="10" nowrap>&nbsp;</td>
  322. </tr>
  323. </table>
  324. </td>
  325. </tr>
  326. </table>
  327. </body>
  328. </html>