refactor(antd): 移除Popconfirm中已废弃的getVxePopupContainer属性

antd已支持滚动跟随，不再需要手动指定getVxePopupContainer属性。删除相关代码及工具函数，简化实现。
2026-01-15 10:07:06 +08:00 · 2026-01-15 10:07:06 +08:00 · 884c4f39fd
commit 884c4f39fd
parent 448856e547
22 changed files with 6 additions and 107 deletions
--- a/apps/web-antd/src/views/dashboard/analytics/change.md
+++ b/apps/web-antd/src/views/dashboard/analytics/change.md
@ -17,6 +17,7 @@
 - 使用`version-polling`替代自带的版本检测更新 样式更新 在worker执行 不会阻塞主线程
 - 字典常量enum从`packages/@core/base/shared/src/constants`移动到`@vben/constants`下 需要移动文件位置(导入不需要更改)
 - Switch的value只能是boolean值 之前可以为 string/number/boolean (antd组件变化)
+- Popconfirm不再需要 `:get-popup-container="getVxePopupContainer"` antd已经支持滚动跟随 故`getVxePopupContainer`已经移除

 ## 已知问题

--- a/apps/web-antd/src/views/monitor/logininfor/index.vue
+++ b/apps/web-antd/src/views/monitor/logininfor/index.vue
@ -7,7 +7,6 @@ import type { LoginLog } from '#/api/monitor/logininfo/model';
 import { ref } from 'vue';

 import { Page, useVbenModal } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -189,7 +188,6 @@ function handleDownloadExcel() {
            {{ $t('pages.common.info') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除?"
            @confirm="() => handleDelete(row)"
--- a/apps/web-antd/src/views/monitor/online/index.vue
+++ b/apps/web-antd/src/views/monitor/online/index.vue
@ -7,7 +7,6 @@ import type { OnlineUser } from '#/api/monitor/online/model';
 import { ref } from 'vue';

 import { Page } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Popconfirm } from 'antdv-next';
 import { slice } from 'lodash-es';
@ -82,14 +81,13 @@ async function handleForceOffline(row: OnlineUser) {
        <div class="mr-1 pl-1 text-[1rem]">
          <div>
            在线用户列表 (共
-            <span class="text-primary font-bold">{{ onlineCount }}</span>
+            <span class="font-bold text-primary">{{ onlineCount }}</span>
            人在线)
          </div>
        </div>
      </template>
      <template #action="{ row }">
        <Popconfirm
-          :get-popup-container="getVxePopupContainer"
          :title="`确认强制下线[${row.userName}]?`"
          placement="left"
          @confirm="handleForceOffline(row)"
--- a/apps/web-antd/src/views/system/client/index.vue
+++ b/apps/web-antd/src/views/system/client/index.vue
@ -6,7 +6,6 @@ import type { Client } from '#/api/system/client/model';

 import { useAccess } from '@vben/access';
 import { Page, useVbenDrawer } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -160,7 +159,6 @@ const { hasAccessByCodes } = useAccess();
          </ghost-button>
          <Popconfirm
            :disabled="row.id === 1"
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/config/index.vue
+++ b/apps/web-antd/src/views/system/config/index.vue
@ -5,7 +5,6 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 import type { SysConfig } from '#/api/system/config/model';

 import { Page, useVbenModal } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -156,7 +155,6 @@ async function handleRefreshCache() {
            {{ $t('pages.common.edit') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/dept/index.vue
+++ b/apps/web-antd/src/views/system/dept/index.vue
@ -7,7 +7,7 @@ import type { Dept } from '#/api/system/dept/model';
 import { nextTick } from 'vue';

 import { Page, useVbenDrawer } from '@vben/common-ui';
-import { eachTree, getVxePopupContainer } from '@vben/utils';
+import { eachTree } from '@vben/utils';

 import { Popconfirm, Space } from 'antdv-next';

@ -163,7 +163,6 @@ function setExpandOrCollapse(expand: boolean) {
            {{ $t('pages.common.add') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/menu/index.vue
+++ b/apps/web-antd/src/views/system/menu/index.vue
@ -9,12 +9,7 @@ import { computed, ref } from 'vue';
 import { useAccess } from '@vben/access';
 import { Fallback, Page, useVbenDrawer } from '@vben/common-ui';
 import { $t } from '@vben/locales';
-import {
-  eachTree,
-  getVxePopupContainer,
-  listToTree,
-  treeToList,
-} from '@vben/utils';
+import { eachTree, listToTree, treeToList } from '@vben/utils';

 import { Popconfirm, Space, Switch, Tooltip } from 'antdv-next';

@ -245,7 +240,6 @@ const isAdmin = computed(() => {
            {{ $t('pages.common.add') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            :title="removeConfirmTitle(row)"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/notice/index.vue
+++ b/apps/web-antd/src/views/system/notice/index.vue
@ -5,7 +5,6 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 import type { Notice } from '#/api/system/notice/model';

 import { Page, useVbenModal } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -127,7 +126,6 @@ function handleMultiDelete() {
            {{ $t('pages.common.edit') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/oss-config/index.vue
+++ b/apps/web-antd/src/views/system/oss-config/index.vue
@ -6,7 +6,6 @@ import type { OssConfig } from '#/api/system/oss-config/model';

 import { useAccess } from '@vben/access';
 import { Page, useVbenDrawer } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -145,7 +144,6 @@ const { hasAccessByCodes } = useAccess();
            {{ $t('pages.common.edit') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/oss/index.vue
+++ b/apps/web-antd/src/views/system/oss/index.vue
@ -13,7 +13,6 @@ import { useAppConfig } from '@vben/hooks';
 import { $t } from '@vben/locales';
 import { stringify } from '@vben/request';
 import { useAccessStore } from '@vben/stores';
-import { getVxePopupContainer } from '@vben/utils';

 import {
  Image,
@ -295,7 +294,6 @@ const [FileUploadModal, fileUploadApi] = useVbenModal({
            {{ $t('pages.common.download') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/post/index.vue
+++ b/apps/web-antd/src/views/system/post/index.vue
@ -7,7 +7,6 @@ import type { Post } from '#/api/system/post/model';
 import { ref } from 'vue';

 import { Page, useVbenDrawer } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -169,7 +168,6 @@ function handleDownloadExcel() {
            {{ $t('pages.common.edit') }}
          </GhostButton>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/role-assign/index.vue
+++ b/apps/web-antd/src/views/system/role-assign/index.vue
@ -7,7 +7,6 @@ import type { User } from '#/api/system/user/model';
 import { useRoute } from 'vue-router';

 import { Page, useVbenDrawer } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -132,7 +131,6 @@ function handleMultipleAuthCancel() {
      </template>
      <template #action="{ row }">
        <Popconfirm
-          :get-popup-container="getVxePopupContainer"
          :title="`是否取消授权用户[${row.userName} - ${row.nickName}]?`"
          placement="left"
          @confirm="handleAuthCancel(row)"
--- a/apps/web-antd/src/views/system/role/index.vue
+++ b/apps/web-antd/src/views/system/role/index.vue
@ -15,7 +15,6 @@ import {
  SUPERADMIN_ROLE_ID,
  SUPERADMIN_ROLE_KEY,
 } from '@vben/constants';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -221,7 +220,6 @@ async function handleChangeStatus(checked: boolean, row: Role) {
              分配
            </ghost-button>
            <Popconfirm
-              :get-popup-container="getVxePopupContainer"
              placement="left"
              title="确认删除？"
              @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/tenant/index.vue
+++ b/apps/web-antd/src/views/system/tenant/index.vue
@ -8,7 +8,6 @@ import { computed } from 'vue';

 import { useAccess } from '@vben/access';
 import { Fallback, Page, useVbenDrawer } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -217,7 +216,6 @@ function handleSyncTenantConfig() {
            {{ $t('pages.common.edit') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            :title="`确认同步[${row.companyName}]的套餐吗?`"
            placement="left"
            @confirm="handleSync(row)"
@ -231,7 +229,6 @@ function handleSyncTenantConfig() {
            </ghost-button>
          </Popconfirm>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/system/tenantPackage/index.vue
+++ b/apps/web-antd/src/views/system/tenantPackage/index.vue
@ -8,7 +8,6 @@ import { computed } from 'vue';

 import { useAccess } from '@vben/access';
 import { Fallback, Page, useVbenDrawer } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -169,7 +168,6 @@ const isSuperAdmin = computed(() => {
            {{ $t('pages.common.edit') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/tool/gen/index.vue
+++ b/apps/web-antd/src/views/tool/gen/index.vue
@ -8,7 +8,6 @@ import { onMounted } from 'vue';
 import { useRouter } from 'vue-router';

 import { Page, useVbenModal } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';
 import dayjs from 'dayjs';
@ -245,7 +244,6 @@ function handleImport() {
          {{ $t('pages.common.edit') }}
        </a-button>
        <Popconfirm
-          :get-popup-container="getVxePopupContainer"
          :title="`确认同步[${row.tableName}]?`"
          placement="left"
          @confirm="handleSync(row)"
@ -268,7 +266,6 @@ function handleImport() {
          生成代码
        </a-button>
        <Popconfirm
-          :get-popup-container="getVxePopupContainer"
          :title="`确认删除[${row.tableName}]?`"
          placement="left"
          @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/workflow/category/index.vue
+++ b/apps/web-antd/src/views/workflow/category/index.vue
@ -136,7 +136,7 @@ function collapseAll() {
            {{ $t('pages.common.add') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
+
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/workflow/leave/index.vue
+++ b/apps/web-antd/src/views/workflow/leave/index.vue
@ -6,7 +6,6 @@ import type { LeaveForm } from './api/model';
 import type { VxeGridProps } from '#/adapter/vxe-table';

 import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

@ -196,7 +195,6 @@ function handleInfo(row: Required<LeaveForm>) {
          {{ $t('pages.common.edit') }}
        </a-button>
        <Popconfirm
-          :get-popup-container="getVxePopupContainer"
          placement="left"
          title="确认撤销？"
          :disabled="!['waiting'].includes(row.status)"
@ -214,7 +212,6 @@ function handleInfo(row: Required<LeaveForm>) {
          </a-button>
        </Popconfirm>
        <Popconfirm
-          :get-popup-container="getVxePopupContainer"
          placement="left"
          title="确认删除？"
          :disabled="!['draft', 'cancel', 'back'].includes(row.status)"
--- a/apps/web-antd/src/views/workflow/processDefinition/index.vue
+++ b/apps/web-antd/src/views/workflow/processDefinition/index.vue
@ -12,7 +12,6 @@ import { useRouter } from 'vue-router';

 import { Page, useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, RadioGroup, Space, Switch } from 'antdv-next';

@ -322,7 +321,6 @@ async function handleReload(type: 'add' | 'update') {
                编辑信息
              </a-button>
              <Popconfirm
-                :get-popup-container="getVxePopupContainer"
                placement="left"
                title="确认删除？"
                @confirm="handleDelete(row)"
@ -341,7 +339,6 @@ async function handleReload(type: 'add' | 'update') {
                {{ row.isPublish ? '查看流程' : '设计流程' }}
              </a-button>
              <Popconfirm
-                :get-popup-container="getVxePopupContainer"
                :title="`确认发布流程[${row.flowName}]?`"
                placement="left"
                @confirm="handlePublish(row)"
@ -353,7 +350,6 @@ async function handleReload(type: 'add' | 'update') {
            </div>
            <div>
              <Popconfirm
-                :get-popup-container="getVxePopupContainer"
                :title="`确认复制流程[${row.flowName}]?`"
                placement="left"
                @confirm="handleCopy(row)"
--- a/apps/web-antd/src/views/workflow/processInstance/index.vue
+++ b/apps/web-antd/src/views/workflow/processInstance/index.vue
@ -10,7 +10,6 @@ import { ref } from 'vue';

 import { Page, useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, RadioGroup, Space } from 'antdv-next';

@ -208,7 +207,6 @@ function handleInfo(row: any) {
                作废流程
              </a-button>
              <Popconfirm
-                :get-popup-container="getVxePopupContainer"
                placement="left"
                title="确认删除？"
                @confirm="handleDelete(row)"
--- a/apps/web-antd/src/views/workflow/spel/index.vue
+++ b/apps/web-antd/src/views/workflow/spel/index.vue
@ -5,12 +5,11 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
 import type { Spel } from '#/api/workflow/spel/model';

 import { Page, useVbenDrawer } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';

 import { Modal, Popconfirm, Space } from 'antdv-next';

 import { useVbenVxeGrid, vxeCheckboxChecked } from '#/adapter/vxe-table';
-import { spelList,spelDelete } from '#/api/workflow/spel';
+import { spelDelete, spelList } from '#/api/workflow/spel';

 import { columns, querySchema } from './data';
 import spelDrawer from './spel-drawer.vue';
@ -125,7 +124,6 @@ function handleMultiDelete() {
            {{ $t('pages.common.edit') }}
          </ghost-button>
          <Popconfirm
-            :get-popup-container="getVxePopupContainer"
            placement="left"
            title="确认删除？"
            @confirm="handleDelete(row)"
--- a/packages/utils/src/helpers/get-popup-container.ts
+++ b/packages/utils/src/helpers/get-popup-container.ts
@ -8,59 +8,3 @@ export function getPopupContainer(node?: HTMLElement): HTMLElement {
    node?.closest('form') ?? (node?.parentNode as HTMLElement) ?? document.body
  );
 }
-
-/**
- * VxeTable专用弹窗层
- * 解决问题: https://gitee.com/dapppp/ruoyi-plus-vben5/issues/IB1DM3
- * @param node 触发的元素
- * @param tableId 表格ID，用于区分不同表格（可选）
- * @returns 挂载节点
- */
-export function getVxePopupContainer(
-  node?: HTMLElement,
-  tableId?: string,
-): HTMLElement {
-  if (!node) return document.body;
-
-  // 检查是否在固定列内
-  const isInFixedColumn =
-    node.closest('.vxe-table--fixed-wrapper') ||
-    node.closest('.vxe-table--fixed-left-wrapper') ||
-    node.closest('.vxe-table--fixed-right-wrapper');
-
-  // 如果在固定列内，则挂载到固定列容器
-  if (isInFixedColumn) {
-    // 优先查找表格容器及父级容器
-    const tableContainer =
-      // 查找通用固定列容器
-      node.closest('.vxe-table--fixed-wrapper') ||
-      // 查找固定列容器（左侧固定列）
-      node.closest('.vxe-table--fixed-left-wrapper') ||
-      // 查找固定列容器（右侧固定列）
-      node.closest('.vxe-table--fixed-right-wrapper');
-
-    // 如果指定了tableId，可以查找特定ID的表格
-    if (tableId && tableContainer) {
-      const specificTable = tableContainer.closest(
-        `[data-table-id="${tableId}"]`,
-      );
-      if (specificTable) {
-        return specificTable as HTMLElement;
-      }
-    }
-
-    return tableContainer as HTMLElement;
-  }
-
-  /**
-   * 设置行高度需要特殊处理
-   */
-  const fixedHeightElement = node.closest('td.col--cs-height');
-  if (fixedHeightElement) {
-    // 默认为hidden 显示异常
-    (fixedHeightElement as HTMLTableCellElement).style.overflow = 'visible';
-  }
-
-  // 兜底方案：使用元素的父节点或文档体
-  return (node.parentNode as HTMLElement) || document.body;
-}