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

src/app/floor-plan/page.jsx

@@ -1,5 +1,4 @@
 import CanvasFrame from '@/components/floor-plan/CanvasFrame'
-import FloorPlan from '@/components/floor-plan/FloorPlan'
 
 export default function FloorPlanPage() {
   return (

src/components/estimate/Estimate.jsx

@@ -1,20 +1,31 @@
 'use client'
+
 import { useEffect, useState, useRef } from 'react'
-import { useMessage } from '@/hooks/useMessage'
-import SingleDatePicker from '../common/datepicker/SingleDatePicker'
 import { useRecoilValue } from 'recoil'
 import { floorPlanObjectState } from '@/store/floorPlanObjectAtom'
-import { Button } from '@nextui-org/react'
 import { sessionStore } from '@/store/commonAtom'
+import { useMessage } from '@/hooks/useMessage'
+import { useCanvasMenu } from '@/hooks/common/useCanvasMenu'
+import SingleDatePicker from '../common/datepicker/SingleDatePicker'
+import EstimateFileUploader from './EstimateFileUploader'
 
 export default function Estimate({ params }) {
-  const sessionState = useRecoilValue(sessionStore)
-  const { getMessage } = useMessage()
-  const objectRecoil = useRecoilValue(floorPlanObjectState)
   const [objectNo, setObjectNo] = useState('')
-  const fileInputRef = useRef(null)
   const [files, setFiles] = useState([]) //첨부파일
-  const fileId = useRef(0)
+
+  const sessionState = useRecoilValue(sessionStore)
+  const objectRecoil = useRecoilValue(floorPlanObjectState)
+  const { getMessage } = useMessage()
+
+  const { setMenuNumber } = useCanvasMenu()
+
+  const fileUploadProps = {
+    // objectNo: '',
+    // planNo: params.pid,
+    // category: '10',
+    uploadFiles: files,
+    setUploadFiles: setFiles,
+  }
 
   useEffect(() => {
     setObjectNo(objectRecoil.floorPlanObjectNo)
@@ -28,31 +39,9 @@ export default function Estimate({ params }) {
     }
   }, [objectNo])
 
-  const handleButtonClick = () => {
+  useEffect(() => {
-    fileInputRef.current.click()
+    setMenuNumber(5)
-  }
+  }, [])
-
-  const onChangeFiles = (e) => {
-    // e.preventDefault()
-    // e.persist()
-    // console.log('파일::', e.target.files[0])
-    // console.log('파일::', e.target.files)
-    // let selectFiles = []
-    // let tempFiles = files
-    // selectFiles = e.target.files
-    // for (const file of selectFiles) {
-    //   tempFiles = [
-    //     ...tempFiles,
-    //     {
-    //       id: fileId.current++,
-    //       object: file,
-    //     },
-    //   ]
-    // }
-    // setFiles(tempFiles)
-    // const formData = new FormData()
-    // formData.append('file', e.target.files[0])
-  }
 
   return (
     <div className="sub-content estimate">
@@ -210,7 +199,8 @@ export default function Estimate({ params }) {
                   <tr>
                     <th>{getMessage('estimate.detail.header.fileList1')}</th>
                     <td>
-                      <div className="drag-file-box">
+                      <EstimateFileUploader {...fileUploadProps} />
+                      {/* <div className="drag-file-box">
                         <div className="btn-area">
                           <Button type="button" className="btn-origin grey" onClick={handleButtonClick}>
                             {getMessage('estimate.detail.fileList.btn')}
@@ -228,7 +218,7 @@ export default function Estimate({ params }) {
                           <p>Drag file here</p>
                           <ul className="file-list"></ul>
                         </div>
-                      </div>
+                      </div> */}
                     </td>
                   </tr>
                 </tbody>

src/components/estimate/EstimateFileUploader.jsx

@@ -0,0 +1,91 @@
+'use client'
+
+import { useContext, useRef } from 'react'
+import { v4 as uuidv4 } from 'uuid'
+import { useMessage } from '@/hooks/useMessage'
+import { SessionContext } from '@/app/SessionProvider'
+
+export default function EstimateFileUploader({ uploadFiles, setUploadFiles }) {
+  const fileInputRef = useRef(null)
+  const { getMessage } = useMessage()
+  const { session } = useContext(SessionContext)
+
+  const handleButtonClick = (e) => {
+    e.preventDefault()
+    fileInputRef.current.click()
+  }
+
+  const onChangeFiles = async (e) => {
+    // const formData = new FormData()
+    // formData.append('file', e.target.files[0])
+    // formData.append('objectNo', objectNo) // 받아와야 하는 값
+    // formData.append('planNo', planNo) // 받아와야 하는 값
+    // formData.append('category', category) // 받아와야 하는 값
+    // formData.append('userId', session.userId)
+
+    // await promisePost({ url: '/api/file/fileUpload', data: formData }).then((res) => {
+    //   if (res.data > 0) setUploadFiles([...files, { name: e.target.files[0].name, id: uuidv4() }])
+    // })
+    setUploadFiles([...uploadFiles, { data: e.target.files[0], id: uuidv4() }])
+  }
+
+  const deleteFile = (id) => {
+    setUploadFiles(uploadFiles.filter((file) => file.id !== id))
+  }
+
+  const handleDrop = (e) => {
+    e.preventDefault()
+    e.stopPropagation()
+    const fileList = []
+    Array.from(e.dataTransfer.files).forEach((file) => {
+      fileList.push({ data: file, id: uuidv4() })
+    })
+    setUploadFiles([...uploadFiles, ...fileList])
+  }
+
+  const handleDragOver = (e) => {
+    e.preventDefault()
+    e.stopPropagation()
+  }
+
+  const handleDragEnd = (e) => {
+    e.preventDefault()
+    e.stopPropagation()
+  }
+
+  const handleDragLeave = (e) => {
+    e.preventDefault()
+    e.stopPropagation()
+  }
+
+  return (
+    <div className="drag-file-box">
+      <div className="btn-area">
+        <label className="file-upload" htmlFor="img" onClick={handleButtonClick}>
+          {getMessage('estimate.detail.fileList.btn')}
+        </label>
+        <input type="file" name="file" id="img" ref={fileInputRef} style={{ display: 'none' }} onChange={(e) => onChangeFiles(e)} />
+      </div>
+      <div
+        className="drag-file-area"
+        draggable
+        onDrop={(e) => handleDrop(e)}
+        onDragOver={(e) => handleDragOver(e)}
+        onDragEnd={(e) => handleDragEnd(e)}
+        onDragLeave={(e) => handleDragLeave(e)}
+      >
+        <p>Drag file here</p>
+        <ul className="file-list">
+          {uploadFiles.length > 0 &&
+            uploadFiles.map((file) => (
+              <li className="file-item" key={file.id}>
+                <span>
+                  {file.data.name} <button className="delete" onClick={() => deleteFile(file.id)}></button>
+                </span>
+              </li>
+            ))}
+        </ul>
+      </div>
+    </div>
+  )
+}

src/components/floor-plan/FloorPlan.jsx

@@ -26,10 +26,6 @@ export default function FloorPlan({ children }) {
     fetchSettings()
   }, [objectNo])
 
-  useEffect(() => {
-    setMenuNumber(1)
-  }, [])
-
   return (
     <>
       <div className="canvas-wrap">

src/components/floor-plan/modal/auxiliary/AuxiliaryCopy.jsx

@@ -3,50 +3,79 @@ import WithDraggable from '@/components/common/draggable/WithDraggable'
 import { usePopup } from '@/hooks/usePopup'
 import { useRecoilValue } from 'recoil'
 import { contextPopupPositionState } from '@/store/popupAtom'
+import { useState } from 'react'
 
 export default function AuxiliaryCopy(props) {
   const contextPopupPosition = useRecoilValue(contextPopupPositionState)
   const { id, pos = contextPopupPosition } = props
   const { getMessage } = useMessage()
   const { closePopup } = usePopup()
+  const [arrow1, setArrow1] = useState(null)
+  const [arrow2, setArrow2] = useState(null)
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm`}>
         <div className="modal-head">
-          <h1 className="title">補助線のコピー </h1>
+          <h1 className="title">{getMessage('modal.auxiliary.copy')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
           </button>
         </div>
         <div className="modal-body">
-          <div className="grid-option-tit">コピーする方向を入力してください</div>
+          <div className="grid-option-tit">{getMessage('modal.auxiliary.copy.info')}</div>
           <div className="grid-option-wrap">
             <div className="grid-option-box">
               <div className="move-form">
-                <p className="mb5">長さ</p>
+                <p className="mb5">{getMessage('length')}</p>
                 <div className="input-move-wrap mb5">
                   <div className="input-move">
                     <input type="text" className="input-origin" defaultValue={910} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button
+                      className={`direction up ${arrow1 === '↑' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow1('↑')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp' }))
+                      }}
+                    ></button>
+                    <button
+                      className={`direction down ${arrow1 === '↓' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow1('↓')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }))
+                      }}
+                    ></button>
+                  </div>
                 </div>
                 <div className="input-move-wrap">
                   <div className="input-move">
                     <input type="text" className="input-origin" defaultValue={910} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button
+                      className={`direction left ${arrow2 === '←' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow2('←')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))
+                      }}
+                    ></button>
+                    <button
+                      className={`direction right ${arrow2 === '→' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow2('→')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' }))
+                      }}
+                    ></button>
+                  </div>
                 </div>
               </div>
-              <div className="direction-move-wrap">
-                <button className="direction up"></button>
-                <button className="direction down act"></button>
-                <button className="direction left"></button>
-                <button className="direction right"></button>
-              </div>
             </div>
           </div>
           <div className="grid-btn-wrap">
-            <button className="btn-frame modal act">保存</button>
+            <button className="btn-frame modal act">{getMessage('modal.common.save')}</button>
           </div>
         </div>
       </div>

src/components/floor-plan/modal/auxiliary/AuxiliaryMove.jsx

@@ -13,6 +13,7 @@ export default function AuxiliaryMove(props) {
   const { getMessage } = useMessage()
   const { closePopup } = usePopup()
   const [arrow1, setArrow1] = useState(null)
+  const [arrow2, setArrow2] = useState(null)
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm`}>
@@ -33,44 +34,46 @@ export default function AuxiliaryMove(props) {
                     <input type="text" className="input-origin" defaultValue={910} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button
+                      className={`direction up ${arrow1 === '↑' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow1('↑')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp' }))
+                      }}
+                    ></button>
+                    <button
+                      className={`direction down ${arrow1 === '↓' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow1('↓')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }))
+                      }}
+                    ></button>
+                  </div>
                 </div>
                 <div className="input-move-wrap">
                   <div className="input-move">
                     <input type="text" className="input-origin" defaultValue={910} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button
+                      className={`direction left ${arrow2 === '←' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow2('←')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))
+                      }}
+                    ></button>
+                    <button
+                      className={`direction right ${arrow2 === '→' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow2('→')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' }))
+                      }}
+                    ></button>
+                  </div>
                 </div>
               </div>
-              <div className="direction-move-wrap">
-                <button
-                  className={`direction up ${arrow1 === '↑' ? 'act' : ''}`}
-                  onClick={() => {
-                    setArrow1('↑')
-                    document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp' }))
-                  }}
-                ></button>
-                <button
-                  className={`direction down ${arrow1 === '↓' ? 'act' : ''}`}
-                  onClick={() => {
-                    setArrow1('↓')
-                    document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }))
-                  }}
-                ></button>
-                <button
-                  className={`direction left ${arrow1 === '←' ? 'act' : ''}`}
-                  onClick={() => {
-                    setArrow1('←')
-                    document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))
-                  }}
-                ></button>
-                <button
-                  className={`direction right ${arrow1 === '→' ? 'act' : ''}`}
-                  onClick={() => {
-                    setArrow1('→')
-                    document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' }))
-                  }}
-                ></button>
-              </div>
             </div>
           </div>
           <div className="grid-btn-wrap">

