From f09cce0e6a9543c9f7a9f8c15847529ade8337ed Mon Sep 17 00:00:00 2001
From: minsik <pro.mskim0215@gmail.com>
Date: Tue, 22 Oct 2024 10:13:37 +0900
Subject: [PATCH] =?UTF-8?q?=EB=8F=84=EB=A9=B4=20=ED=81=AC=EA=B8=B0=20?=
 =?UTF-8?q?=EC=84=A4=EC=A0=95=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../setting01/planSize/PlanSizeSetting.jsx    | 67 +++++++++++++++++++
 1 file changed, 67 insertions(+)
 create mode 100644 src/components/floor-plan/modal/setting01/planSize/PlanSizeSetting.jsx

diff --git a/src/components/floor-plan/modal/setting01/planSize/PlanSizeSetting.jsx b/src/components/floor-plan/modal/setting01/planSize/PlanSizeSetting.jsx
new file mode 100644
index 00000000..0986fa57
--- /dev/null
+++ b/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>
+  )
+}