@tmagic/editor 1.8.0-beta.2 → 1.8.0-beta.21

package/dist/es/fields/DataSourceFieldSelect/Index.vue_vue_type_script_setup_true_lang.js

@@ -1,14 +1,13 @@
 import { useServices } from "../../hooks/use-services.js";
 import Icon_default from "../../components/Icon.js";
+import DatasourceIcon_default from "../../icons/DatasourceIcon.js";
 import FieldSelect_default from "./FieldSelect.js";
 import { getFormField } from "@tmagic/form";
 import { TMagicButton, TMagicTooltip, tMagicMessage } from "@tmagic/design";
 import { DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, removeDataSourceFieldPrefix } from "@tmagic/utils";
-import { computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, inject, openBlock, ref, resolveComponent, resolveDynamicComponent, unref, watch, withCtx } from "vue";
-import { Coin } from "@element-plus/icons-vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, inject, normalizeClass, openBlock, ref, resolveComponent, resolveDynamicComponent, unref, watch, withCtx } from "vue";
 //#region packages/editor/src/fields/DataSourceFieldSelect/Index.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { class: "m-fields-data-source-field-select" };
-var Index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsDataSourceFieldSelect",
 	__name: "Index",
 	props: {
@@ -24,13 +23,17 @@ var Index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	},
 	emits: ["change"],
 	setup(__props, { emit: __emit }) {
 		const emit = __emit;
 		const props = __props;
 		const showDataSourceFieldSelect = ref(false);
+		const isSelectValid = computed(() => !disabledDataSource.value && (showDataSourceFieldSelect.value || !props.config.fieldConfig));
 		watch(() => props.model[props.name], (value) => {
 			if (Array.isArray(value) && typeof value[0] === "string" && value[0].startsWith(DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX)) showDataSourceFieldSelect.value = true;
 			else showDataSourceFieldSelect.value = false;
@@ -100,7 +103,7 @@ var Index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 			showDataSourceFieldSelect.value = !showDataSourceFieldSelect.value;
 		};
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", _hoisted_1, [!disabledDataSource.value && (showDataSourceFieldSelect.value || !__props.config.fieldConfig) ? (openBlock(), createBlock(FieldSelect_default, {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["m-fields-data-source-field-select", { [`data-source-field-${type.value}`]: !isSelectValid.value }]) }, [isSelectValid.value ? (openBlock(), createBlock(FieldSelect_default, {
 				key: 0,
 				"model-value": __props.model[__props.name],
 				disabled: __props.disabled,
@@ -151,7 +154,7 @@ var Index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 					disabled: __props.disabled,
 					onClick: onToggleDataSourceFieldSelectHandler
 				}, {
-					default: withCtx(() => [createVNode(Icon_default, { icon: unref(Coin) }, null, 8, ["icon"])]),
+					default: withCtx(() => [createVNode(Icon_default, { icon: DatasourceIcon_default })]),
 					_: 1
 				}, 8, [
 					"type",
@@ -159,7 +162,7 @@ var Index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 					"disabled"
 				])]),
 				_: 1
-			}, 8, ["disabled"])) : createCommentVNode("v-if", true)]);
+			}, 8, ["disabled"])) : createCommentVNode("v-if", true)], 2);
 		};
 	}
 });

package/dist/es/fields/DataSourceFields.vue_vue_type_script_setup_true_lang.js

@@ -7,17 +7,17 @@ import { MFormBox } from "@tmagic/form";
 import { MagicTable } from "@tmagic/table";
 import { TMagicButton, tMagicMessage, tMagicMessageBox } from "@tmagic/design";
 import { getDefaultValueFromFields } from "@tmagic/utils";
-import { computed, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, inject, isRef, mergeModels, openBlock, ref, unref, useModel, withCtx } from "vue";
+import { computed, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, inject, isRef, mergeModels, onMounted, openBlock, provide, ref, unref, useModel, withCtx } from "vue";
 //#region packages/editor/src/fields/DataSourceFields.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "m-editor-data-source-fields" };
 var _hoisted_2 = {
 	key: 0,
 	class: "m-editor-data-source-fields-footer"
 };
