From baeb2be0a18a9fb2a80096502618379236cde46c Mon Sep 17 00:00:00 2001 From: ysCha Date: Thu, 30 Oct 2025 16:35:42 +0900 Subject: [PATCH 1/3] =?UTF-8?q?=EB=8F=99,=ED=98=84=EC=9D=B4=EB=8F=99=20?= =?UTF-8?q?=EB=8F=99=EC=9D=BC=EB=9D=BC=EC=9D=B8=EC=B2=B4=ED=81=AC=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD,=20=EC=83=81=EC=9A=B0=EC=84=A0=ED=83=9D?= =?UTF-8?q?=EC=8B=9C=20=EC=B4=88=EA=B8=B0=ED=99=94=20=EB=AC=B8=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/roofcover/useMovementSetting.js | 148 +++++++++++++++++++--- 1 file changed, 131 insertions(+), 17 deletions(-) diff --git a/src/hooks/roofcover/useMovementSetting.js b/src/hooks/roofcover/useMovementSetting.js index f3a30473..3b285e77 100644 --- a/src/hooks/roofcover/useMovementSetting.js +++ b/src/hooks/roofcover/useMovementSetting.js @@ -245,19 +245,17 @@ export function useMovementSetting(id) { let currentCalculatedValue = 0 const mouseMoveEvent = (e) => { - + //console.log('mouseMoveEvent:::::',e) const target = canvas.getActiveObject() if (!target) return // 디버깅 로그 추가 - if (typeRef.current === TYPE.UP_DOWN) { - console.log('UP_DOWN_REF.POINTER_INPUT_REF.current:', UP_DOWN_REF.POINTER_INPUT_REF.current); - if (!UP_DOWN_REF.POINTER_INPUT_REF.current) { - console.warn('UP_DOWN_REF.POINTER_INPUT_REF.current is null/undefined'); - } - } - - + // if (typeRef.current === TYPE.UP_DOWN) { + // console.log('UP_DOWN_REF.POINTER_INPUT_REF.current:', UP_DOWN_REF.POINTER_INPUT_REF.current); + // if (!UP_DOWN_REF.POINTER_INPUT_REF.current) { + // console.warn('UP_DOWN_REF.POINTER_INPUT_REF.current is null/undefined'); + // } + // } const { top: targetTop, left: targetLeft } = target const currentX = Big(getIntersectMousePoint(e).x) @@ -286,14 +284,38 @@ export function useMovementSetting(id) { const midX = Big(target.x1).plus(target.x2).div(2) const midY = Big(target.y1).plus(target.y2).div(2) const wall = canvas.getObjects().find((obj) => obj.id === target.attributes.wallId) - let checkPoint + wall.lines.forEach(line => { + + console.log(classifyWallLine(wall, line)) + + }) + + let linePosition = classifyWallLine(wall, target).position; if (target.y1 === target.y2) { //수평벽 + + const setRadioStates = (isUp) => { + if (UP_DOWN_REF.UP_RADIO_REF.current) { + UP_DOWN_REF.UP_RADIO_REF.current.checked = isUp; + } + if (UP_DOWN_REF.DOWN_RADIO_REF.current) { + UP_DOWN_REF.DOWN_RADIO_REF.current.checked = !isUp; + } + }; + + if (linePosition === 'top') { + setRadioStates(value.s !== -1); + } else if (linePosition === 'bottom') { + setRadioStates(value.s !== 1); + } + + + /* checkPoint = { x: midX.toNumber(), y: midY.plus(10).toNumber() } if (wall.inPolygon(checkPoint)) { //선택라인이 내부 - if (value.s !== -1) { - console.log('-1value:::', value.s) + if (value.s === -1) { + console.log('1value:::', value.s) if (UP_DOWN_REF.UP_RADIO_REF.current) UP_DOWN_REF.UP_RADIO_REF.current.checked = false if (UP_DOWN_REF.DOWN_RADIO_REF.current) UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true } else { @@ -302,7 +324,7 @@ export function useMovementSetting(id) { } } else { // if (value.s === 1) { //선택라인이 외부 - console.log('+1value:::', value.s) + console.log('2value:::', value.s) if (UP_DOWN_REF.UP_RADIO_REF.current) UP_DOWN_REF.UP_RADIO_REF.current.checked = false if (UP_DOWN_REF.DOWN_RADIO_REF.current) UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true } else { @@ -310,18 +332,38 @@ export function useMovementSetting(id) { if (UP_DOWN_REF.DOWN_RADIO_REF.current) UP_DOWN_REF.DOWN_RADIO_REF.current.checked = false } } + */ } else { + + const setRadioStates = (isUp) => { + if (UP_DOWN_REF.UP_RADIO_REF.current) { + UP_DOWN_REF.UP_RADIO_REF.current.checked = isUp; + } + if (UP_DOWN_REF.DOWN_RADIO_REF.current) { + UP_DOWN_REF.DOWN_RADIO_REF.current.checked = !isUp; + } + }; + + if (linePosition === 'left') { + setRadioStates(value.s !== 1); + } else if (linePosition === 'right') { + setRadioStates(value.s !== -1); + } + /* checkPoint = { x: midX.plus(10).toNumber(), y: midY.toNumber() } if (wall.inPolygon(checkPoint)) { - if (value.s !== 1) { + if (value.s === 1) { + console.log('3value:::', value.s) if (UP_DOWN_REF.UP_RADIO_REF.current) UP_DOWN_REF.UP_RADIO_REF.current.checked = false if (UP_DOWN_REF.DOWN_RADIO_REF.current) UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true } else { if (UP_DOWN_REF.UP_RADIO_REF.current) UP_DOWN_REF.UP_RADIO_REF.current.checked = true if (UP_DOWN_REF.DOWN_RADIO_REF.current) UP_DOWN_REF.DOWN_RADIO_REF.current.checked = false + } } else { if (value.s === -1) { + console.log('-1value:::', value.s) if (UP_DOWN_REF.UP_RADIO_REF.current) UP_DOWN_REF.UP_RADIO_REF.current.checked = false if (UP_DOWN_REF.DOWN_RADIO_REF.current) UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true } else { @@ -329,6 +371,7 @@ export function useMovementSetting(id) { if (UP_DOWN_REF.DOWN_RADIO_REF.current) UP_DOWN_REF.DOWN_RADIO_REF.current.checked = false } } + */ } } } @@ -406,6 +449,7 @@ export function useMovementSetting(id) { roof.moveSelectLine = target; const wall = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.WALL && obj.attributes.roofId === roofId) const baseLines = wall.baseLines + let centerPoint = wall.getCenterPoint(); let targetBaseLines = [] let isGableRoof if (typeRef.current === TYPE.FLOW_LINE) { @@ -544,6 +588,7 @@ export function useMovementSetting(id) { value = value.neg() } } else { + console.log("error::", UP_DOWN_REF) value = UP_DOWN_REF.FILLED_INPUT_REF.current.value !== '' ? Big(UP_DOWN_REF.FILLED_INPUT_REF.current.value) @@ -566,15 +611,33 @@ export function useMovementSetting(id) { // } else if (UP_DOWN_REF.DOWN_RADIO_REF.current.checked && !inPolygon) { // value = value.neg() // } - if (UP_DOWN_REF.DOWN_RADIO_REF.current.checked){ - value = value.neg() - } } + + let linePosition = classifyWallLine(wall, target).position; + + value = value.div(10) targetBaseLines .filter((line) => Math.sqrt(Math.pow(line.line.x2 - line.line.x1, 2) + Math.pow(line.line.y2 - line.line.y1, 2)) >= 1) .forEach((target) => { const currentLine = target.line + + console.log("linePosition::::::::::::::", linePosition) + if (UP_DOWN_REF.DOWN_RADIO_REF.current.checked ){ + //position확인 + if(linePosition === 'bottom' || linePosition === 'right') { + console.log("1value::::::::::::::", value.toString()) + value = value.neg() + + } + }else { + if(linePosition === 'top' || linePosition === 'left') { + console.log("1value::::::::::::::", value.toString()) + value = value.neg() + } + } + + console.log("2value::::::::::::::", value.toString()) const index = baseLines.findIndex((line) => line === currentLine) const nextLine = baseLines[(index + 1) % baseLines.length] const prevLine = baseLines[(index - 1 + baseLines.length) % baseLines.length] @@ -627,6 +690,55 @@ export function useMovementSetting(id) { closePopup(id) } + // javascript + const classifyWallLine = (wall, line, epsilon = 0.5, offset = 10)=> { + if (!wall || !line) return { orientation: 'unknown', position: 'unknown' } + + const center = wall.getCenterPoint() + const dx = Math.abs(line.x2 - line.x1) + const dy = Math.abs(line.y2 - line.y1) + + let orientation = 'slanted' + if (dy < epsilon && dx >= epsilon) orientation = 'horizontal' + else if (dx < epsilon && dy >= epsilon) orientation = 'vertical' + else orientation = dx > dy ? 'horizontal' : 'vertical' + + const midX = (line.x1 + line.x2) / 2 + const midY = (line.y1 + line.y2) / 2 + + // checkPoint: mid에서 center 방향으로 약간 이동한 점을 계산 + let checkX = midX + let checkY = midY + if (orientation === 'horizontal') { + const dir = Math.sign(center.y - midY) || 1 + checkY = midY + dir * offset + } else if (orientation === 'vertical') { + const dir = Math.sign(center.x - midX) || 1 + checkX = midX + dir * offset + } else { + const dirX = Math.sign(center.x - midX) || 1 + const dirY = Math.sign(center.y - midY) || 1 + checkX = midX + dirX * offset + checkY = midY + dirY * offset + } + + const inside = typeof wall.inPolygon === 'function' ? wall.inPolygon({ x: checkX, y: checkY }) : true + + let position = 'unknown' + if (orientation === 'horizontal') { + const dir = center.y - midY + if (inside) position = dir > 0 ? 'top' : 'bottom' + else position = dir > 0 ? 'bottom' : 'top' + } else if (orientation === 'vertical') { + const dir = center.x - midX + if (inside) position = dir > 0 ? 'left' : 'right' + else position = dir > 0 ? 'right' : 'left' + } + + return { orientation, position, mid: { x: midX, y: midY }, center, checkPoint: { x: checkX, y: checkY }, inside } + } + + return { TYPE, closePopup, @@ -636,5 +748,7 @@ export function useMovementSetting(id) { FLOW_LINE_REF, UP_DOWN_REF, handleSave, + classifyWallLine } } + From a428cc31e89c57acd757bdab636eea41ccfd4836 Mon Sep 17 00:00:00 2001 From: ysCha Date: Thu, 30 Oct 2025 16:36:53 +0900 Subject: [PATCH 2/3] =?UTF-8?q?=EC=B4=88=EA=B8=B0=ED=99=94=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/floor-plan/modal/movement/type/Updown.jsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/floor-plan/modal/movement/type/Updown.jsx b/src/components/floor-plan/modal/movement/type/Updown.jsx index 2a3f2393..f03685e7 100644 --- a/src/components/floor-plan/modal/movement/type/Updown.jsx +++ b/src/components/floor-plan/modal/movement/type/Updown.jsx @@ -12,7 +12,7 @@ const UP_DOWN_TYPE = { export default function Updown({ UP_DOWN_REF }) { const { getMessage } = useMessage() const [type, setType] = useState(UP_DOWN_TYPE.UP) - const [filledInput, setFilledInput] = useState('') + const [filledInput, setFilledInput] = useState('100') const currentObject = useRecoilValue(currentObjectState) const handleFocus = () => { if (currentObject === null) { @@ -71,7 +71,6 @@ export default function Updown({ UP_DOWN_REF }) { Date: Thu, 30 Oct 2025 16:38:48 +0900 Subject: [PATCH 3/3] =?UTF-8?q?log=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/roofcover/useMovementSetting.js | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/src/hooks/roofcover/useMovementSetting.js b/src/hooks/roofcover/useMovementSetting.js index 3b285e77..f421a3bb 100644 --- a/src/hooks/roofcover/useMovementSetting.js +++ b/src/hooks/roofcover/useMovementSetting.js @@ -285,12 +285,6 @@ export function useMovementSetting(id) { const midY = Big(target.y1).plus(target.y2).div(2) const wall = canvas.getObjects().find((obj) => obj.id === target.attributes.wallId) - wall.lines.forEach(line => { - - console.log(classifyWallLine(wall, line)) - - }) - let linePosition = classifyWallLine(wall, target).position; if (target.y1 === target.y2) { //수평벽 @@ -622,22 +616,22 @@ export function useMovementSetting(id) { .forEach((target) => { const currentLine = target.line - console.log("linePosition::::::::::::::", linePosition) + //console.log("linePosition::::::::::::::", linePosition) if (UP_DOWN_REF.DOWN_RADIO_REF.current.checked ){ //position확인 if(linePosition === 'bottom' || linePosition === 'right') { - console.log("1value::::::::::::::", value.toString()) + //console.log("1value::::::::::::::", value.toString()) value = value.neg() } }else { if(linePosition === 'top' || linePosition === 'left') { - console.log("1value::::::::::::::", value.toString()) + //console.log("1value::::::::::::::", value.toString()) value = value.neg() } } - console.log("2value::::::::::::::", value.toString()) + //console.log("2value::::::::::::::", value.toString()) const index = baseLines.findIndex((line) => line === currentLine) const nextLine = baseLines[(index + 1) % baseLines.length] const prevLine = baseLines[(index - 1 + baseLines.length) % baseLines.length]