push test

src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx

@@ -38,6 +38,8 @@ export default function ModuleTabContents({
   const [constructionListParams, setConstructionListParams] = useState({})
 
   const [trestleParams, setTrestleParams] = useState({}) //서까래, 가대메이커,공법,지붕밑바탕 관련  api호출 파라메터
+  const [constructionParams, setConstructionParams] = useState({}) //공법 관련  api호출 파라메터
+  const [roofBaseParams, setRoofBaseParams] = useState({}) //지붕밑바탕 관련  api호출 파라메터
 
   const moduleSelectionInitParams = useRecoilValue(moduleSelectionInitParamsState) //모듈 기본 데이터 ex) 면조도, 높이등등
 
@@ -50,6 +52,8 @@ export default function ModuleTabContents({
   const [cvrChecked, setCvrChecked] = useState(false)
   const [snowGdChecked, setSnowGdChecked] = useState(false)
 
+  const [isExistData, setIsExistData] = useState(false)
+
   //서까래간격 변경
   const handleChangeRaftBase = (option) => {
     setSelectedRaftBase(option)
@@ -62,49 +66,25 @@ export default function ModuleTabContents({
 
   //가대메이커 변경
   const handleChangeTrestle = (option) => {
-    if (option) {
     setSelectedTrestle(option) //선택값  저장
-      setTrestleParams({ ...trestleParams, trestleMkrCd: option.trestleMkrCd, constMthdCd: '', roofBaseCd: '' })
+    setConstructionParams({ ...trestleParams, trestleMkrCd: option.trestleMkrCd, constMthdCd: '', roofBaseCd: '' })
-    } else {
-      const existTrestle = moduleSelectionData.roofConstructions[roofTab].trestle
-      setSelectedTrestle(existTrestle)
-      setTrestleParams({ ...existTrestle, constMthdCd: '', roofBaseCd: '' })
-    }
-
-    setConstMthdList([]) //공법 초기화
-    setRoofBaseList([]) //지붕밑바탕 초기화
   }
 
   //공법 변경
   const handleChangeConstMthd = (option) => {
-    if (option) {
     setSelectedConstMthd(option) //선택된값 저장
-      setTrestleParams({ ...trestleParams, constMthdCd: option.constMthdCd, roofBaseCd: '' })
+    setRoofBaseParams({ ...trestleParams, trestleMkrCd: selectedTrestle.trestleMkrCd, constMthdCd: option.constMthdCd, roofBaseCd: '' })
-    } else {
-      const existTrestle = moduleSelectionData.roofConstructions[roofTab].trestle
-      setSelectedConstMthd(existTrestle)
-      setTrestleParams({ ...existTrestle, constMthdCd: '', roofBaseCd: '' })
-    }
-
-    setRoofBaseList([])
   }
 
   //지붕밑바탕변경
   const handleChangeRoofBase = (option) => {
-    if (option) {
+    // if (option) {
     setConstructionListParams({
       ...moduleSelectionInitParams,
-        ...trestleParams,
+      ...roofBaseParams,
       roofBaseCd: option.roofBaseCd,
     })
     setSelectedRoofBase(option)
-    } else {
-      const existTrestle = moduleSelectionData.roofConstructions[roofTab].trestle
-      setConstructionListParams({
-        ...existTrestle,
-      })
-      setSelectedRoofBase(existTrestle)
-    }
   }
 
   const getModuleOptionsListData = async (params) => {
@@ -112,17 +92,28 @@ export default function ModuleTabContents({
     if (optionsList.data.length > 0) {
       if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd === null) {
         setTrestleList(optionsList.data)
+        if (isExistData) {
+          setSelectedTrestle({ ...moduleSelectionData.roofConstructions[roofTab].trestle })
+        } else {
           setConstMthdList([])
           setRoofBaseList([])
         }
+      }
 
       if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd === null) {
         setConstMthdList(optionsList.data)
+        if (isExistData) {
+          setSelectedConstMthd({ ...moduleSelectionData.roofConstructions[roofTab].trestle })
+        } else {
           setRoofBaseList([])
         }
+      }
 
       if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd) {
         setRoofBaseList(optionsList.data)
+        if (isExistData) {
+          setSelectedRoofBase({ ...moduleSelectionData.roofConstructions[roofTab].trestle })
+        }
       }
     }
   }
@@ -148,10 +139,13 @@ export default function ModuleTabContents({
     constructionRef.current[index].classList.remove('white')
     constructionRef.current[index].classList.add('blue')
 
+    debugger
+
     const selectedConstruction = constructionList[index]
     selectedConstruction.roofIndex = roofTab
     selectedConstruction.setupCover = false //처마력바 설치 여부
     selectedConstruction.setupSnowCover = false //눈막이금구 설치 여부
+    selectedConstruction.selectedIndex = index
 
     setCvrYn(selectedConstruction.cvrYn)
     setSnowGdPossYn(selectedConstruction.snowGdPossYn)
@@ -192,6 +186,23 @@ export default function ModuleTabContents({
     setSelectedConstruction({ ...selectedConstruction, setupSnowCover: snowGdChecked })
   }, [snowGdChecked])
 
+  useEffect(() => {
+    if (isExistData) {
+      setConstructionListParams({
+        ...moduleSelectionInitParams,
+        ...roofBaseParams,
+        roofBaseCd: selectedRoofBase.roofBaseCd,
+      })
+    }
+  }, [selectedRoofBase])
+
+  useEffect(() => {
+    if (isExistData) {
+      const selectedIndex = moduleSelectionData.roofConstructions[roofTab].construction.selectedIndex
+      handleConstruction(selectedIndex)
+    }
+  }, [constructionList])
+
   useEffect(() => {
     // 202600 경사도
     const raftCodeList = findCommonCode('203800')
@@ -215,6 +226,12 @@ export default function ModuleTabContents({
       if (isModuleLoaded) {
         setTrestleParams({ moduleTpCd: moduleSelectionInitParams.moduleTpCd, roofMatlCd: addRoof.roofMatlCd, raftBaseCd: addRoof.raftBaseCd })
         setConstructionList([])
+
+        if (isObjectNotEmpty(moduleSelectionData.roofConstructions[roofTab])) {
+          setConstructionParams({ ...moduleSelectionData.roofConstructions[roofTab].trestle, constMthdCd: '', roofBaseCd: '' })
+          setRoofBaseParams({ ...moduleSelectionData.roofConstructions[roofTab].trestle, roofBaseCd: '' })
+          setIsExistData(true)
+        }
       }
     }
 
@@ -227,6 +244,18 @@ export default function ModuleTabContents({
     }
   }, [trestleParams])
 
+  useEffect(() => {
+    if (isObjectNotEmpty(constructionParams)) {
+      getModuleOptionsListData(constructionParams)
+    }
+  }, [constructionParams])
+
+  useEffect(() => {
+    if (isObjectNotEmpty(roofBaseParams)) {
+      getModuleOptionsListData(roofBaseParams)
+    }
+  }, [roofBaseParams])
+
   useEffect(() => {
     if (isObjectNotEmpty(constructionListParams)) {
       getConstructionListData(constructionListParams)
@@ -239,13 +268,6 @@ export default function ModuleTabContents({
     }
   }, [tempModuleSelectionData])
 
-  useEffect(() => {
-    if (isObjectNotEmpty(moduleSelectionData.roofConstructions[roofTab])) {
-      handleChangeTrestle()
-      handleChangeConstMthd()
-    }
-  }, [])
-
   return (
     <>
       <div className="module-table-inner">