@tmagic/form 1.3.16 → 1.4.0-beta.2

package/dist/style.css

@@ -221,17 +221,12 @@ fieldset.m-fieldset .m-form-tip {
 .m-form-box {
   display: flex;
   flex-direction: column;
-  padding: 16px;
-  width: 100%;
 }
 .m-form-box .el-box__header {
   margin: 0;
 }
-.m-form-box .m-box-body {
-  flex: 1;
-  overflow-y: auto;
-  overflow-x: hidden;
-}
 .m-form-box .dialog-footer {
-  margin-top: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }

package/dist/tmagic-form.js

@@ -1,7 +1,7 @@
 import { toRaw, defineComponent, inject, ref, computed, resolveComponent, watchEffect, watch, openBlock, createElementBlock, normalizeStyle, normalizeClass, createBlock, resolveDynamicComponent, Fragment, createVNode, unref, withCtx, createElementVNode, createCommentVNode, renderList, createTextVNode, toDisplayString, withDirectives, vShow, renderSlot, onMounted, Teleport, toRefs, mergeProps, getCurrentInstance, reactive, onBeforeUnmount, vModelText, provide, onBeforeMount, nextTick, resolveDirective, createSlots, withModifiers } from 'vue';
 import { WarningFilled, CaretBottom, CaretRight, Delete, CaretTop, Grid, ArrowUp, ArrowDown, FullScreen } from '@element-plus/icons-vue';
 import { cloneDeep, isEqual, isEmpty } from 'lodash-es';
-import { TMagicFormItem, TMagicTooltip, TMagicIcon, TMagicButton, TMagicCheckbox, TMagicCard, TMagicCol, TMagicRow, TMagicSteps, TMagicStep, useZIndex, TMagicTable, TMagicTableColumn, TMagicUpload, TMagicPagination, tMagicMessage, getConfig as getConfig$1, TMagicBadge, TMagicCascader, TMagicCheckboxGroup, TMagicColorPicker, TMagicDatePicker, TMagicForm, TMagicInput, TMagicDialog, TMagicInputNumber, TMagicRadioGroup, TMagicRadio, TMagicOptionGroup, TMagicOption, TMagicSelect, TMagicSwitch, TMagicPopover, TMagicTimePicker, TMagicDrawer } from '@tmagic/design';
+import { TMagicFormItem, TMagicTooltip, TMagicIcon, TMagicButton, TMagicCheckbox, TMagicCard, TMagicCol, TMagicRow, TMagicSteps, TMagicStep, useZIndex, TMagicTable, TMagicTableColumn, TMagicUpload, TMagicPagination, tMagicMessage, getConfig as getConfig$1, TMagicBadge, TMagicCascader, TMagicCheckboxGroup, TMagicColorPicker, TMagicDatePicker, TMagicForm, TMagicInput, TMagicDialog, TMagicInputNumber, TMagicRadioGroup, TMagicRadio, TMagicOptionGroup, TMagicOption, TMagicSelect, TMagicSwitch, TMagicPopover, TMagicTimePicker, TMagicDrawer, TMagicScrollbar } from '@tmagic/design';
 import Sortable from 'sortablejs';
 import { sleep, asyncLoadJs, datetimeFormatter, getValueByKeyPath, isNumber } from '@tmagic/utils';
 
@@ -166,16 +166,16 @@ const initValue = async (mForm, { initValues, config }) => {
   return valuesTmp || {};
 };
 
-const _hoisted_1$e = ["id", "data-magic-id"];
-const _hoisted_2$9 = ["innerHTML"];
+const _hoisted_1$d = ["id", "data-magic-id"];
+const _hoisted_2$8 = ["innerHTML", "title"];
 const _hoisted_3$5 = ["innerHTML"];
 const _hoisted_4$4 = ["innerHTML"];
 const _hoisted_5$4 = ["innerHTML"];
-const _hoisted_6$2 = ["innerHTML"];
+const _hoisted_6$2 = ["innerHTML", "title"];
 const _hoisted_7$1 = ["innerHTML"];
 const _hoisted_8$1 = ["innerHTML"];
 const _hoisted_9 = ["innerHTML"];
-const _hoisted_10 = ["innerHTML"];
+const _hoisted_10 = ["innerHTML", "title"];
 const _hoisted_11 = ["innerHTML"];
 const _hoisted_12 = ["innerHTML"];
 const _hoisted_13 = ["innerHTML"];
@@ -371,8 +371,9 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
           }, {
             label: withCtx(() => [
               createElementVNode("span", {
-                innerHTML: type.value === "checkbox" ? "" : text.value
-              }, null, 8, _hoisted_2$9)
+                innerHTML: type.value === "checkbox" ? "" : text.value,
+                title: _ctx.config.labelTitle
+              }, null, 8, _hoisted_2$8)
             ]),
             default: withCtx(() => [
               tooltip.value ? (openBlock(), createBlock(unref(TMagicTooltip), { key: 0 }, {
@@ -443,7 +444,8 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
           }, {
             label: withCtx(() => [
               createElementVNode("span", {
-                innerHTML: type.value === "checkbox" ? "" : text.value
+                innerHTML: type.value === "checkbox" ? "" : text.value,
+                title: _ctx.config.labelTitle
               }, null, 8, _hoisted_6$2)
             ]),
             default: withCtx(() => [
@@ -510,7 +512,8 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
           }, {
             label: withCtx(() => [
               createElementVNode("span", {
-                innerHTML: type.value === "checkbox" ? "" : text.value
+                innerHTML: type.value === "checkbox" ? "" : text.value,
+                title: _ctx.config.labelTitle
               }, null, 8, _hoisted_10)
             ]),
             default: withCtx(() => [
@@ -601,13 +604,13 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
             _: 1
           })
         ])) : createCommentVNode("", true)
-      ], 14, _hoisted_1$e)) : createCommentVNode("", true);
+      ], 14, _hoisted_1$d)) : createCommentVNode("", true);
     };
   }
 });
 
