집계표 버그 수정

src/components/floor-plan/CanvasFrame.jsx

@@ -49,7 +49,7 @@ export default function CanvasFrame() {
   const resetPcsCheckState = useResetRecoilState(pcsCheckState)
   const { handleModuleSelectionTotal } = useCanvasPopupStatusController()
   const { fetchBasicSettings } = useCanvasSetting()
-  const { setSelectedMenu } = useCanvasMenu()
+  const { selectedMenu, setSelectedMenu } = useCanvasMenu()
   const { initEvent } = useEvent()
 
   const loadCanvas = () => {
@@ -69,6 +69,7 @@ export default function CanvasFrame() {
           initEvent()
         })
       }
+      Object.keys(currentCanvasPlan).length > 0 && canvas && handleModuleSelectionTotal()
     }
     gridInit()
   }
@@ -76,7 +77,6 @@ export default function CanvasFrame() {
   useEffect(() => {
     loadCanvas()
     resetRecoilData()
-    Object.keys(currentCanvasPlan).length > 0 && canvas && handleModuleSelectionTotal()
 
     /* 플랜번호가 있으면 베이직세팅 팝업 데이터 로드 */
     if (currentCanvasPlan.planNo) {
@@ -97,7 +97,7 @@ export default function CanvasFrame() {
   }, [])
 
   const resetRecoilData = () => {
-    resetModuleStatisticsState()
+    // resetModuleStatisticsState()
     resetMakersState()
     resetSelectedMakerState()
     resetSeriesState()
@@ -121,12 +121,7 @@ export default function CanvasFrame() {
           </ul>
         ))}
       </QContextMenu>
-      {[
+      {selectedMenu === 'module' && totalDisplay && <PanelBatchStatistics />}
-        MENU.MODULE_CIRCUIT_SETTING.BASIC_SETTING,
-        MENU.MODULE_CIRCUIT_SETTING.CIRCUIT_TRESTLE_SETTING,
-        MENU.MODULE_CIRCUIT_SETTING.PLAN_ORIENTATION,
-      ].includes(currentMenu) &&
-        totalDisplay && <PanelBatchStatistics />}
       {/* 이미지 로드 팝업 */}
       <ImgLoad />
     </div>

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

@@ -52,7 +52,7 @@ export default function CircuitTrestleSetting({ id }) {
   // const [stepUpListData, setStepUpListData] = useRecoilState(stepUpListDataState)
   const [stepUpListData, setStepUpListData] = useState([])
   const [seletedOption, setSeletedOption] = useState(null)
-  const { setModuleStatisticsData, resetCircuits } = useCircuitTrestle()
+  const { setModuleStatisticsData } = useCircuitTrestle()
   const { handleCanvasToPng } = useImgLoader()
 
   const passivityCircuitAllocationRef = useRef()
@@ -92,17 +92,6 @@ export default function CircuitTrestleSetting({ id }) {
     //   selectedModels,
     //   pcsCheck,
     // })
-
-    return () => {
-      if (
-        canvas
-          .getObjects()
-          .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
-          .some((surface) => !surface.isComplete)
-      ) {
-        resetCircuits()
-      }
-    }
   }, [])
 
   // 수동할당 시 모듈 삭제

src/components/floor-plan/modal/panelBatch/PanelBatchStatistics.jsx

@@ -21,7 +21,7 @@ export default function PanelBatchStatistics() {
   })
   const canvas = useRecoilValue(canvasState)
   const { header, rows, footer } = useRecoilValue(moduleStatisticsState)
-  const { setModuleStatisticsData } = useCircuitTrestle()
+  const { setModuleStatisticsData } = useCircuitTrestle(true)
   const [moduleSelectionDataStore, setModuleSelectionDataStore] = useRecoilState(moduleSelectionDataState)
 
   useEffect(() => {

src/hooks/common/useCanvasConfigInitialize.js

@@ -9,6 +9,7 @@ import { globalFontAtom } from '@/store/fontAtom'
 import { useRoof } from '@/hooks/common/useRoof'
 import { usePolygon } from '@/hooks/usePolygon'
 import { useRoofFn } from '@/hooks/common/useRoofFn'
+import { POLYGON_TYPE } from '@/common/common'
 
 export function useCanvasConfigInitialize() {
   const canvas = useRecoilValue(canvasState)
@@ -211,17 +212,20 @@ export function useCanvasConfigInitialize() {
   }
 
   const moduleInit = () => {
-    canvas
+    const roofSurfaceList = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
-      .getObjects()
+    const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
-      .filter((obj) => obj.name === 'module')
+    roofSurfaceList.forEach((surface) => {
-      .forEach((obj) => {
+      surface.modules = modules.filter((module) => module.surfaceId === surface.id)
-        obj.set({
+    })
-          selectable: true,
+    modules.forEach((obj) => {
-          lockMovementX: true,
+      console.log(obj)
-          lockMovementY: true,
+      obj.set({
-        })
+        selectable: true,
-        obj.setViewLengthText(false)
+        lockMovementX: true,
+        lockMovementY: true,
       })
+      obj.setViewLengthText(false)
+    })
   }
 
   return { canvasLoadInit, gridInit }

src/hooks/common/useCanvasPopupStatusController.js

@@ -8,6 +8,8 @@ import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedM
 import { compasDegAtom } from '@/store/orientationAtom'
 import { canvasState, currentCanvasPlanState } from '@/store/canvasAtom'
 import { POLYGON_TYPE } from '@/common/common'
+import { useCircuitTrestle } from '../useCirCuitTrestle'
+import { useEffect } from 'react'
 
 /**
  * 캔버스 팝업 상태 관리
@@ -58,13 +60,12 @@ export function useCanvasPopupStatusController(param = 1) {
       } else if (i === 2) {
         const data = JSON.parse(unescapeString(result.popupStatus))
         setModuleSelectionDataStore(data)
-        if (data.module) setSelectedModules(data.module)
-
         const roofSurfaceList = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
         const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
         roofSurfaceList.forEach((surface) => {
           surface.modules = modules.filter((module) => module.surfaceId === surface.id)
         })
+        if (data.module) setSelectedModules(data.module)
       }
     }
   }

src/hooks/useCirCuitTrestle.js

@@ -11,13 +11,12 @@ import {
   seriesState,
 } from '@/store/circuitTrestleAtom'
 import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions'
-import { useContext } from 'react'
+import { useContext, useEffect } from 'react'
-import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
+import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'
 import { useMessage } from './useMessage'
-import { useCanvasPopupStatusController } from './common/useCanvasPopupStatusController'
 import Big from 'big.js'
 
-export function useCircuitTrestle() {
+export function useCircuitTrestle(executeEffect = false) {
   const [makers, setMakers] = useRecoilState(makersState)
   const [selectedMaker, setSelectedMaker] = useRecoilState(selectedMakerState)
   const [series, setSeries] = useRecoilState(seriesState)
@@ -27,10 +26,14 @@ export function useCircuitTrestle() {
   const selectedModules = useRecoilValue(selectedModuleState)
   const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
   const canvas = useRecoilValue(canvasState)
-  const { trigger: moduleSelectedDataTrigger } = useCanvasPopupStatusController(2)
-  const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState)
   const setModuleStatistics = useSetRecoilState(moduleStatisticsState)
+  const resetModuleStatistics = useResetRecoilState(moduleStatisticsState)
   const { getMessage } = useMessage()
+
+  useEffect(() => {
+    if (Object.keys(selectedModules).length > 0 && executeEffect) setModuleStatisticsData()
+  }, [selectedModules])
+
   const getOptYn = () => {
     return {
       maxConnYn: pcsCheck.max ? 'Y' : 'N',
@@ -178,7 +181,15 @@ export function useCircuitTrestle() {
 
   const setModuleStatisticsData = () => {
     console.log('selectedModules', selectedModules)
-    if (!selectedModules || !selectedModules?.itemList || selectedModules?.itemList?.length === 0) return
+    if (
+      !selectedModules ||
+      !selectedModules?.itemList ||
+      selectedModules?.itemList?.length === 0 ||
+      canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE).length === 0
+    ) {
+      resetModuleStatistics()
+      return
+    }
     const tempHeader = [
       { name: getMessage('simulator.table.sub1'), prop: 'name' },
       { name: getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.circuit'), prop: 'circuit' },

src/hooks/usePlan.js

@@ -282,12 +282,6 @@ export function usePlan(params = {}) {
         /** 리코일 세팅 */
         setModuleSelectionDataStore(copyData)
         if (copyData.module) setSelectedModules(copyData.module)
-        const roofSurfaceList = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
-        const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
-        roofSurfaceList.forEach((surface) => {
-          surface.modules = modules.filter((module) => module.surfaceId === surface.id)
-        })
-
         setSelectedMenu(currentSelectedMenu)
       } else {
         setSelectedMenu('placement')