@tmagic/form 1.0.0-beta.13 → 1.0.0-beta.16

package/dist/tmagic-form.es.js

@@ -173,7 +173,7 @@ var _export_sfc = (sfc, props) => {
   return target;
 };
 
-const _sfc_main$s = defineComponent({
+const _sfc_main$t = defineComponent({
   name: "m-form-container",
   components: { WarningFilled },
   props: {
@@ -233,6 +233,7 @@ const _sfc_main$s = defineComponent({
       }
       return display(mForm, props.config.display, props);
     });
+    const itemLabelWidth = computed(() => props.config.labelWidth || props.labelWidth);
     watchEffect(() => {
       expand.value = props.expandMore;
     });
@@ -293,6 +294,7 @@ const _sfc_main$s = defineComponent({
       itemProp,
       items,
       display: display$1,
+      itemLabelWidth,
       tagName,
       rule,
       tooltip,
@@ -303,7 +305,7 @@ const _sfc_main$s = defineComponent({
     };
   }
 });
-const _hoisted_1$g = ["innerHTML"];
+const _hoisted_1$f = ["innerHTML"];
 const _hoisted_2$7 = ["innerHTML"];
 const _hoisted_3$7 = ["innerHTML"];
 const _hoisted_4$6 = ["innerHTML"];
@@ -311,7 +313,7 @@ const _hoisted_5$4 = {
   key: 4,
   style: { "text-align": "center" }
 };
-function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_m_fields_hidden = resolveComponent("m-fields-hidden");
   const _component_el_tooltip = resolveComponent("el-tooltip");
   const _component_el_form_item = resolveComponent("el-form-item");
@@ -340,19 +342,20 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
       prop: _ctx.itemProp,
       "step-active": _ctx.stepActive,
       "expand-more": _ctx.expand,
-      "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
+      "label-width": _ctx.itemLabelWidth,
       onChange: _ctx.onChangeHandler
     }, null, 8, ["size", "model", "config", "name", "prop", "step-active", "expand-more", "label-width", "onChange"])) : _ctx.type && _ctx.display ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
       createVNode(_component_el_form_item, {
         style: normalizeStyle(_ctx.config.tip ? "flex: 1" : ""),
+        class: normalizeClass({ hidden: _ctx.itemLabelWidth === 0 || !_ctx.config.text }),
         prop: _ctx.itemProp,
-        "label-width": _ctx.config.text ? _ctx.config.labelWidth || _ctx.labelWidth : "0",
+        "label-width": _ctx.itemLabelWidth,
         rules: _ctx.rule
       }, {
         label: withCtx(() => [
           createElementVNode("span", {
             innerHTML: _ctx.type === "checkbox" ? "" : _ctx.config.text
-          }, null, 8, _hoisted_1$g)
+          }, null, 8, _hoisted_1$f)
         ]),
         default: withCtx(() => [
           _ctx.tooltip ? (openBlock(), createBlock(_component_el_tooltip, { key: 0 }, {
@@ -389,10 +392,10 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
           }, null, 8, _hoisted_3$7)) : createCommentVNode("", true)
         ]),
         _: 1
-      }, 8, ["style", "prop", "label-width", "rules"]),
+      }, 8, ["style", "class", "prop", "label-width", "rules"]),
       _ctx.config.tip ? (openBlock(), createBlock(_component_el_tooltip, {
         key: 0,
-        placement: "top"
+        placement: "left"
       }, {
         content: withCtx(() => [
           createElementVNode("div", {
@@ -418,7 +421,7 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
           size: _ctx.size,
           "step-active": _ctx.stepActive,
           "expand-more": _ctx.expand,
-          "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
+          "label-width": _ctx.itemLabelWidth,
           prop: _ctx.itemProp,
           onChange: _ctx.onChangeHandler
         }, null, 8, ["model", "config", "size", "step-active", "expand-more", "label-width", "prop", "onChange"]);
@@ -426,7 +429,7 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
     ], 64)) : createCommentVNode("", true),
     _ctx.config.expand && _ctx.type !== "fieldset" ? (openBlock(), createElementBlock("div", _hoisted_5$4, [
       createVNode(_component_el_button, {
-        type: "text",
+        text: "",
         onClick: _ctx.expandHandler
       }, {
         default: withCtx(() => [
@@ -437,9 +440,9 @@ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
     ])) : createCommentVNode("", true)
   ], 6)) : createCommentVNode("", true);
 }
-var Container = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$p]]);
+var Container = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$q]]);
 
