This commit is contained in:
nohyoungjoo 2025-01-24 18:12:24 +09:00
parent 50bd18c2f6
commit 5def9c77a1
5 changed files with 290 additions and 199 deletions

View File

@ -15,6 +15,7 @@ import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
import { addedRoofsState } from '@/store/settingAtom'
import { isObjectNotEmpty } from '@/util/common-utils'
import Swal from 'sweetalert2'
import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController'
export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
const { getMessage } = useMessage()

View File

@ -1,4 +1,4 @@
import { useEffect, useState, useReducer } from 'react'
import { useEffect, useState, useReducer, useRef } from 'react'
import { useRecoilValue, useRecoilState } from 'recoil'
import { addedRoofsState } from '@/store/settingAtom'
import { currentCanvasPlanState } from '@/store/canvasAtom'
@ -41,6 +41,18 @@ export default function Module({ setTabNum }) {
const [debouncedVerticalSnowCover] = useDebounceValue(inputVerticalSnowCover, 500)
const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) //
const dataRef = useRef({
selectedSurfaceType,
installHeight,
standardWindSpeed,
verticalSnowCover,
})
useEffect(() => {
console.log('dataRef', dataRef)
}, [])
const [tempModuleSelectionData, setTempModuleSelectionData] = useReducer((prevState, nextState) => {
return { ...prevState, ...nextState }
}, moduleSelectionData)
@ -55,15 +67,13 @@ export default function Module({ setTabNum }) {
}, [installHeight, verticalSnowCover])
useEffect(() => {
if (tempModuleSelectionData) {
setModuleSelectionData(tempModuleSelectionData)
if (
tempModuleSelectionData.common.moduleItemId &&
isObjectNotEmpty(tempModuleSelectionData.module) &&
tempModuleSelectionData.roofConstructions.length > 0
) {
moduleSelectedDataTrigger(tempModuleSelectionData)
if (tempModuleSelectionData.roofConstructions.length > 0) {
if (tempModuleSelectionData.common.moduleItemId && isObjectNotEmpty(tempModuleSelectionData.module)) {
// temp (addedRoofs)
if (tempModuleSelectionData.roofConstructions.length === addedRoofs.length) {
setModuleSelectionData(tempModuleSelectionData)
moduleSelectedDataTrigger(tempModuleSelectionData)
}
}
}
}, [tempModuleSelectionData])
@ -134,7 +144,8 @@ export default function Module({ setTabNum }) {
</tr>
</thead>
<tbody>
{selectedModules.itemList &&
{selectedModules &&
selectedModules.itemList &&
selectedModules.itemList.map((row, index) => (
<tr key={index}>
<td>
@ -250,10 +261,10 @@ export default function Module({ setTabNum }) {
<div style={{ display: roofTab === index ? 'block' : 'none' }} key={index}>
<ModuleTabContents
key={index}
index={index}
tabIndex={index}
addRoof={roof}
setAddedRoofs={setAddedRoofs}
roofTab={index}
roofTab={roofTab}
tempModuleSelectionData={tempModuleSelectionData}
setTempModuleSelectionData={setTempModuleSelectionData}
/>

View File

@ -9,7 +9,15 @@ import { isObjectNotEmpty } from '@/util/common-utils'
import QSelectBox from '@/components/common/select/QSelectBox'
import { addedRoofsState } from '@/store/settingAtom'
export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tempModuleSelectionData, setTempModuleSelectionData }) {
export default function ModuleTabContents({
tabIndex,
addRoof,
setAddedRoofs,
roofTab,
tempModuleSelectionData,
setTempModuleSelectionData,
moduleSelectionInitParams,
}) {
const { getMessage } = useMessage()
const [roofMaterial, setRoofMaterial] = useState(addRoof) //`
@ -37,7 +45,7 @@ export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tem
const [constructionParams, setConstructionParams] = useState({}) // api
const [roofBaseParams, setRoofBaseParams] = useState({}) // api
const moduleSelectionInitParams = useRecoilValue(moduleSelectionInitParamsState) // ex) ,
// const moduleSelectionInitParams = useRecoilValue(moduleSelectionInitParamsState) // ex) ,
const { getTrestleList, getConstructionList } = useMasterController()
@ -61,15 +69,73 @@ export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tem
const hajebichiRef = useRef()
const lengthRef = useRef()
const originalModuleSelectionData = useRef(moduleSelectionData)
//
const handleChangeRaftBase = (option) => {
setSelectedRaftBase(option)
setTrestleParams({ ...trestleParams, raftBaseCd: option.clCode }) //
setConstMthdList([]) //
setRoofBaseList([]) //
setConstructionList([]) //
}
//
//
const handleCvrChecked = () => {
setCvrChecked(!cvrChecked)
setSelectedConstruction({ ...selectedConstruction, setupCover: !cvrChecked })
}
//
const handleSnowGdChecked = () => {
setSnowGdChecked(!snowGdChecked)
setSelectedConstruction({ ...selectedConstruction, setupSnowCover: !snowGdChecked })
}
const getConstructionListData = async (params) => {
if (params.trestleMkrCd && params.constMthdCd && params.roofBaseCd) {
const optionsList = await getConstructionList(params)
setConstructionList(optionsList.data)
}
}
useEffect(() => {
setHajebichi(addRoof.hajebichi)
setLengthBase(addRoof.lenBase)
// 202600
const raftCodeList = findCommonCode('203800')
//
raftCodeList.forEach((obj) => {
obj.name = obj.clCodeNm
obj.id = obj.clCode
})
setRaftCodes(raftCodeList)
}, [])
//
useEffect(() => {
if (
moduleSelectionData.roofConstructions.length > 0 &&
isObjectNotEmpty(moduleSelectionData.roofConstructions[tabIndex].trestle) &&
isObjectNotEmpty(moduleSelectionData.roofConstructions[tabIndex].construction)
) {
setModuleConstructionSelectionData(moduleSelectionData.roofConstructions[tabIndex])
}
}, [moduleSelectionData])
useEffect(() => {
if (isObjectNotEmpty(moduleConstructionSelectionData)) {
setIsExistData(true)
}
}, [moduleConstructionSelectionData])
// addRoofs
useEffect(() => {
// api
setTrestleParams({ ...trestleParams, workingWidth: lengthBase })
// // api
// setTrestleParams({ ...trestleParams, workingWidth: lengthBase })
const copyAddRoof = { ...addRoof }
copyAddRoof.length = Number(lengthBase)
@ -90,29 +156,69 @@ export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tem
}, [hajebichi])
useEffect(() => {
if (moduleSelectionData.roofConstructions.length > 0) {
setModuleConstructionSelectionData(moduleSelectionData.roofConstructions[roofTab])
if (isExistData) {
setConstructionListParams({
...moduleSelectionInitParams,
...roofBaseParams,
roofBaseCd: selectedRoofBase.roofBaseCd,
inclCd: addRoof.pitch,
roofPitch: hajebichiRef.current ? hajebichiRef.current.value : 0,
raftBaseCd: addRoof.raftBaseCd,
})
}
}, [moduleSelectionData])
}, [selectedRoofBase])
//
const handleChangeRaftBase = (option) => {
setSelectedRaftBase(option)
setTrestleParams({ ...trestleParams, raftBaseCd: option.clCode }) //
setConstMthdList([]) //
setRoofBaseList([]) //
setConstructionList([]) //
}
useEffect(() => {
if (
isExistData &&
constructionList.length > 0 &&
isObjectNotEmpty(moduleConstructionSelectionData?.construction) &&
moduleConstructionSelectionData?.construction.hasOwnProperty('constPossYn') ///
) {
const selectedIndex = moduleConstructionSelectionData.construction.selectedIndex
const construction = constructionList[selectedIndex]
if (construction.constPossYn === 'Y') {
handleConstruction(selectedIndex)
}
}
}, [constructionList])
//
//
useEffect(() => {
//lengbase
if (selectedModules) {
//
setTrestleParams({
moduleTpCd: selectedModules.itemTp,
roofMatlCd: addRoof.roofMatlCd,
raftBaseCd: addRoof.raftBaseCd,
workingWidth: lengthBase,
})
}
}, [selectedModules])
// api
useEffect(() => {
if (isObjectNotEmpty(trestleParams)) {
getModuleOptionsListData(trestleParams, 'trestle')
}
}, [trestleParams])
//
const handleChangeTrestle = (option) => {
setSelectedTrestle(option) //
setConstructionParams({ ...trestleParams, trestleMkrCd: option.trestleMkrCd, constMthdCd: '', roofBaseCd: '' })
setConstMthdList([]) //
setRoofBaseList([]) //
setConstructionList([]) //
// setConstMthdList([]) //
// setRoofBaseList([]) //
// setConstructionList([]) //
}
useEffect(() => {
if (isObjectNotEmpty(constructionParams)) {
getModuleOptionsListData(constructionParams, 'construction')
}
}, [constructionParams])
//
const handleChangeConstMthd = (option) => {
setSelectedConstMthd(option) //
@ -121,24 +227,37 @@ export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tem
trestleMkrCd: selectedTrestle.trestleMkrCd,
constMthdCd: option.constMthdCd,
roofBaseCd: '',
roofPitch: hajebichiRef.current ? hajebichiRef.current.value : '',
})
setRoofBaseList([]) //
setConstructionList([]) //
}
//
useEffect(() => {
if (isObjectNotEmpty(roofBaseParams)) {
getModuleOptionsListData(roofBaseParams, 'roofBase')
}
}, [roofBaseParams])
const handleChangeRoofBase = (option) => {
// if (option) {
setConstructionListParams({
...moduleSelectionInitParams,
...roofBaseParams,
trestleMkrCd: selectedTrestle.trestleMkrCd,
constMthdCd: selectedConstMthd.constMthdCd,
roofBaseCd: option.roofBaseCd,
inclCd: addRoof.pitch,
roofPitch: hajebichiRef.current ? hajebichiRef.current.value : 0,
raftBaseCd: addRoof.raftBaseCd,
roofMatlCd: addRoof.roofMatlCd,
})
setSelectedRoofBase(option)
}
//
useEffect(() => {
if (isObjectNotEmpty(constructionListParams)) {
getConstructionListData(constructionListParams)
}
}, [constructionListParams])
//
const handleConstruction = (index) => {
if (index > -1) {
const isPossibleIndex = constructionRef.current
@ -160,6 +279,9 @@ export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tem
selectedConstruction.setupSnowCover = false //
selectedConstruction.selectedIndex = index
setCvrYn(selectedConstruction.cvrYn)
setSnowGdPossYn(selectedConstruction.snowGdPossYn)
//
if (moduleConstructionSelectionData && moduleConstructionSelectionData.construction) {
selectedConstruction.setupCover = moduleConstructionSelectionData.construction.setupCover
@ -168,8 +290,6 @@ export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tem
setSnowGdChecked(selectedConstruction.setupSnowCover)
}
setCvrYn(selectedConstruction.cvrYn)
setSnowGdPossYn(selectedConstruction.snowGdPossYn)
setSelectedConstruction(selectedConstruction)
} else {
constructionRef.current.forEach((ref) => {
@ -178,178 +298,128 @@ export default function ModuleTabContents({ addRoof, setAddedRoofs, roofTab, tem
}
}
const handleCvrChecked = () => {
setCvrChecked(!cvrChecked)
setSelectedConstruction({ ...selectedConstruction, setupCover: !cvrChecked })
}
const handleSnowGdChecked = () => {
setSnowGdChecked(!snowGdChecked)
setSelectedConstruction({ ...selectedConstruction, setupSnowCover: !snowGdChecked })
}
const getModuleOptionsListData = async (params) => {
const optionsList = await getTrestleList(params)
if (optionsList.data.length > 0) {
if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd === null) {
setTrestleList(optionsList.data)
if (isExistData) {
setSelectedTrestle({ ...moduleConstructionSelectionData?.trestle })
} else {
setConstMthdList([])
setRoofBaseList([])
}
}
if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd === null) {
setConstMthdList(optionsList.data)
if (isExistData) {
setSelectedConstMthd({ ...moduleConstructionSelectionData?.trestle })
} else {
setRoofBaseList([])
}
}
if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd) {
setRoofBaseList(optionsList.data)
if (isExistData) {
setSelectedRoofBase({ ...moduleConstructionSelectionData?.trestle })
}
}
}
}
const getConstructionListData = async (params) => {
if (params.trestleMkrCd && params.constMthdCd && params.roofBaseCd) {
const optionsList = await getConstructionList(params)
setConstructionList(optionsList.data)
}
}
//
useEffect(() => {
if (isObjectNotEmpty(selectedRoofBase) && isObjectNotEmpty(selectedConstruction)) {
const newRoofConstructions = {
roofIndex: roofTab,
addRoof: addRoof,
trestle: selectedRoofBase,
construction: selectedConstruction,
}
if (tabIndex === roofTab) {
const common = { ...moduleSelectionInitParams }
const module = { ...selectedModules }
const newRoofConstructions = {
roofIndex: tabIndex,
addRoof: addRoof,
trestle: selectedRoofBase,
construction: selectedConstruction,
}
const index = tempModuleSelectionData.roofConstructions.findIndex((obj) => obj.roofIndex === roofTab)
console.log('newRoofConstructions', newRoofConstructions)
console.log('roofTab', roofTab)
if (index > -1) {
const newArray = [
...tempModuleSelectionData.roofConstructions.slice(0, index),
newRoofConstructions,
...tempModuleSelectionData.roofConstructions.slice(index + 1),
]
setTempModuleSelectionData({ roofConstructions: newArray })
} else {
setTempModuleSelectionData({ roofConstructions: [...tempModuleSelectionData.roofConstructions, { ...newRoofConstructions }] })
const index = tempModuleSelectionData.roofConstructions.findIndex((obj) => obj.roofIndex === tabIndex)
if (index > -1) {
const newArray = [
...tempModuleSelectionData.roofConstructions.slice(0, index),
newRoofConstructions,
...tempModuleSelectionData.roofConstructions.slice(index + 1),
]
setTempModuleSelectionData({ common: common, module: module, roofConstructions: newArray })
} else {
setTempModuleSelectionData({
common: common,
module: module,
roofConstructions: [...tempModuleSelectionData.roofConstructions, { ...newRoofConstructions }],
})
}
}
}
}, [selectedConstruction])
useEffect(() => {
if (isExistData) {
setConstructionListParams({
...moduleSelectionInitParams,
...roofBaseParams,
roofBaseCd: selectedRoofBase.roofBaseCd,
inclCd: addRoof.pitch,
})
}
}, [selectedRoofBase])
const getModuleOptionsListData = async (params, type) => {
const optionsList = await getTrestleList(params)
useEffect(() => {
console.log('moduleConstructionSelectionData', moduleConstructionSelectionData)
if (
isExistData &&
constructionList.length > 0 &&
isObjectNotEmpty(moduleConstructionSelectionData?.construction) &&
moduleConstructionSelectionData?.construction.hasOwnProperty('constPossYn') ///
) {
const selectedIndex = moduleConstructionSelectionData.construction.selectedIndex
const construction = constructionList[selectedIndex]
if (construction.constPossYn === 'Y') {
handleConstruction(selectedIndex)
}
}
}, [constructionList])
useEffect(() => {
if (isObjectNotEmpty(moduleSelectionData) && isObjectNotEmpty(moduleSelectionData.module)) {
setSelectedModules(moduleSelectionData.module)
}
}, [moduleSelectionData])
useEffect(() => {
// 202600
const raftCodeList = findCommonCode('203800')
//
raftCodeList.forEach((obj) => {
obj.name = obj.clCodeNm
obj.id = obj.clCode
})
setRaftCodes(raftCodeList)
}, [])
useEffect(() => {
//
if (
moduleSelectionInitParams.illuminationTp &&
moduleSelectionInitParams.instHt &&
moduleSelectionInitParams.stdSnowLd &&
moduleSelectionInitParams.stdWindSpeed
) {
const isModuleLoaded = moduleSelectionInitParams.hasOwnProperty('moduleTpCd') //
if (isModuleLoaded) {
setTrestleParams({
moduleTpCd: moduleSelectionInitParams.moduleTpCd,
roofMatlCd: addRoof.roofMatlCd,
raftBaseCd: addRoof.raftBaseCd,
workingWidth: lengthBase,
})
setConstructionList([])
if (isObjectNotEmpty(moduleConstructionSelectionData)) {
//
setConstructionParams({ ...moduleConstructionSelectionData.trestle, constMthdCd: '', roofBaseCd: '' })
setRoofBaseParams({ ...moduleConstructionSelectionData.trestle, roofBaseCd: '' })
setIsExistData(true)
if (optionsList.data.length > 0) {
if (type === 'trestle') {
setTrestleList(optionsList.data)
if (isExistData) {
// setSelectedTrestle({ ...moduleConstructionSelectionData?.trestle })
handleChangeTrestle(moduleConstructionSelectionData?.trestle)
} else {
setConstMthdList([])
setRoofBaseList([])
}
} else if (type === 'construction') {
setConstMthdList(optionsList.data)
if (isExistData) {
handleChangeConstMthd(moduleConstructionSelectionData?.trestle)
} else {
setRoofBaseList([])
}
} else if (type === 'roofBase') {
setRoofBaseList(optionsList.data)
if (isExistData) {
handleChangeRoofBase(moduleConstructionSelectionData?.trestle)
}
}
}
}
setTempModuleSelectionData({ common: moduleSelectionInitParams, module: selectedModules })
useEffect(() => {
console.log('originalModuleSelectionData', originalModuleSelectionData)
console.log('moduleSelectionInitParams', moduleSelectionInitParams)
// console.log('moduleSelectionInitParams', moduleSelectionInitParams)
// setSelectedTrestle({})
// setSelectedConstMthd({})
// setSelectedRoofBase({})
// setModuleSelectionData({
// ...moduleSelectionData,
// roofConstructions: [],
// })
}, [moduleSelectionInitParams])
useEffect(() => {
if (isObjectNotEmpty(trestleParams)) {
getModuleOptionsListData(trestleParams)
}
}, [trestleParams])
// useEffect(() => {
// useEffect(() => {
// console.log('moduleSelectionInitParams', moduleSelectionInitParams)
useEffect(() => {
if (isObjectNotEmpty(constructionParams)) {
getModuleOptionsListData(constructionParams)
}
}, [constructionParams])
// //
// if (
// moduleSelectionInitParams.illuminationTp &&
// moduleSelectionInitParams.instHt &&
// moduleSelectionInitParams.stdSnowLd &&
// moduleSelectionInitParams.stdWindSpeed
// ) {
// const isModuleLoaded = moduleSelectionInitParams.hasOwnProperty('moduleTpCd') //
useEffect(() => {
if (isObjectNotEmpty(roofBaseParams)) {
getModuleOptionsListData(roofBaseParams)
}
}, [roofBaseParams])
// //
// if (isModuleLoaded && moduleSelectionInitParams.moduleTpCd) {
// setTrestleParams({
// moduleTpCd: moduleSelectionInitParams.moduleTpCd,
// roofMatlCd: addRoof.roofMatlCd,
// raftBaseCd: addRoof.raftBaseCd,
// workingWidth: lengthBase,
// })
// // setConstructionList([])
useEffect(() => {
if (isObjectNotEmpty(constructionListParams)) {
getConstructionListData(constructionListParams)
}
}, [constructionListParams])
// if (isObjectNotEmpty(moduleConstructionSelectionData)) {
// //
// setConstructionParams({ ...moduleConstructionSelectionData.trestle, constMthdCd: '', roofBaseCd: '' })
// setRoofBaseParams({ ...moduleConstructionSelectionData.trestle, roofBaseCd: '' })
// setIsExistData(true)
// }
// }
// }
// setTempModuleSelectionData({ common: moduleSelectionInitParams, module: selectedModules })
// }, [])
// useEffect(() => {
// console.log('roofBaseParams', roofBaseParams)
// if (isObjectNotEmpty(roofBaseParams)) {
// getModuleOptionsListData(roofBaseParams)
// }
// }, [roofBaseParams])
// useEffect(() => {
// if (isObjectNotEmpty(tempModuleSelectionData)) {

View File

@ -615,7 +615,7 @@ export function useModuleBasicSetting() {
for (let i = 0; i <= totalWidth; i++) {
leftMargin = i === 0 ? 0 : intvHor * i
chidoriLength = 0
if (isChidori) {
if (isChidori && !isMaxSetup) {
chidoriLength = j % 2 === 0 ? 0 : width / 2 - intvHor
}
@ -716,7 +716,7 @@ export function useModuleBasicSetting() {
for (let j = 0; j < totalHeight; j++) {
leftMargin = j === 0 ? 0 : intvVer * j
chidoriLength = 0
if (isChidori) {
if (isChidori && !isMaxSetup) {
chidoriLength = i % 2 === 0 ? 0 : height / 2
}
@ -827,7 +827,7 @@ export function useModuleBasicSetting() {
for (let i = 0; i < diffRightEndPoint; i++) {
leftMargin = i === 0 ? 0 : intvHor * i
chidoriLength = 0
if (isChidori) {
if (isChidori && !isMaxSetup) {
chidoriLength = j % 2 === 0 ? 0 : width / 2 - intvHor
}
@ -927,7 +927,7 @@ export function useModuleBasicSetting() {
leftMargin = j === 0 ? 0 : intvVer * j
chidoriLength = 0
if (isChidori) {
if (isChidori && !isMaxSetup) {
chidoriLength = i % 2 === 0 ? 0 : height / 2 - intvHor
}

View File

@ -3,8 +3,8 @@ import { useContext, useEffect, useState } from 'react'
import { GlobalDataContext } from '@/app/GlobalDataProvider'
import { useMasterController } from '@/hooks/common/useMasterController'
import { useCommonCode } from '@/hooks/common/useCommonCode'
import { selectedModuleState, moduleSelectionInitParamsState, moduleSelectionDataState } from '@/store/selectedModuleOptions'
import { isObjectNotEmpty } from '@/util/common-utils'
export function useModuleSelection(props) {
const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
@ -30,6 +30,8 @@ export function useModuleSelection(props) {
setSelectedSurfaceType(managementState?.surfaceType)
}
const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터
//탭별 파라메터 초기화
useEffect(() => {
bindInitData()
@ -94,6 +96,13 @@ export function useModuleSelection(props) {
}
}
//데이터가 있으면 모듈 자동 선택
useEffect(() => {
if (moduleList.length > 0 && isObjectNotEmpty(moduleSelectionData.module)) {
handleChangeModule(moduleSelectionData.module)
}
}, [moduleList])
const handleChangeModule = (option) => {
//선택된 모듈
setSelectedModules(option) //선택값 저장