도면 크기 설정 추가

src/components/floor-plan/modal/setting01/planSize/PlanSizeSetting.jsx

@@ -0,0 +1,67 @@
+import WithDraggable from '@/components/common/draggable/withDraggable'
+import { usePopup } from '@/hooks/usePopup'
+import { useMessage } from '@/hooks/useMessage'
+import { useState } from 'react'
+
+export default function PlanSizeSetting(props) {
+  const { horizon, setHorizon, vertical, setVertical, id, pos = { x: 985, y: 180 }, setIsShow } = props
+  const { closePopup } = usePopup()
+  const { getMessage } = useMessage()
+  const [originHorizon, setOriginHorizon] = useState(horizon)
+  const [originVertical, setOriginVertical] = useState(vertical)
+
+  return (
+    <WithDraggable isShow={true} pos={pos}>
+      <div className={`modal-pop-wrap xsm`}>
+        <div className="modal-head">
+          <h1 className="title">{getMessage('modal.canvas.setting.font.plan.absorption.plan.size.setting')}</h1>
+          <button
+            className="modal-close"
+            onClick={() => {
+              setIsShow(false)
+              closePopup(id)
+            }}
+          >
+            닫기
+          </button>
+        </div>
+        <div className="modal-body">
+          <div className="slope-wrap">
+            <div className="outline-form mb10">
+              <span style={{ width: 'auto' }}>{getMessage('common.horizon')}</span>
+              <div className="input-grid mr5" style={{ width: '90px' }}>
+                <input type="text" className="input-origin block" value={originHorizon} onChange={(e) => setOriginHorizon(Number(e.target.value))} />
+              </div>
+              <span className="thin">mm</span>
+            </div>
+            <div className="outline-form">
+              <span style={{ width: 'auto' }}>{getMessage('common.vertical')}</span>
+              <div className="input-grid mr5" style={{ width: '90px' }}>
+                <input
+                  type="text"
+                  className="input-origin block"
+                  value={originVertical}
+                  onChange={(e) => setOriginVertical(Number(e.target.value))}
+                />
+              </div>
+              <span className="thin">mm</span>
+            </div>
+          </div>
+          <div className="grid-btn-wrap">
+            <button
+              className="btn-frame modal act"
+              onClick={() => {
+                setHorizon(originHorizon)
+                setVertical(originVertical)
+                setIsShow(false)
+                closePopup(id)
+              }}
+            >
+              {getMessage('modal.common.save')}
+            </button>
+          </div>
+        </div>
+      </div>
+    </WithDraggable>
+  )
+}