-const _hoisted_1$d = ["innerHTML"];
-const _hoisted_2$8 = ["innerHTML"];
+const _hoisted_1$c = ["innerHTML"];
+const _hoisted_2$7 = ["innerHTML"];
 const _hoisted_3$4 = { key: 1 };
 const _hoisted_4$3 = ["innerHTML"];
 const _hoisted_5$3 = ["innerHTML"];
@@ -671,18 +674,18 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
                 change
               ],
               prop: `${_ctx.prop}${_ctx.prop ? "." : ""}${_ctx.config.name}.value`,
-              "true-label": 1,
-              "false-label": 0
+              "true-value": 1,
+              "false-value": 0
             }, {
               default: withCtx(() => [
                 createElementVNode("span", {
                   innerHTML: _ctx.config.legend
-                }, null, 8, _hoisted_1$d),
+                }, null, 8, _hoisted_1$c),
                 _ctx.config.extra ? (openBlock(), createElementBlock("span", {
                   key: 0,
                   innerHTML: _ctx.config.extra,
                   class: "m-form-tip"
-                }, null, 8, _hoisted_2$8)) : createCommentVNode("", true)
+                }, null, 8, _hoisted_2$7)) : createCommentVNode("", true)
               ]),
               _: 1
             }, 8, ["modelValue", "prop"])
