部门选择器-表单专用
@beisen-phoenix/field-department
API
参数 | 说明 | 类型 | 默认值 | 是否必传 | 备注 |
---|---|---|---|---|---|
onSearchChange | 搜索框中值变化时的回调,参数为输入框的value | async function |
无 | 是 | 该回调函数应该return一个Promise 对象,异步返回的数据为department对象组成的数组 |
validateSearch | 搜索框中数据的验证,在搜索行为发生前执行,参数为输入框的value | function |
无 | 否 | 该回调函数应该return一个对象{value: '处理后的value', info: '验证的提示信息,会显示在输入框下方', clearTipAfter: '提示信息自动消失的时间间隔'} |
onExpand | 树形组件中,部门展开的回调;当被展开的部门无子部门数据时会调用该函数,参数为department对象 | async function |
无 | 是 | 该回调函数应该return一个Promise 对象,异步返回的数据为department对象组成的数组 |
onChange | 选中数据改变时的回调,参数为选中的部门 | function |
无 | 是 | 单选时参数为dep对象,多选时为dep对象组成的数组 |
options | 初始传入的树形组件数据 | array |
[ ] | 是 | 该数据为department对象组成的一维数组 |
value | 默认选中的数据 | array |
[ ] | 否 | 该数据为department对象组成的一维数组 |
multiple | 是否多选 | boolean |
false |
否 | 根据该值确认显示单选或者多选组件 |
withSub | “包含下级”默认勾选状态 | boolean |
true |
否 | 单选时才会用到 |
leftTitle | 可选组织的标题 | string |
可选组织 |
否 | 多选时才会用到 |
rightTitle | 已选组织的标题 | string |
已选组织 |
否 | 多选时才会用到 |
hideWithSub | 隐藏“包含下级”和“确定”按钮 | boolean |
false |
否 | 单选时才会用到 |
maxCount | 多选时的最大可选数 | number |
99999 | 否 | 多选时才会用到 |
showDisableCheck | 是否显示「显示停用」勾选框 | boolean |
true | 否 | 如果配置为false,则勾选框不会显示,并且展示的数据将不包含“已停用”的部门 |
expandLevel | 树形组件默认展开的层级 | number |
2 | 否 | 实际默认展开层级同时取决于treeData数据中是否有相应层级的数据 |
isPreview | 是否用于表单展示态 | boolean |
false |
否 |
相关示例
department对象格式
{
departmentId: '组织id(string|number)',
departmentName: 'string:组织名称(string)',
parentDepartmentId: 'string:父级组织id(string|number)',
departmentStatus: '组织状态(是否为启动状态)(boolean)',
parentDepartmentName: '父级组织名称(string)',
withSub: '是否包含下级(boolean)',
withSubEnable: '是否有勾选包含下级的权限(boolean)',
hasChildrenEnable: '是否包含未停用的子级(boolean)',
hasChildrenDisabled: '是否包含已停用的子级(boolean)'
}
dep对象格式
{
departmentId: '组织id',
departmentName: '组织名称',
departmentStatus: '组织状态(是否为启动状态)(boolean)',
withSub: '是否包含下级',
withSubEnable: '是否有勾选包含下级的权限(boolean)',
}
onSearchChange回调
onSearchChange = value => {
return new Promise((resolve, reject) => {
resolve(getSearchData());
})
}
onExpand回调
onExpand = department => {
return new Promise((resolve, reject) => {
resolve(getSubTreeData(department));
})
}