Merge branch 'dev' of ssh://git.jetbrains.space/nalpari/q-cast-iii/qcast-front into qcast-pub

2025-01-20 16:20:17 +09:00 · 2025-01-20 16:20:17 +09:00 · 3f3bb41d43
commit 3f3bb41d43
parent 1219b6546b ffbfc245b7
23 changed files with 567 additions and 243 deletions
--- a/src/app/GlobalDataProvider.js
+++ b/src/app/GlobalDataProvider.js
@ -3,11 +3,12 @@
 import { createContext, useEffect, useState } from 'react'
 import { useLocalStorage } from 'usehooks-ts'

-export const GlobalDataContext = createContext({
-  managementState: {},
-  setManagementState: () => {},
-  managementStateLoaded: null,
-})
+// export const GlobalDataContext = createContext({
+//   managementState: {},
+//   setManagementState: () => {},
+//   managementStateLoaded: null,
+// })
+export const GlobalDataContext = createContext(null)

 const GlobalDataProvider = ({ children }) => {
  const [managementState, setManagementState] = useState(null)
--- a/src/app/floor-plan/FloorPlanProvider.js
+++ b/src/app/floor-plan/FloorPlanProvider.js
@ -27,12 +27,12 @@ const defaultEstimateData = {
 * 모듈,회로 구성 상태 데이터
 * 각 설정 팝업 상태를 저장하는 데이터
 */
-const defaultProcessStep = {
-  gnbStep: 0,
-  processStep: 0,
-  moduleCofigureData: {},
-  pcsConfigureData: {},
-}
+// const defaultProcessStep = {
+//   gnbStep: 0,
+//   processStep: 0,
+//   moduleCofigureData: {},
+//   pcsConfigureData: {},
+// }

 export const FloorPlanContext = createContext({
  floorPlanState: {},
@ -49,12 +49,12 @@ const FloorPlanProvider = ({ children }) => {
  const pid = searchParams.get('pid')

  //useEffect(() => { // 오류 발생으로 useEffect 사용
-    if (pathname === '/floor-plan') {
-      if (pid === undefined || pid === '' || pid === null || objectNo === undefined || objectNo === '' || objectNo === null) {
-        notFound()
-      }
-      setCurrentObjectNo(objectNo)
+  if (pathname === '/floor-plan') {
+    if (pid === undefined || pid === '' || pid === null || objectNo === undefined || objectNo === '' || objectNo === null) {
+      notFound()
    }
+    setCurrentObjectNo(objectNo)
+  }
  //}, [pid, objectNo])

  const [floorPlanState, setFloorPlanState] = useState({
@ -70,12 +70,10 @@ const FloorPlanProvider = ({ children }) => {

  const [estimateContextState, setEstimateContextState] = useReducer(reducer, defaultEstimateData)

-  const [processStepState, setProcessStepState] = useReducer(reducer, defaultProcessStep)
+  // const [processStepState, setProcessStepState] = useReducer(reducer, defaultProcessStep)

  return (
-    <FloorPlanContext.Provider
-      value={{ floorPlanState, setFloorPlanState, estimateContextState, setEstimateContextState, processStepState, setProcessStepState }}
-    >
+    <FloorPlanContext.Provider value={{ floorPlanState, setFloorPlanState, estimateContextState, setEstimateContextState }}>
      {children}
    </FloorPlanContext.Provider>
  )
--- a/src/app/management/ManagementProvider.js
+++ b/src/app/management/ManagementProvider.js
@ -12,7 +12,8 @@ const ManagementProvider = ({ children }) => {
  // }, [managementState])

  // return <ManagementContext.Provider value={{ managementState, setManagementState }}>{children}</ManagementContext.Provider>
-  return <ManagementContext.Provider>{children}</ManagementContext.Provider>
+  // return <ManagementContext.Provider>{children}</ManagementContext.Provider>
+  return <>{children}</>
 }

 export default ManagementProvider
--- a/src/components/Playground.jsx
+++ b/src/components/Playground.jsx
@ -27,6 +27,7 @@ import useSWR from 'swr'
 import useSWRMutation from 'swr/mutation'
 import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController'
 import { canvasPopupStatusStore } from '@/store/canvasPopupStatusAtom'
+import { moduleSelectionDataPlanListState } from '@/store/selectedModuleOptions'

 export default function Playground() {
  const [useCadFile, setUseCadFile] = useRecoilState(useCadFileState)
@ -256,25 +257,25 @@ export default function Playground() {
    })
  }

-  const [callFlag, setCallFlag] = useState(false)
+  // const [callFlag, setCallFlag] = useState(false)
  // const { data: tutoData, error, isLoading } = useSWR('http://localhost:8080/api/tutorial', getFetcher)
-  const { data: tutoData, error, isLoading } = useSWR(callFlag ? 'http://localhost:8080/api/tutorial' : null, getFetcher)
-  const { trigger, isMutating } = useSWRMutation('http://localhost:8080/api/tutorial', postFetcher)
+  // const { data: tutoData, error, isLoading } = useSWR(callFlag ? 'http://localhost:8080/api/tutorial' : null, getFetcher)
+  // const { trigger, isMutating } = useSWRMutation('http://localhost:8080/api/tutorial', postFetcher)

-  if (isLoading) {
-    return <div>Loading...</div>
-  }
+  // if (isLoading) {
+  //   return <div>Loading...</div>
+  // }

-  if (error) {
-    return <div>Error...</div>
-  }
+  // if (error) {
+  //   return <div>Error...</div>
+  // }

-  useCanvasPopupStatusController(1)
+  // const [moduleSelectionDataPlanListStore, setModuleSelectionDataPlanListStore] = useRecoilState(moduleSelectionDataPlanListState)
+  // useEffect(() => {
+  //   console.log('🚀 ~ Playground ~ moduleSelectionDataPlanListStore:', moduleSelectionDataPlanListStore)
+  // }, [moduleSelectionDataPlanListStore])
+  // const { trigger: canvasPopupStatusTrigger } = useCanvasPopupStatusController({ objectNo: 'R201T01241120001', planNo: 2, popupType: 2 })

-  const [canvasPopupStatusState, setCanvasPopupStatusState] = useRecoilState(canvasPopupStatusStore)
-  useEffect(() => {
-    console.log('🚀 ~ Playground ~ canvasPopupStatusState:', canvasPopupStatusState)
-  }, [canvasPopupStatusState])
  return (
    <>
      <div className="container mx-auto p-4 m-4 border">
@ -579,7 +580,7 @@ export default function Playground() {
            Sweetalert - alert
          </Button>
        </div>
-        <div className="my-2">
+        {/* <div className="my-2">
          {tutoData &&
            tutoData.map((item) => (
              <div key={item.id}>
@ -594,6 +595,301 @@ export default function Playground() {
          <Button disabled={isMutating} onClick={() => trigger({ id: 3, name: 'seulda kim', email: 'seulda.kim@interplug.co.kr' })}>
            insert data
          </Button>
+        </div> */}
+        <div className="my-2">
+          <Button
+            onClick={() => {
+              canvasPopupStatusTrigger({
+                common: {
+                  illuminationTp: '3',
+                  instHt: '10',
+                  stdWindSpeed: 'WL_32',
+                  stdSnowLd: '5',
+                  moduleTpCd: 'A1',
+                  moduleItemId: '106796',
+                },
+                roofConstructions: [
+                  {
+                    roofIndex: 0,
+                    addRoof: {
+                      roofMatlCd: 'ROOF_ID_WA_53A',
+                      roofMatlNm: '일본기와 A',
+                      roofMatlNmJp: '和瓦A',
+                      widAuth: 'R',
+                      widBase: '265.000',
+                      lenAuth: 'R',
+                      lenBase: '235.000',
+                      roofPchAuth: null,
+                      roofPchBase: null,
+                      raftAuth: 'C',
+                      raftBaseCd: 'HEI_455',
+                      id: 'ROOF_ID_WA_53A',
+                      name: '일본기와 A',
+                      selected: true,
+                      index: 0,
+                      nameJp: '和瓦A',
+                      length: 235,
+                      width: 265,
+                      raft: 'HEI_455',
+                      layout: 'P',
+                      hajebichi: 0,
+                      pitch: 7,
+                      angle: 21.8,
+                      roofSizeSet: '1',
+                      roofAngleSet: 'slope',
+                    },
+                    trestle: {
+                      moduleTpCd: 'A1',
+                      moduleTpCdNm: 'A1type',
+                      moduleTpCdJp: 'A1type',
+                      roofMatlCd: 'ROOF_ID_WA_53A',
+                      roofMatlCdNm: '일본기와 A',
+                      roofMatlCdJp: '和瓦A',
+                      trestleMkrCd: 'ROOF_TECHRI',
+                      trestleMkrCdNm: '지붕 기술 연구소',
+                      trestleMkrCdJp: '屋根技術研究所',
+                      constMthdCd: 'CST026',
+                      constMthdCdNm: 'YG 앵커 랙 있음',
+                      constMthdCdJp: 'YGアンカー　ラック有り',
+                      roofBaseCd: 'RFB001',
+                      roofBaseCdNm: '구조용 합판 9mm 이상',
+                      roofBaseCdJp: '構造用合板9mm以上',
+                      rackYn: null,
+                      priority: 1,
+                    },
+                    construction: {
+                      constTp: 'WORK_LV_ID_1',
+                      constTpNm: '표준 시공',
+                      constTpJp: '標準施工',
+                      constPossYn: 'Y',
+                      plvrYn: 'Y',
+                      cvrYn: 'Y',
+                      cvrLmtRow: 9999,
+                      snowGdPossYn: 'Y',
+                      roofIndex: 0,
+                      setupCover: true,
+                      setupSnowCover: true,
+                      selectedIndex: 1,
+                    },
+                  },
+                  {
+                    roofIndex: 1,
+                    addRoof: {
+                      roofMatlCd: 'ROOF_ID_WA_53B',
+                      roofMatlNm: '일본기와 B',
+                      roofMatlNmJp: '和瓦B',
+                      widAuth: 'R',
+                      widBase: '275.000',
+                      lenAuth: 'R',
+                      lenBase: '225.000',
+                      roofPchAuth: null,
+                      roofPchBase: null,
+                      raftAuth: 'C',
+                      raftBaseCd: 'HEI_455',
+                      id: 'ROOF_ID_WA_53B',
+                      name: '일본기와 B',
+                      selected: true,
+                      index: 1,
+                      nameJp: '和瓦B',
+                      length: 225,
+                      width: 275,
+                      raft: 'HEI_455',
+                      layout: 'P',
+                      hajebichi: 0,
+                      pitch: 5,
+                      angle: 21.8,
+                      roofSizeSet: '1',
+                      roofAngleSet: 'slope',
+                    },
+                    trestle: {
+                      moduleTpCd: 'A1',
+                      moduleTpCdNm: 'A1type',
+                      moduleTpCdJp: 'A1type',
+                      roofMatlCd: 'ROOF_ID_WA_53B',
+                      roofMatlCdNm: '일본기와 B',
+                      roofMatlCdJp: '和瓦B',
+                      trestleMkrCd: 'DAIDO HUNT',
+                      trestleMkrCdNm: '다이도 헌트',
+                      trestleMkrCdJp: 'ダイドーハント',
+                      constMthdCd: 'CST016',
+                      constMthdCdNm: '지지 기와Ⅱ-B 랙 있음',
+                      constMthdCdJp: '支持瓦Ⅱ-B　ラック有り',
+                      roofBaseCd: 'RFB002',
+                      roofBaseCdNm: 'OSB12mm 이상',
+                      roofBaseCdJp: 'OSB12mm以上',
+                      rackYn: null,
+                      priority: 95,
+                    },
+                    construction: {
+                      constTp: 'WORK_LV_ID_1',
+                      constTpNm: '표준 시공',
+                      constTpJp: '標準施工',
+                      constPossYn: 'Y',
+                      plvrYn: 'Y',
+                      cvrYn: 'Y',
+                      cvrLmtRow: 9999,
+                      snowGdPossYn: 'Y',
+                      roofIndex: 1,
+                      setupCover: false,
+                      setupSnowCover: true,
+                      selectedIndex: 1,
+                    },
+                  },
+                  {
+                    roofIndex: 2,
+                    addRoof: {
+                      roofMatlCd: 'ROOF_ID_HIRA_C',
+                      roofMatlNm: '평판기와 C',
+                      roofMatlNmJp: '平板瓦C',
+                      widAuth: 'R',
+                      widBase: '305.000',
+                      lenAuth: 'R',
+                      lenBase: '280.000',
+                      roofPchAuth: null,
+                      roofPchBase: null,
+                      raftAuth: 'C',
+                      raftBaseCd: 'HEI_455',
+                      id: 'ROOF_ID_HIRA_C',
+                      name: '평판기와 C',
+                      selected: true,
+                      index: 2,
+                      nameJp: '平板瓦C',
+                      length: 280,
+                      width: 305,
+                      raft: 'HEI_455',
+                      layout: 'P',
+                      hajebichi: 0,
+                      pitch: 4,
+                      angle: 21.8,
+                      roofSizeSet: '1',
+                      roofAngleSet: 'slope',
+                    },
+                    trestle: {
+                      moduleTpCd: 'A1',
+                      moduleTpCdNm: 'A1type',
+                      moduleTpCdJp: 'A1type',
+                      roofMatlCd: 'ROOF_ID_HIRA_C',
+                      roofMatlCdNm: '평판기와 C',
+                      roofMatlCdJp: '平板瓦C',
+                      trestleMkrCd: 'ROOF_TECHRI',
+                      trestleMkrCdNm: '지붕 기술 연구소',
+                      trestleMkrCdJp: '屋根技術研究所',
+                      constMthdCd: 'CST034',
+                      constMthdCdNm: '지지 기와 C 랙 있음',
+                      constMthdCdJp: '支持瓦C　ラック有り',
+                      roofBaseCd: 'RFB001',
+                      roofBaseCdNm: '구조용 합판 9mm 이상',
+                      roofBaseCdJp: '構造用合板9mm以上',
+                      rackYn: null,
+                      priority: 122,
+                    },
+                    construction: {
+                      constTp: 'WORK_LV_ID_1',
+                      constTpNm: '표준 시공',
+                      constTpJp: '標準施工',
+                      constPossYn: 'Y',
+                      plvrYn: 'Y',
+                      cvrYn: 'Y',
+                      cvrLmtRow: 9999,
+                      snowGdPossYn: 'Y',
+                      roofIndex: 2,
+                      setupCover: false,
+                      setupSnowCover: false,
+                      selectedIndex: 1,
+                    },
+                  },
+                  {
+                    roofIndex: 3,
+                    addRoof: {
+                      roofMatlCd: 'ROOF_ID_HIRA_D',
+                      roofMatlNm: '평판기와 D',
+                      roofMatlNmJp: '平板瓦D',
+                      widAuth: 'R',
+                      widBase: '305.000',
+                      lenAuth: 'R',
+                      lenBase: '280.000',
+                      roofPchAuth: null,
+                      roofPchBase: null,
+                      raftAuth: 'C',
+                      raftBaseCd: 'HEI_455',
+                      id: 'ROOF_ID_HIRA_D',
+                      name: '평판기와 D',
+                      selected: true,
+                      index: 3,
+                      nameJp: '平板瓦D',
+                      length: 280,
+                      width: 305,
+                      raft: 'HEI_455',
+                      layout: 'P',
+                      hajebichi: 0,
+                      pitch: 8,
+                      angle: 21.8,
+                      roofSizeSet: '1',
+                      roofAngleSet: 'slope',
+                    },
+                    trestle: {
+                      moduleTpCd: 'A1',
+                      moduleTpCdNm: 'A1type',
+                      moduleTpCdJp: 'A1type',
+                      roofMatlCd: 'ROOF_ID_HIRA_D',
+                      roofMatlCdNm: '평판기와 D',
+                      roofMatlCdJp: '平板瓦D',
+                      trestleMkrCd: 'DAIDO HUNT',
+                      trestleMkrCdNm: '다이도 헌트',
+                      trestleMkrCdJp: 'ダイドーハント',
+                      constMthdCd: 'CST018',
+                      constMthdCdNm: '지지 기와Ⅱ-D 랙 있음',
+                      constMthdCdJp: '支持瓦Ⅱ-D　ラック有り',
+                      roofBaseCd: 'RFB002',
+                      roofBaseCdNm: 'OSB12mm 이상',
+                      roofBaseCdJp: 'OSB12mm以上',
+                      rackYn: null,
+                      priority: 203,
+                    },
+                    construction: {
+                      constTp: 'WORK_LV_ID_3',
+                      constTpNm: '강화 시공',
+                      constTpJp: '強化施工',
+                      constPossYn: 'Y',
+                      plvrYn: 'Y',
+                      cvrYn: 'Y',
+                      cvrLmtRow: 9999,
+                      snowGdPossYn: 'Y',
+                      roofIndex: 3,
+                      setupCover: false,
+                      setupSnowCover: false,
+                      selectedIndex: 2,
+                    },
+                  },
+                ],
+                module: {
+                  itemId: '106796',
+                  itemNm: 'Q.TRON M-G2.4+ 430',
+                  goodsNo: 'Q.TRON M-G2.4+ 430',
+                  itemTp: 'A1',
+                  mixMatlNo: null,
+                  mixItemTpYn: 'N',
+                  itemList: [
+                    {
+                      itemId: '106796',
+                      itemNm: 'Q.TRON M-G2.4+ 430',
+                      goodsNo: 'Q.TRON M-G2.4+ 430',
+                      itemTp: 'A1',
+                      color: '#BEF781',
+                      longAxis: '1722.000',
+                      shortAxis: '1134.000',
+                      thickness: '30.000',
+                      wpOut: '430',
+                      mixMatlNo: null,
+                    },
+                  ],
+                  name: 'Q.TRON M-G2.4+ 430',
+                },
+              })
+            }}
+          >
+            Test Data insert
+          </Button>
        </div>
      </div>
    </>
--- a/src/components/common/select/QSelectBox.jsx
+++ b/src/components/common/select/QSelectBox.jsx
@ -59,8 +59,6 @@ export default function QSelectBox({
  const ref = useRef(null)

  const handleClickSelectOption = (option) => {
-    console.log('🚀 ~ handleClickSelectOption ~ option:', option)
-
    setSelected(showKey !== '' ? option[showKey] : option.name)
    onChange?.(option, params)
  }
--- a/src/components/community/ArchiveTable.jsx
+++ b/src/components/community/ArchiveTable.jsx
@ -54,31 +54,6 @@ export default function ArchiveTable({ clsCode }) {
    fetchData()
  }, [search.searchValue, search.searchFlag])

-  // 상세 파일 목록 조회
-  const handleDetailFileListDown = async (noticeNo) => {
-    const url = `/api/board/detail`
-    const params = new URLSearchParams({
-      noticeNo: noticeNo,
-    })
-    const apiUrl = `${url}?${params.toString()}`
-
-    const resultData = await get({ url: apiUrl })
-
-    if (resultData) {
-      if (resultData.result.code === 200) {
-        const boardDetailFileList = resultData.data.listFile
-
-        if (boardDetailFileList && Array.isArray(boardDetailFileList)) {
-          boardDetailFileList.forEach((boardFile) => {
-            handleFileDown(boardFile)
-          })
-        }
-      } else {
-        alert(resultData.result.message)
-      }
-    }
-  }
-
  return (
    <>
      {boardList.length > 0 ? (
@ -101,7 +76,7 @@ export default function ArchiveTable({ clsCode }) {
              </div>
              <div className="file-down-box">
                {/* 첨부파일 */}
-                <button type="button" className="file-down-btn" onClick={() => handleDetailFileListDown(board.noticeNo)}></button>
+                <button type="button" className="file-down-btn" onClick={() => handleFileDown(board.noticeNo, 'Y')}></button>
              </div>
            </div>
          ))}
--- a/src/components/community/Table.jsx
+++ b/src/components/community/Table.jsx
@ -41,6 +41,7 @@ export default function Table({ clsCode }) {
        schTitle: search.searchValue ? search.searchValue : '',
        startRow: startRow,
        endRow: endRow,
+        schMainYn: 'N',
      })
      const apiUrl = `${url}?${params.toString()}`

--- a/src/components/community/modal/BoardDetailModal.jsx
+++ b/src/components/community/modal/BoardDetailModal.jsx
@ -61,7 +61,7 @@ export default function BoardDetailModal({ noticeNo, setOpen }) {
                    <dt>{getMessage('board.sub.fileList')}</dt>
                    {boardDetail.listFile.map((boardFile) => (
                      <dd key={boardFile.encodeFileNo}>
-                        <button type="button" className="down" onClick={() => handleFileDown(boardFile)}>
+                        <button type="button" className="down" onClick={() => handleFileDown(boardFile.fileNo, 'N')}>
                          {boardFile.srcFileNm}
                        </button>
                      </dd>
--- a/src/components/floor-plan/FloorPlan.jsx
+++ b/src/components/floor-plan/FloorPlan.jsx
@ -15,7 +15,7 @@ export default function FloorPlan({ children }) {
  //const [correntObjectNo, setCorrentObjectNo] = useRecoilState(correntObjectNoState)
  const { closeAll } = usePopup()
  const { menuNumber, setMenuNumber } = useCanvasMenu()
-  const { fetchSettings } = useCanvasSetting()
+  const { fetchSettings, fetchBasicSettings } = useCanvasSetting()

  const modalProps = {
    menuNumber,
@ -26,7 +26,8 @@ export default function FloorPlan({ children }) {
    ///setCorrentObjectNo(floorPlanState.objectNo)
    //console.log('FloorPlan objectNo ', floorPlanState.objectNo, correntObjectNo)
    setMenuNumber(1)
-    fetchSettings()
+    fetchSettings() // Canvas 설정 정보 조회
+    fetchBasicSettings() // 기본 설정 정보 조회
    return () => {
      closeAll()
    }
--- a/src/components/floor-plan/modal/basic/step/Module.jsx
+++ b/src/components/floor-plan/modal/basic/step/Module.jsx
@ -1,23 +1,23 @@
 import { useEffect, useState, useReducer } from 'react'
 import { useRecoilValue, useRecoilState } from 'recoil'
 import { addedRoofsState } from '@/store/settingAtom'
-import { canvasSettingState, currentCanvasPlanState, pitchSelector } from '@/store/canvasAtom'
+import { currentCanvasPlanState } from '@/store/canvasAtom'
 import { useMessage } from '@/hooks/useMessage'
 import QSelectBox from '@/components/common/select/QSelectBox'
 import { useModuleSelection } from '@/hooks/module/useModuleSelection'
 import ModuleTabContents from './ModuleTabContents'
-import { useDebounceCallback, useDebounceValue } from 'usehooks-ts'
-import { moduleSelectionDataPlanListState, moduleSelectionDataState } from '@/store/selectedModuleOptions'
+import { useDebounceValue } from 'usehooks-ts'
+import { moduleSelectionDataState } from '@/store/selectedModuleOptions'

 export default function Module({ setTabNum }) {
  const { getMessage } = useMessage()
  const addedRoofs = useRecoilValue(addedRoofsState) //지붕재 선택
  const [roofTab, setRoofTab] = useState(0) //지붕재 탭
+  const currentCanvasPlan = useRecoilValue(currentCanvasPlanState)

  const {
    moduleSelectionInitParams,
    selectedModules,
-    raftCodes,
    roughnessCodes,
    windSpeedCodes,
    managementState,
@ -38,19 +38,13 @@ export default function Module({ setTabNum }) {
  const [debouncedVerticalSnowCover] = useDebounceValue(inputVerticalSnowCover, 500)

  const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터
-  const [moduleSelectionDataPlanList, setModuleSelectionDataPlanList] = useRecoilState(moduleSelectionDataPlanListState)
-
-  const currentCanvasPlan = useRecoilValue(currentCanvasPlanState)
-
  const [tempModuleSelectionData, setTempModuleSelectionData] = useReducer((prevState, nextState) => {
    return { ...prevState, ...nextState }
  }, moduleSelectionData)

  useEffect(() => {
-    if (moduleSelectionDataPlanList) {
-      setModuleSelectionData(moduleSelectionDataPlanList[currentCanvasPlan.id])
-    }
-  }, [])
+    setModuleSelectionData(tempModuleSelectionData)
+  }, [tempModuleSelectionData])

  useEffect(() => {
    handleChangeInstallHeight(debouncedInstallHeight)
@ -60,11 +54,6 @@ export default function Module({ setTabNum }) {
    handleChangeVerticalSnowCover(debouncedVerticalSnowCover)
  }, [debouncedVerticalSnowCover])

-  useEffect(() => {
-    setInputInstallHeight(installHeight)
-    setInputVerticalSnowCover(verticalSnowCover)
-  }, [installHeight, verticalSnowCover])
-
  const moduleData = {
    header: [
      { name: getMessage('module'), width: 150, prop: 'module', type: 'color-box' },
@ -118,20 +107,18 @@ export default function Module({ setTabNum }) {
                  </thead>
                  <tbody>
                    {selectedModules.itemList &&
-                      selectedModules.itemList.map((row) => (
-                        <>
-                          <tr>
-                            <td>
-                              <div className="color-wrap">
-                                <span className="color-box" style={{ backgroundColor: row.color }}></span>
-                                <span className="name">{row.itemNm}</span>
-                              </div>
-                            </td>
-                            <td className="al-r">{Number(row.shortAxis).toFixed(0)}</td>
-                            <td className="al-r">{Number(row.longAxis).toFixed(0)}</td>
-                            <td className="al-r">{Number(row.wpOut).toFixed(0)}</td>
-                          </tr>
-                        </>
+                      selectedModules.itemList.map((row, index) => (
+                        <tr key={index}>
+                          <td>
+                            <div className="color-wrap">
+                              <span className="color-box" style={{ backgroundColor: row.color }}></span>
+                              <span className="name">{row.itemNm}</span>
+                            </div>
+                          </td>
+                          <td className="al-r">{Number(row.shortAxis).toFixed(0)}</td>
+                          <td className="al-r">{Number(row.longAxis).toFixed(0)}</td>
+                          <td className="al-r">{Number(row.wpOut).toFixed(0)}</td>
+                        </tr>
                      ))}
                  </tbody>
                </table>
@ -238,12 +225,8 @@ export default function Module({ setTabNum }) {
                  index={index}
                  addRoof={roof}
                  roofTab={index}
-                  moduleConstructionSelectionData={moduleSelectionData?.roofConstructions[index]}
                  tempModuleSelectionData={tempModuleSelectionData}
                  setTempModuleSelectionData={setTempModuleSelectionData}
-                  selectedModule={selectedModules}
-                  moduleSelectionDataPlanList={moduleSelectionDataPlanList}
-                  setModuleSelectionDataPlanList={setModuleSelectionDataPlanList}
                />
              </div>
            ))}
--- a/src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx
+++ b/src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx
@ -1,23 +1,14 @@
-import { useEffect, useState, useRef } from 'react'
-import { useRecoilValue } from 'recoil'
+import { useEffect, useState, useRef, useReducer } from 'react'
+import { useRecoilValue, useRecoilState } from 'recoil'
 import { currentCanvasPlanState, pitchTextSelector } from '@/store/canvasAtom'
 import { useMessage } from '@/hooks/useMessage'
 import { useMasterController } from '@/hooks/common/useMasterController'
 import { useCommonCode } from '@/hooks/common/useCommonCode'
-import { moduleSelectionInitParamsState } from '@/store/selectedModuleOptions'
+import { moduleSelectionDataState, moduleSelectionInitParamsState, selectedModuleState } from '@/store/selectedModuleOptions'
 import { isObjectNotEmpty } from '@/util/common-utils'
 import QSelectBox from '@/components/common/select/QSelectBox'

-export default function ModuleTabContents({
-  addRoof,
-  roofTab,
-  moduleConstructionSelectionData,
-  tempModuleSelectionData,
-  setTempModuleSelectionData,
-  selectedModule,
-  moduleSelectionDataPlanList,
-  setModuleSelectionDataPlanList,
-}) {
+export default function ModuleTabContents({ addRoof, roofTab, tempModuleSelectionData, setTempModuleSelectionData }) {
  const { getMessage } = useMessage()
  const [roofMaterial, setRoofMaterial] = useState(addRoof) //지붕재`
  const globalPitchText = useRecoilValue(pitchTextSelector) //피치 텍스트
@ -25,6 +16,7 @@ export default function ModuleTabContents({

  const { findCommonCode } = useCommonCode()
  const [raftCodes, setRaftCodes] = useState([]) //가대 목록
+
  const [trestleList, setTrestleList] = useState([])
  const [constMthdList, setConstMthdList] = useState([])
  const [roofBaseList, setRoofBaseList] = useState([])
@ -54,12 +46,19 @@ export default function ModuleTabContents({

  const [isExistData, setIsExistData] = useState(false)

+  const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState) //선택된 모듈
+  const [moduleConstructionSelectionData, setModuleConstructionSelectionData] = useState()
+
+  const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터
+
+  useEffect(() => {
+    setModuleConstructionSelectionData(moduleSelectionData.roofConstructions[roofTab])
+  }, [moduleSelectionData])
+
  //서까래간격 변경
  const handleChangeRaftBase = (option) => {
    setSelectedRaftBase(option)
-    setTrestleParams({ ...trestleParams, raftBaseCd: option.clCode })
-
-    setTrestleList([]) //가대메이커
+    setTrestleParams({ ...trestleParams, raftBaseCd: option.clCode }) //가대메이커
    setConstMthdList([]) //공법 초기화
    setRoofBaseList([]) //지붕밑바탕 초기화
    setConstructionList([]) //공법 초기화
@ -78,6 +77,7 @@ export default function ModuleTabContents({
  const handleChangeConstMthd = (option) => {
    setSelectedConstMthd(option) //선택된값 저장
    setRoofBaseParams({ ...trestleParams, trestleMkrCd: selectedTrestle.trestleMkrCd, constMthdCd: option.constMthdCd, roofBaseCd: '' })
+    setRoofBaseList([]) //지붕밑바탕 초기화
    setConstructionList([]) //공법 초기화
  }

@ -93,45 +93,6 @@ export default function ModuleTabContents({
    setSelectedRoofBase(option)
  }

-  const getModuleOptionsListData = async (params) => {
-    const optionsList = await getTrestleList(params)
-
-    if (optionsList.data.length > 0) {
-      if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd === null) {
-        setTrestleList(optionsList.data)
-        if (isExistData) {
-          setSelectedTrestle({ ...moduleConstructionSelectionData.trestle })
-        } else {
-          setConstMthdList([])
-          setRoofBaseList([])
-        }
-      }
-
-      if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd === null) {
-        setConstMthdList(optionsList.data)
-        if (isExistData) {
-          setSelectedConstMthd({ ...moduleConstructionSelectionData.trestle })
-        } else {
-          setRoofBaseList([])
-        }
-      }
-
-      if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd) {
-        setRoofBaseList(optionsList.data)
-        if (isExistData) {
-          setSelectedRoofBase({ ...moduleConstructionSelectionData.trestle })
-        }
-      }
-    }
-  }
-
-  const getConstructionListData = async (params) => {
-    if (params.trestleMkrCd && params.constMthdCd && params.roofBaseCd) {
-      const optionsList = await getConstructionList(params)
-      setConstructionList(optionsList.data)
-    }
-  }
-
  const handleConstruction = (index) => {
    if (index > -1) {
      const isPossibleIndex = constructionRef.current
@ -163,9 +124,54 @@ export default function ModuleTabContents({
    }
  }

-  useEffect(() => {
-    console.log('tempModuleSelectionData', tempModuleSelectionData)
+  const handleCvrChecked = () => {
+    setCvrChecked(!cvrChecked)
+  }

+  const handleSnowGdChecked = () => {
+    setSnowGdChecked(!snowGdChecked)
+  }
+
+  const getModuleOptionsListData = async (params) => {
+    const optionsList = await getTrestleList(params)
+
+    if (optionsList.data.length > 0) {
+      if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd === null) {
+        setTrestleList(optionsList.data)
+        if (isExistData) {
+          setSelectedTrestle({ ...moduleConstructionSelectionData?.trestle })
+        } else {
+          setConstMthdList([])
+          setRoofBaseList([])
+        }
+      }
+
+      if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd === null) {
+        setConstMthdList(optionsList.data)
+        if (isExistData) {
+          setSelectedConstMthd({ ...moduleConstructionSelectionData?.trestle })
+        } else {
+          setRoofBaseList([])
+        }
+      }
+
+      if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd) {
+        setRoofBaseList(optionsList.data)
+        if (isExistData) {
+          setSelectedRoofBase({ ...moduleConstructionSelectionData?.trestle })
+        }
+      }
+    }
+  }
+
+  const getConstructionListData = async (params) => {
+    if (params.trestleMkrCd && params.constMthdCd && params.roofBaseCd) {
+      const optionsList = await getConstructionList(params)
+      setConstructionList(optionsList.data)
+    }
+  }
+
+  useEffect(() => {
    if (isObjectNotEmpty(selectedRoofBase) && isObjectNotEmpty(selectedConstruction)) {
      const newRoofConstructions = {
        roofIndex: roofTab,
@ -189,14 +195,6 @@ export default function ModuleTabContents({
    }
  }, [selectedConstruction])

-  const handleCvrChecked = () => {
-    setCvrChecked(!cvrChecked)
-  }
-
-  const handleSnowGdChecked = () => {
-    setSnowGdChecked(!snowGdChecked)
-  }
-
  useEffect(() => {
    setSelectedConstruction({ ...selectedConstruction, setupCover: cvrChecked })
  }, [cvrChecked])
@ -219,7 +217,10 @@ export default function ModuleTabContents({
  useEffect(() => {
    if (isExistData && constructionList.length > 0) {
      const selectedIndex = moduleConstructionSelectionData.construction.selectedIndex
-      handleConstruction(selectedIndex)
+      const construction = constructionList[selectedIndex]
+      if (construction.constPossYn === 'Y') {
+        handleConstruction(selectedIndex)
+      }
    }
  }, [constructionList])

@ -246,20 +247,19 @@ export default function ModuleTabContents({
      if (isModuleLoaded) {
        setTrestleParams({ moduleTpCd: moduleSelectionInitParams.moduleTpCd, roofMatlCd: addRoof.roofMatlCd, raftBaseCd: addRoof.raftBaseCd })
        setConstructionList([])
-        setTempModuleSelectionData({ common: moduleSelectionInitParams, module: selectedModule })

        if (isObjectNotEmpty(moduleConstructionSelectionData)) {
-          //기존에 데이터가 있으면
+          //기존에 데이터가 있으면 파라메터를 넣는다
          setConstructionParams({ ...moduleConstructionSelectionData.trestle, constMthdCd: '', roofBaseCd: '' })
          setRoofBaseParams({ ...moduleConstructionSelectionData.trestle, roofBaseCd: '' })
          setCvrChecked(moduleConstructionSelectionData.construction.setupCover)
          setSnowGdChecked(moduleConstructionSelectionData.construction.setupSnowCover)
          setIsExistData(true)
-
-          setTempModuleSelectionData({ roofConstructions: [{ ...moduleConstructionSelectionData }] })
        }
      }
    }
+
+    setTempModuleSelectionData({ common: moduleSelectionInitParams, module: selectedModules })
  }, [moduleSelectionInitParams])

  useEffect(() => {
@ -288,8 +288,7 @@ export default function ModuleTabContents({

  useEffect(() => {
    if (isObjectNotEmpty(tempModuleSelectionData)) {
-      setModuleSelectionDataPlanList({ ...moduleSelectionDataPlanList, [currentCanvasPlan.id]: tempModuleSelectionData })
-      // setModuleSelectionData(tempModuleSelectionData)
+      setModuleSelectionData(tempModuleSelectionData)
    }
  }, [tempModuleSelectionData])

--- a/src/components/floor-plan/modal/basic/step/Orientation.jsx
+++ b/src/components/floor-plan/modal/basic/step/Orientation.jsx
@ -1,8 +1,9 @@
-import { forwardRef, useImperativeHandle, useState } from 'react'
+import { forwardRef, useContext, useImperativeHandle, useState } from 'react'
 import { useMessage } from '@/hooks/useMessage'
 import { useOrientation } from '@/hooks/module/useOrientation'
 import { getDegreeInOrientation } from '@/util/canvas-util'
 import { numberCheck } from '@/util/common-utils'
+import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController'

 export const Orientation = forwardRef(({ tabNum }, ref) => {
  const { getMessage } = useMessage()
@ -17,6 +18,7 @@ export const Orientation = forwardRef(({ tabNum }, ref) => {

  const handleNextStep = () => {
    nextStep()
+    canvasPopupStatusTrigger(compasDeg)
  }

  const checkDegree = (e) => {
@ -27,6 +29,8 @@ export const Orientation = forwardRef(({ tabNum }, ref) => {
    }
  }

+  const { trigger: canvasPopupStatusTrigger } = useCanvasPopupStatusController(1)
+
  return (
    <>
      <div className="properties-setting-wrap">
--- a/src/components/floor-plan/modal/basic/step/Placement.jsx
+++ b/src/components/floor-plan/modal/basic/step/Placement.jsx
@ -3,7 +3,7 @@ import { useMessage } from '@/hooks/useMessage'
 import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
 import { checkedModuleState, currentCanvasPlanState } from '@/store/canvasAtom'
 import { useRecoilValue, useSetRecoilState } from 'recoil'
-import { moduleSelectionDataPlanListState } from '@/store/selectedModuleOptions'
+import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
 import { useModulePlace } from '@/hooks/module/useModulePlace'

 const Placement = forwardRef((props, refs) => {
@ -20,15 +20,14 @@ const Placement = forwardRef((props, refs) => {
  const { selectedModules } = useModulePlace()

  const setCheckedModules = useSetRecoilState(checkedModuleState)
-  const moduleSelectionDataPlanList = useRecoilValue(moduleSelectionDataPlanListState)
+  const moduleSelectionData = useRecoilValue(moduleSelectionDataState)

  //모듈 배치면 생성
  useEffect(() => {
    makeModuleInstArea()
-
-    if (moduleSelectionDataPlanList) {
+    if (moduleSelectionData) {
      //1개라도 치도리 불가가 있으면 치도리 불가
-      const isChidroriValue = moduleSelectionDataPlanList[currentCanvasPlan.id].roofConstructions.some((item) => item.construction.plvrYn === 'N')
+      const isChidroriValue = moduleSelectionData.roofConstructions.some((item) => item.construction.plvrYn === 'N')
      if (isChidroriValue) {
        setIsChidoriNotAble(true)
      }
--- a/src/hooks/common/useCanvasPopupStatusController.js
+++ b/src/hooks/common/useCanvasPopupStatusController.js
@ -1,28 +1,77 @@
 'use client'

 import { useEffect } from 'react'
+import { useRecoilState, useRecoilValue } from 'recoil'
 import useSWR from 'swr'
 import useSWRMutation from 'swr/mutation'
 import { useAxios } from '../useAxios'
-import { useRecoilState } from 'recoil'
-import { canvasPopupStatusStore } from '@/store/canvasPopupStatusAtom'
+import { unescapeString } from '@/util/common-utils'
+import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
+import { compasDegAtom } from '@/store/orientationAtom'
+import { currentCanvasPlanState } from '@/store/canvasAtom'

-export function useCanvasPopupStatusController(popupType) {
-  const [canvasPopupStatusState, setCanvasPopupStatusState] = useRecoilState(canvasPopupStatusStore)
+export function useCanvasPopupStatusController(param = 1) {
+  const popupType = param
+
+  const [compasDeg, setCompasDeg] = useRecoilState(compasDegAtom)
+  const [moduleSelectionDataStore, setModuleSelectionDataStore] = useRecoilState(moduleSelectionDataState)
  const { getFetcher, postFetcher } = useAxios()
+
+  const currentCanvasPlan = useRecoilValue(currentCanvasPlanState)
+  console.log('🚀 ~ Orientation ~ currentCanvasPlan:', currentCanvasPlan)
+
  const {
    data: popupStatus,
    error,
    isLoading,
-  } = useSWR(popupType ? 'canvas-popup-status--data' : null, () => getFetcher(`http://localhost:8080/api/tutorial?popupType=${popupType}`))
+  } = useSWR(
+    popupType ? `/api/v1/canvas-popup-status?objectNo=${currentCanvasPlan.objectNo}&planNo=${currentCanvasPlan.planNo}&popupType=${popupType}` : null,
+    getFetcher,
+  )

  useEffect(() => {
+    console.log('🚀 ~ useEffect ~ popupStatus:', popupStatus)
    if (popupStatus) {
-      setCanvasPopupStatusState({ ...canvasPopupStatusState, [popupType]: popupStatus })
+      switch (parseInt(popupStatus?.popupType)) {
+        case 1:
+          setCompasDeg(popupStatus.popupStatus)
+          break
+        case 2:
+          setModuleSelectionDataStore(JSON.parse(unescapeString(popupStatus.popupStatus)))
+          break
+        case 3:
+          break
+        case 4:
+          break
+        default:
+      }
+    } else {
+      switch (popupType) {
+        case 1:
+          setCompasDeg(0)
+          break
+        case 2:
+          setModuleSelectionDataStore({
+            common: {},
+            roofConstructions: [],
+          })
+          break
+      }
    }
  }, [popupStatus])

-  const { trigger, isMutating } = useSWRMutation('canvas-popup-status-update', postFetcher)
+  const { trigger, isMutating } = useSWRMutation(
+    `/api/v1/canvas-popup-status?objectNo=${currentCanvasPlan.objectNo}&planNo=${currentCanvasPlan.planNo}&popupType=${popupType}`,
+    (url, { arg }) => {
+      const params = {
+        objectNo: currentCanvasPlan.objectNo,
+        planNo: parseInt(currentCanvasPlan.planNo),
+        popupType: popupType.toString(),
+        popupStatus: JSON.stringify(arg).replace(/"/g, '\"'),
+      }
+      postFetcher(`/api/v1/canvas-popup-status`, params)
+    },
+  )

  return { trigger }
 }
--- a/src/hooks/module/useModuleBasicSetting.js
+++ b/src/hooks/module/useModuleBasicSetting.js
@ -853,7 +853,7 @@ export function useModuleBasicSetting() {
            leftMargin = j === 0 ? 0 : intvVer * j
            chidoriLength = 0
            if (isChidori) {
-              chidoriLength = i % 2 === 0 ? 0 : height / 2 - intvHor
+              chidoriLength = i % 2 === 0 ? 0 : height / 2
            }

            square = [
--- a/src/hooks/module/useModulePlace.js
+++ b/src/hooks/module/useModulePlace.js
@ -1,12 +1,12 @@
 import { useEffect, useState } from 'react'
 import { useRecoilState, useRecoilValue } from 'recoil'
-import { moduleSelectionDataPlanListState, selectedModuleState } from '@/store/selectedModuleOptions'
+import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions'
 import { useMasterController } from '@/hooks/common/useMasterController'
 import { canvasState, currentCanvasPlanState } from '@/store/canvasAtom'

 export function useModulePlace() {
  const canvas = useRecoilValue(canvasState)
-  const moduleSelectionDataPlanList = useRecoilValue(moduleSelectionDataPlanListState) //다음으로 넘어가는 최종 데이터
+  const moduleSelectionData = useRecoilValue(moduleSelectionDataState)
  const currentCanvasPlan = useRecoilValue(currentCanvasPlanState)
  const [trestleDetailParams, setTrestleDetailParams] = useState([])
  const [trestleDetailList, setTrestleDetailList] = useState([])
@ -14,9 +14,9 @@ export function useModulePlace() {
  const { getTrestleDetailList } = useMasterController()

  useEffect(() => {
-    if (moduleSelectionDataPlanList) {
-      const common = moduleSelectionDataPlanList[currentCanvasPlan.id].common
-      const roofConstructions = moduleSelectionDataPlanList[currentCanvasPlan.id].roofConstructions
+    if (moduleSelectionData) {
+      const common = moduleSelectionData.common
+      const roofConstructions = moduleSelectionData.roofConstructions

      const listParams = roofConstructions.map((item) => {
        return {
@ -31,11 +31,12 @@ export function useModulePlace() {
          roofPitch: selectedModules.roofPchBase ? selectedModules.roofPchBase : null,
          inclCd: String(item.addRoof.pitch),
          roofIndex: item.addRoof.index,
+          workingWidth: item.addRoof.lenBase,
        }
      })
      setTrestleDetailParams(listParams)
    }
-  }, [moduleSelectionDataPlanList])
+  }, [moduleSelectionData])

  const getTrestleDetailListData = async () => {
    const trestleDetailList = await getTrestleDetailList(trestleDetailParams)
@ -49,8 +50,6 @@ export function useModulePlace() {
  }, [trestleDetailParams])

  useEffect(() => {
-    console.log('🚀 ~ useModulePlace ~ trestleDetailList:', trestleDetailList)
-
    //지붕을 가져옴
    canvas
      .getObjects()
@ -71,8 +70,6 @@ export function useModulePlace() {
              })
          }
        })
-
-        console.log('roof', roof)
      })
  }, [trestleDetailList])

--- a/src/hooks/module/useModuleSelection.js
+++ b/src/hooks/module/useModuleSelection.js
@ -5,11 +5,9 @@ import { useMasterController } from '@/hooks/common/useMasterController'
 import { useCommonCode } from '@/hooks/common/useCommonCode'

 import { selectedModuleState, moduleSelectionInitParamsState } from '@/store/selectedModuleOptions'
-import { pitchSelector } from '@/store/canvasAtom'

 export function useModuleSelection(props) {
  const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
-  const globalPitch = useRecoilValue(pitchSelector) //피치

  const [roughnessCodes, setRoughnessCodes] = useState([]) //면조도 목록
  const [windSpeedCodes, setWindSpeedCodes] = useState([]) //기준풍속 목록
@ -17,9 +15,9 @@ export function useModuleSelection(props) {

  const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState) //선택된 모듈
  const [selectedSurfaceType, setSelectedSurfaceType] = useState({}) //선택된 면조도
-  const [installHeight, setInstallHeight] = useState('0') //설치 높이
+  const [installHeight, setInstallHeight] = useState(managementState?.installHeight) //설치 높이
  const [standardWindSpeed, setStandardWindSpeed] = useState({}) //기준풍속
-  const [verticalSnowCover, setVerticalSnowCover] = useState('0') //수직적설량
+  const [verticalSnowCover, setVerticalSnowCover] = useState(managementState?.verticalSnowCover) //수직적설량
  const [moduleSelectionInitParams, setModuleSelectionInitParams] = useRecoilState(moduleSelectionInitParamsState) //모듈 기본 데이터 ex) 면조도, 높이등등

  const { getModuleTypeItemList } = useMasterController()
@ -76,12 +74,14 @@ export function useModuleSelection(props) {

  const getModuleData = async (roofsIds) => {
    const list = await getModuleTypeItemList(roofsIds)
-    //selectbox에 이름을 넣는다
-    list.data.forEach((item) => {
-      item.name = item.itemNm
-    })
-    //셀렉트박스 데이터 초기화
-    setModuleList(list.data)
+    if (list.data.length > 0) {
+      //selectbox에 이름을 넣는다
+      list.data.forEach((item) => {
+        item.name = item.itemNm
+      })
+      //셀렉트박스 데이터 초기화
+      setModuleList(list.data)
+    }
  }

  const handleChangeModule = (option) => {
@ -112,7 +112,6 @@ export function useModuleSelection(props) {

  const handleChangeInstallHeight = (option) => {
    setInstallHeight(option)
-
    setModuleSelectionInitParams({
      ...moduleSelectionInitParams,
      instHt: option,
--- a/src/hooks/option/useCanvasSetting.js
+++ b/src/hooks/option/useCanvasSetting.js
@ -58,17 +58,22 @@ export function useCanvasSetting() {

  const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState)
  const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState)
+  const resetSettingModalFirstOptions = useResetRecoilState(settingModalFirstOptionsState)
+  const resetSettingModalSecondOptions = useResetRecoilState(settingModalSecondOptionsState)

  const [selectedFont, setSelectedFont] = useState()
  const [selectedFontWeight, setSelectedFontWeight] = useState()
  const [selectedFontSize, setSelectedFontSize] = useState()
  const [selectedFontColor, setSelectedFontColor] = useState()
  const [globalFont, setGlobalFont] = useRecoilState(globalFontAtom)
+  const resetGlobalFont = useResetRecoilState(globalFontAtom)

  const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState)
  const [adsorptionRange, setAdsorptionRange] = useRecoilState(adsorptionRangeState)
  const [planSizeSettingMode, setPlanSizeSettingMode] = useRecoilState(planSizeSettingState)
+  const resetPlanSizeSettingMode = useResetRecoilState(planSizeSettingState)
  const [dimensionLineSettings, setDimensionLineSettings] = useRecoilState(dimensionLineSettingsState)
+  const resetDimensionLineSettings = useResetRecoilState(dimensionLineSettingsState)

  const setSettingModalGridOptions = useSetRecoilState(settingModalGridOptionsState)
  const [dotLineGridSetting, setDotLineGridSettingState] = useRecoilState(dotLineGridSettingState)
@ -120,6 +125,8 @@ export function useCanvasSetting() {
  const { closeAll } = usePopup()

  useEffect(() => {
+    console.log('correntObjectNo', correntObjectNo)
+
    setFetchRoofMaterials(!fetchRoofMaterials)
    if (fetchRoofMaterials) {
      addRoofMaterials()
@ -165,9 +172,10 @@ export function useCanvasSetting() {
  useEffect(() => {
    //console.log('🚀 ~ useEffect ~ roofMaterials 22 :', previousRoofMaterialsYn, roofMaterials.length , JSON.stringify(previousRoofMaterialsRef.current) !== JSON.stringify(roofMaterials))
    // 지붕재 select 정보가 존재해야 배치면초기설정 DB 정보 비교 후 지붕재 정보를 가져올 수 있음
-    if (!previousObjectNoRef.current && !correntObjectNo && previousObjectNoRef.current !== correntObjectNo 
-     || roofMaterials.length !== 0 && JSON.stringify(previousRoofMaterialsRef.current) !== JSON.stringify(roofMaterials)) {
-      
+    if (
+      (!previousObjectNoRef.current && !correntObjectNo && previousObjectNoRef.current !== correntObjectNo) ||
+      (roofMaterials.length !== 0 && JSON.stringify(previousRoofMaterialsRef.current) !== JSON.stringify(roofMaterials))
+    ) {
      // 1회만 실행
      if (roofMaterials && previousRoofMaterialsYn === 'N') {
        fetchBasicSettings()
@ -290,10 +298,12 @@ export function useCanvasSetting() {
  const fetchBasicSettings = async () => {
    try {
      await get({ url: `/api/canvas-management/canvas-basic-settings/by-object/${correntObjectNo}` }).then((res) => {
+        console.log('🚀 ~ fetchBasicSettings ~ res >>>>>>>>>> :', res)
+
        let roofsRow = {}
        let roofsArray = {}

-        if (res) {
+        if (res.length > 0) {
          roofsRow = res.map((item) => {
            return {
              roofSizeSet: String(item.roofSizeSet),
@ -444,7 +454,7 @@ export function useCanvasSetting() {
      const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${correntObjectNo}` })
      console.log('res', res)

-      if (res.length > 0) {
+      if (Object.keys(res).length > 0) {
        const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] }))
        const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] }))
        const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item }))
@ -533,26 +543,27 @@ export function useCanvasSetting() {
        //그리드 색 설정
        setGridColor(res.gridColor)
      } else {
-        //조회된 글꼴 데이터가 없는 경우
+        //조회된 글꼴 데이터가 없는 경우 (데이터 초기화)

        //흡착점 ON/OFF
        setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: false })

        //치수선 설정
-        setDimensionLineSettings({ ...dimensionLineSettings })
+        // setDimensionLineSettings({ ...dimensionLineSettings, ...dimensionLineSettingsState.default })
+        resetDimensionLineSettings()

        //도면크기 설정
-        setPlanSizeSettingMode({ ...planSizeSettingMode })
+        // setPlanSizeSettingMode({ ...planSizeSettingMode, ...planSizeSettingState.default })
+        resetPlanSizeSettingMode()

        // 데이터 설정
-        setSettingModalFirstOptions({
-          ...settingModalFirstOptions,
-        })
-        setSettingModalSecondOptions({
-          ...settingModalSecondOptions,
-        })
+        // setSettingModalFirstOptions({ ...settingModalFirstOptions, ...settingModalFirstOptionsState.default })
+        resetSettingModalFirstOptions()
+        //setSettingModalSecondOptions({ ...settingModalSecondOptions, ...settingModalSecondOptionsState.default })
+        resetSettingModalSecondOptions()

-        setGlobalFont({ ...globalFont })
+        // setGlobalFont({ ...globalFont, ...globalFontAtom.default })
+        resetGlobalFont()

        //점/선 그리드
        setDotLineGridSettingState({ ...defaultDotLineGridSetting })
@ -677,7 +688,7 @@ export function useCanvasSetting() {
    // HTTP POST 요청 보내기
    await post({ url: `/api/canvas-management/canvas-settings`, data: patternData })
      .then((res) => {
-        swalFire({ text: getMessage(res.returnMessage) })
+        //swalFire({ text: getMessage(res.returnMessage) })

        // Canvas 디스플레이 설정 시 해당 옵션 적용
        frontSettings()
@ -777,6 +788,7 @@ export function useCanvasSetting() {
    adsorptionRange,
    setAdsorptionRange,
    fetchSettings,
+    fetchBasicSettings,
    frontSettings,
    globalFont,
    setGlobalFont,
--- a/src/hooks/surface/useSurfaceShapeBatch.js
+++ b/src/hooks/surface/useSurfaceShapeBatch.js
@ -649,11 +649,11 @@ export function useSurfaceShapeBatch() {

  const deleteAllSurfacesAndObjects = () => {
    swalFire({
-      text: '배치면 내용을 전부 삭제하시겠습니까?',
+      text: getMessage('batch.canvas.delete.all'),
      type: 'confirm',
      confirmFn: () => {
        canvas.clear()
-        swalFire({ text: '삭제 완료 되었습니다.' })
+        swalFire({ text: getMessage('plan.message.delete') })
      },
      // denyFn: () => {
      //   swalFire({ text: '취소되었습니다.', icon: 'error' })
--- a/src/hooks/usePlan.js
+++ b/src/hooks/usePlan.js
@ -14,6 +14,7 @@ import { SAVE_KEY } from '@/common/common'
 import { readImage, removeImage } from '@/lib/fileAction'
 import { FloorPlanContext } from '@/app/floor-plan/FloorPlanProvider'
 import { useEstimateController } from '@/hooks/floorPlan/estimate/useEstimateController'
+
 export function usePlan(params = {}) {
  const { floorPlanState } = useContext(FloorPlanContext)

@ -159,7 +160,7 @@ export function usePlan(params = {}) {
  /**
   * 신규 canvas 데이터를 저장
   */
-  const postCanvasStatus = async (userId, objectNo, canvasStatus) => {
+  const postCanvasStatus = async (userId, objectNo, canvasStatus, isInitPlan = false) => {
    const planNo = await postObjectPlan(userId, objectNo)
    if (!planNo) return

@ -173,7 +174,12 @@ export function usePlan(params = {}) {
    }
    await promisePost({ url: '/api/canvas-management/canvas-statuses', data: planData })
      .then((res) => {
-        setPlans((plans) => [...plans, { id: res.data, objectNo: objectNo, planNo: planNo, userId: userId, canvasStatus: canvasStatus }])
+        if (isInitPlan) {
+          // 초기 플랜 생성인 경우 플랜 목록 초기화
+          setPlans([{ id: res.data, objectNo: objectNo, planNo: planNo, userId: userId, canvasStatus: canvasStatus }])
+        } else {
+          setPlans((plans) => [...plans, { id: res.data, objectNo: objectNo, planNo: planNo, userId: userId, canvasStatus: canvasStatus }])
+        }
        updateCurrentPlan(res.data)
      })
      .catch((error) => {
@ -313,13 +319,13 @@ export function usePlan(params = {}) {
          text: `Plan ${currentCanvasPlan.planNo} ` + getMessage('plan.message.confirm.copy'),
          type: 'confirm',
          confirmFn: async () => {
-            await postCanvasStatus(userId, objectNo, currentCanvasData())
+            await postCanvasStatus(userId, objectNo, currentCanvasData(), false)
          },
          denyFn: async () => {
-            await postCanvasStatus(userId, objectNo, '')
+            await postCanvasStatus(userId, objectNo, '', false)
          },
        })
-      : await postCanvasStatus(userId, objectNo, '')
+      : await postCanvasStatus(userId, objectNo, '', false)
  }

  /**
@ -374,7 +380,7 @@ export function usePlan(params = {}) {
        setPlans(res)
        updateCurrentPlan(res.find((plan) => plan.planNo === planNo).id)
      } else {
-        postCanvasStatus(userId, objectNo, '')
+        postCanvasStatus(userId, objectNo, '', true)
      }
    })
  }
--- a/src/locales/ko.json
+++ b/src/locales/ko.json
@ -986,5 +986,6 @@
  "module.place.out": "설치면 밖으로 모듈을 설치 할 수 없습니다.",
  "module.place.no.surface": "선택된 모듈 설치면이 없습니다.",
  "module.place.select.module": "모듈을 선택해주세요.",
-  "module.place.select.one.module": "모듈은 하나만 선택해주세요."
+  "module.place.select.one.module": "모듈은 하나만 선택해주세요.",
+  "batch.canvas.delete.all": "배치면 내용을 전부 삭제하시겠습니까?"
 }
--- a/src/store/selectedModuleOptions.js
+++ b/src/store/selectedModuleOptions.js
@ -85,9 +85,3 @@ export const moduleSelectionDataState = atom({
  },
  dangerouslyAllowMutability: true,
 })
-
-export const moduleSelectionDataPlanListState = atom({
-  key: 'moduleSelectionDataPlanListState',
-  default: {},
-  dangerouslyAllowMutability: true,
-})
--- a/src/util/board-utils.js
+++ b/src/util/board-utils.js
@ -1,12 +1,13 @@
 import { useAxios } from '@/hooks/useAxios'

 // 파일 다운로드
-export const handleFileDown = async (file) => {
+export const handleFileDown = async (keyNo, zipYn) => {
  const { promiseGet } = useAxios()

  const url = `/api/board/file/download`
  const params = new URLSearchParams({
-    encodeFileNo: file.encodeFileNo,
+    keyNo: keyNo,
+    zipYn: zipYn,
  })
  const options = { responseType: 'blob' }
  const apiUrl = `${url}?${params.toString()}`
@ -18,8 +19,17 @@ export const handleFileDown = async (file) => {
        const fileUrl = window.URL.createObjectURL(blob)
        const link = document.createElement('a')

+        const contentDisposition = resultData.headers.get('content-disposition')
+        let filename = 'filename'
+        if (contentDisposition) {
+          const matches = contentDisposition.match(/filename="?([^"]+)"?/)
+          if (matches && matches[1]) {
+            filename = matches[1]
+          }
+        }
+
+        link.download = decodeURIComponent(filename)
        link.href = fileUrl
-        link.download = file.srcFileNm
        document.body.appendChild(link)
        link.click()
        link.remove()