var setting = { data: { simpleData: { enable: true, idKey: "id", pIdKey: "parentId", rootPId: -1 }, key: { url:"nourl" } } }; var ztree; var vm = new Vue({ el:'#rapp', data:{ showList: true, title: null, menu:{ parentName:null, parentId:0, type:1, orderNum:0 } }, methods: { getMenu: function(){ //加载菜单树 $.get(restServerBaseURL + "sys/menu/select", function(r){ ztree = $.fn.zTree.init($("#menuTree"), setting, r.menuList); var node = ztree.getNodeByParam("id", vm.menu.parentId); ztree.selectNode(node); vm.menu.parentName = node.name; }) }, add: function(){ vm.showList = false; vm.title = "新增"; vm.menu = {parentName:null,parentId:0,type:1,orderNum:0}; vm.getMenu(); }, update: function () { var menuId = getMenuId(); if(menuId == null){ return ; } $.get(restServerBaseURL + "sys/menu/info/"+menuId, function(r){ vm.showList = false; vm.title = "修改"; vm.menu = r.menu; vm.getMenu(); }); }, del: function () { var menuId = getMenuId(); if(menuId == null){ return ; } confirm('确定要删除选中的记录?', function(){ $.ajax({ type: "POST", url: restServerBaseURL + "sys/menu/delete", data: "menuId=" + menuId, success: function(r){ if(r.code === 0){ alert('操作成功', function(){ vm.reload(); }); }else{ alert(r.msg); } } }); }); }, saveOrUpdate: function () { var url = vm.menu.id == null ? "sys/menu/save" : "sys/menu/update"; $.ajax({ type: "POST", url: restServerBaseURL + url, contentType: "application/json", data: JSON.stringify(vm.menu), success: function(r){ if(r.code === 0){ alert('操作成功', function(){ vm.reload(); }); }else{ alert(r.msg); } } }); }, menuTree: function(){ openLayerOfBtn("300px", "450px", "选择菜单", "menuLayer", vm.menuTreeCallback); }, menuTreeCallback: function () { var node = ztree.getSelectedNodes(); //选择上级菜单 vm.menu.parentId = node[0].id; vm.menu.parentName = node[0].name; }, reload: function () { vm.showList = true; Menu.table.refresh(); }, refresh: function () { vm.showList = true; window.location.reload(); } } }); var Menu = { id: "menuTable", table: null, layerIndex: -1 }; /** * 初始化表格的列 */ Menu.initColumn = function () { var columns = [ {field: 'selectItem', radio: true}, /*{title: '菜单id', field: 'id', visible: false, align: 'center', valign: 'middle', width: '80px'},*/ {title: '菜单名称', field: 'name', align: 'center', valign: 'middle', sortable: true, width: '160px'}, {title: '上级菜单', field: 'parentName', align: 'center', valign: 'middle', sortable: true, width: '160px'}, {title: '图标', field: 'icon', align: 'center', valign: 'middle', sortable: true, width: '60px', formatter: function(item, index){ return item.icon == null ? '' : ''; }}, {title: '类型', field: 'type', align: 'center', valign: 'middle', sortable: true, width: '60px', formatter: function(item, index){ if(item.type === 0){ return '目录'; } if(item.type === 1){ return '菜单'; } if(item.type === 2){ return '按钮'; } }}, {title: '排序号', field: 'orderNum', align: 'center', valign: 'middle', sortable: true, width: '60px'}, {title: '菜单URL', field: 'url', align: 'center', valign: 'middle', sortable: true, width: '160px'}, {title: '授权标识', field: 'perms', align: 'center', valign: 'middle', sortable: true, width: '160px'}] return columns; }; function getMenuId () { var selected = $('#menuTable').bootstrapTreeTable('getSelections'); if (selected.length == 0) { alert("请选择一条记录"); return; } else { return selected[0].id; } } $(function () { var colunms = Menu.initColumn(); var table = new TreeTable(Menu.id, restServerBaseURL + "sys/menu/list", colunms); table.setExpandColumn(2); table.setIdField("id"); table.setCodeField("id"); table.setParentCodeField("parentId"); table.setExpandAll(false); table.init(); Menu.table = table; });