-const _sfc_main$r = defineComponent({
+const _sfc_main$s = defineComponent({
   name: "m-form-fieldset",
   props: {
     labelWidth: String,
@@ -491,7 +494,7 @@ const _sfc_main$r = defineComponent({
     };
   }
 });
-const _hoisted_1$f = ["innerHTML"];
+const _hoisted_1$e = ["innerHTML"];
 const _hoisted_2$6 = ["innerHTML"];
 const _hoisted_3$6 = { key: 1 };
 const _hoisted_4$5 = ["innerHTML"];
@@ -505,7 +508,7 @@ const _hoisted_9$1 = {
 };
 const _hoisted_10$1 = { style: { "flex": "1" } };
 const _hoisted_11 = ["src"];
-function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_checkbox = resolveComponent("el-checkbox");
   const _component_m_form_container = resolveComponent("m-form-container");
   return (_ctx.name ? _ctx.model[_ctx.name] : _ctx.model) ? (openBlock(), createElementBlock("fieldset", {
@@ -525,7 +528,7 @@ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
       default: withCtx(() => [
         createElementVNode("span", {
           innerHTML: _ctx.config.legend
-        }, null, 8, _hoisted_1$f),
+        }, null, 8, _hoisted_1$e),
         _ctx.config.extra ? (openBlock(), createElementBlock("span", {
           key: 0,
           innerHTML: _ctx.config.extra,
@@ -597,9 +600,9 @@ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128)) : createCommentVNode("", true)
   ], 4)) : createCommentVNode("", true);
 }
-var Fieldset = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$o]]);
+var Fieldset = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$p]]);
 
