5 天以前 91c82965b2d987452ca276e3a03b48c8dcda2ae9
src/components/table-action/table-action.vue
@@ -6,15 +6,16 @@
import { computed, unref, watch } from 'vue';
import { useAccess } from '..\..\packages\effects\access\src';
import { IconifyIcon } from '..\..\packages\icons\src';
import { $t } from '..\..\packages\locales\src';
import { isBoolean, isFunction } from '..\..\packages\utils\src';
import { useAccess } from '@vben/access';
import { IconifyIcon } from '@vben/icons';
import { $t } from '@vben/locales';
import { isBoolean, isFunction } from '@vben/utils';
import {
  Button,
  Dropdown,
  Menu,
  Modal,
  Popconfirm,
  Space,
  Tooltip,
@@ -97,6 +98,8 @@
    attrs.onCancel = popConfirm.cancel;
  }
  // 不设置 getPopupContainer,让它默认挂载到 body,避免被遮挡
  return attrs;
}
@@ -120,7 +123,23 @@
/** 处理菜单点击 */
function handleMenuClick(e: any) {
  const action = getDropdownList.value[e.key];
  if (action && action.onClick && isFunction(action.onClick)) {
  if (!action) {
    return;
  }
  const popConfirm = action.popConfirm;
  if (popConfirm) {
    // 下拉菜单项会被 Dropdown 自动关闭销毁,嵌套 Popconfirm 无法弹出,
    // 故改用命令式 Modal.confirm 完成确认
    Modal.confirm({
      title: popConfirm.title,
      okText: popConfirm.okText,
      cancelText: popConfirm.cancelText,
      onOk: popConfirm.confirm ? () => popConfirm.confirm!() : undefined,
      onCancel: popConfirm.cancel ? () => popConfirm.cancel!() : undefined,
    });
    return;
  }
  if (action.onClick && isFunction(action.onClick)) {
    action.onClick();
  }
}
@@ -199,39 +218,20 @@
            v-for="(action, index) in getDropdownList"
            :key="index"
            :disabled="action.disabled"
            @click="!action.popConfirm && handleMenuClick({ key: index })"
            @click="handleMenuClick({ key: index })"
          >
            <template v-if="action.popConfirm">
              <Popconfirm v-bind="getPopConfirmProps(action.popConfirm)">
                <template v-if="action.popConfirm.icon" #icon>
                  <IconifyIcon :icon="action.popConfirm.icon" />
                </template>
                <div
                  :class="
                    action.disabled === true
                      ? 'cursor-not-allowed text-gray-300'
                      : ''
                  "
                >
                  <IconifyIcon v-if="action.icon" :icon="action.icon" />
                  <span :class="action.icon ? 'ml-1' : ''">
                    {{ action.label }}
                  </span>
                </div>
              </Popconfirm>
            </template>
            <template v-else>
              <div
                :class="
                  action.disabled === true
                    ? 'cursor-not-allowed text-gray-300'
                    : ''
                "
              >
                <IconifyIcon v-if="action.icon" :icon="action.icon" />
            <div
              :class="
                action.disabled === true
                  ? 'cursor-not-allowed text-gray-300'
                  : ''
              "
            >
              <IconifyIcon v-if="action.icon" :icon="action.icon" />
              <span :class="action.icon ? 'ml-1' : ''">
                {{ action.label }}
              </div>
            </template>
              </span>
            </div>
          </Menu.Item>
        </Menu>
      </template>
@@ -269,6 +269,12 @@
}
.ant-popconfirm {
  width: 210px;
  //.ant-popconfirm-message {
  //  white-space: nowrap;
  //}
  .ant-popconfirm-buttons {
    .ant-btn {
      margin-inline-start: 4px !important;