레이아웃 설치
This commit is contained in:
parent
f9766a7d21
commit
ae2171c633
@ -25,9 +25,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
const { getMessage } = useMessage()
|
||||
const { closePopup } = usePopup()
|
||||
const [tabNum, setTabNum] = useState(1)
|
||||
const canvasSetting = useRecoilValue(canvasSettingState)
|
||||
const orientationRef = useRef(null)
|
||||
const { initEvent } = useEvent()
|
||||
const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState)
|
||||
const [isManualModuleLayoutSetup, setIsManualModuleLayoutSetup] = useRecoilState(isManualModuleLayoutSetupState)
|
||||
|
||||
@ -40,12 +38,9 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
const [isClosePopup, setIsClosePopup] = useState({ close: false, id: 0 })
|
||||
const [checkedModules, setCheckedModules] = useRecoilState(checkedModuleState)
|
||||
|
||||
const [manualSetupMode, setManualSetupMode] = useState('manualSetup')
|
||||
const [manualSetupMode, setManualSetupMode] = useState('')
|
||||
|
||||
const [layoutSetup, setLayoutSetup] = useState({
|
||||
col: 1,
|
||||
row: 1,
|
||||
})
|
||||
const [layoutSetup, setLayoutSetup] = useState([{}])
|
||||
|
||||
// const { initEvent } = useContext(EventContext)
|
||||
const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup, manualModuleLayoutSetup } =
|
||||
@ -98,12 +93,10 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
const placementRef = {
|
||||
isChidori: useRef('false'),
|
||||
setupLocation: useRef('eaves'),
|
||||
layoutSetup: useRef({
|
||||
col: 1,
|
||||
row: 1,
|
||||
}),
|
||||
}
|
||||
|
||||
const layoutSetupRef = useRef([])
|
||||
|
||||
const placementFlatRef = {
|
||||
setupLocation: useRef('south'),
|
||||
}
|
||||
@ -114,6 +107,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
}
|
||||
|
||||
const handleManualModuleLayoutSetup = () => {
|
||||
console.log('asdfasdkljfhaskjdhfakjsdhkfjh')
|
||||
setManualSetupMode(`manualLayoutSetup_${!isManualModuleLayoutSetup}`)
|
||||
setIsManualModuleLayoutSetup(!isManualModuleLayoutSetup)
|
||||
}
|
||||
@ -140,16 +134,21 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
if (isManualModuleSetup) {
|
||||
setIsManualModuleSetup(false)
|
||||
}
|
||||
if (isManualModuleLayoutSetup) {
|
||||
setIsManualModuleLayoutSetup(false)
|
||||
}
|
||||
}
|
||||
setIsClosePopup({ close: true, id: id })
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
console.log('asdfasdf', manualSetupMode)
|
||||
|
||||
if (basicSetting.roofSizeSet !== '3') {
|
||||
if (manualSetupMode.indexOf('manualSetup') > -1) {
|
||||
manualModuleSetup(placementRef)
|
||||
} else if (manualSetupMode.indexOf('manualLayoutSetup') > -1) {
|
||||
manualModuleLayoutSetup(placementRef)
|
||||
manualModuleLayoutSetup(layoutSetupRef)
|
||||
}
|
||||
} else {
|
||||
manualFlatroofModuleSetup(placementFlatRef)
|
||||
@ -161,7 +160,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
|
||||
useEffect(() => {
|
||||
if (isManualModuleLayoutSetup) {
|
||||
manualModuleLayoutSetup(placementRef)
|
||||
manualModuleLayoutSetup(layoutSetupRef)
|
||||
}
|
||||
}, [layoutSetup])
|
||||
|
||||
@ -183,7 +182,15 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
{tabNum === 1 && <Orientation ref={orientationRef} tabNum={tabNum} setTabNum={setTabNum} />}
|
||||
{/*배치면 초기설정 - 입력방법: 복시도 입력 || 실측값 입력*/}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 2 && <Module setTabNum={setTabNum} />}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 3 && <Placement setTabNum={setTabNum} ref={placementRef} />}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 3 && (
|
||||
<Placement
|
||||
setTabNum={setTabNum}
|
||||
ref={placementRef}
|
||||
layoutSetupRef={layoutSetupRef}
|
||||
layoutSetup={layoutSetup}
|
||||
setLayoutSetup={setLayoutSetup}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/*배치면 초기설정 - 입력방법: 육지붕*/}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet == '3' && tabNum === 2 && <PitchModule setTabNum={setTabNum} />}
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { forwardRef, useEffect, useState } from 'react'
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
|
||||
import { checkedModuleState, currentCanvasPlanState, isManualModuleSetupState } from '@/store/canvasAtom'
|
||||
import { checkedModuleState, currentCanvasPlanState, isManualModuleLayoutSetupState, isManualModuleSetupState } from '@/store/canvasAtom'
|
||||
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
|
||||
import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions'
|
||||
import { isObjectNotEmpty } from '@/util/common-utils'
|
||||
@ -23,7 +23,9 @@ const Placement = forwardRef((props, refs) => {
|
||||
|
||||
const [isMultiModule, setIsMultiModule] = useState(false)
|
||||
|
||||
const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState)
|
||||
//언마운트시 버튼 초기화
|
||||
const setIsManualModuleSetup = useSetRecoilState(isManualModuleSetupState)
|
||||
const setIsManualModuleLayoutSetup = useSetRecoilState(isManualModuleLayoutSetupState)
|
||||
|
||||
//모듈 배치면 생성
|
||||
useEffect(() => {
|
||||
@ -38,6 +40,7 @@ const Placement = forwardRef((props, refs) => {
|
||||
|
||||
return () => {
|
||||
setIsManualModuleSetup(false)
|
||||
setIsManualModuleLayoutSetup(false)
|
||||
}
|
||||
}, [])
|
||||
|
||||
@ -56,6 +59,8 @@ 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 }))
|
||||
}
|
||||
|
||||
//모듈 배치면 생성
|
||||
@ -111,9 +116,11 @@ const Placement = forwardRef((props, refs) => {
|
||||
setSelectedItems({ ...selectedItems, [e.target.name]: e.target.checked })
|
||||
}
|
||||
|
||||
const handleLayoutSetup = (e) => {
|
||||
props.setLayoutSetup({ ...props.layoutSetup, [e.target.name]: Number(e.target.value) })
|
||||
refs.layoutSetup.current = { ...props.layoutSetup, [e.target.name]: Number(e.target.value) }
|
||||
const handleLayoutSetup = (e, itemId, index) => {
|
||||
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 (
|
||||
@ -162,6 +169,24 @@ const Placement = forwardRef((props, refs) => {
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">{item.wpOut}</td>
|
||||
<label htmlFor="ra06">행</label>
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block mr10"
|
||||
name="col"
|
||||
value={props.layoutSetup[index]?.col ?? 1}
|
||||
defaultValue={1}
|
||||
onChange={(e) => handleLayoutSetup(e, item.itemId, index)}
|
||||
/>{' '}
|
||||
×<label htmlFor="ra07">열</label>
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
name="row"
|
||||
value={props.layoutSetup[index]?.row ?? 1}
|
||||
defaultValue={1}
|
||||
onChange={(e) => handleLayoutSetup(e, item.itemId, index)}
|
||||
/>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
@ -238,33 +263,6 @@ const Placement = forwardRef((props, refs) => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="self-table-item">
|
||||
<div className="self-item-th">레이아웃 입력</div>
|
||||
<div className="self-item-td">
|
||||
<div className="pop-form-radio">
|
||||
<div className="d-check-radio pop">
|
||||
<label htmlFor="ra06">열</label>
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block mr10"
|
||||
name="col"
|
||||
value={props.layoutSetup.col}
|
||||
defaultValue={1}
|
||||
onChange={handleLayoutSetup}
|
||||
/>{' '}
|
||||
×<label htmlFor="ra07">행</label>
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
name="row"
|
||||
value={props.layoutSetup.row}
|
||||
defaultValue={1}
|
||||
onChange={handleLayoutSetup}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="self-table-flx">
|
||||
{/* <div className="d-check-box pop">
|
||||
|
||||
@ -560,7 +560,7 @@ export function useModuleBasicSetting(tabNum) {
|
||||
/**
|
||||
* 스냅기능
|
||||
*/
|
||||
let snapDistance = flowDirection === 'south' || flowDirection === 'north' ? 70 : 40
|
||||
let snapDistance = flowDirection === 'south' || flowDirection === 'north' ? 10 : 10
|
||||
let trestleSnapDistance = 15
|
||||
|
||||
let intvHor =
|
||||
@ -817,7 +817,7 @@ export function useModuleBasicSetting(tabNum) {
|
||||
}
|
||||
}
|
||||
|
||||
const manualModuleLayoutSetup = (placementRef) => {
|
||||
const manualModuleLayoutSetup = (layoutSetupRef) => {
|
||||
if (isManualModuleSetup) {
|
||||
setIsManualModuleSetup(false)
|
||||
}
|
||||
@ -831,8 +831,12 @@ export function useModuleBasicSetting(tabNum) {
|
||||
return
|
||||
}
|
||||
|
||||
if (checkedModule.length > 1) {
|
||||
swalFire({ text: getMessage('module.place.select.one.module') })
|
||||
const hasZeroLength = checkedModule.some((item) =>
|
||||
layoutSetupRef.current.some((layoutItem) => item.itemId === layoutItem.moduleId && (layoutItem.row === 0 || layoutItem.col === 0)),
|
||||
)
|
||||
|
||||
if (hasZeroLength) {
|
||||
swalFire({ text: getMessage('모듈의 열, 행을 입력해 주세요.') })
|
||||
setIsManualModuleLayoutSetup(!isManualModuleLayoutSetup)
|
||||
return
|
||||
}
|
||||
@ -876,8 +880,8 @@ export function useModuleBasicSetting(tabNum) {
|
||||
}
|
||||
|
||||
if (moduleSetupSurfaces.length !== 0) {
|
||||
const col = placementRef.layoutSetup.current.col
|
||||
const row = placementRef.layoutSetup.current.row
|
||||
// const col = layoutSetupRef.current[0].col
|
||||
// const row = layoutSetupRef.current[0].row
|
||||
|
||||
let tempModule
|
||||
let manualDrawModules = []
|
||||
@ -924,48 +928,48 @@ export function useModuleBasicSetting(tabNum) {
|
||||
? moduleSetupSurfaces[i].trestleDetail.moduleIntvlVer / 10
|
||||
: moduleSetupSurfaces[i].trestleDetail.moduleIntvlHor / 10
|
||||
|
||||
let calcHalfWidth = (Number((width * col).toFixed(1)) + Number((intvHor * (col - 1)).toFixed(1))) / 2
|
||||
let calcHalfHeight = (Number((height * row).toFixed(1)) + Number((intvVer * (row - 1)).toFixed(1))) / 2
|
||||
// let calcHalfWidth = (Number((width * col).toFixed(1)) + Number((intvHor * (col - 1)).toFixed(1))) / 2
|
||||
// let calcHalfHeight = (Number((height * row).toFixed(1)) + Number((intvVer * (row - 1)).toFixed(1))) / 2
|
||||
|
||||
//아래래
|
||||
let points = [
|
||||
{
|
||||
x: Number(mousePoint.x.toFixed(1)) - calcHalfWidth,
|
||||
y: Number(mousePoint.y.toFixed(1)) - calcHalfHeight,
|
||||
},
|
||||
{
|
||||
x: Number(mousePoint.x.toFixed(1)) - calcHalfWidth,
|
||||
y: Number(mousePoint.y.toFixed(1)) + calcHalfHeight,
|
||||
},
|
||||
{
|
||||
x: Number(mousePoint.x.toFixed(1)) + calcHalfWidth,
|
||||
y: Number(mousePoint.y.toFixed(1)) + calcHalfHeight,
|
||||
},
|
||||
{
|
||||
x: Number(mousePoint.x.toFixed(1)) + calcHalfWidth,
|
||||
y: Number(mousePoint.y.toFixed(1)) - calcHalfHeight,
|
||||
},
|
||||
]
|
||||
|
||||
// const points = [
|
||||
// let points = [
|
||||
// {
|
||||
// x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
|
||||
// y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
|
||||
// x: Number(mousePoint.x.toFixed(1)) - calcHalfWidth,
|
||||
// y: Number(mousePoint.y.toFixed(1)) - calcHalfHeight,
|
||||
// },
|
||||
// {
|
||||
// x: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
|
||||
// y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
|
||||
// x: Number(mousePoint.x.toFixed(1)) - calcHalfWidth,
|
||||
// y: Number(mousePoint.y.toFixed(1)) + calcHalfHeight,
|
||||
// },
|
||||
// {
|
||||
// x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
|
||||
// y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
|
||||
// x: Number(mousePoint.x.toFixed(1)) + calcHalfWidth,
|
||||
// y: Number(mousePoint.y.toFixed(1)) + calcHalfHeight,
|
||||
// },
|
||||
// {
|
||||
// x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
|
||||
// y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
|
||||
// x: Number(mousePoint.x.toFixed(1)) + calcHalfWidth,
|
||||
// y: Number(mousePoint.y.toFixed(1)) - calcHalfHeight,
|
||||
// },
|
||||
// ]
|
||||
|
||||
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: Number(mousePoint.x.toFixed(1)) + Number((width / 2).toFixed(1)),
|
||||
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
|
||||
},
|
||||
{
|
||||
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
|
||||
y: Number(mousePoint.y.toFixed(1)) - Number((height / 2).toFixed(1)),
|
||||
},
|
||||
{
|
||||
x: Number(mousePoint.x.toFixed(1)) - Number((width / 2).toFixed(1)),
|
||||
y: Number(mousePoint.y.toFixed(1)) + Number((height / 2).toFixed(1)),
|
||||
},
|
||||
]
|
||||
|
||||
const turfPoints = coordToTurfPolygon(points)
|
||||
|
||||
if (turf.booleanWithin(turfPoints, turfPolygon)) {
|
||||
@ -979,14 +983,14 @@ 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)), //큰버전
|
||||
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), //큰버전
|
||||
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)), //큰버전
|
||||
// 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), //큰버전
|
||||
selectable: false,
|
||||
lockMovementX: true,
|
||||
lockMovementY: true,
|
||||
@ -1027,60 +1031,60 @@ export function useModuleBasicSetting(tabNum) {
|
||||
/**
|
||||
* 미리 깔아놓은 셀이 있을때 셀에 흡착됨
|
||||
*/
|
||||
// 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))
|
||||
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))
|
||||
|
||||
// //설치된 셀에 좌측에 스냅
|
||||
// if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
|
||||
// tempModule.left = holdCellLeft - width - intvHor
|
||||
// }
|
||||
//설치된 셀에 좌측에 스냅
|
||||
if (Math.abs(smallRight - holdCellLeft) < snapDistance) {
|
||||
tempModule.left = holdCellLeft - width - intvHor
|
||||
}
|
||||
|
||||
// //설치된 셀에 우측에 스냅
|
||||
// if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
|
||||
// tempModule.left = holdCellRight + intvHor
|
||||
// }
|
||||
//설치된 셀에 우측에 스냅
|
||||
if (Math.abs(smallLeft - holdCellRight) < snapDistance) {
|
||||
tempModule.left = holdCellRight + intvHor
|
||||
}
|
||||
|
||||
// //설치된 셀에 위쪽에 스냅
|
||||
// if (Math.abs(smallBottom - holdCellTop) < snapDistance) {
|
||||
// tempModule.top = holdCellTop - height - intvVer
|
||||
// }
|
||||
//설치된 셀에 위쪽에 스냅
|
||||
if (Math.abs(smallBottom - holdCellTop) < snapDistance) {
|
||||
tempModule.top = holdCellTop - height - intvVer
|
||||
}
|
||||
|
||||
// //설치된 셀에 밑쪽에 스냅
|
||||
// if (Math.abs(smallTop - holdCellBottom) < snapDistance) {
|
||||
// tempModule.top = holdCellBottom + intvVer
|
||||
//설치된 셀에 밑쪽에 스냅
|
||||
if (Math.abs(smallTop - holdCellBottom) < snapDistance) {
|
||||
tempModule.top = holdCellBottom + intvVer
|
||||
}
|
||||
//가운데 -> 가운데
|
||||
if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
|
||||
tempModule.left = holdCellCenterX - Number((width / 2).toFixed(1))
|
||||
}
|
||||
//왼쪽 -> 가운데
|
||||
if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
|
||||
tempModule.left = holdCellCenterX
|
||||
}
|
||||
// 오른쪽 -> 가운데
|
||||
if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
|
||||
tempModule.left = holdCellCenterX - width
|
||||
}
|
||||
//세로 가운데 -> 가운데
|
||||
if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
|
||||
tempModule.top = holdCellCenterY - Number((height / 2).toFixed(1))
|
||||
}
|
||||
// //위쪽 -> 가운데
|
||||
// if (Math.abs(smallTop - holdCellCenterY) < cellSnapDistance) {
|
||||
// tempModule.top = holdCellCenterY
|
||||
// }
|
||||
// //가운데 -> 가운데
|
||||
// if (Math.abs(smallCenterX - holdCellCenterX) < snapDistance) {
|
||||
// tempModule.left = holdCellCenterX - Number((width / 2).toFixed(1))
|
||||
// }
|
||||
// //왼쪽 -> 가운데
|
||||
// if (Math.abs(smallLeft - holdCellCenterX) < snapDistance) {
|
||||
// tempModule.left = holdCellCenterX
|
||||
// }
|
||||
// // 오른쪽 -> 가운데
|
||||
// if (Math.abs(smallRight - holdCellCenterX) < snapDistance) {
|
||||
// tempModule.left = holdCellCenterX - width
|
||||
// }
|
||||
// //세로 가운데 -> 가운데
|
||||
// if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
|
||||
// tempModule.top = holdCellCenterY - Number((height / 2).toFixed(1))
|
||||
// }
|
||||
// // //위쪽 -> 가운데
|
||||
// // if (Math.abs(smallTop - holdCellCenterY) < cellSnapDistance) {
|
||||
// // tempModule.top = holdCellCenterY
|
||||
// // }
|
||||
// // //아랫쪽 -> 가운데
|
||||
// // if (Math.abs(smallBottom - holdCellCenterY) < cellSnapDistance) {
|
||||
// // tempModule.top = holdCellCenterY - height
|
||||
// // }
|
||||
// })
|
||||
// //아랫쪽 -> 가운데
|
||||
// if (Math.abs(smallBottom - holdCellCenterY) < cellSnapDistance) {
|
||||
// tempModule.top = holdCellCenterY - height
|
||||
// }
|
||||
})
|
||||
}
|
||||
|
||||
// 위쪽 변에 스냅
|
||||
if (Math.abs(smallTop - trestleTop) < trestleSnapDistance) {
|
||||
@ -1152,18 +1156,47 @@ export function useModuleBasicSetting(tabNum) {
|
||||
if (!inside) return
|
||||
if (tempModule) {
|
||||
let startX, startY
|
||||
|
||||
console.log(tempModule)
|
||||
let installedLastHeightCoord = 0 //마지막으로 설치된 모듈의 좌표
|
||||
|
||||
//그려진 가이드 라인의 포인트를 기준으로 시작점을 만든다
|
||||
if (flowDirection === 'south') {
|
||||
startX = toFixedWithoutRounding(tempModule.left, 1)
|
||||
startY = toFixedWithoutRounding(tempModule.top + tempModule.height, 1)
|
||||
|
||||
for (let i = 0; i < placementRef.layoutSetup.current.row; i++) {
|
||||
console.log('checkedModule', checkedModule)
|
||||
|
||||
checkedModule.forEach((module, index) => {
|
||||
moduleOptions.fill = module.color
|
||||
const moduleWidth = Number(module.longAxis) / 10
|
||||
const moduleHeight = Number(module.shortAxis) / 10
|
||||
|
||||
let tmpWidth = flowDirection === 'south' || flowDirection === 'north' ? moduleWidth : moduleHeight
|
||||
let tmpHeight = flowDirection === 'south' || flowDirection === 'north' ? moduleHeight : moduleWidth
|
||||
|
||||
width =
|
||||
canvasSetting.roofSizeSet == '1'
|
||||
? calculateVisibleModuleHeight(tmpWidth, tmpHeight, getDegreeByChon(moduleSetupSurfaces[i].roofMaterial.pitch), flowDirection)
|
||||
.width
|
||||
: tmpWidth
|
||||
height =
|
||||
canvasSetting.roofSizeSet == '1'
|
||||
? calculateVisibleModuleHeight(tmpWidth, tmpHeight, getDegreeByChon(moduleSetupSurfaces[i].roofMaterial.pitch), flowDirection)
|
||||
.height
|
||||
: tmpHeight
|
||||
|
||||
const col = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].col
|
||||
const row = layoutSetupRef.current.filter((item) => item.moduleId === module.itemId)[0].row
|
||||
for (let i = 0; i < row; i++) {
|
||||
let tempY = startY - i * height
|
||||
|
||||
if (index > 0) {
|
||||
//두번째 모듈일때 마지막 설치 지점
|
||||
tempY = index > 0 && i === 0 ? installedLastHeightCoord - intvVer : installedLastHeightCoord
|
||||
}
|
||||
|
||||
let tempHeightMargin = i === 0 ? 0 : i * intvVer
|
||||
for (let j = 0; j < placementRef.layoutSetup.current.col; j++) {
|
||||
|
||||
for (let j = 0; j < col; j++) {
|
||||
let tempX = startX + j * width
|
||||
let tempWidthMargin = j === 0 ? 0 : j * intvHor
|
||||
|
||||
@ -1182,7 +1215,7 @@ export function useModuleBasicSetting(tabNum) {
|
||||
if (turf.booleanContains(turfPolygon, tempTurfModule) || turf.booleanWithin(tempTurfModule, turfPolygon)) {
|
||||
//마우스 클릭시 set으로 해당 위치에 셀을 넣음
|
||||
const isOverlap = manualDrawModules.some((module) => turf.booleanOverlap(tempTurfModule, polygonToTurfPolygon(module))) //겹치는지 확인
|
||||
if (!isOverlap) {
|
||||
// if (!isOverlap) {
|
||||
canvas?.remove(tempModule)
|
||||
|
||||
//안겹치면 넣는다
|
||||
@ -1191,7 +1224,7 @@ export function useModuleBasicSetting(tabNum) {
|
||||
|
||||
let manualModule = new QPolygon(tempModule.points, {
|
||||
...moduleOptions,
|
||||
moduleInfo: checkedModule[0],
|
||||
moduleInfo: module,
|
||||
// left: toFixedWithoutRounding(tempX + tempWidthMargin, 1),
|
||||
// top: toFixedWithoutRounding(tempY - height - tempHeightMargin, 1),
|
||||
width: toFixedWithoutRounding(width, 1),
|
||||
@ -1205,15 +1238,24 @@ export function useModuleBasicSetting(tabNum) {
|
||||
canvas?.add(manualModule)
|
||||
manualDrawModules.push(manualModule)
|
||||
setModuleStatisticsData()
|
||||
installedLastHeightCoord = tempY - height - tempHeightMargin
|
||||
} else {
|
||||
manualModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
|
||||
canvas?.add(manualModule)
|
||||
canvas.renderAll()
|
||||
}
|
||||
// getModuleStatistics()
|
||||
} else {
|
||||
swalFire({ text: getMessage('module.place.overlab') })
|
||||
return
|
||||
}
|
||||
// } else {
|
||||
// swalFire({ text: getMessage('module.place.overlab') })
|
||||
// return
|
||||
// tempModule.set({ fill: 'transparent', stroke: 'red', strokeWidth: 1 })
|
||||
// canvas?.add(tempModule)
|
||||
// canvas.renderAll()
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
} else if (flowDirection === 'north') {
|
||||
startX = tempModule.points[3].x
|
||||
startY = tempModule.points[3].y
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user