index.html 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>TODO supply a title</title>
  5. {include file="../application/manage/view/commons/headers.html" }
  6. <link href="/static/js/ztree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
  7. <script src="/static/js/ztree/js/jquery.ztree.all.min.js" type="text/javascript" ></script>
  8. <style type="text/css">
  9. .ztree li span.button.add {margin-left:2px; margin-right: -1px; background-position:-144px 0; vertical-align:top; *vertical-align:middle}
  10. </style>
  11. <script type="text/javascript">
  12. var curMenu = null, zTree_Menu = null;
  13. var setting = {
  14. view: {
  15. addHoverDom: addHoverDom,removeHoverDom: removeHoverDom,
  16. showLine: true, selectedMulti: false, dblClickExpand: false
  17. },
  18. data: { simpleData: { enable: true } },
  19. callback: {
  20. onNodeCreated: onNodeCreated,
  21. beforeClick: beforeClick,
  22. beforeEditName: beforeEditName,
  23. beforeRemove:beforeRemove
  24. },
  25. edit: {
  26. enable: true,
  27. editNameSelectAll: true,
  28. showRemoveBtn: true,
  29. showRenameBtn: true
  30. },
  31. async: {
  32. enable: true,
  33. url:"/manage/sysmenu/menudata",
  34. autoParam:["id", "pId=pid", "name=n", "level=lv"],
  35. otherParam:{"otherParam":"zTreeAsyncTest"},
  36. dataFilter: filter
  37. }
  38. };
  39. function filter(treeId, parentNode, childNodes) {
  40. if (!childNodes) return null;
  41. for (var i=0, l=childNodes.length; i<l; i++) {
  42. childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');
  43. }
  44. return childNodes;
  45. };
  46. function beforeRemove(treeId, treeNode){
  47. if(confirm("确定删除节点("+treeNode.name+")?")){
  48. $.ajax({
  49. url:"/manage/sysmenu/delete",
  50. data:"id="+treeNode.id+"&t="+new Date(),
  51. success:function(rs){
  52. if(rs=="delete_ok"){
  53. document.location.reload();
  54. }else{
  55. alert("操作失败!");
  56. }
  57. }
  58. });
  59. }
  60. return false;
  61. }
  62. function onNodeCreated(){
  63. zTree_Menu = $.fn.zTree.getZTreeObj("menutree");
  64. curMenu = zTree_Menu.getNodes()[0].children[0].children[0];
  65. zTree_Menu.selectNode(curMenu);
  66. var a = $("#" + zTree_Menu.getNodes()[0].tId + "_a");
  67. a.addClass("cur");
  68. }
  69. function beforeEditName(treeId, treeNode) {
  70. var zTree = $.fn.zTree.getZTreeObj("menutree");
  71. zTree.selectNode(treeNode);
  72. $("#myform").find("input[name='id']").val(treeNode.id);
  73. $("#myform").find("input[name='pid']").val(treeNode.pId);
  74. $("#myform").find("input[name='name']").val(treeNode.name);
  75. $("#myform").find("input[name='url']").val(treeNode.url);
  76. $("#myform").find("input[name='ordernum']").val(treeNode.ordernum);
  77. editWin.window("open");
  78. return false;
  79. }
  80. var newCount = 1;
  81. function addHoverDom(treeId, treeNode) {
  82. var sObj = $("#" + treeNode.tId + "_span");
  83. if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
  84. var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
  85. + "' title='add node' onfocus='this.blur();'></span>";
  86. sObj.after(addStr);
  87. var btn = $("#addBtn_"+treeNode.tId);
  88. if (btn) btn.bind("click", function(){
  89. //var zTree = $.fn.zTree.getZTreeObj("menutree");
  90. //zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
  91. showAddChildMenuView(treeNode.id);
  92. return false;
  93. });
  94. };
  95. // 显示添加窗口
  96. function showAddChildMenuView(pid){
  97. editWin.window("open");
  98. $("#myform").find("input[name='pid']").val(pid);
  99. $("#myform").find("input[name='id']").val("");
  100. $("#myform").find("input[name='name']").val("");
  101. $("#myform").find("input[name='url']").val("");
  102. $("#myform").find("input[name='ordernum']").val("");
  103. }
  104. // 保存菜单
  105. function save(){
  106. var data=$("#myform").serialize();
  107. $.ajax({
  108. url:"/manage/sysmenu/update",
  109. contentType: "application/x-www-form-urlencoded; charset=utf-8",
  110. data:data+"&t="+new Date(),
  111. success:function(rs){
  112. if(rs=="insert_ok"){
  113. document.location.reload();
  114. }else if(rs=="update_ok"){
  115. document.location.reload();
  116. }else{
  117. alert("操作失败!");
  118. }
  119. },error:function(e,e1,e2){
  120. alert(e2);
  121. }
  122. });
  123. }
  124. function removeHoverDom(treeId, treeNode) {
  125. $("#addBtn_"+treeNode.tId).unbind().remove();
  126. };
  127. function beforeClick(treeId, node) {
  128. if (node.isParent) {
  129. if (node.level === 0) {
  130. var pNode = curMenu;
  131. while (pNode && pNode.level !==0) {
  132. pNode = pNode.getParentNode();
  133. }
  134. if (pNode !== node) {
  135. var a = $("#" + pNode.tId + "_a");
  136. a.removeClass("cur");
  137. zTree_Menu.expandNode(pNode, false);
  138. }
  139. a = $("#" + node.tId + "_a");
  140. a.addClass("cur");
  141. var isOpen = false;
  142. for (var i=0,l=node.children.length; i<l; i++) {
  143. if(node.children[i].open) {
  144. isOpen = true;
  145. break;
  146. }
  147. }
  148. if (isOpen) {
  149. zTree_Menu.expandNode(node, true);
  150. curMenu = node;
  151. } else {
  152. zTree_Menu.expandNode(node.children[0].isParent?node.children[0]:node, true);
  153. curMenu = node.children[0];
  154. }
  155. } else {
  156. zTree_Menu.expandNode(node);
  157. }
  158. }
  159. return !node.isParent;
  160. }
  161. // 菜单编辑框
  162. var editWin;
  163. function initEditWin(){
  164. editWin=$("#editWin").dialog({
  165. modal: true,
  166. title: "菜单信息编辑",
  167. closed: true,
  168. iconCls: 'icon-edit',
  169. width:500, height:350,
  170. left:"25%",top:50,
  171. modal: true, cache: false,resizable:true,draggable:true,
  172. collapsible:false
  173. });
  174. editWin.window("close");
  175. }
  176. $(document).ready(function(){
  177. $.fn.zTree.init($("#menutree"), setting);
  178. initEditWin();
  179. });
  180. function showWin(){
  181. editWin.window("open");
  182. }
  183. </script>
  184. </head>
  185. <body>
  186. <div id="menu" data-options="region:'west',iconCls:'icon-forward',split:true,border:false" title="功能导航" style="height:100%;width: 100%; overflow: auto;" >
  187. <ul id="menutree" class="ztree" style="height:100%;width: 100%;padding: 0px; margin: 0px;"></ul>
  188. </div>
  189. <div id="editWin" buttons="#dlg-buttons" auth_id="AUTH_001" auth_name="编码框" >
  190. <form id="myform" action="" method="post" >
  191. <input name="id" type="hidden" />
  192. <table id="editGrid" fitColumns="false" style="fitColumns:false" >
  193. <thead>
  194. <tr>
  195. <th height="32" width="20%" data-options="field:'code'">名称</th>
  196. <th width="80%" data-options="field:'name'">值</th>
  197. </tr>
  198. </thead>
  199. <tbody>
  200. <tr>
  201. <td height="32" align="right" >上级菜单:</td>
  202. <td><input name="pid" type="text" size="35" /></td>
  203. </tr>
  204. <tr>
  205. <td height="32" align="right" >菜单名称:</td>
  206. <td><input name="name" type="text" size="35" /></td>
  207. </tr>
  208. <tr>
  209. <td height="32" align="right" >打开网址:</td>
  210. <td><input name="url" type="text" size="35" /></td>
  211. </tr>
  212. <tr>
  213. <td height="32" align="right" >排序号码:</td>
  214. <td><input name="ordernum" type="text" size="15" /></td>
  215. </tr>
  216. </tbody>
  217. </table>
  218. </form>
  219. <div id="dlg-buttons">
  220. <table cellpadding="0" cellspacing="0" style="width:100%">
  221. <tr>
  222. <td>
  223. <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-save',plain:true" onclick="save()" >保存</a>
  224. <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-cancel',plain:true" onclick="editWin.window('close')" >关闭</a>
  225. </td>
  226. </tr>
  227. </table>
  228. </div>
  229. </div>
  230. </body>
  231. </html>