From a1079a7150477af7e35d83c6b33b0b0336e5f806 Mon Sep 17 00:00:00 2001
From: oneao <hi_itao@163.com>
Date: Fri, 28 Aug 2026 19:28:40 +0800
Subject: [PATCH] =?UTF-8?q?refactor(ui):=20Dropdown/Popover=20=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=20stretch-trigger,=E7=BB=93=E6=9E=84=E6=A0=91?=
 =?UTF-8?q?=E5=AE=BD=E5=BA=A6=E6=94=B9=E4=B8=BA=E7=BB=84=E4=BB=B6=E7=BA=A7?=
 =?UTF-8?q?=E8=A7=A3=E5=86=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

antdv-next 的 Dropdown/Popover 触发器不额外包裹 span,block 内容天然撑满;
我们组件因统一挂载事件/ref 用 span.popover-trigger(inline-flex 收缩)包裹,
导致结构树(.mst-tree)只有内容宽度。

参照其语义化定制思路,改为组件提供显式能力而非业务侧 :deep 打补丁:
- Popover 新增 stretchTrigger prop:true 时 trigger 加 .popover-trigger--stretch
  (display:block + width:100%,特异性 0,2,0 高于默认)
- Dropdown 透传 stretchTrigger
- ModuleStructureTree 使用 stretch-trigger 撑满分组树面板
- 移除 TableEditPanel 的 :deep(.popover-trigger) 覆盖(回归组件自身能力)
---
 code/fms/fms-vue/src/components/ui/dropdown/dropdown.vue    | 3 +++
 code/fms/fms-vue/src/components/ui/popover/index.scss       | 6 ++++++
 code/fms/fms-vue/src/components/ui/popover/popover.vue      | 5 +++++
 .../components/structure-tree/ModuleStructureTree.vue       | 5 ++++-
 .../components/table-edit/TableEditPanel.vue                | 6 ------
 5 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/code/fms/fms-vue/src/components/ui/dropdown/dropdown.vue b/code/fms/fms-vue/src/components/ui/dropdown/dropdown.vue
index dbaa366b..2ca2d389 100644
--- a/code/fms/fms-vue/src/components/ui/dropdown/dropdown.vue
+++ b/code/fms/fms-vue/src/components/ui/dropdown/dropdown.vue
@@ -28,6 +28,8 @@ const props = defineProps({
   mouseLeaveDelay: { type: Number, default: 200 },
   /** 与触发器的间距（px） */
   offset: { type: Number, default: 4 },
+  /** 触发器是否撑满父容器宽度；透传给 Popover（见 Popover.stretchTrigger） */
+  stretchTrigger: { type: Boolean, default: false },
 })
 
 const emit = defineEmits(['update:open', 'openChange', 'click'])
@@ -178,6 +180,7 @@ provide('dropdownActiveIndex', activeIndex)
     :disabled="disabled"
     :arrow="false"
     :offset="offset"
+    :stretch-trigger="stretchTrigger"
     :mouse-enter-delay="mouseEnterDelay"
     :mouse-leave-delay="mouseLeaveDelay"
     @update:open="onOpenChange"
diff --git a/code/fms/fms-vue/src/components/ui/popover/index.scss b/code/fms/fms-vue/src/components/ui/popover/index.scss
index f549f98e..1d842360 100644
--- a/code/fms/fms-vue/src/components/ui/popover/index.scss
+++ b/code/fms/fms-vue/src/components/ui/popover/index.scss
@@ -4,6 +4,12 @@
   justify-self: start;
 }
 
+/* 触发器撑满父容器（stretch-trigger）：结构树等需要占满整行可用宽度的场景 */
+.popover-trigger--stretch {
+  display: block;
+  width: 100%;
+}
+
 /* 在完整轮廓上统一投影，让箭头和主体拥有连续的视觉重量。 */
 .popover {
   position: fixed;
diff --git a/code/fms/fms-vue/src/components/ui/popover/popover.vue b/code/fms/fms-vue/src/components/ui/popover/popover.vue
index 5534e554..b3a3b10d 100644
--- a/code/fms/fms-vue/src/components/ui/popover/popover.vue
+++ b/code/fms/fms-vue/src/components/ui/popover/popover.vue
@@ -35,6 +35,10 @@ const props = defineProps({
   /** 浮层宽度是否严格跟随触发器宽度。
       用于 Select 等需与触发框等宽对齐的场景；默认 false 由内容自适应撑开。 */
   followTriggerWidth: { type: Boolean, default: false },
+  /** 触发器是否撑满父容器宽度（display:block + width:100%）。
+       默认 false（inline-flex 收缩到内容宽度，适配按钮/图标触发器）；
+       需要触发器占据整行可用宽度的场景（如结构树）设为 true。 */
+  stretchTrigger: { type: Boolean, default: false },
 })
 
 const emit = defineEmits(['update:open', 'openChange'])
@@ -248,6 +252,7 @@ onBeforeUnmount(() => {
   <span
     ref="triggerEl"
     class="popover-trigger"
+    :class="{ 'popover-trigger--stretch': stretchTrigger }"
     @click="onClick"
     @contextmenu="onContextMenu"
     @mouseenter="onMouseEnter"
diff --git a/code/fms/fms-vue/src/views/system/module-management/components/structure-tree/ModuleStructureTree.vue b/code/fms/fms-vue/src/views/system/module-management/components/structure-tree/ModuleStructureTree.vue
index eea316f8..d3333657 100644
--- a/code/fms/fms-vue/src/views/system/module-management/components/structure-tree/ModuleStructureTree.vue
+++ b/code/fms/fms-vue/src/views/system/module-management/components/structure-tree/ModuleStructureTree.vue
@@ -637,11 +637,14 @@ provide('moduleStructureTree', {
 </script>
 
 <template>
-  <!-- 右键菜单：Dropdown 以鼠标位置为锚点弹出，节点 contextmenu 冒泡至此触发 -->
+  <!-- 右键菜单：Dropdown 以鼠标位置为锚点弹出，节点 contextmenu 冒泡至此触发；
+       stretch-trigger：Popover trigger 默认 inline-flex 收缩到内容宽度，
+       结构树需撑满分组树面板，故显式撑开 -->
   <Dropdown
     trigger="contextmenu"
     placement="bottom-start"
     :items="contextItems"
+    stretch-trigger
     @click="onMenuItemClick"
   >
     <div class="mst-tree" role="tree" @keydown="onTreeKeydown" @dragleave="onRootDragLeave">
diff --git a/code/fms/fms-vue/src/views/system/module-management/components/table-edit/TableEditPanel.vue b/code/fms/fms-vue/src/views/system/module-management/components/table-edit/TableEditPanel.vue
index d5371b8e..34edce10 100644
--- a/code/fms/fms-vue/src/views/system/module-management/components/table-edit/TableEditPanel.vue
+++ b/code/fms/fms-vue/src/views/system/module-management/components/table-edit/TableEditPanel.vue
@@ -919,12 +919,6 @@ function switchView(mode) {
   flex: 1;
   min-height: 0;
   overflow: auto;
-  /* 结构树外层是 Dropdown→Popover 的 span.popover-trigger（inline-flex，收缩到内容宽度），
-     会导致 .mst-tree 只有内容宽。这里把它撑开成 block，让树填满可用宽度 */
-  :deep(.popover-trigger) {
-    display: block;
-    width: 100%;
-  }
 }
 .mm-fdesign__tree-empty {
   padding: 12px 8px;