src/components/floor-plan/modal/auxiliary/AuxiliarySize.jsx

@@ -13,7 +13,7 @@ export default function AuxiliarySize(props) {
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm`}>
         <div className="modal-head">
-          <h1 className="title">補助線サイズ変更 </h1>
+          <h1 className="title">{getMessage('modal.auxiliary.size.edit')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>
             닫기
           </button>
@@ -22,7 +22,7 @@ export default function AuxiliarySize(props) {
           <div className="discrimination-box mb10">
             <div className="d-check-radio pop mb10">
               <input type="radio" name="radio01" id="ra01" />
-              <label htmlFor="ra01">1支店</label>
+              <label htmlFor="ra01">1{getMessage('modal.auxiliary.size.edit.point')}</label>
             </div>
             <div className="outline-form mb15">
               <div className="input-grid mr5" style={{ flex: '1 1 auto' }}>
@@ -31,7 +31,7 @@ export default function AuxiliarySize(props) {
               <span className="thin">mm</span>
             </div>
             <div className="outline-form">
-              <span style={{ width: 'auto' }}>長さ</span>
+              <span style={{ width: 'auto' }}>{getMessage('length')}</span>
               <div className="input-grid mr5">
                 <input type="text" className="input-origin block" defaultValue={100} />
               </div>
@@ -41,7 +41,7 @@ export default function AuxiliarySize(props) {
           <div className="discrimination-box ">
             <div className="d-check-radio pop mb10">
               <input type="radio" name="radio01" id="ra02" />
-              <label htmlFor="ra02">2支店</label>
+              <label htmlFor="ra02">2{getMessage('modal.auxiliary.size.edit.point')}</label>
             </div>
             <div className="outline-form mb15">
               <div className="input-grid mr5" style={{ flex: '1 1 auto' }}>
@@ -50,7 +50,7 @@ export default function AuxiliarySize(props) {
               <span className="thin">mm</span>
             </div>
             <div className="outline-form">
-              <span style={{ width: 'auto' }}>長さ</span>
+              <span style={{ width: 'auto' }}>{getMessage('length')}</span>
               <div className="input-grid mr5">
                 <input type="text" className="input-origin block" defaultValue={100} />
               </div>
@@ -58,7 +58,7 @@ export default function AuxiliarySize(props) {
             </div>
           </div>
           <div className="grid-btn-wrap">
-            <button className="btn-frame modal act">保存</button>
+            <button className="btn-frame modal act">{getMessage('modal.common.save')}</button>
           </div>
         </div>
       </div>

src/components/floor-plan/modal/grid/GridMove.jsx

@@ -34,20 +34,22 @@ export default function GridMove(props) {
                     <input type="text" className="input-origin" defaultValue={910} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button className="direction up"></button>
+                    <button className="direction down act"></button>
+                  </div>
                 </div>
                 <div className="input-move-wrap">
                   <div className="input-move">
                     <input type="text" className="input-origin" defaultValue={910} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button className="direction left"></button>
+                    <button className="direction right"></button>
+                  </div>
                 </div>
               </div>
-              <div className="direction-move-wrap">
-                <button className="direction up"></button>
-                <button className="direction down act"></button>
-                <button className="direction left"></button>
-                <button className="direction right"></button>
-              </div>
             </div>
           </div>
           <div className="grid-btn-wrap">

src/components/floor-plan/modal/object/DormerOffset.jsx

@@ -3,12 +3,15 @@ import WithDraggable from '@/components/common/draggable/WithDraggable'
 import { useRecoilValue } from 'recoil'
 import { contextPopupPositionState } from '@/store/popupAtom'
 import { usePopup } from '@/hooks/usePopup'
+import { useState } from 'react'
 
 export default function DormerOffset(props) {
   const contextPopupPosition = useRecoilValue(contextPopupPositionState)
   const { id, pos = contextPopupPosition } = props
   const { getMessage } = useMessage()
   const { closePopup } = usePopup()
+  const [arrow1, setArrow1] = useState(null)
+  const [arrow2, setArrow2] = useState(null)
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap xm`}>
@@ -29,20 +32,46 @@ export default function DormerOffset(props) {
                     <input type="text" className="input-origin" defaultValue={0} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button
+                      className={`direction up ${arrow1 === '↑' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow1('↑')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp' }))
+                      }}
+                    ></button>
+                    <button
+                      className={`direction down ${arrow1 === '↓' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow1('↓')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }))
+                      }}
+                    ></button>
+                  </div>
                 </div>
                 <div className="input-move-wrap">
                   <div className="input-move">
                     <input type="text" className="input-origin" defaultValue={0} />
                   </div>
                   <span>mm</span>
