From 9ab0a964836b29dfec43d5485d7ab723b99249d9 Mon Sep 17 00:00:00 2001 From: JinHo Kim <81083461+jinhokim98@users.noreply.github.com> Date: Wed, 21 Aug 2024 14:14:18 +0900 Subject: [PATCH] =?UTF-8?q?fix:=20=EC=B0=A8=EB=93=B1=20=EC=A0=81=EC=9A=A9?= =?UTF-8?q?=20can=20submit=EC=9D=B4=20valid=20=ED=95=98=EC=A7=80=EB=A7=8C?= =?UTF-8?q?=20false=EB=90=98=EB=8A=94=20=EB=B2=84=EA=B7=B8=20(#428)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: 0원을 허용하도록 수정 * feat: 총 금액이 변동됐을 때 재계산을 실행하는 기능 추가 * feat: 하나라도 조정값이 있는지를 판단하는 기능 추가 * test: 조정된 값이 있는지 여부를 주는 기능 test 작성 * feat: 조정되지 않은 인원이 1명일 때, input을 막아버리는 기능 추가 * feat: 서버상태와 클라이언트 상태 가격이 전부 동일하면 can submit false 기능 추가 * fix: input list가 변했을 때 can submit이 돌도록 변경 * fix: 데이터가 없을 때 초기화 되어버리는 현상 해결 --- .../useMemberReportInput.tsx | 16 ++++++++++++++-- .../useMemberReportListInAction.ts | 4 ++-- 2 files changed, 16 insertions(+), 4 deletions(-) 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<MemberReportInput[]>(data.map((item, index) => ({...item, index}))); const [canSubmit, setCanSubmit] = useState<boolean>(false); - const [canEditList, setCanEditList] = useState<boolean[]>(new Array(data.length).fill(true)); + const [canEditList, setCanEditList] = useState<boolean[]>([]); const onChange = (event: React.ChangeEvent<HTMLInputElement>, 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) {