Merge branch 'dev' into dev-yj

src/components/floor-plan/CanvasMenu.jsx

@@ -68,7 +68,7 @@ export default function CanvasMenu(props) {
   const { handleZoomClear, handleZoom } = useCanvasEvent()
   const { handleMenu } = useMenu()
   // const urlParams = useSearchParams()
-  const { handleEstimateSubmit, fetchSetting } = useEstimateController()
+  const { handleEstimateSubmit, fetchSetting, estimateContextState, setEstimateContextState } = useEstimateController()
   const estimateRecoilState = useRecoilValue(estimateState)
   const [estimatePopupOpen, setEstimatePopupOpen] = useState(false)
   const [estimateCopyPopupOpen, setEstimateCopyPopupOpen] = useState(false)
@@ -424,8 +424,8 @@ export default function CanvasMenu(props) {
   }
 
   useEffect(() => {
-    if (isObjectNotEmpty(estimateRecoilState)) {
+    if (isObjectNotEmpty(estimateContextState)) {
-      const { createUser, tempFlg, lockFlg } = estimateRecoilState
+      const { createUser, tempFlg, lockFlg } = estimateContextState
 
       if (createUser && tempFlg && lockFlg) {
         if (createUser === 'T01') {
@@ -439,7 +439,7 @@ export default function CanvasMenu(props) {
         }
       }
     }
-  }, [estimateRecoilState])
+  }, [estimateContextState?.createUser, estimateContextState?.tempFlg, estimateContextState?.lockFlg])
 
   const setAllButtonStyles = (style) => {
     setButtonStyle1(style)
@@ -464,70 +464,6 @@ export default function CanvasMenu(props) {
     }
   }
 
-  // useEffect(() => {
-  //   if (isObjectNotEmpty(estimateRecoilState)) {
-  //     if (estimateRecoilState?.createUser && estimateRecoilState?.tempFlg && estimateRecoilState.lockFlg) {
-  //       if (estimateRecoilState?.createUser === 'T01') {
-  //         if (sessionState.storeId !== 'T01') {
-  //           setButtonStyle1('none')
-  //           setButtonStyle2('none')
-  //           setButtonStyle3('none')
-  //           setButtonStyle4('none')
-  //           setButtonStyle5('none')
-  //         } else {
-  //           if (estimateRecoilState?.tempFlg === '1') {
-  //             setButtonStyle1('none')
-  //             setButtonStyle2('')
-  //             setButtonStyle3('none')
-  //             setButtonStyle4('none')
-  //             setButtonStyle5('none')
-  //           } else {
-  //             if (estimateRecoilState?.tempFlg === '0' && estimateRecoilState?.lockFlg === '0') {
-  //               setButtonStyle1('')
-  //               setButtonStyle2('')
-  //               setButtonStyle3('')
-  //               setButtonStyle4('')
-  //               setButtonStyle5('')
-  //             } else {
-  //               setButtonStyle1('')
-  //               setButtonStyle2('none')
-  //               setButtonStyle3('none')
-  //               setButtonStyle4('')
-  //               setButtonStyle5('')
-  //             }
-  //           }
-  //         }
-  //       } else {
-  //         if (isObjectNotEmpty(estimateRecoilState)) {
-  //           if (estimateRecoilState?.tempFlg && estimateRecoilState.lockFlg) {
-  //             if (estimateRecoilState?.tempFlg === '1') {
-  //               setButtonStyle1('none')
-  //               setButtonStyle2('')
-  //               setButtonStyle3('none')
-  //               setButtonStyle4('none')
-  //               setButtonStyle5('none')
-  //             } else {
-  //               if (estimateRecoilState?.tempFlg === '0' && estimateRecoilState?.lockFlg === '0') {
-  //                 setButtonStyle1('')
-  //                 setButtonStyle2('')
-  //                 setButtonStyle3('')
-  //                 setButtonStyle4('')
-  //                 setButtonStyle5('')
-  //               } else {
-  //                 setButtonStyle1('')
-  //                 setButtonStyle2('none')
-  //                 setButtonStyle3('none')
-  //                 setButtonStyle4('')
-  //                 setButtonStyle5('')
-  //               }
-  //             }
-  //           }
-  //         }
-  //       }
-  //     }
-  //   }
-  // }, [estimateRecoilState])
-
   /**
    * 견적서 잠금 / 해제
    * lockFlg : 0 잠금해제상태 / 1 잠금상태
@@ -558,43 +494,14 @@ export default function CanvasMenu(props) {
                   if (sessionState.storeId !== 'T01') {
                     setAllButtonStyles('none')
                   } else {
-                    handleButtonStyles(tempFlg, lockFlg)
+                    setEstimateContextState({ tempFlg: estimateRecoilState.tempFlg, lockFlg: estimateRecoilState.lockFlg })
+                    handleButtonStyles(estimateRecoilState.tempFlg, estimateRecoilState.lockFlg)
                   }
                 } else {
-                  handleButtonStyles(tempFlg, lockFlg)
+                  setEstimateContextState({ tempFlg: estimateRecoilState.tempFlg, lockFlg: estimateRecoilState.lockFlg })
+                  handleButtonStyles(estimateRecoilState.tempFlg, estimateRecoilState.lockFlg)
                 }
               }
-              // if (estimateRecoilState?.createUser === 'T01') {
-              //   if (sessionState.storeId !== 'T01') {
-              //     setButtonStyle1('none')
-              //     setButtonStyle2('none')
-              //     setButtonStyle3('none')
-              //     setButtonStyle4('none')
-              //     setButtonStyle5('none')
-              //   }
-              // } else {
-              //   if (estimateRecoilState?.tempFlg === '1') {
-              //     setButtonStyle1('none')
-              //     setButtonStyle2('')
-              //     setButtonStyle3('none')
-              //     setButtonStyle4('none')
-              //     setButtonStyle5('none')
-              //   } else {
-              //     if (estimateRecoilState?.tempFlg === '0' && estimateRecoilState?.lockFlg === '0') {
-              //       setButtonStyle1('')
-              //       setButtonStyle2('')
-              //       setButtonStyle3('')
-              //       setButtonStyle4('')
-              //       setButtonStyle5('')
-              //     } else {
-              //       setButtonStyle1('')
-              //       setButtonStyle2('none')
-              //       setButtonStyle3('none')
-              //       setButtonStyle4('')
-              //       setButtonStyle5('')
-              //     }
-              //   }
-              // }
             }
             setIsGlobalLoading(false)
           })

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

@@ -79,8 +79,7 @@ export default function StepUp(props) {
 
       // 회로 구성 가능 여부 체크 통과 시 승압설정 정보 조회
       getPcsVoltageStepUpList(params).then((res) => {
-        if (res.result.resultCode === 'S') {
+        if (res?.result.resultCode === 'S' && res?.data) {
-          if (res?.result.code === 200 && res?.data) {
           const dataArray = Array.isArray(res.data) ? res.data : [res.data]
           const stepUpListData = formatStepUpListData(dataArray)
 
@@ -140,11 +139,11 @@ export default function StepUp(props) {
 
           canvas.renderAll()
         } else {
-            swalFire({
+          swalFire({ text: getMessage('common.message.send.error') })
-              title: res.result.resultMsg,
+          // swalFire({
-              type: 'alert',
+          //   title: res.result.resultMsg,
-            })
+          //   type: 'alert',
-          }
+          // })
         }
       })
     } catch (error) {
@@ -381,7 +380,7 @@ export default function StepUp(props) {
         //const res = await getPcsVoltageStepUpList(params)
         //getPcsManualConfChk(params).then((res) => {
         getPcsVoltageStepUpList(params).then((res) => {
-          if (res?.result.code === 200 && res?.data) {
+          if (res?.result.resultCode === 'S' && res?.data) {
             const dataArray = Array.isArray(res.data) ? res.data : [res.data]
             const stepUpListData = formatStepUpListData(dataArray)
 
@@ -392,6 +391,12 @@ export default function StepUp(props) {
             const formattedOptCodes = formatOptionCodes(res.data.optionList)
             setOptCodes(formattedOptCodes)
             setSeletedOption(formattedOptCodes[0])
+          } else {
+            swalFire({ text: getMessage('common.message.send.error') })
+            // swalFire({
+            //   title: res.result.resultMsg,
+            //   type: 'alert',
+            // })
           }
         })
       }

src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx

@@ -55,31 +55,53 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
     { id: 'ra05', name: 'roofAngleSet', value: 'flat', message: 'modal.placement.initial.setting.roof.angle' },
   ]
 
-  // 데이터를 최초 한 번만 조회
+  const defaultRoofSettings = {
-  // useEffect(() => {
+    roofSizeSet: '1', // 기본 치수 입력 방법
-  //   if (!basicSetting || !currentRoof || Object.keys(currentRoof).length === 0 || Object.keys(basicSetting).length === 0) return
+    roofAngleSet: 'slope', // 기본 지붕 각도 설정
-  //   const raftCodeList = findCommonCode('203800')
+    angle: 21.8,
-  //   setRaftCodes(raftCodeList)
+    hajebichi: '',
-  //   console.log('🚀 ~ useEffect ~ >>>>>>>>>>>>> raftCodeList 11 :', raftCodeList)
+    id: 'ROOF_ID_WA_53A',
-
+    index: 0,
-  //   if (addedRoofs[0].roofAngleSet && addedRoofs[0].roofAngleSet?.length > 0) {
+    layout: ROOF_MATERIAL_LAYOUT.PARALLEL,
-  //     setCurrentRoof({ ...currentRoof, roofSizeSet: String(addedRoofs[0].roofSizeSet), roofAngleSet: addedRoofs[0].roofAngleSet })
+    lenAuth: 'R',
-  //   } else if (basicSetting.roofAngleSet && basicSetting.roofAngleSet?.length > 0) {
+    lenBase: '235.000',
-  //     setCurrentRoof({ ...currentRoof, roofSizeSet: String(basicSetting.roofSizeSet), roofAngleSet: basicSetting.roofAngleSet })
+    length: '235',
-  //   }
+    name: '일본기와 A',
-  // }, [])
+    nameJp: '和瓦A',
+    pitch: 4,
+    raft: '',
+    raftAuth: 'C',
+    raftBaseCd: 'HEI_455',
+    roofAngleSet: 'slope',
+    roofCd: '',
+    roofMatlCd: 'ROOF_ID_WA_53A',
+    roofMatlNm: '일본기와 A',
+    roofMatlNmJp: '和瓦A',
+    roofPchAuth: null,
+    roofPchBase: null,
+    roofSizeSet: '1',
+    selected: true,
+    widAuth: 'R',
+    widBase: '265.000',
+    width: '265',
+  }
 
   useEffect(() => {
     if (addedRoofs.length > 0) {
       const raftCodeList = findCommonCode('203800')
       setRaftCodes(raftCodeList)
 
+      // 데이터 설정 확인 후 데이터가 없으면 기본 데이터 설정
+      if (addedRoofs.length > 0) {
         setCurrentRoof({ ...addedRoofs[0] })
+      } else {
+        setCurrentRoof(defaultRoofSettings)
+      }
     }
   }, [addedRoofs])
 
   useEffect(() => {
-    console.log('🚀 ~ fetchBasicSettings ~ currentRoof :', currentRoof)
+    //console.log('🚀 ~ fetchBasicSettings ~ currentRoof :', currentRoof)
     if (!currentRoof) return
     setBasicSettings({
       ...basicSetting,
@@ -152,30 +174,14 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
       },
     })
 
-    setBasicSettings({
+    // 배치면초기설정 저장
+    basicSettingSave({
       ...basicSetting,
       selectedRoofMaterial: {
         // 선택된 지붕재 정보
-        ...roofInfo,
+        roofInfo,
       },
-      //roofs: addedRoofs,
-      // roofsData: {
-      //   roofApply: true,
-      //   roofSeq: 0,
-      //   roofMatlCd: currentRoof.roofMatlCd,
-      //   roofWidth: currentRoof.width,
-      //   roofHeight: currentRoof.length,
-      //   roofHajebichi: currentRoof.hajebichi,
-      //   roofGap: currentRoof.raft,
-      //   roofLayout: currentRoof.layout,
-      //   roofSizeSet: currentRoof.roofSizeSet,
-      //   roofAngleSet: currentRoof.roofAngleSet,
-      //   roofPitch: currentRoof.pitch,
-      //   roofAngle: currentRoof.angle,
-      // },
     })
-
-    basicSettingSave()
   }
 
   return (

src/components/management/StuffDetail.jsx

@@ -1685,11 +1685,6 @@ export default function StuffDetail() {
                     {getMessage('stuff.detail.btn.save')}
                   </Button>
                 )}
-                {/* <Link href="/management/stuff" scroll={false}>
-                  <button type="button" className="btn-origin grey">
-                    {getMessage('stuff.detail.btn.moveList')}
-                  </button>
-                </Link> */}
                 <button
                   type="button"
                   className="btn-origin grey"
