diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
index 921d5fdb..c54d323f 100644
--- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
+++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
@@ -45,13 +45,13 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
   useEffect(() => {
     const raftCodeList = findCommonCode('203800')
     setRaftCodes(raftCodeList)
+    setCurrentRoof({...currentRoof, roofSizeSet: basicSetting.roofMaterials.roofSizeSet, roofAngleSet: basicSetting.roofMaterials.roofAngleSet})
   }, [])
 
   useEffect(() => {
-    console.log('🚀 ~ useEffect ~ basicSetting:', currentRoof)
       setBasicSettings({
         ...basicSetting,
-        roofSizeSet: currentRoof.roofSizeSet,
+        roofSizeSet:  String(currentRoof.roofSizeSet),
         roofAngleSet: currentRoof.roofAngleSet,
         roofsData: {
           roofApply: true,
@@ -62,6 +62,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
           roofHajebichi: currentRoof.hajebichi,
           roofGap: currentRoof.raft,
           roofLayout: currentRoof.layout,
+          roofPitch: currentRoof.pitch,
+          roofAngle: currentRoof.angle,
         },
       })
   }, [currentRoof])
@@ -77,8 +79,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
   // Function to update the roofType and corresponding values
   const handleRoofTypeChange = (value) => {
     const selectedRoofMaterial = roofMaterials.find((roof) => roof.roofMatlCd === value)
-    console.log('🚀 ~ handleRoofTypeChange ~ selectedRoofMaterial:', selectedRoofMaterial)
-    setCurrentRoof({...selectedRoofMaterial, index: 0, roofSizeSet: currentRoof.roofSizeSet, roofAngleSet: currentRoof.roofAngleSet})
+    setCurrentRoof({...selectedRoofMaterial, index: 0, roofSizeSet: String(currentRoof.roofSizeSet), roofAngleSet: currentRoof.roofAngleSet})
   }
 
   const changeInput = (value, e) => {
@@ -139,6 +140,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
         roofLayout: currentRoof.layout,
         roofSizeSet: currentRoof.roofSizeSet,
         roofAngleSet: currentRoof.roofAngleSet,
+        roofPitch: currentRoof.pitch,
+        roofAngle: currentRoof.angle,
       },
     })
 
@@ -183,7 +186,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                           value="1" // roofSizeSet 값이 '1'인 경우
                           checked={currentRoof.roofSizeSet === '1'} // 선택 여부 확인
                           //onChange={(e) => setBasicSettings({ ...basicSetting, roofSizeSet: e.target.value })} // 상태 업데이트
-                          onClick={() => handleRoofSizeSetChange(1)}
+                          onClick={() => handleRoofSizeSetChange('1')}
                         />
                         <label htmlFor="ra01">{getMessage('modal.placement.initial.setting.size.roof')}</label>
                       </div>
@@ -195,7 +198,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                           value="2" // roofSizeSet 값이 '2'인 경우
                           checked={currentRoof.roofSizeSet === '2'} // 선택 여부 확인
                           //onChange={(e) => setBasicSettings({ ...basicSetting, roofSizeSet: e.target.value })} // 상태 업데이트
-                          onClick={() => handleRoofSizeSetChange(2)}
+                          onClick={() => handleRoofSizeSetChange('2')}
                         />
                         <label htmlFor="ra02">{getMessage('modal.placement.initial.setting.size.actual')}</label>
                       </div>
@@ -207,7 +210,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                           value="3" // roofSizeSet 값이 '3'인 경우
                           checked={currentRoof.roofSizeSet === '3'} // 선택 여부 확인
                           //onChange={(e) => setBasicSettings({ ...basicSetting, roofSizeSet: e.target.value })} // 상태 업데이트
-                          onClick={() => handleRoofSizeSetChange(3)}
+                          onClick={() => handleRoofSizeSetChange('3')}
                         />
                         <label htmlFor="ra03">{getMessage('modal.placement.initial.setting.size.none.pitch')}</label>
                       </div>
@@ -256,17 +259,17 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                     <div className="placement-option">
                       <div className="grid-select no-flx" style={{ width: '171px' }}>
                         <QSelectBox
