From 07103edf74f97bdfbe8b01e7f3194db064d27696 Mon Sep 17 00:00:00 2001
From: Cmen <1176967590@qq.com>
Date: Mon, 7 Mar 2022 08:46:24 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=AF=E6=8C=81=E8=AE=BE=E7=BD=AE=E5=BB=BA?=
 =?UTF-8?q?=E7=AD=91=E9=AB=98=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/editor/Property/FineInput.tsx | 19 +++++++++++++++++++
 src/editor/Property/index.tsx     | 24 ++++++++++++++++++++----
 2 files changed, 39 insertions(+), 4 deletions(-)
 create mode 100644 src/editor/Property/FineInput.tsx

diff --git a/src/editor/Property/FineInput.tsx b/src/editor/Property/FineInput.tsx
new file mode 100644
index 0000000..3298d5a
--- /dev/null
+++ b/src/editor/Property/FineInput.tsx
@@ -0,0 +1,19 @@
+import { Input } from "antd";
+import { useState } from "react";
+
+export type FineInputProps = {
+  value: string | number;
+  onChange: (value: string) => void;
+};
+
+export const FineInput = (props: FineInputProps) => {
+  const [value, setValue] = useState(props.value);
+
+  return (
+    <Input
+      value={value}
+      onChange={(e) => setValue(e.target.value)}
+      onBlur={(e) => props.onChange(e.target.value)}
+    />
+  );
+};
diff --git a/src/editor/Property/index.tsx b/src/editor/Property/index.tsx
index dfb96ce..7540a4f 100644
--- a/src/editor/Property/index.tsx
+++ b/src/editor/Property/index.tsx
@@ -3,9 +3,12 @@ import { Form, Input, Select } from "antd";
 import { selectedIdsSelector, mapOptionsSelector, StoreAction } from "@store";
 import { OverlayCategory, IOverlay } from "@map";
 
-import "./index.less";
 import { OverlayTypes } from "@types";
 
+import { FineInput } from "./FineInput";
+
+import "./index.less";
+
 type CategoryItem = {
   title: string;
   value: OverlayCategory;
@@ -40,12 +43,12 @@ const Property = () => {
     <div className="property-area">
       <Form size="small">
         <Form.Item label="名称">
-          <Input
+          <FineInput
             value={overlay.name}
-            onChange={(e) =>
+            onChange={(value) =>
               updateOverlayProps({
                 id: overlay.id,
-                name: e.target.value,
+                name: value,
               })
             }
           />
@@ -67,6 +70,19 @@ const Property = () => {
             ))}
           </Select>
         </Form.Item>
+        {overlay.category === OverlayCategory.Building ? (
+          <Form.Item label="高度">
+            <FineInput
+              value={overlay.height || 0}
+              onChange={(value) =>
+                updateOverlayProps({
+                  id: overlay.id,
+                  height: +value,
+                })
+              }
+            />
+          </Form.Item>
+        ) : null}
       </Form>
     </div>
   );