-var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsDataSourceFields",
 	__name: "DataSourceFields",
-	props: /* @__PURE__ */ mergeModels({
+	props: /*@__PURE__*/ mergeModels({
 		config: {},
 		model: {},
 		initValues: {},
@@ -30,7 +30,10 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	}, {
 		"width": { default: 670 },
 		"widthModifiers": {},
@@ -45,7 +48,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		},
 		"visible1Modifiers": {}
 	}),
-	emits: /* @__PURE__ */ mergeModels(["change"], [
+	emits: /*@__PURE__*/ mergeModels(["change"], [
 		"update:width",
 		"update:visible",
 		"update:visible1"
@@ -66,6 +69,15 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			calcBoxPosition();
 			addDialogVisible.value = true;
 		};
+		const editField = (row, index) => {
+			fieldValues.value = {
+				...row,
+				index
+			};
+			fieldTitle.value = `编辑${row.title}`;
+			calcBoxPosition();
+			addDialogVisible.value = true;
+		};
 		const fieldChange = ({ index, ...value }, data) => {
 			addDialogVisible.value = false;
 			if (index > -1) emit("change", value, {
@@ -117,13 +129,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 				actions: [{
 					text: "编辑",
 					handler: (row, index) => {
-						fieldValues.value = {
-							...row,
-							index
-						};
-						fieldTitle.value = `编辑${row.title}`;
-						calcBoxPosition();
-						addDialogVisible.value = true;
+						editField(row, index);
 					}
 				}, {
 					text: "删除",
@@ -310,6 +316,21 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		const addFromJsonDialogVisible = useModel(__props, "visible1");
 		const { height: editorHeight } = useEditorContentHeight();
 		const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, inject("parentFloating", ref(null)));
+		const frameworkWidth = computed(() => uiService.get("frameworkRect")?.width || 0);
+		/**
+		* 由 DataSourceConfigPanel 注入：打开数据源详情后需要直接打开的字段路径（字段名数组）。
+		* 当前层消费 path[0]，并把剩余路径下发给嵌套字段，实现逐层打开。
+		*/
+		const editingFieldPath = inject("editingDataSourceFieldPath", computed(() => []));
+		provide("editingDataSourceFieldPath", computed(() => editingFieldPath.value.slice(1)));
+		onMounted(() => {
+			const path = editingFieldPath.value;
+			if (!path.length) return;
+			const fields = props.model[props.name] || [];
+			const index = fields.findIndex((field) => field.name === path[0]);
+			if (index === -1) return;
+			editField(fields[index], index);
+		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", _hoisted_1, [
 				createVNode(unref(MagicTable), {
@@ -336,6 +357,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					_: 1
 				}, 8, ["disabled"])])) : createCommentVNode("v-if", true),
 				createVNode(FloatingBox_default, {
+					"body-style": { padding: "0 16px" },
 					visible: addDialogVisible.value,
 					"onUpdate:visible": _cache[2] || (_cache[2] = ($event) => addDialogVisible.value = $event),
 					width: width.value,
@@ -343,6 +365,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					height: unref(editorHeight),
 					"onUpdate:height": _cache[4] || (_cache[4] = ($event) => isRef(editorHeight) ? editorHeight.value = $event : null),
 					title: fieldTitle.value,
+					"framework-width": frameworkWidth.value,
 					position: unref(boxPosition)
 				}, {
 					body: withCtx(() => [createVNode(unref(MFormBox), {
@@ -365,9 +388,11 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					"width",
 					"height",
 					"title",
+					"framework-width",
 					"position"
 				]),
 				createVNode(FloatingBox_default, {
+					"body-style": { padding: "0 16px" },
 					visible: addFromJsonDialogVisible.value,
 					"onUpdate:visible": _cache[5] || (_cache[5] = ($event) => addFromJsonDialogVisible.value = $event),
 					width: width.value,
@@ -375,6 +400,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					height: unref(editorHeight),
 					"onUpdate:height": _cache[7] || (_cache[7] = ($event) => isRef(editorHeight) ? editorHeight.value = $event : null),
 					title: "快速添加数据定义",
+					"framework-width": frameworkWidth.value,
 					position: unref(boxPosition)
 				}, {
 					body: withCtx(() => [createVNode(unref(MFormBox), {
@@ -388,6 +414,7 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					"visible",
 					"width",
 					"height",
+					"framework-width",
 					"position"
 				])
 			]);

package/dist/es/fields/DataSourceInput.vue_vue_type_script_setup_true_lang.js

@@ -1,8 +1,8 @@
 import { useServices } from "../hooks/use-services.js";
-import { getDisplayField } from "../utils/data-source/index.js";
+import { getDisplayField, resolveFieldByPath } from "../utils/data-source/index.js";
 import Icon_default from "../components/Icon.js";
 import { TMagicInput, TMagicTag, getDesignConfig } from "@tmagic/design";
-import { getKeysArray, isNumber } from "@tmagic/utils";
+import { getKeysArray } from "@tmagic/utils";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, nextTick, normalizeClass, openBlock, ref, renderList, resolveDynamicComponent, toDisplayString, unref, useTemplateRef, watch, withCtx } from "vue";
 import { Coin } from "@element-plus/icons-vue";
 //#region packages/editor/src/fields/DataSourceInput.vue?vue&type=script&setup=true&lang.ts
@@ -15,7 +15,7 @@ var _hoisted_2 = { style: {
 	"font-size": "10px",
 	"color": "rgba(0, 0, 0, 0.6)"
 } };
-var DataSourceInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var DataSourceInput_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsDataSourceInput",
 	__name: "DataSourceInput",
 	props: {
@@ -31,7 +31,10 @@ var DataSourceInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	},
 	emits: ["change"],
 	setup(__props, { emit: __emit }) {
@@ -132,23 +135,11 @@ var DataSourceInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 				cb([]);
 				return;
 			}
-			let fields = ds.fields || [];
-			let key = keys.shift();
-			while (key) {
-				if (isNumber(key)) {
-					key = keys.shift();
-					continue;
-				}
-				for (const field of fields) if (field.name === key) {
-					fields = field.fields || [];
-					key = keys.shift();
-					break;
-				}
-			}
-			if (curCharIsDot(dotIndex)) result = fields || [];
+			const { fields } = resolveFieldByPath(ds.fields, keys, { skipNumberIndices: true });
+			if (curCharIsDot(dotIndex)) result = fields;
 			else if (dotIndex > -1) {
 				const queryName = queryString.substring(dotIndex + 1).toLowerCase();
-				result = fields.filter((field) => field.name?.toLowerCase().includes(queryName) || field.title?.toLowerCase().includes(queryName)) || [];
+				result = fields.filter((field) => field.name?.toLowerCase().includes(queryName) || field.title?.toLowerCase().includes(queryName));
 			}
 			cb(result.map((field) => ({
 				value: field.name,
@@ -227,7 +218,7 @@ var DataSourceInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 				onSelect: selectHandler
 			}), {
 				suffix: withCtx(() => [createVNode(Icon_default, { icon: unref(Coin) }, null, 8, ["icon"])]),
-				default: withCtx(({ item }) => [createElementVNode("div", _hoisted_1, [createElementVNode("div", null, toDisplayString(item.text), 1), createElementVNode("span", _hoisted_2, toDisplayString(item.value), 1)])]),
+				default: withCtx((slotProps) => [createElementVNode("div", _hoisted_1, [createElementVNode("div", null, toDisplayString(slotProps?.item?.text || ""), 1), createElementVNode("span", _hoisted_2, toDisplayString(slotProps?.item?.value || ""), 1)])]),
 				_: 1
 			}, 16, ["modelValue"])) : (openBlock(), createElementBlock("div", {
 				key: 2,

package/dist/es/fields/DataSourceMethodSelect.vue_vue_type_script_setup_true_name_true_lang.js

@@ -11,7 +11,7 @@ import { Edit, View } from "@element-plus/icons-vue";
 //#region packages/editor/src/fields/DataSourceMethodSelect.vue?vue&type=script&setup=true&name=true&lang.ts
 var _hoisted_1 = { class: "m-fields-data-source-method-select" };
 var _hoisted_2 = { class: "data-source-method-select-container" };
-var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default = /* @__PURE__ */ defineComponent({
+var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsDataSourceMethodSelect",
 	__name: "DataSourceMethodSelect",
 	props: {
@@ -27,7 +27,10 @@ var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	},
 	emits: ["change"],
 	setup(__props, { emit: __emit }) {
@@ -36,7 +39,7 @@ var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default
 		const eventBus = inject("eventBus");
 		const emit = __emit;
 		const props = __props;
-		const hasDataSourceSidePanel = computed(() => (uiService.get("sideBarItems") || []).find((item) => item.$key === SideItemKey.DATA_SOURCE));
+		const dataSourceSidePanel = computed(() => (uiService.get("sideBarItems") || []).find((item) => item.$key === SideItemKey.DATA_SOURCE));
 		const notEditable = computed(() => filterFunction(mForm, props.config.notEditable, props));
 		/** 对比模式下隐藏查看/编辑操作按钮，仅保留只读展示。 */
 		const isCompare = computed(() => Boolean(mForm?.isCompare));
@@ -124,9 +127,11 @@ var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default
 			emit("change", props.model[props.name], eventData);
 		};
 		const editCodeHandler = () => {
-			const [id] = props.model[props.name];
+			const [id, methodName] = props.model[props.name];
 			if (!dataSourceService.getDataSourceById(id)) return;
-			eventBus?.emit("edit-data-source", id);
+			const sideBarItem = dataSourceSidePanel.value;
+			if (sideBarItem) uiService.set("sideBarActiveTabName", sideBarItem.text || sideBarItem.$key || SideItemKey.DATA_SOURCE);
+			eventBus?.emit("edit-data-source-method", id, methodName);
 		};
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [createVNode(unref(MCascader), {
@@ -145,7 +150,7 @@ var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default
 				"size",
 				"disabled",
 				"prop"
-			]), __props.model[__props.name] && isCustomMethod.value && hasDataSourceSidePanel.value && !isCompare.value ? (openBlock(), createBlock(unref(TMagicTooltip), {
+			]), __props.model[__props.name] && isCustomMethod.value && dataSourceSidePanel.value && !isCompare.value ? (openBlock(), createBlock(unref(TMagicTooltip), {
 				key: 0,
 				content: notEditable.value ? "查看" : "编辑"
 			}, {

package/dist/es/fields/DataSourceMethods.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,7 @@
 import CodeBlockEditor_default from "../components/CodeBlockEditor.js";
 import { MagicTable } from "@tmagic/table";
 import { TMagicButton, tMagicMessageBox } from "@tmagic/design";
-import { computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, inject, nextTick, openBlock, ref, unref, useTemplateRef, withCtx } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, inject, nextTick, onMounted, openBlock, ref, unref, useTemplateRef, withCtx } from "vue";
 import { cloneDeep } from "lodash-es";
 //#region packages/editor/src/fields/DataSourceMethods.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "m-editor-data-source-methods" };
@@ -9,7 +9,7 @@ var _hoisted_2 = {
 	key: 0,
 	class: "m-editor-data-source-methods-footer"
 };
-var DataSourceMethods_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var DataSourceMethods_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsDataSourceMethods",
 	__name: "DataSourceMethods",
 	props: {
@@ -25,7 +25,10 @@ var DataSourceMethods_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	},
 	emits: ["change"],
 	setup(__props, { emit: __emit }) {
@@ -37,6 +40,19 @@ var DataSourceMethods_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		const codeConfig = ref();
 		const codeBlockEditorRef = useTemplateRef("codeBlockEditor");
 		let editIndex = -1;
+		const editMethod = (method, index) => {
+			let codeContent = "({ params, dataSource, app }) => {\n  // place your code here\n}";
+			if (method.content) if (typeof method.content !== "string") codeContent = method.content.toString();
+			else codeContent = method.content;
+			codeConfig.value = {
+				...cloneDeep(method),
+				content: codeContent
+			};
+			editIndex = index;
+			nextTick(() => {
+				codeBlockEditorRef.value?.show();
+			});
+		};
 		const methodColumns = [
 			{
 				label: "名称",
@@ -61,17 +77,7 @@ var DataSourceMethods_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 				actions: [{
 					text: "编辑",
 					handler: (method, index) => {
-						let codeContent = "({ params, dataSource, app }) => {\n  // place your code here\n}";
-						if (method.content) if (typeof method.content !== "string") codeContent = method.content.toString();
-						else codeContent = method.content;
-						codeConfig.value = {
-							...cloneDeep(method),
-							content: codeContent
-						};
-						editIndex = index;
-						nextTick(() => {
-							codeBlockEditorRef.value?.show();
-						});
+						editMethod(method, index);
 					}
 				}, {
 					text: "删除",
@@ -119,6 +125,16 @@ var DataSourceMethods_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			codeConfig.value = void 0;
 			codeBlockEditorRef.value?.hide();
 		};
+		/** 由 DataSourceConfigPanel 注入：打开数据源详情后需要直接打开的方法名 */
+		const editingMethodName = inject("editingDataSourceMethodName", computed(() => ""));
+		onMounted(() => {
+			const methodName = editingMethodName.value;
+			if (!methodName) return;
+			const methods = props.model[props.name] || [];
+			const index = methods.findIndex((method) => method.name === methodName);
+			if (index === -1) return;
+			editMethod(methods[index], index);
+		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", _hoisted_1, [
 				createVNode(unref(MagicTable), {

package/dist/es/fields/DataSourceMocks.vue_vue_type_script_setup_true_lang.js

@@ -14,10 +14,10 @@ var _hoisted_2 = {
 	key: 0,
 	class: "m-editor-data-source-fields-footer"
 };
-var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsDataSourceMocks",
 	__name: "DataSourceMocks",
-	props: /* @__PURE__ */ mergeModels({
+	props: /*@__PURE__*/ mergeModels({
 		config: {},
 		model: {},
 		initValues: {},
@@ -30,7 +30,10 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	}, {
 		"width": { default: 670 },
 		"widthModifiers": {},
@@ -40,7 +43,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 		},
 		"visibleModifiers": {}
 	}),
-	emits: /* @__PURE__ */ mergeModels(["change"], ["update:width", "update:visible"]),
+	emits: /*@__PURE__*/ mergeModels(["change"], ["update:width", "update:visible"]),
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -213,6 +216,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 		const addDialogVisible = useModel(__props, "visible");
 		const { height: editorHeight } = useEditorContentHeight();
 		const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, inject("parentFloating", ref(null)));
+		const frameworkWidth = computed(() => uiService.get("frameworkRect")?.width || 0);
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", _hoisted_1, [
 				createVNode(unref(MagicTable), {
@@ -230,6 +234,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 					_: 1
 				}, 8, ["disabled"])])) : createCommentVNode("v-if", true),
 				createVNode(FloatingBox_default, {
+					"body-style": { padding: "0 16px" },
 					visible: addDialogVisible.value,
 					"onUpdate:visible": _cache[1] || (_cache[1] = ($event) => addDialogVisible.value = $event),
 					width: width.value,
@@ -237,6 +242,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 					height: unref(editorHeight),
 					"onUpdate:height": _cache[3] || (_cache[3] = ($event) => isRef(editorHeight) ? editorHeight.value = $event : null),
 					title: drawerTitle.value,
+					"framework-width": frameworkWidth.value,
 					position: unref(boxPosition)
 				}, {
 					body: withCtx(() => [createVNode(unref(MFormBox), {
@@ -257,6 +263,7 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 					"width",
 					"height",
 					"title",
+					"framework-width",
 					"position"
 				])
 			]);

package/dist/es/fields/DataSourceSelect.vue_vue_type_script_setup_true_lang.js

@@ -7,7 +7,7 @@ import { computed, createBlock, createCommentVNode, createElementBlock, createVN
 import { Edit, View } from "@element-plus/icons-vue";
 //#region packages/editor/src/fields/DataSourceSelect.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "m-fields-data-source-select" };
-var DataSourceSelect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var DataSourceSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MFieldsDataSourceSelect",
 	__name: "DataSourceSelect",
 	props: {
@@ -23,7 +23,10 @@ var DataSourceSelect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	},
 	emits: ["change"],
 	setup(__props, { emit: __emit }) {

package/dist/es/fields/DisplayConds.vue_vue_type_script_setup_true_lang.js

@@ -3,7 +3,7 @@ import { getCascaderOptionsFromFields, getFieldType } from "../utils/data-source
 import { MGroupList, filterFunction } from "@tmagic/form";
 import { computed, createBlock, defineComponent, inject, openBlock, unref } from "vue";
 //#region packages/editor/src/fields/DisplayConds.vue?vue&type=script&setup=true&lang.ts
-var DisplayConds_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var DisplayConds_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "m-fields-display-conds",
 	__name: "DisplayConds",
 	props: {
@@ -19,7 +19,10 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 		},
 		size: {},
 		lastValues: {},
-		isCompare: { type: Boolean }
+		isCompare: { type: Boolean },
+		text: {},
+		labelWidth: {},
+		labelPosition: {}
 	},
 	emits: ["change"],
 	setup(__props, { emit: __emit }) {
@@ -43,11 +46,14 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 			titlePrefix: props.config.titlePrefix,
 			expandAll: true,
 			enableToggleMode: false,
+			flat: props.config.flat,
 			items: [{
 				type: "table",
 				name: "cond",
-				operateColWidth: 80,
+				operateColWidth: props.config.operateColWidth,
 				enableToggleMode: false,
+				fixed: props.config.fixed,
+				flat: props.config.flat,
 				items: [
 					parentFields.value.length ? {
 						type: "cascader",
@@ -70,7 +76,16 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 						value: "key",
 						label: "字段",
 						checkStrictly: false,
-						onChange: fieldOnChange
+						onChange: fieldOnChange,
+						defaultValue: () => [],
+						rules: [{
+							required: true,
+							trigger: "blur",
+							message: "请选择字段"
+						}, {
+							typeMatch: true,
+							trigger: "change"
+						}]
 					} : {
 						type: "data-source-field-select",
 						name: "field",
@@ -83,14 +98,31 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 							"boolean",
 							"any"
 						],
-						onChange: fieldOnChange
+						onChange: fieldOnChange,
+						defaultValue: () => [],
+						rules: [{
+							required: true,
+							trigger: "blur",
+							message: "请选择字段"
+						}, {
+							typeMatch: true,
+							trigger: "change"
+						}]
 					},
 					{
 						type: "cond-op-select",
 						parentFields: parentFields.value,
 						label: "条件",
 						width: 140,
-						name: "op"
+						name: "op",
+						rules: [{
+							required: true,
+							trigger: "blur",
+							message: "请选择条件"
+						}, {
+							typeMatch: true,
+							trigger: "change"
+						}]
 					},
 					{
 						label: "值",