@veltra/desktop 1.7.12 → 1.7.15

package/dist/types/tip.d.ts

@@ -1,12 +1,16 @@
 import { CSSProperties } from "vue";
-import { DeconstructValue } from "@veltra/utils";
+import { ColorType, DeconstructValue } from "@veltra/utils";
 //#region src/types/tip.d.ts
-type TipDirection = 'top' | 'bottom' | 'left' | 'right';
-type TipAlign = 'center' | 'start' | 'end';
+export type TipDirection = 'top' | 'bottom' | 'left' | 'right';
+export type TipAlign = 'center' | 'start' | 'end';
+/** tip类型 */
+export type TipType = ColorType;
 /** tip提示组件组件属性 */
-interface TipProps {
+export interface TipProps {
   /** 控制显影 */
   visible?: boolean;
+  /** tip类型 */
+  type?: TipType;
   /**提示内容 */
   content?: string;
   /** 自定义tip样式 */
@@ -45,13 +49,12 @@ interface TipProps {
   showDelay?: number;
 }
 /** tip提示组件组件定义的事件 */
-interface TipEmits {
+export interface TipEmits {
   (e: 'update:visible', value: boolean): void;
 }
 /** tip提示组件组件暴露的属性和方法(组件内部使用) */
-interface _TipExposed {}
+export interface _TipExposed {}
 /** tip提示组件组件暴露的属性和方法(组件外部使用, 引用的值会被自动解构) */
-type TipExposed = DeconstructValue<_TipExposed>;
+export type TipExposed = DeconstructValue<_TipExposed>;
 //#endregion
-export { TipAlign, TipDirection, TipEmits, TipExposed, TipProps, _TipExposed };
 //# sourceMappingURL=tip.d.ts.map

package/dist/types/tree-select.d.ts

@@ -3,7 +3,7 @@ import { CSSProperties } from "vue";
 import { DeconstructValue, FormComponentProps } from "@veltra/utils";
 //#region src/types/tree-select.d.ts
 /** 树形选择器组件属性 */
-interface TreeSelectProps extends FormComponentProps, Omit<TreeProps, 'selected' | 'checked' | 'selectable' | 'checkable'> {
+export interface TreeSelectProps extends FormComponentProps, Omit<TreeProps, 'selected' | 'checked' | 'selectable' | 'checkable'> {
   modelValue?: string | number;
   /** 自定义占位文字 */
   placeholder?: string;
@@ -31,7 +31,7 @@ interface TreeSelectProps extends FormComponentProps, Omit<TreeProps, 'selected'
   contentClass?: unknown;
 }
 /** 树形选择器组件定义的事件 */
-interface TreeSelectEmits {
+export interface TreeSelectEmits {
   (e: 'clear'): void;
   (e: 'update:modelValue', value?: string | number): void;
   (e: 'change', selectedData?: Record<string, any>): void;
@@ -42,9 +42,8 @@ interface TreeSelectEmits {
   (e: 'update:text', text?: string): void;
 }
 /** 树形选择器组件暴露的属性和方法(组件内部使用) */
-interface _TreeSelectExposed {}
+export interface _TreeSelectExposed {}
 /** 树形选择器组件暴露的属性和方法(组件外部使用, 引用的值会被自动解构) */
-type TreeSelectExposed = DeconstructValue<_TreeSelectExposed>;
+export type TreeSelectExposed = DeconstructValue<_TreeSelectExposed>;
 //#endregion
-export { TreeSelectEmits, TreeSelectExposed, TreeSelectProps, _TreeSelectExposed };
 //# sourceMappingURL=tree-select.d.ts.map

package/dist/types/tree.d.ts

@@ -20,7 +20,7 @@ interface TreeNode$1<Data extends Record<string, any> = Record<string, any>> ext
   bubbleSet: (setter: (node: TreeNode$1<Data>) => void) => void;
 }
 /** 树组件属性 */
-interface TreeProps {
+export interface TreeProps {
   /** 是否展开所有节点 */
   expandAll?: boolean;
   /** 是否在点击节点的时候展开或者收缩节点 */
@@ -62,7 +62,7 @@ interface TreeProps {
   /** 使选中项或多选项出现在滚动视图中 */
   scrollToView?: boolean;
 }
-interface TreeEmit {
+export interface TreeEmit {
   /** 节点展开/折叠事件 */
   (e: 'expand', node: TreeNode$1): void;
   /** 节点点击事件 */
@@ -76,7 +76,7 @@ interface TreeEmit {
   /** 选中项同步完成事件 */
   (e: 'selected-synced', selected?: Record<string, any>): void;
 }
-interface TreeNodeProps {
+export interface TreeNodeProps {
   node: TreeNode$1;
   /**
    * 虚拟项索引：对应 `nodes` 数组中的绝对位置。
@@ -86,7 +86,7 @@ interface TreeNodeProps {
   measureElement?: (index: number, el: Element | null) => void;
 }
 /** 树组件暴露的属性和方法(组件内部使用) */
-interface _TreeExposed {
+export interface _TreeExposed {
   /** 滚动到目标元素 */
   scrollTo: (index: number) => void;
   /**
@@ -112,7 +112,7 @@ interface _TreeExposed {
   collapseAll(): void;
 }
 /** 树组件暴露的属性和方法(组件外部使用, 引用的值会被自动解构) */
-type TreeExposed = DeconstructValue<_TreeExposed>;
+export type TreeExposed = DeconstructValue<_TreeExposed>;
 //#endregion
-export { TreeEmit, TreeExposed, TreeNode$1 as TreeNode, TreeNodeProps, TreeProps, _TreeExposed };
+export { TreeNode$1 as TreeNode };
 //# sourceMappingURL=tree.d.ts.map

package/dist/types/watermark.d.ts

@@ -1,7 +1,7 @@
 import { DeconstructValue } from "@veltra/utils";
 //#region src/types/watermark.d.ts
 /** watermark组件属性 */
-interface WatermarkProps {
+export interface WatermarkProps {
   /** 文字 */
   text?: string;
   /** 图片 */
@@ -14,11 +14,10 @@ interface WatermarkProps {
   fontSize?: number;
 }
 /** watermark组件定义的事件 */
-interface WatermarkEmits {}
+export interface WatermarkEmits {}
 /** watermark组件暴露的属性和方法(组件内部使用) */
-interface _WatermarkExposed {}
+export interface _WatermarkExposed {}
 /** watermark组件暴露的属性和方法(组件外部使用, 引用的值会被自动解构) */
-type WatermarkExposed = DeconstructValue<_WatermarkExposed>;
+export type WatermarkExposed = DeconstructValue<_WatermarkExposed>;
 //#endregion
-export { WatermarkEmits, WatermarkExposed, WatermarkProps, _WatermarkExposed };
 //# sourceMappingURL=watermark.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veltra/desktop",
-  "version": "1.7.12",
+  "version": "1.7.15",
   "homepage": "https://github.com/cabinet-fe/ultra-ui#readme",
   "bugs": {
     "url": "https://github.com/cabinet-fe/ultra-ui/issues"
@@ -75,17 +75,18 @@
     "@codemirror/search": "6.7.1",
     "@codemirror/state": "6.7.1",
     "@codemirror/theme-one-dark": "6.1.3",
-    "@codemirror/view": "6.43.9"
+    "@codemirror/view": "6.43.9",
+    "@veltra/ofd-core": "1.0.1"
   },
   "peerDependencies": {
     "@cat-kit/core": ">=1.2.1",
     "@cat-kit/fe": ">=1.2.1",
-    "@veltra/compositions": "^1.7.12",
-    "@veltra/directives": "^1.7.12",
+    "@veltra/compositions": "^1.7.14",
+    "@veltra/directives": "^1.7.14",
     "@veltra/icons": "^1.5.0",
-    "@veltra/sheet-core": "^2.5.6",
-    "@veltra/styles": "^1.7.12",
-    "@veltra/utils": "^1.7.12",
+    "@veltra/sheet-core": "^2.5.7",
+    "@veltra/styles": "^1.7.14",
+    "@veltra/utils": "^1.7.14",
     "vue": ">=3.5.42"
   },
   "peerDependenciesMeta": {

package/src/components/batch-edit/__test__/batch-edit.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, it } from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 import { createApp, h, nextTick, reactive, ref } from 'vue'
 
 import { UInput } from '../../input'
@@ -6,7 +6,13 @@ import { USelect } from '../../select'
 import { defineTableColumns } from '../../table'
 import { UBatchEdit } from '../index'
 
-function mountBatchEdit() {
+interface MountOptions {
+  props?: Record<string, any>
+  /** 给「名称」输入框附加校验规则 */
+  labelRules?: Record<string, any>
+}
+
+function mountBatchEdit(options: MountOptions = {}) {
   const host = document.createElement('div')
   document.body.appendChild(host)
 
@@ -42,11 +48,12 @@ function mountBatchEdit() {
           columns,
           model,
           rowKey: 'id',
-          quickEdit: true
+          quickEdit: true,
+          ...options.props
         },
         {
           form: () => [
-            h(UInput, { field: 'label', label: '名称' }),
+            h(UInput, { field: 'label', label: '名称', rules: options.labelRules }),
             h(USelect, {
               field: 'behavior',
               label: '行为',
@@ -197,3 +204,183 @@ describe('UBatchEdit quick-edit 切换编辑行', () => {
     unmount()
   })
 })
+
+function queryDialog() {
+  return document.body.querySelector<HTMLElement>('.u-batch-edit__form-dialog')
+}
+
+/** 等弹框（teleport 到 body）的进入 / 离开过渡走完 */
+async function flushDialog() {
+  await nextTick()
+  await nextTick()
+  await new Promise((resolve) => setTimeout(resolve, 20))
+  await nextTick()
+}
+
+function clickEl(el: HTMLElement) {
+  el.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+}
+
+function setInputValue(input: HTMLInputElement, value: string) {
+  input.value = value
+  input.dispatchEvent(
+    new InputEvent('input', { bubbles: true, data: value, inputType: 'insertText' })
+  )
+}
+
+function querySaveButton(dialog: HTMLElement) {
+  return dialog.querySelector<HTMLElement>('.u-batch-edit__form-actions button[title="保存"]')
+}
+
+function queryCancelButton(dialog: HTMLElement) {
+  return [...dialog.querySelectorAll<HTMLElement>('.u-batch-edit__form-actions button')].find(
+    (btn) => btn.textContent?.includes('取消')
+  )
+}
+
+describe('UBatchEdit formMode', () => {
+  it('默认（不传 formMode）仍渲染右侧面板，不出现弹框', async () => {
+    const { host, unmount } = mountBatchEdit()
+
+    await clickRow(host, 0)
+    const aside = host.querySelector<HTMLElement>('.u-batch-edit__form')
+    expect(aside).toBeTruthy()
+    expect(aside!.style.display).not.toBe('none')
+    expect(queryDialog()).toBeNull()
+
+    unmount()
+  })
+
+  it('formMode="dialog" 时不渲染右列，触发编辑后以弹框打开表单', async () => {
+    const { host, model, unmount } = mountBatchEdit({
+      props: { formMode: 'dialog', quickEdit: false }
+    })
+
+    expect(host.querySelector('.u-batch-edit__form')).toBeNull()
+    expect(queryDialog()).toBeNull()
+
+    await clickRow(host, 0)
+    await flushDialog()
+
+    const dialog = queryDialog()
+    expect(dialog).toBeTruthy()
+    // 表格占满整行，右列不再渲染
+    expect(host.querySelector('.u-batch-edit__form')).toBeNull()
+    // 弹框内复用原表单头部 / 表单体 / 底部操作区
+    expect(dialog!.querySelector('.u-batch-edit__form-header')).toBeTruthy()
+    expect(dialog!.querySelector('.u-batch-edit__form-body')).toBeTruthy()
+    expect(dialog!.querySelector('.u-batch-edit__form-actions')).toBeTruthy()
+    // 编辑行已回显
+    expect(model.label).toBe('存草稿')
+
+    unmount()
+  })
+
+  it('弹框内保存走校验与 saveMethod，成功后关闭弹框', async () => {
+    const saveMethod = vi.fn()
+    const { host, data, unmount } = mountBatchEdit({
+      props: { formMode: 'dialog', quickEdit: false, saveMethod },
+      labelRules: { required: true }
+    })
+
+    // 打开新增弹框
+    clickEl(host.querySelector<HTMLElement>('.u-batch-edit__add-btn')!)
+    await flushDialog()
+    expect(queryDialog()).toBeTruthy()
+
+    // 必填校验失败：不调用 saveMethod，弹框保持打开
+    clickEl(querySaveButton(queryDialog()!)!)
+    await flushDialog()
+    expect(saveMethod).not.toHaveBeenCalled()
+    expect(queryDialog()).toBeTruthy()
+
+    // 填写后保存：走 saveMethod 并插入数据，成功后关闭弹框
+    setInputValue(queryDialog()!.querySelector<HTMLInputElement>('.u-input input')!, '新名称')
+    await nextTick()
+    await nextTick()
+    clickEl(querySaveButton(queryDialog()!)!)
+    await flushDialog()
+
+    expect(saveMethod).toHaveBeenCalledTimes(1)
+    expect(saveMethod.mock.calls[0]![0]).toMatchObject({ label: '新名称' })
+    expect(saveMethod.mock.calls[0]![1]).toBe('create')
+    expect(data.value).toHaveLength(3)
+    expect(data.value[2]).toMatchObject({ label: '新名称' })
+    expect(queryDialog()).toBeNull()
+
+    unmount()
+  })
+
+  it('弹框内取消 / 关闭按钮 / 遮罩点击均不保存，且 model 恢复初始值', async () => {
+    const saveMethod = vi.fn()
+    const { host, data, model, unmount } = mountBatchEdit({
+      props: { formMode: 'dialog', quickEdit: false, saveMethod }
+    })
+
+    // 编辑第 1 行后取消
+    await clickRow(host, 0)
+    await flushDialog()
+    setInputValue(queryDialog()!.querySelector<HTMLInputElement>('.u-input input')!, '改过的名称')
+    await nextTick()
+    await nextTick()
+    clickEl(queryCancelButton(queryDialog()!)!)
+    await flushDialog()
+
+    expect(saveMethod).not.toHaveBeenCalled()
+    expect(data.value[0]).toMatchObject({ label: '存草稿' })
+    // model 恢复初始快照，而不是残留上一行数据
+    expect(model.label).toBe('')
+    expect(model.submitType).toBeUndefined()
+    expect(queryDialog()).toBeNull()
+
+    // 取消后再新增：表单应为初始值（快照不被上一行污染）
+    clickEl(host.querySelector<HTMLElement>('.u-batch-edit__add-btn')!)
+    await flushDialog()
+    expect(queryDialog()!.querySelector<HTMLInputElement>('.u-input input')!.value).toBe('')
+
+    // 表单头部的关闭按钮同样不保存
+    setInputValue(queryDialog()!.querySelector<HTMLInputElement>('.u-input input')!, '随便写')
+    await nextTick()
+    await nextTick()
+    clickEl(queryDialog()!.querySelector<HTMLElement>('.u-batch-edit__form-close')!)
+    await flushDialog()
+    expect(saveMethod).not.toHaveBeenCalled()
+    expect(model.label).toBe('')
+    expect(data.value).toHaveLength(2)
+    expect(queryDialog()).toBeNull()
+
+    // 弹框自身关闭交互（点击遮罩）也不保存
+    await clickRow(host, 1)
+    await flushDialog()
+    setInputValue(queryDialog()!.querySelector<HTMLInputElement>('.u-input input')!, '改过的名称')
+    await nextTick()
+    await nextTick()
+    document
+      .querySelector<HTMLElement>('.u-dialog__overlay')!
+      .dispatchEvent(new MouseEvent('mousedown', { bubbles: true, cancelable: true }))
+    await flushDialog()
+
+    expect(saveMethod).not.toHaveBeenCalled()
+    expect(data.value[1]).toMatchObject({ label: '调接口' })
+    expect(model.label).toBe('')
+    expect(queryDialog()).toBeNull()
+
+    unmount()
+  })
+})
+
+describe('UBatchEdit 属性透传', () => {
+  it('style / class 等非 props 属性透传到根布局元素（组件为片段根，需手动继承）', async () => {
+    const { host, unmount } = mountBatchEdit({
+      props: { style: 'height: 500px', class: 'custom-batch-edit' }
+    })
+    await nextTick()
+
+    const root = host.querySelector<HTMLElement>('.u-batch-edit')
+    expect(root).toBeTruthy()
+    expect(root!.classList.contains('custom-batch-edit')).toBe(true)
+    expect(root!.style.height).toBe('500px')
+
+    unmount()
+  })
+})

package/src/components/batch-edit/batch-edit-form.vue

@@ -1,6 +1,11 @@
 <template>
-  <!-- 表单常驻挂载（快照只在挂载时对传入的 model 拍一次），仅用 v-show 控制显隐 -->
-  <aside :class="cls.e('form')" v-if="!!props.model" v-show="state.formVisible">
+  <!-- 面板模式：表单常驻挂载（快照只在挂载时对传入的 model 拍一次），仅用 v-show 控制显隐；
+       弹框模式：表单随弹框挂载 / 卸载，model 初始快照由 use-edit-state 维护 -->
+  <aside
+    :class="[cls.e('form'), bem.is('dialog', props.formMode === 'dialog')]"
+    v-if="!!props.model"
+    v-show="state.formVisible"
+  >
     <header :class="cls.e('form-header')">
       <span :class="[cls.e('form-icon'), bem.is(state.formActionType)]">
         <u-icon>
@@ -48,7 +53,7 @@
       <span :class="cls.e('form-hint')">
         <template v-if="props.readonly"> 只读模式 </template>
 
-        <span :class="{ [bem.is('concealed')]: !focused }">
+        <span :class="{ [bem.is('concealed')]: !shortcutActive }">
           <template v-if="!(state.formActionType === 'update' && props.quickEdit)">
             <u-kbd>Ctrl + S</u-kbd> 保存 ·
           </template>
@@ -86,6 +91,7 @@ import { UKbd } from '../kbd'
 import { UScroll } from '../scroll'
 import { BatchEditDIKey } from './di'
 import { FORM_ACTION_HEADER_MAP } from './form-action-header'
+import { useDialogEffect } from './use-dialog-effect'
 
 defineOptions({ name: 'UBatchEditForm' })
 
@@ -96,6 +102,14 @@ const { cls, props, state, handleClose, handleSave, staticFeatures, dynamicFeatu
 
 const focused = toRef(batchEditCtx, 'focused')
 
+// 弹框模式下，弹框自身关闭（遮罩点击 / 右上角关闭）时同步走 handleClose，不保存
+useDialogEffect({ closeForm: handleClose })
+
+/** 快捷键提示是否可见：面板模式随聚焦显隐；弹框模式弹框打开期间快捷键始终可用 */
+const shortcutActive = computed(() => {
+  return props.formMode === 'dialog' ? state.formVisible : focused.value
+})
+
 const formComponentRef = shallowRef<FormExposed>()
 
 defineExpose<_FormExposed>({

package/src/components/batch-edit/batch-edit-list.vue

@@ -98,7 +98,8 @@ const tableProps = computed(() => {
     'saveMethod',
     'features',
     'mode',
-    'beforeCreate'
+    'beforeCreate',
+    'formMode'
   ])
 })
 

package/src/components/batch-edit/batch-edit.vue

@@ -9,15 +9,29 @@
     @focusin="handleFocusIn"
     @focusout="handleFocusOut"
     @keydown.capture="handleKeydown"
+    v-bind="$attrs"
   >
     <!-- 编辑列表 -->
     <BatchEditList :slots="slots" />
 
     <!-- 编辑表单 -->
-    <BatchEditForm ref="form" v-slot="scoped">
+    <BatchEditForm v-if="props.formMode === 'panel'" ref="form" v-slot="scoped">
       <slot name="form" v-bind="scoped" />
     </BatchEditForm>
   </u-layout>
+
+  <!-- 弹框模式：表单经 UDialog 呈现（teleport 到 body），快捷键监听落在弹框上，Esc 与弹框自带的 keyup.esc 去重 -->
+  <u-dialog
+    v-if="props.formMode === 'dialog'"
+    v-model="state.formVisible"
+    :class="cls.e('form-dialog')"
+    @keydown.capture="handleKeydown"
+    @keyup.esc.stop
+  >
+    <BatchEditForm ref="form" v-slot="scoped">
+      <slot name="form" v-bind="scoped" />
+    </BatchEditForm>
+  </u-dialog>
 </template>
 
 <script lang="ts" setup>
@@ -25,6 +39,7 @@ import { bem } from '@veltra/utils'
 import { computed, provide, useTemplateRef } from 'vue'
 
 import type { BatchEditEmits, BatchEditProps, BatchEditSlots, FormExposed } from '../../types'
+import { UDialog } from '../dialog'
 import { ULayout } from '../layout'
 import BatchEditForm from './batch-edit-form.vue'
 import BatchEditList from './batch-edit-list.vue'
@@ -34,9 +49,12 @@ import { useFeatures } from './use-features'
 import { useHandlers } from './use-handlers'
 import { useShortcutKey } from './use-shortcut-key'
 
-defineOptions({ name: 'UBatchEdit' })
+defineOptions({ name: 'UBatchEdit', inheritAttrs: false })
 
-const props = withDefaults(defineProps<BatchEditProps>(), { cols: () => ['1fr', '420px'] })
+const props = withDefaults(defineProps<BatchEditProps>(), {
+  cols: () => ['1fr', '420px'],
+  formMode: 'panel'
+})
 
 const emit = defineEmits<BatchEditEmits>()
 
@@ -61,7 +79,7 @@ const { handleFocusIn, handleFocusOut, handleKeydown, focused } = useShortcutKey
 })
 
 const cols = computed(() => {
-  return state.formVisible ? props.cols : undefined
+  return props.formMode === 'panel' && state.formVisible ? props.cols : undefined
 })
 
 provide(BatchEditDIKey, {

package/src/components/batch-edit/style.scss

@@ -52,6 +52,14 @@ $root-name: batch-edit;
     overflow: hidden;
     isolation: isolate;
     min-height: 0;
+
+    // 弹框模式：背景 / 圆角 / 阴影由弹框外壳提供，表单只保留内部布局并限高滚动
+    @include m.is(dialog) {
+      max-height: min(600px, 80vh);
+      background-color: transparent;
+      border-radius: 0;
+      box-shadow: none;
+    }
   }
 
   @include m.e(form-header) {
@@ -171,3 +179,15 @@ $root-name: batch-edit;
     flex-shrink: 0;
   }
 }
+
+// ---------- 弹框模式 ----------
+// 弹框 teleport 到 body，不在 .u-batch-edit 内，样式置于顶层
+#{fn.bem(batch-edit, form-dialog)} {
+  width: 560px;
+  max-width: calc(100vw - 32px);
+
+  // 表单自带头部（图标 / 标题 / 关闭按钮），弹框头部不再展示
+  #{fn.bem(dialog, header)} {
+    display: none;
+  }
+}

package/src/components/batch-edit/style.ts

@@ -1,5 +1,6 @@
 import '../action/style'
 import '../button/style'
+import '../dialog/style'
 import '../form/style'
 import '../icon/style'
 import '../layout/style'

package/src/components/batch-edit/use-dialog-effect.ts

@@ -10,12 +10,18 @@ interface Options {
 /**
  * 在表单上的副作用。
  * 包括：关闭表单
+ *
+ * sync 触发：弹框关闭会随即卸载表单组件，默认 pre 时序下 watcher 可能随组件卸载被丢弃
  */
 export function useDialogEffect(options: Options) {
   const dialogCtx = inject(DialogDIKey, undefined)
   if (!dialogCtx) return
 
-  watch(dialogCtx.visible, (visible) => {
-    !visible && options.closeForm?.()
-  })
+  watch(
+    dialogCtx.visible,
+    (visible) => {
+      !visible && options.closeForm?.()
+    },
+    { flush: 'sync' }
+  )
 }

package/src/components/batch-edit/use-edit-state.ts

@@ -1,4 +1,4 @@
-import { o } from '@cat-kit/core'
+import { copy, o } from '@cat-kit/core'
 import { nextTick, shallowReactive, shallowRef, watch, type ShallowRef } from 'vue'
 
 import type { BatchEditProps, BatchEditStates, FormExposed } from '../../types'
@@ -24,9 +24,37 @@ export function useEditState(options: Options) {
   /** 是否正在以编程方式重置/回显表单，此期间禁止 quick-edit 回写行数据 */
   const syncing = shallowRef(false)
 
+  /**
+   * model 初始快照。
+   * 面板模式由常驻挂载的 UForm 自行维护快照；dialog 模式表单随弹框卸载，
+   * UForm 快照会在每次打开时按已回显的 model 重拍，故这里单独保留一份供恢复
+   */
+  const initialModel = shallowRef<Record<string, any>>()
+
+  watch(
+    () => props.model,
+    (model) => {
+      initialModel.value = props.formMode === 'dialog' && model ? copy(model) : undefined
+    },
+    { immediate: true }
+  )
+
+  /** 重置表单数据到 model 初始快照 */
+  function resetModel() {
+    if (props.formMode !== 'dialog') {
+      formRef.value?.reset()
+      return
+    }
+
+    formRef.value?.clearValidate()
+    if (!props.model || !initialModel.value) return
+    for (const key of Object.keys(initialModel.value)) {
+      o(props.model).set(key, copy(initialModel.value[key]))
+    }
+  }
+
   function resetState() {
-    // 表单常驻挂载，重置即恢复到 model 初始快照
-    formRef.value?.reset()
+    resetModel()
 
     if (state.row) {
       state.row.isCurrent = false
@@ -47,7 +75,7 @@ export function useEditState(options: Options) {
       // 先重置回 model 初始快照，再同步回显行数据。
       // 同一 tick 内的连续写入会被表单字段 watcher 合并，
       // 重置产生的默认值不会触发 field:update 回写行数据
-      formRef.value?.reset()
+      resetModel()
 
       if (row) {
         if (props.model) {

package/src/components/batch-edit/use-handlers.ts

@@ -170,6 +170,12 @@ export function useHandlers(options: Options): EditReturned {
       }
       insert(item)
 
+      // 弹框模式保存成功即关闭，不走面板的连续新增
+      if (props.formMode === 'dialog') {
+        resetState()
+        return
+      }
+
       // 推进插入点，便于连续新增；并重置表单到初始默认值
       const next = last(state.indexPath) + 1
       state.indexPath = [...state.indexPath.slice(0, -1), next]
@@ -190,6 +196,10 @@ export function useHandlers(options: Options): EditReturned {
       Object.keys(item).forEach((key) => {
         o(row.data).set(key, o(item).get(key))
       })
+
+    if (props.formMode === 'dialog') {
+      resetState()
+    }
   })
 
   const handleDelete = runWithLoading(async (row: TableRow) => {

package/src/components/batch-edit/use-shortcut-key.ts

@@ -38,12 +38,16 @@ export function useShortcutKey(options: Options) {
   }
 
   /**
-   * 键盘快捷键（仅组件获焦时生效）：
+   * 键盘快捷键：
    * - Esc          关闭表单
    * - ⌘/Ctrl + S   保存（快速编辑模式下编辑行时除外）
+   *
+   * 面板模式仅组件获焦时生效；弹框模式表单被 teleport 到 body，
+   * 组件聚焦状态覆盖不到，改为弹框打开期间生效
    */
   function handleKeydown(e: KeyboardEvent) {
-    if (!focused.value) return
+    const active = props.formMode === 'dialog' ? state.formVisible : focused.value
+    if (!active) return
     if (props.readonly && e.key !== 'Escape') return
 
     if (e.key === 'Escape') return runEscape(e)