index.html 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232
  1. <extend name="Public:base" />
  2. <block name="javascript">
  3. <script src="__PUBLIC__/ztree/jquery.ztree.all-3.5.min.js"></script>
  4. <link rel="stylesheet" type="text/css" href="__PUBLIC__/ztree/zTreeStyle.css" />
  5. <link rel="stylesheet" type="text/css" href="__PUBLIC__/ztree/demo.css" />
  6. <script>
  7. $(function(){
  8. $('.J_SubmitPL').click(function(e){
  9. //$('#alert').css({'display':'none'});
  10. $("#dialog").css('display','none');
  11. $('.ks-ext-mask').css('display','none');
  12. var zTree = $.fn.zTree.getZTreeObj("menu_tree"),
  13. nodes = zTree.getSelectedNodes(),
  14. treeNode = nodes[0];
  15. if(treeNode!=undefined){
  16. var isp= nodes[0].isParent;
  17. }else{
  18. var isp= true;
  19. }
  20. var id=(treeNode==undefined?0:treeNode.id);
  21. var url;
  22. if($("input[name='action']").val()=='add'){
  23. url='{:U("BlogCategory/add")}';
  24. }else if($("input[name='action']").val()=='edit'){
  25. url='{:U("BlogCategory/edit")}';
  26. }
  27. $.post(
  28. url,
  29. {
  30. 'id':id,
  31. 'title':$("input[name='title']").val(),
  32. 'sort_order':$("input[name='sort_order']").val(),
  33. },
  34. function(d){
  35. if($("input[name='action']").val()=='add'){
  36. //有父节点
  37. if(treeNode){
  38. treeNode = zTree.addNodes(treeNode, {id:d.id, pId:id, isParent:isp, name:d.name});
  39. }else{
  40. treeNode = zTree.addNodes(treeNode, {id:d.id, pId:0, isParent:isp, name:d.name});
  41. }
  42. }else{
  43. if(d.success){
  44. nodes[0].name = d.name;
  45. zTree.updateNode(nodes[0]);
  46. }
  47. if(d.err){
  48. alert(d.err);
  49. }
  50. }
  51. }
  52. );
  53. });
  54. });
  55. </script>
  56. <script>
  57. var setting = {
  58. view: {
  59. addHoverDom: false,
  60. removeHoverDom: false,
  61. selectedMulti: false
  62. },
  63. edit: {
  64. enable: true,
  65. editNameSelectAll: true,
  66. showRemoveBtn: false,
  67. showRenameBtn: false
  68. },
  69. data: {
  70. simpleData: {
  71. enable: true
  72. }
  73. }
  74. };
  75. var zNodes ={$list};
  76. function add(e) {
  77. $("input[name='action']").val('add');
  78. $('.title').find('span').text('新增菜单');
  79. $("#dialog").css({'position' : 'fixed','display' : 'block', 'z-index' : '9999'});
  80. }
  81. function edit() {
  82. $("input[name='action']").val('edit');
  83. var zTree = $.fn.zTree.getZTreeObj("menu_tree"),
  84. nodes = zTree.getSelectedNodes(),
  85. treeNode = nodes[0];
  86. if (nodes.length == 0) {
  87. alert("请先选择一个节点");
  88. return;
  89. }else{
  90. var id=treeNode.id;
  91. $.post(
  92. '{:U("BlogCategory/get_info")}',
  93. {
  94. 'id':id,
  95. },
  96. function(d){
  97. $("input[name='title']").val(d.title);
  98. $("input[name='sort_order']").val(d.sort_order);
  99. }
  100. );
  101. $('.title').find('span').text('编辑菜单');
  102. $("#dialog").css({'position' : 'fixed','display' : 'block', 'z-index' : '9999'});
  103. }
  104. }
  105. function remove(e) {
  106. if(!confirm('确认要删除吗!!')){
  107. return false;
  108. }
  109. var zTree = $.fn.zTree.getZTreeObj("menu_tree"),
  110. nodes = zTree.getSelectedNodes(),
  111. treeNode = nodes[0];
  112. if (nodes.length == 0) {
  113. alert("请先选择一个节点");
  114. return;
  115. }
  116. $.post(
  117. '{:U("BlogCategory/del")}',
  118. {
  119. 'id':treeNode.id,
  120. },
  121. function(d){
  122. if(d.err){
  123. alert(d.err);
  124. }else{
  125. zTree.removeNode(treeNode);
  126. }
  127. }
  128. );
  129. }
  130. $(document).ready(function(){
  131. $.fn.zTree.init($("#menu_tree"), setting, zNodes);
  132. $("#addParent").bind("click", {isParent:true}, add);
  133. $("#edit").bind("click", edit);
  134. $("#remove").bind("click", remove);
  135. //关闭弹出层
  136. $('#dialog').on('click','.ks-ext-close',function(){
  137. $("#dialog").css('display','none');
  138. $('.ks-ext-mask').css('display','none');
  139. return false;
  140. });
  141. //关闭弹出层
  142. $('#dialog').on('click','.J_Cancel',function(){
  143. $("#dialog").css('display','none');
  144. $('.ks-ext-mask').css('display','none');
  145. return false;
  146. });
  147. });
  148. </script>
  149. </block>
  150. <block name="content">
  151. <link rel="stylesheet" href="__CSS__/dialog.css" />
  152. <div class="ks-ext-mask" style="position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 999; display:none"></div>
  153. <div id="dialog" class="dialog" style="z-index: 9999; display:none">
  154. <div class="ks-contentbox">
  155. <div class="title"><span>新增菜单</span><a class="ks-ext-close" href="javascript:void(0)">X</a></div>
  156. <input type="hidden" name="action" value="" />
  157. <dl>
  158. <dt>菜单名称</dt>
  159. <dd><input type="text" name="title" class="text" /></dd>
  160. <dt>排序</dt>
  161. <dd>
  162. <input name="sort_order" type="text" value="" />
  163. </dd>
  164. </dl>
  165. <div class="J_DefaultMessage"></div>
  166. <div class="bottom">
  167. <a href="javascript:void(0);" class="J_SubmitPL ncsc-btn ncsc-btn-green">确认</a>
  168. <a href="javascript:void(0);" class="J_Cancel ncsc-btn">取消</a> </div>
  169. </div>
  170. </div>
  171. <div class="page-header">
  172. <a id="addParent" class="btn btn-primary">新增</a>
  173. <a id="edit" class="btn btn-primary">编辑</a>
  174. <a id="remove" class="btn btn-primary">删除</a>
  175. </div>
  176. <div class="row">
  177. <div id="menu_tree" class="ztree"></div>
  178. </div>
  179. </block>