diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx index b876d517..63473e9a 100644 --- a/src/components/floor-plan/CanvasMenu.jsx +++ b/src/components/floor-plan/CanvasMenu.jsx @@ -4,7 +4,7 @@ import { useContext, useEffect, useState } from 'react' import { usePathname, useRouter, useSearchParams } from 'next/navigation' -import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' +import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil' import { v4 as uuidv4 } from 'uuid' @@ -98,7 +98,7 @@ export default function CanvasMenu(props) { const [lockButtonStyle, setLockButtonStyle] = useState('') //잠금 버튼 const setFloorPlanObjectNo = useSetRecoilState(floorPlanObjectState) //견적서 화면용 물건번호리코일 - + const resetCommonUtils = useResetRecoilState(commonUtilsState) // 발전시뮬레이션 메뉴 이동 const { objectNo, pid } = floorPlanState @@ -166,6 +166,7 @@ export default function CanvasMenu(props) { } const onClickNav = async (menu) => { + resetCommonUtils() switch (menu.type) { case 'drawing': swalFire({ @@ -241,7 +242,7 @@ export default function CanvasMenu(props) { return } setIsGlobalLoading(true) - promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo??pid}/detail` }).then((res) => { + promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo ?? pid}/detail` }).then((res) => { if (res.status === 200) { const estimateDetail = res.data if (estimateDetail.estimateDate !== null) { @@ -249,7 +250,7 @@ export default function CanvasMenu(props) { setCurrentMenu(menu.title) setFloorPlanObjectNo({ floorPlanObjectNo: objectNo }) setIsGlobalLoading(false) - router.push(`/floor-plan/estimate/5?pid=${selectedPlan?.planNo??pid}&objectNo=${objectNo}`) + router.push(`/floor-plan/estimate/5?pid=${selectedPlan?.planNo ?? pid}&objectNo=${objectNo}`) if (pathname === '/floor-plan/estimate/5') { setIsGlobalLoading(false) } @@ -262,13 +263,13 @@ export default function CanvasMenu(props) { break case 'simulation': setIsGlobalLoading(true) - promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo??pid}/detail` }).then((res) => { + promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo ?? pid}/detail` }).then((res) => { if (res.status === 200) { const estimateDetail = res.data if (estimateDetail.estimateDate !== null && estimateDetail.docNo) { setSelectedMenu(menu.type) setCurrentMenu(menu.title) - router.push(`/floor-plan/simulator/6?pid=${selectedPlan?.planNo??pid}&objectNo=${objectNo}`) + router.push(`/floor-plan/simulator/6?pid=${selectedPlan?.planNo ?? pid}&objectNo=${objectNo}`) if (pathname === '/floor-plan/simulator/6') { setIsGlobalLoading(false) } diff --git a/src/components/floor-plan/MenuDepth01.jsx b/src/components/floor-plan/MenuDepth01.jsx index ae35a3a3..d6bb2477 100644 --- a/src/components/floor-plan/MenuDepth01.jsx +++ b/src/components/floor-plan/MenuDepth01.jsx @@ -5,9 +5,10 @@ import { useEffect } from 'react' import { useMessage } from '@/hooks/useMessage' import useMenu from '@/hooks/common/useMenu' import { canvasState, currentMenuState } from '@/store/canvasAtom' -import { useRecoilState, useRecoilValue } from 'recoil' +import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil' import { subMenusState } from '@/store/menuAtom' import { useCanvasMenu } from '@/hooks/common/useCanvasMenu' +import { commonUtilsState } from '@/store/commonUtilsAtom' export default function MenuDepth01() { const canvas = useRecoilValue(canvasState) @@ -16,8 +17,10 @@ export default function MenuDepth01() { const { selectedMenu, setSelectedMenu } = useCanvasMenu() const [currentMenu, setCurrentMenu] = useRecoilState(currentMenuState) const subMenus = useRecoilValue(subMenusState) + const resetCommonUtils = useResetRecoilState(commonUtilsState) const onClickMenu = ({ id, menu }) => { + resetCommonUtils() if (menu === currentMenu) { handleMenu(selectedMenu) } else { diff --git a/src/hooks/common/useCommonUtils.js b/src/hooks/common/useCommonUtils.js index b5b4ed51..c29fa062 100644 --- a/src/hooks/common/useCommonUtils.js +++ b/src/hooks/common/useCommonUtils.js @@ -1,11 +1,11 @@ import { useEffect } from 'react' -import { useRecoilState, useRecoilValue } from 'recoil' +import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil' import { wordDisplaySelector } from '@/store/settingAtom' import { useEvent } from '@/hooks/useEvent' import { checkLineOrientation, getDistance } from '@/util/canvas-util' import { commonUtilsState, dimensionLineSettingsState } from '@/store/commonUtilsAtom' import { fontSelector } from '@/store/fontAtom' -import { canvasState } from '@/store/canvasAtom' +import { canvasState, currentMenuState } from '@/store/canvasAtom' import { v4 as uuidv4 } from 'uuid' import { usePopup } from '@/hooks/usePopup' import Distance from '@/components/floor-plan/modal/distance/Distance' @@ -16,7 +16,7 @@ import { BATCH_TYPE } from '@/common/common' export function useCommonUtils() { const canvas = useRecoilValue(canvasState) const wordDisplay = useRecoilValue(wordDisplaySelector) - const { addCanvasMouseEventListener, addDocumentEventListener, initEvent } = useEvent() + const { addCanvasMouseEventListener, addDocumentEventListener, initEvent, removeMouseEvent } = useEvent() const dimensionSettings = useRecoilValue(dimensionLineSettingsState) const dimensionLineTextFont = useRecoilValue(fontSelector('dimensionLineText')) const lengthTextFont = useRecoilValue(fontSelector('lengthText')) @@ -27,12 +27,14 @@ export function useCommonUtils() { const { applyDormers } = useObjectBatch({}) useEffect(() => { - if (commonUtils.text || !commonUtils.text) { - commonTextMode() - } else if (commonUtils.dimension) { + commonTextMode() + if (commonUtils.dimension) { commonDimensionMode() - } else if (commonUtils.distance) { + return + } + if (commonUtils.distance) { commonDistanceMode() + return } }, [commonUtils, dimensionSettings, commonTextFont, dimensionLineTextFont]) @@ -72,8 +74,17 @@ export function useCommonUtils() { }) }, 100) } else { + removeMouseEvent('mouse:down') const activeObject = canvas?.getActiveObject() - if (activeObject && activeObject.name === 'commonText') { + const commonTexts = canvas?.getObjects().filter((obj) => obj.name === 'commonText') + if (commonTexts) { + commonTexts.forEach((text) => { + if (text.text === '') { + canvas?.remove(text) + } + }) + } + /*if (activeObject && activeObject.name === 'commonText') { if (activeObject && activeObject.isEditing) { if (activeObject.text === '') { canvas?.remove(activeObject) @@ -87,7 +98,7 @@ export function useCommonUtils() { }) canvas.renderAll() } - } + }*/ initEvent() } diff --git a/src/hooks/usePopup.js b/src/hooks/usePopup.js index c8a43b2a..7d86f947 100644 --- a/src/hooks/usePopup.js +++ b/src/hooks/usePopup.js @@ -1,5 +1,7 @@ -import { useRecoilState } from 'recoil' +import { useRecoilState, useResetRecoilState } from 'recoil' import { contextPopupState, popupState } from '@/store/popupAtom' +import { useEffect } from 'react' +import { commonUtilsState } from '@/store/commonUtilsAtom' /** * 팝업 관리 훅