From a2d75f609832c46e3a0dbcda7ac35cef9df8590b Mon Sep 17 00:00:00 2001
From: jinye <jinye@baidu.com>
Date: Tue, 26 Mar 2024 15:19:51 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20ContextMenu-=E6=9B=B4=E9=AB=98=E6=95=88?=
 =?UTF-8?q?\=E5=A5=BD=E7=94=A8=E5=9C=B0=E8=AE=A1=E7=AE=97=E5=8F=B3?=
 =?UTF-8?q?=E9=94=AE=E8=8F=9C=E5=8D=95=E7=9A=84=E4=BD=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/amis-core/src/utils/dom.tsx          | 33 +++++++++++++++++++
 .../amis-ui/src/components/ContextMenu.tsx    |  2 +-
 2 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/packages/amis-core/src/utils/dom.tsx b/packages/amis-core/src/utils/dom.tsx
index 7f0616bc1..99e27cbc7 100644
--- a/packages/amis-core/src/utils/dom.tsx
+++ b/packages/amis-core/src/utils/dom.tsx
@@ -115,6 +115,39 @@ export function calculatePosition(
     arrowOffsetTop: any = '',
     activePlacement: string = placement;
 
+  // 如果是作为菜单浮层，不再基于四个方向对齐，而是模拟原生右键菜单定位：
+  // 1.计算放右边，还是左边
+  // 2.计算能否放在下面，如果不能则贴底
+  // 3.由于是基于一个点此时不考虑 arrow
+  if (placement === 'asContextMenu') {
+    if (childOffset.left + 1 + overlayWidth <= clip.width) {
+      // 放右边
+      positionLeft = childOffset.left + 1;
+    } else if (childOffset.left - overlayWidth >= 0) {
+      // 放左边
+      positionLeft = childOffset.left - overlayWidth;
+    } else {
+      // 兜底贴右边
+      positionLeft = Math.max(clip.width - overlayWidth, 10);
+    }
+
+    if (childOffset.top + 1 + overlayHeight <= clip.height) {
+      // 放下面
+      positionTop = childOffset.top + 1;
+    } else {
+      // 贴底边，预留5px避免完全贴底
+      positionTop = Math.max(clip.height - overlayHeight - 5, 10);
+    }
+    const [offSetX = 0, offSetY = 0] = customOffset;
+    return {
+      positionLeft: (positionLeft + offSetX) / scaleX,
+      positionTop: (positionTop + offSetY) / scaleY,
+      arrowOffsetLeft,
+      arrowOffsetTop,
+      activePlacement
+    };
+  }
+
   if (~placement.indexOf('-')) {
     const tests = placement.split(/\s+/);
 
diff --git a/packages/amis-ui/src/components/ContextMenu.tsx b/packages/amis-ui/src/components/ContextMenu.tsx
index 7d48a6aea..67c277840 100644
--- a/packages/amis-ui/src/components/ContextMenu.tsx
+++ b/packages/amis-ui/src/components/ContextMenu.tsx
@@ -265,7 +265,7 @@ export class ContextMenu extends React.Component<
   autoCalculatePosition(menu: HTMLElement) {
     // 智能定位，选择一个合适的对齐方式。
     const info = calculatePosition(
-      'auto',
+      'asContextMenu',
       menu.lastChild,
       menu.children[1] as HTMLElement,
       menu.children[0]