feat(editor): 支持自定义历史对比/回滚弹窗内表单组件的尺寸

This commit is contained in:
roymondchen 2026-07-06 17:17:39 +08:00
parent 90492ad3ea
commit 605f07c8fe
4 changed files with 28 additions and 1 deletions

View File

@ -13,6 +13,7 @@
:extend-state="mergedExtendState" :extend-state="mergedExtendState"
:show-diff="showDiff" :show-diff="showDiff"
:self-diff-field-types="selfDiffFieldTypes" :self-diff-field-types="selfDiffFieldTypes"
:size="size"
></MForm> ></MForm>
</div> </div>
</template> </template>
@ -22,6 +23,7 @@ import { computed, inject, provide, type Ref, ref, type ShallowRef, useTemplateR
import { isEqual } from 'lodash-es'; import { isEqual } from 'lodash-es';
import { type CodeBlockContent, type DataSourceSchema, HookType, type MNode } from '@tmagic/core'; import { type CodeBlockContent, type DataSourceSchema, HookType, type MNode } from '@tmagic/core';
import { type FieldSize } from '@tmagic/design';
import { type FormConfig, type FormState, type FormValue, MForm } from '@tmagic/form'; import { type FormConfig, type FormState, type FormValue, MForm } from '@tmagic/form';
import type { CompareCategory, CompareFormLoadConfig, Services } from '@editor/type'; import type { CompareCategory, CompareFormLoadConfig, Services } from '@editor/type';
@ -68,6 +70,11 @@ const props = withDefaults(
baseFormState?: FormState; baseFormState?: FormState;
/** 需要走 self diff 的字段类型(例如 mod-cond。 */ /** 需要走 self diff 的字段类型(例如 mod-cond。 */
selfDiffFieldTypes?: string[]; selfDiffFieldTypes?: string[];
/**
* 表单内组件的尺寸透传给 MForm `size`可选 'large' | 'default' | 'small'
* 缺省时使用 MForm 内置默认尺寸
*/
size?: FieldSize;
/** /**
* 自定义 FormConfig 加载逻辑传入后将接管内置的按 `category`(node/data-source/code-block) * 自定义 FormConfig 加载逻辑传入后将接管内置的按 `category`(node/data-source/code-block)
* 取配置逻辑调用方可根据业务自行返回或异步返回表单配置可通过 * 取配置逻辑调用方可根据业务自行返回或异步返回表单配置可通过

View File

@ -48,6 +48,7 @@
:load-config="loadConfig" :load-config="loadConfig"
:self-diff-field-types="selfDiffFieldTypes" :self-diff-field-types="selfDiffFieldTypes"
:services="props.services" :services="props.services"
:size="props.size"
height="70vh" height="70vh"
/> />
@ -77,7 +78,14 @@
import { computed, ref, watch } from 'vue'; import { computed, ref, watch } from 'vue';
import { isEqual } from 'lodash-es'; import { isEqual } from 'lodash-es';
import { TMagicButton, TMagicDialog, TMagicRadioButton, TMagicRadioGroup, TMagicTag } from '@tmagic/design'; import {
type FieldSize,
TMagicButton,
TMagicDialog,
TMagicRadioButton,
TMagicRadioGroup,
TMagicTag,
} from '@tmagic/design';
import type { FormState } from '@tmagic/form'; import type { FormState } from '@tmagic/form';
import CompareForm from '@editor/components/CompareForm.vue'; import CompareForm from '@editor/components/CompareForm.vue';
@ -104,6 +112,8 @@ const props = withDefaults(
*/ */
loadConfig?: CompareFormLoadConfig; loadConfig?: CompareFormLoadConfig;
width?: string; width?: string;
/** 差异对比表单内组件的尺寸(透传给 CompareForm 的 `size`),可选 'large' | 'default' | 'small'。 */
size?: FieldSize;
isConfirm?: boolean; isConfirm?: boolean;
onConfirm?: () => void; onConfirm?: () => void;
selfDiffFieldTypes?: string[]; selfDiffFieldTypes?: string[];

View File

@ -95,6 +95,7 @@ const mountHistoryDiffDialog = async (
selfDiffFieldTypes: options.selfDiffFieldTypes, selfDiffFieldTypes: options.selfDiffFieldTypes,
compareFormState: options.compareFormState, compareFormState: options.compareFormState,
width: options.width, width: options.width,
size: options.size ?? options.services?.uiService?.get('propsPanelSize'),
onClose: options.onClose, onClose: options.onClose,
}); });
if (options.appContext) { if (options.appContext) {
@ -223,6 +224,7 @@ export const useHistoryRevert = (options: UseHistoryRevertOptions = {}, services
services, services,
...extra, ...extra,
width: extra?.width ?? dialogWidth, width: extra?.width ?? dialogWidth,
size: extra?.size,
}); });
} }
return confirmRevert(); return confirmRevert();
@ -382,6 +384,7 @@ export const useHistoryRevert = (options: UseHistoryRevertOptions = {}, services
loadConfig: revertOptions.loadConfig, loadConfig: revertOptions.loadConfig,
selfDiffFieldTypes: revertOptions.selfDiffFieldTypes, selfDiffFieldTypes: revertOptions.selfDiffFieldTypes,
width: revertOptions.width, width: revertOptions.width,
size: revertOptions.size,
}); });
if (!confirmed) return null; if (!confirmed) return null;
return await revertOptions.revert(); return await revertOptions.revert();
@ -399,6 +402,7 @@ export const useHistoryRevert = (options: UseHistoryRevertOptions = {}, services
services, services,
...extra, ...extra,
width: extra?.width ?? dialogWidth, width: extra?.width ?? dialogWidth,
size: extra?.size,
}); });
}; };

View File

@ -33,6 +33,7 @@ import type {
MPage, MPage,
MPageFragment, MPageFragment,
} from '@tmagic/core'; } from '@tmagic/core';
import type { FieldSize } from '@tmagic/design';
import type { ChangeRecord, FormConfig, FormState, TableColumnConfig, TypeFunction } from '@tmagic/form'; import type { ChangeRecord, FormConfig, FormState, TableColumnConfig, TypeFunction } from '@tmagic/form';
import type StageCore from '@tmagic/stage'; import type StageCore from '@tmagic/stage';
import type { import type {
@ -1453,6 +1454,11 @@ export interface CustomDiffFormOptions {
* `'1200px'` / `'80%'`使900px * `'1200px'` / `'80%'`使900px
*/ */
width?: string; width?: string;
/**
* / form CompareForm `size`
* `'large' | 'default' | 'small'`使
*/
size?: FieldSize;
} }
/** /**