This commit is contained in:
hyojun.choi 2025-02-25 15:12:11 +09:00
commit 008e5c549d
5 changed files with 247 additions and 154 deletions

View File

@ -15,7 +15,6 @@ export default function FloorPlan({ children }) {
const [correntObjectNo, setCurrentObjectNo] = useRecoilState(correntObjectNoState)
const searchParams = useSearchParams()
const objectNo = searchParams.get('objectNo')
const pid = searchParams.get('pid')
const { closeAll } = usePopup()
const { selectedMenu, setSelectedMenu } = useCanvasMenu()
@ -41,11 +40,10 @@ export default function FloorPlan({ children }) {
* 설정 데이터 fetch
*/
useEffect(() => {
/**
* correntObjectNo가 없으면 실행하지 않음
*/
/** correntObjectNo가 없으면 실행하지 않음 */
if (!correntObjectNo) return
/** CanvasSetting 데이터 fetch */
fetchSettings()
return () => {

View File

@ -46,8 +46,6 @@ export default function StepUp(props) {
const [selectedRows, setSelectedRows] = useState({})
const [isManualSelection, setIsManualSelection] = useState({})
//
const [selectedValues, setSelectedValues] = useState({})
const isDisplayCircuitNumber = useRecoilValue(circuitNumDisplaySelector)
const circuitNumberText = useRecoilValue(fontSelector('circuitNumberText'))
// useCanvasPopupStatusController(6)
@ -58,7 +56,7 @@ export default function StepUp(props) {
useEffect(() => {
if (allocationType === 'auto') {
//
/** 자동일 때 모듈의 회로 정보 초기화 */
canvas
.getObjects()
.filter((obj) => obj.name === POLYGON_TYPE.MODULE)
@ -70,40 +68,41 @@ export default function StepUp(props) {
canvas.renderAll()
// PCS
/** PCS 자동 승압설정 정보 조회 */
fetchAutoStepUpData()
} else {
// PCS
/** PCS 수동 승압설정 정보 조회 */
fetchPassiStepUpData()
}
}, [])
// PCS
/**
* PCS 자동 승압설정 정보 조회
*/
const fetchAutoStepUpData = async () => {
try {
const params = {
...props.getOptYn(), // Y/N
useModuleItemList: props.getUseModuleItemList(), // List
roofSurfaceList: props.getRoofSurfaceList(), //
pcsItemList: props.getSelectedPcsItemList(), // PCS
...props.getOptYn() /** 옵션 Y/N */,
useModuleItemList: props.getUseModuleItemList() /** 사용된 모듈아이템 List */,
roofSurfaceList: props.getRoofSurfaceList() /** 지붕면 목록 */,
pcsItemList: props.getSelectedPcsItemList() /** PCS 아이템 목록 */,
}
//
/** 회로 구성 가능 여부 체크 통과 시 승압설정 정보 조회 */
getPcsVoltageStepUpList(params).then((res) => {
if (res?.result.resultCode === 'S' && res?.data) {
const dataArray = Array.isArray(res.data) ? res.data : [res.data]
const stepUpListData = formatStepUpListData(dataArray)
// PCS SET
/** PCS 승압설정 정보 SET */
setStepUpListData(stepUpListData)
// PCS
/** PCS 옵션 조회 */
const formattedOptCodes = formatOptionCodes(res.data.optionList)
setOptCodes(formattedOptCodes)
setSeletedOption(formattedOptCodes[0])
//
//stepUpListData[0].pcsItemList.forEach((pcsItem) => {
/** 캔버스에 회로 정보 적용 */
stepUpListData[0].pcsItemList.forEach((pcsItem) => {
const selectedSerQty = pcsItem.serQtyList.find((serQty) => serQty.selected)
if (selectedSerQty) {
@ -111,13 +110,13 @@ export default function StepUp(props) {
const targetSurface = canvas.getObjects().filter((obj) => obj.id === roofSurface.roofSurfaceId)[0]
const moduleIds = targetSurface.modules.map((module) => module.id)
//
/** 기존 모듈 텍스트 삭제 */
canvas
.getObjects()
.filter((obj) => moduleIds.includes(obj.parentId))
.forEach((text) => canvas.remove(text))
//
/** 새로운 모듈 회로 정보 추가 */
roofSurface.moduleList.forEach((module) => {
const targetModule = canvas.getObjects().find((obj) => obj.id === module.uniqueId)
if (targetModule && module.circuit !== '' && module.circuit) {
@ -154,10 +153,6 @@ export default function StepUp(props) {
setModuleStatisticsData()
} else {
swalFire({ text: getMessage('common.message.send.error') })
// swalFire({
// title: res.result.resultMsg,
// type: 'alert',
// })
}
})
} catch (error) {
@ -165,7 +160,9 @@ export default function StepUp(props) {
}
}
// PCS
/**
* PCS 수동 승압설정 정보 조회
*/
const fetchPassiStepUpData = async () => {
try {
// 1-1 2-2
@ -174,13 +171,13 @@ export default function StepUp(props) {
// .filter((obj) => obj.name === POLYGON_TYPE.MODULE && obj.circuit)
// .map((module) => module.circuitNumber)
//
/** 모듈 데이터 가져오기 */
const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
// PCS
/** PCS별 회로 정보를 저장할 객체 */
const pcsSummary = {}
// PCS
/** 각 모듈을 순회하며 PCS별 회로 정보 수집 */
modules.forEach((module) => {
if (!module.circuit || !module.pcsItemId) return
@ -204,10 +201,10 @@ export default function StepUp(props) {
pcsItemList: getSelectedPcsItemList(),
}
// PCS
/** PCS 접속함 및 옵션 목록 조회 */
getPcsConnOptionItemList(params).then((res) => {
if (res?.result.code === 200 && res?.data) {
// PCS serQtyList
/** PCS 아이템 리스트에 serQtyList 추가 */
const pcsItemListWithSerQty = res.data.pcsItemList.map((pcsItem) => {
const pcsData = pcsSummary[pcsItem.itemId] || { circuits: {}, totalModules: 0 }
const circuitCounts = Object.values(pcsData.circuits)
@ -215,9 +212,9 @@ export default function StepUp(props) {
...pcsItem,
serQtyList: [
{
//
/** 한 회로당 최대 모듈 수 */
serQty: circuitCounts.length > 0 ? Math.max(...circuitCounts) : 0,
//
/** 회로 개수 */
paralQty: Object.keys(pcsData.circuits).length || 0,
rmdYn: 'Y',
usePossYn: 'Y',
@ -227,16 +224,16 @@ export default function StepUp(props) {
}
})
// Update res.data with modified pcsItemList
/** res.data with modified pcsItemList */
res.data.pcsItemList = pcsItemListWithSerQty
const dataArray = Array.isArray(res.data) ? res.data : [res.data]
const stepUpListData = formatStepUpListData(dataArray)
// PCS SET
/** PCS 승압설정 정보 SET */
setStepUpListData(stepUpListData)
// PCS
/** PCS 옵션 조회 */
const formattedOptCodes = formatOptionCodes(res.data.optionList)
setOptCodes(formattedOptCodes)
setSeletedOption(formattedOptCodes[0])
@ -247,7 +244,9 @@ export default function StepUp(props) {
}
}
// PCS
/**
* PCS 옵션 조회
*/
const formatOptionCodes = (optionList = []) => {
return optionList?.map((opt) => ({
code: opt.pcsOptCd ? opt.pcsOptCd : '',
@ -256,7 +255,9 @@ export default function StepUp(props) {
}))
}
// PCS
/**
* PCS 승압설정 정보 포맷 추천 저장
*/
const formatStepUpListData = (dataArray = []) => {
const formattedData = dataArray?.map((stepUps) => ({
...stepUps,
@ -268,7 +269,9 @@ export default function StepUp(props) {
return formattedData
}
// PCS
/**
* PCS 옵션 포맷
*/
const formatOptionList = (optionList = []) => {
return optionList?.map((option) => ({
pcsOptCd: option.pcsOptCd ? option.pcsOptCd : '',
@ -277,7 +280,9 @@ export default function StepUp(props) {
}))
}
// PCS
/**
* PCS 아이템 포맷
*/
const formatPcsItemList = (pcsItemList = []) => {
return pcsItemList?.map((item, index) => ({
goodsNo: item.goodsNo ? item.goodsNo : '',
@ -291,7 +296,9 @@ export default function StepUp(props) {
}))
}
// PCS
/**
* PCS 연결 포맷
*/
const formatConnList = (connList = []) => {
if (!connList) return [] // null
@ -305,7 +312,9 @@ export default function StepUp(props) {
}))
}
// PCS
/**
* PCS 시리즈 포맷
*/
const formatSerQtyList = (serQtyList = []) => {
return serQtyList?.map((qty) => ({
code: uuidv4(),
@ -318,7 +327,9 @@ export default function StepUp(props) {
}))
}
// PCS RoofSurface
/**
* PCS RoofSurface 포맷
*/
const formatRoofSurfaceList = (roofSurfaceList = []) => {
return roofSurfaceList?.map((rsf) => ({
moduleList: formatModuleList(rsf.moduleList),
@ -327,7 +338,10 @@ export default function StepUp(props) {
roofSurfaceIncl: rsf.roofSurfaceIncl ? +rsf.roofSurfaceIncl : '',
}))
}
// PCS MatModule
/**
* PCS MatModule 포맷
*/
const formatModuleList = (moduleList = []) => {
return moduleList?.map((module) => ({
circuit: module.circuit ? module.circuit : '',
@ -337,7 +351,9 @@ export default function StepUp(props) {
}))
}
//
/**
* 모듈의 탭을 변경하는 함수
*/
const handleTabChange = (goodsNo, idx, tabNumber) => {
setModuleTabs((prev) => ({
...prev,
@ -345,9 +361,11 @@ export default function StepUp(props) {
}))
}
//
/**
* 선택 핸들러 함수 추가
*/
const handleRowClick = (mainIdx, subIdx) => {
//
/** 자동 승압 설정인 경우만 실행 */
if (allocationType !== 'auto') return
let tempStepUpListData = [...stepUpListData]
@ -359,26 +377,24 @@ export default function StepUp(props) {
}
item.selected = index === subIdx
})
//
/** 선택된 행 정보 저장 */
setStepUpListData(tempStepUpListData)
// console.log('🚀 ~ handleRowClick ~ tempStepUpListData:', tempStepUpListData)
// console.log('🚀 ~ handleRowClick ~ selectedData:', selectedData)
// PCS 2 PCS
/** PCS 2개 이상 또는 첫번째 PCS 선택 시에만 실행 */
if (tempStepUpListData[0].pcsItemList.length > 1 && mainIdx === 0) {
//
/** 파워컨디셔너 옵션 조회 요청 파라미터 */
const params = {
...props.getOptYn(), // Y/N
useModuleItemList: props.getUseModuleItemList(), // List
roofSurfaceList: props.getRoofSurfaceList(), //
pcsItemList: props.getSelectedPcsItemList().map((pcsItem, index) => {
// PCS
// tempStepUpListData PCS
// uniqueIndex
/** PCS
* tempStepUpListData에서 해당 PCS 아이템 찾기
* uniqueIndex를 사용하여 매칭
*/
const matchingPcsItem = tempStepUpListData[0].pcsItemList.find((item) => item.uniqueIndex === `${pcsItem.itemId}_${index}`)
// serQty
/** 선택된 serQty 찾기 */
const selectedSerQty = matchingPcsItem?.serQtyList.find((serQty) => serQty.selected)?.serQty || 0
return {
@ -388,34 +404,29 @@ export default function StepUp(props) {
}),
}
// PCS 1 2 3 PCS serQty 0 API
/** PCS가 1개 이고 2번째 또는 3번째 PCS serQty가 0인 경우는 추천 API 실행하지 않음 */
if (params.pcsItemList.length !== 1 && (params.pcsItemList[1]?.applySerQty !== 0 || params.pcsItemList[2]?.applySerQty) !== 0) {
// PCS
//const res = await getPcsVoltageStepUpList(params)
//getPcsManualConfChk(params).then((res) => {
/** PCS 승압설정 정보 조회 */
getPcsVoltageStepUpList(params).then((res) => {
if (res?.result.resultCode === 'S' && res?.data) {
const dataArray = Array.isArray(res.data) ? res.data : [res.data]
const stepUpListData = formatStepUpListData(dataArray)
// PCS SET
/** PCS 승압설정 정보 SET */
setStepUpListData(stepUpListData)
// PCS
/** PCS 옵션 조회 */
const formattedOptCodes = formatOptionCodes(res.data.optionList)
setOptCodes(formattedOptCodes)
setSeletedOption(formattedOptCodes[0])
} else {
swalFire({ text: getMessage('common.message.send.error') })
// swalFire({
// title: res.result.resultMsg,
// type: 'alert',
// })
}
})
}
}
/** 모듈 목록 삭제 */
canvas
.getObjects()
.filter((obj) => obj.name === POLYGON_TYPE.MODULE)
@ -425,13 +436,14 @@ export default function StepUp(props) {
module.pcsItemId = null
})
/** 선택된 모듈 목록 추가 */
selectedData.roofSurfaceList.forEach((roofSurface) => {
const targetSurface = canvas.getObjects().filter((obj) => obj.id === roofSurface.roofSurfaceId)[0]
const moduleIds = targetSurface.modules.map((module) => {
return module.id
})
//
/** 모듈 목록 삭제 */
canvas
.getObjects()
.filter((obj) => moduleIds.includes(obj.parentId))
@ -439,7 +451,7 @@ export default function StepUp(props) {
canvas.remove(text)
})
//
/** 모듈 목록 추가 */
canvas.renderAll()
roofSurface.moduleList.forEach((module) => {
@ -475,7 +487,9 @@ export default function StepUp(props) {
setModuleStatisticsData()
}
//
/**
* 현재 선택된 값들을 가져오는 함수 추가
*/
const getCurrentSelections = () => {
const selectedValues = stepUpListData[0].pcsItemList.forEach((item) => {
item.serQtyList.filter((serQty) => serQty.selected)
@ -496,20 +510,20 @@ export default function StepUp(props) {
return selectedValues
}
// props getCurrentSelections
/** props로 getCurrentSelections 함수 전달 */
useEffect(() => {
if (props.onInitialize) {
props.onInitialize(getCurrentSelections)
}
}, [])
// stepUpListData useEffect
/** stepUpListData가 변경될 때마다 업데이트하는 useEffect */
useEffect(() => {
if (props.onInitialize) {
// onInitialize props
/** onInitialize를 props에서 가져옴 */
props.onInitialize(() => ({
...getCurrentSelections(),
stepUpListData, // stepUpListData
stepUpListData /** stepUpListData를 포함하여 반환 */,
}))
}
}, [stepUpListData])
@ -524,9 +538,7 @@ export default function StepUp(props) {
</span>
{optCodes.length > 0 && (
<div className="grid-select mr10">
{/* <QSelectBox title={'電力検出ユニット (モニター付き)'} /> */}
<QSelectBox
//options={optCodes}
options={optCodes.map((roof) => {
return { ...roof, name: globalLocale === 'ko' ? roof.name : roof.nameJp }
})}
@ -628,8 +640,6 @@ export default function StepUp(props) {
<table>
<thead>
<tr>
{/* <th></th>
<th>昇圧回路数</th> */}
<th>{getMessage('modal.circuit.trestle.setting.power.conditional.select.name')}</th>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.circuit.amount')}</th>
</tr>

View File

@ -17,10 +17,14 @@ import { globalLocaleStore } from '@/store/localeAtom'
import { onlyNumberInputChange } from '@/util/input-utils'
import { getChonByDegree, getDegreeByChon } from '@/util/canvas-util'
/**
* 지붕 레이아웃
*/
export const ROOF_MATERIAL_LAYOUT = {
PARALLEL: 'P',
STAIRS: 'S',
}
export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, planNo, openPoint }) {
const [showSizeGuideModal, setShowSizeGuidModal] = useState(false)
const [showMaterialGuideModal, setShowMaterialGuidModal] = useState(false)
@ -31,9 +35,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
const { basicSetting, setBasicSettings, fetchBasicSettings, basicSettingSave } = useCanvasSetting()
const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState)
const { findCommonCode } = useCommonCode()
const [raftCodes, setRaftCodes] = useState([]) //
const [currentRoof, setCurrentRoof] = useState(null) //
const { closePopup } = usePopup() // usePopup closeAll
const [raftCodes, setRaftCodes] = useState([]) /** 서까래 정보 */
const [currentRoof, setCurrentRoof] = useState(null) /** 현재 선택된 지붕재 정보 */
const { closePopup } = usePopup() /** usePopup에서 closePopup 함수 가져오기 */
const roofRef = {
roofCd: useRef(null),
@ -100,6 +104,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
if (openPoint && openPoint === 'canvasMenus') fetchBasicSettings(planNo, openPoint)
}, [])
/**
* 배치면초기설정 데이터 조회 화면 오픈
*/
useEffect(() => {
if (addedRoofs.length > 0) {
const raftCodeList = findCommonCode('203800')
@ -145,6 +152,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
setCurrentRoof({ ...currentRoof, roofAngleSet: value })
}
/**
* 지붕재 변경 현재 지붕 정보 변경
*/
const handleRoofTypeChange = (value) => {
const selectedRoofMaterial = roofMaterials.find((roof) => roof.roofMatlCd === value)
@ -159,15 +169,24 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
})
}
/**
* 입력 변경 현재 지붕 정보 변경
*/
const changeInput = (value, e) => {
const { name } = e.target
setCurrentRoof({ ...currentRoof, [name]: Number(value) })
}
/**
* 서까래 변경 현재 지붕 정보 변경
*/
const handleRafterChange = (value) => {
setCurrentRoof({ ...currentRoof, raft: value })
}
/**
* 지붕 레이아웃 변경 현재 지붕 정보 변경
*/
const handleRoofLayoutChange = (value) => {
if (+currentRoof.roofSizeSet === 3) {
setCurrentRoof({ ...currentRoof, layout: ROOF_MATERIAL_LAYOUT.PARALLEL })
@ -176,6 +195,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
setCurrentRoof({ ...currentRoof, layout: value })
}
/**
* 배치면초기설정 저장 버튼 클릭
*/
const handleSaveBtn = () => {
const roofInfo = {
...currentRoof,
@ -321,7 +343,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
? currentRoof?.roofMatlNm
: currentRoof?.roofMatlNmJp
}
//ref={roofRef.roofCd}
options={roofMaterials.map((roof) => {
return { ...roof, name: globalLocale === 'ko' ? roof.roofMatlNm : roof.roofMatlNmJp }
})}
@ -332,23 +353,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
showKey="name"
disabled={currentRoof?.roofSizeSet === '3'}
/>
{/* <select
className="select-light dark"
name="roofMatlCd"
ref={roofRef.roofCd}
value={currentRoofMaterial.roofMatlCd}
onChange={(e) => {
handleRoofTypeChange(e.target.value)
}}
>
{roofMaterials.map((roof, index) => {
return (
<option key={index} value={roof.roofMatlCd}>
{roof.roofMatlNm}
</option>
)
})}
</select> */}
</div>
{currentRoof && ['R', 'C'].includes(currentRoof.widAuth) && (
<div className="flex-ment">
@ -365,14 +369,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
disabled={currentRoof?.roofSizeSet === '3'}
/>
</div>
{/* <div className="input-grid" style={{ width: '63px' }}>
<input
type="text"
className="input-origin block"
ref={roofRef.width}
defaultValue={parseInt(currentRoofMaterial.width)}
/>
</div> */}
</div>
)}
{currentRoof && ['R', 'C'].includes(currentRoof.lenAuth) && (
@ -390,14 +386,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
disabled={currentRoof?.roofSizeSet === '3'}
/>
</div>
{/* <div className="input-grid" style={{ width: '63px' }}>
<input
type="text"
className="input-origin block"
ref={roofRef.length}
defaultValue={parseInt(currentRoofMaterial.length)}
/>
</div> */}
</div>
)}
{currentRoof && ['C', 'R'].includes(currentRoof.raftAuth) && (
@ -407,7 +395,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
<div className="select-wrap" style={{ width: '160px' }}>
<QSelectBox
options={raftCodes}
//ref={roofRef.rafter}
title={
raftCodes?.find((r) => r.clCode === (currentRoof?.raft === undefined ? currentRoof?.raftBaseCd : currentRoof?.raft))
.clCodeNm
@ -419,15 +406,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
showKey="clCodeNm"
disabled={currentRoof?.roofSizeSet === '3'}
/>
{/* <select className="select-light dark" name="roofGap" ref={roofRef.rafter}>
{raftCodes.map((raft, index) => {
return (
<option key={index} value={raft.clCode} selected={currentRoofMaterial.raft === raft.clCode}>
{raft.clCodeNm}
</option>
)
})}
</select> */}
</div>
)}
</div>

View File

@ -27,7 +27,6 @@ import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController'
import { outerLinePointsState } from '@/store/outerLineAtom'
// 지붕면 할당
export function useRoofAllocationSetting(id) {
const canvas = useRecoilValue(canvasState)
const [correntObjectNo, setCorrentObjectNo] = useRecoilState(correntObjectNoState)
@ -40,8 +39,8 @@ export function useRoofAllocationSetting(id) {
const roofMaterials = useRecoilValue(roofMaterialsSelector)
const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector)
const [basicSetting, setBasicSetting] = useRecoilState(basicSettingState)
const [currentRoofMaterial, setCurrentRoofMaterial] = useState(roofMaterials[0]) // 팝업 내 기준 지붕재
const [roofList, setRoofList] = useRecoilState(addedRoofsState) // 배치면 초기설정에서 선택한 지붕재 배열
const [currentRoofMaterial, setCurrentRoofMaterial] = useState(roofMaterials[0]) /** 팝업 내 기준 지붕재 */
const [roofList, setRoofList] = useRecoilState(addedRoofsState) /** 배치면 초기설정에서 선택한 지붕재 배열 */
const [editingLines, setEditingLines] = useState([])
const [currentRoofList, setCurrentRoofList] = useState([])
const currentAngleType = useRecoilValue(currentAngleTypeSelector)
@ -57,14 +56,25 @@ export function useRoofAllocationSetting(id) {
const resetPoints = useResetRecoilState(outerLinePointsState)
useEffect(() => {
/** 배치면 초기설정에서 선택한 지붕재 배열 설정 */
setCurrentRoofList(roofList)
}, [])
useEffect(() => {
const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) // roofPolygon.innerLines
const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) /** roofPolygon.innerLines */
roofBases.forEach((roof) => {
/** 현재 선택된 라인인 경우 라인 두께 2로 설정 */
if (editingLines.includes(line)) {
line.set({
strokeWidth: 2,
stroke: 'black',
selectable: true,
})
}
roof.innerLines.forEach((line) => {
/** 실측값이 없는 경우 라인 두께 4로 설정 */
if (!line.attributes.actualSize || line.attributes?.actualSize === 0) {
line.set({
strokeWidth: 4,
@ -73,6 +83,7 @@ export function useRoofAllocationSetting(id) {
})
}
/** 현재 선택된 라인인 경우 라인 두께 2로 설정 */
if (editingLines.includes(line)) {
line.set({
strokeWidth: 2,
@ -82,6 +93,8 @@ export function useRoofAllocationSetting(id) {
}
})
})
/** 현재 선택된 객체가 보조라인, 피라미드, 힙인 경우 두께 4로 설정 */
if (currentObject && currentObject.name && ['auxiliaryLine', 'ridge', 'hip'].includes(currentObject.name)) {
currentObject.set({
strokeWidth: 4,
@ -91,20 +104,21 @@ export function useRoofAllocationSetting(id) {
}, [currentObject])
useEffect(() => {
// canvas.getObjects().filter((obj) => obj.type === 'QLine')
/** 현재 선택된 객체가 보조라인, 피라미드, 힙인 경우 두께 4로 설정 */
const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF)
if (roofBases.length === 0) {
swalFire({ text: '할당할 지붕이 없습니다.' })
closePopup(id)
}
fetchBasicSettings(basicSetting.planNo, null)
/** 배치면 초기설정 조회 */
fetchBasicSettings(basicSetting.planNo)
}, [])
/**
* 지붕면 할당 조회 초기화
* 배치면 초기설정 조회
*/
const fetchBasicSettings = async (planNo, openPoint) => {
const fetchBasicSettings = async (planNo) => {
try {
await get({
url: `/api/canvas-management/canvas-basic-settings/by-object/${correntObjectNo}/${planNo}`,
@ -169,7 +183,6 @@ export function useRoofAllocationSetting(id) {
})
}
// setCurrentRoofList(selectRoofs)
setBasicSetting({
...basicSetting,
planNo: res[0].planNo,
@ -178,6 +191,7 @@ export function useRoofAllocationSetting(id) {
roofsData: roofsArray,
selectedRoofMaterial: selectRoofs.find((roof) => roof.selected),
})
setBasicInfo({
planNo: '' + res[0].planNo,
roofSizeSet: '' + res[0].roofSizeSet,
@ -220,12 +234,17 @@ export function useRoofAllocationSetting(id) {
//Recoil 설정
//setCanvasSetting({ ...basicSetting })
fetchBasicSettings(basicSetting.planNo, null)
/** 배치면 초기설정 조회 */
fetchBasicSettings(basicSetting.planNo)
} catch (error) {
swalFire({ text: error.message, icon: 'error' })
}
}
/**
* 지붕재 추가
*/
const onAddRoofMaterial = () => {
if (currentRoofList.length >= 4) {
swalFire({ type: 'alert', icon: 'error', text: getMessage('지붕재는 4개까지 선택 가능합니다.') })
@ -243,6 +262,9 @@ export function useRoofAllocationSetting(id) {
])
}
/**
* 지붕재 삭제
*/
const onDeleteRoofMaterial = (idx) => {
const isSelected = currentRoofList[idx].selected
const newRoofList = JSON.parse(JSON.stringify(currentRoofList)).filter((_, index) => index !== idx)
@ -292,6 +314,9 @@ export function useRoofAllocationSetting(id) {
closeAll()
}
/**
* 지붕면 할당
*/
const handleAlloc = () => {
if (!checkInnerLines()) {
apply()
@ -304,6 +329,9 @@ export function useRoofAllocationSetting(id) {
}
}
/**
* 실측값 없는 경우 체크
*/
const checkInnerLines = () => {
const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) // roofPolygon.innerLines
let result = false
@ -327,6 +355,9 @@ export function useRoofAllocationSetting(id) {
return result
}
/**
* 지붕면 할당
*/
const apply = () => {
const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF && !obj.roofMaterial)
const wallLines = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.WALL)
@ -340,6 +371,8 @@ export function useRoofAllocationSetting(id) {
} catch (e) {
return
}
/** 라인 삭제 */
roofBase.innerLines.forEach((line) => {
canvas.remove(line)
})
@ -347,10 +380,12 @@ export function useRoofAllocationSetting(id) {
canvas.remove(roofBase)
})
/** 벽면 삭제 */
wallLines.forEach((wallLine) => {
canvas.remove(wallLine)
})
/** 데이터 설정 */
const newRoofList = currentRoofList.map((roof, idx) => {
return { ...roof, index: idx, ...basicInfo }
})
@ -370,6 +405,8 @@ export function useRoofAllocationSetting(id) {
roof.set({
isFixed: true,
})
/** 모양 패턴 설정 */
setSurfaceShapePattern(
roof,
roofDisplay.column,
@ -379,6 +416,7 @@ export function useRoofAllocationSetting(id) {
drawDirectionArrow(roof)
})
/** 외곽선 삭제 */
const removeTargets = canvas.getObjects().filter((obj) => obj.name === 'outerLinePoint' || obj.name === 'outerLine')
removeTargets.forEach((obj) => {
canvas.remove(obj)
@ -387,9 +425,13 @@ export function useRoofAllocationSetting(id) {
closeAll()
setSelectedMenu('surface')
/** 모듈 선택 데이터 초기화 */
modifyModuleSelectionData()
}
/**
* 라인 사이즈 설정
*/
const setLineSize = (id, size) => {
const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF)
roofBases.forEach((roof) => {
@ -452,6 +494,9 @@ export function useRoofAllocationSetting(id) {
setCurrentRoofList(newRoofList)
}
/**
* 레이아웃 변경
*/
const handleChangeLayout = (layoutValue, index) => {
const newRoofList = currentRoofList.map((roof, idx) => {
if (idx === index) {
@ -463,6 +508,9 @@ export function useRoofAllocationSetting(id) {
setCurrentRoofList(newRoofList)
}
/**
* 치수 입력방법(복시도입력/실측값입력/육지붕)
*/
const handleChangeInput = (e, type = '', index) => {
const value = e.target.value
const newRoofList = currentRoofList.map((roof, idx) => {
@ -475,6 +523,9 @@ export function useRoofAllocationSetting(id) {
setCurrentRoofList(newRoofList)
}
/**
* 피치 변경
*/
const handleChangePitch = (e, index) => {
let value = e.target.value
@ -504,6 +555,9 @@ export function useRoofAllocationSetting(id) {
}
}
/**
* 모듈 선택 데이터 트리거
*/
const { trigger: moduleSelectedDataTrigger } = useCanvasPopupStatusController(2)
return {

View File

@ -1,8 +1,12 @@
import { atom, selector } from 'recoil'
/**
* 디스플레이 설정
*/
export const settingModalFirstOptionsState = atom({
key: 'settingModalFirstOptions',
default: {
/** 디스플레이 설정 */
option1: [
{ id: 1, column: 'allocDisplay', name: 'modal.canvas.setting.first.option.alloc', selected: true },
{ id: 2, column: 'outlineDisplay', name: 'modal.canvas.setting.first.option.outline', selected: true },
@ -15,6 +19,7 @@ export const settingModalFirstOptionsState = atom({
{ id: 9, column: 'imageDisplay', name: 'modal.canvas.setting.first.option.image', selected: false },
{ id: 10, column: 'totalDisplay', name: 'modal.canvas.setting.first.option.total', selected: true },
],
/** 치수 표시 */
dimensionDisplay: [
{
id: 1,
@ -25,6 +30,7 @@ export const settingModalFirstOptionsState = atom({
{ id: 2, column: 'realDimension', name: 'modal.canvas.setting.first.option.real.dimension', selected: false },
{ id: 3, column: 'noneDimension', name: 'modal.canvas.setting.first.option.none.dimension', selected: false },
],
/** 화면 표시 */
option2: [
{ id: 1, column: 'onlyBorder', name: 'modal.canvas.setting.first.option.border', selected: true },
{ id: 2, column: 'lineHatch', name: 'modal.canvas.setting.first.option.line', selected: false },
@ -34,15 +40,20 @@ export const settingModalFirstOptionsState = atom({
dangerouslyAllowMutability: true,
})
/**
* 디스플레이 설정 - 문자 표시
*/
export const settingModalSecondOptionsState = atom({
key: 'settingModalSecondOptions',
default: {
/** 문자 표시 */
option3: [
{ id: 1, name: 'modal.canvas.setting.font.plan.edit.word' },
{ id: 2, name: 'modal.canvas.setting.font.plan.edit.flow' },
{ id: 3, name: 'modal.canvas.setting.font.plan.edit.dimension' },
{ id: 4, name: 'modal.canvas.setting.font.plan.edit.circuit.num' },
],
/** 흡수범위 */
option4: [
{
id: 1,
@ -77,6 +88,9 @@ export const settingModalSecondOptionsState = atom({
dangerouslyAllowMutability: true,
})
/**
* 디스플레이 설정 - 그리드 표시
*/
export const settingModalGridOptionsState = atom({
key: 'settingModalGridOptions',
default: [
@ -88,7 +102,9 @@ export const settingModalGridOptionsState = atom({
dangerouslyAllowMutability: true,
})
// 디스플레이 설정 - 할당 표시
/**
* 디스플레이 설정 - 할당 표시
*/
export const allocDisplaySelector = selector({
key: 'allocDisplaySelector',
get: ({ get }) => {
@ -97,7 +113,9 @@ export const allocDisplaySelector = selector({
},
})
// 디스플레이 설정 - 외벽선 표시
/**
* 디스플레이 설정 - 외벽선 표시
*/
export const outlineDisplaySelector = selector({
key: 'outlineDisplaySelector',
get: ({ get }) => {
@ -106,7 +124,9 @@ export const outlineDisplaySelector = selector({
},
})
// 디스플레이 설정 - 그리드 표시
/**
* 디스플레이 설정 - 그리드 표시
*/
export const gridDisplaySelector = selector({
key: 'gridDisplaySelector',
get: ({ get }) => {
@ -115,7 +135,9 @@ export const gridDisplaySelector = selector({
},
})
// 디스플레이 설정 - 지붕선 표시
/**
* 디스플레이 설정 - 지붕선 표시
*/
export const roofLineDisplaySelector = selector({
key: 'lineDisplaySelector',
get: ({ get }) => {
@ -124,7 +146,9 @@ export const roofLineDisplaySelector = selector({
},
})
// 디스플레이 설정 - 문자 표시
/**
* 디스플레이 설정 - 문자 표시
*/
export const wordDisplaySelector = selector({
key: 'wordDisplaySelector',
get: ({ get }) => {
@ -133,7 +157,9 @@ export const wordDisplaySelector = selector({
},
})
// 디스플레이 설정 - 회로번호 표시
/**
* 디스플레이 설정 - 회로번호 표시
*/
export const circuitNumDisplaySelector = selector({
key: 'circuitNumDisplaySelector',
get: ({ get }) => {
@ -142,7 +168,9 @@ export const circuitNumDisplaySelector = selector({
},
})
// 디스플레이 설정 - 흐름 방향 표시
/**
* 디스플레이 설정 - 흐름 방향 표시
*/
export const flowDisplaySelector = selector({
key: 'flowDisplaySelector',
get: ({ get }) => {
@ -151,7 +179,9 @@ export const flowDisplaySelector = selector({
},
})
// 디스플레이 설정 - 가대 표시
/**
* 디스플레이 설정 - 가대 표시
*/
export const trestleDisplaySelector = selector({
key: 'trestleDisplaySelector',
get: ({ get }) => {
@ -160,7 +190,9 @@ export const trestleDisplaySelector = selector({
},
})
// 디스플레이 설정 - 이미지 표시
/**
* 디스플레이 설정 - 이미지 표시
*/
export const imageDisplaySelector = selector({
key: 'imageDisplaySelector',
get: ({ get }) => {
@ -169,7 +201,9 @@ export const imageDisplaySelector = selector({
},
})
// 디스플레이 설정 - 집계표 표시
/**
* 디스플레이 설정 - 집계표 표시
*/
export const totalDisplaySelector = selector({
key: 'totalDisplaySelector',
get: ({ get }) => {
@ -178,7 +212,9 @@ export const totalDisplaySelector = selector({
},
})
// 디스플레이 설정 - 치수 표시
/**
* 디스플레이 설정 - 치수 표시
*/
export const corridorDimensionSelector = selector({
key: 'corridorDimensionSelector',
get: ({ get }) => {
@ -188,7 +224,9 @@ export const corridorDimensionSelector = selector({
dangerouslyAllowMutability: true,
})
// 디스플레이 설정 - 화면 표시
/**
* 디스플레이 설정 - 화면 표시
*/
export const roofDisplaySelector = selector({
key: 'roofDisplaySelector',
get: ({ get }) => {
@ -198,29 +236,39 @@ export const roofDisplaySelector = selector({
dangerouslyAllowMutability: true,
})
/**
* basicSetting 설정
*/
export const basicSettingState = atom({
key: 'basicSettingState',
default: {
roofSizeSet: 1,
roofAngleSet: 'slope',
selectedRoofMaterial: {}, // 선택된 지붕재
roofs: [], // 지붕면 할당에서 추가된 지붕재 목록
roofSizeSet: 1 /** 지붕크기 */,
roofAngleSet: 'slope' /** 지붕각도 */,
selectedRoofMaterial: {} /** 선택된 지붕재 */,
roofs: [] /** 지붕면 할당에서 추가된 지붕재 목록 */,
},
dangerouslyAllowMutability: true,
})
/**
* 지붕면 할당에서 추가된 지붕재 목록
*/
export const addedRoofsState = atom({
key: 'addedRoofsState',
default: [],
})
// db에 등록된 지붕재 목록
/**
* db에 등록된 지붕재 목록
*/
export const roofMaterialsAtom = atom({
key: 'roofMaterialState',
default: [],
})
//현재 선택된 지붕재
/**
* 현재 선택된 지붕재
*/
export const selectedRoofMaterialSelector = selector({
key: 'selectedRoofMaterialSelector',
get: ({ get }) => {
@ -228,7 +276,9 @@ export const selectedRoofMaterialSelector = selector({
},
})
// QSelectBox에서 사용할 지붕재 목록
/**
* QSelectBox에서 사용할 지붕재 목록
*/
export const roofMaterialsSelector = selector({
key: 'roofMaterialsSelector',
get: ({ get }) => {
@ -245,6 +295,9 @@ export const correntObjectNoState = atom({
default: '',
})
/**
* 지붕재 목록 조회 여부
*/
export const fetchRoofMaterialsState = atom({
key: 'fetchRoofMaterialsState',
default: false,