From 21e570c8c97b8aaa45c5713af44bdd30e8018f56 Mon Sep 17 00:00:00 2001 From: minsik Date: Tue, 22 Oct 2024 10:50:50 +0900 Subject: [PATCH] =?UTF-8?q?grid=20option=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/roof2/page.jsx | 2 +- .../common/color-picker/ColorPickerModal.jsx | 1 - src/components/floor-plan/CanvasFrame.jsx | 1 - src/components/floor-plan/CanvasMenu.jsx | 18 +---- .../floor-plan/modal/setting01/GridOption.jsx | 73 ++++--------------- src/hooks/usePopup.js | 1 - 6 files changed, 17 insertions(+), 79 deletions(-) diff --git a/src/app/roof2/page.jsx b/src/app/roof2/page.jsx index 72881d11..af24acfa 100644 --- a/src/app/roof2/page.jsx +++ b/src/app/roof2/page.jsx @@ -1,6 +1,6 @@ import Roof2 from '@/components/Roof2' -import RoofSelect from '@/app/[locale]/roof2/RoofSelect' import { initCheck } from '@/util/session-util' +import RoofSelect from '@/app/roof2/RoofSelect' export default async function Roof2Page() { const session = await initCheck() diff --git a/src/components/common/color-picker/ColorPickerModal.jsx b/src/components/common/color-picker/ColorPickerModal.jsx index fe16896f..22a3c5c4 100644 --- a/src/components/common/color-picker/ColorPickerModal.jsx +++ b/src/components/common/color-picker/ColorPickerModal.jsx @@ -10,7 +10,6 @@ export default function ColorPickerModal(props) { const [originColor, setOriginColor] = useState(color) const { closePopup } = usePopup() - console.log(props) useEffect(() => { setOriginColor(color) }, [isShow]) diff --git a/src/components/floor-plan/CanvasFrame.jsx b/src/components/floor-plan/CanvasFrame.jsx index b7d9a5da..ef01987a 100644 --- a/src/components/floor-plan/CanvasFrame.jsx +++ b/src/components/floor-plan/CanvasFrame.jsx @@ -12,7 +12,6 @@ import QContextMenu from '@/components/common/context-menu/QContextMenu' export default function CanvasFrame({ plan }) { const canvasRef = useRef(null) - console.log(canvasRef) const { canvas } = useCanvas('canvas') const { handleZoomClear } = useCanvasEvent() const { contextMenu, currentContextMenu, setCurrentContextMenu } = useContextMenu({ diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx index c2f70f1d..5846a8ff 100644 --- a/src/components/floor-plan/CanvasMenu.jsx +++ b/src/components/floor-plan/CanvasMenu.jsx @@ -15,20 +15,18 @@ import { canvasState, canvasZoomState, currentCanvasPlanState, currentMenuState, import { sessionStore } from '@/store/commonAtom' import { outerLinePointsState } from '@/store/outerLineAtom' import { appMessageStore, globalLocaleStore } from '@/store/localeAtom' -import { wordDisplaySelector } from '@/store/settingAtom' +import { settingModalFirstOptionsState, wordDisplaySelector } from '@/store/settingAtom' import { MENU } from '@/common/common' import { checkLineOrientation, getDistance } from '@/util/canvas-util' import KO from '@/locales/ko.json' import JA from '@/locales/ja.json' -import { settingModalFirstOptionsState } from '@/store/settingAtom' import { useCanvasEvent } from '@/hooks/useCanvasEvent' import { popupState } from '@/store/popupAtom' import SettingModal01 from '@/components/floor-plan/modal/setting01/SettingModal01' import { usePopup } from '@/hooks/usePopup' import { placementShapeDrawingPointsState } from '@/store/placementShapeDrawingAtom' -import { lineSegment } from '@turf/turf' const canvasMenus = [ { index: 0, name: 'plan.menu.plan.drawing', icon: 'con00', title: MENU.PLAN_DRAWING }, @@ -95,19 +93,7 @@ export default function CanvasMenu(props) { const [popup, setPopup] = useRecoilState(popupState) const SelectOption = [{ name: '瓦53A' }, { name: '瓦53A' }] - useEffect(() => { - console.log(canvas) - if (canvas) { - const circle = new fabric.Circle({ - left: 300, - top: 300, - radius: 5, - stroke: 'black', - }) - canvas.add(circle) - canvas.renderAll() - } - }, []) + const onClickNav = (menu) => { setMenuNumber(menu.index) setCurrentMenu(menu.title) diff --git a/src/components/floor-plan/modal/setting01/GridOption.jsx b/src/components/floor-plan/modal/setting01/GridOption.jsx index 0082675e..5edb2167 100644 --- a/src/components/floor-plan/modal/setting01/GridOption.jsx +++ b/src/components/floor-plan/modal/setting01/GridOption.jsx @@ -21,17 +21,9 @@ export default function GridOption() { const [color, setColor] = useColor(gridColor) const [showColorPickerModal, setShowColorPickerModal] = useState(false) const [showDotLineGridModal, setShowDotLineGridModal] = useState(false) - const { addPopup, closePopup } = usePopup() - // const [colorId, setColorId] = useState(uuidv4()) - // const [dotLineId, setDotLineId] = useState(uuidv4()) - - let colorId = null - let dotLineId = null - - useEffect(() => { - colorId = uuidv4() - dotLineId = uuidv4() - }, []) + const { addPopup, closePopup, closePopups } = usePopup() + const [colorId, setColorId] = useState(uuidv4()) + const [dotLineId, setDotLineId] = useState(uuidv4()) useEffect(() => { setGridColor(color.hex) @@ -43,7 +35,7 @@ export default function GridOption() { }, [showColorPickerModal]) useEffect(() => { - gridOptions[2].selected = showDotLineGridModal + gridOptions[1].selected = showDotLineGridModal setGridOptions([...gridOptions]) }, [showDotLineGridModal]) @@ -63,13 +55,11 @@ export default function GridOption() { const newGridOptions = [...gridOptions] // 초기화 - setShowColorPickerModal(false) - setShowDotLineGridModal(false) + // setShowColorPickerModal(false) + // setShowDotLineGridModal(false) setTempGridMode(false) setAdsorptionPointAddMode(false) - closePopup(dotLineId) - closePopup(colorId) - // + closePopups([colorId, dotLineId]) newGridOptions.forEach((item) => { if (item.id === id) { @@ -78,65 +68,30 @@ export default function GridOption() { item.selected = false } }) - console.log(colorId, dotLineId) - newGridOptions.map((item) => { - if (item.id === option.id) { - item.selected = !item.selected - } - }) - - if (option.id === 1) { - // 점 그리드 - setAdsorptionPointAddMode(false) - setTempGridMode(option.selected) - newGridOptions[2].selected = false - } - const selectedOption = newGridOptions.find((item) => item.id === option.id) if (selectedOption.id === 1) { // 임의 그리드 모드 - setTempGridMode(selectedOption.selected) + // setAdsorptionPointAddMode(false) + setTempGridMode(option.selected) + // newGridOptions[2].selected = false } else if (selectedOption.id === 2) { // 점 선 그리드 설정 모달 setShowDotLineGridModal(selectedOption.selected) - addPopup(dotLineId, 2, ) + + addPopup(dotLineId, 2, ) } else if (selectedOption.id === 3) { // 흡착점 모드 setAdsorptionPointAddMode(selectedOption.selected) } else if (selectedOption.id === 4) { // 그리드 색 설정 모달 setShowColorPickerModal(selectedOption.selected) - addPopup(colorId, 2, ) - if (option.id === 2) { - // 점.선 그리드 - if (option.selected) { - addPopup(dotLineId, 2, ) - } else { - closePopup(dotLineId) - } - } - - if (option.name === 'modal.canvas.setting.grid.absorption.add') { - setAdsorptionPointAddMode(!adsorptionPointAddMode) - setTempGridMode(false) - newGridOptions[0].selected = false - } - - if (option.id === 4) { - // 그리드 색 설정 - if (option.selected) { - setShowColorPickerModal(true) - addPopup(colorId, 2, ) - } else { - setShowColorPickerModal(false) - closePopup(colorId) - } + addPopup(colorId, 2, ) } setGridOptions(newGridOptions) } - const dotListGridProps = { + const dotLineGridProps = { id: dotLineId, setIsShow: setShowDotLineGridModal, pos: { diff --git a/src/hooks/usePopup.js b/src/hooks/usePopup.js index ed056958..4a8e3cfb 100644 --- a/src/hooks/usePopup.js +++ b/src/hooks/usePopup.js @@ -14,7 +14,6 @@ export function usePopup() { } const closePopup = (id) => { - console.log(id) setPopup({ children: [...popup.children.filter((child) => child.id !== id)] }) }