@@ -2198,11 +2193,6 @@ export default function StuffDetail() {
                   {getMessage('stuff.detail.btn.save')}
                 </Button>
               )}
-              {/* <Link href="/management/stuff" scroll={false}>
-                <button type="button" className="btn-origin grey">
-                  {getMessage('stuff.detail.btn.moveList')}
-                </button>
-              </Link> */}
               <button
                 type="button"
                 className="btn-origin grey"
@@ -2227,11 +2217,6 @@ export default function StuffDetail() {
                 {managementState?.tempFlg === '0' ? (
                   <>
                     <div className="left-unit-box">
-                      {/* <Link href="/management/stuff" scroll={false}>
-                        <button type="button" className="btn-origin grey mr5">
-                          {getMessage('stuff.detail.btn.moveList')}
-                        </button>
-                      </Link> */}
                       <button
                         type="button"
                         className="btn-origin grey mr5"
@@ -2262,11 +2247,6 @@ export default function StuffDetail() {
                           {getMessage('stuff.detail.btn.save')}
                         </Button>
                       )}
-                      {/* <Link href="/management/stuff" scroll={false}>
-                        <button type="button" className="btn-origin grey">
-                          {getMessage('stuff.detail.btn.moveList')}
-                        </button>
-                      </Link> */}
                       <button
                         type="button"
                         className="btn-origin grey"
@@ -2832,11 +2812,6 @@ export default function StuffDetail() {
                   </div>
                   {/* 진짜R 플랜끝 */}
                   <div className="sub-right-footer">
-                    {/* <Link href="/management/stuff" scroll={false}>
-                      <button type="button" className="btn-origin grey mr5">
-                        {getMessage('stuff.detail.btn.moveList')}
-                      </button>
-                    </Link> */}
                     <button
                       type="button"
                       className="btn-origin grey mr5"
@@ -2867,11 +2842,6 @@ export default function StuffDetail() {
                         {getMessage('stuff.detail.btn.save')}
                       </Button>
                     )}
-                    {/* <Link href="/management/stuff" scroll={false}>
-                      <button type="button" className="btn-origin grey">
-                        {getMessage('stuff.detail.btn.moveList')}
-                      </button>
-                    </Link> */}
                     <button
                       type="button"
                       className="btn-origin grey"

src/components/management/StuffSearchCondition.jsx

@@ -725,6 +725,7 @@ export default function StuffSearchCondition() {
 
         setSchSelSaleStoreId('')
         setOtherSaleStoreId('')
+        stuffSearch.code = 'S'
       } else if (stuffSearch.code === 'S') {
         setObjectNo('')
         setSaleStoreName('')
@@ -802,6 +803,7 @@ export default function StuffSearchCondition() {
         stuffSearch.schSortType = 'U'
         stuffSearch.pageNo = 1
         stuffSearch.pageSize = 100
+        stuffSearch.code = 'S'
       } else {
         setStartDate(stuffSearch?.schFromDt ? stuffSearch.schFromDt : dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'))
         setEndDate(stuffSearch?.schToDt ? stuffSearch.schToDt : dayjs(new Date()).format('YYYY-MM-DD'))

src/hooks/module/useTrestle.js

@@ -10,6 +10,8 @@ import { useSwal } from '@/hooks/useSwal'
 import { useContext } from 'react'
 import { QcastContext } from '@/app/QcastProvider'
 
+// 모듈간 같은 행, 열의 마진이 10 이하인 경우는 같은 행, 열로 간주
+const MODULE_MARGIN = 10
 // 회로 및 가대설정
 export const useTrestle = () => {
   const canvas = useRecoilValue(canvasState)
@@ -695,7 +697,7 @@ export const useTrestle = () => {
 
       return {
         roofSurfaceId: surface.id,
-        roofSurface: directionText.replace(/[^0-9]/g, ''),
+        roofSurface: directionText.replace(/[0-9]/g, ''),
         roofMaterialId: roofMaterial.roofMatlCd,
         supportMethodId,
         constructSpecification,
@@ -747,8 +749,8 @@ export const useTrestle = () => {
     let width = widthArr.reduce((acc, num) => acc + num, 0) / widthArr.length + horizontal
     let height = heightArr.reduce((acc, num) => acc + num, 0) / heightArr.length + vertical
 
-    let maxX = 2 + (horizontal / 10) * 3
+    let maxX = MODULE_MARGIN
-    let maxY = 2 + (vertical / 10) * 3
+    let maxY = MODULE_MARGIN
 
     let result
     switch (direction) {
@@ -795,8 +797,8 @@ export const useTrestle = () => {
 
     let result
     let topLeftPoint
-    let maxX = 2 + (horizontal / 10) * 3
+    let maxX = MODULE_MARGIN
-    let maxY = 2 + (vertical / 10) * 3
+    let maxY = MODULE_MARGIN
 
     switch (direction) {
       case 'south': {
@@ -805,7 +807,9 @@ export const useTrestle = () => {
         heightArr.forEach((h) => {
           topLeftPoint = { x: x - width / 2, y: y - h }
           if (result) return
-          result = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - topLeftPoint.x) < maxX && Math.abs(centerPoint.y - topLeftPoint.y))
+          result = centerPoints.find(
+            (centerPoint) => Math.abs(centerPoint.x - topLeftPoint.x) < maxX && Math.abs(centerPoint.y - topLeftPoint.y) < maxY,
+          )
         })
 
         break
@@ -816,7 +820,9 @@ export const useTrestle = () => {
         heightArr.forEach((h) => {
           topLeftPoint = { x: x + width / 2, y: y + h }
           if (result) return
-          result = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - topLeftPoint.x) < maxX && Math.abs(centerPoint.y - topLeftPoint.y))
+          result = centerPoints.find(
+            (centerPoint) => Math.abs(centerPoint.x - topLeftPoint.x) < maxX && Math.abs(centerPoint.y - topLeftPoint.y) < maxY,
+          )
         })
         break
       }
@@ -854,15 +860,17 @@ export const useTrestle = () => {
     let result
     let topRightPoint
 
-    let maxX = 2 + (horizontal / 10) * 3
+    let maxX = MODULE_MARGIN
-    let maxY = 2 + (vertical / 10) * 3
+    let maxY = MODULE_MARGIN
 
     switch (direction) {
       case 'south': {
         heightArr.forEach((h) => {
           topRightPoint = { x: x + width / 2, y: y - h }
           if (result) return
-          result = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - topRightPoint.x) < maxX && Math.abs(centerPoint.y - topRightPoint.y))
+          result = centerPoints.find(
+            (centerPoint) => Math.abs(centerPoint.x - topRightPoint.x) < maxX && Math.abs(centerPoint.y - topRightPoint.y) < maxY,
+          )
         })
 
         break
@@ -871,7 +879,9 @@ export const useTrestle = () => {
         heightArr.forEach((h) => {
           topRightPoint = { x: x - width / 2, y: y + h }
           if (result) return
-          result = centerPoints.find((centerPoint) => Math.abs(centerPoint.x - topRightPoint.x) < maxX && Math.abs(centerPoint.y - topRightPoint.y))
+          result = centerPoints.find(
+            (centerPoint) => Math.abs(centerPoint.x - topRightPoint.x) < maxX && Math.abs(centerPoint.y - topRightPoint.y) < maxY,
+          )
         })
         break
       }
@@ -1677,8 +1687,8 @@ export const useTrestle = () => {
 
     const vertical = ['south', 'north'].includes(direction) ? moduleSurface.trestleDetail.moduleIntvlVer : moduleSurface.trestleDetail.moduleIntvlHor
 
-    const maxX = 2 + (horizontal / 10) * 3
+    const maxX = MODULE_MARGIN
-    const maxY = 2 + (vertical / 10) * 3
+    const maxY = MODULE_MARGIN
 
     if (centerPoints.length === 0) return
 
@@ -2381,8 +2391,8 @@ export const useTrestle = () => {
     const horizontal = ['south', 'north'].includes(direction) ? moduleIntvlHor : moduleIntvlVer
 
     const vertical = ['south', 'north'].includes(direction) ? moduleIntvlVer : moduleIntvlHor
-    const maxX = 2 + (horizontal / 10) * 3
+    const maxX = MODULE_MARGIN
-    const maxY = 2 + (vertical / 10) * 3
+    const maxY = MODULE_MARGIN
     let { widthArr, heightArr } = centerPoints[0]
     let width = widthArr.reduce((acc, num) => acc + num, 0) / widthArr.length
     let height = heightArr.reduce((acc, num) => acc + num, 0) / heightArr.length

src/hooks/option/useCanvasSetting.js

@@ -134,11 +134,11 @@ export function useCanvasSetting() {
     { id: 4, name: '1/10', value: 1 / 10 },
   ]
 
-  const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector)
+  const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector) // 선택된 지붕재 정보
-
+  const { floorPlanState } = useContext(FloorPlanContext) // 플랜 상태
-  const { floorPlanState } = useContext(FloorPlanContext)
+  const { closeAll } = usePopup() // 팝업 닫기
-
+  const previousObjectNoRef = useRef(null) // 최초 데이터 설정 확인
-  const { closeAll } = usePopup()
+  const previousRoofMaterialsRef = useRef(null) // 최초 데이터 설정 확인
 
   useEffect(() => {
     const tempFetchRoofMaterials = !fetchRoofMaterials
@@ -150,42 +150,6 @@ export function useCanvasSetting() {
     }
   }, [])
 
-  //지붕재 초기세팅
-  const addRoofMaterials = async () => {
-    if (roofMaterials.length !== 0) {
-      return
-    }
-    const { data } = await getRoofMaterialList()
-
-    const roofLists = data.map((item, idx) => ({
-      ...item,
-      id: item.roofMatlCd,
-      name: item.roofMatlNm,
-      selected: idx === 0,
-      index: idx,
-      nameJp: item.roofMatlNmJp,
-      length: item.lenBase && parseInt(item.lenBase),
-      width: item.widBase && parseInt(item.widBase),
-      raft: item.raftBase && parseInt(item.raftBase),
-      layout: ['ROOF_ID_SLATE', 'ROOF_ID_SINGLE'].includes(item.roofMatlCd) ? ROOF_MATERIAL_LAYOUT.STAIRS : ROOF_MATERIAL_LAYOUT.PARALLEL,
-      hajebichi: item.roofPchBase && parseInt(item.roofPchBase),
-      pitch: item.pitch ? parseInt(item.pitch) : 4,
-      angle: item.angle ? parseInt(item.angle) : 21.8,
-    }))
-    setRoofMaterials(roofLists)
-    const selectedRoofMaterial = roofLists[0]
-
-    if (addedRoofs.length === 0) {
-      const newAddedRoofs = []
-      newAddedRoofs.push({ ...selectedRoofMaterial, selected: true, index: 0 })
-      setAddedRoofs(newAddedRoofs)
-    }
-    setBasicSettings({ ...basicSetting, selectedRoofMaterial: selectedRoofMaterial })
-  }
-
-  const previousObjectNoRef = useRef(null)
-  const previousRoofMaterialsRef = useRef(null)
-
   useEffect(() => {
     // 지붕재 select 정보가 존재해야 배치면초기설정 DB 정보 비교 후 지붕재 정보를 가져올 수 있음
     if (
@@ -253,6 +217,39 @@ export function useCanvasSetting() {
     if (settingsDataSave !== undefined) onClickOption2()
   }, [settingsData])
 
+  //지붕재 초기세팅
+  const addRoofMaterials = async () => {
+    if (roofMaterials.length !== 0) {
+      return
+    }
+    const { data } = await getRoofMaterialList()
+
+    const roofLists = data.map((item, idx) => ({
+      ...item,
+      id: item.roofMatlCd,
+      name: item.roofMatlNm,
+      selected: idx === 0,
+      index: idx,
+      nameJp: item.roofMatlNmJp,
+      length: item.lenBase && parseInt(item.lenBase),
+      width: item.widBase && parseInt(item.widBase),
+      raft: item.raftBase && parseInt(item.raftBase),
+      layout: ['ROOF_ID_SLATE', 'ROOF_ID_SINGLE'].includes(item.roofMatlCd) ? ROOF_MATERIAL_LAYOUT.STAIRS : ROOF_MATERIAL_LAYOUT.PARALLEL,
+      hajebichi: item.roofPchBase && parseInt(item.roofPchBase),
+      pitch: item.pitch ? parseInt(item.pitch) : 4,
+      angle: item.angle ? parseInt(item.angle) : 21.8,
+    }))
+    setRoofMaterials(roofLists)
+    const selectedRoofMaterial = roofLists[0]
+
+    if (addedRoofs.length === 0) {
+      const newAddedRoofs = []
+      newAddedRoofs.push({ ...selectedRoofMaterial, selected: true, index: 0 })
+      setAddedRoofs(newAddedRoofs)
+    }
+    setBasicSettings({ ...basicSetting, selectedRoofMaterial: selectedRoofMaterial })
+  }
+
   const getFonts = (itemValue) => {
     if (!itemValue) return { id: 1, name: 'MS PGothic', value: 'MS PGothic' }
     const data = [
@@ -414,55 +411,50 @@ export function useCanvasSetting() {
       console.error('Data fetching error:', error)
     }
 
-    // if (!(Object.keys(canvasSetting).length === 0 && canvasSetting.constructor === Object)) {
-    //   setBasicSettings({ ...canvasSetting })
-    // }
     setCanvasSetting({ ...basicSetting })
   }
 
   // 기본설정(PlacementShapeSetting) 저장
-  const basicSettingSave = async () => {
+  const basicSettingSave = async (params) => {
     try {
       const patternData = {
         objectNo: correntObjectNo,
-        roofSizeSet: Number(basicSetting.roofSizeSet),
+        roofSizeSet: Number(params.roofSizeSet),
-        roofAngleSet: basicSetting.roofAngleSet,
+        roofAngleSet: params.roofAngleSet,
         roofMaterialsAddList: [
           {
             roofApply: true,
             roofSeq: 0,
             roofMatlCd:
-              basicSetting.roofsData.roofMatlCd === null || basicSetting.roofsData.roofMatlCd === undefined
+              params.roofsData.roofMatlCd === null || params.roofsData.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : params.roofsData.roofMatlCd,
-                ? 'ROOF_ID_WA_53A'
+            roofWidth: params.roofsData.roofWidth === null || params.roofsData.roofWidth === undefined ? 0 : params.roofsData.roofWidth,
-                : basicSetting.roofsData.roofMatlCd,
+            roofHeight: params.roofsData.roofHeight === null || params.roofsData.roofHeight === undefined ? 0 : params.roofsData.roofHeight,
-            roofWidth:
-              basicSetting.roofsData.roofWidth === null || basicSetting.roofsData.roofWidth === undefined ? 0 : basicSetting.roofsData.roofWidth,
-            roofHeight:
-              basicSetting.roofsData.roofHeight === null || basicSetting.roofsData.roofHeight === undefined ? 0 : basicSetting.roofsData.roofHeight,
             roofHajebichi:
-              basicSetting.roofsData.roofHajebichi === null || basicSetting.roofsData.roofHajebichi === undefined
+              params.roofsData.roofHajebichi === null || params.roofsData.roofHajebichi === undefined ? 0 : params.roofsData.roofHajebichi,
-                ? 0
+            roofGap: params.roofsData.roofGap === null || params.roofsData.roofGap === undefined ? 'HEI_455' : params.roofsData.roofGap,
-                : basicSetting.roofsData.roofHajebichi,
+            roofLayout: params.roofsData.roofLayout === null || params.roofsData.roofLayout === undefined ? 'P' : params.roofsData.roofLayout,
-            roofGap:
+            roofPitch: params.roofsData.roofPitch === null || params.roofsData.roofPitch === undefined ? 0 : params.roofsData.roofPitch,
-              basicSetting.roofsData.roofGap === null || basicSetting.roofsData.roofGap === undefined ? 'HEI_455' : basicSetting.roofsData.roofGap,
+            roofAngle: params.roofsData.roofAngle === null || params.roofsData.roofAngle === undefined ? 0 : params.roofsData.roofAngle,
-            roofLayout:
-              basicSetting.roofsData.roofLayout === null || basicSetting.roofsData.roofLayout === undefined ? 'P' : basicSetting.roofsData.roofLayout,
-            roofPitch:
-              basicSetting.roofsData.roofPitch === null || basicSetting.roofsData.roofPitch === undefined ? 0 : basicSetting.roofsData.roofPitch,
-            roofAngle:
-              basicSetting.roofsData.roofAngle === null || basicSetting.roofsData.roofAngle === undefined ? 0 : basicSetting.roofsData.roofAngle,
           },
         ],
       }
 
-      // await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => {
+      //await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData })
-      //   swalFire({ text: getMessage(res.returnMessage) })
+      await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => {
-      // })
+        console.log('🚀 ~ basicSettingSave ~ res :', res)
-      await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData })
+
+        swalFire({ text: getMessage(res.returnMessage) })
+
+        setBasicSettings({ ...params })
+      })
 
       //Recoil 설정
       setCanvasSetting({ ...basicSetting })
+
+      // 배치면초기설정 조회
       fetchBasicSettings()
+
+      // 메뉴 설정
       if (['2', '3'].includes(basicSetting?.roofSizeSet)) {
         setMenuNumber(3)
         setType('surface')
@@ -475,10 +467,14 @@ export function useCanvasSetting() {
 
       //모듈 선택 데이터 초기화
       resetModuleSelectionData()
+
+      // 모듈 선택 데이터 초기화
       moduleSelectedDataTrigger({ common: {}, module: {}, roofConstructions: [] })
 
+      // 모듈 선택 데이터 초기화
       const isModuleExist = canvas.getObjects().some((obj) => obj.name === POLYGON_TYPE.MODULE)
       if (!isModuleExist) {
+        // 모듈 선택 데이터 초기화
         resetSelectedModules()
       }
     } catch (error) {
@@ -587,20 +583,16 @@ export function useCanvasSetting() {
         setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: false })
 
         //치수선 설정
-        // setDimensionLineSettings({ ...dimensionLineSettings, ...dimensionLineSettingsState.default })
         resetDimensionLineSettings()
 
         //도면크기 설정
-        // setPlanSizeSettingMode({ ...planSizeSettingMode, ...planSizeSettingState.default })
         resetPlanSizeSettingMode()
 
         // 데이터 설정
-        // setSettingModalFirstOptions({ ...settingModalFirstOptions, ...settingModalFirstOptionsState.default })
         resetSettingModalFirstOptions()
-        //setSettingModalSecondOptions({ ...settingModalSecondOptions, ...settingModalSecondOptionsState.default })
         resetSettingModalSecondOptions()
 
-        // setGlobalFont({ ...globalFont, ...globalFontAtom.default })
+        // 데이터 초기화
         resetGlobalFont()
 
         //점/선 그리드