From c92b65e0f96d957469121b56da7c7e4956798b45 Mon Sep 17 00:00:00 2001 From: yjnoh Date: Fri, 7 Feb 2025 11:35:46 +0900 Subject: [PATCH] =?UTF-8?q?=EC=83=88=20=ED=94=8C=EB=9E=9C=20=EB=8D=B0?= =?UTF-8?q?=EC=9D=B4=ED=84=B0=20=EC=B4=88=EA=B8=B0=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../floor-plan/modal/basic/BasicSetting.jsx | 19 ++++++- .../floor-plan/modal/basic/step/Module.jsx | 2 +- .../floor-plan/modal/basic/step/Placement.jsx | 55 +++++++++++-------- src/hooks/common/useCanvasConfigInitialize.js | 4 +- src/hooks/module/useModuleBasicSetting.js | 17 +++--- src/hooks/module/useModuleTabContents.js | 2 + src/hooks/option/useCanvasSetting.js | 13 +++++ 7 files changed, 75 insertions(+), 37 deletions(-) diff --git a/src/components/floor-plan/modal/basic/BasicSetting.jsx b/src/components/floor-plan/modal/basic/BasicSetting.jsx index 32a673f6..5b464337 100644 --- a/src/components/floor-plan/modal/basic/BasicSetting.jsx +++ b/src/components/floor-plan/modal/basic/BasicSetting.jsx @@ -35,6 +35,8 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) { const currentCanvasPlan = useRecoilValue(currentCanvasPlanState) const canvas = useRecoilValue(canvasState) + const [isClosePopup, setIsClosePopup] = useState({ close: false, id: 0 }) + // const { initEvent } = useContext(EventContext) const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup } = useModuleBasicSetting(1) const { updateObjectDate } = useMasterController() @@ -110,20 +112,33 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) { } }, []) + //팝업 닫기 버튼 이벤트 + const handleClosePopup = (id) => { + if (tabNum == 3) { + if (isManualModuleSetup) { + setIsManualModuleSetup(false) + } + } + setIsClosePopup({ close: true, id: id }) + } + useEffect(() => { if (canvasSetting.roofSizeSet !== '3') { manualModuleSetup(placementRef) } else { manualFlatroofModuleSetup(placementFlatRef) } - }, [isManualModuleSetup]) + if (isClosePopup.close) { + closePopup(isClosePopup.id) + } + }, [isManualModuleSetup, isClosePopup]) return (

{getMessage('plan.menu.module.circuit.setting.default')}

-
diff --git a/src/components/floor-plan/modal/basic/step/Module.jsx b/src/components/floor-plan/modal/basic/step/Module.jsx index 347e4c69..45e99dff 100644 --- a/src/components/floor-plan/modal/basic/step/Module.jsx +++ b/src/components/floor-plan/modal/basic/step/Module.jsx @@ -58,9 +58,9 @@ export default function Module({ setTabNum }) { useEffect(() => { if (tempModuleSelectionData.roofConstructions.length > 0) { if (tempModuleSelectionData.common.moduleItemId && isObjectNotEmpty(tempModuleSelectionData.module)) { + setModuleSelectionData(tempModuleSelectionData) //저장된 temp데이터가 지붕재(addedRoofs) 개수와 같으면 모듈 선택 저장 if (tempModuleSelectionData.roofConstructions.length === addedRoofs.length) { - setModuleSelectionData(tempModuleSelectionData) moduleSelectedDataTrigger(tempModuleSelectionData) } } diff --git a/src/components/floor-plan/modal/basic/step/Placement.jsx b/src/components/floor-plan/modal/basic/step/Placement.jsx index db153bbf..cc41437f 100644 --- a/src/components/floor-plan/modal/basic/step/Placement.jsx +++ b/src/components/floor-plan/modal/basic/step/Placement.jsx @@ -2,8 +2,10 @@ import { forwardRef, useEffect, useState } from 'react' import { useMessage } from '@/hooks/useMessage' import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting' import { checkedModuleState, currentCanvasPlanState } from '@/store/canvasAtom' -import { useRecoilValue, useSetRecoilState } from 'recoil' -import { moduleSelectionDataState } from '@/store/selectedModuleOptions' +import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' +import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' +import { isObjectNotEmpty } from '@/util/common-utils' +import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController' const Placement = forwardRef((props, refs) => { const { getMessage } = useMessage() @@ -14,11 +16,13 @@ const Placement = forwardRef((props, refs) => { const [isMaxSetup, setIsMaxSetup] = useState('false') const [selectedItems, setSelectedItems] = useState({}) - const { selectedModules } = useModuleBasicSetting(3) + const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState) const setCheckedModules = useSetRecoilState(checkedModuleState) const moduleSelectionData = useRecoilValue(moduleSelectionDataState) + const { trigger: moduleSelectedDataTrigger } = useCanvasPopupStatusController(2) + //모듈 배치면 생성 useEffect(() => { if (moduleSelectionData) { @@ -30,14 +34,32 @@ const Placement = forwardRef((props, refs) => { } }, []) + //최초 지입시 체크 + useEffect(() => { + if (moduleSelectionData.roofConstructions.length > 0 && moduleSelectionData.module.itemList.length > 0) { + let initCheckedModule = {} + moduleSelectionData.module.itemList.forEach((obj, index) => { + if (index === 0) { + initCheckedModule = { [obj.itemId]: true } + } else { + initCheckedModule = { ...initCheckedModule, [obj.itemId]: true } + } + }) + setSelectedItems(initCheckedModule) + setSelectedModules(moduleSelectionData.module) + } + }, [moduleSelectionData]) + //체크된 모듈 데이터 useEffect(() => { - const checkedModuleIds = Object.keys(selectedItems).filter((key) => selectedItems[key]) - const moduleArray = selectedModules.itemList.filter((item) => { - return checkedModuleIds.includes(item.itemId) - }) - setCheckedModules(moduleArray) - }, [selectedItems]) + if (isObjectNotEmpty(selectedItems) && isObjectNotEmpty(selectedModules)) { + const checkedModuleIds = Object.keys(selectedItems).filter((key) => selectedItems[key]) + const moduleArray = selectedModules.itemList.filter((item) => { + return checkedModuleIds.includes(item.itemId) + }) + setCheckedModules(moduleArray) + } + }, [selectedItems, selectedModules]) const moduleData = { header: [ @@ -74,21 +96,6 @@ const Placement = forwardRef((props, refs) => { setSelectedItems({ ...selectedItems, [e.target.name]: e.target.checked }) } - //최초 지입시 체크 - useEffect(() => { - if (moduleSelectionData && moduleSelectionData.module.itemList.length > 0) { - let initCheckedModule = {} - moduleSelectionData.module.itemList.forEach((obj, index) => { - if (index === 0) { - initCheckedModule = { [obj.itemId]: true } - } else { - initCheckedModule = { ...initCheckedModule, [obj.itemId]: true } - } - }) - setSelectedItems(initCheckedModule) - } - }, []) - return ( <>
diff --git a/src/hooks/common/useCanvasConfigInitialize.js b/src/hooks/common/useCanvasConfigInitialize.js index 5ffcd4c5..37461421 100644 --- a/src/hooks/common/useCanvasConfigInitialize.js +++ b/src/hooks/common/useCanvasConfigInitialize.js @@ -204,8 +204,8 @@ export function useCanvasConfigInitialize() { .forEach((obj) => { obj.set({ selectable: true, - lockMovementX: false, - lockMovementY: false, + lockMovementX: true, + lockMovementY: true, }) obj.setViewLengthText(false) }) diff --git a/src/hooks/module/useModuleBasicSetting.js b/src/hooks/module/useModuleBasicSetting.js index 9739c1f5..926336ec 100644 --- a/src/hooks/module/useModuleBasicSetting.js +++ b/src/hooks/module/useModuleBasicSetting.js @@ -60,16 +60,14 @@ export function useModuleBasicSetting(tabNum) { //모듈 선택에서 선택된 값들 넘어옴 useEffect(() => { - if (moduleSelectionData && tabNum === 3) { + if (moduleSelectionData) { if (canvasSetting.roofSizeSet !== '3') { const common = moduleSelectionData.common - const roofConstructions = moduleSelectionData.roofConstructions - const listParams = roofConstructions.map((item) => { return { ...common, - moduleTpCd: selectedModules.itemTp, + // moduleTpCd: selectedModules.itemTp, roofMatlCd: item.trestle.roofMatlCd, trestleMkrCd: item.trestle.trestleMkrCd, constMthdCd: item.trestle.constMthdCd, @@ -90,7 +88,6 @@ export function useModuleBasicSetting(tabNum) { } } else { //육지붕 일경우에는 바로 배치면 설치LL - const roofs = canvas.getObjects().filter((roof) => roof.name === 'roof') canvas .getObjects() .filter((roof) => roof.name === 'roof') @@ -196,9 +193,7 @@ export function useModuleBasicSetting(tabNum) { }) const isExistSurface = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.parentId === roof.id) - if (isExistSurface) { - return - } + canvas.remove(isExistSurface) let offsetLength = canvasSetting.roofSizeSet === '3' ? -30 : (trestleDetail.eaveIntvl / 10) * -1 setSurfaceShapePattern(roof, roofDisplay.column, true) //패턴 변경 @@ -257,6 +252,12 @@ export function useModuleBasicSetting(tabNum) { canvas.renderAll() + //바로 들어올때 + const setupModules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE) + setupModules.forEach((obj) => { + canvas.bringToFront(obj) + }) + //모듈설치면 클릭이벤트 addTargetMouseEventListener('mousedown', setupSurface, function () { toggleSelection(setupSurface) diff --git a/src/hooks/module/useModuleTabContents.js b/src/hooks/module/useModuleTabContents.js index 2c3e16d4..7f1961bb 100644 --- a/src/hooks/module/useModuleTabContents.js +++ b/src/hooks/module/useModuleTabContents.js @@ -95,6 +95,8 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab }) setRaftCodes(raftCodeList) + console.log('addRoof', addRoof) + if (addRoof.raft) { setSelectedRaftBase({ ...selectedRaftBase, diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js index 07f46740..e4b105ad 100644 --- a/src/hooks/option/useCanvasSetting.js +++ b/src/hooks/option/useCanvasSetting.js @@ -36,6 +36,7 @@ import { useCanvasMenu } from '../common/useCanvasMenu' import { menuTypeState } from '@/store/menuAtom' import { usePopup } from '../usePopup' import { FloorPlanContext } from '@/app/floor-plan/FloorPlanProvider' +import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' const defaultDotLineGridSetting = { INTERVAL: { @@ -114,6 +115,10 @@ export function useCanvasSetting() { const [fetchRoofMaterials, setFetchRoofMaterials] = useRecoilState(fetchRoofMaterialsState) const [type, setType] = useRecoilState(menuTypeState) const setCurrentMenu = useSetRecoilState(currentMenuState) + + const resetModuleSelectionData = useResetRecoilState(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터 + const resetSelectedModules = useResetRecoilState(selectedModuleState) //선택된 모듈 + const SelectOptions = [ { id: 1, name: getMessage('modal.canvas.setting.grid.dot.line.setting.line.origin'), value: 1 }, { id: 2, name: '1/2', value: 1 / 2 }, @@ -446,6 +451,14 @@ export function useCanvasSetting() { setType('outline') setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE) } + + //모듈 선택 데이터 초기화 + resetModuleSelectionData() + + const isModuleExist = canvas.getObjects().some((obj) => obj.name === POLYGON_TYPE.MODULE) + if (!isModuleExist) { + resetSelectedModules() + } } catch (error) { swalFire({ text: error.message, icon: 'error' }) }