From c88a07a22788b88f4c291a05149db115063c059e Mon Sep 17 00:00:00 2001 From: yjnoh Date: Fri, 28 Mar 2025 15:25:03 +0900 Subject: [PATCH] =?UTF-8?q?=EB=AA=A8=EB=93=88=20=EB=82=A8=EC=AA=BD?= =?UTF-8?q?=EC=84=A4=EC=B9=98=20=EC=B9=98=EC=A1=B0=EC=8B=9C=20=EC=A2=8C?= =?UTF-8?q?=EC=B8=A1=EC=9C=BC=EB=A1=9C=20=EB=B6=99=EB=8A=94=20=EC=98=A4?= =?UTF-8?q?=EB=A5=98=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../floor-plan/modal/basic/step/Placement.jsx | 2 + src/hooks/module/useModuleBasicSetting.js | 83 ++++--------------- 2 files changed, 17 insertions(+), 68 deletions(-) diff --git a/src/components/floor-plan/modal/basic/step/Placement.jsx b/src/components/floor-plan/modal/basic/step/Placement.jsx index d4b979c7..80672471 100644 --- a/src/components/floor-plan/modal/basic/step/Placement.jsx +++ b/src/components/floor-plan/modal/basic/step/Placement.jsx @@ -37,6 +37,8 @@ const Placement = forwardRef((props, refs) => { } return () => { + refs.isChidori.current = 'false' + refs.setupLocation.current = 'eaves' setIsManualModuleSetup(false) } }, []) diff --git a/src/hooks/module/useModuleBasicSetting.js b/src/hooks/module/useModuleBasicSetting.js index 8ac88a31..69f790e8 100644 --- a/src/hooks/module/useModuleBasicSetting.js +++ b/src/hooks/module/useModuleBasicSetting.js @@ -2,10 +2,10 @@ import { useState } from 'react' import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' import { canvasSettingState, canvasState, checkedModuleState, currentObjectState, isManualModuleSetupState } from '@/store/canvasAtom' import { rectToPolygon, polygonToTurfPolygon, calculateVisibleModuleHeight, getDegreeByChon, toFixedWithoutRounding } from '@/util/canvas-util' -import { basicSettingState, roofDisplaySelector } from '@/store/settingAtom' +import { roofDisplaySelector } from '@/store/settingAtom' import offsetPolygon, { calculateAngle, createLinesFromPolygon } from '@/util/qpolygon-utils' import { QPolygon } from '@/components/fabric/QPolygon' -import { moduleSetupSurfaceState, moduleIsSetupState } from '@/store/canvasAtom' +import { moduleSetupSurfaceState } from '@/store/canvasAtom' import { useEvent } from '@/hooks/useEvent' import { POLYGON_TYPE, BATCH_TYPE, LINE_TYPE } from '@/common/common' import * as turf from '@turf/turf' @@ -15,7 +15,6 @@ import { QLine } from '@/components/fabric/QLine' import { useRoofFn } from '@/hooks/common/useRoofFn' import { useEffect } from 'react' import { useMessage } from '@/hooks/useMessage' -import { moduleStatisticsState } from '@/store/circuitTrestleAtom' import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' import { useMasterController } from '@/hooks/common/useMasterController' import { v4 as uuidv4 } from 'uuid' @@ -30,12 +29,10 @@ export function useModuleBasicSetting(tabNum) { const [moduleSetupSurface, setModuleSetupSurface] = useRecoilState(moduleSetupSurfaceState) const { addCanvasMouseEventListener, initEvent, removeMouseEvent, addTargetMouseEventListener } = useEvent() const { swalFire } = useSwal() - const compasDeg = useRecoilValue(compasDegAtom) const { setSurfaceShapePattern } = useRoofFn() const checkedModule = useRecoilValue(checkedModuleState) const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState) - const setModuleStatistics = useSetRecoilState(moduleStatisticsState) const canvasSetting = useRecoilValue(canvasSettingState) @@ -46,19 +43,11 @@ export function useModuleBasicSetting(tabNum) { const { getTrestleDetailList } = useMasterController() const [saleStoreNorthFlg, setSaleStoreNorthFlg] = useState(false) - const [currentObject, setCurrentObject] = useRecoilState(currentObjectState) + const setCurrentObject = useSetRecoilState(currentObjectState) const { setModuleStatisticsData } = useCircuitTrestle() const { createRoofPolygon, createMarginPolygon, createPaddingPolygon } = useMode() useEffect(() => { - // console.log('basicSetting', basicSetting) - - if (canvas) { - //드래그 여부 - // canvas.selection = true - // canvas.selectionFullyContained = true - } - return () => { //수동 설치시 초기화 removeMouseEvent('mouse:up') @@ -67,8 +56,6 @@ export function useModuleBasicSetting(tabNum) { } }, []) - // const { addTargetMouseEventListener, addCanvasMouseEventListener, initEvent } = useContext(EventContext) - //모듈 선택에서 선택된 값들 넘어옴 const makeModuleInitArea = () => { if (isObjectNotEmpty(moduleSelectionData) && tabNum === 3) { @@ -144,10 +131,7 @@ export function useModuleBasicSetting(tabNum) { //roof에 상세 데이터 추가 roof.set({ trestleDetail: detail.data }) roof.lines.forEach((line) => { - line.attributes = { - ...line.attributes, - offset: getOffset(detail.data, line.attributes.type), - } + line.attributes = { ...line.attributes, offset: getOffset(detail.data, line.attributes.type) } }) //배치면 설치 영역 makeModuleInstArea(roof, detail.data) @@ -353,12 +337,7 @@ export function useModuleBasicSetting(tabNum) { } //기본 선택이랑 스트로크 굵기가 같으면 선택 안됨으로 봄 - setupSurface.set({ - ...setupSurface, - strokeWidth: 3, - strokeDashArray: [0], - fill: 'rgba(255,255,255,0.1)', - }) + setupSurface.set({ ...setupSurface, strokeWidth: 3, strokeDashArray: [0], fill: 'rgba(255,255,255,0.1)' }) canvas.discardActiveObject() // 객체의 활성 상태 해제 //중복으로 들어가는걸 방지하기 위한 코드 @@ -368,12 +347,7 @@ export function useModuleBasicSetting(tabNum) { setCurrentObject({ name: 'moduleSetupSurface', arrayData: [...selectedModuleInstSurfaceArray] }) } else { //선택후 재선택하면 선택안됨으로 변경 - setupSurface.set({ - ...setupSurface, - fill: 'rgba(255,255,255,0.1)', - strokeDashArray: [10, 4], - strokeWidth: 1, - }) + setupSurface.set({ ...setupSurface, fill: 'rgba(255,255,255,0.1)', strokeDashArray: [10, 4], strokeWidth: 1 }) canvas.discardActiveObject() // 객체의 활성 상태 해제 //폴리곤에 커스텀 인덱스를 가지고 해당 배열 인덱스를 찾아 삭제함 @@ -424,8 +398,6 @@ export function useModuleBasicSetting(tabNum) { * 확인 후 셀을 이동시킴 */ const manualModuleSetup = (placementRef) => { - console.log('isManualModuleSetup', isManualModuleSetup) - const moduleSetupSurfaces = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) //모듈설치면를 가져옴 if (isManualModuleSetup) { @@ -444,10 +416,7 @@ export function useModuleBasicSetting(tabNum) { const batchObjects = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.OBJECT_SURFACE) //도머s 객체 //수동모드 모듈 설치면 선택 잠금 moduleSetupSurfaces.forEach((obj) => { - obj.set({ - selectable: false, - evented: false, - }) + obj.set({ selectable: false, evented: false }) }) //모듈 기본 옵션 @@ -836,10 +805,7 @@ export function useModuleBasicSetting(tabNum) { if (moduleSetupSurfaces) { //수동모드 해제시 모듈 설치면 선택 잠금 moduleSetupSurfaces.forEach((obj) => { - obj.set({ - selectable: true, - evented: true, - }) + obj.set({ selectable: true, evented: true }) }) } @@ -1027,7 +993,7 @@ export function useModuleBasicSetting(tabNum) { //근데 양변이 곡선이면 중앙에 맞추기 위해 아래와 위의 길이를 재서 모듈의 길이를 나눠서 들어갈수 있는 갯수가 동일하면 가운데로 정렬 시킨다 if (flowLines.left.type === 'curve' && flowLines.right.type === 'curve') { - startPointX = isChidori ? flowLines.left.x1 + 1 : flowLines.left.x1 + (calcAreaWidth - totalModuleWidthCount * width) / 2 + startPointX = flowLines.left.x1 + (calcAreaWidth - totalModuleWidthCount * width) / 2 } let heightMargin = 0 @@ -1056,7 +1022,7 @@ export function useModuleBasicSetting(tabNum) { let moduleX = startPointX + width * j + 1 //5정도 마진을 준다 widthMargin = j === 0 ? 0 : intvHor * j // 가로 마진값 chidoriLength = 0 //치도리가 아니여도 기본값을 5정도 준다 - if (isChidori && !isMaxSetup) { + if (isChidori) { chidoriLength = installedModuleHeightCount % 2 == 0 ? 0 : width / 2 - intvHor } @@ -1728,11 +1694,7 @@ export function useModuleBasicSetting(tabNum) { const pointY2 = top //디버깅 - const finalLine = new QLine([pointX1, pointY1, pointX2, pointY2], { - stroke: 'red', - strokeWidth: 1, - selectable: true, - }) + const finalLine = new QLine([pointX1, pointY1, pointX2, pointY2], { stroke: 'red', strokeWidth: 1, selectable: true }) // console.log(`index ${index} : finalLine`, pointX1, pointY1, pointX2, pointY2) @@ -1854,11 +1816,7 @@ export function useModuleBasicSetting(tabNum) { const pointY2 = coords[2].y + ((coords[2].x - top) / (coords[2].x - coords[1].x)) * (coords[1].y - coords[2].y) //디버깅용 - const finalLine = new QLine([pointX1, pointY1, pointX2, pointY2], { - stroke: 'red', - strokeWidth: 1, - selectable: true, - }) + const finalLine = new QLine([pointX1, pointY1, pointX2, pointY2], { stroke: 'red', strokeWidth: 1, selectable: true }) // canvas?.add(finalLine) // canvas?.renderAll() @@ -1940,12 +1898,7 @@ export function useModuleBasicSetting(tabNum) { { x1: 0, y1: 0, index: -1 }, // 초기값: 무한대와 유효하지 않은 인덱스 ) - const obj = { - left: leftFlow, - right: rightFlow, - top: topFlow, - bottom: bottomFlow, - } + const obj = { left: leftFlow, right: rightFlow, top: topFlow, bottom: bottomFlow } return obj } @@ -2240,10 +2193,7 @@ export function useModuleBasicSetting(tabNum) { const rectPoints = [ { x: tempModule.left, y: tempModule.top }, { x: tempModule.left + tempModule.width * tempModule.scaleX, y: tempModule.top }, - { - x: tempModule.left + tempModule.width * tempModule.scaleX, - y: tempModule.top + tempModule.height * tempModule.scaleY, - }, + { x: tempModule.left + tempModule.width * tempModule.scaleX, y: tempModule.top + tempModule.height * tempModule.scaleY }, { x: tempModule.left, y: tempModule.top + tempModule.height * tempModule.scaleY }, ] @@ -2298,10 +2248,7 @@ export function useModuleBasicSetting(tabNum) { if (moduleSetupSurfaces) { //수동모드 해제시 모듈 설치면 선택 잠금 moduleSetupSurfaces.forEach((obj) => { - obj.set({ - selectable: true, - evented: true, - }) + obj.set({ selectable: true, evented: true }) }) }