$(function () { $("#jqGrid").jqGrid({ url: restServerBaseURL + 'sys/user/list', datatype: "json", colModel: [ { label: '用户id', name: 'id', index: 'id', key: true, hidden: true }, { label: '用户名', name: 'username', index: 'username', width: 75 }, { label: '别名', name: 'nickname', index: 'nickname', width: 75 }, { label: '所属部门', name: 'deptName', index: 'dept_id', width: 75 }, { label: '邮箱', name: 'email', index: 'email', width: 90 }, { label: '手机号码', name: 'mobile', index: 'mobile', width: 100 }, { label: '状态', name: 'status', index: 'status', width: 80, formatter: function(value, options, row){ return value === 0 ? '禁用' : '正常'; }}, { label: '创建时间', name: 'createTime', index: "create_time", width: 80} ], viewrecords: true, height: "100%", rowNum: 10, rowList : [10,30,50], rownumbers: true, rownumWidth: 25, autowidth:true, multiselect: true, pager: "#jqGridPager", jsonReader : { root: "page.list", page: "page.currPage", total: "page.totalPage", records: "page.totalCount" }, prmNames : { page:"page", rows:"limit", order: "order" }, gridComplete:function(){ //隐藏grid底部滚动条 $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); } }); }); var setting = { data: { simpleData: { enable: true, idKey: "id", pIdKey: "parentId", rootPId: -1 }, key: { url:"nourl" } } }; var ztree; var vm = new Vue({ el:'#rapp', data:{ q:{ keyword: null }, showList: true, title:null, roleList:{}, user:{ status:1, deptId:null, deptName:null, roleIdList:[] } }, methods: { query: function () { vm.reload(); }, add: function(){ vm.showList = false; vm.title = "新增"; vm.roleList = {}; vm.user = {deptName:null, deptId:null, status:1, roleIdList:[]}; //获取角色信息 this.getRoleList(); vm.getDept(); }, getDept: function(){ //加载部门树 $.get(restServerBaseURL + "sys/dept/list", function(r){ ztree = $.fn.zTree.init($("#deptTree"), setting, r); var node = ztree.getNodeByParam("id", vm.user.deptId); if(node != null){ ztree.selectNode(node); vm.user.deptName = node.name; } }); }, update: function () { var userId = getSelectedRow(); if(userId == null){ return ; } vm.showList = false; vm.title = "修改"; vm.getUser(userId); //获取角色信息 this.getRoleList(); }, del: function () { var userIds = getSelectedRows(); if(userIds == null){ return ; } confirm('确定要删除选中的记录?', function(){ $.ajax({ type: "POST", url: restServerBaseURL + "sys/user/delete", contentType: "application/json", data: JSON.stringify(userIds), success: function(r){ if(r.code == 0){ alert('操作成功', function(){ vm.reload(); }); }else{ alert(r.msg); } } }); }); }, saveOrUpdate: function () { var url = vm.user.id == null ? "sys/user/save" : "sys/user/update"; $.ajax({ type: "POST", url: restServerBaseURL + url, contentType: "application/json", data: JSON.stringify(vm.user), success: function(r){ if(r.code === 0){ alert('操作成功', function(){ vm.reload(); }); }else{ alert(r.msg); } } }); }, getUser: function(userId){ $.get(restServerBaseURL + "sys/user/info/"+userId, function(r){ vm.user = r.user; vm.user.password = null; vm.getDept(); }); }, getRoleList: function(){ $.get(restServerBaseURL + "sys/role/select", function(r){ vm.roleList = r.list; }); }, deptTree: function(){ openLayerOfBtn("300px", "450px", "选择部门", "deptLayer", vm.deptTreeCallback); }, deptTreeCallback: function () { var node = ztree.getSelectedNodes(); //选择上级部门 vm.user.deptId = node[0].id; vm.user.deptName = node[0].name; }, reload: function () { vm.showList = true; var page = $("#jqGrid").jqGrid('getGridParam','page'); $("#jqGrid").jqGrid('setGridParam',{ postData:{'keyword': vm.q.keyword}, page:page }).trigger("reloadGrid"); }, refresh: function () { vm.showList = true; window.location.reload(); } } });