From a128b528a937cee9d3aa727922c445b948498ac1 Mon Sep 17 00:00:00 2001 From: Jason Chuang Date: Tue, 1 Sep 2026 13:19:37 +0800 Subject: [PATCH] fix user group save --- .../pnspsUserGroupDetailPage/GroupAuthCard.js | 22 ++++-- .../GroupAuthTable.js | 6 +- .../pnspsUserGroupDetailPage/UserAddCard.js | 7 +- src/pages/pnspsUserGroupDetailPage/index.js | 67 ++++++++++++++----- 4 files changed, 74 insertions(+), 28 deletions(-) diff --git a/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js b/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js index f2296e84..6b244c60 100644 --- a/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js +++ b/src/pages/pnspsUserGroupDetailPage/GroupAuthCard.js @@ -15,8 +15,8 @@ const GroupAuthTable = Loadable(lazy(() => import('./GroupAuthTable'))); const GroupAuthCard = ({isCollectData, updateUserAuthList,userGroupData,isNewRecord, editMode}) => { const [currentAuthData, setCurrentAuthData] = React.useState({}); const [onReady, setOnReady] = useState(false); - const [selectedRow, setSelectedRow] = useState([]); - const [referenceRow, setReferenceRow] = useState([]); + const [selectedRow, setSelectedRow] = useState(userGroupData?.authIds || []); + const [referenceRow, setReferenceRow] = useState(userGroupData?.authIds || []); const [_editMode, setEditMode] = useState(editMode); useEffect(()=>{ @@ -39,14 +39,22 @@ const GroupAuthCard = ({isCollectData, updateUserAuthList,userGroupData,isNewRec } }, [currentAuthData]); + const toIdList = (ids) => { + if (!ids) { + return []; + } + const raw = Array.isArray(ids) ? ids : (ids.ids ? Array.from(ids.ids) : []); + return raw.map((id) => Number(id)).filter((id) => !Number.isNaN(id)); + }; + useEffect(() => { - //upload latest data to parent - let deletedList = referenceRow.filter(x => !selectedRow.includes(x)); + const currentIds = toIdList(selectedRow); + const referenceIds = toIdList(referenceRow); updateUserAuthList({ - "currentList": selectedRow, - "deletedList": deletedList + currentList: currentIds, + deletedList: referenceIds.filter((id) => !currentIds.includes(id)) }); - }, [isCollectData]); + }, [isCollectData, selectedRow, referenceRow]); return ( diff --git a/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js b/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js index 568c4bae..64193f9f 100644 --- a/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js +++ b/src/pages/pnspsUserGroupDetailPage/GroupAuthTable.js @@ -98,8 +98,10 @@ export default function GroupAuthTable({setSelectedRow, userAuth,isNewRecord, ed rowSelectionModel={currentSelectedRow} onRowSelectionModelChange={(ids) => { if(_editMode){ - setSelectedRow(ids); - setCurrentSelectedRow(ids); + const raw = Array.isArray(ids) ? ids : (ids?.ids ? Array.from(ids.ids) : []); + const nextIds = raw.map((id) => Number(id)).filter((id) => !Number.isNaN(id)); + setSelectedRow(nextIds); + setCurrentSelectedRow(nextIds); } }} autoHeight diff --git a/src/pages/pnspsUserGroupDetailPage/UserAddCard.js b/src/pages/pnspsUserGroupDetailPage/UserAddCard.js index 8d6c7ef5..3c761d7d 100644 --- a/src/pages/pnspsUserGroupDetailPage/UserAddCard.js +++ b/src/pages/pnspsUserGroupDetailPage/UserAddCard.js @@ -90,12 +90,11 @@ const UserAddCard = ({ isCollectData, updateGroupMember, userGroupData, isNewRec }, [currentUserData]); useEffect(() => { - //upload latest data to parent updateGroupMember({ - "currentList": groupUserData, - "deletedList": deletedList + currentList: groupUserData, + deletedList: deletedList }); - }, [isCollectData]); + }, [isCollectData, groupUserData, deletedList]); return ( diff --git a/src/pages/pnspsUserGroupDetailPage/index.js b/src/pages/pnspsUserGroupDetailPage/index.js index 1920c3f6..b910cbd8 100644 --- a/src/pages/pnspsUserGroupDetailPage/index.js +++ b/src/pages/pnspsUserGroupDetailPage/index.js @@ -49,6 +49,10 @@ const UserMaintainPage = () => { const [userGroupData, setUserGroupData] = useState([]); const [userAuthData, setUserAuthData] = useState([]); const saveInProgressRef = useRef(false); + const userAuthDataRef = useRef([]); + const deletedAuthListRef = useRef([]); + const groupMemberRef = useRef([]); + const deletedUserListRef = useRef([]); const [groupMember, setGroupMember] = useState([]); const [isNewRecord, setIsNewRecord] = useState(false); const [deletedUserList, setDeletedUserList] = useState([]); @@ -84,13 +88,21 @@ const UserMaintainPage = () => { } function updateGroupMember(groupMember) { - setGroupMember(groupMember.currentList); - setDeletedUserList(groupMember.deletedList); + const currentList = groupMember.currentList || []; + const deletedList = groupMember.deletedList || []; + groupMemberRef.current = currentList; + deletedUserListRef.current = deletedList; + setGroupMember(currentList); + setDeletedUserList(deletedList); } function updateUserAuthList(userAuthData) { - setUserAuthData(userAuthData.currentList); - setDeletedAuthList(userAuthData.deletedList); + const currentList = userAuthData.currentList || []; + const deletedList = userAuthData.deletedList || []; + userAuthDataRef.current = currentList; + deletedAuthListRef.current = deletedList; + setUserAuthData(currentList); + setDeletedAuthList(deletedList); } const submitData = async () => { @@ -106,19 +118,38 @@ const UserMaintainPage = () => { return; } const latestGroupFormData = getLatestGroupFormData(); - const finalDeletedUserList = getDeletedRecordWithRefList(deletedUserList, getIdList(groupMember)); + const latestGroupMember = groupMemberRef.current; + const latestAuthIds = userAuthDataRef.current; + const latestDeletedAuthIds = deletedAuthListRef.current; + const finalDeletedUserList = getDeletedRecordWithRefList( + deletedUserListRef.current, + getIdList(latestGroupMember) + ); const response = await axios.post(POST_AND_UPDATE_USER_GROUP, { id: parseInt(params.id) !== -1 ? parseInt(params.id) : null, name: latestGroupFormData.userGroupName, description: latestGroupFormData.description, - addUserIds: getIdList(groupMember), + addUserIds: getIdList(latestGroupMember), removeUserIds: finalDeletedUserList, - addAuthIds: userAuthData, - removeAuthIds: deletedAuthList, + addAuthIds: latestAuthIds, + removeAuthIds: latestDeletedAuthIds, }); if (response.status === 200) { - navigate('/usergroupSearchview'); notifySaveSuccess(); + const savedId = response.data?.id; + const currentId = parseInt(params.id); + if ((currentId === -1 || Number.isNaN(currentId)) && savedId) { + navigate(`/userGroup/${savedId}`, { replace: true }); + await loadGroupData(savedId); + } else { + await loadGroupData(currentId); + } + setIsNewRecord(false); + setEditMode(false); + deletedUserListRef.current = []; + deletedAuthListRef.current = []; + setDeletedUserList([]); + setDeletedAuthList([]); } } catch (error) { console.log(error); @@ -177,14 +208,20 @@ const UserMaintainPage = () => { return true; }; + const loadGroupData = async (groupId) => { + const response = await axios.get(`${GET_GROUP_LIST_PATH}/${groupId}`); + if (response.status === 200) { + setUserGroupData(response.data); + const loadedAuthIds = response.data?.authIds || []; + userAuthDataRef.current = loadedAuthIds; + setUserAuthData(loadedAuthIds); + } + return response; + }; + useEffect(() => { if (params.id > 0) { - axios.get(`${GET_GROUP_LIST_PATH}/${params.id}`) - .then((response) => { - if (response.status === 200) { - setUserGroupData(response.data); - } - }) + loadGroupData(params.id) .catch(error => { console.log(error); return false;