회로 할당 제대로 안되는 현상 수정

src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx

@@ -130,6 +130,7 @@ export default function StepUp(props) {
             if (selectedSerQty) {
               selectedSerQty.roofSurfaceList.forEach((roofSurface) => {
                 const targetSurface = canvas.getObjects().filter((obj) => obj.id === roofSurface.roofSurfaceId)[0]
+                if (!targetSurface) return
                 const moduleIds = targetSurface.modules.map((module) => module.id)
 
                 /** 기존 모듈 텍스트 삭제 */
@@ -406,75 +407,14 @@ export default function StepUp(props) {
   /**
    * 행 선택 핸들러 함수 추가
    */
-  const handleRowClick = (mainIdx, subIdx, applyParalQty = null) => {
+  /**
-    /** 자동 승압 설정인 경우만 실행 */
+   * 주어진 stepUpListData 를 기준으로 캔버스의 모든 module circuit 텍스트를 다시 그린다.
-    if (allocationType !== 'auto') return
+   * 모든 pcsItem 의 selected serQty 를 순회해 적용한다.
-
-    let tempStepUpListData = [...stepUpListData]
-    let selectedData = {}
-
-    tempStepUpListData[0].pcsItemList[mainIdx].serQtyList.forEach((item, index) => {
-      if (index === subIdx) {
-        selectedData = item
-      }
-      item.selected = index === subIdx
-    })
-    /** 선택된 행 정보 저장 */
-    setStepUpListData(tempStepUpListData)
-
-    /** 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를 사용하여 매칭
    */
-          const matchingPcsItem = tempStepUpListData[0].pcsItemList.find((item) => item.uniqueIndex === `${pcsItem.itemId}_${index}`)
+  const applyCircuitsToCanvas = (stepUpListSrc) => {
+    if (!stepUpListSrc?.[0]?.pcsItemList) return
 
-          /** 선택된 serQty 찾기 */
+    /** 모든 모듈 circuit 데이터 초기화 */
-          const selectedSerQty = matchingPcsItem?.serQtyList.find((serQty) => serQty.selected)?.serQty || 0
-          if (index === 0) {
-            return {
-              ...pcsItem,
-              applySerQty: selectedSerQty,
-              applyParalQty: +applyParalQty,
-            }
-          }
-          return {
-            ...pcsItem,
-            applySerQty: selectedSerQty,
-          }
-        }),
-      }
-
-      /** PCS가 1개 이고 2번째 또는 3번째 PCS serQty가 0인 경우는 추천 API 실행하지 않음 */
-      if (params.pcsItemList.length !== 1 && (params.pcsItemList[1]?.applySerQty !== 0 || params.pcsItemList[2]?.applySerQty) !== 0) {
-        /** 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 */
-            setStepUpListData(stepUpListData)
-
-            /** PCS 옵션 조회 */
-            // const formattedOptCodes = formatOptionCodes(res.data.optionList)
-            // setOptCodes(formattedOptCodes)
-            // setSeletedOption(formattedOptCodes[0])
-          } else {
-            swalFire({ text: getMessage('common.message.send.error') })
-          }
-        })
-      }
-    }
-
-    /** 모듈 목록 삭제 */
     canvas
       .getObjects()
       .filter((obj) => obj.name === POLYGON_TYPE.MODULE)
@@ -484,23 +424,18 @@ export default function StepUp(props) {
         module.pcsItemId = null
       })
 
-    /** 선택된 모듈 목록 추가 */
+    /** 기존 circuit 텍스트 객체 모두 제거 */
-    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))
+      .filter((obj) => obj.name === 'circuitNumber')
-        .map((text) => {
+      .forEach((text) => canvas.remove(text))
-          canvas.remove(text)
-        })
 