@@ -742,8 +745,8 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$c = { class: "m-fields-group-list-item" };
-const _hoisted_2$7 = ["innerHTML"];
+const _hoisted_1$b = { class: "m-fields-group-list-item" };
+const _hoisted_2$6 = ["innerHTML"];
 const _sfc_main$x = /* @__PURE__ */ defineComponent({
   ...{
     name: "MFormGroupListItem"
@@ -810,7 +813,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     };
     const onAddDiffCount = () => emit("addDiffCount");
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$c, [
+      return openBlock(), createElementBlock("div", _hoisted_1$b, [
         createElementVNode("div", null, [
           createVNode(unref(TMagicButton), {
             link: "",
@@ -876,7 +879,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
             key: 1,
             innerHTML: itemExtra.value,
             class: "m-form-tip"
-          }, null, 8, _hoisted_2$7)) : createCommentVNode("", true)
+          }, null, 8, _hoisted_2$6)) : createCommentVNode("", true)
         ]),
         expand.value ? (openBlock(), createBlock(_sfc_main$z, {
           key: 0,
@@ -896,8 +899,8 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$b = { class: "m-fields-group-list" };
-const _hoisted_2$6 = ["innerHTML"];
+const _hoisted_1$a = { class: "m-fields-group-list" };
+const _hoisted_2$5 = ["innerHTML"];
 const _hoisted_3$3 = {
   key: 1,
   class: "el-table__empty-block"
@@ -990,12 +993,12 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
     const onAddDiffCount = () => emit("addDiffCount");
     const getLastValues = (item, index) => item?.[index] || {};
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$b, [
+      return openBlock(), createElementBlock("div", _hoisted_1$a, [
         _ctx.config.extra ? (openBlock(), createElementBlock("div", {
           key: 0,
           innerHTML: _ctx.config.extra,
           style: { "color": "rgba(0, 0, 0, 0.45)" }
-        }, null, 8, _hoisted_2$6)) : createCommentVNode("", true),
+        }, null, 8, _hoisted_2$5)) : createCommentVNode("", true),
         !_ctx.model[_ctx.name] || !_ctx.model[_ctx.name].length ? (openBlock(), createElementBlock("div", _hoisted_3$3, _hoisted_5$2)) : (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(_ctx.model[_ctx.name], (item, index) => {
           return openBlock(), createBlock(_sfc_main$x, {
             key: index,
@@ -1042,8 +1045,8 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$a = { style: { "width": "100%", "display": "flex", "align-items": "center" } };
-const _hoisted_2$5 = ["innerHTML"];
+const _hoisted_1$9 = { style: { "width": "100%", "display": "flex", "align-items": "center" } };
+const _hoisted_2$4 = ["innerHTML"];
 const _hoisted_3$2 = {
   key: 0,
   style: { "display": "flex" }
@@ -1083,7 +1086,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
         "body-style": { display: expand.value ? "block" : "none" }
       }, {
         header: withCtx(() => [
-          createElementVNode("div", _hoisted_1$a, [
+          createElementVNode("div", _hoisted_1$9, [
             createVNode(unref(TMagicButton), {
               style: { "padding": "0" },
               link: "",
@@ -1094,7 +1097,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
               key: 0,
               innerHTML: _ctx.config.extra,
               class: "m-form-tip"
-            }, null, 8, _hoisted_2$5)) : createCommentVNode("", true),
+            }, null, 8, _hoisted_2$4)) : createCommentVNode("", true),
             renderSlot(_ctx.$slots, "header", {}, () => [
               createTextVNode(toDisplayString(filter(_ctx.config.title)), 1)
             ])
@@ -1328,8 +1331,8 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$9 = { class: "m-fields-table-wrap" };
-const _hoisted_2$4 = ["innerHTML"];
+const _hoisted_1$8 = { class: "m-fields-table-wrap" };
+const _hoisted_2$3 = ["innerHTML"];
 const _hoisted_3$1 = ["innerHTML"];
 const _hoisted_4 = { style: { "display": "flex", "justify-content": "space-between", "margin": "10px 0" } };
 const _hoisted_5 = { style: { "display": "flex" } };
@@ -1698,7 +1701,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
       toggleRowSelection
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$9, [
+      return openBlock(), createElementBlock("div", _hoisted_1$8, [
         (openBlock(), createBlock(Teleport, {
           to: "body",
           disabled: !isFullscreen.value
@@ -1712,7 +1715,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
               key: 0,
               style: { "color": "rgba(0, 0, 0, 0.45)" },
               innerHTML: _ctx.config.extra
-            }, null, 8, _hoisted_2$4)) : createCommentVNode("", true),
+            }, null, 8, _hoisted_2$3)) : createCommentVNode("", true),
             createVNode(unref(TMagicTooltip), {
               content: "拖拽可排序",
               placement: "left-start",
@@ -2263,13 +2266,14 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
         placeholder: _ctx.config.placeholder,
         disabled: _ctx.disabled,
         options: options.value,
+        "popper-class": _ctx.config.popperClass,
         props: {
           multiple: _ctx.config.multiple ?? false,
           emitPath: _ctx.config.emitPath ?? true,
           checkStrictly: _ctx.config.checkStrictly ?? false
         },
         onChange: changeHandler
-      }, null, 8, ["modelValue", "size", "placeholder", "disabled", "options", "props"]);
+      }, null, 8, ["modelValue", "size", "placeholder", "disabled", "options", "popper-class", "props"]);
     };
   }
 });
@@ -2323,8 +2327,8 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
         modelValue: _ctx.model[_ctx.name],
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
         size: _ctx.size,
-        trueLabel: activeValue.value,
-        falseLabel: inactiveValue.value,
+        trueValue: activeValue.value,
+        falseValue: inactiveValue.value,
         disabled: _ctx.disabled,
         onChange: changeHandler
       }, {
@@ -2332,7 +2336,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
           createTextVNode(toDisplayString(_ctx.config.text), 1)
         ]),
         _: 1
-      }, 8, ["modelValue", "size", "trueLabel", "falseLabel", "disabled"]);
+      }, 8, ["modelValue", "size", "trueValue", "falseValue", "disabled"]);
     };
   }
 });
