<style>
|
#user-add {
|
padding: 20px 25px 25px 0;
|
}
|
#user-add .layui-treeSelect .ztree li a, .ztree li span {
|
margin: 0 0 2px 3px !important;
|
}
|
#user-add #data-permission-tree-block {
|
border: 1px solid #eee;
|
border-radius: 2px;
|
padding: 3px 0;
|
}
|
#user-add .layui-treeSelect .ztree li span.button.switch {
|
top: 1px;
|
left: 3px;
|
}
|
</style>
|
<div class="layui-fluid" id="user-add">
|
<form class="layui-form" action="" lay-filter="user-add-form">
|
<div class="layui-form-item">
|
<label class="layui-form-label febs-form-item-require">用户名：</label>
|
<div class="layui-input-block">
|
<input type="text" name="username" minlength="2" maxlength="10" lay-verify="range|username"
|
autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label">手机：</label>
|
<div class="layui-input-block">
|
<input type="tel" name="mobile" lay-verify="phone" autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label">邮箱：</label>
|
<div class="layui-input-block">
|
<input type="text" name="email" lay-verify="email" maxlength="50" autocomplete="off"
|
class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label febs-form-item-require">角色：</label>
|
<div class="layui-input-block">
|
<select name="roleId"
|
lay-verify="required"
|
xm-select-direction="down"
|
xm-select="user-add-role"
|
xm-select-skin="default">
|
</select>
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label">部门：</label>
|
<div class="layui-input-block">
|
<input type="text" name="deptId" id="user-add-dept" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label febs-form-item-require">状态：</label>
|
<div class="layui-input-block">
|
<input type="radio" name="status" value="1" title="有效" checked="">
|
<input type="radio" name="status" value="0" title="禁用">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label febs-form-item-require">性别：</label>
|
<div class="layui-input-block">
|
<input type="radio" name="sex" value="0" title="男性">
|
<input type="radio" name="sex" value="1" title="女性">
|
<input type="radio" name="sex" value="2" title="保密" checked="">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label">数据权限：</label>
|
<div class="layui-input-block" id="data-permission-tree-block">
|
<div class="data-permission-tree" lay-filter="dataPermissionTree" style="margin-left: 1rem"></div>
|
</div>
|
</div>
|
<div class="layui-form-item layui-form-text">
|
<label class="layui-form-label">备注：</label>
|
<div class="layui-input-block">
|
<textarea name="description" maxlength="100" class="layui-textarea"></textarea>
|
</div>
|
</div>
|
<div class="layui-form-item febs-hide">
|
<button class="layui-btn" lay-submit="" lay-filter="user-add-form-submit" id="submit"></button>
|
<button type="reset" class="layui-btn" id="reset"></button>
|
</div>
|
</form>
|
</div>
|
|
<script>
|
layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree'], function () {
|
var $ = layui.$,
|
febs = layui.febs,
|
layer = layui.layer,
|
formSelects = layui.formSelects,
|
treeSelect = layui.treeSelect,
|
form = layui.form,
|
eleTree = layui.eleTree,
|
$view = $('#user-add'),
|
validate = layui.validate,
|
_deptTree;
|
|
form.verify(validate);
|
form.render();
|
|
formSelects.render();
|
renderDeptTree();
|
|
treeSelect.render({
|
elem: $view.find('#user-add-dept'),
|
type: 'get',
|
data: ctx + 'dept/select/tree',
|
placeholder: '请选择',
|
search: false
|
});
|
|
function renderDeptTree() {
|
_deptTree = eleTree.render({
|
elem: $view.find('.data-permission-tree'),
|
url: ctx + 'dept/tree',
|
accordion: true,
|
highlightCurrent: true,
|
showCheckbox: true,
|
checkStrictly: true,
|
renderAfterExpand: false,
|
request: {
|
name: 'name',
|
key: "id",
|
checked: "checked",
|
data: 'data'
|
},
|
response: {
|
statusName: "code",
|
statusCode: 200,
|
dataName: "data"
|
}
|
});
|
return _deptTree;
|
}
|
|
formSelects.config('user-add-role', {
|
searchUrl: ctx + 'role',
|
response: {
|
statusCode: 200
|
},
|
beforeSuccess: function (id, url, searchVal, result) {
|
var data = result.data;
|
var tranData = [];
|
for (var i = 0; i < data.length; i++) {
|
tranData.push({
|
name: data[i].roleName,
|
value: data[i].roleId
|
})
|
}
|
result.data = tranData;
|
return result;
|
},
|
error: function (id, url, searchVal, err) {
|
console.error(err);
|
febs.alert.error('获取角色列表失败');
|
}
|
});
|
|
form.on('submit(user-add-form-submit)', function (data) {
|
var checked = _deptTree.getChecked(false, true);
|
var deptIds = [];
|
layui.each(checked, function (key, item) {
|
deptIds.push(item.id)
|
});
|
data.deptIds = deptIds.join(",");
|
febs.post(ctx + 'user', data.field, function () {
|
layer.closeAll();
|
febs.alert.success('新增用户成功，初始密码为 1234qwer');
|
$('#febs-user').find('#query').click();
|
});
|
return false;
|
});
|
});
|
</script>
|
