From f9bd3fc3b44dc240f27b05b57b2fa738660b5998 Mon Sep 17 00:00:00 2001
From: unanmed <1319491857@qq.com>
Date: Fri, 26 Sep 2025 12:17:47 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B5=8F=E8=A7=88=E5=9C=B0=E5=9B=BE?=
 =?UTF-8?q?=E7=95=8C=E9=9D=A2=E5=9C=A8=E5=9C=B0=E5=9B=BE=E4=B8=8A=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E4=B8=89=E4=B8=AA=E5=8A=9F=E8=83=BD=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../client-modules/src/render/shared.ts       |  4 ++
 .../client-modules/src/render/ui/viewmap.tsx  | 66 ++++++++++++++++---
 2 files changed, 62 insertions(+), 8 deletions(-)

diff --git a/packages-user/client-modules/src/render/shared.ts b/packages-user/client-modules/src/render/shared.ts
index 264dbd4..cda67b3 100644
--- a/packages-user/client-modules/src/render/shared.ts
+++ b/packages-user/client-modules/src/render/shared.ts
@@ -14,6 +14,10 @@ export const MAP_BLOCK_HEIGHT = 15;
 export const MAP_WIDTH = CELL_SIZE * MAP_BLOCK_WIDTH;
 /** 地图像素高度 */
 export const MAP_HEIGHT = CELL_SIZE * MAP_BLOCK_HEIGHT;
+/** 地图宽度的一半 */
+export const HALF_MAP_WIDTH = MAP_WIDTH / 2;
+/** 地图高度的一半 */
+export const HALF_MAP_HEIGHT = MAP_HEIGHT / 2;
 
 //#region 状态栏
 
diff --git a/packages-user/client-modules/src/render/ui/viewmap.tsx b/packages-user/client-modules/src/render/ui/viewmap.tsx
index 495e5e4..82a7364 100644
--- a/packages-user/client-modules/src/render/ui/viewmap.tsx
+++ b/packages-user/client-modules/src/render/ui/viewmap.tsx
@@ -41,7 +41,8 @@ import { useKey } from '../use';
 import {
     ENABLE_RIGHT_STATUS_BAR,
     FULL_LOC,
-    HALF_WIDTH,
+    HALF_MAP_WIDTH,
+    HALF_STATUS_WIDTH,
     MAIN_HEIGHT,
     MAP_HEIGHT,
     MAP_WIDTH,
@@ -70,6 +71,12 @@ export const ViewMap = defineComponent<ViewMapProps>(props => {
         new LayerGroupAnimate()
     ];
 
+    const restHeight = STATUS_BAR_HEIGHT - 292;
+    const col = restHeight / 4;
+    const loc1: ElementLocator = [HALF_STATUS_WIDTH, col * 1 + 292];
+    const loc2: ElementLocator = [HALF_STATUS_WIDTH, col * 2 + 292];
+    const loc3: ElementLocator = [HALF_STATUS_WIDTH, col * 3 + 292];
+
     const rightFont = new Font(Font.defaultFamily, 15);
 
     const viewableFloor = markRaw(
@@ -213,6 +220,28 @@ export const ViewMap = defineComponent<ViewMapProps>(props => {
         group.value?.update();
     };
 
+    //#region 事件监听
+
+    const clickTop = (ev: IActionEvent) => {
+        const col = MAP_WIDTH / 3;
+        if (ev.offsetX < col * 2) {
+            changeFloor(1);
+        } else {
+            resetCamera();
+        }
+    };
+
+    const clickBottom = (ev: IActionEvent) => {
+        const col = MAP_WIDTH / 3;
+        if (ev.offsetX < col) {
+            openBook();
+        } else if (ev.offsetX < col * 2) {
+            changeFloor(-1);
+        } else {
+            fly();
+        }
+    };
+
     //#region 地图交互
 
     let mouseDown = false;
@@ -394,7 +423,7 @@ export const ViewMap = defineComponent<ViewMapProps>(props => {
                 cursor="pointer"
                 onEnter={enterTop}
                 onLeave={leaveTop}
-                onClick={() => changeFloor(1)}
+                onClick={clickTop}
             />
             <sprite
                 loc={[STATUS_BAR_WIDTH, MAP_HEIGHT - 64, MAP_WIDTH, 64]}
@@ -404,22 +433,43 @@ export const ViewMap = defineComponent<ViewMapProps>(props => {
                 cursor="pointer"
                 onEnter={enterBottom}
                 onLeave={leaveBottom}
-                onClick={() => changeFloor(-1)}
+                onClick={clickBottom}
             />
             <text
                 text="上移地图"
-                loc={[HALF_WIDTH, 24]}
+                loc={[HALF_MAP_WIDTH + STATUS_BAR_WIDTH, 24]}
                 anc={[0.5, 0.5]}
                 zIndex={20}
                 noevent
             />
             <text
                 text="下移地图"
-                loc={[HALF_WIDTH, MAP_HEIGHT - 24]}
+                loc={[HALF_MAP_WIDTH + STATUS_BAR_WIDTH, MAP_HEIGHT - 24]}
                 anc={[0.5, 0.5]}
                 zIndex={20}
                 noevent
             />
+            <text
+                text="「 怪物手册 」"
+                loc={[32 + STATUS_BAR_WIDTH, MAP_HEIGHT - 24]}
+                anc={[0, 0.5]}
+                zIndex={20}
+                noevent
+            />
+            <text
+                text="「 传送至此 」"
+                loc={[RIGHT_STATUS_POS - 32, MAP_HEIGHT - 24]}
+                anc={[1, 0.5]}
+                zIndex={20}
+                noevent
+            />
+            <text
+                text="「 重置视角 」"
+                loc={[RIGHT_STATUS_POS - 32, 24]}
+                anc={[1, 0.5]}
+                zIndex={20}
+                noevent
+            />
             <container
                 loc={[RIGHT_STATUS_POS, 0, STATUS_BAR_WIDTH, STATUS_BAR_HEIGHT]}
                 hidden={!ENABLE_RIGHT_STATUS_BAR}
@@ -484,21 +534,21 @@ export const ViewMap = defineComponent<ViewMapProps>(props => {
                 <g-line line={[12, 292, 168, 292]} lineWidth={1} />
                 <text
                     text="「 怪物手册 」"
-                    loc={[90, 330]}
+                    loc={loc1}
                     anc={[0.5, 0.5]}
                     cursor="pointer"
                     onClick={openBook}
                 />
                 <text
                     text="「 传送至此 」"
-                    loc={[90, 380]}
+                    loc={loc2}
                     anc={[0.5, 0.5]}
                     cursor="pointer"
                     onClick={fly}
                 />
                 <text
                     text="「 重置视角 」"
-                    loc={[90, 430]}
+                    loc={loc3}
                     anc={[0.5, 0.5]}
                     cursor="pointer"
                     onClick={resetCamera}