From dc716809f2aa9825bd9645233366c2df8d81ee6d Mon Sep 17 00:00:00 2001 From: yoosangwook Date: Sat, 8 Feb 2025 16:51:32 +0900 Subject: [PATCH] =?UTF-8?q?=F0=9F=93=8Cfix:=20popupstatus=20hooks=20?= =?UTF-8?q?=EA=B5=AC=EC=A1=B0=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/floor-plan/CanvasFrame.jsx | 3 + .../common/useCanvasPopupStatusController.js | 132 +++++++++++------- 2 files changed, 83 insertions(+), 52 deletions(-) diff --git a/src/components/floor-plan/CanvasFrame.jsx b/src/components/floor-plan/CanvasFrame.jsx index bc0b403b..5b3581e8 100644 --- a/src/components/floor-plan/CanvasFrame.jsx +++ b/src/components/floor-plan/CanvasFrame.jsx @@ -25,6 +25,7 @@ import { selectedModelsState, seriesState, } from '@/store/circuitTrestleAtom' +import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController' export default function CanvasFrame() { const canvasRef = useRef(null) @@ -43,6 +44,7 @@ export default function CanvasFrame() { const resetModelsState = useResetRecoilState(modelsState) const resetSelectedModelsState = useResetRecoilState(selectedModelsState) const resetPcsCheckState = useResetRecoilState(pcsCheckState) + const { handleModuleSelectionTotal } = useCanvasPopupStatusController() const loadCanvas = () => { if (canvas) { canvas?.clear() // 캔버스를 초기화합니다. @@ -59,6 +61,7 @@ export default function CanvasFrame() { useEffect(() => { loadCanvas() resetRecoilData() + Object.keys(currentCanvasPlan).length > 0 && handleModuleSelectionTotal() }, [currentCanvasPlan, canvas]) useEffect(() => { diff --git a/src/hooks/common/useCanvasPopupStatusController.js b/src/hooks/common/useCanvasPopupStatusController.js index e4b2cc46..e8584950 100644 --- a/src/hooks/common/useCanvasPopupStatusController.js +++ b/src/hooks/common/useCanvasPopupStatusController.js @@ -1,12 +1,11 @@ 'use client' -import { useEffect } from 'react' import { useRecoilState, useRecoilValue } from 'recoil' import useSWR from 'swr' import useSWRMutation from 'swr/mutation' import { useAxios } from '../useAxios' import { unescapeString } from '@/util/common-utils' -import { moduleSelectionDataState } from '@/store/selectedModuleOptions' +import { moduleSelectionDataState, moduleSelectionTotalState } from '@/store/selectedModuleOptions' import { compasDegAtom } from '@/store/orientationAtom' import { currentCanvasPlanState } from '@/store/canvasAtom' @@ -17,62 +16,91 @@ export function useCanvasPopupStatusController(param = 1) { const [moduleSelectionDataStore, setModuleSelectionDataStore] = useRecoilState(moduleSelectionDataState) const { getFetcher, postFetcher } = useAxios() + const [moduleSelectionTotal, setModuleSelectionTotal] = useRecoilState(moduleSelectionTotalState) + const currentCanvasPlan = useRecoilValue(currentCanvasPlanState) // console.log('🚀 ~ Orientation ~ currentCanvasPlan:', currentCanvasPlan) - const { - data: popupStatus, - error, - isLoading, - } = useSWR( - popupType ? `/api/v1/canvas-popup-status?objectNo=${currentCanvasPlan.objectNo}&planNo=${currentCanvasPlan.planNo}&popupType=${popupType}` : null, - getFetcher, - ) + /** + * 팝업 상태 조회 + * @param {number} popupTypeParam + * @returns + */ + const getModuleSelection = async (popupTypeParam) => { + const { + data: popupStatus, + error, + isLoading, + } = useSWR( + `/api/v1/canvas-popup-status?objectNo=${currentCanvasPlan.objectNo}&planNo=${currentCanvasPlan.planNo}&popupType=${popupTypeParam}`, + getFetcher, + ) - useEffect(() => { - // console.log('🚀 ~ useEffect ~ popupStatus:', popupStatus) - if (popupStatus) { - switch (parseInt(popupStatus?.popupType)) { - case 1: - setCompasDeg(popupStatus.popupStatus) - break - case 2: - setModuleSelectionDataStore(JSON.parse(unescapeString(popupStatus.popupStatus))) - break - case 3: - break - case 4: - break - case 5: - break - case 6: - break - default: - } - } else { - switch (popupType) { - case 1: - setCompasDeg(0) - break - case 2: - setModuleSelectionDataStore({ - common: {}, - roofConstructions: [], - }) - break - case 3: - break - case 4: - break - case 5: - break - case 6: - break - default: + return popupStatus + } + + /** + * 전체 팝업 상태 조회 + * 조회 후 전체 데이터 recoil에 저장 + */ + const handleModuleSelectionTotal = async () => { + for (let i = 1; i < 3; i++) { + const result = await getModuleSelection(i) + // setModuleSelectionTotal((prev) => ({ ...prev, [i]: JSON.parse(unescapeString(result.popupStatus)) })) + if (i === 1) { + setCompasDeg(result.popupStatus) + } else if (i === 2) { + setModuleSelectionDataStore(JSON.parse(unescapeString(result.popupStatus))) } } - }, [popupStatus]) + } + // useEffect(() => { + // if (popupStatus) { + // switch (parseInt(popupStatus?.popupType)) { + // case 1: + // setCompasDeg(popupStatus.popupStatus) + // break + // case 2: + // setModuleSelectionDataStore(JSON.parse(unescapeString(popupStatus.popupStatus))) + // break + // case 3: + // break + // case 4: + // break + // case 5: + // break + // case 6: + // break + // default: + // } + // } else { + // switch (popupType) { + // case 1: + // setCompasDeg(0) + // break + // case 2: + // setModuleSelectionDataStore({ + // common: {}, + // roofConstructions: [], + // }) + // break + // case 3: + // break + // case 4: + // break + // case 5: + // break + // case 6: + // break + // default: + // } + // } + // }, [popupStatus]) + + /** + * 팝업 상태 저장 + */ const { trigger, isMutating } = useSWRMutation( `/api/v1/canvas-popup-status?objectNo=${currentCanvasPlan.objectNo}&planNo=${currentCanvasPlan.planNo}&popupType=${popupType}`, (url, { arg }) => { @@ -86,5 +114,5 @@ export function useCanvasPopupStatusController(param = 1) { }, ) - return { trigger } + return { handleModuleSelectionTotal, trigger } }