From 0e1aa51d4bc84ebe12c1e5f6691d08d2231d01a9 Mon Sep 17 00:00:00 2001
From: MrKBear <mrkbear@qq.com>
Date: Mon, 7 Mar 2022 20:29:42 +0800
Subject: [PATCH] Fix input clean error

---
 source/Component/AttrInput/AttrInput.scss  | 13 +++++++++----
 source/Component/AttrInput/AttrInput.tsx   | 21 +++++++++++++++------
 source/Model/Layout.ts                     | 14 +++++++++-----
 source/Panel/RangeDetails/RangeDetails.tsx | 14 ++++++++++++--
 4 files changed, 45 insertions(+), 17 deletions(-)

diff --git a/source/Component/AttrInput/AttrInput.scss b/source/Component/AttrInput/AttrInput.scss
index 78678d7..727a96e 100644
--- a/source/Component/AttrInput/AttrInput.scss
+++ b/source/Component/AttrInput/AttrInput.scss
@@ -1,9 +1,12 @@
 @import "../Theme/Theme.scss";
 
+$line-min-height: 24px;
+$root-min-height: 26px;
+
 div.attr-input {
 	width: 100%;
 	display: flex;
-	min-height: 24px;
+	min-height: $line-min-height;
 	padding: 5px 0;
 
 	div.input-intro {
@@ -20,6 +23,7 @@ div.attr-input {
         width: 50%;
         height: 100%;
         max-width: 180px;
+        min-height: $root-min-height;
 
         div.input-content {
             box-sizing: border-box;
@@ -29,13 +33,14 @@ div.attr-input {
             display: flex;
             justify-content: space-between;
             align-items: center;
-            min-height: 24px;
+            min-height: $root-min-height;
     
             input {
                 width: 100%;
                 height: 100%;
                 border: none;
                 outline:none;
+                min-height: $line-min-height;
             };
     
             input:focus {
@@ -43,7 +48,7 @@ div.attr-input {
             }
     
             div.button-left, div.button-right {
-                min-height: 24px;
+                min-height: $line-min-height;
                 height: 100%;
                 display: flex;
                 justify-content: center;
@@ -66,7 +71,7 @@ div.attr-input {
         div.err-message {
             color: $lt-red;
             padding-top: 5px;
-            min-height: 24px;
+            min-height: $line-min-height;
         }
     }
 }
diff --git a/source/Component/AttrInput/AttrInput.tsx b/source/Component/AttrInput/AttrInput.tsx
index fba16e8..37213fa 100644
--- a/source/Component/AttrInput/AttrInput.tsx
+++ b/source/Component/AttrInput/AttrInput.tsx
@@ -55,6 +55,10 @@ class AttrInput extends Component<IAttrInputProps> {
 
     private handelValueChange = () => {
         if (!this.error && this.props.valueChange) {
+            if (this.props.isNumber) {
+                let numberVal = (this.value as any) * 10000;
+                this.value = (Math.round(numberVal) / 10000).toString();
+            }
             this.props.valueChange(this.value);
         }
         this.forceUpdate();
@@ -122,13 +126,18 @@ class AttrInput extends Component<IAttrInputProps> {
         </>
     }
 
-	public render(): ReactNode {
+    public shouldComponentUpdate(nextProps: IAttrInputProps) {
+        this.updateValueFromProps(nextProps.value);
+        return true;
+    }
 
-        if (!this.error) {
-            const value = this.props.value ?? (this.props.isNumber ? "0" : "");
-            this.value = value.toString();
-            this.error = this.check(value.toString());
-        }
+    private updateValueFromProps(val: IAttrInputProps["value"]) {
+        const value = val ?? (this.props.isNumber ? "0" : "");
+        this.value = value.toString();
+        this.error = this.check(value.toString());
+    }
+
+	public render(): ReactNode {
 
 		return <Theme
             className="attr-input"
diff --git a/source/Model/Layout.ts b/source/Model/Layout.ts
index 72002a0..4c14eba 100644
--- a/source/Model/Layout.ts
+++ b/source/Model/Layout.ts
@@ -74,7 +74,7 @@ class Layout extends Emitter<ILayoutEvent> {
 	}
 
 	public focus = (panelId: string) => {
-		if (panelId === "") {
+		if (panelId === "" && this.focusId !== "") {
 			this.focusId = panelId;
 			this.emit("switchTab", this);
 		}
@@ -89,10 +89,14 @@ class Layout extends Emitter<ILayoutEvent> {
 					}
 				}
 				if (index >= 0) {
-					layout.focusPanel = panelId;
-					this.focusId = panelId;
-					this.emit("switchTab", this);
-					return true;
+					if (layout.focusPanel === panelId && this.focusId === panelId) {
+						return true;
+					} else {
+						layout.focusPanel = panelId;
+						this.focusId = panelId;
+						this.emit("switchTab", this);
+						return true;
+					}
 				}
 			}
 		})
diff --git a/source/Panel/RangeDetails/RangeDetails.tsx b/source/Panel/RangeDetails/RangeDetails.tsx
index 57d2e34..d54160a 100644
--- a/source/Panel/RangeDetails/RangeDetails.tsx
+++ b/source/Panel/RangeDetails/RangeDetails.tsx
@@ -40,17 +40,27 @@ class RangeDetails extends Component<IMixinStatusProps> {
                 }}
             />
             <AttrInput
+                isNumber={true}
+                step={.1}
                 keyI18n="Common.Attr.Key.Position.Y"
                 value={range.position[1]}
                 valueChange={(e) => {
-                    this.props.status ? this.props.status.changeRangeAttrib(range.id, "displayName", e) : null;
+                    if (this.props.status) {
+                        range.position[1] = (e as any) / 1;
+                        this.props.status.changeRangeAttrib(range.id, "position", range.position);
+                    }
                 }}
             />
             <AttrInput
+                isNumber={true}
+                step={.1}
                 keyI18n="Common.Attr.Key.Position.Z"
                 value={range.position[2]}
                 valueChange={(e) => {
-                    this.props.status ? this.props.status.changeRangeAttrib(range.id, "displayName", e) : null;
+                    if (this.props.status) {
+                        range.position[2] = (e as any) / 1;
+                        this.props.status.changeRangeAttrib(range.id, "position", range.position);
+                    }
                 }}
             />
 		</>