qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

단수배치 작업

Browse Source
This commit is contained in:
yjnoh 2025-03-18 15:44:41 +09:00
parent 63db694efa
commit 8a5bd9f505
4 changed files with 409 additions and 369 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/floor-plan/modal/basic/BasicSetting.jsx
View File

@ -97,13 +97,6 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
setTabNum(tabNum + 1)
}
const placementRef = {
isChidori: useRef('false'),
setupLocation: useRef('eaves'),
}
const layoutSetupRef = useRef([])
const placementFlatRef = {
setupLocation: useRef('south'),
}
@ -149,16 +142,18 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
useEffect(() => {
if (basicSetting.roofSizeSet !== '3') {
console.log('ManualSetupMode', manualSetupMode)
if (manualSetupMode.indexOf('manualSetup') > -1) {
manualModuleSetup(placementRef)
manualModuleSetup()
} else if (manualSetupMode.indexOf('manualLayoutSetup') > -1) {
manualModuleLayoutSetup(layoutSetupRef)
manualModuleLayoutSetup(layoutSetup)
} else if (manualSetupMode.indexOf('off') > -1) {
manualModuleSetup()
manualModuleLayoutSetup(layoutSetup)
}
} else {
manualFlatroofModuleSetup(placementFlatRef)
}
if (isClosePopup.close) {
closePopup(isClosePopup.id)
}
@ -166,12 +161,13 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
useEffect(() => {
if (isManualModuleLayoutSetup) {
manualModuleLayoutSetup(layoutSetupRef)
manualModuleLayoutSetup(layoutSetup)
}
}, [layoutSetup])
useEffect(() => {
setIsManualModuleSetup(false)
setIsManualModuleLayoutSetup(false)
}, [checkedModules])
return (
@ -189,13 +185,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
{/*배치면 초기설정 - 입력방법: 복시도 입력 || 실측값 입력*/}
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 2 && <Module setTabNum={setTabNum} />}
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 3 && (
<Placement
setTabNum={setTabNum}
ref={placementRef}
layoutSetupRef={layoutSetupRef}
layoutSetup={layoutSetup}
setLayoutSetup={setLayoutSetup}
/>
<Placement setTabNum={setTabNum} layoutSetup={layoutSetup} setLayoutSetup={setLayoutSetup} />
)}
{/*배치면 초기설정 - 입력방법: 육지붕*/}
@ -227,7 +217,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
<button className={`btn-frame modal mr5 ${isManualModuleLayoutSetup ? 'act' : ''}`} onClick={handleManualModuleLayoutSetup}>
레아이웃 수동설치
</button>
<button className="btn-frame modal act" onClick={() => autoModuleSetup(placementRef)}>
<button className="btn-frame modal act" onClick={() => autoModuleSetup()}>
{getMessage('modal.module.basic.setting.auto.placement')}
</button>
</>

65
src/components/floor-plan/modal/basic/step/Placement.jsx
View File

@ -3,10 +3,9 @@ import { useMessage } from '@/hooks/useMessage'
import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
import {
checkedModuleState,
currentCanvasPlanState,
isManualModuleLayoutSetupState,
isManualModuleSetupState,
isModuleChidoriSetupState,
moduleSetupOptionState,
toggleManualSetupModeState,
} from '@/store/canvasAtom'
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
@ -15,13 +14,10 @@ import { isObjectNotEmpty } from '@/util/common-utils'
const Placement = forwardRef((props, refs) => {
const { getMessage } = useMessage()
const [isChidori, setIsChidori] = useRecoilState(isModuleChidoriSetupState)
const [isChidoriNotAble, setIsChidoriNotAble] = useState(false)
const [setupLocation, setSetupLocation] = useState('eaves')
const [isMaxSetup, setIsMaxSetup] = useState('false')
const [selectedItems, setSelectedItems] = useState({})
const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState)
const setCheckedModules = useSetRecoilState(checkedModuleState)
@ -35,6 +31,8 @@ const Placement = forwardRef((props, refs) => {
const setIsManualModuleLayoutSetup = useSetRecoilState(isManualModuleLayoutSetupState)
const setManualSetupMode = useSetRecoilState(toggleManualSetupModeState)
const [moduleSetupOption, setModuleSetupOption] = useRecoilState(moduleSetupOptionState) //모듈 설치 옵션
//모듈 배치면 생성
useEffect(() => {
if (moduleSelectionData) {
@ -49,7 +47,7 @@ const Placement = forwardRef((props, refs) => {
return () => {
setIsManualModuleSetup(false)
setIsManualModuleLayoutSetup(false)
setManualSetupMode('')
setManualSetupMode('off')
}
}, [])
@ -69,11 +67,6 @@ const Placement = forwardRef((props, refs) => {
setSelectedItems(initCheckedModule)
setSelectedModules(moduleSelectionData.module)
props.setLayoutSetup(moduleSelectionData.module.itemList.map((item) => ({ moduleId: item.itemId, col: 0, row: 0 })))
props.layoutSetupRef.current = moduleSelectionData.module.itemList.map((item) => ({
moduleId: item.itemId,
col: 0,
row: 0,
}))
}
//모듈 배치면 생성
@ -105,13 +98,21 @@ const Placement = forwardRef((props, refs) => {
const handleChangeChidori = (e) => {
const bool = e.target.value === 'true' ? true : false
setIsChidori(bool)
refs.isChidori.current = e.target.value
setModuleSetupOption({ ...moduleSetupOption, isChidori: bool })
//변경하면 수동 다 꺼짐
setIsManualModuleSetup(false)
setIsManualModuleLayoutSetup(false)
setManualSetupMode('off')
}
const handleSetupLocation = (e) => {
setSetupLocation(e.target.value)
refs.setupLocation.current = e.target.value
setModuleSetupOption({ ...moduleSetupOption, setupLocation: e.target.value })
//변경하면 수동 다 꺼짐
setIsManualModuleSetup(false)
setIsManualModuleLayoutSetup(false)
setManualSetupMode('off')
}
//체크된 모듈 아이디 추출
@ -123,11 +124,6 @@ const Placement = forwardRef((props, refs) => {
const newLayoutSetup = [...props.layoutSetup]
newLayoutSetup[index] = { ...newLayoutSetup[index], moduleId: itemId, [e.target.name]: Number(e.target.value) }
props.setLayoutSetup(newLayoutSetup)
props.layoutSetupRef.current[index] = {
...props.layoutSetupRef.current[index],
moduleId: itemId,
[e.target.name]: Number(e.target.value),
}
}
return (
@ -214,7 +210,7 @@ const Placement = forwardRef((props, refs) => {
type="radio"
name="radio01"
id="ra01"
checked={isChidori}
checked={moduleSetupOption.isChidori}
disabled={isChidoriNotAble}
value={'true'}
onChange={(e) => handleChangeChidori(e)}
@ -222,7 +218,14 @@ const Placement = forwardRef((props, refs) => {
<label htmlFor="ra01">{getMessage('modal.module.basic.setting.module.placement.do')}</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio02" id="ra02" checked={!isChidori} value={'false'} onChange={(e) => handleChangeChidori(e)} />
<input
type="radio"
name="radio02"
id="ra02"
checked={!moduleSetupOption.isChidori}
value={'false'}
onChange={(e) => handleChangeChidori(e)}
/>
<label htmlFor="ra02">{getMessage('modal.module.basic.setting.module.placement.do.not')}</label>
</div>
</div>
@ -232,24 +235,12 @@ const Placement = forwardRef((props, refs) => {
<div className="self-item-th">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard')}</div>
<div className="self-item-td">
<div className="pop-form-radio">
<div className="d-check-radio pop">
<input
type="radio"
name="radio03"
id="ra03"
checked={setupLocation === 'center'}
value={'center'}
onChange={handleSetupLocation}
disabled={isMultiModule}
/>
<label htmlFor="ra03">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard.center')}</label>
</div>
<div className="d-check-radio pop">
<input
type="radio"
name="radio04"
id="ra04"
checked={setupLocation === 'eaves'}
checked={moduleSetupOption.setupLocation === 'eaves'}
value={'eaves'}
onChange={handleSetupLocation}
/>
@ -260,7 +251,7 @@ const Placement = forwardRef((props, refs) => {
type="radio"
name="radio05"
id="ra05"
checked={setupLocation === 'ridge'}
checked={moduleSetupOption.setupLocation === 'ridge'}
value={'ridge'}
onChange={handleSetupLocation}
disabled={isMultiModule}

612
src/hooks/module/useModuleBasicSetting.js
View File

@ -8,7 +8,7 @@ import {
currentObjectState,
isManualModuleLayoutSetupState,
isManualModuleSetupState,
isModuleChidoriSetupState,
moduleSetupOptionState,
toggleManualSetupModeState,
} from '@/store/canvasAtom'
@ -33,6 +33,7 @@ import { v4 as uuidv4 } from 'uuid'
import { isObjectNotEmpty } from '@/util/common-utils'
import { useCircuitTrestle } from '@/hooks/useCirCuitTrestle'
import { useMode } from '@/hooks/useMode'
import { usePolygon } from '@/hooks/usePolygon'
export function useModuleBasicSetting(tabNum) {
const canvas = useRecoilValue(canvasState)
@ -61,7 +62,10 @@ export function useModuleBasicSetting(tabNum) {
const [currentObject, setCurrentObject] = useRecoilState(currentObjectState)
const { setModuleStatisticsData } = useCircuitTrestle()
const { createRoofPolygon, createMarginPolygon, createPaddingPolygon } = useMode()
const isModuleChidoriSetup = useRecoilValue(isModuleChidoriSetupState)
const { drawDirectionArrow } = usePolygon()
const moduleSetupOption = useRecoilValue(moduleSetupOptionState)
const setManualSetupMode = useSetRecoilState(toggleManualSetupModeState)
@ -440,13 +444,15 @@ export function useModuleBasicSetting(tabNum) {
*/
const manualModuleSetup = (placementRef) => {
//레이아웃 수동설치 토글
if (isManualModuleLayoutSetup) {
setIsManualModuleLayoutSetup(false)
setManualSetupMode(`manualLayoutSetup_false`)
}
const moduleSetupSurfaces = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) //모듈설치면를 가져옴
if (isManualModuleSetup) {
if (isManualModuleLayoutSetup) {
setIsManualModuleLayoutSetup(false)
// setManualSetupMode(`manualLayoutSetup_false`)
}
if (checkedModule.length === 0) {
swalFire({ text: getMessage('module.place.select.module') })
setIsManualModuleSetup(false)
@ -871,14 +877,17 @@ export function useModuleBasicSetting(tabNum) {
}
const manualModuleLayoutSetup = (layoutSetupRef) => {
if (isManualModuleSetup) {
setIsManualModuleSetup(false)
setManualSetupMode(`manualSetup_false`)
}
const moduleSetupSurfaces = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) //모듈설치면를 가져옴
const isChidori = moduleSetupOption.isChidori
const setupLocation = moduleSetupOption.setupLocation
if (isManualModuleLayoutSetup) {
if (isManualModuleSetup) {
setIsManualModuleSetup(false)
// setManualSetupMode(`manualSetup_false`)
}
if (checkedModule.length === 0) {
swalFire({ text: getMessage('module.place.select.module') })
setIsManualModuleLayoutSetup(false)
@ -887,7 +896,7 @@ export function useModuleBasicSetting(tabNum) {
}
const hasZeroLength = checkedModule.some((item) =>
layoutSetupRef.current.some((layoutItem) => item.itemId === layoutItem.moduleId && (layoutItem.row === 0 || layoutItem.col === 0)),
layoutSetupRef.some((layoutItem) => item.itemId === layoutItem.moduleId && (layoutItem.row === 0 || layoutItem.col === 0)),
)
if (hasZeroLength) {
@ -1009,20 +1018,20 @@ export function useModuleBasicSetting(tabNum) {
const points = [
{
x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) + toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
},
{
x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) + toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) + toFixedWithoutRounding(height / 2, 2),
},
{
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2),
},
{
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
x: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2),
y: toFixedWithoutRounding(mousePoint.y, 2) + toFixedWithoutRounding(height / 2, 2),
},
]
@ -1039,11 +1048,11 @@ export function useModuleBasicSetting(tabNum) {
stroke: 'black',
strokeWidth: 1,
strokeDashArray: [10, 5],
width: Number(width.toFixed(1)), //작은버전
height: Number(height.toFixed(1)), //작은버전
left: Number(mousePoint.x.toFixed(1) - Number((width / 2).toFixed(1))), //작은버전
top: Number(mousePoint.y.toFixed(1) - Number((height / 2).toFixed(1))), //작은버전
// width: Number((width * col).toFixed(1)) + Number((intvHor * (col - 1)).toFixed(1)), //큰버전
width: toFixedWithoutRounding(width, 2), //작은버전
height: toFixedWithoutRounding(height, 2), //작은버전
left: toFixedWithoutRounding(mousePoint.x, 2) - toFixedWithoutRounding(width / 2, 2), //작은버전
top: toFixedWithoutRounding(mousePoint.y, 2) - toFixedWithoutRounding(height / 2, 2), //작은버전
// // width: Number((width * col).toFixed(1)) + Number((intvHor * (col - 1)).toFixed(1)), //큰버전
// height: Number((height * row).toFixed(1)) + Number((intvVer * (row - 1)).toFixed(1)), //큰버전
// left: Number(mousePoint.x.toFixed(1)) - calcHalfWidth.toFixed(1), //큰버전
// top: Number(mousePoint.y.toFixed(1)) - calcHalfHeight.toFixed(1), //큰버전
@ -1068,77 +1077,131 @@ export function useModuleBasicSetting(tabNum) {
* 스냅기능
*/
let snapDistance = flowDirection === 'south' || flowDirection === 'north' ? 70 : 40
let sideSnapDistance = 15
let trestleSnapDistance = 15
const trestleLeft = Number(moduleSetupSurfaces[i].left.toFixed(1)) - Number((moduleSetupSurfaces[i].width / 2).toFixed(1))
const trestleTop = Number(moduleSetupSurfaces[i].top.toFixed(1)) - Number((moduleSetupSurfaces[i].height / 2).toFixed(1))
const trestleRight = Number(moduleSetupSurfaces[i].left.toFixed(1)) + Number((moduleSetupSurfaces[i].width / 2).toFixed(1))
const trestleBottom = Number(moduleSetupSurfaces[i].top.toFixed(1)) + Number((moduleSetupSurfaces[i].height / 2).toFixed(1))
const trestleLeft = toFixedWithoutRounding(moduleSetupSurfaces[i].left, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].width / 2, 2)
const trestleTop = toFixedWithoutRounding(moduleSetupSurfaces[i].top, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].height / 2, 2)
const trestleRight =
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 smallLeft = Number(tempModule.left.toFixed(1))
const smallTop = Number(tempModule.top.toFixed(1))
const smallRight = smallLeft + Number(tempModule.width.toFixed(1))
const smallBottom = smallTop + Number(tempModule.height.toFixed(1))
const smallCenterX = smallLeft + Number((tempModule.width / 2).toFixed(1))
const smallCenterY = smallTop + Number((tempModule.height / 2).toFixed(1))
const smallLeft = toFixedWithoutRounding(tempModule.left, 2)
const smallTop = toFixedWithoutRounding(tempModule.top, 2)
const smallRight = smallLeft + toFixedWithoutRounding(tempModule.width, 2)
const smallBottom = smallTop + toFixedWithoutRounding(tempModule.height, 2)
const smallCenterX = smallLeft + toFixedWithoutRounding(tempModule.width / 2, 2)
const smallCenterY = smallTop + toFixedWithoutRounding(tempModule.height / 2, 2)
/**
* 미리 깔아놓은 셀이 있을때 셀에 흡착됨
*/
if (manualDrawModules) {
manualDrawModules.forEach((cell) => {
const holdCellLeft = cell.left
const holdCellTop = cell.top
const holdCellRight = holdCellLeft + Number(cell.width.toFixed(1))
const holdCellBottom = holdCellTop + Number(cell.height.toFixed(1))
const holdCellCenterX = holdCellLeft + Number((cell.width / 2).toFixed(1))
const holdCellCenterY = holdCellTop + Number((cell.height / 2).toFixed(1))
const holdCellLeft = toFixedWithoutRounding(cell.left, 2)
const holdCellTop = toFixedWithoutRounding(cell.top, 2)
const holdCellRight = holdCellLeft + toFixedWithoutRounding(cell.width, 2)
const holdCellBottom = holdCellTop + toFixedWithoutRounding(cell.height, 2)
const holdCellCenterX = holdCellLeft + toFixedWithoutRounding(cell.width / 2, 2)
const holdCellCenterY = holdCellTop + toFixedWithoutRounding(cell.height / 2, 2)
//흐름방향따라 달라야 한다.
if (flowDirection === 'south' || flowDirection === 'north') {
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
//움직이는 모듈 가운데 -> 설치 모듈 가운데
tempModule.left = holdCellCenterX - toFixedWithoutRounding(width / 2, 2)
}
//움직이는 모듈왼쪽 -> 가운데
if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX + intvHor / 2
}
// 오른쪽 -> 가운데
if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX - width - intvHor / 2
}
//설치된 셀에 좌측에 스냅
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
// console.log('모듈 좌측 스냅')
tempModule.left = holdCellLeft - width - intvHor
}
//설치된 셀에 우측에 스냅
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
// console.log('모듈 우측 스냅')
tempModule.left = holdCellRight + intvHor
}
//설치된 셀에 위쪽에 스냅
if (Math.abs(smallBottom - holdCellTop) < snapDistance) {
if (Math.abs(smallBottom - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop - height - intvVer
}
//설치된 셀에 밑쪽에 스냅
if (Math.abs(smallTop - holdCellBottom) < snapDistance) {
if (Math.abs(smallTop - holdCellBottom) < sideSnapDistance) {
tempModule.top = holdCellBottom + intvVer
}
//가운데 -> 가운데
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX - Number((width / 2).toFixed(1))
//설치된 셀에 윗쪽에 스냅
if (Math.abs(smallTop - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop
}
//왼쪽 -> 가운데
if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX
}
// 오른쪽 -> 가운데
if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
tempModule.left = holdCellCenterX - width
}
//세로 가운데 -> 가운데
} else {
//흐름방향 west, east
//가운데 가운데
if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
tempModule.top = holdCellCenterY - Number((height / 2).toFixed(1))
tempModule.top = holdCellCenterY - toFixedWithoutRounding(width / 2, 2)
}
//위쪽 -> 가운데
if (Math.abs(smallTop - holdCellCenterY) < snapDistance) {
// console.log('holdCellCenterX', holdCellCenterX)
// console.log('smallLeft', smallLeft)
// console.log('모듈 센터에 스냅')
tempModule.top = holdCellCenterY + intvHor / 2
// console.log('tempModule.left', tempModule.left)
}
// 밑 -> 가운데
if (Math.abs(smallBottom - holdCellCenterY) < snapDistance) {
tempModule.top = holdCellCenterY - height - intvHor / 2
}
//설치된 셀에 좌측에 스냅
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
// console.log('모듈 좌측 스냅')
tempModule.left = holdCellLeft - width - intvHor
}
//설치된 셀에 우측에 스냅
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
// console.log('모듈 우측 스냅')
tempModule.left = holdCellRight + intvHor
}
//설치된 셀에 위쪽에 스냅
if (Math.abs(smallBottom - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop - height - intvVer
}
//설치된 셀에 밑쪽에 스냅
if (Math.abs(smallTop - holdCellBottom) < sideSnapDistance) {
tempModule.top = holdCellBottom + intvVer
}
//설치된 셀에 윗쪽에 스냅
if (Math.abs(smallTop - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop
}
if (Math.abs(smallLeft - holdCellLeft) < snapDistance) {
tempModule.left = holdCellLeft
}
}
// //위쪽 -> 가운데
// if (Math.abs(smallTop - holdCellCenterY) < cellSnapDistance) {
// tempModule.top = holdCellCenterY
// }
// //아랫쪽 -> 가운데
// if (Math.abs(smallBottom - holdCellCenterY) < cellSnapDistance) {
// tempModule.top = holdCellCenterY - height
// }
})
}
@ -1162,33 +1225,15 @@ export function useModuleBasicSetting(tabNum) {
}
if (flowDirection === 'south' || flowDirection === 'north') {
// 모듈왼쪽이 세로중앙선에 붙게 스냅
// if (Math.abs(smallLeft - (trestleLeft + moduleSetupSurfaces[i].width / 2)) < snapDistance) {
// tempModule.left = trestleLeft + moduleSetupSurfaces[i].width / 2
// }
// 모듈이 가운데가 세로중앙선에 붙게 스냅
if (Math.abs(smallCenterX - (trestleLeft + moduleSetupSurfaces[i].width / 2)) < trestleSnapDistance) {
tempModule.left = trestleLeft + moduleSetupSurfaces[i].width / 2 - tempModule.width / 2
}
// 모듈오른쪽이 세로중앙선에 붙게 스냅
// if (Math.abs(smallRight - (trestleLeft + moduleSetupSurfaces[i].width / 2)) < trestleSnapDistance) {
// tempModule.left = trestleLeft + moduleSetupSurfaces[i].width / 2 - tempModule.width * tempModule.scaleX
// }
} else {
// 모듈이 가로중앙선에 스냅
if (Math.abs(smallTop + tempModule.height / 2 - bigCenterY) < trestleSnapDistance) {
tempModule.top = bigCenterY - tempModule.height / 2
}
// if (Math.abs(smallTop - (trestleTop + moduleSetupSurfaces[i].height / 2)) < trestleSnapDistance) {
// tempModule.top = trestleTop + moduleSetupSurfaces[i].height / 2
// }
// 모듈 밑면이 가로중앙선에 스냅
// if (Math.abs(smallBottom - (trestleTop + moduleSetupSurfaces[i].height / 2)) < trestleSnapDistance) {
// tempModule.top = trestleTop + moduleSetupSurfaces[i].height / 2 - tempModule.height * tempModule.scaleY
// }
}
tempModule.setCoords()
@ -1234,15 +1279,16 @@ export function useModuleBasicSetting(tabNum) {
: tmpHeight
//그려진 가이드 라인의 포인트를 기준으로 시작점을 만든다
if (flowDirection === 'south') {
//남쪽에 처마방향이나 북쪽에 용마루면
if ((flowDirection === 'south' && setupLocation === 'eaves') || (flowDirection === 'north' && setupLocation === 'ridge')) {
//남
startX = toFixedWithoutRounding(tempModule.left, 1)
startY = toFixedWithoutRounding(tempModule.top + tempModule.height, 1)
moduleOptions.fill = module.color
let col = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].col
let row = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].row
let col = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].col
let row = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].row
let tempCol = col
for (let i = 0; i < row; i++) {
@ -1257,7 +1303,7 @@ export function useModuleBasicSetting(tabNum) {
let tempHeightMargin = i === 0 ? 0 : i * intvVer
//치도리 설치시 컬럼 조정
if (isModuleChidoriSetup) {
if (isChidori) {
//치도리면 짝수열은 안으로 넣기
tempCol = installedHeightModuleCount % 2 === 0 ? col : col - 1
}
@ -1267,7 +1313,7 @@ export function useModuleBasicSetting(tabNum) {
let tempX = startX + j * width
let tempWidthMargin = j === 0 ? 0 : j * intvHor
if (isModuleChidoriSetup) {
if (isChidori) {
chidoriMargin = installedHeightModuleCount % 2 === 0 ? 0 : width / 2 + intvHor
}
@ -1324,14 +1370,6 @@ export function useModuleBasicSetting(tabNum) {
swalFire({ text: getMessage('module.place.overlab') })
return
}
// getModuleStatistics()
// } else {
// swalFire({ text: getMessage('module.place.overlab') })
// return
// tempModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
// canvas?.add(tempModule)
// canvas.renderAll()
// }
}
}
@ -1339,17 +1377,21 @@ export function useModuleBasicSetting(tabNum) {
++installedHeightModuleCount
}
}
} else if (flowDirection === 'north') {
//북쪽에 처마거나 남쪽에 용마루일경우
} else if ((flowDirection === 'north' && setupLocation === 'eaves') || (flowDirection === 'south' && setupLocation === 'ridge')) {
//북북
startX = toFixedWithoutRounding(tempModule.left + tempModule.width, 1)
startY = toFixedWithoutRounding(tempModule.top, 1)
moduleOptions.fill = module.color
const col = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].col
const row = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].row
const col = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].col
const row = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].row
let tempCol = col //치도리시 하나 빼려고 임시로
for (let i = 0; i < row; i++) {
let tempY = startY + i * height
let isInstalled = false
if (index > 0) {
//두번째 모듈일때 마지막 설치 지점
@ -1358,15 +1400,24 @@ export function useModuleBasicSetting(tabNum) {
let tempHeightMargin = i === 0 ? 0 : i * intvVer
for (let j = 0; j < col; j++) {
if (isChidori) {
tempCol = installedHeightModuleCount % 2 === 0 ? col : col - 1
}
for (let j = 0; j < tempCol; j++) {
let chidoriMargin = 0
let tempX = startX - j * width
let tempWidthMargin = j === 0 ? 0 : j * intvHor
if (isChidori) {
chidoriMargin = installedHeightModuleCount % 2 === 0 ? 0 : width / 2 + intvHor
}
let rectPoints = [
{ x: tempX - tempWidthMargin, y: tempY + height + tempHeightMargin },
{ x: tempX - tempWidthMargin, y: tempY + tempHeightMargin },
{ x: tempX - width - tempWidthMargin, y: tempY + tempHeightMargin },
{ x: tempX - width - tempWidthMargin, y: tempY + height + tempHeightMargin },
{ x: tempX - tempWidthMargin - chidoriMargin, y: tempY + height + tempHeightMargin },
{ x: tempX - tempWidthMargin - chidoriMargin, y: tempY + tempHeightMargin },
{ x: tempX - width - tempWidthMargin - chidoriMargin, y: tempY + tempHeightMargin },
{ x: tempX - width - tempWidthMargin - chidoriMargin, y: tempY + height + tempHeightMargin },
]
tempModule.set({ points: rectPoints })
@ -1386,8 +1437,6 @@ export function useModuleBasicSetting(tabNum) {
let manualModule = new QPolygon(tempModule.points, {
...moduleOptions,
moduleInfo: module,
// left: toFixedWithoutRounding(tempX + tempWidthMargin, 1),
// top: toFixedWithoutRounding(tempY - height - tempHeightMargin, 1),
width: toFixedWithoutRounding(width, 1),
height: toFixedWithoutRounding(height, 1),
})
@ -1401,6 +1450,10 @@ export function useModuleBasicSetting(tabNum) {
manualDrawModules.push(manualModule)
setModuleStatisticsData()
installedLastHeightCoord = tempY + height + tempHeightMargin
if (j === 0) {
isInstalled = true
}
} else {
//디버깅용
// manualModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
@ -1411,44 +1464,52 @@ export function useModuleBasicSetting(tabNum) {
swalFire({ text: getMessage('module.place.overlab') })
return
}
// getModuleStatistics()
// } else {
// swalFire({ text: getMessage('module.place.overlab') })
// return
// tempModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
// canvas?.add(tempModule)
// canvas.renderAll()
// }
}
}
if (isInstalled) {
++installedHeightModuleCount
}
} else if (flowDirection === 'west') {
}
//서쪽에 처마 또는 동쪽의 용마루일경우
} else if ((flowDirection === 'west' && setupLocation === 'eaves') || (flowDirection === 'east' && setupLocation === 'ridge')) {
startX = toFixedWithoutRounding(tempModule.left, 1)
startY = toFixedWithoutRounding(tempModule.top, 1)
moduleOptions.fill = module.color
const col = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].col
const row = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].row
const col = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].col
const row = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].row
let tempCol = col //치도리시 하나 빼려고 임시로
for (let i = 0; i < row; i++) {
//옆으로 올라가는거라 height가 아니고 width로 변경
let tempX = startX + i * width
let tempWidthMargin = i === 0 ? 0 : i * intvHor
let isInstalled = false
if (index > 0) {
//두번째 모듈일때 마지막 설치 지점 //명칭은 그대로 쓴다
tempX = index > 0 && i === 0 ? installedLastHeightCoord + intvHor : installedLastHeightCoord
}
for (let j = 0; j < col; j++) {
if (isChidori) {
tempCol = installedHeightModuleCount % 2 === 0 ? col : col - 1
}
for (let j = 0; j < tempCol; j++) {
let tempY = startY + j * height
let tempHeightMargin = j === 0 ? 0 : j * intvVer
let chidoriMargin = 0
if (isChidori) {
chidoriMargin = installedHeightModuleCount % 2 === 0 ? 0 : height / 2 + intvVer
}
let rectPoints = [
{ x: tempX + tempWidthMargin, y: tempY + tempHeightMargin },
{ x: tempX + tempWidthMargin, y: tempY + height + tempHeightMargin },
{ x: tempX + width + tempWidthMargin, y: tempY + height + tempHeightMargin },
{ x: tempX + width + tempWidthMargin, y: tempY + tempHeightMargin },
{ x: tempX + tempWidthMargin, y: tempY + tempHeightMargin + chidoriMargin },
{ x: tempX + tempWidthMargin, y: tempY + height + tempHeightMargin + chidoriMargin },
{ x: tempX + width + tempWidthMargin, y: tempY + height + tempHeightMargin + chidoriMargin },
{ x: tempX + width + tempWidthMargin, y: tempY + tempHeightMargin + chidoriMargin },
]
tempModule.set({ points: rectPoints })
@ -1468,8 +1529,6 @@ export function useModuleBasicSetting(tabNum) {
let manualModule = new QPolygon(tempModule.points, {
...moduleOptions,
moduleInfo: module,
// left: toFixedWithoutRounding(tempX + tempWidthMargin, 1),
// top: toFixedWithoutRounding(tempY - height - tempHeightMargin, 1),
width: toFixedWithoutRounding(width, 1),
height: toFixedWithoutRounding(height, 1),
})
@ -1483,6 +1542,10 @@ export function useModuleBasicSetting(tabNum) {
manualDrawModules.push(manualModule)
setModuleStatisticsData()
installedLastHeightCoord = tempX + width + tempWidthMargin
if (j === 0) {
isInstalled = true
}
} else {
//디버깅용
// manualModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
@ -1493,44 +1556,51 @@ export function useModuleBasicSetting(tabNum) {
swalFire({ text: getMessage('module.place.overlab') })
return
}
// getModuleStatistics()
// } else {
// swalFire({ text: getMessage('module.place.overlab') })
// return
// tempModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
// canvas?.add(tempModule)
// canvas.renderAll()
// }
}
}
if (isInstalled) {
++installedHeightModuleCount
}
} else {
}
//동쪽의 처마 또는 서쪽의 용마루일경우
} else if ((flowDirection === 'east' && setupLocation === 'eaves') || (flowDirection === 'west' && setupLocation === 'ridge')) {
startX = toFixedWithoutRounding(tempModule.left + width, 1)
startY = toFixedWithoutRounding(tempModule.top + height, 1)
moduleOptions.fill = module.color
const col = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].col
const row = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].row
const col = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].col
const row = layoutSetupRef.filter((item) => item.moduleId === module.itemId)[0].row
let tempCol = col //치도리시 하나 빼려고 임시로
for (let i = 0; i < row; i++) {
//옆으로 올라가는거라 height가 아니고 width로 변경
let tempX = startX - i * width
let tempWidthMargin = i === 0 ? 0 : i * intvHor
let isInstalled = false
if (index > 0) {
//두번째 모듈일때 마지막 설치 지점 //명칭은 그대로 쓴다
tempX = index > 0 && i === 0 ? installedLastHeightCoord - intvHor : installedLastHeightCoord
}
for (let j = 0; j < col; j++) {
if (isChidori) {
tempCol = installedHeightModuleCount % 2 === 0 ? col : col - 1
}
for (let j = 0; j < tempCol; j++) {
let chidoriMargin = 0
let tempY = startY - j * height
let tempHeightMargin = j === 0 ? 0 : j * intvVer
if (isChidori) {
chidoriMargin = installedHeightModuleCount % 2 === 0 ? 0 : height / 2 + intvVer
}
let rectPoints = [
{ x: tempX - tempWidthMargin, y: tempY - tempHeightMargin },
{ x: tempX - tempWidthMargin, y: tempY - height - tempHeightMargin },
{ x: tempX - width - tempWidthMargin, y: tempY - height - tempHeightMargin },
{ x: tempX - width - tempWidthMargin, y: tempY - tempHeightMargin },
{ x: tempX - tempWidthMargin, y: tempY - tempHeightMargin - chidoriMargin },
{ x: tempX - tempWidthMargin, y: tempY - height - tempHeightMargin - chidoriMargin },
{ x: tempX - width - tempWidthMargin, y: tempY - height - tempHeightMargin - chidoriMargin },
{ x: tempX - width - tempWidthMargin, y: tempY - tempHeightMargin - chidoriMargin },
]
tempModule.set({ points: rectPoints })
@ -1550,8 +1620,6 @@ export function useModuleBasicSetting(tabNum) {
let manualModule = new QPolygon(tempModule.points, {
...moduleOptions,
moduleInfo: module,
// left: toFixedWithoutRounding(tempX + tempWidthMargin, 1),
// top: toFixedWithoutRounding(tempY - height - tempHeightMargin, 1),
width: toFixedWithoutRounding(width, 1),
height: toFixedWithoutRounding(height, 1),
})
@ -1565,6 +1633,10 @@ export function useModuleBasicSetting(tabNum) {
manualDrawModules.push(manualModule)
setModuleStatisticsData()
installedLastHeightCoord = tempX - width - tempWidthMargin
if (j === 0) {
isInstalled = true
}
} else {
//디버깅용
// manualModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
@ -1575,65 +1647,14 @@ export function useModuleBasicSetting(tabNum) {
swalFire({ text: getMessage('module.place.overlab') })
return
}
// getModuleStatistics()
// } else {
// swalFire({ text: getMessage('module.place.overlab') })
// return
// tempModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
// canvas?.add(tempModule)
// canvas.renderAll()
// }
}
}
if (isInstalled) {
++installedHeightModuleCount
}
}
}
})
//도머 객체를 가져옴
// if (batchObjects) {
// batchObjects.forEach((object) => {
// let dormerTurfPolygon = polygonToTurfPolygon(object, true)
// const intersection = turf.intersect(turf.featureCollection([dormerTurfPolygon, tempTurfModule])) //겹치는지 확인
// //겹치면 안됨
// if (intersection) {
// swalFire({ text: getMessage('module.place.overobject') })
// isIntersection = false
// }
// })
// }
// if (!isIntersection) return
// tempModule.setCoords() //좌표 재정렬
// if (turf.booleanContains(turfPolygon, tempTurfModule) || turf.booleanWithin(tempTurfModule, turfPolygon)) {
// //마우스 클릭시 set으로 해당 위치에 셀을 넣음
// const isOverlap = manualDrawModules.some((module) => turf.booleanOverlap(tempTurfModule, polygonToTurfPolygon(module))) //겹치는지 확인
// if (!isOverlap) {
// canvas?.remove(tempModule)
// //안겹치면 넣는다
// // tempModule.setCoords()
// moduleOptions.surfaceId = trestlePolygon.id
// // console.log('tempModule.points', tempModule.points)
// let manualModule = new QPolygon(tempModule.points, {
// ...moduleOptions,
// moduleInfo: checkedModule[0],
// left: Number(tempModule.left.toFixed(1)),
// top: Number(tempModule.top.toFixed(1)),
// width: Number(tempModule.width.toFixed(1)),
// height: Number(tempModule.height.toFixed(1)),
// })
// canvas?.add(manualModule)
// manualDrawModules.push(manualModule)
// setModuleStatisticsData()
// // getModuleStatistics()
// } else {
// swalFire({ text: getMessage('module.place.overlab') })
// }
// } else {
// swalFire({ text: getMessage('module.place.out') })
// }
}
})
}
@ -1663,8 +1684,8 @@ export function useModuleBasicSetting(tabNum) {
return
}
const isChidori = placementRef.isChidori.current === 'true' ? true : false
const setupLocation = placementRef.setupLocation.current
const isChidori = moduleSetupOption.isChidori
const setupLocation = moduleSetupOption.setupLocation
const isMaxSetup = false
// const isMaxSetup = placementRef.isMaxSetup.current === 'true' ? true : false
@ -2784,7 +2805,7 @@ export function useModuleBasicSetting(tabNum) {
) //도머s 객체
let moduleOptions = {
fill: '#BFFD9F',
fill: checkedModule[0].color,
stroke: 'black',
strokeWidth: 0.3,
selectable: true, // 선택 가능하게 설정
@ -2817,14 +2838,15 @@ export function useModuleBasicSetting(tabNum) {
const angle = calculateAngle(points1, points2)
//변별로 선택으로 되어있을때 모듈면을 회전시키기
const targetdSurface = moduleSetupSurfaces.filter((surface) => surface.surfaceId === obj.surfaceId)[0]
targetdSurface.angle = -angle
const targetSurface = moduleSetupSurfaces.filter((surface) => surface.surfaceId === obj.surfaceId)[0]
targetSurface.angle = -angle
//변별로 선택되어있는 지붕도 회전시키기
const targetRoof = canvas.getObjects().filter((roof) => roof.name === POLYGON_TYPE.ROOF && roof.id === targetdSurface.parentId)[0]
const targetRoof = canvas.getObjects().filter((roof) => roof.name === POLYGON_TYPE.ROOF && roof.id === targetSurface.parentId)[0]
targetRoof.angle = -angle
targetRoof.fire('modified')
targetdSurface.fire('modified')
targetSurface.fire('modified')
drawDirectionArrow(targetRoof)
}
canvas.remove(obj)
})
@ -2833,6 +2855,10 @@ export function useModuleBasicSetting(tabNum) {
const targetRoof = canvas.getObjects().filter((roof) => roof.name === POLYGON_TYPE.ROOF && roof.id === surface.parentId)[0]
if (targetRoof) targetRoof.angle = -compasDeg
surface.angle = -compasDeg
targetRoof.fire('modified')
surface.fire('modified')
drawDirectionArrow(targetRoof)
})
}
canvas.renderAll()
@ -2896,131 +2922,158 @@ export function useModuleBasicSetting(tabNum) {
/**
* 스냅기능
*/
let snapDistance = 10
let cellSnapDistance = 50
let snapDistance = flowDirection === 'south' || flowDirection === 'north' ? 70 : 40
let sideSnapDistance = 15
let trestleSnapDistance = 15
let intvHor = flowDirection === 'south' || flowDirection === 'north' ? 1 : 3
let intvVer = flowDirection === 'south' || flowDirection === 'north' ? 3 : 1
let intvVer = flowDirection === 'south' || flowDirection === 'north' ? 10 : 30
let intvHor = flowDirection === 'south' || flowDirection === 'north' ? 30 : 10
const trestleLeft = moduleSetupSurfaces[i].left
const trestleTop = moduleSetupSurfaces[i].top
const trestleRight = trestleLeft + moduleSetupSurfaces[i].width * moduleSetupSurfaces[i].scaleX
const trestleBottom = trestleTop + moduleSetupSurfaces[i].height * moduleSetupSurfaces[i].scaleY
const trestleLeft = toFixedWithoutRounding(moduleSetupSurfaces[i].left, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].width / 2, 2)
const trestleTop = toFixedWithoutRounding(moduleSetupSurfaces[i].top, 2) - toFixedWithoutRounding(moduleSetupSurfaces[i].height / 2, 2)
const trestleRight =
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 smallLeft = tempModule.left
const smallTop = tempModule.top
const smallRight = smallLeft + tempModule.width * tempModule.scaleX
const smallBottom = smallTop + tempModule.height * tempModule.scaleY
const smallCenterX = smallLeft + (tempModule.width * tempModule.scaleX) / 2
const smallCenterY = smallTop + (tempModule.height * tempModule.scaleX) / 2
// 이동하는 모듈의 경계 좌표
const smallLeft = toFixedWithoutRounding(tempModule.left, 2)
const smallTop = toFixedWithoutRounding(tempModule.top, 2)
const smallRight = smallLeft + toFixedWithoutRounding(tempModule.width, 2)
const smallBottom = smallTop + toFixedWithoutRounding(tempModule.height, 2)
const smallCenterX = smallLeft + toFixedWithoutRounding(tempModule.width / 2, 2)
const smallCenterY = smallTop + toFixedWithoutRounding(tempModule.height / 2, 2)
/**
* 미리 깔아놓은 셀이 있을때 셀에 흡착됨
*/
if (manualDrawModules) {
manualDrawModules.forEach((cell) => {
const holdCellLeft = cell.left
const holdCellTop = cell.top
const holdCellRight = holdCellLeft + cell.width * cell.scaleX
const holdCellBottom = holdCellTop + cell.height * cell.scaleY
const holdCellCenterX = holdCellLeft + (cell.width * cell.scaleX) / 2
const holdCellCenterY = holdCellTop + (cell.height * cell.scaleY) / 2
const holdCellLeft = toFixedWithoutRounding(cell.left, 2)
const holdCellTop = toFixedWithoutRounding(cell.top, 2)
const holdCellRight = holdCellLeft + toFixedWithoutRounding(cell.width, 2)
const holdCellBottom = holdCellTop + toFixedWithoutRounding(cell.height, 2)
const holdCellCenterX = holdCellLeft + toFixedWithoutRounding(cell.width / 2, 2)
const holdCellCenterY = holdCellTop + toFixedWithoutRounding(cell.height / 2, 2)
//흐름방향따라 달라야 한다.
if (flowDirection === 'south' || flowDirection === 'north') {
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
//움직이는 모듈 가운데 -> 설치 모듈 가운데
tempModule.left = holdCellCenterX - toFixedWithoutRounding(width / 2, 2)
}
//설치된 셀에 좌측에 스냅
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
// console.log('모듈 좌측 스냅')
tempModule.left = holdCellLeft - width - intvHor
}
//설치된 셀에 우측에 스냅
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
// console.log('모듈 우측 스냅')
tempModule.left = holdCellRight + intvHor
}
//설치된 셀에 위쪽에 스냅
if (Math.abs(smallBottom - holdCellTop) < snapDistance) {
if (Math.abs(smallBottom - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop - height - intvVer
}
//설치된 셀에 밑쪽에 스냅
if (Math.abs(smallTop - holdCellBottom) < snapDistance) {
if (Math.abs(smallTop - holdCellBottom) < sideSnapDistance) {
tempModule.top = holdCellBottom + intvVer
}
//가운데 -> 가운데
if (Math.abs(smallCenterX - holdCellCenterX) < cellSnapDistance) {
tempModule.left = holdCellCenterX - width / 2
//설치된 셀에 윗쪽에 스냅
if (Math.abs(smallTop - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop
}
//왼쪽 -> 가운데
if (Math.abs(smallLeft - holdCellCenterX) < cellSnapDistance) {
tempModule.left = holdCellCenterX
} else {
//흐름방향 west, east
//가운데 가운데
if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
tempModule.top = holdCellCenterY - toFixedWithoutRounding(width / 2, 2)
}
// 오른쪽 -> 가운데
if (Math.abs(smallRight - holdCellCenterX) < cellSnapDistance) {
tempModule.left = holdCellCenterX - width
//위쪽 -> 가운데
if (Math.abs(smallTop - holdCellCenterY) < snapDistance) {
// console.log('holdCellCenterX', holdCellCenterX)
// console.log('smallLeft', smallLeft)
// console.log('모듈 센터에 스냅')
tempModule.top = holdCellCenterY + intvHor / 2
// console.log('tempModule.left', tempModule.left)
}
// 밑 -> 가운데
if (Math.abs(smallBottom - holdCellCenterY) < snapDistance) {
tempModule.top = holdCellCenterY - height - intvHor / 2
}
//설치된 셀에 좌측에 스냅
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
// console.log('모듈 좌측 스냅')
tempModule.left = holdCellLeft - width - intvHor
}
//설치된 셀에 우측에 스냅
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
// console.log('모듈 우측 스냅')
tempModule.left = holdCellRight + intvHor
}
//설치된 셀에 위쪽에 스냅
if (Math.abs(smallBottom - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop - height - intvVer
}
//설치된 셀에 밑쪽에 스냅
if (Math.abs(smallTop - holdCellBottom) < sideSnapDistance) {
tempModule.top = holdCellBottom + intvVer
}
//설치된 셀에 윗쪽에 스냅
if (Math.abs(smallTop - holdCellTop) < sideSnapDistance) {
tempModule.top = holdCellTop
}
if (Math.abs(smallLeft - holdCellLeft) < snapDistance) {
tempModule.left = holdCellLeft
}
//세로 가운데 -> 가운데
if (Math.abs(smallCenterY - holdCellCenterY) < cellSnapDistance) {
tempModule.top = holdCellCenterY - height / 2
}
// //위쪽 -> 가운데
// if (Math.abs(smallTop - holdCellCenterY) < cellSnapDistance) {
// tempModule.top = holdCellCenterY
// }
// //아랫쪽 -> 가운데
// if (Math.abs(smallBottom - holdCellCenterY) < cellSnapDistance) {
// tempModule.top = holdCellCenterY - height
// }
})
}
// 위쪽 변에 스냅
if (Math.abs(smallTop - trestleTop) < snapDistance) {
tempModule.top = trestleTop
if (Math.abs(smallTop - trestleTop) < trestleSnapDistance) {
tempModule.top = trestleTop + 1
}
// 아래쪽 변에 스냅
if (Math.abs(smallTop + tempModule.height * tempModule.scaleY - (trestleTop + moduleSetupSurfaces[i].height)) < snapDistance) {
tempModule.top = trestleTop + moduleSetupSurfaces[i].height - tempModule.height * tempModule.scaleY
if (Math.abs(smallBottom - trestleBottom) < trestleSnapDistance) {
tempModule.top = trestleTop + moduleSetupSurfaces[i].height - tempModule.height - 1
}
// 왼쪽변에 스냅
if (Math.abs(smallLeft - trestleLeft) < snapDistance) {
tempModule.left = trestleLeft
if (Math.abs(smallLeft - trestleLeft) < trestleSnapDistance) {
tempModule.left = trestleLeft + 1
}
//오른쪽 변에 스냅
if (Math.abs(smallRight - trestleRight) < snapDistance) {
tempModule.left = trestleRight - tempModule.width * tempModule.scaleX
if (Math.abs(smallRight - trestleRight) < trestleSnapDistance) {
tempModule.left = trestleRight - tempModule.width - 1
}
if (flowDirection === 'south' || flowDirection === 'north') {
// 모듈왼쪽이 세로중앙선에 붙게 스냅
if (Math.abs(smallLeft - (trestleLeft + moduleSetupSurfaces[i].width / 2)) < snapDistance) {
tempModule.left = trestleLeft + moduleSetupSurfaces[i].width / 2
}
// 모듈이 가운데가 세로중앙선에 붙게 스냅
if (Math.abs(smallCenterX - (trestleLeft + moduleSetupSurfaces[i].width / 2)) < snapDistance) {
tempModule.left = trestleLeft + moduleSetupSurfaces[i].width / 2 - (tempModule.width * tempModule.scaleX) / 2
}
// 모듈오른쪽이 세로중앙선에 붙게 스냅
if (Math.abs(smallRight - (trestleLeft + moduleSetupSurfaces[i].width / 2)) < snapDistance) {
tempModule.left = trestleLeft + moduleSetupSurfaces[i].width / 2 - tempModule.width * tempModule.scaleX
if (Math.abs(smallCenterX - (trestleLeft + moduleSetupSurfaces[i].width / 2)) < trestleSnapDistance) {
tempModule.left = trestleLeft + moduleSetupSurfaces[i].width / 2 - tempModule.width / 2
}
} else {
// 모듈이 가로중앙선에 스냅
if (Math.abs(smallTop + tempModule.height / 2 - bigCenterY) < snapDistance) {
if (Math.abs(smallTop + tempModule.height / 2 - bigCenterY) < trestleSnapDistance) {
tempModule.top = bigCenterY - tempModule.height / 2
}
if (Math.abs(smallTop - (trestleTop + moduleSetupSurfaces[i].height / 2)) < snapDistance) {
tempModule.top = trestleTop + moduleSetupSurfaces[i].height / 2
}
// 모듈 밑면이 가로중앙선에 스냅
if (Math.abs(smallBottom - (trestleTop + moduleSetupSurfaces[i].height / 2)) < snapDistance) {
tempModule.top = trestleTop + moduleSetupSurfaces[i].height / 2 - tempModule.height * tempModule.scaleY
}
}
tempModule.setCoords()
@ -3185,6 +3238,7 @@ export function useModuleBasicSetting(tabNum) {
targetRoof.setCoords()
targetSurface.setCoords()
moduleSetupSurfaces.push(targetSurface)
drawDirectionArrow(targetSurface)
}
canvas.remove(obj)
})
@ -3193,6 +3247,10 @@ export function useModuleBasicSetting(tabNum) {
const targetRoof = canvas.getObjects().filter((roof) => roof.name === POLYGON_TYPE.ROOF && roof.id === surface.parentId)[0]
if (targetRoof) targetRoof.angle = -compasDeg
surface.angle = -compasDeg
targetRoof.fire('modified')
surface.fire('modified')
drawDirectionArrow(surface)
})
}
canvas.renderAll()
@ -3275,8 +3333,6 @@ export function useModuleBasicSetting(tabNum) {
return turf.booleanContains(turfModuleSetupSurface, squarePolygon) || turf.booleanWithin(squarePolygon, turfModuleSetupSurface)
}
let moduleGroup = []
const flatRoofDownFlowSetupModule = (
surfaceMaxLines,
maxLengthLine,

9
src/store/canvasAtom.js
View File

@ -390,9 +390,12 @@ export const isManualModuleLayoutSetupState = atom({
default: false,
})
export const isModuleChidoriSetupState = atom({
key: 'isModuleChidoriSetupState',
default: false,
export const moduleSetupOptionState = atom({
key: 'moduleSetupOptionState',
default: {
isChidori: false, //치조 안함
setupLocation: 'eaves', //처마
},
})
export const toggleManualSetupModeState = atom({