@@ -2383,7 +2387,6 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
         default: withCtx(() => [
           (openBlock(true), createElementBlock(Fragment, null, renderList(options.value, (option) => {
             return openBlock(), createBlock(unref(TMagicCheckbox), {
-              label: option.value,
               value: option.value,
               key: option.value,
               disabled: option.disabled
@@ -2392,7 +2395,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
                 createTextVNode(toDisplayString(option.text), 1)
               ]),
               _: 2
-            }, 1032, ["label", "value", "disabled"]);
+            }, 1032, ["value", "disabled"]);
           }), 128))
         ]),
         _: 1
@@ -2630,7 +2633,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$8 = { key: 0 };
+const _hoisted_1$7 = { key: 0 };
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
   ...{
     name: "MFormDisplay"
@@ -2654,12 +2657,12 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     }
     useAddField(props.prop);
     return (_ctx, _cache) => {
-      return _ctx.model ? (openBlock(), createElementBlock("span", _hoisted_1$8, toDisplayString(_ctx.model[_ctx.name]), 1)) : createCommentVNode("", true);
+      return _ctx.model ? (openBlock(), createElementBlock("span", _hoisted_1$7, toDisplayString(_ctx.model[_ctx.name]), 1)) : createCommentVNode("", true);
     };
   }
 });
 
