가대 상세 조회 로직 추가

src/components/floor-plan/modal/basic/step/Module.jsx

@@ -9,7 +9,7 @@ import ModuleTabContents from './ModuleTabContents'
 import { useDebounceCallback, useDebounceValue } from 'usehooks-ts'
 import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
 
-export default function Module() {
+export default function Module({ setTabNum }) {
   const { getMessage } = useMessage()
   const addedRoofs = useRecoilValue(addedRoofsState) //지붕재 선택
   const [roofTab, setRoofTab] = useState(0) //지붕재 탭
@@ -114,9 +114,9 @@ export default function Module() {
                 </thead>
                 <tbody>
                   {selectedModules.itemList &&
-                    selectedModules.itemList.map((row) => (
+                    selectedModules.itemList.map((row, index) => (
                       <>
-                        <tr>
+                        <tr key={index}>
                           <td>
                             <div className="color-wrap">
                               <span className="color-box" style={{ backgroundColor: row.color }}></span>

src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx

@@ -271,7 +271,6 @@ export default function ModuleTabContents({
 
   useEffect(() => {
     if (isObjectNotEmpty(tempModuleSelectionData)) {
-      console.log('tempModuleSelectionData', tempModuleSelectionData)
       setModuleSelectionData(tempModuleSelectionData)
     }
   }, [tempModuleSelectionData])
@@ -450,7 +449,7 @@ export default function ModuleTabContents({
                   type="checkbox"
                   id={`ch01_${roofTab}`}
                   disabled={cvrYn === 'N' ? true : false}
-                  checked={cvrChecked}
+                  defaultChecked={cvrChecked}
                   onChange={handleCvrChecked}
                 />
                 <label htmlFor={`ch01_${roofTab}`}>{getMessage('modal.module.basic.setting.module.eaves.bar.fitting')}</label>
@@ -460,7 +459,7 @@ export default function ModuleTabContents({
                   type="checkbox"
                   id={`ch02_${roofTab}`}
                   disabled={snowGdPossYn === 'N' ? true : false}
-                  checked={snowGdChecked}
+                  defaultChecked={snowGdChecked}
                   onChange={handleSnowGdChecked}
                 />
                 <label htmlFor={`ch02_${roofTab}`}>{getMessage('modal.module.basic.setting.module.blind.metal.fitting')}</label>

src/components/floor-plan/modal/basic/step/Placement.jsx

@@ -4,17 +4,19 @@ import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
 import { checkedModuleState } from '@/store/canvasAtom'
 import { useRecoilValue, useRecoilState, useSetRecoilState } from 'recoil'
 import { selectedModuleState, moduleSelectionDataState } from '@/store/selectedModuleOptions'
+import { useModulePlace } from '@/hooks/module/useModulePlace'
 
 const Placement = forwardRef((props, refs) => {
   const { getMessage } = useMessage()
-  const selectedModules = useRecoilValue(selectedModuleState)
   const [isChidori, setIsChidori] = useState('false')
   const [setupLocation, setSetupLocation] = useState('center')
   const [isMaxSetup, setIsMaxSetup] = useState('false')
-  const { makeModuleInstArea } = useModuleBasicSetting()
   const [selectedItems, setSelectedItems] = useState({})
-  const setCheckedModules = useSetRecoilState(checkedModuleState)
 
+  const { makeModuleInstArea } = useModuleBasicSetting()
+  const { selectedModules } = useModulePlace()
+
+  const setCheckedModules = useSetRecoilState(checkedModuleState)
   const moduleSelectionData = useRecoilValue(moduleSelectionDataState)
 
   //모듈 배치면 생성
@@ -92,9 +94,9 @@ const Placement = forwardRef((props, refs) => {
                 </thead>
                 <tbody>
                   {selectedModules.itemList &&
-                    selectedModules.itemList.map((item) => (
+                    selectedModules.itemList.map((item, index) => (
                       <>
-                        <tr>
+                        <tr key={index}>
                           <td className="al-c">
                             <div className="d-check-box no-text pop">
                               <input type="checkbox" id={item.itemId} name={item.itemId} onChange={handleSelectedItem} />

src/hooks/common/useMasterController.js

@@ -9,7 +9,7 @@ import { trestleRequest, constructionRequest, trestleDetailRequest } from '@/mod
  * @returns
  */
 export function useMasterController() {
-  const { get } = useAxios()
+  const { get, post } = useAxios()
   const { getMessage } = useMessage()
   const { swalFire } = useSwal()
 
@@ -104,10 +104,8 @@ export function useMasterController() {
    * @returns
    */
   const getTrestleDetailList = async (params) => {
-    const paramString = getQueryString(params)
+    // const paramString = getQueryString(params)
-    console.log('🚀🚀 ~ getTrestleDetailList ~ paramString:', paramString)
+    return await post({ url: '/api/v1/master/getTrestleDetailList', data: params }).then((res) => {
-    return await get({ url: '/api/v1/master/getTrestleDetailList' + paramString }).then((res) => {
-      console.log('🚀🚀 ~ getTrestleDetailList ~ res:', res)
       return res
     })
   }

src/hooks/module/useModulePlace.js

@@ -1,12 +1,50 @@
+import { useEffect, useState } from 'react'
 import { useRecoilState, useRecoilValue } from 'recoil'
-import { useContext, useEffect, useState } from 'react'
+import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions'
-import { GlobalDataContext } from '@/app/GlobalDataProvider'
 import { useMasterController } from '@/hooks/common/useMasterController'
-import { useCommonCode } from '@/hooks/common/useCommonCode'
 
-import { selectedModuleState, moduleSelectionInitParamsState } from '@/store/selectedModuleOptions'
+export function useModulePlace() {
-import { pitchSelector } from '@/store/canvasAtom'
+  const moduleSelectionData = useRecoilValue(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터
+  const [trestleDetailParams, setTrestleDetailParams] = useState([])
+  const [trestleDetailList, setTrestleDetailList] = useState([])
+  const selectedModules = useRecoilValue(selectedModuleState)
+  const { getTrestleDetailList } = useMasterController()
 
-export function useModuleSelection(props) {
+  useEffect(() => {
-  return {}
+    const common = moduleSelectionData.common
+    const roofConstructions = moduleSelectionData.roofConstructions
+
+    const listParams = roofConstructions.map((item) => {
+      return {
+        ...common,
+        moduleTpCd: selectedModules.itemTp,
+        roofMatlCd: item.trestle.roofMatlCd,
+        trestleMkrCd: item.trestle.trestleMkrCd,
+        constMthdCd: item.trestle.constMthdCd,
+        roofBaseCd: item.trestle.roofBaseCd,
+        constTp: item.construction.constTp,
+        mixMatlNo: selectedModules.mixMatlNo,
+        roofPitch: selectedModules.roofPchBase ? selectedModules.roofPchBase : null,
+        inclCd: String(item.addRoof.pitch),
+        roofIndex: item.addRoof.roofIndex,
+      }
+    })
+
+    setTrestleDetailParams(listParams)
+  }, [moduleSelectionData])
+
+  useEffect(() => {
+    if (trestleDetailParams.length > 0) {
+      const trestleDetailList = getTrestleDetailList(trestleDetailParams)
+      setTrestleDetailList(trestleDetailList)
+    }
+  }, [trestleDetailParams])
+
+  useEffect(() => {
+    //todo 결과값을 가지고 roofs를 돌아서
+  }, [trestleDetailList])
+
+  return {
+    selectedModules,
+  }
 }