- Canvas 설정, 외벽선 그리기 Modal 수정

- 외벽선 그리기 Modal open 추가

src/components/floor-plan/CanvasMenu.jsx

@@ -34,7 +34,13 @@ export default function CanvasMenu() {
               {getMessage('plan.menu.placement.surface.initial.setting')}
             </button>
           </li>
-          <li className={`canvas-menu-item ${menuNumber === 2 ? 'active' : ''}`} onClick={() => onClickNav(2)}>
+          <li
+            className={`canvas-menu-item ${menuNumber === 2 ? 'active' : ''}`}
+            onClick={() => {
+              setModalOption({ ...modalOption, outerwall: true })
+              onClickNav(2)
+            }}
+          >
             <button>
               <span className="menu-icon con02"></span>
               {getMessage('plan.menu.root.cover')}

src/components/floor-plan/modal/setting01/SettingModal01.jsx

@@ -5,14 +5,17 @@ import FirstOption from './FirstOption'
 import WithDraggable from '@/components/common/draggable/withDraggable'
 import SecondOption from '@/components/floor-plan/modal/setting01/SecondOption'
 import { useMessage } from '@/hooks/useMessage'
+import { modalState } from '@/store/modalAtom'
+import { useRecoilState } from 'recoil'
 
-export default function SettingModal01({ modalOpen, setModalOpen }) {
+export default function SettingModal01() {
+  const [modalOption, setModalOption] = useRecoilState(modalState) //modal 열림닫힘 state
   const [buttonAct, setButtonAct] = useState(1)
   const [close, setClose] = useState(false)
   const HandleClickClose = () => {
     setClose(true)
     setTimeout(() => {
-      setModalOpen('')
+      setModalOption({ ...modalOption, option: false })
       setClose(false)
     }, 180)
   }
@@ -20,7 +23,7 @@ export default function SettingModal01({ modalOpen, setModalOpen }) {
 
   return (
     <WithDraggable isShow={true}>
-      <div className={`modal-pop-wrap sm ${modalOpen === 'option' && close === false ? 'mount' : ''}${close ? 'unmount' : ''} `}>
+      <div className={`modal-pop-wrap sm ${modalOption.option ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
         <div className="modal-head">
           <h1 className="title">{getMessage('modal.canvas.setting')}</h1>
           <button className="modal-close" onClick={HandleClickClose}>

src/store/modalAtom.js

@@ -3,7 +3,7 @@ import { atom } from 'recoil'
 export const modalState = atom({
   key: 'modalState',
   default: {
-    option: true,
-    outerwall: true,
+    option: false,
+    outerwall: false,
   },
 })