From fa9a26e3f573b009dde860e4f3d4ec68ba71f716 Mon Sep 17 00:00:00 2001
From: Cmen <1176967590@qq.com>
Date: Tue, 8 Mar 2022 21:22:16 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=AF=E6=8C=81=E6=A0=B9=E6=8D=AE=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E7=BB=93=E6=9E=9C=E5=AE=9A=E4=BD=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/editor/Plot/Tools/SearchModal.tsx | 14 ++++++++++++--
 src/editor/Plot/index.less            | 11 +++++++++++
 src/map/MapEditor.ts                  |  7 ++++++-
 src/map/type.ts                       |  1 +
 src/store/actions/index.ts            |  5 +++++
 src/types/amap.d.ts                   |  2 +-
 6 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/src/editor/Plot/Tools/SearchModal.tsx b/src/editor/Plot/Tools/SearchModal.tsx
index 85a6e4c..63b97de 100644
--- a/src/editor/Plot/Tools/SearchModal.tsx
+++ b/src/editor/Plot/Tools/SearchModal.tsx
@@ -22,6 +22,12 @@ export const SearchModal = (props: SearchModalProps) => {
     delaySearch(keyword);
   };
 
+  const selectPlace = (item: AMap.SearchResultItem) => {
+    editorAction.moveTo(item);
+    onCancel();
+    setKeyword("");
+  };
+
   return (
     <Modal visible={visible} onCancel={onCancel} footer={[]} title="搜索定位">
       <Input
@@ -30,8 +36,12 @@ export const SearchModal = (props: SearchModalProps) => {
         onChange={(e) => searchPlace(e.target.value)}
       />
       <div className="search-result-container">
-        {searchResults.map((item) => (
-          <div key={item.name} className="search-result-item">
+        {searchResults.map((item, index) => (
+          <div
+            key={index}
+            className="search-result-item"
+            onClick={() => selectPlace(item)}
+          >
             {item.name}
           </div>
         ))}
diff --git a/src/editor/Plot/index.less b/src/editor/Plot/index.less
index 83e5ae8..b655f0f 100644
--- a/src/editor/Plot/index.less
+++ b/src/editor/Plot/index.less
@@ -41,3 +41,14 @@
     }
   }
 }
+.search-result-container{
+  padding: 8px 0;
+}
+.search-result-item{
+  padding: 4px;
+  cursor: pointer;
+  &:hover{
+    background-color: #eee;
+    text-decoration: underline;
+  }
+}
\ No newline at end of file
diff --git a/src/map/MapEditor.ts b/src/map/MapEditor.ts
index 7aaa434..d7e27b3 100644
--- a/src/map/MapEditor.ts
+++ b/src/map/MapEditor.ts
@@ -67,7 +67,7 @@ export class MapEditor extends Emitter implements IMapEditor {
     });
     this._map = new AMap.Map(this.dom);
     this.autoComplete = new AMap.AutoComplete({});
-    this.placeSearch = new AMap.PlaceSearch(this._map);
+    this.placeSearch = new AMap.PlaceSearch({ map: this._map });
     this.initEditors();
     // Space的key是空字符串, 这就离谱.
     registerHotkey(" ", { callback: this.finishEditOverlay.bind(this) });
@@ -233,6 +233,11 @@ export class MapEditor extends Emitter implements IMapEditor {
     });
   }
 
+  moveTo(item: AMap.SearchResultItem) {
+    this.placeSearch?.setCity(item.adcode);
+    this.placeSearch?.search(item.name);
+  }
+
   _buildFromOverlay(overlay: IOverlay) {
     const { type, id } = overlay;
     const editor = this.overlayEditors.find(
diff --git a/src/map/type.ts b/src/map/type.ts
index 37e970b..3ea2650 100644
--- a/src/map/type.ts
+++ b/src/map/type.ts
@@ -14,6 +14,7 @@ export interface IMapEditor {
   getZoom(): number;
   updateOverlayBackground(id: string, src?: string): void;
   searchPlace(keyword: string): Promise<AMap.SearchResultItem[]>;
+  moveTo(item: AMap.SearchResultItem): void;
 }
 
 export enum OverlayCategory {
diff --git a/src/store/actions/index.ts b/src/store/actions/index.ts
index 5b5790c..e94eaec 100644
--- a/src/store/actions/index.ts
+++ b/src/store/actions/index.ts
@@ -168,6 +168,11 @@ export class EditorAction {
     this.dispatch(StoreAction.searchPlace(results));
   }
 
+  moveTo(item: AMap.SearchResultItem) {
+    this.dispatch(StoreAction.searchPlace([]));
+    this.mapEditor?.moveTo(item);
+  }
+
   private _openGeoJSON(geojson: GeoJSON.FeatureCollection) {
     console.log(geojson);
   }
diff --git a/src/types/amap.d.ts b/src/types/amap.d.ts
index 79520aa..e09c15b 100644
--- a/src/types/amap.d.ts
+++ b/src/types/amap.d.ts
@@ -33,7 +33,7 @@ declare global {
       //
     }
     class PlaceSearch {
-      constructor(map: AMap.Map);
+      constructor(props: { map: AMap.Map });
       setCity(code: string): void;
       search(name: string): void;
     }