menuList.js 9.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290
  1. <%@ page contentType="text/html;charset=UTF-8" %>
  2. <script type="text/javascript">
  3. var $treeTable=null;
  4. $(document).ready(function(){
  5. $treeTable=$('#treeTable').treeTable({
  6. theme:'vsStyle',
  7. expandLevel : 1,
  8. column:0,
  9. checkbox: false,
  10. url:'${ctx}/sys/menu/getChildren?parentId=',
  11. callback:function(item) {
  12. item.isShow = (item.isShow == '1'?true:false);
  13. if(item.href&&item.href.length>4){
  14. item.hideFullName = item.href.substring(0,4)+"...";
  15. }else if(item.href == undefined){
  16. item.hideFullName = "";
  17. }else{
  18. item.hideFullName = item.href;
  19. }
  20. if(item.permission&&item.permission.length>4){
  21. item.hidePermission = item.permission.substring(0,4)+"...";
  22. }else if(item.permission == undefined){
  23. item.hidePermission = "";
  24. }else{
  25. item.hidePermission = item.permission;
  26. }
  27. var menuItemTpl= $("#menuItemTpl").html();
  28. var result = laytpl(menuItemTpl).render(item);
  29. return result;
  30. },
  31. beforeClick: function($treeTable, id) {
  32. //异步获取数据 这里模拟替换处理
  33. $treeTable.refreshPoint(id);
  34. },
  35. beforeExpand : function($treeTable, id) {
  36. },
  37. beforeClose : function($treeTable, id) {
  38. }
  39. });
  40. });
  41. function sort(id,isUpSort){
  42. var $ctr=$("tr[id='"+id+"']",$treeTable);
  43. var $trs=null;
  44. if($ctr.attr("pId")!=null)
  45. $trs=$("tr[pId='"+$ctr.attr("pId")+"']",$treeTable);
  46. else
  47. $trs=$("tr[depth='1']",$treeTable);
  48. if($trs.size()>1) {
  49. //递归深度
  50. if(isUpSort) {
  51. if($trs[0].id==$ctr[0].id){
  52. jp.error('已经置顶了!');
  53. return;
  54. }
  55. var i=0;
  56. $trs.each(function(k){
  57. if(this.id==$ctr[0].id) i=k;
  58. });
  59. var $ptr=$($trs[i-1]);
  60. //封装
  61. var indexB=0,indexE=0,depth=parseInt($ctr.attr("depth"),10);
  62. var $alltrs=$("tr",$treeTable);
  63. for(var k=0;k<$alltrs.size();k++)
  64. {
  65. if($alltrs[k].id==$ctr[0].id) {
  66. indexB=k;
  67. } else if(indexB>0&&parseInt($($alltrs[k]).attr("depth"),10)>depth) {
  68. indexE=k;
  69. } else if(indexB>0&&parseInt($($alltrs[k]).attr("depth"),10)<=depth) {
  70. break;
  71. }
  72. }
  73. var selector="tr:eq("+indexB+")";
  74. indexB++;
  75. while(indexB<=indexE) {
  76. selector+=",tr:eq("+indexB+")";
  77. indexB++;
  78. }
  79. var moveNode = $(selector,$treeTable);
  80. var targetNode = $ptr;
  81. var id1 = moveNode.attr("id");
  82. var sort1 = parseInt(moveNode.attr("sort"));//交换排序值
  83. var id2 = targetNode.attr("id");
  84. var sort2 = parseInt(targetNode.attr("sort"));
  85. if(sort1 > sort2){
  86. var c = sort1;
  87. sort1 = sort2;
  88. sort2 = c;
  89. }else if(sort1 == sort2){
  90. if(sort1 > 0){
  91. sort1 = sort1 -1;//向上移动,相等减1
  92. }else{
  93. sort2 = sort2 + 1;
  94. }
  95. }
  96. //交换
  97. $.get("${ctx}/sys/menu/sort?id1="+id1+"&sort1="+sort1+"&id2="+id2+"&sort2="+sort2, function(data){
  98. if(data.success){
  99. moveNode.attr("sort", sort1);
  100. targetNode.attr("sort", sort2);
  101. moveNode.insertBefore(targetNode);
  102. jp.success(data.msg);
  103. }else{
  104. jp.error(data.msg);
  105. }
  106. })
  107. }else {
  108. if($trs[$trs.size()-1].id==$ctr[0].id){
  109. jp.error('已经末端了!');
  110. return;
  111. }
  112. var i=0;
  113. $trs.each(function(k){
  114. if(this.id==$ctr[0].id) i=k;
  115. });
  116. var $ntr=$($trs[i+1]);
  117. //封装
  118. var indexB=0,indexE=0,depth=parseInt($ntr.attr("depth"),10);
  119. var $alltrs=$("tr",$treeTable);
  120. for(var k=0;k<$alltrs.size();k++)
  121. {
  122. if($alltrs[k].id==$ntr[0].id) {
  123. indexB=k;
  124. } else if(indexB>0&&parseInt($($alltrs[k]).attr("depth"),10)>depth) {
  125. indexE=k;
  126. } else if(indexB>0&&parseInt($($alltrs[k]).attr("depth"),10)<=depth) {
  127. break;
  128. }
  129. }
  130. var selector="tr:eq("+indexB+")";
  131. indexB++;
  132. while(indexB<=indexE) {
  133. selector+=",tr:eq("+indexB+")";
  134. indexB++;
  135. }
  136. var moveNode = $(selector,$treeTable);
  137. var targetNode = $ctr;
  138. var id1 = moveNode.attr("id");
  139. var sort1 = parseInt(targetNode.attr("sort"));//交换排序值
  140. var id2 = targetNode.attr("id");
  141. var sort2 = parseInt(moveNode.attr("sort"));
  142. if(sort1 > sort2){
  143. var c = sort1;
  144. sort1 = sort2;
  145. sort2 = c;
  146. }else if(sort1 == sort2){
  147. sort2 = sort2 +1;//向下移动,相等加1
  148. }
  149. //交换
  150. $.get("${ctx}/sys/menu/sort?id1="+id1+"&sort1="+sort1+"&id2="+id2+"&sort2="+sort2, function(data){
  151. if(data.success){
  152. moveNode.attr("sort", sort1);
  153. targetNode.attr("sort", sort2);
  154. moveNode.insertBefore(targetNode);
  155. jp.success(data.msg)
  156. }else{
  157. jp.error(data.msg);
  158. }
  159. })
  160. }
  161. }
  162. }
  163. function del(con,id){
  164. jp.confirm('确认要删除菜单吗?', function(){
  165. jp.loading();
  166. $.get("${ctx}/sys/menu/delete?id="+id, function(data){
  167. if(data.success){
  168. $treeTable.del(id);
  169. jp.success(data.msg);
  170. }else{
  171. jp.error(data.msg);
  172. }
  173. })
  174. });
  175. }
  176. function refreshMenu(){
  177. var index = jp.loading();
  178. $treeTable.refresh();
  179. jp.close(index);
  180. }
  181. function refreshNode(data) {//刷新节点
  182. var current_id = data.body.menu.id;
  183. var target = $treeTable.get(current_id);
  184. var old_parent_id = target.attr("pid") == undefined?'1':target.attr("pid");
  185. var current_parent_id = data.body.menu.parentId;
  186. var current_parent_ids = data.body.menu.parentIds;
  187. if(old_parent_id == current_parent_id){
  188. if(current_parent_id == '1'){
  189. $treeTable.refreshPoint(-1);
  190. }else{
  191. $treeTable.refreshPoint(current_parent_id);
  192. }
  193. }else{
  194. $treeTable.del(current_id);//刷新删除旧节点
  195. $treeTable.initParents(current_parent_ids, "1");
  196. }
  197. }
  198. function setDataRule(id, name) {
  199. $("#left").attr("class", "col-sm-6");
  200. setTimeout(function(){
  201. $("#right").fadeIn(500);
  202. },500)
  203. $("#menuLabel").html(name);
  204. $("#menuId").val(id);
  205. $('#dataRuleTable').bootstrapTable("refresh",{query:{menuId:id}})
  206. }
  207. </script>
  208. <script type="text/html" id="menuItemTpl">
  209. <td> <a href="#" onclick="jp.openViewDialog('查看菜单', '${ctx}/sys/menu/form?id={{d.id}}','800px', '510px')"> <i class="{{d.icon}}"></i> {{d.name}}</a></td>
  210. <td>
  211. <a href="javascript:;" onclick="sort('{{d.id}}',true);"><i class="fa fa-long-arrow-up"></i></a>
  212. <a href="javascript:;" onclick="sort('{{d.id}}',false);"><i class="fa fa-long-arrow-down"></i></a>
  213. </td>
  214. <td>
  215. {{# if(d.isShow){ }}<i class="fa fa-circle text-success ml5"></i>{{# }else{ }}
  216. <i class="fa fa-circle text-muted ml5"></i>{{# } }}
  217. </td>
  218. <td title="{{d.permission}}">
  219. {{d.hidePermission}}
  220. </td>
  221. <td>
  222. <div class="btn-group">
  223. <button type="button" class="btn btn-primary btn-xs dropdown-toggle" data-toggle="dropdown">
  224. <i class="fa fa-cog"></i>
  225. <span class="fa fa-chevron-down"></span>
  226. </button>
  227. <ul class="dropdown-menu" role="menu">
  228. <shiro:hasPermission name="sys:menu:view">
  229. <li><a href="#" onclick="jp.openViewDialog('查看菜单', '${ctx}/sys/menu/form?id={{d.id}}','800px', '510px')"><i class="fa fa-search-plus"></i> 查看</a></li>
  230. </shiro:hasPermission>
  231. <shiro:hasPermission name="sys:menu:edit">
  232. <li><a href="#" onclick="jp.openSaveDialog('修改菜单', '${ctx}/sys/menu/form?id={{d.id}}','800px', '510px')"><i class="fa fa-edit"></i> 修改</a></li>
  233. </shiro:hasPermission>
  234. <shiro:hasPermission name="sys:menu:del">
  235. <li><a onclick="return del(this, '{{d.id}}')"><i class="fa fa-trash"></i> 删除</a></li>
  236. </shiro:hasPermission>
  237. <shiro:hasPermission name="sys:menu:add">
  238. <li><a href="#" onclick="jp.openSaveDialog('添加下级菜单', '${ctx}/sys/menu/form?parent.id={{d.id}}','800px', '510px')"><i class="fa fa-plus"></i> 添加下级菜单</a></li>
  239. </shiro:hasPermission>
  240. </ul>
  241. </div>
  242. <shiro:hasPermission name="sys:role:datarule">
  243. <button type="button" onclick="setDataRule('{{d.id}}','{{d.name}}')" class="btn btn-primary btn-xs">
  244. <i class="fa fa-database"> 数据规则</i>
  245. </button>
  246. </shiro:hasPermission>
  247. </td>
  248. </script>