회로할당(승압설정) 저장 시 Canvas Object 저장

src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx

@@ -51,7 +51,9 @@ export default function CircuitTrestleSetting({ id }) {
   const [selectedStepUpValues, setSelectedStepUpValues] = useState({})
   const [getStepUpSelections, setGetStepUpSelections] = useState(null)
 
-  const [stepUpListData, setStepUpListData] = useRecoilState(stepUpListDataState)
+  // const [stepUpListData, setStepUpListData] = useRecoilState(stepUpListDataState)
+  const [stepUpListData, setStepUpListData] = useState([])
+  const [seletedOption, setSeletedOption] = useState(null)
 
   useEffect(() => {
     if (!managementState) {
@@ -67,10 +69,6 @@ export default function CircuitTrestleSetting({ id }) {
     }
   }, [tabNum])
 
-  useEffect(() => {
-    console.log('stepUpListData >>> ', stepUpListData)
-  }, [stepUpListData])
-
   const onAutoRecommend = () => {
     if (series.filter((s) => s.selected).length === 0) {
       swalFire({
@@ -358,60 +356,16 @@ export default function CircuitTrestleSetting({ id }) {
     setGetStepUpSelections(() => getCurrentSelections)
   }
 
-  // apply 함수 수정
+  // 회로할당(승압설정) 저장 버튼 클릭 시
   const onApply = () => {
-    // 현재 선택된 값들 가져오기
+    canvas
-    const currentSelections = getStepUpSelections ? getStepUpSelections() : {}
+      .getObjects()
-
+      .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
-    console.log('currentSelections >>> ', currentSelections)
+      .map((obj) => {
-
+        obj.pcses = getStepUpListData()
-    // 실제 선택된 값이 있는지 더 정확하게 확인
-    const hasSelections = Object.values(currentSelections).some((stepUpConfig) => Object.values(stepUpConfig).length > 0)
-
-    console.log('hasSelections >>> ', hasSelections)
-
-    if (!hasSelections) {
-      swalFire({
-        title: '승압 설정값을 선택해주세요.1',
-        type: 'alert',
       })
-      return
-    }
 
-    // 선택된 값들 로그
+    console.log(canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE))
-    console.log('Applying StepUp configurations:', currentSelections)
-
-    // StepUp 컴포넌트로부터 stepUpListData 받아오기
-    //const stepUpData = getStepUpSelections().stepUpListData
-    //console.log('stepUpData >>> ', stepUpData)
-    // stepUpListData를 Recoil state에 저장
-    // setStepUpListData(stepUpData)
-
-    // 선택된 값들을 배열로 변환하여 처리
-    const configurations = Object.values(currentSelections)
-      .map((stepUpConfig) => {
-        const firstConfig = Object.values(stepUpConfig)[0] // 첫 번째 설정만 사용
-        return {
-          pcsInfo: firstConfig.pcsInfo,
-          allocation: firstConfig.allocation,
-        }
-      })
-      .filter((config) => config.pcsInfo && config.allocation) // 유효한 설정만 필터링
-
-    console.log('Processed configurations:', configurations)
-
-    // stepUpListData를 Recoil state에 저장
-    setStepUpListData(configurations)
-
-    // 기존 apply 로직 실행 전에 필요한 데이터가 모두 있는지 확인
-    if (configurations.length > 0) {
-      apply()
-    } else {
-      swalFire({
-        title: '승압 설정값을 선택해주세요.2',
-        type: 'alert',
-      })
-    }
   }
 
   const onClickPrev = () => {
@@ -474,6 +428,29 @@ export default function CircuitTrestleSetting({ id }) {
     getRoofSurfaceList, // 지붕면 목록
     getPcsItemList, // PCS 아이템 목록
     onValuesSelected: handleStepUpValuesSelected, // 선택된 값들을 처리하는 함수
+    stepUpListData,
+    setStepUpListData,
+    seletedOption,
+    setSeletedOption,
+  }
+
+  const getStepUpListData = () => {
+    return stepUpListData[0].pcsItemList.map((item) => {
+      return item.serQtyList
+        .filter((serQty) => serQty.selected)
+        .map((serQty) => {
+          return {
+            pcsMkrCd: item.pcsMkrCd,
+            pcsSerCd: item.pcsSerCd,
+            pcsItemId: item.itemId,
+            pcsOptCd: seletedOption.code,
+            paralQty: serQty.paralQty,
+            connections: {
+              connItemId: item.connList[0].itemId,
+            },
+          }
+        })[0]
+    })
   }
 
   return (

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

@@ -12,6 +12,7 @@ import { useMasterController } from '@/hooks/common/useMasterController'
 import { v4 as uuidv4 } from 'uuid'
 
 export default function StepUp(props) {
+  const { stepUpListData, setStepUpListData, seletedOption, setSeletedOption } = props
   const { getMessage } = useMessage()
   const [moduleTab, setModuleTab] = useState(1)
   const [moduleTabs, setModuleTabs] = useState({})
@@ -22,7 +23,6 @@ export default function StepUp(props) {
   const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
   const canvas = useRecoilValue(canvasState)
   const selectedModules = useRecoilValue(selectedModuleState)
-  const [stepUpListData, setStepUpListData] = useState([])
   const [optCodes, setOptCodes] = useState([])
 
   const [selectedRows, setSelectedRows] = useState({})
@@ -65,6 +65,7 @@ export default function StepUp(props) {
         // PCS 옵션 조회
         const formattedOptCodes = formatOptionCodes(res.data.optionList)
         setOptCodes(formattedOptCodes)
+        setSeletedOption(formattedOptCodes[0].code)
       }
     } catch (error) {
       console.error('Error fetching step up data:', error)
@@ -80,16 +81,6 @@ export default function StepUp(props) {
     }))
   }
 
-  // // PCS 승압설정 정보 포맷
-  // const formatStepUpListData = (dataArray = []) => {
-  //   return dataArray?.map((stepUps) => ({
-  //     ...stepUps,
-  //     optionList: formatOptionList(stepUps.optionList),
-  //     pcsItemList: formatPcsItemList(stepUps.pcsItemList),
-  //     selectedPcsItem: formatPcsItemList(stepUps.pcsItemList),
-  //   }))
-  // }
-
   // PCS 승압설정 정보 포맷 후 추천 값 저장
   const formatStepUpListData = (dataArray = []) => {
     const formattedData = dataArray?.map((stepUps) => ({
@@ -98,12 +89,12 @@ export default function StepUp(props) {
       pcsItemList: formatPcsItemList(stepUps.pcsItemList),
       selectedPcsItem: formatPcsItemList(stepUps.pcsItemList),
     }))
-    console.log('🚀 ~ formatStepUpListData ~ formattedData:', formattedData)
+
     // 초기 추천 값들을 selectedValues에 저장
     const initialSelectedValues = {}
     formattedData.forEach((stepUp) => {
       stepUp.pcsItemList.forEach((pcsItem, pcsIdx) => {
-        const pcsKey = `${stepUp.id}_${pcsIdx}`
+        const pcsKey = `${pcsItem.goodsNo}_${pcsIdx}`
 
         // 추천 값(rmdYn === 'Y') 찾기
         const recommendedRow = pcsItem.serQtyList.find((item) => item.rmdYn === 'Y')
@@ -122,8 +113,8 @@ export default function StepUp(props) {
             },
           }
 
-          initialSelectedValues[stepUp.id] = {
+          initialSelectedValues[pcsItem.goodsNo] = {
-            ...initialSelectedValues[stepUp.id],
+            ...initialSelectedValues[pcsItem.goodsNo],
             [pcsKey]: selectionData,
           }
         }
@@ -212,12 +203,7 @@ export default function StepUp(props) {
   }
 
   // 행 선택 핸들러 함수 추가
-  // const handleRowClick = (goodsNo, pcsIdx, serQtyIdx, serQty, paralQty) => {
   const handleRowClick = (mainIdx, subIdx) => {
-    // const rowKey = `${goodsNo}_${pcsIdx}_${serQtyIdx}`
-    // const pcsKey = `${goodsNo}_${pcsIdx}`
-    // setSelectedRow(rowKey)
-    // item.selected = !item.selected\
     let tempStepUpListData = [...stepUpListData]
     let selectedData = {}
     tempStepUpListData[0].pcsItemList[mainIdx].serQtyList.forEach((item, index) => {
@@ -227,6 +213,7 @@ export default function StepUp(props) {
       item.selected = index === subIdx
     })
     setStepUpListData(tempStepUpListData)
+
     console.log('🚀 ~ handleRowClick ~ tempStepUpListData:', tempStepUpListData)
     console.log('🚀 ~ handleRowClick ~ selectedData:', selectedData)
 
@@ -235,19 +222,16 @@ export default function StepUp(props) {
       const moduleIds = targetSurface.modules.map((module) => {
         return module.id
       })
-      console.log(moduleIds)
+
       canvas
         .getObjects()
         .filter((obj) => moduleIds.includes(obj.parentId))
         .map((text) => {
-          console.log('🚀 ~ handleRowClick ~ text:', text)
           canvas.remove(text)
         })
 
       canvas.renderAll()
       roofSurface.moduleList.forEach((module) => {
-        console.log('🚀 ~ handleRowClick ~ module:', module.uniqueId)
-
         const targetModule = canvas.getObjects().filter((obj) => obj.id === module.uniqueId)[0]
         const moduleCircuitText = new fabric.Text(module.circuit, {
           left: targetModule.left + targetModule.width / 2,
@@ -270,69 +254,26 @@ export default function StepUp(props) {
     })
 
     canvas.renderAll()
-    // console.log('goodsNo >> ', goodsNo, serQty, paralQty)
-    // 현재 선택된 PCS 아이템 정보 가져오기
-    // const pcsItem = stepUpListData.find((stepUp) => stepUp.pcsItemList.find((item) => item.goodsNo === goodsNo))?.pcsItemList[pcsIdx]
-
-    // 선택된 값들 업데이트 - 더 자세한 정보 포함
-    // const selectionData = {
-    //   goodsNo: tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo,
-    //   pcsInfo: {
-    //     itemId: tempStepUpListData[mainIdx].pcsItemList[subIdx].itemId,
-    //     goodsNo: tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo,
-    //     pcsMkrCd: tempStepUpListData[mainIdx].pcsItemList[subIdx].pcsMkrCd,
-    //     pcsSerCd: tempStepUpListData[mainIdx].pcsItemList[subIdx].pcsSerCd,
-    //   },
-    //   allocation: {
-    //     serQty: tempStepUpListData[mainIdx].pcsItemList[subIdx].serQtyList[subIdx].serQty,
-    //     paralQty: tempStepUpListData[mainIdx].pcsItemList[subIdx].serQtyList[subIdx]. paralQty,
-    //   },
-    // }
-
-    // // 선택된 값들 업데이트
-    // setSelectedValues((prev) => ({
-    //   ...prev,
-    //   [tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo]: {
-    //     ...prev[tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo],
-    //     [pcsKey]: selectionData,
-    //   },
-    // }))
-
-    // // 부모 컴포넌트에 선택된 값들 전달
-    // if (props.onValuesSelected) {
-    //   props.onValuesSelected(selectionData)
-    // }
-
-    // setSelectedRows((prev) => {
-    //   // 현재 stepUpId에 대한 선택 상태가 없으면 빈 객체로 초기화
-    //   const currentStepUpSelections = prev[goodsNo] || {}
-
-    //   // 이미 선택된 행을 다시 클릭하는 경우, 선택을 해제하지 않음
-    //   if (currentStepUpSelections[pcsKey] === rowKey) {
-    //     return prev
-    //   }
-
-    //   return {
-    //     ...prev,
-    //     [goodsNo]: {
-    //       ...currentStepUpSelections,
-    //       [pcsKey]: rowKey,
-    //     },
-    //   }
-    // })
-
-    // // 수동 선택 상태를 업데이트하되, 기존 추천 선택은 유지
-    // setIsManualSelection((prev) => ({
-    //   ...prev,
-    //   [goodsNo]: {
-    //     ...prev[goodsNo],
-    //     [pcsKey]: true,
-    //   },
-    // }))
   }
 
   // 현재 선택된 값들을 가져오는 함수 추가
   const getCurrentSelections = () => {
+    const selectedValues = stepUpListData[0].pcsItemList.forEach((item) => {
+      item.serQtyList.filter((serQty) => serQty.selected)
+      return item.serQtyList.map((serQty) => {
+        return {
+          pcsMkrCd: serQty.pcsMkrCd,
+          pcsSerCd: serQty.pcsSerCd,
+          pcsItemId: serQty.itemId,
+          pcsOptCd: seletedOption,
+          paralQty: serQty.paralQty,
+          connections: {
+            connItemId: item.connList[0].itemId,
+          },
+        }
+      })
+    })
+
     return selectedValues
   }
 
@@ -472,7 +413,15 @@ export default function StepUp(props) {
             {optCodes.length > 0 && (
               <div className="grid-select mr10">
                 {/* <QSelectBox title={'電力検出ユニット (モニター付き)'} /> */}
-                <QSelectBox options={optCodes} title={optCodes[0].name} value={optCodes[0].name} sourceKey="code" targetKey="code" showKey="name" />
+                <QSelectBox
+                  options={optCodes}
+                  title={optCodes[0].name}
+                  value={seletedOption}
+                  sourceKey="code"
+                  targetKey="code"
+                  showKey="name"
+                  onChange={(e) => setSeletedOption(e)}
+                />
               </div>
             )}
           </div>