+                  <div className="direction-move-wrap">
+                    <button
+                      className={`direction left ${arrow2 === '←' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow2('←')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))
+                      }}
+                    ></button>
+                    <button
+                      className={`direction right ${arrow2 === '→' ? 'act' : ''}`}
+                      onClick={() => {
+                        setArrow2('→')
+                        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' }))
+                      }}
+                    ></button>
+                  </div>
                 </div>
               </div>
-              <div className="direction-move-wrap">
-                <button className="direction up"></button>
-                <button className="direction down act"></button>
-                <button className="direction left"></button>
-                <button className="direction right"></button>
-              </div>
             </div>
           </div>
           <div className="grid-btn-wrap">

src/components/floor-plan/modal/object/ObjectSetting.jsx

@@ -19,7 +19,8 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
   const canvas = useRecoilValue(canvasState)
   const [buttonAct, setButtonAct] = useState(1)
   const { swalFire } = useSwal()
-  const { applyOpeningAndShadow, applyDormers } = useObjectBatch()
+  const [isHidden, setIsHidden] = useState(false)
+  const { applyOpeningAndShadow, applyDormers } = useObjectBatch({ isHidden, setIsHidden })
   const { closePopup } = usePopup()
 
   const surfaceShapePolygons = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF)
@@ -58,6 +59,7 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
     }
 
     //개구배치, 그림자배치
+    setIsHidden(true)
     if (buttonAct === 1 || buttonAct === 2) {
       applyOpeningAndShadow(objectPlacement, buttonAct, surfaceShapePolygons)
     } else {
@@ -71,9 +73,10 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
     { id: 3, name: getMessage('modal.object.setting.type.triangle.dormer') },
     { id: 4, name: getMessage('modal.object.setting.type.pentagon.dormer') },
   ]
+  
   return (
     <WithDraggable isShow={true} pos={pos}>
-      <div className={`modal-pop-wrap lrr`}>
+      <div className={`modal-pop-wrap lrr`} style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
         <div className="modal-head">
           <h1 className="title">{getMessage('plan.menu.placement.surface.object')} </h1>
           <button className="modal-close" onClick={() => closePopup(id)}>

src/components/main/MainContents.jsx

@@ -15,7 +15,7 @@ export default function MainContents() {
   const { getMessage } = useMessage()
   const router = useRouter()
   const globalLocaleState = useRecoilValue(globalLocaleStore)
-  const { promiseGet, get } = useAxios(globalLocaleState)
+  const { promiseGet } = useAxios(globalLocaleState)
 
   const sessionState = useRecoilValue(sessionStore)
 
@@ -118,7 +118,7 @@ export default function MainContents() {
                     key={row.objectNo}
                     className="recently-item"
                     onClick={() => {
-                      if (row.objectNo.substring(0, 1) === 'R') {
+                      if (row.tempFlg === '0') {
                         router.push(`/management/stuff/detail?objectNo=${row.objectNo.toString()}`)
                       } else {
                         router.push(`/management/stuff/tempdetail?objectNo=${row.objectNo.toString()}`)

src/components/management/Stuff.jsx

@@ -1,12 +1,11 @@
 'use client'
 
-import React, { useEffect, useState, useRef } from 'react'
+import { useEffect, useState, useRef, useContext } from 'react'
 import { useRouter, usePathname } from 'next/navigation'
-import { Button } from '@nextui-org/react'
 import { useAxios } from '@/hooks/useAxios'
 import { useMessage } from '@/hooks/useMessage'
 import StuffQGrid from './StuffQGrid'
-import { useRecoilValue, useRecoilState } from 'recoil'
+import { useRecoilValue, useRecoilState, useSetRecoilState } from 'recoil'
 import { stuffSearchState } from '@/store/stuffAtom'
 import { queryStringFormatter, isEmptyArray } from '@/util/common-utils'
 import dayjs from 'dayjs'
@@ -17,10 +16,12 @@ import KO from '@/locales/ko.json'
 import JA from '@/locales/ja.json'
 import QPagination from '../common/pagination/QPagination'
 import { sessionStore } from '@/store/commonAtom'
+import { SessionContext } from '@/app/SessionProvider'
 
 export default function Stuff() {
   const sessionState = useRecoilValue(sessionStore)
-  const [appMessageState, setAppMessageState] = useRecoilState(appMessageStore)
+  const { session } = useContext(SessionContext)
+  const setAppMessageState = useSetRecoilState(appMessageStore)
   const stuffSearchParams = useRecoilValue(stuffSearchState)
   const [stuffSearch, setStuffSearch] = useRecoilState(stuffSearchState)
   const { getMessage } = useMessage()
@@ -224,11 +225,31 @@ export default function Stuff() {
 
   // 진입시 그리드 데이터 조회
   useEffect(() => {
-    if (isObjectNotEmpty(sessionState)) {
+    // if (isObjectNotEmpty(sessionState)) {
-      //물건 메뉴 눌러서 최초 진입 sessionState
+    if (isObjectNotEmpty(session)) {
+      //물건 메뉴 눌러서 최초 진입
       if (stuffSearchParams?.code === 'S') {
+        // const params = {
+        //   saleStoreId: sessionState?.storeId,
+        //   schObjectNo: stuffSearchParams?.schObjectNo,
+        //   schAddress: stuffSearchParams?.schAddress,
+        //   schObjectName: stuffSearchParams?.schObjectName,
+        //   schSaleStoreName: stuffSearchParams?.schSaleStoreName,
+        //   schReceiveUser: stuffSearchParams?.schReceiveUser,
+        //   schDispCompanyName: stuffSearchParams?.schDispCompanyName,
+        //   schDateType: stuffSearchParams.schDateType,
+        //   schFromDt: dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'),
+        //   schToDt: dayjs(new Date()).format('YYYY-MM-DD'),
+        //   startRow: (pageNo - 1) * pageSize + 1,
+        //   endRow: pageNo * pageSize,
+        //   schSelSaleStoreId: stuffSearchParams?.schOtherSelSaleStoreId
+        //     ? stuffSearchParams.schOtherSelSaleStoreId
+        //     : stuffSearchParams.schSelSaleStoreId,
+        //   schSortType: stuffSearchParams.schSortType,
+        // }
+
         const params = {
-          saleStoreId: sessionState?.storeId,
+          saleStoreId: session?.storeId,
           schObjectNo: stuffSearchParams?.schObjectNo,
           schAddress: stuffSearchParams?.schAddress,
           schObjectName: stuffSearchParams?.schObjectName,
@@ -260,8 +281,26 @@ export default function Stuff() {
         fetchData()
       } else if (stuffSearchParams?.code === 'M') {
         //메인화면에서 진입
+        // const params = {
+        //   saleStoreId: sessionState?.storeId,
+        //   schObjectNo: stuffSearchParams.schObjectNo,
+        //   schAddress: 'dfdfdfdfdf',
+        //   schObjectName: '',
+        //   schSaleStoreName: '',
+        //   schReceiveUser: '',
+        //   schDispCompanyName: '',
+        //   schDateType: 'U',
+        //   schFromDt: dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'),
+        //   schToDt: dayjs(new Date()).format('YYYY-MM-DD'),
+        //   startRow: (pageNo - 1) * pageSize + 1,
+        //   endRow: pageNo * pageSize,
+        //   schSelSaleStoreId: stuffSearchParams?.schOtherSelSaleStoreId
+        //     ? stuffSearchParams.schOtherSelSaleStoreId
+        //     : stuffSearchParams.schSelSaleStoreId,
+        //   schSortType: 'R',
+        // }
         const params = {
-          saleStoreId: sessionState?.storeId,
+          saleStoreId: session?.storeId,
           schObjectNo: stuffSearchParams.schObjectNo,
           schAddress: 'dfdfdfdfdf',
           schObjectName: '',
@@ -309,7 +348,8 @@ export default function Stuff() {
 
       //조회를 눌렀을때
       async function fetchData() {
-        const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
+        // const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
+        const apiUrl = `/api/object/list?saleStoreId=${session?.storeId}&${queryStringFormatter(stuffSearchParams)}`
         await get({ url: apiUrl }).then((res) => {
           if (!isEmptyArray(res)) {
             setGridProps({ ...gridProps, gridData: res, count: res[0].totCnt })
@@ -341,7 +381,8 @@ export default function Stuff() {
     })
 
     setPageNo(1)
-    const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
+    // const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
+    const apiUrl = `/api/object/list?saleStoreId=${session?.storeId}&${queryStringFormatter(stuffSearchParams)}`
     get({ url: apiUrl }).then((res) => {
       if (!isEmptyArray(res)) {
         setGridProps({ ...gridProps, gridData: res, count: res[0].totCnt })
@@ -373,7 +414,8 @@ export default function Stuff() {
     })
 
     setPageNo(1)
-    const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
+    // const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
+    const apiUrl = `/api/object/list?saleStoreId=${session?.storeId}&${queryStringFormatter(stuffSearchParams)}`
     get({ url: apiUrl }).then((res) => {
       if (!isEmptyArray(res)) {
         setGridProps({ ...gridProps, gridData: res, count: res[0].totCnt })

src/components/management/StuffSearchCondition.jsx

@@ -1,8 +1,8 @@
 'use client'
 
-import React, { useEffect, useRef, useState } from 'react'
+import { useEffect, useRef, useState, useContext } from 'react'
 import { useAxios } from '@/hooks/useAxios'
-import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil'
+import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'
 import { appMessageStore, globalLocaleStore } from '@/store/localeAtom'
 import Select from 'react-select'
 import KO from '@/locales/ko.json'
@@ -15,10 +15,13 @@ import SingleDatePicker from '../common/datepicker/SingleDatePicker'
 import { sessionStore } from '@/store/commonAtom'
 import { useMessage } from '@/hooks/useMessage'
 import { isObjectNotEmpty } from '@/util/common-utils'
-import { searchState } from '@/store/boardAtom'
+
+import { SessionContext } from '@/app/SessionProvider'
+
 export default function StuffSearchCondition() {
+  const { session } = useContext(SessionContext)
   const sessionState = useRecoilValue(sessionStore)
-  const [appMessageState, setAppMessageState] = useRecoilState(appMessageStore)
+  const setAppMessageState = useSetRecoilState(appMessageStore)
   const globalLocaleState = useRecoilValue(globalLocaleStore)
   const { getMessage } = useMessage()
   const ref = useRef()
@@ -128,7 +131,8 @@ export default function StuffSearchCondition() {
     setDateType('U')
     setStartDate(dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'))
     setEndDate(dayjs(new Date()).format('YYYY-MM-DD'))
-    if (sessionState?.storeId === 'T01') {
+    // if (sessionState?.storeId === 'T01') {
+    if (session?.storeId === 'T01') {
       setSchSelSaleStoreId('')
       handleClear1() //판매대리점선택 자동완성 클리어
       resetStuffRecoil()
@@ -152,18 +156,24 @@ export default function StuffSearchCondition() {
   }
 
   useEffect(() => {
-    if (isObjectNotEmpty(sessionState)) {
+    // if (isObjectNotEmpty(sessionState)) {
+    if (isObjectNotEmpty(session)) {
       // storeId가 T01 이거나 storeLvl이 1차점일때만 판매대리점 선택 활성화
       let url
-      if (sessionState?.storeId === 'T01') {
+      // if (sessionState?.storeId === 'T01') {
+      if (session?.storeId === 'T01') {
         //T01일떄
-        url = `/api/object/saleStore/${sessionState?.storeId}/firstList?userId=${sessionState?.userId}`
+        // url = `/api/object/saleStore/${sessionState?.storeId}/firstList?userId=${sessionState?.userId}`
+        url = `/api/object/saleStore/${session?.storeId}/firstList?userId=${session?.userId}`
       } else {
-        if (sessionState.storeLvl === '1') {
+        // if (sessionState.storeLvl === '1') {
+        if (session.storeLvl === '1') {
           //T01아닌 1차점일때
-          url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
+          // url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
+          url = `/api/object/saleStore/${session?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
         } else {
-          url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
+          // url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
+          url = `/api/object/saleStore/${session?.storeId}/list?firstFlg=1&userId=${session?.userId}`
         }
       }
 
