From 910d5c57040d767b2399aafe99e4be682b64efeb Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Thu, 23 Jan 2025 18:37:59 +0900 Subject: [PATCH] =?UTF-8?q?=EA=B0=80=EB=8C=80=20=EC=84=A4=EC=B9=98=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 --- src/hooks/module/useTrestle.js | 43 ++++++++++++++++----- src/hooks/roofcover/usePropertiesSetting.js | 7 +++- src/util/canvas-util.js | 5 +++ 3 files changed, 44 insertions(+), 11 deletions(-) diff --git a/src/hooks/module/useTrestle.js b/src/hooks/module/useTrestle.js index 5c1d7927..c41ab251 100644 --- a/src/hooks/module/useTrestle.js +++ b/src/hooks/module/useTrestle.js @@ -2,6 +2,7 @@ import { useRecoilValue } from 'recoil' import { canvasState } from '@/store/canvasAtom' import { POLYGON_TYPE } from '@/common/common' import { moduleSelectionDataState } from '@/store/selectedModuleOptions' +import { getDegreeByChon, getTrestleLength } from '@/util/canvas-util' // 회로 및 가대설정 export const useTrestle = () => { @@ -60,6 +61,7 @@ export const useTrestle = () => { const leftExposedHalfTopModules = [] // 왼쪽 면만 노출되어 있는 경우 const rightExposedHalfTopPoints = [] // 오른쪽 면만 노출되어 있는 경우 const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE) + modules.forEach((module) => { const { x, y } = module.getCenterPoint() const isExposedBottom = result.exposedBottomPoints.some((point) => Math.abs(point.x - x) < 2 && Math.abs(point.y - y) < 2) @@ -525,7 +527,10 @@ export const useTrestle = () => { } const drawRacks = (rackInfos, rackQty, rackIntvlPct, module, direction, l, rackYn) => { - const { width, height, left, top, lastX, lastY } = module + const { width, height, left, top, lastX, lastY, surfaceId } = module + const surface = canvas.getObjects().find((obj) => obj.id === surfaceId) + const roof = canvas.getObjects().find((obj) => obj.id === surface.parentId) + const degree = getDegreeByChon(roof.roofMaterial.pitch) const moduleLeft = lastX ?? left const moduleTop = lastY ?? top @@ -609,7 +614,7 @@ export const useTrestle = () => { rackInfos.forEach((rackInfo) => { const { rackLen, itemId, supFitQty, supFitIntvlPct } = rackInfo - const rackLength = rackLen / 10 + const rackLength = getTrestleLength(rackLen, degree) / 10 const rack = new fabric.Line([startPointX, startPointY, startPointX, startPointY - rackLength], { name: 'rack', @@ -634,7 +639,7 @@ export const useTrestle = () => { canvas.add(rack) canvas.renderAll() - startPointY -= rackLength + 3 + startPointY -= rackLength + 8 }) break @@ -643,7 +648,7 @@ export const useTrestle = () => { rackInfos.forEach((rackInfo) => { const { rackLen, itemId, supFitQty, supFitIntvlPct } = rackInfo - const rackLength = rackLen / 10 + const rackLength = getTrestleLength(rackLen, degree) / 10 const rack = new fabric.Line([startPointX, startPointY, startPointX - rackLength, startPointY], { name: 'rack', @@ -668,7 +673,7 @@ export const useTrestle = () => { canvas.add(rack) canvas.renderAll() - startPointX -= rackLength + 3 + startPointX -= rackLength + 8 }) break } @@ -677,7 +682,7 @@ export const useTrestle = () => { rackInfos.forEach((rackInfo) => { const { rackLen, itemId, supFitQty, supFitIntvlPct } = rackInfo - const rackLength = rackLen / 10 + const rackLength = getTrestleLength(rackLen, degree) / 10 const rack = new fabric.Line([startPointX, startPointY, startPointX + rackLength, startPointY], { name: 'rack', @@ -701,7 +706,7 @@ export const useTrestle = () => { canvas.add(rack) canvas.renderAll() - startPointX += rackLength + 3 + startPointX += rackLength + 8 }) break } @@ -709,7 +714,7 @@ export const useTrestle = () => { rackInfos.forEach((rackInfo) => { const { rackLen, itemId, supFitQty, supFitIntvlPct } = rackInfo - const rackLength = rackLen / 10 + const rackLength = getTrestleLength(rackLen, degree) / 10 const rack = new fabric.Line([startPointX, startPointY, startPointX, startPointY + rackLength], { name: 'rack', @@ -733,7 +738,7 @@ export const useTrestle = () => { canvas.add(rack) canvas.renderAll() - startPointY += rackLength + 3 + startPointY += rackLength + 8 }) break } @@ -841,6 +846,7 @@ export const useTrestle = () => { //랙 없음 인 경우 지지금구 설치 const installBracketWithOutRack = (surface, exposedBottomModules, leftExposedHalfBottomModules, rightExposedHalfBottomPoints, isChidory) => { let { rackQty, rackIntvlPct, moduleIntvlHor, moduleIntvlVer } = surface.trestleDetail + const direction = surface.direction rackQty = 3 canvas.renderAll() @@ -861,7 +867,7 @@ export const useTrestle = () => { drawBracketWithOutRack(module, rackIntvlPct / 3, module.rightRows + 1, 'R', surface.direction, moduleIntvlHor, moduleIntvlVer) } - if (rackQty === 5) { + if (!isChidory && rackQty === 5) { drawBracketWithOutRack(module, rackIntvlPct / 3, module.leftRows + 1, 'L', surface.direction, moduleIntvlHor, moduleIntvlVer) drawBracketWithOutRack(module, rackIntvlPct / 3, module.rightRows + 1, 'R', surface.direction, moduleIntvlHor, moduleIntvlVer) drawBracketWithOutRack(module, rackIntvlPct / 3, module.rightRows + 1, 'C', surface.direction, moduleIntvlHor, moduleIntvlVer) @@ -870,6 +876,10 @@ export const useTrestle = () => { leftExposedHalfBottomModules.forEach((module) => { drawBracketWithOutRack(module, rackIntvlPct, module.leftRows + 1, 'L', surface.direction, moduleIntvlHor, moduleIntvlVer) + if (rackQty === 3 && findSamePointInBottom(exposedBottomModules, module)) { + // 해당 모듈과 같은 위치 맨 아래에 모듈이 있는 경우 하나 더 설치 필요 + drawBracketWithOutRack(module, rackIntvlPct / 3, module.leftRows + 1, 'L', surface.direction, moduleIntvlHor, moduleIntvlVer) + } if (rackQty === 4) { drawBracketWithOutRack(module, rackIntvlPct / 3, module.leftRows + 1, 'L', surface.direction, moduleIntvlHor, moduleIntvlVer) } @@ -877,12 +887,25 @@ export const useTrestle = () => { rightExposedHalfBottomPoints.forEach((module) => { drawBracketWithOutRack(module, rackIntvlPct, module.rightRows + 1, 'R', surface.direction, moduleIntvlHor, moduleIntvlVer) + if (rackQty === 3 && !findSamePointInBottom(exposedBottomModules, module)) { + // 해당 모듈과 같은 위치 맨 아래에 모듈이 없는 경우 하나 더 설치 필요 + drawBracketWithOutRack(module, rackIntvlPct / 3, module.rightRows + 1, 'R', surface.direction, moduleIntvlHor, moduleIntvlVer) + } if (rackQty === 4) { drawBracketWithOutRack(module, rackIntvlPct / 3, module.rightRows + 1, 'R', surface.direction, moduleIntvlHor, moduleIntvlVer) } }) } + // 방향에 따라 가장 아래모듈중 같은 좌표가 있는지 확인 + const findSamePointInBottom = (exposedBottomModules, module) => { + const { x, y } = module.getCenterPoint() + return exposedBottomModules.find((exposedBottomModule) => { + const { x: exposedX, y: exposedY } = exposedBottomModule.getCenterPoint() + return Math.abs(x - exposedX) < 2 || Math.abs(y - exposedY) < 2 + }) + } + const drawBracketWithOutRack = (module, rackIntvlPct, count, l, direction, moduleIntvlHor, moduleIntvlVer) => { let { width, height, left, top } = module let startPointX diff --git a/src/hooks/roofcover/usePropertiesSetting.js b/src/hooks/roofcover/usePropertiesSetting.js index 73a72e5a..550bc5c0 100644 --- a/src/hooks/roofcover/usePropertiesSetting.js +++ b/src/hooks/roofcover/usePropertiesSetting.js @@ -120,9 +120,14 @@ export function usePropertiesSetting(id) { } const handleFix = () => { - if (!confirm('외벽선 속성 설정을 완료하시겠습니까?')) { + const isClose = confirm('외벽선 속성 설정을 완료하시겠습니까?') + if (isClose) { + closePopup(id) + return + } else { return } + const lines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') const notSetAttributes = lines.filter((line) => !line.attributes?.type) diff --git a/src/util/canvas-util.js b/src/util/canvas-util.js index b4d5e42f..5df32879 100644 --- a/src/util/canvas-util.js +++ b/src/util/canvas-util.js @@ -1031,3 +1031,8 @@ export function calculateVisibleModuleHeight(sourceWidth, sourceHeight, angle, d height: Number(visibleHeight.toFixed(1)), // 소수점 두 자리로 고정 } } + +export function getTrestleLength(length, degree) { + const radians = (degree * Math.PI) / 180 + return length * Math.cos(radians) +}