Merge branch 'qcast-pub' into dev

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/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/locales/ja.json

@@ -296,7 +296,9 @@
   "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)",