Merge branch 'qcast-pub' into dev

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

@@ -1,7 +1,6 @@
 import WithDraggable from '@/components/common/draggable/WithDraggable'
 import { useState, useEffect, useContext } from 'react'
 import PowerConditionalSelect from '@/components/floor-plan/modal/circuitTrestle/step/PowerConditionalSelect'
-import CircuitAllocation from '@/components/floor-plan/modal/circuitTrestle/step/CircuitAllocation'
 import StepUp from '@/components/floor-plan/modal/circuitTrestle/step/StepUp'
 import { useMessage } from '@/hooks/useMessage'
 import { usePopup } from '@/hooks/usePopup'

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

@@ -1,25 +0,0 @@
-import AutoCircuitAllocation from '@/components/floor-plan/modal/circuitTrestle/step/type/AutoCircuitAllocation'
-import PassivityCircuitAllocation from '@/components/floor-plan/modal/circuitTrestle/step/type/PassivityCircuitAllocation'
-import { useMessage } from '@/hooks/useMessage'
-
-export default function CircuitAllocation(props) {
-  const { getMessage } = useMessage()
-  const { circuitAllocationType, setCircuitAllocationType } = props
-  return (
-    <>
-      <div className="module-box-tab">
-        <button className={`module-btn ${circuitAllocationType === 1 ? 'act' : ''}`} onClick={() => setCircuitAllocationType(1)}>
-          {getMessage('modal.circuit.trestle.setting.circuit.allocation.auto')}
-        </button>
-        <button className={`module-btn ${circuitAllocationType === 2 ? 'act' : ''}`} onClick={() => setCircuitAllocationType(2)}>
-          {getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity')}
-        </button>
-      </div>
-      <div className="properties-setting-wrap outer">
-        <div className="setting-tit">{getMessage('modal.circuit.trestle.setting.circuit.allocation')}</div>
-        {circuitAllocationType === 1 && <AutoCircuitAllocation />}
-        {circuitAllocationType === 2 && <PassivityCircuitAllocation />}
-      </div>
-    </>
-  )
-}

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

@@ -223,7 +223,7 @@ export default function PowerConditionalSelect(props) {
         <div className="module-table-inner">
           <div className="circuit-check-inner overflow">
             {series?.map((series, index) => (
-              <div className="d-check-box pop sel">
+              <div className="d-check-box pop sel" key={`series-${index}`}>
                 <input type="checkbox" id={`"ch0"${index}`} onChange={() => onCheckSeries(series)} checked={series.selected} />
                 <label htmlFor={`"ch0"${index}`}>{globalLocale === 'ko' ? series.pcsSerNm : series.pcsSerNmJp}</label>
               </div>
@@ -263,8 +263,8 @@ export default function PowerConditionalSelect(props) {
             </button>
           </div>
           <div className="circuit-data-form">
-            {selectedModels?.map((model) => (
+            {selectedModels?.map((model, index) => (
-              <span className="normal-font">
+              <span className="normal-font" key={`model-${index}`}>
                 {model.goodsNo} <button className="del" onClick={() => onRemoveSelectedModel(model)}></button>
               </span>
             ))}

src/components/floor-plan/modal/circuitTrestle/step/type/AutoCircuitAllocation.jsx

@@ -1,17 +0,0 @@
-import { useMessage } from '@/hooks/useMessage'
-
-export default function AutoCircuitAllocation() {
-  const { getMessage } = useMessage()
-  return (
-    <div className="module-table-box">
-      <div className="module-table-inner">
-        <div className="circuit-check-inner">
-          <div className="d-check-radio pop">
-            <input type="radio" name="radio01" id="ra01" checked={true} />
-            <label htmlFor="ra01">{getMessage('modal.circuit.trestle.setting.circuit.allocation.auto')}</label>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}

src/components/floor-plan/modal/circuitTrestle/step/type/PassivityCircuitAllocation.jsx

@@ -271,10 +271,9 @@ export default function PassivityCircuitAllocation(props) {
 
         canvas.renderAll()
         canvas.discardActiveObject()
+        setModuleStatisticsData()
       },
     })
-
-    setModuleStatisticsData()
   }
 
   const initAllPcsCircuitNumber = () => {
@@ -292,12 +291,11 @@ export default function PassivityCircuitAllocation(props) {
           obj.circuit = null
           obj.pcsItemId = null
         })
-        setTargetModules([])
-
         canvas.renderAll()
+        setTargetModules([])
+        setModuleStatisticsData()
       },
     })
-    setModuleStatisticsData()
   }
 
   return (

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

@@ -4,12 +4,13 @@ import { useEffect, useState } from 'react'
 import { useMessage } from '@/hooks/useMessage'
 import WithDraggable from '@/components/common/draggable/WithDraggable'
 import { moduleStatisticsState } from '@/store/circuitTrestleAtom'
-import { useRecoilValue, useResetRecoilState } from 'recoil'
+import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil'
 import { useModule } from '@/hooks/module/useModule'
 import { useEavesGableEdit } from '@/hooks/roofcover/useEavesGableEdit'
 import { canvasState } from '@/store/canvasAtom'
 import { POLYGON_TYPE } from '@/common/common'
 import { useCircuitTrestle } from '@/hooks/useCirCuitTrestle'
+import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
 
 export default function PanelBatchStatistics() {
   const { getMessage } = useMessage()
@@ -21,15 +22,10 @@ export default function PanelBatchStatistics() {
   const canvas = useRecoilValue(canvasState)
   const { header, rows, footer } = useRecoilValue(moduleStatisticsState)
   const { setModuleStatisticsData } = useCircuitTrestle()
+  const [moduleSelectionDataStore, setModuleSelectionDataStore] = useRecoilState(moduleSelectionDataState)
 
   useEffect(() => {
-    const roofSurfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
+    if (moduleSelectionDataStore && moduleSelectionDataStore.module) setModuleStatisticsData()
-    console.log('🚀 ~ useEffect ~ roofSurfaces1:', roofSurfaces)
-    setModuleStatisticsData()
-    console.log(
-      '🚀 ~ useEffect ~ roofSurfaces2:',
-      canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE),
-    )
   }, [])
 
   return (

src/hooks/common/useCanvasPopupStatusController.js

@@ -7,7 +7,8 @@ import { useAxios } from '../useAxios'
 import { unescapeString } from '@/util/common-utils'
 import { moduleSelectionDataState, moduleSelectionTotalState } from '@/store/selectedModuleOptions'
 import { compasDegAtom } from '@/store/orientationAtom'
-import { currentCanvasPlanState } from '@/store/canvasAtom'
+import { canvasState, currentCanvasPlanState } from '@/store/canvasAtom'
+import { POLYGON_TYPE } from '@/common/common'
 
 export function useCanvasPopupStatusController(param = 1) {
   const popupType = parseInt(param)
@@ -15,7 +16,7 @@ export function useCanvasPopupStatusController(param = 1) {
   const [compasDeg, setCompasDeg] = useRecoilState(compasDegAtom)
   const [moduleSelectionDataStore, setModuleSelectionDataStore] = useRecoilState(moduleSelectionDataState)
   const { get, getFetcher, postFetcher } = useAxios()
-
+  const canvas = useRecoilValue(canvasState)
   const currentCanvasPlan = useRecoilValue(currentCanvasPlanState)
   // console.log('🚀 ~ Orientation ~ currentCanvasPlan:', currentCanvasPlan)
 
@@ -52,7 +53,14 @@ export function useCanvasPopupStatusController(param = 1) {
       if (i === 1) {
         setCompasDeg(result.popupStatus)
       } else if (i === 2) {
-        setModuleSelectionDataStore(JSON.parse(unescapeString(result.popupStatus)))
+        const data = JSON.parse(unescapeString(result.popupStatus))
+        setModuleSelectionDataStore(data)
+
+        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)
+        })
       }
     }
   }

src/hooks/useCirCuitTrestle.js

@@ -26,7 +26,6 @@ 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 { getMessage } = useMessage()
@@ -73,10 +72,6 @@ export function useCircuitTrestle() {
   // 지붕면 목록
   const getRoofSurfaceList = () => {
     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)
-    })
     roofSurfaceList.sort((a, b) => a.left - b.left || b.top - a.top)
     return roofSurfaceList
       .map((obj) => {
@@ -183,13 +178,21 @@ export function useCircuitTrestle() {
   const setPowerConditionerData = () => {}
 
   const setModuleStatisticsData = () => {
-    const roofSurfaceList = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
+    // const roofSurfaceList = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
-    const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
+    // const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
-    roofSurfaceList.forEach((surface) => {
+    // roofSurfaceList.forEach((surface) => {
-      surface.modules = modules.filter((module) => module.surfaceId === surface.id)
+    //   surface.modules = modules.filter((module) => module.surfaceId === surface.id)
-    })
+    // })
-    // console.log(moduleSelectionData)
+    // console.log('roofSurfaceList', roofSurfaceList)
-    if (!moduleSelectionData || !moduleSelectionData.module || moduleSelectionData.module?.itemList?.length === 0) return
+    // console.log('modules', modules)
+    console.log('moduleSelectionData', moduleSelectionData)
+    if (
+      !moduleSelectionData ||
+      !moduleSelectionData.module ||
+      Object.keys(moduleSelectionData.module).length === 0 ||
+      moduleSelectionData.module?.itemList?.length === 0
+    )
+      return
     const tempHeader = [
       { name: getMessage('simulator.table.sub1'), prop: 'name' },
       { name: getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.circuit'), prop: 'circuit' },

src/store/selectedModuleOptions.js

@@ -42,7 +42,6 @@ export const moduleSelectionOptionParamsState = atom({
     stdWindSpeed: '',
     stdSnowLd: '',
     inclCd: '',
-    roofMatlCd: '',
   },
   dangerouslyAllowMutability: true,
 })