-      /** 모듈 목록 추가 */
+    stepUpListSrc[0].pcsItemList.forEach((pcsItem) => {
-      canvas.renderAll()
+      const sel = pcsItem.serQtyList?.find((sq) => sq.selected)
+      if (!sel) return
+      sel.roofSurfaceList.forEach((roofSurface) => {
+        const targetSurface = canvas.getObjects().filter((obj) => obj.id === roofSurface.roofSurfaceId)[0]
+        if (!targetSurface) return
 
         roofSurface.moduleList.forEach((module) => {
           const targetModule = canvas.getObjects().find((obj) => obj.id === module.uniqueId)
@@ -530,11 +465,78 @@ export default function StepUp(props) {
           }
         })
       })
+    })
 
     canvas.renderAll()
     setModuleStatisticsData()
   }
 
+  const handleRowClick = (mainIdx, subIdx, applyParalQty = null) => {
+    /** 자동 승압 설정인 경우만 실행 */
+    if (allocationType !== 'auto') return
+
+    let tempStepUpListData = [...stepUpListData]
+
+    tempStepUpListData[0].pcsItemList[mainIdx].serQtyList.forEach((item, index) => {
+      item.selected = index === subIdx
+    })
+    /** 선택된 행 정보 저장 */
+    setStepUpListData(tempStepUpListData)
+
+    /** PCS 2개 이상 또는 첫번째 PCS 선택 시에만 실행 */
+    const needsRefetch =
+      tempStepUpListData[0].pcsItemList.length > 1 && mainIdx === 0
+
+    if (needsRefetch) {
+      /** 파워컨디셔너 옵션 조회 요청 파라미터 */
+      const params = {
+        ...props.getOptYn(), // 옵션 Y/N
+        useModuleItemList: props.getUseModuleItemList(), // 사용된 모듈아이템 List
+        roofSurfaceList: props.getRoofSurfaceList(), // 지붕면 목록
+        pcsItemList: props.getSelectedPcsItemList().map((pcsItem, index) => {
+          const matchingPcsItem = tempStepUpListData[0].pcsItemList.find((item) => item.uniqueIndex === `${pcsItem.itemId}_${index}`)
+          const selectedSerQty = matchingPcsItem?.serQtyList.find((serQty) => serQty.selected)?.serQty || 0
+          if (index === 0) {
+            return {
+              ...pcsItem,
+              applySerQty: selectedSerQty,
+              applyParalQty: +applyParalQty,
+            }
+          }
+          return {
+            ...pcsItem,
+            applySerQty: selectedSerQty,
+          }
+        }),
+      }
+
+      /** PCS가 1개 이고 2번째 또는 3번째 PCS serQty가 0인 경우는 추천 API 실행하지 않음 */
+      const skipApi = !(params.pcsItemList.length !== 1 && (params.pcsItemList[1]?.applySerQty !== 0 || params.pcsItemList[2]?.applySerQty) !== 0)
+
+      if (!skipApi) {
+        /**
+         * PCS 승압설정 정보 조회. 캔버스 갱신은 응답을 받은 뒤에 수행해야
+         * "한박자 늦게" 반영되는 stale state 문제가 발생하지 않는다.
+         */
+        getPcsVoltageStepUpList(params).then((res) => {
+          if (res?.result.resultCode === 'S' && res?.data) {
+            const dataArray = Array.isArray(res.data) ? res.data : [res.data]
+            const newStepUpListData = formatStepUpListData(dataArray)
+            setStepUpListData(newStepUpListData)
+            applyCircuitsToCanvas(newStepUpListData)
+          } else {
+            swalFire({ text: getMessage('common.message.send.error') })
+            applyCircuitsToCanvas(tempStepUpListData)
+          }
+        })
+        return
+      }
+    }
+
+    /** API 재조회가 없는 경로: 현재 tempStepUpListData 로 즉시 캔버스 갱신 */
+    applyCircuitsToCanvas(tempStepUpListData)
+  }
+
   /**
    * 현재 선택된 값들을 가져오는 함수 추가
    */