모듈수동설치 흡착점 수정
This commit is contained in:
yjnoh
parent
43740eb453
commit
69e56a7297
@ -1,7 +1,7 @@
|
|||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
|
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
|
||||||
import { canvasSettingState, canvasState, checkedModuleState, currentObjectState, isManualModuleSetupState } from '@/store/canvasAtom'
|
import { canvasSettingState, canvasState, checkedModuleState, currentObjectState, isManualModuleSetupState } from '@/store/canvasAtom'
|
||||||
import { rectToPolygon, polygonToTurfPolygon, calculateVisibleModuleHeight, getDegreeByChon } from '@/util/canvas-util'
|
import { rectToPolygon, polygonToTurfPolygon, calculateVisibleModuleHeight, getDegreeByChon, toFixedWithoutRounding } from '@/util/canvas-util'
|
||||||
import { basicSettingState, roofDisplaySelector } from '@/store/settingAtom'
|
import { basicSettingState, roofDisplaySelector } from '@/store/settingAtom'
|
||||||
import offsetPolygon, { calculateAngle, createLinesFromPolygon } from '@/util/qpolygon-utils'
|
import offsetPolygon, { calculateAngle, createLinesFromPolygon } from '@/util/qpolygon-utils'
|
||||||
import { QPolygon } from '@/components/fabric/QPolygon'
|
import { QPolygon } from '@/components/fabric/QPolygon'
|
||||||
@ -424,6 +424,8 @@ export function useModuleBasicSetting(tabNum) {
|
|||||||
* 확인 후 셀을 이동시킴
|
* 확인 후 셀을 이동시킴
|
||||||
*/
|
*/
|
||||||
const manualModuleSetup = (placementRef) => {
|
const manualModuleSetup = (placementRef) => {
|
||||||
|
console.log('isManualModuleSetup', isManualModuleSetup)
|
||||||
|
|
||||||
const moduleSetupSurfaces = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) //모듈설치면를 가져옴
|
const moduleSetupSurfaces = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) //모듈설치면를 가져옴
|
||||||
|
|
||||||
if (isManualModuleSetup) {
|
if (isManualModuleSetup) {
|
||||||
@ -493,20 +495,20 @@ export function useModuleBasicSetting(tabNum) {
|
|||||||
|
|
||||||
const points = [
|
const points = [
|
||||||
{
|
{
|
||||||
x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
|
x: toFixedWithoutRounding(mousePoint.x, 2) + toFixedWithoutRounding(width / 2, 2),
|
||||||
y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
|
y: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
|
x: toFixedWithoutRounding(mousePoint.x, 2) + toFixedWithoutRounding(width / 2, 2),
|
||||||
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
|
y: toFixedWithoutRounding(mousePoint.y, 2) + toFixedWithoutRounding(height / 2, 2),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
|
x: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
|
||||||
y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
|
y: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
|
x: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
|
||||||
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
|
y: toFixedWithoutRounding(mousePoint.y, 2) + toFixedWithoutRounding(height / 2, 2),
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
@ -522,10 +524,10 @@ export function useModuleBasicSetting(tabNum) {
|
|||||||
fill: 'white',
|
fill: 'white',
|
||||||
stroke: 'black',
|
stroke: 'black',
|
||||||
strokeWidth: 0.3,
|
strokeWidth: 0.3,
|
||||||
width: Number(width.toFixed(1)),
|
width: toFixedWithoutRounding(width, 2),
|
||||||
height: Number(height.toFixed(1)),
|
height: toFixedWithoutRounding(height, 2),
|
||||||
left: Number(mousePoint.x.toFixed(1) - Number((width / 2).toFixed(1))),
|
left: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
|
||||||
top: Number(mousePoint.y.toFixed(1) - Number((height / 2).toFixed(1))),
|
top: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
|
||||||
selectable: false,
|
selectable: false,
|
||||||
lockMovementX: true,
|
lockMovementX: true,
|
||||||
lockMovementY: true,
|
lockMovementY: true,
|
||||||
@ -546,7 +548,7 @@ export function useModuleBasicSetting(tabNum) {
|
|||||||
/**
|
/**
|
||||||
* 스냅기능
|
* 스냅기능
|
||||||
*/
|
*/
|
||||||
let snapDistance = flowDirection === 'south' || flowDirection === 'north' ? 5 : 5
|
let snapDistance = flowDirection === 'south' || flowDirection === 'north' ? 70 : 40
|
||||||
let trestleSnapDistance = 15
|
let trestleSnapDistance = 15
|
||||||
|
|
||||||
let intvHor =
|
let intvHor =
|
||||||
@ -558,67 +560,84 @@ export function useModuleBasicSetting(tabNum) {
|
|||||||
? moduleSetupSurfaces[i].trestleDetail.moduleIntvlVer / 10
|
? moduleSetupSurfaces[i].trestleDetail.moduleIntvlVer / 10
|
||||||
: moduleSetupSurfaces[i].trestleDetail.moduleIntvlHor / 10
|
: moduleSetupSurfaces[i].trestleDetail.moduleIntvlHor / 10
|
||||||
|
|
||||||
const trestleLeft = Number(moduleSetupSurfaces[i].left.toFixed(1)) - Number((moduleSetupSurfaces[i].width / 2).toFixed(1))
|
const trestleLeft = toFixedWithoutRounding(moduleSetupSurfaces[i].left, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].width / 2, 2)
|
||||||
const trestleTop = Number(moduleSetupSurfaces[i].top.toFixed(1)) - Number((moduleSetupSurfaces[i].height / 2).toFixed(1))
|
const trestleTop = toFixedWithoutRounding(moduleSetupSurfaces[i].top, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].height / 2, 2)
|
||||||
const trestleRight = Number(moduleSetupSurfaces[i].left.toFixed(1)) + Number((moduleSetupSurfaces[i].width / 2).toFixed(1))
|
const trestleRight =
|
||||||
const trestleBottom = Number(moduleSetupSurfaces[i].top.toFixed(1)) + Number((moduleSetupSurfaces[i].height / 2).toFixed(1))
|
toFixedWithoutRounding(moduleSetupSurfaces[i].left, 2) + toFixedWithoutRounding(moduleSetupSurfaces[i].width / 2, 2)
|
||||||
|
const trestleBottom =
|
||||||
|
toFixedWithoutRounding(moduleSetupSurfaces[i].top, 2) + toFixedWithoutRounding(moduleSetupSurfaces[i].height / 2, 2)
|
||||||
const bigCenterY = (trestleTop + trestleTop + moduleSetupSurfaces[i].height) / 2
|
const bigCenterY = (trestleTop + trestleTop + moduleSetupSurfaces[i].height) / 2
|
||||||
|
|
||||||
// 이동하는 모듈의 경계 좌표
|
// 이동하는 모듈의 경계 좌표
|
||||||
const smallLeft = Number(tempModule.left.toFixed(1))
|
const smallLeft = toFixedWithoutRounding(tempModule.left, 2)
|
||||||
const smallTop = Number(tempModule.top.toFixed(1))
|
const smallTop = toFixedWithoutRounding(tempModule.top, 2)
|
||||||
const smallRight = smallLeft + Number(tempModule.width.toFixed(1))
|
const smallRight = smallLeft + toFixedWithoutRounding(tempModule.width, 2)
|
||||||
const smallBottom = smallTop + Number(tempModule.height.toFixed(1))
|
const smallBottom = smallTop + toFixedWithoutRounding(tempModule.height, 2)
|
||||||
const smallCenterX = smallLeft + Number((tempModule.width / 2).toFixed(1))
|
const smallCenterX = smallLeft + toFixedWithoutRounding(tempModule.width / 2, 2)
|
||||||
const smallCenterY = smallTop + Number((tempModule.height / 2).toFixed(1))
|
const smallCenterY = smallTop + toFixedWithoutRounding(tempModule.height / 2, 2)
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 미리 깔아놓은 셀이 있을때 셀에 흡착됨
|
* 미리 깔아놓은 셀이 있을때 셀에 흡착됨
|
||||||
*/
|
*/
|
||||||
if (manualDrawModules) {
|
if (manualDrawModules) {
|
||||||
manualDrawModules.forEach((cell) => {
|
manualDrawModules.forEach((cell) => {
|
||||||
const holdCellLeft = cell.left
|
const holdCellLeft = toFixedWithoutRounding(cell.left, 2)
|
||||||
const holdCellTop = cell.top
|
const holdCellTop = toFixedWithoutRounding(cell.top, 2)
|
||||||
const holdCellRight = holdCellLeft + Number(cell.width.toFixed(1))
|
const holdCellRight = holdCellLeft + toFixedWithoutRounding(cell.width, 2)
|
||||||
const holdCellBottom = holdCellTop + Number(cell.height.toFixed(1))
|
const holdCellBottom = holdCellTop + toFixedWithoutRounding(cell.height, 2)
|
||||||
const holdCellCenterX = holdCellLeft + Number((cell.width / 2).toFixed(1))
|
const holdCellCenterX = holdCellLeft + toFixedWithoutRounding(cell.width / 2, 2)
|
||||||
const holdCellCenterY = holdCellTop + Number((cell.height / 2).toFixed(1))
|
const holdCellCenterY = holdCellTop + toFixedWithoutRounding(cell.height / 2, 2)
|
||||||
|
|
||||||
|
//가운데 -> 가운대
|
||||||
|
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
|
||||||
|
tempModule.left = holdCellCenterX - toFixedWithoutRounding(width / 2, 2)
|
||||||
|
}
|
||||||
|
|
||||||
|
//왼쪽 -> 가운데
|
||||||
|
if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
|
||||||
|
// console.log('holdCellCenterX', holdCellCenterX)
|
||||||
|
// console.log('smallLeft', smallLeft)
|
||||||
|
|
||||||
|
// console.log('모듈 센터에 스냅')
|
||||||
|
tempModule.left = holdCellCenterX + intvHor / 2
|
||||||
|
|
||||||
|
// console.log('tempModule.left', tempModule.left)
|
||||||
|
}
|
||||||
|
// 오른쪽 -> 가운데
|
||||||
|
if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
|
||||||
|
tempModule.left = holdCellCenterX - width - intvHor / 2
|
||||||
|
}
|
||||||
|
|
||||||
//설치된 셀에 좌측에 스냅
|
//설치된 셀에 좌측에 스냅
|
||||||
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
|
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
|
||||||
|
// console.log('모듈 좌측 스냅')
|
||||||
tempModule.left = holdCellLeft - width - intvHor
|
tempModule.left = holdCellLeft - width - intvHor
|
||||||
}
|
}
|
||||||
|
|
||||||
//설치된 셀에 우측에 스냅
|
//설치된 셀에 우측에 스냅
|
||||||
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
|
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
|
||||||
|
// console.log('모듈 우측 스냅')
|
||||||
tempModule.left = holdCellRight + intvHor
|
tempModule.left = holdCellRight + intvHor
|
||||||
}
|
}
|
||||||
|
|
||||||
//설치된 셀에 위쪽에 스냅
|
//설치된 셀에 위쪽에 스냅
|
||||||
if (Math.abs(smallBottom - holdCellTop) < snapDistance) {
|
if (Math.abs(smallBottom - holdCellTop) < 10) {
|
||||||
tempModule.top = holdCellTop - height - intvVer
|
tempModule.top = holdCellTop - height - intvVer
|
||||||
}
|
}
|
||||||
|
|
||||||
//설치된 셀에 밑쪽에 스냅
|
//설치된 셀에 밑쪽에 스냅
|
||||||
if (Math.abs(smallTop - holdCellBottom) < snapDistance) {
|
if (Math.abs(smallTop - holdCellBottom) < 10) {
|
||||||
tempModule.top = holdCellBottom + intvVer
|
tempModule.top = holdCellBottom + intvVer
|
||||||
}
|
}
|
||||||
//가운데 -> 가운데
|
|
||||||
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
|
//설치된 셀에 윗쪽에 스냅
|
||||||
tempModule.left = holdCellCenterX - Number((width / 2).toFixed(1))
|
if (Math.abs(smallTop - holdCellTop) < 10) {
|
||||||
}
|
tempModule.top = holdCellTop
|
||||||
//왼쪽 -> 가운데
|
|
||||||
if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
|
|
||||||
tempModule.left = holdCellCenterX + intvHor
|
|
||||||
}
|
|
||||||
// 오른쪽 -> 가운데
|
|
||||||
if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
|
|
||||||
tempModule.left = holdCellCenterX - width - intvHor
|
|
||||||
}
|
}
|
||||||
|
|
||||||
//세로 가운데 -> 가운데
|
//세로 가운데 -> 가운데
|
||||||
if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
|
// if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
|
||||||
tempModule.top = holdCellCenterY - Number((height / 2).toFixed(1))
|
// tempModule.top = holdCellCenterY - toFixedWithoutRounding(height / 2, 1)
|
||||||
}
|
// }
|
||||||
// //위쪽 -> 가운데
|
// //위쪽 -> 가운데
|
||||||
// if (Math.abs(smallTop - holdCellCenterY) < cellSnapDistance) {
|
// if (Math.abs(smallTop - holdCellCenterY) < cellSnapDistance) {
|
||||||
// tempModule.top = holdCellCenterY
|
// tempModule.top = holdCellCenterY
|
||||||
@ -700,13 +719,19 @@ export function useModuleBasicSetting(tabNum) {
|
|||||||
if (!inside) return
|
if (!inside) return
|
||||||
if (tempModule) {
|
if (tempModule) {
|
||||||
const rectPoints = [
|
const rectPoints = [
|
||||||
{ x: Number(tempModule.left.toFixed(1)), y: Number(tempModule.top.toFixed(1)) },
|
{ x: toFixedWithoutRounding(tempModule.left, 2), y: toFixedWithoutRounding(tempModule.top, 2) },
|
||||||
{ x: Number(tempModule.left.toFixed(1)) + Number(tempModule.width.toFixed(1)), y: Number(tempModule.top.toFixed(1)) },
|
|
||||||
{
|
{
|
||||||
x: Number(tempModule.left.toFixed(1)) + Number(tempModule.width.toFixed(1)),
|
x: toFixedWithoutRounding(tempModule.left, 2) + toFixedWithoutRounding(tempModule.width, 2),
|
||||||
y: Number(tempModule.top.toFixed(1)) + Number(tempModule.height.toFixed(1)),
|
y: toFixedWithoutRounding(tempModule.top, 2),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: toFixedWithoutRounding(tempModule.left, 2) + toFixedWithoutRounding(tempModule.width, 2),
|
||||||
|
y: toFixedWithoutRounding(tempModule.top, 2) + toFixedWithoutRounding(tempModule.height, 2),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: toFixedWithoutRounding(tempModule.left, 2),
|
||||||
|
y: toFixedWithoutRounding(tempModule.top, 2) + toFixedWithoutRounding(tempModule.height, 2),
|
||||||
},
|
},
|
||||||
{ x: Number(tempModule.left.toFixed(1)), y: Number(tempModule.top.toFixed(1)) + Number(tempModule.height.toFixed(1)) },
|
|
||||||
]
|
]
|
||||||
|
|
||||||
tempModule.set({ points: rectPoints })
|
tempModule.set({ points: rectPoints })
|
||||||
@ -743,11 +768,13 @@ export function useModuleBasicSetting(tabNum) {
|
|||||||
let manualModule = new QPolygon(tempModule.points, {
|
let manualModule = new QPolygon(tempModule.points, {
|
||||||
...moduleOptions,
|
...moduleOptions,
|
||||||
moduleInfo: checkedModule[0],
|
moduleInfo: checkedModule[0],
|
||||||
left: Number(tempModule.left.toFixed(1)),
|
left: toFixedWithoutRounding(tempModule.left, 2),
|
||||||
top: Number(tempModule.top.toFixed(1)),
|
top: toFixedWithoutRounding(tempModule.top, 2),
|
||||||
width: Number(tempModule.width.toFixed(1)),
|
width: toFixedWithoutRounding(tempModule.width, 2),
|
||||||
height: Number(tempModule.height.toFixed(1)),
|
height: toFixedWithoutRounding(tempModule.height, 2),
|
||||||
|
toFixed: 2,
|
||||||
})
|
})
|
||||||
|
|
||||||
canvas?.add(manualModule)
|
canvas?.add(manualModule)
|
||||||
manualDrawModules.push(manualModule)
|
manualDrawModules.push(manualModule)
|
||||||
setModuleStatisticsData()
|
setModuleStatisticsData()
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user