-const _hoisted_1$7 = { class: "m-fields-dynamic-field" };
+const _hoisted_1$6 = { class: "m-fields-dynamic-field" };
 const _sfc_main$h = /* @__PURE__ */ defineComponent({
   ...{
     name: "MFormDynamicField"
@@ -2726,7 +2729,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       emit("change", fieldMap.value[key], key);
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$7, [
+      return openBlock(), createElementBlock("div", _hoisted_1$6, [
         createVNode(unref(TMagicForm), { size: "small" }, {
           default: withCtx(() => [
             (openBlock(true), createElementBlock(Fragment, null, renderList(Object.keys(fieldMap.value), (key) => {
@@ -2945,7 +2948,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$6 = { style: { "min-height": "1px" } };
+const _hoisted_1$5 = { style: { "min-height": "1px" } };
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
   ...{
     name: "MFormDialog"
@@ -3054,7 +3057,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
                 style: { "text-align": "left" }
               }, {
                 default: withCtx(() => [
-                  createElementVNode("div", _hoisted_1$6, [
+                  createElementVNode("div", _hoisted_1$5, [
                     renderSlot(_ctx.$slots, "left")
                   ])
                 ]),
@@ -3144,8 +3147,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$5 = ["href"];
-const _hoisted_2$3 = {
+const _hoisted_1$4 = ["href"];
+const _hoisted_2$2 = {
   key: 2,
   class: "m-fields-link"
 };
@@ -3218,10 +3221,10 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
         target: "_blank",
         href: href.value,
         style: normalizeStyle(_ctx.config.css || {})
-      }, toDisplayString(displayText.value), 13, _hoisted_1$5)) : _ctx.config.href && _ctx.disabled ? (openBlock(), createElementBlock("span", {
+      }, toDisplayString(displayText.value), 13, _hoisted_1$4)) : _ctx.config.href && _ctx.disabled ? (openBlock(), createElementBlock("span", {
         key: 1,
         style: normalizeStyle(_ctx.config.disabledCss || {})
-      }, toDisplayString(displayText.value), 5)) : (openBlock(), createElementBlock("div", _hoisted_2$3, [
+      }, toDisplayString(displayText.value), 5)) : (openBlock(), createElementBlock("div", _hoisted_2$2, [
         createVNode(unref(TMagicButton), {
           link: "",
           type: "primary",
@@ -3297,8 +3300,8 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$4 = { class: "m-fields-number-range" };
-const _hoisted_2$2 = /* @__PURE__ */ createElementVNode("span", { class: "split-tag" }, "-", -1);
+const _hoisted_1$3 = { class: "m-fields-number-range" };
+const _hoisted_2$1 = /* @__PURE__ */ createElementVNode("span", { class: "split-tag" }, "-", -1);
 const _sfc_main$b = /* @__PURE__ */ defineComponent({
   ...{
     name: "MFormNumberRange"
@@ -3330,7 +3333,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
       emit("change", [props.model[props.name][0], Number(v)]);
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$4, [
+      return openBlock(), createElementBlock("div", _hoisted_1$3, [
         createVNode(unref(TMagicInput), {
           modelValue: _ctx.model[_ctx.name][0],
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name][0] = $event),
@@ -3339,7 +3342,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
           disabled: _ctx.disabled,
           onChange: minChangeHandler
         }, null, 8, ["modelValue", "size", "disabled"]),
-        _hoisted_2$2,
+        _hoisted_2$1,
         createVNode(unref(TMagicInput), {
           modelValue: _ctx.model[_ctx.name][1],
           "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.model[_ctx.name][1] = $event),
@@ -3389,7 +3392,6 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
         default: withCtx(() => [
           (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.config.options, (option) => {
             return openBlock(), createBlock(unref(TMagicRadio), {
-              label: option.value,
               value: option.value,
               key: `${option.value}`
             }, {
@@ -3397,7 +3399,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                 createTextVNode(toDisplayString(option.text), 1)
               ]),
               _: 2
-            }, 1032, ["label", "value"]);
+            }, 1032, ["value"]);
           }), 128))
         ]),
         _: 1
@@ -3463,7 +3465,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$3 = { key: 2 };
+const _hoisted_1$2 = { key: 2 };
 const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   ...{
     name: "MFormSelect"
@@ -3812,7 +3814,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
             key: 1,
             options: unref(itemOptions)
           }, null, 8, ["options"])),
-          moreLoadingVisible.value ? withDirectives((openBlock(), createElementBlock("div", _hoisted_1$3, null, 512)), [
+          moreLoadingVisible.value ? withDirectives((openBlock(), createElementBlock("div", _hoisted_1$2, null, 512)), [
             [_directive_loading, true]
           ]) : createCommentVNode("", true)
         ]),
@@ -3882,8 +3884,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$2 = { class: "m-form-item__content" };
-const _hoisted_2$1 = /* @__PURE__ */ createElementVNode("div", { class: "m-form-validate__warning" }, "输入内容前后有空格，是否移除空格？", -1);
+const _hoisted_1$1 = { class: "m-form-item__content" };
+const _hoisted_2 = /* @__PURE__ */ createElementVNode("div", { class: "m-form-validate__warning" }, "输入内容前后有空格，是否移除空格？", -1);
 const _hoisted_3 = { style: { "display": "flex", "justify-content": "flex-end" } };
 const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   ...{
@@ -4032,15 +4034,15 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
                     createTextVNode(toDisplayString(appendConfig.value.text), 1)
                   ]),
                   _: 1
-                }, 8, ["size", "onClick"])) : createCommentVNode("", true)
+                }, 8, ["size"])) : createCommentVNode("", true)
               ]),
               key: "0"
             } : void 0
           ]), 1032, ["modelValue", "size", "placeholder", "disabled"])
         ]),
         default: withCtx(() => [
-          createElementVNode("div", _hoisted_1$2, [
-            _hoisted_2$1,
+          createElementVNode("div", _hoisted_1$1, [
+            _hoisted_2,
             createElementVNode("div", _hoisted_3, [
               createVNode(unref(TMagicButton), {
                 link: "",
@@ -4234,7 +4236,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1$1 = { style: { "min-height": "1px" } };
+const _hoisted_1 = { style: { "min-height": "1px" } };
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   ...{
     name: "MFormDialog"
@@ -4338,7 +4340,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 style: { "text-align": "left" }
               }, {
                 default: withCtx(() => [
-                  createElementVNode("div", _hoisted_1$1, [
+                  createElementVNode("div", _hoisted_1, [
                     renderSlot(_ctx.$slots, "left")
                   ])
                 ]),
@@ -4401,11 +4403,10 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _hoisted_1 = { class: "m-form-box" };
-const _hoisted_2 = { style: { "min-height": "1px" } };
+const footerHeight = 60;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
-    name: "MFormDialog"
+    name: "MFormBox"
   },
   __name: "FormBox",
   props: {
@@ -4413,6 +4414,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     values: { default: () => ({}) },
     parentValues: {},
     width: {},
+    height: {},
     labelWidth: {},
     disabled: { type: Boolean },
     size: {},
@@ -4422,15 +4424,26 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   emits: ["submit", "change", "error"],
   setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
     const emit = __emit;
+    const style = computed(() => {
+      const style2 = {};
+      if (typeof props.width === "number") {
+        style2.width = `${props.width}px`;
+      }
+      if (typeof props.height === "number") {
+        style2.height = `${props.height}px`;
+      }
+      return style2;
+    });
     const form = ref();
-    const boxBody = ref();
     const saveFetch = ref(false);
     const bodyHeight = ref(0);
     watchEffect(() => {
-      if (boxBody.value) {
-        bodyHeight.value = boxBody.value.clientHeight;
+      if (!props.height) {
+        return;
       }
+      bodyHeight.value = props.height - footerHeight;
     });
     const submitHandler = async () => {
       try {
@@ -4450,67 +4463,63 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     __expose({
       form,
       saveFetch,
-      bodyHeight,
       show,
       hide
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
+      return openBlock(), createElementBlock("div", {
+        class: "m-form-box",
+        style: normalizeStyle(style.value)
+      }, [
         createElementVNode("div", {
-          ref_key: "boxBody",
-          ref: boxBody,
-          class: "m-box-body"
+          class: "m-box-body",
+          style: normalizeStyle(bodyHeight.value ? { height: `${bodyHeight.value}px` } : {})
         }, [
-          createVNode(_sfc_main$f, {
-            ref_key: "form",
-            ref: form,
-            size: _ctx.size,
-            disabled: _ctx.disabled,
-            config: _ctx.config,
-            "init-values": _ctx.values,
-            "parent-values": _ctx.parentValues,
-            "label-width": _ctx.labelWidth,
-            "label-position": _ctx.labelPosition,
-            inline: _ctx.inline,
-            onChange: changeHandler
-          }, null, 8, ["size", "disabled", "config", "init-values", "parent-values", "label-width", "label-position", "inline"]),
-          renderSlot(_ctx.$slots, "default")
-        ], 512),
-        createVNode(unref(TMagicRow), { class: "dialog-footer" }, {
-          default: withCtx(() => [
-            createVNode(unref(TMagicCol), {
-              span: 12,
-              style: { "text-align": "left" }
-            }, {
-              default: withCtx(() => [
-                createElementVNode("div", _hoisted_2, [
-                  renderSlot(_ctx.$slots, "left")
-                ])
-              ]),
-              _: 3
-            }),
-            createVNode(unref(TMagicCol), { span: 12 }, {
-              default: withCtx(() => [
-                renderSlot(_ctx.$slots, "footer", {}, () => [
-                  createVNode(unref(TMagicButton), {
-                    type: "primary",
-                    disabled: _ctx.disabled,
-                    loading: saveFetch.value,
-                    onClick: submitHandler
-                  }, {
-                    default: withCtx(() => [
-                      createTextVNode(toDisplayString(_ctx.confirmText), 1)
-                    ]),
-                    _: 1
-                  }, 8, ["disabled", "loading"])
-                ])
-              ]),
-              _: 3
-            })
+          createVNode(unref(TMagicScrollbar), null, {
+            default: withCtx(() => [
+              createVNode(_sfc_main$f, {
+                ref_key: "form",
+                ref: form,
+                size: _ctx.size,
+                disabled: _ctx.disabled,
+                config: _ctx.config,
+                "init-values": _ctx.values,
+                "parent-values": _ctx.parentValues,
+                "label-width": _ctx.labelWidth,
+                "label-position": _ctx.labelPosition,
+                inline: _ctx.inline,
+                onChange: changeHandler
+              }, null, 8, ["size", "disabled", "config", "init-values", "parent-values", "label-width", "label-position", "inline"]),
+              renderSlot(_ctx.$slots, "default")
+            ]),
+            _: 3
+          })
+        ], 4),
+        createElementVNode("div", {
+          class: "dialog-footer",
+          style: normalizeStyle(`height: ${footerHeight}px`)
+        }, [
+          createElementVNode("div", null, [
+            renderSlot(_ctx.$slots, "left")
           ]),
-          _: 3
-        })
-      ]);
+          createElementVNode("div", null, [
+            renderSlot(_ctx.$slots, "footer", {}, () => [
+              createVNode(unref(TMagicButton), {
+                type: "primary",
+                size: _ctx.size,
+                disabled: _ctx.disabled,
+                loading: saveFetch.value,
+                onClick: submitHandler
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(_ctx.confirmText), 1)
+                ]),
+                _: 1
+              }, 8, ["size", "disabled", "loading"])
+            ])
+          ])
+        ], 4)
+      ], 4);
     };
   }
 });