-const _sfc_main$q = defineComponent({
+const _sfc_main$r = defineComponent({
   name: "m-form-group-list-item",
   components: { CaretRight, CaretBottom },
   props: {
@@ -683,11 +686,11 @@ const _sfc_main$q = defineComponent({
     };
   }
 });
-const _hoisted_1$e = { class: "m-fields-group-list-item" };
+const _hoisted_1$d = { class: "m-fields-group-list-item" };
 const _hoisted_2$5 = /* @__PURE__ */ createTextVNode("\u4E0A\u79FB");
 const _hoisted_3$5 = /* @__PURE__ */ createTextVNode("\u4E0B\u79FB");
 const _hoisted_4$4 = ["innerHTML"];
-function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_caret_bottom = resolveComponent("caret-bottom");
   const _component_caret_right = resolveComponent("caret-right");
   const _component_el_icon = resolveComponent("el-icon");
@@ -695,7 +698,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_CaretRight = resolveComponent("CaretRight");
   const _component_CaretBottom = resolveComponent("CaretBottom");
   const _component_m_form_container = resolveComponent("m-form-container");
-  return openBlock(), createElementBlock("div", _hoisted_1$e, [
+  return openBlock(), createElementBlock("div", _hoisted_1$d, [
     createElementVNode("div", null, [
       createVNode(_component_el_icon, {
         style: { "margin-right": "7px" },
@@ -707,7 +710,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
         _: 1
       }, 8, ["onClick"]),
       createVNode(_component_el_button, {
-        type: "text",
+        text: "",
         onClick: _ctx.expandHandler
       }, {
         default: withCtx(() => [
@@ -716,7 +719,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
         _: 1
       }, 8, ["onClick"]),
       withDirectives(createVNode(_component_el_button, {
-        type: "text",
+        text: "",
         icon: _ctx.Delete,
         style: { "color": "#f56c6c" },
         onClick: _ctx.removeHandler
@@ -725,7 +728,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
       ]),
       _ctx.movable() ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
         withDirectives(createVNode(_component_el_button, {
-          type: "text",
+          text: "",
           size: "small",
           onClick: _cache[0] || (_cache[0] = ($event) => _ctx.changeOrder(-1))
         }, {
@@ -743,7 +746,7 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
           [vShow, _ctx.index !== 0]
         ]),
         withDirectives(createVNode(_component_el_button, {
-          type: "text",
+          text: "",
           size: "small",
           onClick: _cache[1] || (_cache[1] = ($event) => _ctx.changeOrder(1))
         }, {
@@ -778,9 +781,9 @@ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
     }, null, 8, ["config", "model", "labelWidth", "prop", "size", "onChange"])) : createCommentVNode("", true)
   ]);
 }
-var MFieldsGroupListItem = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$n]]);
+var MFieldsGroupListItem = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$o]]);
 
-const _sfc_main$p = defineComponent({
+const _sfc_main$q = defineComponent({
   name: "m-form-group-list",
   components: { MFieldsGroupListItem },
   props: {
@@ -872,7 +875,7 @@ const _sfc_main$p = defineComponent({
     };
   }
 });
-const _hoisted_1$d = { class: "m-fields-group-list" };
+const _hoisted_1$c = { class: "m-fields-group-list" };
 const _hoisted_2$4 = ["innerHTML"];
 const _hoisted_3$4 = {
   key: 1,
@@ -884,10 +887,10 @@ const _hoisted_5$2 = [
 ];
 const _hoisted_6$1 = /* @__PURE__ */ createTextVNode("\u6DFB\u52A0\u7EC4");
 const _hoisted_7$1 = /* @__PURE__ */ createTextVNode("\u5207\u6362\u4E3A\u8868\u683C");
-function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_m_fields_group_list_item = resolveComponent("m-fields-group-list-item");
   const _component_el_button = resolveComponent("el-button");
-  return openBlock(), createElementBlock("div", _hoisted_1$d, [
+  return openBlock(), createElementBlock("div", _hoisted_1$c, [
     _ctx.config.extra ? (openBlock(), createElementBlock("div", {
       key: 0,
       innerHTML: _ctx.config.extra,
@@ -931,9 +934,9 @@ function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
     }, 8, ["onClick"])) : createCommentVNode("", true)
   ]);
 }
-var GroupList = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["render", _sfc_render$m]]);
+var GroupList = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$n]]);
 
-const _sfc_main$o = defineComponent({
+const _sfc_main$p = defineComponent({
   name: "m-form-panel",
   components: { CaretBottom, CaretRight },
   props: {
@@ -966,7 +969,7 @@ const _sfc_main$o = defineComponent({
     };
   }
 });
-const _hoisted_1$c = { class: "clearfix" };
+const _hoisted_1$b = { class: "clearfix" };
 const _hoisted_2$3 = ["innerHTML"];
 const _hoisted_3$3 = {
   key: 0,
@@ -974,7 +977,7 @@ const _hoisted_3$3 = {
 };
 const _hoisted_4$2 = { style: { "flex": "1" } };
 const _hoisted_5$1 = ["src"];
-function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_caret_bottom = resolveComponent("caret-bottom");
   const _component_caret_right = resolveComponent("caret-right");
   const _component_el_icon = resolveComponent("el-icon");
@@ -986,7 +989,7 @@ function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
     "body-style": { display: _ctx.expand ? "block" : "none" }
   }, {
     header: withCtx(() => [
-      createElementVNode("div", _hoisted_1$c, [
+      createElementVNode("div", _hoisted_1$b, [
         createElementVNode("a", {
           href: "javascript:",
           style: { "width": "100%", "display": "block" },
@@ -1044,10 +1047,60 @@ function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 8, ["body-style"])) : createCommentVNode("", true);
 }
-var Panel = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$l]]);
+var Panel = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["render", _sfc_render$m]]);
+
+const _sfc_main$o = defineComponent({
+  props: {
+    labelWidth: String,
+    expandMore: Boolean,
+    span: Number,
+    model: {
+      type: Object,
+      default: () => ({})
+    },
+    config: {
+      type: Object,
+      default: () => ({})
+    },
+    prop: String,
+    size: String
+  },
+  emits: ["change"],
+  setup(props, { emit }) {
+    const mForm = inject("mForm");
+    const changeHandler = () => emit("change", props.model);
+    return {
+      mForm,
+      display: computed(() => display(mForm, props.config.display, props)),
+      changeHandler
+    };
+  }
+});
+function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_m_form_container = resolveComponent("m-form-container");
+  const _component_el_col = resolveComponent("el-col");
+  return withDirectives((openBlock(), createBlock(_component_el_col, { span: _ctx.span }, {
+    default: withCtx(() => [
+      createVNode(_component_m_form_container, {
+        model: _ctx.model,
+        config: _ctx.config,
+        prop: _ctx.prop,
+        "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
+        "expand-more": _ctx.expandMore,
+        size: _ctx.size,
+        onChange: _ctx.changeHandler
+      }, null, 8, ["model", "config", "prop", "label-width", "expand-more", "size", "onChange"])
+    ]),
+    _: 1
+  }, 8, ["span"])), [
+    [vShow, _ctx.display && _ctx.config.type !== "hidden"]
+  ]);
+}
+var Col = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$l]]);
 
 const _sfc_main$n = defineComponent({
   name: "m-form-row",
+  components: { Col },
   props: {
     labelWidth: String,
     expandMore: Boolean,
@@ -1069,38 +1122,27 @@ const _sfc_main$n = defineComponent({
     const changeHandler = () => emit("change", props.name ? props.model[props.name] : props.model);
     return {
       mForm,
-      display(config) {
-        return display(mForm, config.display, props);
-      },
       changeHandler
     };
   }
 });
 function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_m_form_container = resolveComponent("m-form-container");
-  const _component_el_col = resolveComponent("el-col");
+  const _component_Col = resolveComponent("Col");
   const _component_el_row = resolveComponent("el-row");
   return openBlock(), createBlock(_component_el_row, { gutter: 10 }, {
     default: withCtx(() => [
       (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.config.items, (col, index) => {
-        return openBlock(), createBlock(_component_el_col, {
-          style: normalizeStyle(!_ctx.display(col) || col.type === "hidden" ? "display: none" : ""),
+        return openBlock(), createBlock(_component_Col, {
           key: col[_ctx.mForm?.keyProp || "__key"] ?? index,
-          span: col.span || _ctx.config.span || 24 / _ctx.config.items.length
-        }, {
-          default: withCtx(() => [
-            createVNode(_component_m_form_container, {
-              model: _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
-              config: col,
-              prop: _ctx.prop,
-              "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
-              "expand-more": _ctx.expandMore,
-              size: _ctx.size,
-              onChange: _ctx.changeHandler
-            }, null, 8, ["model", "config", "prop", "label-width", "expand-more", "size", "onChange"])
-          ]),
-          _: 2
-        }, 1032, ["style", "span"]);
+          span: col.span || _ctx.config.span || 24 / _ctx.config.items.length,
+          config: col,
+          labelWidth: _ctx.config.labelWidth || _ctx.labelWidth,
+          expandMore: _ctx.expandMore,
+          model: _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
+          prop: _ctx.prop,
+          size: _ctx.size,
+          onChange: _ctx.changeHandler
+        }, null, 8, ["span", "config", "labelWidth", "expandMore", "model", "prop", "size", "onChange"]);
       }), 128))
     ]),
     _: 1
@@ -1559,7 +1601,7 @@ const _sfc_main$l = defineComponent({
     };
   }
 });
-const _hoisted_1$b = ["innerHTML"];
+const _hoisted_1$a = ["innerHTML"];
 const _hoisted_2$2 = { class: "el-form-item__content" };
 const _hoisted_3$2 = ["innerHTML"];
 const _hoisted_4$1 = /* @__PURE__ */ createTextVNode("\u6DFB\u52A0");
@@ -1588,7 +1630,7 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
       key: 0,
       style: { "color": "rgba(0, 0, 0, 0.45)" },
       innerHTML: _ctx.config.extra
-    }, null, 8, _hoisted_1$b)) : createCommentVNode("", true),
+    }, null, 8, _hoisted_1$a)) : createCommentVNode("", true),
     createElementVNode("div", _hoisted_2$2, [
       createVNode(_component_el_tooltip, {
         content: "\u62D6\u62FD\u53EF\u6392\u5E8F",
@@ -1629,8 +1671,8 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
               }, {
                 default: withCtx((scope) => [
                   withDirectives(createVNode(_component_el_button, {
-                    style: { "color": "#f56c6c" },
-                    type: "text",
+                    type: "danger",
+                    text: "",
                     icon: _ctx.Delete,
                     onClick: ($event) => _ctx.removeHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
                   }, null, 8, ["icon", "onClick"]), [
@@ -1654,8 +1696,9 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
                       createVNode(_component_el_button, {
                         plain: "",
                         size: "small",
+                        type: "primary",
                         icon: _ctx.ArrowUp,
-                        type: "text",
+                        text: "",
                         onClick: ($event) => _ctx.upHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1),
                         onDblclick: ($event) => _ctx.topHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
                       }, null, 8, ["icon", "onClick", "onDblclick"])
@@ -1671,8 +1714,9 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
                       createVNode(_component_el_button, {
                         plain: "",
                         size: "small",
+                        type: "primary",
                         icon: _ctx.ArrowDown,
-                        type: "text",
+                        text: "",
                         onClick: ($event) => _ctx.downHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1),
                         onDblclick: ($event) => _ctx.bottomHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
                       }, null, 8, ["icon", "onClick", "onDblclick"])
@@ -1749,6 +1793,7 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
         key: 1,
         icon: _ctx.Grid,
         size: "small",
+        type: "primary",
         onClick: _ctx.toggleMode
       }, {
         default: withCtx(() => [
@@ -1760,6 +1805,7 @@ function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
         key: 2,
         icon: _ctx.FullScreen,
         size: "small",
+        type: "primary",
         onClick: _ctx.toggleFullscreen
       }, {
         default: withCtx(() => [
@@ -2110,13 +2156,13 @@ const _sfc_main$j = defineComponent({
     };
   }
 });
-const _hoisted_1$a = {
+const _hoisted_1$9 = {
   class: "m-cascader",
   style: { "width": "100%" }
 };
 function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_cascader = resolveComponent("el-cascader");
-  return openBlock(), createElementBlock("div", _hoisted_1$a, [
+  return openBlock(), createElementBlock("div", _hoisted_1$9, [
     createVNode(_component_el_cascader, {
       modelValue: _ctx.model[_ctx.name],
       "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
@@ -2156,7 +2202,7 @@ const _sfc_main$i = defineComponent({
         } else {
           return props.config.activeValue;
         }
-        return "true";
+        return void 0;
       }),
       inactiveValue: computed(() => {
         if (typeof props.config.inactiveValue === "undefined") {
@@ -2166,7 +2212,7 @@ const _sfc_main$i = defineComponent({
         } else {
           return props.config.inactiveValue;
         }
-        return "false";
+        return void 0;
       }),
       changeHandler(value) {
         emit("change", value);
@@ -2239,7 +2285,7 @@ function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
 }
 var CheckboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["render", _sfc_render$e]]);
 
-const _hoisted_1$9 = { key: 0 };
+const _hoisted_1$8 = { key: 0 };
 const __default__$2 = defineComponent({
   name: "m-fields-color-picker"
 });
@@ -2259,7 +2305,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
     const changeHandler = (value) => emit("change", value);
     return (_ctx, _cache) => {
       const _component_el_color_picker = resolveComponent("el-color-picker");
-      return _ctx.model ? (openBlock(), createElementBlock("div", _hoisted_1$9, [
+      return _ctx.model ? (openBlock(), createElementBlock("div", _hoisted_1$8, [
         createVNode(_component_el_color_picker, {
           modelValue: _ctx.model[_ctx.name],
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
@@ -2295,10 +2341,10 @@ const _sfc_main$f = defineComponent({
     };
   }
 });
-const _hoisted_1$8 = { key: 0 };
+const _hoisted_1$7 = { key: 0 };
 function _sfc_render$d(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_date_picker = resolveComponent("el-date-picker");
-  return _ctx.model ? (openBlock(), createElementBlock("div", _hoisted_1$8, [
+  return _ctx.model ? (openBlock(), createElementBlock("div", _hoisted_1$7, [
     createVNode(_component_el_date_picker, {
       modelValue: _ctx.model[_ctx.modelName],
       "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.modelName] = $event),
@@ -2402,10 +2448,10 @@ const _sfc_main$d = defineComponent({
     };
   }
 });
-const _hoisted_1$7 = { key: 0 };
+const _hoisted_1$6 = { key: 0 };
 function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_date_picker = resolveComponent("el-date-picker");
-  return _ctx.model ? (openBlock(), createElementBlock("div", _hoisted_1$7, [
+  return _ctx.model ? (openBlock(), createElementBlock("div", _hoisted_1$6, [
     createVNode(_component_el_date_picker, {
       modelValue: _ctx.model[_ctx.name],
       "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
@@ -2422,7 +2468,7 @@ function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
 }
 var DateTime = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$b]]);
 
-const _hoisted_1$6 = { key: 0 };
+const _hoisted_1$5 = { key: 0 };
 const __default__$1 = defineComponent({
   name: "m-fields-display"
 });
@@ -2443,7 +2489,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     }
     useAddField(props.prop);
     return (_ctx, _cache) => {
-      return _ctx.model ? (openBlock(), createElementBlock("span", _hoisted_1$6, toDisplayString(_ctx.model[unref(n)]), 1)) : createCommentVNode("", true);
+      return _ctx.model ? (openBlock(), createElementBlock("span", _hoisted_1$5, toDisplayString(_ctx.model[unref(n)]), 1)) : createCommentVNode("", true);
     };
   }
 });
@@ -2513,12 +2559,12 @@ const _sfc_main$b = defineComponent({
     }
   }
 });
-const _hoisted_1$5 = { class: "m-fields-dynamic-field" };
+const _hoisted_1$4 = { class: "m-fields-dynamic-field" };
 function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_input = resolveComponent("el-input");
   const _component_el_form_item = resolveComponent("el-form-item");
   const _component_el_form = resolveComponent("el-form");
-  return openBlock(), createElementBlock("div", _hoisted_1$5, [
+  return openBlock(), createElementBlock("div", _hoisted_1$4, [
     createVNode(_component_el_form, { size: "small" }, {
       default: withCtx(() => [
         (openBlock(true), createElementBlock(Fragment, null, renderList(Object.keys(_ctx.fieldMap.value), (key) => {
@@ -2640,7 +2686,7 @@ const _sfc_main$9 = defineComponent({
     };
   }
 });
-const _hoisted_1$4 = ["href"];
+const _hoisted_1$3 = ["href"];
 const _hoisted_2$1 = {
   key: 2,
   class: "m-fields-link"
@@ -2654,12 +2700,13 @@ function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
     target: "_blank",
     href: _ctx.href,
     style: normalizeStyle(_ctx.config.css || {})
-  }, toDisplayString(_ctx.displayText), 13, _hoisted_1$4)) : _ctx.config.href && _ctx.disabled ? (openBlock(), createElementBlock("span", {
+  }, toDisplayString(_ctx.displayText), 13, _hoisted_1$3)) : _ctx.config.href && _ctx.disabled ? (openBlock(), createElementBlock("span", {
     key: 1,
     style: normalizeStyle(_ctx.config.disabledCss || {})
   }, toDisplayString(_ctx.displayText), 5)) : (openBlock(), createElementBlock("div", _hoisted_2$1, [
     createVNode(_component_el_button, {
-      type: "text",
+      text: "",
+      type: "primary",
       onClick: _ctx.editHandler
     }, {
       default: withCtx(() => [
@@ -3040,7 +3087,7 @@ const _sfc_main$6 = defineComponent({
     };
   }
 });
-const _hoisted_1$3 = { key: 2 };
+const _hoisted_1$2 = { key: 2 };
 function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_option = resolveComponent("el-option");
   const _component_el_option_group = resolveComponent("el-option-group");
@@ -3093,7 +3140,7 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
           disabled: option.disabled
         }, null, 8, ["label", "value", "disabled"]);
       }), 128)),
-      _ctx.moreLoadingVisible ? withDirectives((openBlock(), createElementBlock("div", _hoisted_1$3, null, 512)), [
+      _ctx.moreLoadingVisible ? withDirectives((openBlock(), createElementBlock("div", _hoisted_1$2, null, 512)), [
         [_directive_loading, true]
       ]) : createCommentVNode("", true)
     ]),
@@ -3246,7 +3293,7 @@ const _sfc_main$4 = defineComponent({
     };
   }
 });
-const _hoisted_1$2 = { key: 0 };
+const _hoisted_1$1 = { key: 0 };
 function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_button = resolveComponent("el-button");
   const _component_el_input = resolveComponent("el-input");
@@ -3264,7 +3311,7 @@ function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
     _ctx.config.append ? {
       name: "append",
       fn: withCtx(() => [
-        typeof _ctx.config.append === "string" ? (openBlock(), createElementBlock("span", _hoisted_1$2, toDisplayString(_ctx.config.append), 1)) : createCommentVNode("", true),
+        typeof _ctx.config.append === "string" ? (openBlock(), createElementBlock("span", _hoisted_1$1, toDisplayString(_ctx.config.append), 1)) : createCommentVNode("", true),
         typeof _ctx.config.append === "object" && _ctx.config.append.type === "button" ? (openBlock(), createBlock(_component_el_button, {
           key: 1,
           style: { "color": "#409eff" },
@@ -3314,22 +3361,19 @@ const _sfc_main$3 = defineComponent({
     };
   }
 });
-const _hoisted_1$1 = { key: 0 };
 function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_input = resolveComponent("el-input");
-  return _ctx.model ? (openBlock(), createElementBlock("div", _hoisted_1$1, [
-    createVNode(_component_el_input, {
-      modelValue: _ctx.model[_ctx.name],
-      "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
-      type: "textarea",
-      size: _ctx.size,
-      clearable: "",
-      placeholder: _ctx.config.placeholder,
-      disabled: _ctx.disabled,
-      onChange: _ctx.changeHandler,
-      onInput: _ctx.inputHandler
-    }, null, 8, ["modelValue", "size", "placeholder", "disabled", "onChange", "onInput"])
-  ])) : createCommentVNode("", true);
+  return openBlock(), createBlock(_component_el_input, {
+    modelValue: _ctx.model[_ctx.name],
+    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
+    type: "textarea",
+    size: _ctx.size,
+    clearable: "",
+    placeholder: _ctx.config.placeholder,
+    disabled: _ctx.disabled,
+    onChange: _ctx.changeHandler,
+    onInput: _ctx.inputHandler
+  }, null, 8, ["modelValue", "size", "placeholder", "disabled", "onChange", "onInput"]);
 }
 var Textarea = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
 
@@ -3477,7 +3521,7 @@ const _sfc_main$1 = defineComponent({
       submitForm: async (native) => {
         try {
           await elForm.value?.validate();
-          return native ? values.value : cloneDeep(values.value);
+          return native ? values.value : cloneDeep(toRaw(values.value));
         } catch (invalidFields) {
           const error = [];
           Object.entries(invalidFields).forEach(([, ValidateError]) => {