From d2ca4f60e378117e7c6b43d88dc85e7972091474 Mon Sep 17 00:00:00 2001 From: yjnoh Date: Thu, 19 Dec 2024 09:58:48 +0900 Subject: [PATCH] =?UTF-8?q?=EB=AA=A8=EB=93=88=EC=9D=B4=EB=8F=99=20?= =?UTF-8?q?=EC=9E=91=EC=97=85=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../floor-plan/modal/module/PanelEdit.jsx | 109 ++++++++++++-- src/hooks/common/useCanvasConfigInitialize.js | 15 ++ src/hooks/common/useCommonUtils.js | 8 +- src/hooks/module/useModuleBasicSetting.js | 133 ++++++++++-------- src/hooks/useContextMenu.js | 5 +- src/util/canvas-util.js | 26 ++-- 6 files changed, 208 insertions(+), 88 deletions(-) diff --git a/src/components/floor-plan/modal/module/PanelEdit.jsx b/src/components/floor-plan/modal/module/PanelEdit.jsx index 1f40b703..c63dd0cd 100644 --- a/src/components/floor-plan/modal/module/PanelEdit.jsx +++ b/src/components/floor-plan/modal/module/PanelEdit.jsx @@ -3,21 +3,106 @@ import { useRecoilValue } from 'recoil' import { contextPopupPositionState } from '@/store/popupAtom' import { usePopup } from '@/hooks/usePopup' import { useMessage } from '@/hooks/useMessage' -import { useState } from 'react' +import { useEffect, useState } from 'react' +import { polygonToTurfPolygon } from '@/util/canvas-util' +import { deepCopyArray } from '@/util/common-utils' +import { canvasState } from '@/store/canvasAtom' +import * as turf from '@turf/turf' +import { POLYGON_TYPE } from '@/common/common' export default function PanelEdit(props) { const contextPopupPosition = useRecoilValue(contextPopupPositionState) const { id, pos = contextPopupPosition, type = 'move', apply } = props const { closePopup } = usePopup() const [length, setLength] = useState(0) - const [direction, setDirection] = useState('') + const [direction, setDirection] = useState('up') const { getMessage } = useMessage() + const canvas = useRecoilValue(canvasState) + useEffect(() => { + if (canvas) { + const isSetupModules = canvas.getObjects().filter((obj) => obj.name === 'module') // selectedObj에 없는 객체만 필터링 + isSetupModules.forEach((obj) => obj.set({ lockMovementX: false, lockMovementY: false })) + } + }, []) + + //모듈 이동 적용 const handleApply = () => { - apply() + contextModuleMove(length, direction) closePopup(id) } + const contextModuleMove = (length, direction) => { + const checkModuleDisjointSurface = (squarePolygon, turfModuleSetupSurface) => { + return turf.booleanContains(turfModuleSetupSurface, squarePolygon) || turf.booleanWithin(squarePolygon, turfModuleSetupSurface) + } + + const selectedObj = canvas.getActiveObjects() //선택된 객체들을 가져옴 + const selectedIds = selectedObj.map((obj) => obj.id) // selectedObj의 ID 추출 + + canvas.discardActiveObject() //선택해제 + + const isSetupModules = canvas.getObjects().filter((obj) => obj.name === 'module' && !selectedIds.includes(obj.id)) // selectedObj에 없는 객체만 필터링 + const selectedModules = canvas.getObjects().filter((obj) => selectedIds.includes(obj.id) && obj.name === 'module') //선택했던 객체들만 가져옴 + const setupSurface = canvas + .getObjects() + .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.id === selectedModules[0].surfaceId)[0] + const isOverlapArray = [] + const isInSurfaceArray = [] + + if (selectedModules) { + canvas.remove(...selectedModules) + + selectedModules.forEach((module) => { + module.set({ + originCoords: { + left: module.left, + top: module.top, + }, + }) + + if (direction === 'up') { + module.set({ ...module, top: module.top - Number(length) }) + } else if (direction === 'down') { + module.set({ ...module, top: module.top + Number(length) }) + } else if (direction === 'left') { + module.set({ ...module, left: module.left - Number(length) }) + } else if (direction === 'right') { + module.set({ ...module, left: module.left + Number(length) }) + } + module.setCoords() + canvas.renderAll() + + //다른 모듈과 겹치는지 확인하는 로직 + const isOverlap = isSetupModules.some((isSetupModule) => + turf.booleanOverlap(polygonToTurfPolygon(module, true), polygonToTurfPolygon(isSetupModule, true)), + ) + isOverlapArray.push(isOverlap) + + const turfModuleSetupSurface = polygonToTurfPolygon(setupSurface, true) + const turfModule = polygonToTurfPolygon(module, true) + + //나갔는지 확인하는 로직 + const isInSurface = turf.booleanContains(turfModuleSetupSurface, turfModule) || turf.booleanWithin(turfModule, turfModuleSetupSurface) + isInSurfaceArray.push(isInSurface) + }) + + const isNotOverlap = isOverlapArray.some((isOverlap) => isOverlap) // true면 겹침 + const isNotOutSurface = isInSurfaceArray.every((isOutSurface) => isOutSurface) //false면 밖으로 나감 + + //안겹치고 안나갔으면 이동시킨다 아니면 원래 위치로 돌려놓는다 + if (isNotOverlap || !isNotOutSurface) { + selectedModules.forEach((module) => { + module.set({ ...module, left: module.originCoords.left, top: module.originCoords.top }) + module.setCoords() + }) + } + + canvas.add(...selectedModules) + canvas.renderAll() + } + } + return (
@@ -34,33 +119,33 @@ export default function PanelEdit(props) {
{getMessage('margin')}
- setLength(e.target.value)} /> + setLength(e.target.value)} />
mm
diff --git a/src/hooks/common/useCanvasConfigInitialize.js b/src/hooks/common/useCanvasConfigInitialize.js index 2fafbb4b..c178bf75 100644 --- a/src/hooks/common/useCanvasConfigInitialize.js +++ b/src/hooks/common/useCanvasConfigInitialize.js @@ -65,6 +65,7 @@ export function useCanvasConfigInitialize() { roofInit() //화면표시 초기화 groupDimensionInit() reGroupInit() //그룹 객체 재그룹 + moduleInit() } const gridInit = () => { @@ -196,5 +197,19 @@ export function useCanvasConfigInitialize() { }) } + const moduleInit = () => { + canvas + .getObjects() + .filter((obj) => obj.name === 'module') + .forEach((obj) => { + obj.set({ + selectable: true, + lockMovementX: false, + lockMovementY: false, + }) + obj.setViewLengthText(false) + }) + } + return { canvasLoadInit, gridInit } } diff --git a/src/hooks/common/useCommonUtils.js b/src/hooks/common/useCommonUtils.js index 1f9c2063..a299fd75 100644 --- a/src/hooks/common/useCommonUtils.js +++ b/src/hooks/common/useCommonUtils.js @@ -603,8 +603,12 @@ export function useCommonUtils() { } const deleteObject = () => { - const obj = canvas?.getActiveObject() - commonDeleteText(obj) + const selectedObj = canvas?.getActiveObjects() + if (selectedObj) { + selectedObj.forEach((obj) => { + commonDeleteText(obj) + }) + } } const moveObject = () => { diff --git a/src/hooks/module/useModuleBasicSetting.js b/src/hooks/module/useModuleBasicSetting.js index 42434c4a..c9b00b8a 100644 --- a/src/hooks/module/useModuleBasicSetting.js +++ b/src/hooks/module/useModuleBasicSetting.js @@ -1,7 +1,7 @@ import { useRecoilState, useRecoilValue } from 'recoil' import { canvasState } from '@/store/canvasAtom' -import { rectToPolygon } from '@/util/canvas-util' -import { roofDisplaySelector } from '@/store/settingAtom' +import { rectToPolygon, setSurfaceShapePattern, polygonToTurfPolygon } from '@/util/canvas-util' +import { basicSettingState, roofDisplaySelector } from '@/store/settingAtom' import offsetPolygon, { calculateAngle } from '@/util/qpolygon-utils' import { QPolygon } from '@/components/fabric/QPolygon' import { moduleSetupSurfaceState, moduleIsSetupState } from '@/store/canvasAtom' @@ -14,6 +14,7 @@ import { canvasSettingState } from '@/store/canvasAtom' import { compasDegAtom } from '@/store/orientationAtom' import { QLine } from '@/components/fabric/QLine' import { useRoofFn } from '@/hooks/common/useRoofFn' +import { useEffect } from 'react' export function useModuleBasicSetting() { const canvas = useRecoilValue(canvasState) @@ -25,10 +26,37 @@ export function useModuleBasicSetting() { const canvasSetting = useRecoilValue(canvasSettingState) const compasDeg = useRecoilValue(compasDegAtom) const { setSurfaceShapePattern } = useRoofFn() + const [basicSetting, setBasicSettings] = useRecoilState(basicSettingState) + + useEffect(() => { + // console.log('basicSetting', basicSetting) + if (canvas) { + canvas.selection = true + canvas.selectionFullyContained = true + // canvas.on('selection:created', (e) => { + // console.log('selection:created', e.selected) + // }) + } + }, []) // const { addTargetMouseEventListener, addCanvasMouseEventListener, initEvent } = useContext(EventContext) let selectedModuleInstSurfaceArray = [] + const moduleOptions = { + fill: '#BFFD9F', + stroke: 'black', + strokeWidth: 0.1, + selectable: true, // 선택 가능하게 설정 + lockMovementX: true, // X 축 이동 잠금 + lockMovementY: true, // Y 축 이동 잠금 + lockRotation: true, // 회전 잠금 + lockScalingX: true, // X 축 크기 조정 잠금 + lockScalingY: true, // Y 축 크기 조정 잠금 + parentId: moduleSetupSurface.parentId, + surfaceId: moduleSetupSurface.id, + name: 'module', + } + //모듈,회로에서 다른메뉴 -> 배치면으로 갈 경수 초기화 const restoreModuleInstArea = () => { //설치면 삭제 @@ -176,21 +204,6 @@ export function useModuleBasicSetting() { obj.name === BATCH_TYPE.SHADOW, ) //도머s 객체 - const moduleOptions = { - fill: '#BFFD9F', - stroke: 'black', - strokeWidth: 0.1, - selectable: false, // 선택 가능하게 설정 - lockMovementX: true, // X 축 이동 잠금 - lockMovementY: true, // Y 축 이동 잠금 - lockRotation: true, // 회전 잠금 - lockScalingX: true, // X 축 크기 조정 잠금 - lockScalingY: true, // Y 축 크기 조정 잠금 - opacity: 0.8, - parentId: moduleSetupSurface.parentId, - name: 'module', - } - if (moduleSetupSurfaces.length !== 0) { let tempModule let manualDrawModules = [] @@ -240,7 +253,6 @@ export function useModuleBasicSetting() { lockRotation: true, lockScalingX: true, lockScalingY: true, - opacity: 0.8, name: 'tempModule', parentId: moduleSetupSurfaces[i].parentId, }) @@ -440,6 +452,7 @@ export function useModuleBasicSetting() { canvas?.remove(tempModule) //안겹치면 넣는다 // tempModule.setCoords() + moduleOptions.surfaceId = trestlePolygon.id let manualModule = new QPolygon(tempModule.points, { ...moduleOptions }) canvas?.add(manualModule) manualDrawModules.push(manualModule) @@ -516,15 +529,15 @@ export function useModuleBasicSetting() { const moduleOptions = { fill: '#BFFD9F', stroke: 'black', - strokeWidth: 0.1, - selectable: false, // 선택 가능하게 설정 + strokeWidth: 0.3, + selectable: true, // 선택 가능하게 설정 lockMovementX: true, // X 축 이동 잠금 lockMovementY: true, // Y 축 이동 잠금 lockRotation: true, // 회전 잠금 lockScalingX: true, // X 축 크기 조정 잠금 lockScalingY: true, // Y 축 크기 조정 잠금 - opacity: 0.8, parentId: moduleSetupSurface.parentId, + surfaceId: moduleSetupSurface.id, name: 'module', } @@ -593,7 +606,8 @@ export function useModuleBasicSetting() { return turf.booleanContains(turfModuleSetupSurface, squarePolygon) || turf.booleanWithin(squarePolygon, turfModuleSetupSurface) } - const downFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine, isCenter = false) => { + const downFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, isCenter = false) => { + const flowModuleLine = moduleSetupSurface.flowLines let startPoint = flowModuleLine.bottom if (isCenter) { @@ -637,9 +651,9 @@ export function useModuleBasicSetting() { if (isMaxSetup) totalWidth = totalWidth * 2 //최대배치시 2배로 늘려서 반씩 검사하기위함 for (let j = 0; j < diffTopEndPoint; j++) { - bottomMargin = j === 0 ? 1 : 2 + bottomMargin = 1 * j for (let i = 0; i <= totalWidth; i++) { - leftMargin = i === 0 ? 1 : 2 + leftMargin = 1 * i chidoriLength = 0 if (isChidori) { chidoriLength = j % 2 === 0 ? 0 : width / 2 @@ -657,6 +671,7 @@ export function useModuleBasicSetting() { let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1) let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -664,7 +679,8 @@ export function useModuleBasicSetting() { } } - const leftFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, aaa, isCenter = false) => { + const leftFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, isCenter = false) => { + const flowModuleLine = moduleSetupSurface.flowLines let startPoint = flowModuleLine.left //중앙배치일 경우에는 계산한다 @@ -718,6 +734,7 @@ export function useModuleBasicSetting() { let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) // if (disjointFromTrestle && isDisjoint) { + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -725,7 +742,8 @@ export function useModuleBasicSetting() { } } - const topFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine, isCenter = false) => { + const topFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, isCenter = false) => { + const flowModuleLine = moduleSetupSurface.flowLines let startPoint = flowModuleLine.top if (isCenter) { @@ -789,6 +807,7 @@ export function useModuleBasicSetting() { let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) // if (disjointFromTrestle && isDisjoint) { + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -796,7 +815,8 @@ export function useModuleBasicSetting() { } } - const rightFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine, isCenter = false) => { + const rightFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, isCenter = false) => { + const flowModuleLine = moduleSetupSurface.flowLines let startPoint = flowModuleLine.right if (isCenter) { @@ -850,6 +870,7 @@ export function useModuleBasicSetting() { let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) // if (disjointFromTrestle && isDisjoint) { + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -883,44 +904,44 @@ export function useModuleBasicSetting() { if (setupLocation === 'eaves') { // 흐름방향이 남쪽일때 if (moduleSetupSurface.flowDirection === 'south') { - downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } if (moduleSetupSurface.flowDirection === 'west') { - leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } if (moduleSetupSurface.flowDirection === 'east') { - rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } if (moduleSetupSurface.flowDirection === 'north') { - topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } } else if (setupLocation === 'ridge') { //용마루 if (moduleSetupSurface.flowDirection === 'south') { - topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } if (moduleSetupSurface.flowDirection === 'west') { - rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } if (moduleSetupSurface.flowDirection === 'east') { - leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } if (moduleSetupSurface.flowDirection === 'north') { - downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface) } } else if (setupLocation === 'center') { //중가면 if (moduleSetupSurface.flowDirection === 'south') { - downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines, true) + downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, true) } if (moduleSetupSurface.flowDirection === 'west') { - leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines, true) + leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, true) } if (moduleSetupSurface.flowDirection === 'east') { - rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines, true) + rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, true) } if (moduleSetupSurface.flowDirection === 'north') { - topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines, true) + topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface, true) } } @@ -1214,20 +1235,6 @@ export function useModuleBasicSetting() { return turf.polygon([coordinates]) } - const polygonToTurfPolygon = (object, current = false) => { - let coordinates - coordinates = object.points.map((point) => [point.x, point.y]) - if (current) coordinates = object.getCurrentPoints().map((point) => [point.x, point.y]) - coordinates.push(coordinates[0]) - return turf.polygon( - [coordinates], - {}, - { - parentId: object.parentId, - }, - ) - } - const batchObjectGroupToTurfPolygon = (group) => { const polygons = group.getObjects().filter((obj) => obj.type === 'QPolygon') let allPoints = [] @@ -1547,14 +1554,14 @@ export function useModuleBasicSetting() { fill: '#BFFD9F', stroke: 'black', strokeWidth: 0.1, - selectable: false, // 선택 가능하게 설정 + selectable: true, // 선택 가능하게 설정 lockMovementX: true, // X 축 이동 잠금 lockMovementY: true, // Y 축 이동 잠금 lockRotation: true, // 회전 잠금 lockScalingX: true, // X 축 크기 조정 잠금 lockScalingY: true, // Y 축 크기 조정 잠금 - opacity: 0.8, parentId: moduleSetupSurface.parentId, + surfaceId: moduleSetupSurface.id, name: 'module', } @@ -1638,7 +1645,6 @@ export function useModuleBasicSetting() { lockRotation: true, lockScalingX: true, lockScalingY: true, - opacity: 0.8, name: 'tempModule', parentId: moduleSetupSurfaces[i].parentId, }) @@ -1833,6 +1839,7 @@ export function useModuleBasicSetting() { //마우스 클릭시 set으로 해당 위치에 셀을 넣음 const isOverlap = manualDrawModules.some((module) => turf.booleanOverlap(tempTurfModule, polygonToTurfPolygon(module))) //겹치는지 확인 if (!isOverlap) { + moduleOptions.surfaceId = trestlePolygon.id let manualModule = new QPolygon(tempModule.points, { ...moduleOptions }) canvas?.add(manualModule) manualDrawModules.push(tempModule) @@ -1954,14 +1961,14 @@ export function useModuleBasicSetting() { fill: '#BFFD9F', stroke: 'black', strokeWidth: 0.1, - selectable: false, // 선택 가능하게 설정 + selectable: true, // 선택 가능하게 설정 lockMovementX: true, // X 축 이동 잠금 lockMovementY: true, // Y 축 이동 잠금 lockRotation: true, // 회전 잠금 lockScalingX: true, // X 축 크기 조정 잠금 lockScalingY: true, // Y 축 크기 조정 잠금 - opacity: 0.8, parentId: moduleSetupSurface.parentId, + surfaceId: moduleSetupSurface.id, name: 'module', } @@ -2064,6 +2071,7 @@ export function useModuleBasicSetting() { let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1) let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -2103,6 +2111,7 @@ export function useModuleBasicSetting() { let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) // if (disjointFromTrestle && isDisjoint) { + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -2145,6 +2154,7 @@ export function useModuleBasicSetting() { let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) // if (disjointFromTrestle && isDisjoint) { + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -2185,6 +2195,7 @@ export function useModuleBasicSetting() { let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) // if (disjointFromTrestle && isDisjoint) { + moduleOptions.surfaceId = moduleSetupSurface.id let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) canvas?.add(tempModule) moduleSetupArray.push(tempModule) @@ -2234,8 +2245,8 @@ export function useModuleBasicSetting() { let isDisjoint = checkModuleDisjointObjects(module.turfPoints, containsBatchObjects) if (!(disjointFromTrestle && isDisjoint)) { - // canvas?.remove(module) - module.set({ fill: 'rgba(255,190,41, 0.4)', stroke: 'black', strokeWidth: 1 }) + canvas?.remove(module) + // module.set({ fill: 'rgba(255,190,41, 0.4)', stroke: 'black', strokeWidth: 1 }) return false } else { return module @@ -2272,6 +2283,8 @@ export function useModuleBasicSetting() { // canvas.add(groupTest) }) // console.log(calculateForApi()) + + //드래그 하기위해 기능 활성화 } return { diff --git a/src/hooks/useContextMenu.js b/src/hooks/useContextMenu.js index cbf326e8..46a0a38f 100644 --- a/src/hooks/useContextMenu.js +++ b/src/hooks/useContextMenu.js @@ -597,12 +597,13 @@ export function useContextMenu() { ], ]) break - case 'panel': + case 'module': setContextMenu([ [ { id: 'remove', name: getMessage('contextmenu.remove'), + fn: () => deleteObject(), }, { id: 'move', @@ -661,7 +662,7 @@ export function useContextMenu() { ], ]) break - case 'module': + case 'moduleSetupSurface': case 'dimensionLineText': setContextMenu([ [ diff --git a/src/util/canvas-util.js b/src/util/canvas-util.js index 82c72da0..eaefb0be 100644 --- a/src/util/canvas-util.js +++ b/src/util/canvas-util.js @@ -751,18 +751,6 @@ export const pointsToTurfPolygon = (points) => { return turf.polygon([coordinates]) } -export const polygonToTurfPolygon = (polygon) => { - const coordinates = polygon.points.map((point) => [point.x, point.y]) - coordinates.push(coordinates[0]) - return turf.polygon( - [coordinates], - {}, - { - parentId: polygon.parentId, - }, - ) -} - export const triangleToPolygon = (triangle) => { const points = [] const halfWidth = triangle.width / 2 @@ -1003,3 +991,17 @@ export function findAndRemoveClosestPoint(targetPoint, points) { return closestPoint } + +export function polygonToTurfPolygon(object, current = false) { + let coordinates + coordinates = object.points.map((point) => [point.x, point.y]) + if (current) coordinates = object.getCurrentPoints().map((point) => [point.x, point.y]) + coordinates.push(coordinates[0]) + return turf.polygon( + [coordinates], + {}, + { + parentId: object.parentId, + }, + ) +}