@@ -177,22 +187,26 @@ export default function StuffSearchCondition() {
           let allList
           let favList
           let otherList
-          if (sessionState?.storeId === 'T01') {
+          // if (sessionState?.storeId === 'T01') {
+          if (session?.storeId === 'T01') {
             allList = res
             allList.sort((a, b) => (a.saleStoreId !== 'T01') - (b.saleStoreId !== 'T01') || a.saleStoreId - b.saleStoreId)
             favList = res.filter((row) => row.saleStoreId === 'T01' || row.priority !== 'B')
             setSchSelSaleStoreList(allList)
             setFavoriteStoreList(favList)
             setShowSaleStoreList(favList)
-            setSchSelSaleStoreId(sessionState?.storeId)
+            // setSchSelSaleStoreId(sessionState?.storeId)
+            setSchSelSaleStoreId(session?.storeId)
             setStuffSearch({
               ...stuffSearch,
               code: 'S',
-              schSelSaleStoreId: sessionState?.storeId,
+              // schSelSaleStoreId: sessionState?.storeId,
+              schSelSaleStoreId: session?.storeId,
             })
 
-            //T01일때 2차 판매점 호출하기
+            //T01일때 2차 판매점 호출하기 디폴트로 1차점을 본인으로 셋팅해서 세션storeId사용
-            url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=0&userId=${sessionState?.userId}`
+            // url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=0&userId=${sessionState?.userId}`
+            url = `/api/object/saleStore/${session?.storeId}/list?firstFlg=0&userId=${session?.userId}`
 
             get({ url: url }).then((res) => {
               if (!isEmptyArray(res)) {
@@ -208,7 +222,8 @@ export default function StuffSearchCondition() {
               }
             })
           } else {
-            if (sessionState?.storeLvl === '1') {
+            // if (sessionState?.storeLvl === '1') {
+            if (session?.storeLvl === '1') {
               allList = res
               favList = res.filter((row) => row.priority !== 'B')
               otherList = res.filter((row) => row.firstAgentYn === 'N')
@@ -235,7 +250,8 @@ export default function StuffSearchCondition() {
               setOtherSaleStoreList(otherList)
 
               //선택한 2차점 세션으로 자동셋팅
-              setOtherSaleStoreId(sessionState?.storeId)
+              // setOtherSaleStoreId(sessionState?.storeId)
+              setOtherSaleStoreId(session?.storeId)
               setStuffSearch({
                 ...stuffSearch,
                 code: 'S',
@@ -246,7 +262,8 @@ export default function StuffSearchCondition() {
         }
       })
     }
-  }, [sessionState])
+    // }, [sessionState])
+  }, [session])
 
   //초기화 눌렀을 때 1차판매점 자동완성도..
   const handleClear1 = () => {
@@ -279,7 +296,8 @@ export default function StuffSearchCondition() {
       stuffSearch.schSelSaleStoreId = key.saleStoreId
       //T01아닌 1차점은 본인으로 디폴트셋팅이고 수정할수없어서 여기안옴
       //고른 1차점의 saleStoreId로 2차점 API호출하기
-      let url = `/api/object/saleStore/${key.saleStoreId}/list?firstFlg=0&userId=${sessionState?.userId}`
+      // let url = `/api/object/saleStore/${key.saleStoreId}/list?firstFlg=0&userId=${sessionState?.userId}`
+      let url = `/api/object/saleStore/${key.saleStoreId}/list?firstFlg=0&userId=${session?.userId}`
       let otherList
       get({ url: url }).then((res) => {
         if (!isEmptyArray(res)) {
@@ -470,7 +488,8 @@ export default function StuffSearchCondition() {
                 <td colSpan={3}>
                   <div className="form-flex-wrap">
                     <div className="select-wrap mr5" style={{ flex: 1 }}>
-                      {sessionState?.storeId === 'T01' && (
+                      {/* {sessionState?.storeId === 'T01' && ( */}
+                      {session?.storeId === 'T01' && (
                         <Select
                           id="long-value-select1"
                           instanceId="long-value-select1"
@@ -483,7 +502,7 @@ export default function StuffSearchCondition() {
                           onChange={onSelectionChange}
                           getOptionLabel={(x) => x.saleStoreName}
                           getOptionValue={(x) => x.saleStoreId}
-                          value={showSaleStoreList.filter(function (option) {
+                          value={schSelSaleStoreList.filter(function (option) {
                             if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
                               return false
                             } else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
@@ -498,11 +517,13 @@ export default function StuffSearchCondition() {
                               }
                             }
                           })}
-                          isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
+                          // isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
+                          isDisabled={session?.storeLvl !== '1' ? true : session?.storeId !== 'T01' ? true : false}
                           isClearable={true}
                         />
                       )}
-                      {sessionState?.storeId !== 'T01' && sessionState?.storeLvl === '1' && (
+                      {/* {sessionState?.storeId !== 'T01' && sessionState?.storeLvl === '1' && ( */}
+                      {session?.storeId !== 'T01' && session?.storeLvl === '1' && (
                         <Select
                           id="long-value-select1"
                           instanceId="long-value-select1"
@@ -529,11 +550,13 @@ export default function StuffSearchCondition() {
                               }
                             }
                           })}
-                          isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
+                          // isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
+                          isDisabled={session?.storeLvl !== '1' ? true : session?.storeId !== 'T01' ? true : false}
                           isClearable={false}
                         />
                       )}
-                      {sessionState?.storeId !== 'T01' && sessionState?.storeLvl !== '1' && (
+                      {/* {sessionState?.storeId !== 'T01' && sessionState?.storeLvl !== '1' && ( */}
+                      {session?.storeId !== 'T01' && session?.storeLvl !== '1' && (
                         <Select
                           id="long-value-select1"
                           instanceId="long-value-select1"

src/hooks/object/useObjectBatch.js

@@ -4,13 +4,13 @@ import { useRecoilValue } from 'recoil'
 import { canvasState } from '@/store/canvasAtom'
 import { BATCH_TYPE, INPUT_TYPE } from '@/common/common'
 import { useEvent } from '@/hooks/useEvent'
-import { pointsToTurfPolygon, polygonToTurfPolygon, rectToPolygon, triangleToPolygon, setSurfaceShapePattern } from '@/util/canvas-util'
+import { pointsToTurfPolygon, polygonToTurfPolygon, rectToPolygon, setSurfaceShapePattern, triangleToPolygon } from '@/util/canvas-util'
 import { useSwal } from '@/hooks/useSwal'
 import * as turf from '@turf/turf'
 import { usePolygon } from '@/hooks/usePolygon'
 import { QPolygon } from '@/components/fabric/QPolygon'
 
-export function useObjectBatch() {
+export function useObjectBatch({ isHidden, setIsHidden }) {
   const { getMessage } = useMessage()
   const canvas = useRecoilValue(canvasState)
   const { addCanvasMouseEventListener, initEvent } = useEvent()
@@ -21,12 +21,12 @@ export function useObjectBatch() {
     const selectedType = objectPlacement.typeRef.current.find((radio) => radio.checked).value
     const isCrossChecked = buttonAct === 1 ? objectPlacement.isCrossRef.current.checked : false
     const objName = buttonAct === 1 ? BATCH_TYPE.OPENING : BATCH_TYPE.SHADOW
-    const objTempName = buttonAct === 1 ? BATCH_TYPE.OPENING_TEMP : BATCH_TYPE.SHADOW_TEMP
 
+    const objTempName = buttonAct === 1 ? BATCH_TYPE.OPENING_TEMP : BATCH_TYPE.SHADOW_TEMP
     let rect, isDown, origX, origY
     let selectedSurface
-
     //프리입력
+    console.log('useObjectBatch', isHidden)
     if (selectedType === INPUT_TYPE.FREE) {
       addCanvasMouseEventListener('mouse:down', (e) => {
         isDown = true
@@ -41,6 +41,7 @@ export function useObjectBatch() {
         if (!selectedSurface) {
           swalFire({ text: '지붕안에 그려야해요', icon: 'error' })
           initEvent() //이벤트 초기화
+          if (setIsHidden) setIsHidden(false)
           return
         }
 
@@ -117,6 +118,8 @@ export function useObjectBatch() {
           rect.set({ name: objName })
           rect.setCoords()
           initEvent()
+
+          if (setIsHidden) setIsHidden(false)
         }
       })
     } else if (selectedType === INPUT_TYPE.DIMENSION) {
@@ -196,6 +199,7 @@ export function useObjectBatch() {
           rect.set({ name: objName })
           rect.setCoords()
           initEvent()
+          if (setIsHidden) setIsHidden(false)
         }
       })
     }
@@ -399,6 +403,7 @@ export function useObjectBatch() {
 
           isDown = false
           initEvent()
+          if (setIsHidden) setIsHidden(false)
         }
       })
     } else if (buttonAct === 4) {
@@ -494,6 +499,7 @@ export function useObjectBatch() {
           //지붕 밖으로 그렸을때
           if (!turf.booleanWithin(pentagonPolygon, selectedSurfacePolygon)) {
             swalFire({ text: '개구를 배치할 수 없습니다.', icon: 'error' })
+
             //일단 지워
             deleteTempObjects()
             return
@@ -574,6 +580,7 @@ export function useObjectBatch() {
 
           isDown = false
           initEvent()
+          if (setIsHidden) setIsHidden(false)
         }
       })
     }
@@ -591,6 +598,7 @@ export function useObjectBatch() {
       )
     canvas?.remove(...deleteTarget)
     initEvent() //이벤트 초기화
+    if (setIsHidden) setIsHidden(false)
   }
 
   const splitDormerTriangle = (triangle, direction) => {
@@ -690,28 +698,40 @@ export function useObjectBatch() {
       leftPoints = [
         { x: points[0].x, y: points[0].y },
         { x: points[0].x - (points[1].y - points[0].y), y: points[0].y - (points[0].x - points[1].x) },
-        { x: points[0].x - (points[1].y - points[0].y) - (points[2].y - points[1].y), y: points[0].y - (points[0].x - points[1].x) },
+        {
+          x: points[0].x - (points[1].y - points[0].y) - (points[2].y - points[1].y),
+          y: points[0].y - (points[0].x - points[1].x),
+        },
         { x: points[0].x - (points[1].y - points[0].y) - (points[2].y - points[1].y), y: points[0].y },
       ]
 
       rightPoints = [
         { x: points[0].x, y: points[0].y },
         { x: points[0].x - (points[1].y - points[0].y), y: points[0].y + (points[0].x - points[1].x) },
-        { x: points[0].x - (points[1].y - points[0].y) - (points[2].y - points[1].y), y: points[0].y + (points[0].x - points[1].x) },
+        {
+          x: points[0].x - (points[1].y - points[0].y) - (points[2].y - points[1].y),
+          y: points[0].y + (points[0].x - points[1].x),
+        },
         { x: points[0].x - (points[1].y - points[0].y) - (points[2].y - points[1].y), y: points[0].y },
       ]
     } else if (direction === 'right') {
       leftPoints = [
         { x: points[0].x, y: points[0].y },
         { x: points[0].x + (points[1].y - points[0].y), y: points[0].y + (points[0].x - points[1].x) },
-        { x: points[0].x + (points[1].y - points[0].y) + (points[2].y - points[1].y), y: points[0].y + (points[0].x - points[1].x) },
+        {
+          x: points[0].x + (points[1].y - points[0].y) + (points[2].y - points[1].y),
+          y: points[0].y + (points[0].x - points[1].x),
+        },
         { x: points[0].x + (points[1].y - points[0].y) + (points[2].y - points[1].y), y: points[0].y },
       ]
 
       rightPoints = [
         { x: points[0].x, y: points[0].y },
         { x: points[0].x + (points[1].y - points[0].y), y: points[0].y - (points[0].x - points[1].x) },
-        { x: points[0].x + (points[1].y - points[0].y) + (points[2].y - points[1].y), y: points[0].y - (points[0].x - points[1].x) },
+        {
+          x: points[0].x + (points[1].y - points[0].y) + (points[2].y - points[1].y),
+          y: points[0].y - (points[0].x - points[1].x),
+        },
         { x: points[0].x + (points[1].y - points[0].y) + (points[2].y - points[1].y), y: points[0].y },
       ]
     }

src/hooks/useContextMenu.js

@@ -10,7 +10,7 @@ import GridMove from '@/components/floor-plan/modal/grid/GridMove'
 import GridCopy from '@/components/floor-plan/modal/grid/GridCopy'
 import ColorPickerModal from '@/components/common/color-picker/ColorPickerModal'
 import { gridColorState } from '@/store/gridAtom'
-import { contextPopupPositionState } from '@/store/popupAtom'
+import { contextPopupPositionState, contextPopupState } from '@/store/popupAtom'
 import AuxiliaryCopy from '@/components/floor-plan/modal/auxiliary/AuxiliaryCopy'
 import SizeSetting from '@/components/floor-plan/modal/object/SizeSetting'
 import RoofMaterialSetting from '@/components/floor-plan/modal/object/RoofMaterialSetting'
@@ -37,7 +37,7 @@ export function useContextMenu() {
   const currentMenu = useRecoilValue(currentMenuState) // 현재 메뉴
   const setContextPopupPosition = useSetRecoilState(contextPopupPositionState) // 현재 메뉴
   const [contextMenu, setContextMenu] = useState([[]]) // 메뉴.object 별 context menu
-  const [currentContextMenu, setCurrentContextMenu] = useState(null) // 선택한 contextMenu
+  const [currentContextMenu, setCurrentContextMenu] = useRecoilState(contextPopupState) // 선택한 contextMenu
   const currentObject = useRecoilValue(currentObjectState)
   const { getMessage } = useMessage()
   const { addPopup } = usePopup()

src/hooks/usePopup.js

@@ -1,14 +1,15 @@
 import { useRecoilState } from 'recoil'
-import { popupState } from '@/store/popupAtom'
+import { contextPopupState, popupState } from '@/store/popupAtom'
 
 export function usePopup() {
   const [popup, setPopup] = useRecoilState(popupState)
-
+  const [contextMenuPopup, setContextMenuPopup] = useRecoilState(contextPopupState)
   const addPopup = (id, depth, component) => {
     setPopup({ children: [...filterDepth(depth), { id: id, depth: depth, component: component }] })
   }
 
   const closePopup = (id) => {
+    if (contextMenuPopup) setContextMenuPopup(null)
     setPopup({ children: [...filterChildrenPopup(id).filter((child) => child.id !== id)] })
   }
 

src/locales/ja.json

@@ -293,10 +293,14 @@
   "contextmenu.select.move": "선택・이동(JA)",
   "contextmenu.wallline.remove": "외벽선 삭제(JA)",
   "contextmenu.size.edit": "サイズ変更",
+  "modal.auxiliary.size.edit": "補助線サイズ変更",
+  "modal.auxiliary.size.edit.point": "支店",
   "contextmenu.auxiliary.move": "補助線の移動",
   "modal.auxiliary.move": "補助線の移動",
   "modal.auxiliary.move.info": "移動する方向を入力してください",
-  "contextmenu.auxiliary.copy": "보조선 복사(JA)",
+  "contextmenu.auxiliary.copy": "補助線のコピー",
+  "modal.auxiliary.copy": "補助線のコピー",
+  "modal.auxiliary.copy.info": "コピーする方向を入力してください",
   "contextmenu.auxiliary.remove": "보조선 삭제(JA)",
   "contextmenu.auxiliary.vertical.bisector": "보조선 수직이등분선(JA)",
   "contextmenu.auxiliary.cut": "보조선 절삭(JA)",

src/locales/ko.json

@@ -298,10 +298,14 @@
   "contextmenu.select.move": "선택・이동",
   "contextmenu.wallline.remove": "외벽선 삭제",
   "contextmenu.size.edit": "사이즈 변경",
+  "modal.auxiliary.size.edit": "보조선 사이즈 변경",
+  "modal.auxiliary.size.edit.point": "지점",
   "contextmenu.auxiliary.move": "보조선 이동",
   "modal.auxiliary.move": "보조선 이동",
   "modal.auxiliary.move.info": "이동할 방향을 입력해주세요.",
   "contextmenu.auxiliary.copy": "보조선 복사",
+  "modal.auxiliary.copy": "보조선 복사",
+  "modal.auxiliary.copy.info": "복사할 방향을 입력해주세요.",
   "contextmenu.auxiliary.remove": "보조선 삭제",
   "contextmenu.auxiliary.vertical.bisector": "보조선 수직이등분선",
   "contextmenu.auxiliary.cut": "보조선 절삭",

src/store/popupAtom.js

@@ -12,6 +12,12 @@ export const popupState = atom({
   dangerouslyAllowMutability: true,
 })
 
+export const contextPopupState = atom({
+  key: 'contextPopupState',
+  default: null,
+  dangerouslyAllowMutability: true,
+})
+
 export const contextPopupPositionState = atom({
   key: 'contextPopupPositionState',
   default: {