-                          title={currentRoof.roofSizeSet == 3 ? getMessage('modal.placement.initial.setting.size.none.pitch') : currentRoof.roofMatlNm}
+                          title={currentRoof.roofSizeSet === '3' ? getMessage('modal.placement.initial.setting.size.none.pitch') : currentRoof.roofMatlNm}
                           ref={roofRef.roofCd}
                           options={roofMaterials.map((roof, index) => {
                             return { ...roof, name: globalLocale === 'ko' ? roof.roofMatlNm : roof.roofMatlNmJp }
                           })}
-                          value={currentRoof.roofSizeSet == 3 ? null : currentRoof.roofMatlCd}                          
+                          value={currentRoof.roofSizeSet === '3' ? null : currentRoof.roofMatlCd}                          
                           onChange={(e) => handleRoofTypeChange(e.roofMatlCd)}
                           sourceKey="id"
                           targetKey="id"
                           showKey="name"
-                          disabled={currentRoof.roofSizeSet == 3}
+                          disabled={currentRoof.roofSizeSet === '3'}
                         />
                         {/* <select
                           className="select-light dark"
@@ -298,7 +301,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                               value={parseInt(currentRoof.width)}
                               onChange={(e) => onlyNumberInputChange(e, changeInput)}
                               readOnly={currentRoof.widAuth === 'R'}
-                              disabled={currentRoof.roofSizeSet == 3}
+                              disabled={currentRoof.roofSizeSet === '3'}
                             />
                           </div>
                           {/* <div className="input-grid" style={{ width: '63px' }}>
@@ -323,7 +326,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                               value={parseInt(currentRoof.length)}
                               onChange={(e) => onlyNumberInputChange(e, changeInput)}
                               readOnly={currentRoof.lenAuth === 'R'}
-                              disabled={currentRoof.roofSizeSet == 3}
+                              disabled={currentRoof.roofSizeSet === '3'}
                             />
                           </div>
                           {/* <div className="input-grid" style={{ width: '63px' }}>
@@ -350,7 +353,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                               sourceKey="clCode"
                               targetKey={currentRoof.raft ? 'raft' : 'raftBaseCd'}
                               showKey="clCodeNm"
-                              disabled={currentRoof.roofSizeSet == 3}
+                              disabled={currentRoof.roofSizeSet === '3'}
                             />
                             {/* <select className="select-light dark" name="roofGap" ref={roofRef.rafter}>
                               {raftCodes.map((raft, index) => {
@@ -377,7 +380,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                               value={parseInt(currentRoof.hajebichi)}
                               onChange={(e) => onlyNumberInputChange(e, changeInput)}
                               readOnly={currentRoof.roofPchAuth === 'R'}
-                              disabled={currentRoof.roofSizeSet == 3}
+                              disabled={currentRoof.roofSizeSet === '3'}
                             />
                           </div>
                         </div>
diff --git a/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx b/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
index 91268678..eabe825b 100644
--- a/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
+++ b/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
@@ -119,7 +119,7 @@ export default function RoofAllocationSetting(props) {
                               type="text"
                               className="input-origin block"
                               onChange={(e) => {
-                                handleChangeInput(e, 'pitch', index)
+                                handleChangeInput(e, currentAngleType === 'slope' ? 'pitch' : 'angle', index)
                               }}
                               defaultValue={currentAngleType === 'slope' ? roof.pitch : roof.angle}
                             />
diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js
index dc2488f2..19bb7e8e 100644
--- a/src/hooks/option/useCanvasSetting.js
+++ b/src/hooks/option/useCanvasSetting.js
@@ -282,7 +282,7 @@ export function useCanvasSetting() {
         if (res.length > 0) {
           roofsRow = res.map((item) => {
             return {
-              roofSizeSet: item.roofSizeSet,
+              roofSizeSet: String(item.roofSizeSet),
               roofAngleSet: item.roofAngleSet,
             }
           })
@@ -296,12 +296,14 @@ export function useCanvasSetting() {
               roofHajebichi: item.roofHajebichi,
               roofGap: item.roofGap,
               roofLayout: item.roofLayout,
+              roofPitch: item.roofPitch,
+              roofAngle: item.roofAngle,
             }
           })
         } else {
           roofsRow = [
             {
-              roofSizeSet: 1,
+              roofSizeSet: '1',
               roofAngleSet: 'slope',
             },
           ]
@@ -316,6 +318,7 @@ export function useCanvasSetting() {
               roofHajebichi: 0,
               roofGap: 'HEI_455',
               roofLayout: 'P',
+              roofPitch: 4,
             },
           ]
         }
@@ -333,6 +336,8 @@ export function useCanvasSetting() {
                                       , layout: roofsArray[0].roofLayout
                                       , roofSizeSet: roofsRow[0].roofSizeSet
                                       , roofAngleSet: roofsRow[0].roofAngleSet
+                                      , pitch: roofsArray[0].roofPitch
+                                      , angle: roofsArray[0].roofAngle
                                       })
                                      
             setAddedRoofs(addRoofs)
@@ -359,7 +364,7 @@ export function useCanvasSetting() {
     try {
       const patternData = {
         objectNo: correntObjectNo,
-        roofSizeSet: basicSetting.roofSizeSet,
+        roofSizeSet: Number(basicSetting.roofSizeSet),
         roofAngleSet: basicSetting.roofAngleSet,
         roofMaterialsAddList: [
           {
@@ -371,8 +376,8 @@ export function useCanvasSetting() {
             roofHajebichi: basicSetting.roofsData.roofHajebichi === null || basicSetting.roofsData.roofHajebichi === undefined ? 0 : basicSetting.roofsData.roofHajebichi,
             roofGap: basicSetting.roofsData.roofGap === null || basicSetting.roofsData.roofGap === undefined ? 'HEI_455' : basicSetting.roofsData.roofGap,
             roofLayout: basicSetting.roofsData.roofLayout === null || basicSetting.roofsData.roofLayout === undefined ? 'P' : basicSetting.roofsData.roofLayout,
-            roofPitch: 4,
-            roofAngle: 21.8,
+            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,
           },
         ],
       }
@@ -380,11 +385,12 @@ export function useCanvasSetting() {
       console.log('basicSettingSave patternData ', patternData)
 
       await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => {
+        console.log('basicSettingSave res ', res)
         swalFire({ text: getMessage(res.returnMessage) })
       })
 
       //Recoil 설정
-      setCanvasSetting({ ...basicSetting })
+      //setCanvasSetting({ ...basicSetting })
       fetchBasicSettings()
     } catch (error) {
       swalFire({ text: error.message, icon: 'error' })
diff --git a/src/hooks/roofcover/useRoofAllocationSetting.js b/src/hooks/roofcover/useRoofAllocationSetting.js
index f0884969..2a46f355 100644
--- a/src/hooks/roofcover/useRoofAllocationSetting.js
+++ b/src/hooks/roofcover/useRoofAllocationSetting.js
@@ -33,9 +33,7 @@ export function useRoofAllocationSetting(id) {
   const { drawDirectionArrow, addLengthText, splitPolygonWithLines, splitPolygonWithSeparate } = usePolygon()
   const [popupId, setPopupId] = useState(uuidv4())
   const { addPopup, closePopup, closeAll } = usePopup()
-  const { getMessage } = useMessage()
-  const currentObject = useRecoilValue(currentObjectState)
-  const { swalFire } = useSwal()
+  const currentObject = useRecoilValue(currentObjectState)  
   const { setMenuNumber } = useCanvasMenu()
   const setMenuType = useSetRecoilState(menuTypeState)
   const roofMaterials = useRecoilValue(roofMaterialsSelector)
@@ -46,9 +44,10 @@ export function useRoofAllocationSetting(id) {
   const [editingLines, setEditingLines] = useState([])
   const [currentRoofList, setCurrentRoofList] = useState(roofList)
   const currentAngleType = useRecoilValue(currentAngleTypeSelector)
-
   const globalLocaleState = useRecoilValue(globalLocaleStore)
   const { get, post } = useAxios(globalLocaleState)
+  const { getMessage } = useMessage()
+  const { swalFire } = useSwal()
 
   const { setSurfaceShapePattern } = useRoofFn()
 
@@ -165,38 +164,38 @@ export function useRoofAllocationSetting(id) {
 
   // 지붕면 할당 저장
   const basicSettingSave = async () => {
-    const patternData = {
-      objectNo: correntObjectNo,
-      roofSizeSet: basicSetting.roofSizeSet,
-      roofAngleSet: basicSetting.roofAngleSet,
-      roofMaterialsAddList: currentRoofList.map((item, index) => ({
-        roofApply: item.selected === null || item.selected === undefined ? 'true' : item.selected,
-        roofSeq: index,
-        roofMatlCd: item.roofMatlCd === null || item.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : item.roofMatlCd,
-        roofWidth: item.width === null || item.width === undefined ? 0 : item.width,
-        roofHeight: item.length === null || item.length === undefined ? 0 : item.length,
-        roofHajebichi: item.hajebichi === null || item.hajebichi === undefined ? 0 : item.hajebichi,
-        roofGap: item.raft === null || item.raft === undefined ? 'HEI_455' : item.raft,
-        roofLayout: item.layout === null || item.layout === undefined ? 'P' : item.layout,
-        roofPitch: item.pitch === null || item.pitch === undefined ? 4 : item.pitch,
-        roofAngle: item.angle === null || item.angle === undefined ? 21.8 : item.angle,
-      })),
-    }
+    try {
+      const patternData = {
+        objectNo: correntObjectNo,      
+        roofSizeSet: Number(basicSetting.roofSizeSet),
+        roofAngleSet: basicSetting.roofAngleSet,
+        roofAllocationList: currentRoofList.map((item, index) => ({          
+          roofApply: item.selected === null || item.selected === undefined ? 'true' : item.selected,
+          roofSeq: index,
+          roofMatlCd: item.roofMatlCd === null || item.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : item.roofMatlCd,
+          roofWidth: item.width === null || item.width === undefined ? 0 : Number(item.width),
+          roofHeight: item.length === null || item.length === undefined ? 0 : Number(item.length),
+          roofHajebichi: item.hajebichi === null || item.hajebichi === undefined ? 0 : Number(item.hajebichi),
+          roofGap: item.raft === null || item.raft === undefined ? 'HEI_455' : item.raft,
+          roofLayout: item.layout === null || item.layout === undefined ? 'P' : item.layout,
+          roofPitch: item.pitch === null || item.pitch === undefined ? 4 : Number(item.pitch),
+          roofAngle: item.angle === null || item.angle === undefined ? 21.8 : Number(item.angle),
+        })),
+      }
 
     console.log('🚀 ~ basicSettingSave ~ patternData >>>>>>>>>>>>> :', patternData)
 
-    // HTTP POST 요청 보내기
-    await post({ url: `/api/canvas-management/roof-allocation-settings`, data: patternData })
-      .then((res) => {
-        swalFire({ text: getMessage(res.returnMessage) })
+    await post({ url: `/api/canvas-management/roof-allocation-settings`, data: patternData }).then((res) => {
+    console.log('roof-allocation-settings res ', res)
+      swalFire({ text: getMessage(res.returnMessage) })
+    })
 
-        //Recoil 설정
-        // setCanvasSetting({ ...basicSetting })
-        fetchBasicSettings()
-      })
-      .catch((error) => {
-        swalFire({ text: error.message, icon: 'error' })
-      })
+    //Recoil 설정
+    //setCanvasSetting({ ...basicSetting })
+    fetchBasicSettings()
+  } catch (error) {
+    swalFire({ text: error.message, icon: 'error' })
+  }
   }
 
   const onAddRoofMaterial = () => {
@@ -457,6 +456,7 @@ export function useRoofAllocationSetting(id) {
 
       return
     }
+
     const newRoofList = currentRoofList.map((roof, idx) => {
       if (idx === index) {
         return { ...roof, [type]: value }