提交 423e6466 authored 作者: 钟是志's avatar 钟是志

28974 辅导员考核相关需求,有疑问联系我

上级 e28fea6f
...@@ -28,33 +28,40 @@ export default function SelectPerson(props) { ...@@ -28,33 +28,40 @@ export default function SelectPerson(props) {
const [jqpp, setJqpp] = useState(false); // 是否精确匹配 const [jqpp, setJqpp] = useState(false); // 是否精确匹配
function changeShow() { function changeShow() {
setShow(!show); setShow(!show);
setCheckedList([]); }
setSgUserIds([]);
// setSelectUsers([]); function initShowData(stateList = {}) {
setSearchKey(''); setCheckedList(stateList.checkedList || []);
setSearchResult([]); setSgUserIds(stateList.sgUserIds || []);
setDetailList([]); setSelectUsers(stateList.sgUsers || []);
setSearchKey(stateList.searchKey || '');
setSearchResult(stateList.searchResult || []);
setDetailList(stateList.detailList || []);
} }
useEffect(() => { useEffect(() => {
window.smartFormSelectPersonComponent = { window.smartFormSelectPersonComponent = {
changeShow, changeShow,
setSelectUsers, initShowData,
lowCodeProps: lowCodeProps(), lowCodeProps: lowCodeProps(),
callback: (selectUsers) => { callback: ({
console.log(selectUsers); value,
componentState,
}) => {
console.log(value, componentState);
}, },
}; };
}, []); }, []);
// 第二栏树形数据 // 第二栏树形数据
const getTreeList = () => { const getTreeList = () => {
requestData({}, apis.findTree).then(res => { requestData({}, apis.findTree)
if (res) { .then(res => {
res = formatTreeData(res); if (res) {
setAuthInstitutionInfo(res); res = formatTreeData(res);
} setAuthInstitutionInfo(res);
}); }
});
}; };
//根据关键字搜索 //根据关键字搜索
...@@ -62,7 +69,7 @@ export default function SelectPerson(props) { ...@@ -62,7 +69,7 @@ export default function SelectPerson(props) {
if (searchKey === '') { if (searchKey === '') {
setSearchResult([]); setSearchResult([]);
} else { } else {
if(searchKey.length < 2){ if (searchKey.length < 2) {
message.warning('请至少输入2个字符'); message.warning('请至少输入2个字符');
return false; return false;
} }
...@@ -72,11 +79,12 @@ export default function SelectPerson(props) { ...@@ -72,11 +79,12 @@ export default function SelectPerson(props) {
isExact: jqpp, isExact: jqpp,
}, },
apis.search, apis.search,
).then(res => { )
if (res) { .then(res => {
setSearchResult(res); if (res) {
} setSearchResult(res);
}); }
});
} }
}; };
...@@ -88,7 +96,10 @@ export default function SelectPerson(props) { ...@@ -88,7 +96,10 @@ export default function SelectPerson(props) {
//根据id进行搜索 //根据id进行搜索
const searchById = (selectedKeys, e) => { const searchById = (selectedKeys, e) => {
const { businessKey, selectType } = e.node.props; const {
businessKey,
selectType
} = e.node.props;
let bKey = businessKey; let bKey = businessKey;
requestData( requestData(
{ {
...@@ -96,11 +107,12 @@ export default function SelectPerson(props) { ...@@ -96,11 +107,12 @@ export default function SelectPerson(props) {
selectType, selectType,
}, },
apis.findList, apis.findList,
).then(res => { )
if (res) { .then(res => {
setDetailList(res); if (res) {
} setDetailList(res);
}); }
});
}; };
//选中的人 //选中的人
...@@ -143,16 +155,27 @@ export default function SelectPerson(props) { ...@@ -143,16 +155,27 @@ export default function SelectPerson(props) {
return false; return false;
} }
message.info(propsDiy.getResultProps.message); message.info(propsDiy.getResultProps.message);
requestData(data, apis.getData).then(res => { requestData(data, apis.getData)
if (res) { .then(res => {
message.success('操作成功'); if (res) {
if(window.smartFormSelectPersonComponent.callback){ message.success('操作成功');
window.smartFormSelectPersonComponent.callback(res); if (window.smartFormSelectPersonComponent.callback) {
window.smartFormSelectPersonComponent.callback({
value: res,
componentState: {
checkedList,
sgUserIds,
sgUsers,
searchKey,
searchResult,
// detailList,
},
});
}
changeShow();
// props.getData();
} }
changeShow(); });
// props.getData();
}
});
}; };
const changeJqpp = e => { const changeJqpp = e => {
...@@ -160,7 +183,6 @@ export default function SelectPerson(props) { ...@@ -160,7 +183,6 @@ export default function SelectPerson(props) {
}; };
useEffect(() => { useEffect(() => {
if (show) { if (show) {
getTreeList(); getTreeList();
...@@ -209,12 +231,12 @@ export default function SelectPerson(props) { ...@@ -209,12 +231,12 @@ export default function SelectPerson(props) {
} }
arr = [...map.values()]; arr = [...map.values()];
arr.sort((a, b) => { // 排序解决 多层子级的问题。 arr.sort((a, b) => { // 排序解决 多层子级的问题。
if(a.businessKey && b.businessKey){ if (a.businessKey && b.businessKey) {
return a.businessKey.length - b.businessKey.length; return a.businessKey.length - b.businessKey.length;
} }
return 0; return 0;
}); });
const distnctBusinessKey = arr.reduce(function(response, current, index) { const distnctBusinessKey = arr.reduce(function (response, current, index) {
// 删除子级 key 保证数据唯一性 // 删除子级 key 保证数据唯一性
let add = true; let add = true;
for (let item of response) { for (let item of response) {
...@@ -286,7 +308,7 @@ export default function SelectPerson(props) { ...@@ -286,7 +308,7 @@ export default function SelectPerson(props) {
: () => selectUser(x) : () => selectUser(x)
} }
> >
<span style={{ color: sgUserIds.includes(x.businessKey) && 'red' }}> <span style={{ backgroundColor: sgUserIds.includes(x.businessKey) && 'red' }}>
{x.businessName} {x.businessName}
</span> </span>
</div> </div>
...@@ -314,7 +336,8 @@ export default function SelectPerson(props) { ...@@ -314,7 +336,8 @@ export default function SelectPerson(props) {
/> />
) : ( ) : (
<div className={styles.no_result}> <div className={styles.no_result}>
<Spin spinning={true} tip={propsDiy.secondTreeProps.loadingTreeDataMessage} size="large" /> <Spin spinning={true} tip={propsDiy.secondTreeProps.loadingTreeDataMessage}
size="large"/>
</div> </div>
)} )}
</div> </div>
...@@ -327,7 +350,8 @@ export default function SelectPerson(props) { ...@@ -327,7 +350,8 @@ export default function SelectPerson(props) {
<div className={styles.search_result}> <div className={styles.search_result}>
{detailList?.filter(g => { {detailList?.filter(g => {
return g.isSelect; return g.isSelect;
}).map(x => { })
.map(x => {
return ( return (
<div <div
key={x.businessKey} key={x.businessKey}
...@@ -341,7 +365,7 @@ export default function SelectPerson(props) { ...@@ -341,7 +365,7 @@ export default function SelectPerson(props) {
fontWeight: 'normal', fontWeight: 'normal',
} }
: { : {
color: sgUserIds.includes(x.businessKey) && 'red', backgroundColor: sgUserIds.includes(x.businessKey) && 'red',
} }
} }
> >
...@@ -352,7 +376,8 @@ export default function SelectPerson(props) { ...@@ -352,7 +376,8 @@ export default function SelectPerson(props) {
})} })}
</div> </div>
) : ( ) : (
<div className={styles.no_result}>{propsDiy.thirdDetailListProps.emptyMessage}</div> <div
className={styles.no_result}>{propsDiy.thirdDetailListProps.emptyMessage}</div>
)} )}
</div> </div>
</div> </div>
...@@ -377,7 +402,7 @@ export default function SelectPerson(props) { ...@@ -377,7 +402,7 @@ export default function SelectPerson(props) {
onClick={e => deleteSg(x, index, e)} onClick={e => deleteSg(x, index, e)}
/> />
<Tooltip title={x.businessName}> <Tooltip title={x.businessName}>
{x.businessName} {x.businessName}
</Tooltip> </Tooltip>
</div> </div>
</div> </div>
......
export default function lowCodeProps(info) { export default function lowCodeProps(info) {
return {
return { searchType: 'instructorSearch', // teacherSearch || studentSearch || instructorSearch
searchType: 'instructorSearch', // teacherSearch || studentSearch || instructorSearch ModalProps: {
ModalProps: { // 弹窗的属性 // 弹窗的属性
title: '选择辅导员', title: '选择辅导员',
}, },
firstSearchProps: { // 最左侧搜索栏的属性 firstSearchProps: {
inputProps: { // 最左侧搜索栏的属性
placeholder: '输入辅导员姓名/工号搜索', inputProps: {
}, placeholder: '输入辅导员姓名/工号搜索',
searchResultTitle: '搜索结果', },
}, searchResultTitle: '搜索结果',
secondTreeProps: { // 树形 },
title: '部门', secondTreeProps: {
loadingTreeDataMessage: '正在加载数据', // 树形
}, title: '部门',
thirdDetailListProps: { // 第三栏 loadingTreeDataMessage: '正在加载数据',
title: '详细辅导员列表', },
emptyMessage: '暂无详细辅导员列表数据', thirdDetailListProps: {
}, // 第三栏
fourRangeProps: { // 第四栏 title: '详细辅导员列表',
title: '所选择的辅导员范围', emptyMessage: '暂无详细辅导员列表数据',
emptyMessage: '暂无选中的辅导员', },
}, fourRangeProps: {
getResultProps: { // 第四栏
emptySelectMessage: '请至少选择一个辅导员', title: '所选择的辅导员范围',
message: '正在查询中,请耐心等待', emptyMessage: '暂无选中的辅导员',
}, },
}; getResultProps: {
emptySelectMessage: '请至少选择一个辅导员',
message: '正在查询中,请耐心等待',
},
};
} }
/** /**
...@@ -35,11 +39,12 @@ export default function lowCodeProps(info) { ...@@ -35,11 +39,12 @@ export default function lowCodeProps(info) {
return { return {
before: [ before: [
{ {
children: "选择辅导员", type: "primary", onClick: () => { children: "选择辅导员", type: "primary", onClick: () => {
// 钟是志
if (window.smartFormSelectPersonComponent) { // 2022年10月12日
// window.smartFormSelectPersonComponent.lowCodeProps = // 解决按部门选择 辅导员, 选择老师, 选择学生的需求
// window.smartFormSelectPersonComponent.lowCodeProps =
// { // {
// searchType: 'instructorSearch', // teacherSearch || studentSearch || instructorSearch // searchType: 'instructorSearch', // teacherSearch || studentSearch || instructorSearch
// ModalProps: { // 弹窗的属性 // ModalProps: { // 弹窗的属性
...@@ -68,13 +73,43 @@ export default function lowCodeProps(info) { ...@@ -68,13 +73,43 @@ export default function lowCodeProps(info) {
// message: '正在查询中,请耐心等待', // message: '正在查询中,请耐心等待',
// }, // },
// }; // };
window.smartFormSelectPersonComponent.setSelectUsers([{ // 设置已经选中的用户 if (window.smartFormSelectPersonComponent) {
businessKey: "71-1300", // window.smartFormSelectPersonComponent.initShowData({
businessName: '钟是志', // 初始化显示的选中数据 从 callback 的componentState读取
isSelect: true, // "checkedList": [],
}]); // "sgUserIds": ['40-1723", "40-1470", "40-971'],
window.smartFormSelectPersonComponent.callback = (selectUsers) => { // 回调函数 // "sgUsers": [{
console.log(selectUsers); // "businessKey": "40-1723",
// "businessMemo": "",
// "businessName": "丁心",
// "children": [],
// "ext": null,
// "isSelect": true,
// "level": 1
// }, {
// "businessKey": "40-1470",
// "businessMemo": "",
// "businessName": "程丽娜",
// "children": [],
// "ext": null,
// "isSelect": true,
// "level": 1
// }, {
// "businessKey": "40-971",
// "businessMemo": "",
// "businessName": "石头",
// "children": [],
// "ext": null,
// "isSelect": true,
// "level": 1
// }],
// "searchKey": "",
// "searchResult": []
// });
window.smartFormSelectPersonComponent.callback = ({ value, componentState }) => { // 回调函数
console.log(value, JSON.stringify(componentState));
// componentState 用于组件数据回显,
}; };
window.smartFormSelectPersonComponent.changeShow(); // 打开弹窗 window.smartFormSelectPersonComponent.changeShow(); // 打开弹窗
} }
...@@ -83,5 +118,5 @@ export default function lowCodeProps(info) { ...@@ -83,5 +118,5 @@ export default function lowCodeProps(info) {
] ]
} }
** 使用方法 ** 使用方法
* */ * */
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论