【organization】树控件替换

pull/65/head
chenjinlong 4 years ago
parent 057f88699c
commit 2f38eea750

@ -1,40 +1,22 @@
layui.use(['table', 'form', 'func', 'HttpRequest', 'tree', 'util'], function () {
var $ = layui.$;
var table = layui.table;
layui.use(['layer', 'form', 'table', 'ztree', 'laydate', 'admin', 'HttpRequest', 'func', 'tree', 'util'], function () {
var form = layui.form;
var func = layui.func;
var table = layui.table;
var HttpRequest = layui.HttpRequest;
var xmSelect = layui.xmSelect;
var func = layui.func;
var tree = layui.tree;
// 职位表管理
/**
* 系统管理--用户管理
*/
var Organization = {
tableId: "organizationTable"
tableId: "userTable", //表格id
condition: {
orgName: "",
orgParentId: "",
orgCode: ""
}
};
/* 渲染树形 */
function renderTree() {
$.get(Feng.ctxPath + '/hrOrganization/treeLayui', function (data) {
tree.render({
elem: '#organizationTree',
onlyIconControl: true,
data: data.data,
click: function (rest) {
$('#organizationTree').find('.ew-tree-click').removeClass('ew-tree-click');
$(rest.elem).children('.layui-tree-entry').addClass('ew-tree-click');
table.reload(Organization.tableId, {
where: {organizationId: rest.data.id},
page: {curr: 1}
});
}
});
$('#organizationTree').find('.layui-tree-entry:first>.layui-tree-main>.layui-tree-txt').trigger('click');
});
}
renderTree();
// 初始化表格的列
Organization.initColumn = function () {
return [[
@ -49,13 +31,22 @@ layui.use(['table', 'form', 'func', 'HttpRequest', 'tree', 'util'], function ()
]];
};
// 选择部门时
Organization.onClickDept = function (obj) {
console.log(obj);
Organization.condition.orgParentId = obj.data.id;
Organization.search();
};
// 点击查询按钮
Organization.search = function () {
var queryData = {};
queryData['orgParentId'] = Organization.condition.orgParentId;
queryData['orgName'] = $("#orgName").val();
queryData['orgCode'] = $("#orgCode").val();
table.reload(Organization.tableId, {
where: queryData,
page: {curr: 1}
where: queryData, page: {curr: 1}
});
};
@ -122,13 +113,23 @@ layui.use(['table', 'form', 'func', 'HttpRequest', 'tree', 'util'], function ()
elem: '#' + Organization.tableId,
url: Feng.ctxPath + '/hrOrganization/page',
page: true,
request: {pageName: 'pageNo', limitName: 'pageSize'}, //自定义分页参数
height: "full-158",
height: "full-98",
cellMinWidth: 100,
cols: Organization.initColumn(),
parseData: Feng.parseData
});
// 初始化部门树
var request = new HttpRequest(Feng.ctxPath + '/hrOrganization/treeLayui', 'get', function (data) {
tree.render({
elem: '#deptTree',
data: data.data,
click: Organization.onClickDept,
onlyIconControl: true
});
});
request.start();
// 搜索按钮点击事件
$('#btnSearch').click(function () {
Organization.search();
@ -161,4 +162,13 @@ layui.use(['table', 'form', 'func', 'HttpRequest', 'tree', 'util'], function ()
var checked = obj.elem.checked ? 1 : 2;
Organization.updateStatus(orgId, checked);
});
});
$(function () {
var panehHidden = false;
if ($(this).width() < 769) {
panehHidden = true;
}
$('#myContiner').layout({initClosed: panehHidden, west__size: 260});
});

@ -4,35 +4,31 @@ layui.use(['form', 'admin', 'HttpRequest', 'xmSelect'], function () {
var admin = layui.admin;
var HttpRequest = layui.HttpRequest;
var xmSelect = layui.xmSelect;
var insXmSel;
var organizationXmSel;
/* 渲染树形 */
function renderTree() {
$.get(Feng.ctxPath + '/hrOrganization/treeLayui', function (data) {
insXmSel = xmSelect.render({
el: '#organizationEditParentSel',
height: '250px',
data: data.data,
model: {label: {type: 'text'}},
prop: {name: 'title', value: 'id'},
radio: true,
clickClose: true,
tree: {
show: true,
indent: 15,
strict: false,
expandedKeys: true
}
});
// 初始化组织树
new HttpRequest(Feng.ctxPath + "/hrOrganization/treeLayui", 'get', function (data) {
organizationXmSel = xmSelect.render({
el: '#organization',
data: data.data,
model: {label: {type: 'text'}},
prop: {name: 'title', value: 'id'},
radio: true,
layVerify: 'required',
clickClose: true,
tree: {
show: true,
indent: 15,
strict: false,
expandedKeys: true
}
});
}
renderTree();
}).start();
//表单提交事件
form.on('submit(btnSubmit)', function (data) {
//获取机构id
data.field.orgParentId = insXmSel.getValue('valueStr');
data.field.orgParentId = organizationXmSel.getValue('valueStr');
var request = new HttpRequest(Feng.ctxPath + "/hrOrganization/add", 'post', function (data) {
admin.closeThisDialog();
Feng.success("添加成功!");

@ -4,41 +4,38 @@ layui.use(['form', 'admin', 'HttpRequest', 'xmSelect'], function () {
var admin = layui.admin;
var HttpRequest = layui.HttpRequest;
var xmSelect = layui.xmSelect;
var insXmSel;
var organizationXmSel;
//获取信息详情填充表单
var request = new HttpRequest(Feng.ctxPath + "/hrOrganization/detail?orgId=" + Feng.getUrlParam("orgId"), 'get');
var result = request.start();
form.val('organizationForm', result.data);
renderTree(result.data.orgParentId);
/* 渲染树形 */
function renderTree(orgParentId) {
$.get(Feng.ctxPath + '/hrOrganization/treeLayui', function (data) {
insXmSel = xmSelect.render({
el: '#organizationEditParentSel',
height: '250px',
data: data.data,
initValue: [orgParentId],
model: {label: {type: 'text'}},
prop: {name: 'title', value: 'id'},
radio: true,
clickClose: true,
tree: {
show: true,
indent: 15,
strict: false,
expandedKeys: true
}
});
// 初始化组织树
new HttpRequest(Feng.ctxPath + "/hrOrganization/treeLayui", 'get', function (data) {
organizationXmSel = xmSelect.render({
el: '#organization',
data: data.data,
initValue: [result.data.orgId],
layVerify: 'required',
model: {label: {type: 'text'}},
prop: {name: 'title', value: 'id'},
radio: true,
clickClose: true,
tree: {
show: true,
indent: 15,
strict: false,
expandedKeys: true
}
});
}
}).start();
//表单提交事件
form.on('submit(btnSubmit)', function (data) {
//获取机构id
data.field.orgParentId = insXmSel.getValue('valueStr');
data.field.orgParentId = organizationXmSel.getValue('valueStr');
var request = new HttpRequest(Feng.ctxPath + "/hrOrganization/edit", 'post', function (data) {
admin.closeThisDialog();

@ -13,9 +13,9 @@ layui.use(['layer', 'form', 'table', 'ztree', 'laydate', 'admin', 'HttpRequest',
var MgrUser = {
tableId: "userTable", //表格id
condition: {
name: "",
deptId: "",
timeLimit: ""
realName: "",
orgId: "",
account: ""
}
};
@ -25,7 +25,7 @@ layui.use(['layer', 'form', 'table', 'ztree', 'laydate', 'admin', 'HttpRequest',
MgrUser.initColumn = function () {
//获取多语言
var langs = layui.data('system').lang;
//var langs = layui.data('system').lang;
return [[
{type: 'checkbox'},
@ -45,7 +45,8 @@ layui.use(['layer', 'form', 'table', 'ztree', 'laydate', 'admin', 'HttpRequest',
* 选择部门时
*/
MgrUser.onClickDept = function (obj) {
MgrUser.condition.deptId = obj.data.id;
console.log(obj);
MgrUser.condition.orgId = obj.data.id;
MgrUser.search();
};
@ -54,9 +55,9 @@ layui.use(['layer', 'form', 'table', 'ztree', 'laydate', 'admin', 'HttpRequest',
*/
MgrUser.search = function () {
var queryData = {};
queryData['deptId'] = MgrUser.condition.deptId;
queryData['name'] = $("#name").val();
queryData['timeLimit'] = $("#timeLimit").val();
queryData['orgId'] = MgrUser.condition.orgId;
queryData['account'] = $("#account").val();
queryData['realName'] = $("#realName").val();
table.reload(MgrUser.tableId, {
where: queryData, page: {curr: 1}
});

@ -7,23 +7,6 @@ layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'xmSelect'], func
var xmSelect = layui.xmSelect;
var organizationXmSel;
var positionXmSel;
// 点击部门时
// $('#deptName').click(function () {
// var formName = encodeURIComponent("parent.UserInfoDlg.data.deptName");
// var formId = encodeURIComponent("parent.UserInfoDlg.data.deptId");
// var treeUrl = encodeURIComponent("/dept/tree");
//
// layer.open({
// type: 2,
// title: '部门选择',
// area: ['300px', '400px'],
// content: Feng.ctxPath + '/system/commonTree?formName=' + formName + "&formId=" + formId + "&treeUrl=" + treeUrl,
// end: function () {
// $("#deptId").val(UserInfoDlg.data.deptId);
// $("#deptName").val(UserInfoDlg.data.deptName);
// }
// });
// });
// 初始化组织树
new HttpRequest(Feng.ctxPath + "/hrOrganization/treeLayui", 'get', function (data) {

@ -1,49 +1,43 @@
@layout("/layout/_container.html",{js:["/assets/modular/system/organization/organization.js"]}){
@layout("/layout/_tree_container.html",{plugins:["ztree"],js:["/assets/modular/system/organization/organization.js"]}){
<div class="layui-body-header">
<span class="layui-body-header-title">机构管理</span>
</div>
<div class="layui-fluid">
<div class="layui-row layui-col-space15">
<div class="layui-col-md3">
<div class="layui-card">
<div class="layui-card-body" style="padding: 10px;">
<!-- 树工具栏 -->
<!-- <div class="layui-form toolbar" id="organizationTreeBar">-->
<!-- <button id="organizationAddBtn" class="layui-btn layui-btn-sm icon-btn">-->
<!-- <i class="layui-icon">&#xe654;</i>添加-->
<!-- </button>&nbsp;-->
<!-- <button id="organizationEditBtn" class="layui-btn layui-btn-sm layui-btn-warm icon-btn">-->
<!-- <i class="layui-icon">&#xe642;</i>修改-->
<!-- </button>&nbsp;-->
<!-- <button id="organizationDelBtn"-->
<!-- class="layui-btn layui-btn-sm layui-btn-danger icon-btn">-->
<!-- <i class="layui-icon">&#xe640;</i>删除-->
<!-- </button>-->
<!-- </div>-->
<!-- 左树 -->
<div id="organizationTree"></div>
</div>
<div id="myContiner" style="height: 100%">
<div class="ui-layout-west">
<div class="box box-main">
<div class="ui-layout-content">
<div id="deptTree"></div>
</div>
</div>
<div class="layui-col-md9">
<div class="layui-card">
<div class="layui-card-body" style="padding: 10px;">
<div class="layui-form toolbar">
<div class="layui-form-item">
<div class="layui-inline">
<input id="orgName" class="layui-input" type="text" placeholder="机构名称"/>
</div>
<div class="layui-inline">
<button id="btnSearch" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
<button id="btnAdd" class="layui-btn icon-btn"><i class="layui-icon">&#xe654;</i>添加</button>
<button id="btnExp" class="layui-btn icon-btn"><i class="layui-icon">&#xe67d;</i>导出</button>
</div>
<div class="ui-layout-center">
<div class="layui-fluid">
<div class="layui-row">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-body">
<div class="layui-form toolbar">
<input id="defaultPassword" class="layui-input" type="hidden" value="${constants.getDefaultPassWord()}"/>
<div class="layui-form-item">
<div class="layui-inline">
<input id="orgName" class="layui-input" type="text" placeholder="组织名称"/>
</div>
<div class="layui-inline">
<input id="orgCode" class="layui-input" type="text" placeholder="组织编码"/>
</div>
<div class="layui-inline">
<button id="btnSearch" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
<button id="btnAdd" class="layui-btn icon-btn"><i class="layui-icon">&#xe654;</i>添加</button>
<button id="btnExp" class="layui-btn icon-btn"><i class="layui-icon">&#xe67d;</i>导出</button>
</div>
</div>
</div>
<table class="layui-table" id="userTable" lay-filter="userTable"></table>
</div>
</div>
<!-- 数据表格 -->
<table id="organizationTable" lay-filter="organizationTable"></table>
</div>
</div>
</div>
@ -53,9 +47,11 @@
<script type="text/html" id="tableBar">
<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="roleAssign">分配角色</a>
<a class="layui-btn layui-btn-xs" lay-event="reset">重置密码</a>
</script>
<script type="text/html" id="statusTpl">
<input type="checkbox" lay-filter="status" value="{{d.orgId}}" lay-skin="switch" lay-text="正常|锁定" {{d.statusFlag=='1'?'checked':''}}/>
<input type="checkbox" lay-filter="status" value="{{d.userId}}" lay-skin="switch" lay-text="正常|锁定" {{d.statusFlag=='1'?'checked':''}}/>
</script>
@}

@ -23,10 +23,10 @@
<input id="defaultPassword" class="layui-input" type="hidden" value="${constants.getDefaultPassWord()}"/>
<div class="layui-form-item">
<div class="layui-inline">
<input id="name" class="layui-input" type="text" placeholder=""/>
<input id="account" class="layui-input" type="text" placeholder="账号"/>
</div>
<div class="layui-inline">
<input id="timeLimit" class="layui-input" type="text" placeholder=""/>
<input id="realName" class="layui-input" type="text" placeholder="姓名"/>
</div>
<div class="layui-inline">
<button id="btnSearch" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>

Loading…
Cancel
Save