diff --git a/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx b/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx index 9f0cb4449..9c9cd80d9 100644 --- a/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx +++ b/client/src/hooks/useMemberReportListInAction/useMemberReportInput.tsx @@ -26,7 +26,7 @@ const useMemberReportInput = ({ const [inputList, setInputList] = useState(data.map((item, index) => ({...item, index}))); const [canSubmit, setCanSubmit] = useState(false); - const [canEditList, setCanEditList] = useState(new Array(data.length).fill(true)); + const [canEditList, setCanEditList] = useState([]); const onChange = (event: React.ChangeEvent, index: number) => { const {value} = event.target; @@ -36,7 +36,6 @@ const useMemberReportInput = ({ const validateAndAddAdjustedMember = (price: string, index: number) => { const {isValid} = validateMemberReportInAction(price, totalPrice); - setCanSubmit(isValid); if (isValid) { const newInputList = [...inputList]; @@ -52,6 +51,14 @@ const useMemberReportInput = ({ } }; + // 서버와 값이 같지 않고 input price의 상태가 모두 valid하다면 can submit true + useEffect(() => { + const isSamePriceState = getIsSamePriceStateAndServerState(); + const isAllValid = inputList.every(input => validateMemberReportInAction(String(input.price), totalPrice)); + + setCanSubmit(!isSamePriceState && isAllValid); + }, [inputList]); + // addAdjustedMember로 인해 data가 변했을 때 input list의 값을 맞춰주기 위함 useEffect(() => { setCanSubmit(!getIsSamePriceStateAndServerState()); @@ -59,6 +66,11 @@ const useMemberReportInput = ({ // 남은 인원이 1명일 때 수정을 불가능하도록 설정 const onlyOneIndex = getOnlyOneNotAdjustedRemainMemberIndex(); + + if (data.length !== 0) { + setCanEditList(new Array(data.length).fill(true)); + } + if (onlyOneIndex !== null) { const newCanEditList = new Array(data.length).fill(true); newCanEditList[onlyOneIndex] = false; diff --git a/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts b/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts index 3d332ea25..c9e16ff3b 100644 --- a/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts +++ b/client/src/hooks/useMemberReportListInAction/useMemberReportListInAction.ts @@ -34,10 +34,10 @@ const useMemberReportListInAction = (actionId: number, totalPrice: number) => { useEffect(() => { const totalPriceFromServer = memberReportListInActionFromServer.reduce((acc, cur) => acc + cur.price, 0); - if (totalPriceFromServer !== totalPrice) { + if (totalPriceFromServer !== totalPrice && totalPriceFromServer !== 0) { reCalculatePriceByTotalPriceChange(); } - }, [totalPrice]); + }, [totalPrice, memberReportListInActionFromServer]); useEffect(() => { if (queryResult.isSuccess) {