diff --git a/src/hooks/common/useRoofFn.js b/src/hooks/common/useRoofFn.js index 95af888c..54ebaecb 100644 --- a/src/hooks/common/useRoofFn.js +++ b/src/hooks/common/useRoofFn.js @@ -1,10 +1,11 @@ -import { useRecoilValue } from 'recoil' +import { useRecoilValue, useResetRecoilState } from 'recoil' import { canvasState, currentObjectState } from '@/store/canvasAtom' import { selectedRoofMaterialSelector } from '@/store/settingAtom' import { ROOF_MATERIAL_LAYOUT } from '@/components/floor-plan/modal/placementShape/PlacementShapeSetting' import { POLYGON_TYPE } from '@/common/common' import { useEvent } from '@/hooks/useEvent' import { useLine } from '@/hooks/useLine' +import { outerLinePointsState } from '@/store/outerLineAtom' const ROOF_COLOR = { 0: 'rgb(199,240,213)', @@ -17,6 +18,7 @@ export function useRoofFn() { const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector) const currentObject = useRecoilValue(currentObjectState) const { addCanvasMouseEventListener, initEvent } = useEvent() + const resetPoints = useResetRecoilState(outerLinePointsState) const { addPitchText } = useLine() //면형상 선택 클릭시 지붕 패턴 입히기 @@ -332,6 +334,7 @@ export function useRoofFn() { }) canvas.renderAll() + resetPoints() } return { setSurfaceShapePattern, removeRoofMaterial, removeAllRoofMaterial, moveRoofMaterial, removeOuterLines } diff --git a/src/hooks/roofcover/usePropertiesSetting.js b/src/hooks/roofcover/usePropertiesSetting.js index 425f0642..57aadd6d 100644 --- a/src/hooks/roofcover/usePropertiesSetting.js +++ b/src/hooks/roofcover/usePropertiesSetting.js @@ -7,6 +7,9 @@ import { usePolygon } from '@/hooks/usePolygon' import { useLine } from '@/hooks/useLine' import { outerLinePointsState } from '@/store/outerLineAtom' import { usePopup } from '@/hooks/usePopup' +import PropertiesSetting from '@/components/floor-plan/modal/outerlinesetting/PropertiesSetting' +import RoofShapeSetting from '@/components/floor-plan/modal/roofShape/RoofShapeSetting' +import RoofAllocationSetting from '@/components/floor-plan/modal/roofAllocation/RoofAllocationSetting' // 외벽선 속성 설정 export function usePropertiesSetting(id) { @@ -19,7 +22,7 @@ export function usePropertiesSetting(id) { const { addPolygonByLines } = usePolygon() const { removeLine, hideLine } = useLine() - const { closePopup } = usePopup() + const { addPopup, closePopup } = usePopup() useEffect(() => { const lines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') @@ -134,7 +137,8 @@ export function usePropertiesSetting(id) { }) }) canvas.discardActiveObject() - closePopup(id) + // closePopup(id) + addPopup(id, 1, ) return } @@ -157,10 +161,7 @@ export function usePropertiesSetting(id) { setPoints([]) canvas.renderAll() roof.drawHelpLine() - - closePopup(id) - return - } else { + addPopup(id, 1, ) return } } diff --git a/src/hooks/roofcover/useRoofAllocationSetting.js b/src/hooks/roofcover/useRoofAllocationSetting.js index c4fe1f39..dc14f2b0 100644 --- a/src/hooks/roofcover/useRoofAllocationSetting.js +++ b/src/hooks/roofcover/useRoofAllocationSetting.js @@ -1,4 +1,4 @@ -import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' +import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil' import { canvasState, currentAngleTypeSelector, currentMenuState, currentObjectState } from '@/store/canvasAtom' import { useEffect, useRef, useState } from 'react' import { useAxios } from '@/hooks/useAxios' @@ -26,6 +26,7 @@ import { globalLocaleStore } from '@/store/localeAtom' import { getChonByDegree, getDegreeByChon } from '@/util/canvas-util' import { moduleSelectionDataState } from '@/store/selectedModuleOptions' import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController' +import { outerLinePointsState } from '@/store/outerLineAtom' // 지붕면 할당 export function useRoofAllocationSetting(id) { @@ -55,6 +56,7 @@ export function useRoofAllocationSetting(id) { const { setSurfaceShapePattern } = useRoofFn() const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) + const resetPoints = useResetRecoilState(outerLinePointsState) useEffect(() => { setCurrentRoofList(roofList) @@ -256,6 +258,7 @@ export function useRoofAllocationSetting(id) { addPopup(popupId, 1, ) } else { apply() + resetPoints() } } diff --git a/src/hooks/roofcover/useRoofShapeSetting.js b/src/hooks/roofcover/useRoofShapeSetting.js index 125d3d91..2a36e23e 100644 --- a/src/hooks/roofcover/useRoofShapeSetting.js +++ b/src/hooks/roofcover/useRoofShapeSetting.js @@ -10,6 +10,7 @@ import { outerLineFixState } from '@/store/outerLineAtom' import { useSwal } from '@/hooks/useSwal' import { usePopup } from '@/hooks/usePopup' import { getChonByDegree } from '@/util/canvas-util' +import RoofAllocationSetting from '@/components/floor-plan/modal/roofAllocation/RoofAllocationSetting' // 지붕형상 설정 export function useRoofShapeSetting(id) { @@ -46,7 +47,7 @@ export function useRoofShapeSetting(id) { const jerkinHeadPitchRef = useRef(null) const history = useRef([]) - const { closePopup } = usePopup() + const { closePopup, addPopup } = usePopup() useEffect(() => { pitchRef.current = currentAngleType === ANGLE_TYPE.SLOPE ? pitch : getChonByDegree(pitch) @@ -436,7 +437,7 @@ export function useRoofShapeSetting(id) { canvas?.renderAll() roof.drawHelpLine() isFixRef.current = true - closePopup(id) + addPopup(id, 1, ) } const initLineSetting = () => { @@ -568,6 +569,7 @@ export function useRoofShapeSetting(id) { pitch: pitchRef.current, offset: eavesOffset / 10, } + selectedLine.attributes = { ...attributes, isFixed: true } addPitchText(currentObject) selectedLine.set({ strokeWidth: 4 }) selectedLine.set({ stroke: '#45CD7D' }) @@ -579,6 +581,7 @@ export function useRoofShapeSetting(id) { type: LINE_TYPE.WALLLINE.GABLE, offset: gableOffset / 10, } + selectedLine.attributes = { ...attributes, isFixed: true } selectedLine.set({ strokeWidth: 4 }) selectedLine.set({ stroke: '#3FBAE6' }) break @@ -590,6 +593,7 @@ export function useRoofShapeSetting(id) { width: hasSleeve === '0' ? 0 : sleeveOffset / 10, sleeve: hasSleeve === '1', } + selectedLine.attributes = { ...attributes, isFixed: true } break } case 4: { @@ -600,6 +604,7 @@ export function useRoofShapeSetting(id) { offset: eavesOffset / 10, width: hipAndGableWidth / 10, } + selectedLine.attributes = { ...attributes, isFixed: true } addPitchText(currentObject) selectedLine.set({ strokeWidth: 4 }) selectedLine.set({ stroke: '#45CD7D' }) @@ -613,6 +618,7 @@ export function useRoofShapeSetting(id) { width: jerkinHeadWidth / 10, pitch: jerkinHeadPitchRef.current, } + selectedLine.attributes = { ...attributes, isFixed: true } addPitchText(currentObject) selectedLine.set({ strokeWidth: 4 }) selectedLine.set({ stroke: '#3FBAE6' }) @@ -625,13 +631,13 @@ export function useRoofShapeSetting(id) { pitch: shedPitchRef.current, width: shedWidth / 10, } + selectedLine.attributes = { ...attributes, isFixed: true } addPitchText(currentObject) selectedLine.set({ strokeWidth: 4 }) selectedLine.set({ stroke: '#000000' }) break } } - selectedLine.attributes = { ...attributes, isFixed: true } canvas.renderAll() nextLineFocus(selectedLine) @@ -643,7 +649,7 @@ export function useRoofShapeSetting(id) { const index = lines.findIndex((line) => line.idx === selectedLine.idx) const nextLine = lines[index + 1] || lines[0] - if (nextLine.attributes.isFixed) { + if (nextLine.attributes?.isFixed) { canvas.discardActiveObject() return }