diff --git a/src/components/floor-plan/CanvasFrame.jsx b/src/components/floor-plan/CanvasFrame.jsx index 9441dc7c..20d6a348 100644 --- a/src/components/floor-plan/CanvasFrame.jsx +++ b/src/components/floor-plan/CanvasFrame.jsx @@ -33,6 +33,7 @@ import { compasDegAtom } from '@/store/orientationAtom' import { hotkeyStore } from '@/store/hotkeyAtom' import { usePopup } from '@/hooks/usePopup' import { outerLinePointsState } from '@/store/outerLineAtom' +import { canvasSettingState } from '@/store/canvasAtom' export default function CanvasFrame() { const canvasRef = useRef(null) @@ -59,6 +60,7 @@ export default function CanvasFrame() { const { basicSetting, fetchBasicSettings } = useCanvasSetting() const { selectedMenu, setSelectedMenu } = useCanvasMenu() const { initEvent } = useEvent() + const canvasSetting = useRecoilValue(canvasSettingState) const loadCanvas = () => { if (!canvas) return @@ -82,7 +84,12 @@ export default function CanvasFrame() { setSelectedMenu('module') }, 500) } else if (canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.WALL).length > 0) { - setSelectedMenu('outline') + // canvasSetting.roofSizeSet에 따라 메뉴 결정 + if (canvasSetting?.roofSizeSet === '2') { + setSelectedMenu('surface') // 실측값입력 → surface + } else { + setSelectedMenu('outline') // 복시도입력 → outline + } } else { setTimeout(() => { setSelectedMenu('surface') @@ -121,7 +128,11 @@ export default function CanvasFrame() { if (currentCanvasPlan.planNo) { /* 약간의 지연을 줘서 roofMaterials가 로드될 시간을 확보 */ setTimeout(() => { - fetchBasicSettings(Number(currentCanvasPlan.planNo), null) + // 메뉴 이동 시 canvasSetting이 덮어쓰이는 것을 방지 + // 이미 canvasSetting에 roofSizeSet이 있으면 API 호출 건너뛰기 + if (!canvasSetting?.roofSizeSet) { + fetchBasicSettings(Number(currentCanvasPlan.planNo), null) + } }, 100) } }, [currentCanvasPlan, canvas]) diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx index 97d878a0..be42c977 100644 --- a/src/components/floor-plan/CanvasMenu.jsx +++ b/src/components/floor-plan/CanvasMenu.jsx @@ -426,7 +426,7 @@ export default function CanvasMenu(props) { return ( (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.type === 'outline') || (selectedMenu === 'module' && ['placement', 'outline'].includes(menu.type)) || - (isExistModule() && ['placement', 'outline'].some((num) => num === menu.type)) || + (isExistModule() && canvasSetting?.roofSizeSet !== '1' && ['placement', 'outline'].some((num) => num === menu.type)) || (['estimate', 'simulation'].includes(selectedMenu) && ['placement', 'outline', 'surface'].includes(menu.type)) ) } diff --git a/src/components/floor-plan/FloorPlan.jsx b/src/components/floor-plan/FloorPlan.jsx index 417cc559..6098aec3 100644 --- a/src/components/floor-plan/FloorPlan.jsx +++ b/src/components/floor-plan/FloorPlan.jsx @@ -41,7 +41,7 @@ export default function FloorPlan({ children }) { promiseGet({ url: `/api/object/${objectNo}/detail` }).then((res) => { if (res.status === 200) { const { data } = res - console.log(data) + //console.log(data) let surfaceTypeValue if (res.data.surfaceType === 'Ⅲ・Ⅳ') { diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx index a537b065..14ff26e1 100644 --- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx +++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx @@ -16,7 +16,7 @@ import { globalLocaleStore } from '@/store/localeAtom' import { getChonByDegree, getDegreeByChon } from '@/util/canvas-util' import { usePolygon } from '@/hooks/usePolygon' -import { canvasState, currentMenuState } from '@/store/canvasAtom' +import { canvasState, canvasSettingState, currentMenuState } from '@/store/canvasAtom' import { useCanvasMenu } from '@/hooks/common/useCanvasMenu' import { MENU, POLYGON_TYPE } from '@/common/common' import { useRoofFn } from '@/hooks/common/useRoofFn' @@ -51,6 +51,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla const { drawDirectionArrow } = usePolygon() const { setSurfaceShapePattern } = useRoofFn() const canvas = useRecoilValue(canvasState) + const [canvasSetting, setCanvasSetting] = useRecoilState(canvasSettingState) const roofDisplay = useRecoilValue(roofDisplaySelector) const { setPolygonLinesActualSize } = usePolygon() @@ -167,10 +168,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla }) }, [currentRoof]) - const handleRoofSizeSetChange = (value) => { - setCurrentRoof({ ...currentRoof, roofSizeSet: value }) - } - const handleRoofAngleSetChange = (value) => { setCurrentRoof({ ...currentRoof, roofAngleSet: value }) } @@ -239,12 +236,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla newAddedRoofs[0] = { ...roofInfo } setAddedRoofs(newAddedRoofs) - console.log('save Info', { - ...basicSetting, - selectedRoofMaterial: { - ...newAddedRoofs[0], - }, - }) + // currentRoof의 roofSizeSet을 canvasSetting에 반영 + setCanvasSetting({ ...canvasSetting, roofSizeSet: currentRoof?.roofSizeSet }) /** * 배치면초기설정 저장 (메뉴 변경/useEffect 트리거 없이) @@ -272,7 +265,15 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla /** 지붕면 존재 여부에 따라 메뉴 설정 */ const hasRoofs = canvas.getObjects().some((obj) => obj.name === POLYGON_TYPE.ROOF) - if (hasRoofs) { + + // roofSizeSet에 따라 메뉴 설정 + if (currentRoof?.roofSizeSet === '2') { + setSelectedMenu('surface') + setCurrentMenu(MENU.BATCH_CANVAS.BATCH_DRAWING) + } else if (currentRoof?.roofSizeSet === '1') { + setSelectedMenu('outline') + setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE) + } else if (hasRoofs) { setSelectedMenu('surface') setCurrentMenu(MENU.BATCH_CANVAS.BATCH_DRAWING) } else { diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js index edd74c22..01d49937 100644 --- a/src/hooks/option/useCanvasSetting.js +++ b/src/hooks/option/useCanvasSetting.js @@ -441,15 +441,19 @@ export function useCanvasSetting(executeEffect = true) { setAddedRoofs(addRoofs) if (openPoint !== 'basicSettingSave') { - setCanvasSetting({ - ...basicSetting, - roofMaterials: addRoofs[0], - planNo: roofsRow[0].planNo, - roofSizeSet: roofsRow[0].roofSizeSet, - roofAngleSet: roofsRow[0].roofAngleSet, - roofsData: roofsArray, - selectedRoofMaterial: addRoofs.find((roof) => roof.selected), - }) + // canvasSetting은 현재 값을 유지하고 basicSetting만 업데이트 + // 새로고침 시 canvasSetting이 바뀌는 문제 방지 + if (!canvasSetting?.roofSizeSet) { + setCanvasSetting({ + ...basicSetting, + roofMaterials: addRoofs[0], + planNo: roofsRow[0].planNo, + roofSizeSet: roofsRow[0].roofSizeSet, + roofAngleSet: roofsRow[0].roofAngleSet, + roofsData: roofsArray, + selectedRoofMaterial: addRoofs.find((roof) => roof.selected), + }) + } } } })