Merge branch 'qcast-pub' into dev

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

@@ -9,6 +9,7 @@ import { useRecoilState, useRecoilValue } from 'recoil'
 import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController'
 import { canvasPopupStatusStore } from '@/store/canvasPopupStatusAtom'
 import { useMasterController } from '@/hooks/common/useMasterController'
+import { v4 as uuidv4 } from 'uuid'
 
 export default function StepUp(props) {
   const { getMessage } = useMessage()
@@ -97,7 +98,7 @@ export default function StepUp(props) {
       pcsItemList: formatPcsItemList(stepUps.pcsItemList),
       selectedPcsItem: formatPcsItemList(stepUps.pcsItemList),
     }))
-
+    console.log('🚀 ~ formatStepUpListData ~ formattedData:', formattedData)
     // 초기 추천 값들을 selectedValues에 저장
     const initialSelectedValues = {}
     formattedData.forEach((stepUp) => {
@@ -173,11 +174,13 @@ export default function StepUp(props) {
   // PCS 시리즈 포맷
   const formatSerQtyList = (serQtyList = []) => {
     return serQtyList?.map((qty) => ({
+      code: uuidv4(),
       serQty: qty.serQty ? qty.serQty : 0,
       paralQty: qty.paralQty ? qty.paralQty : 0,
       rmdYn: qty.rmdYn ? qty.rmdYn : 'N',
       usePossYn: qty.usePossYn ? qty.usePossYn : 'Y',
       roofSurfaceList: formatRoofSurfaceList(qty.roofSurfaceList),
+      selected: qty.rmdYn === 'Y',
     }))
   }
 
@@ -209,75 +212,123 @@ export default function StepUp(props) {
   }
 
   // 행 선택 핸들러 함수 추가
-  const handleRowClick = (goodsNo, pcsIdx, serQtyIdx, serQty, paralQty) => {
+  // const handleRowClick = (goodsNo, pcsIdx, serQtyIdx, serQty, paralQty) => {
-    const rowKey = `${goodsNo}_${pcsIdx}_${serQtyIdx}`
+  const handleRowClick = (mainIdx, subIdx) => {
-    const pcsKey = `${goodsNo}_${pcsIdx}`
+    // const rowKey = `${goodsNo}_${pcsIdx}_${serQtyIdx}`
-
+    // const pcsKey = `${goodsNo}_${pcsIdx}`
-    console.log('goodsNo >> ', goodsNo, serQty, paralQty)
+    // setSelectedRow(rowKey)
-
+    // item.selected = !item.selected\
-    // 현재 선택된 PCS 아이템 정보 가져오기
+    let tempStepUpListData = [...stepUpListData]
-    const pcsItem = stepUpListData.find((stepUp) => stepUp.pcsItemList.find((item) => item.goodsNo === goodsNo))?.pcsItemList[pcsIdx]
+    let selectedData = {}
-
+    tempStepUpListData[0].pcsItemList[mainIdx].serQtyList.forEach((item, index) => {
-    if (!pcsItem) {
+      if (index === subIdx) {
-      console.error('PCS item not found:', { goodsNo, pcsIdx })
+        selectedData = item
-      return
-    }
-
-    // 선택된 값들 업데이트 - 더 자세한 정보 포함
-    const selectionData = {
-      goodsNo: goodsNo,
-      pcsInfo: {
-        itemId: pcsItem?.itemId,
-        goodsNo: pcsItem?.goodsNo,
-        pcsMkrCd: pcsItem?.pcsMkrCd,
-        pcsSerCd: pcsItem?.pcsSerCd,
-      },
-      allocation: {
-        serQty: serQty,
-        paralQty: paralQty,
-      },
-    }
-
-    // 선택된 값들 업데이트
-    setSelectedValues((prev) => ({
-      ...prev,
-      [goodsNo]: {
-        ...prev[goodsNo],
-        [pcsKey]: selectionData,
-      },
-    }))
-
-    // 부모 컴포넌트에 선택된 값들 전달
-    if (props.onValuesSelected) {
-      props.onValuesSelected(selectionData)
-    }
-
-    setSelectedRows((prev) => {
-      // 현재 stepUpId에 대한 선택 상태가 없으면 빈 객체로 초기화
-      const currentStepUpSelections = prev[goodsNo] || {}
-
-      // 이미 선택된 행을 다시 클릭하는 경우, 선택을 해제하지 않음
-      if (currentStepUpSelections[pcsKey] === rowKey) {
-        return prev
       }
+      item.selected = index === subIdx
+    })
+    setStepUpListData(tempStepUpListData)
+    console.log('🚀 ~ handleRowClick ~ tempStepUpListData:', tempStepUpListData)
+    console.log('🚀 ~ handleRowClick ~ selectedData:', selectedData)
 
-      return {
+    selectedData.roofSurfaceList.forEach((roofSurface) => {
-        ...prev,
+      const targetSurface = canvas.getObjects().filter((obj) => obj.id === roofSurface.roofSurfaceId)[0]
-        [goodsNo]: {
+      const moduleIds = targetSurface.modules.map((module) => {
-          ...currentStepUpSelections,
+        return module.id
-          [pcsKey]: rowKey,
+      })
-        },
+      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,
+          top: targetModule.top + targetModule.height / 2,
+          fill: 'black',
+          fontSize: 20,
+          width: targetModule.width,
+          height: targetModule.height,
+          textAlign: 'center',
+          originX: 'center',
+          originY: 'center',
+          name: 'circuitNumber',
+          parentId: targetModule.id,
+          circuitInfo: module.pcsItemId,
+        })
+        targetModule.circuit = moduleCircuitText
+        targetModule.circuitNumber = module.circuit
+        canvas.add(moduleCircuitText)
+      })
     })
 
-    // 수동 선택 상태를 업데이트하되, 기존 추천 선택은 유지
+    canvas.renderAll()
-    setIsManualSelection((prev) => ({
+    // console.log('goodsNo >> ', goodsNo, serQty, paralQty)
-      ...prev,
+    // 현재 선택된 PCS 아이템 정보 가져오기
-      [goodsNo]: {
+    // const pcsItem = stepUpListData.find((stepUp) => stepUp.pcsItemList.find((item) => item.goodsNo === goodsNo))?.pcsItemList[pcsIdx]
-        ...prev[goodsNo],
+
-        [pcsKey]: true,
+    // 선택된 값들 업데이트 - 더 자세한 정보 포함
-      },
+    // 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,
+    //   },
+    // }))
   }
 
   // 현재 선택된 값들을 가져오는 함수 추가
@@ -310,7 +361,7 @@ export default function StepUp(props) {
           {/* 3개일때 className = by-max */}
           {stepUpListData.map((stepUp, index) => (
             <div key={index} className={`module-table-box ${stepUp.pcsItemList.length === 3 ? 'by-max' : ''}`}>
-              {stepUp?.pcsItemList.map((_, idx) => (
+              {stepUp?.pcsItemList.map((pcsItem, idx) => (
                 <div key={idx} className="module-table-inner">
                   <div className="mb-box">
                     <div className="circuit-table-tit">{stepUp.pcsItemList[idx].goodsNo}</div>
@@ -323,19 +374,12 @@ export default function StepUp(props) {
                           </tr>
                         </thead>
                         <tbody>
-                          {stepUp.pcsItemList[idx].serQtyList.map((item, serQtyIdx) => {
+                          {pcsItem.serQtyList.map((item, serQtyIdx) => {
-                            const rowKey = `${stepUp.pcsItemList[idx].goodsNo}_${idx}_${serQtyIdx}`
-                            const pcsKey = `${stepUp.pcsItemList[idx].goodsNo}_${idx}`
                             return (
                               <tr
-                                key={rowKey}
+                                key={`row-${serQtyIdx}`}
-                                className={`${
+                                className={`${item.selected ? 'on' : ''}`}
-                                  (!isManualSelection[stepUp.pcsItemList[idx].goodsNo]?.[pcsKey] && item.rmdYn === 'Y') ||
+                                onClick={() => handleRowClick(idx, serQtyIdx)}
-                                  (selectedRows[stepUp.pcsItemList[idx].goodsNo] && selectedRows[stepUp.pcsItemList[idx].goodsNo][pcsKey] === rowKey)
-                                    ? 'on'
-                                    : ''
-                                }`}
-                                onClick={() => handleRowClick(stepUp.pcsItemList[idx].goodsNo, idx, serQtyIdx, item.serQty, item.paralQty)}
                                 style={{ cursor: 'pointer' }}
                               >
                                 <td className="al-r">{item.serQty}</td>