@tmagic/form 1.0.0-beta.8 → 1.0.0-rc.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('lodash-es'), require('@element-plus/icons'), require('element-plus'), require('sortablejs'), require('@tmagic/utils')) :
3
- typeof define === 'function' && define.amd ? define(['exports', 'vue', 'lodash-es', '@element-plus/icons', 'element-plus', 'sortablejs', '@tmagic/utils'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.TMagicForm = {}, global.vue, global.lodashEs, global.icons, global.elementPlus, global.Sortable, global.utils));
5
- })(this, (function (exports, vue, lodashEs, icons, elementPlus, Sortable, utils) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('@element-plus/icons'), require('lodash-es'), require('element-plus'), require('sortablejs'), require('@tmagic/utils')) :
3
+ typeof define === 'function' && define.amd ? define(['exports', 'vue', '@element-plus/icons', 'lodash-es', 'element-plus', 'sortablejs', '@tmagic/utils'], factory) :
4
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.TMagicForm = {}, global.Vue, global.icons, global.lodashEs, global.ElementPlus, global.Sortable, global.utils));
5
+ })(this, (function (exports, vue, icons, lodashEs, elementPlus, Sortable, utils) { 'use strict';
6
6
 
7
7
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
8
 
@@ -62,7 +62,11 @@
62
62
  asyncLoadConfig(value, initValue2, item);
63
63
  if (name && !items && typeof initValue2[name] !== "undefined") {
64
64
  if (typeof value[name] === "undefined") {
65
- value[name] = typeof initValue2[name] === "object" ? lodashEs.cloneDeep(initValue2[name]) : initValue2[name];
65
+ if (type === "number") {
66
+ value[name] = Number(initValue2[name]);
67
+ } else {
68
+ value[name] = typeof initValue2[name] === "object" ? lodashEs.cloneDeep(initValue2[name]) : initValue2[name];
69
+ }
66
70
  }
67
71
  return value;
68
72
  }
@@ -113,7 +117,8 @@
113
117
  model: props.model,
114
118
  parent: mForm?.parentValues || {},
115
119
  formValue: mForm?.values || props.model,
116
- prop: props.prop
120
+ prop: props.prop,
121
+ config: props.config
117
122
  });
118
123
  };
119
124
  const display = function(mForm, config, props) {
@@ -144,7 +149,8 @@
144
149
  model: props.model,
145
150
  parent: mForm?.parentValues || {},
146
151
  formValue: mForm?.values || props.model,
147
- prop: props.prop
152
+ prop: props.prop,
153
+ config: props.config
148
154
  }, mForm);
149
155
  }
150
156
  return item;
@@ -172,8 +178,9 @@
172
178
  return target;
173
179
  };
174
180
 
175
- const _sfc_main$s = vue.defineComponent({
181
+ const _sfc_main$t = vue.defineComponent({
176
182
  name: "m-form-container",
183
+ components: { WarningFilled: icons.WarningFilled },
177
184
  props: {
178
185
  labelWidth: String,
179
186
  expandMore: Boolean,
@@ -203,7 +210,18 @@
203
210
  const expand = vue.ref(false);
204
211
  const name = vue.computed(() => props.config.name || "");
205
212
  const items = vue.computed(() => props.config.items);
206
- const itemProp = vue.computed(() => name.value ? `${props.prop}${props.prop ? "." : ""}${name.value}` : props.prop);
213
+ const itemProp = vue.computed(() => {
214
+ let n = "";
215
+ const { names } = props.config;
216
+ if (names?.[0]) {
217
+ [n] = names;
218
+ } else if (name.value) {
219
+ n = name.value;
220
+ } else {
221
+ return props.prop;
222
+ }
223
+ return `${props.prop}${props.prop ? "." : ""}${n}`;
224
+ });
207
225
  const tagName = vue.computed(() => {
208
226
  const component = vue.resolveComponent(`m-${items.value ? "form" : "fields"}-${type.value}`);
209
227
  if (typeof component !== "string")
@@ -231,6 +249,7 @@
231
249
  }
232
250
  return display(mForm, props.config.display, props);
233
251
  });
252
+ const itemLabelWidth = vue.computed(() => props.config.labelWidth || props.labelWidth);
234
253
  vue.watchEffect(() => {
235
254
  expand.value = props.expandMore;
236
255
  });
@@ -242,7 +261,8 @@
242
261
  model: props.model,
243
262
  values: mForm?.initValues,
244
263
  formValue: mForm?.values,
245
- prop: itemProp.value
264
+ prop: itemProp.value,
265
+ config: props.config
246
266
  });
247
267
  }
248
268
  if (filter === "number") {
@@ -256,7 +276,8 @@
256
276
  model: props.model,
257
277
  values: mForm?.initValues,
258
278
  formValue: mForm?.values,
259
- prop: itemProp.value
279
+ prop: itemProp.value,
280
+ config: props.config
260
281
  });
261
282
  }
262
283
  };
@@ -291,6 +312,7 @@
291
312
  itemProp,
292
313
  items,
293
314
  display: display$1,
315
+ itemLabelWidth,
294
316
  tagName,
295
317
  rule,
296
318
  tooltip,
@@ -301,24 +323,25 @@
301
323
  };
302
324
  }
303
325
  });
304
- const _hoisted_1$g = ["innerHTML"];
326
+ const _hoisted_1$f = ["innerHTML"];
305
327
  const _hoisted_2$7 = ["innerHTML"];
306
328
  const _hoisted_3$7 = ["innerHTML"];
307
- const _hoisted_4$6 = /* @__PURE__ */ vue.createElementVNode("i", { class: "el-icon-warning" }, null, -1);
308
- const _hoisted_5$4 = ["innerHTML"];
309
- const _hoisted_6$3 = {
329
+ const _hoisted_4$6 = ["innerHTML"];
330
+ const _hoisted_5$4 = {
310
331
  key: 4,
311
332
  style: { "text-align": "center" }
312
333
  };
313
- function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
334
+ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
314
335
  const _component_m_fields_hidden = vue.resolveComponent("m-fields-hidden");
315
336
  const _component_el_tooltip = vue.resolveComponent("el-tooltip");
316
337
  const _component_el_form_item = vue.resolveComponent("el-form-item");
338
+ const _component_warning_filled = vue.resolveComponent("warning-filled");
339
+ const _component_el_icon = vue.resolveComponent("el-icon");
317
340
  const _component_m_form_container = vue.resolveComponent("m-form-container");
318
341
  const _component_el_button = vue.resolveComponent("el-button");
319
342
  return _ctx.config ? (vue.openBlock(), vue.createElementBlock("div", {
320
343
  key: 0,
321
- style: vue.normalizeStyle(_ctx.config.tip ? "display: flex" : ""),
344
+ style: vue.normalizeStyle(_ctx.config.tip ? "display: flex;align-items: baseline;" : ""),
322
345
  class: vue.normalizeClass([_ctx.config.className, "m-form-container"])
323
346
  }, [
324
347
  _ctx.type === "hidden" ? (vue.openBlock(), vue.createBlock(_component_m_fields_hidden, {
@@ -337,19 +360,20 @@
337
360
  prop: _ctx.itemProp,
338
361
  "step-active": _ctx.stepActive,
339
362
  "expand-more": _ctx.expand,
340
- "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
363
+ "label-width": _ctx.itemLabelWidth,
341
364
  onChange: _ctx.onChangeHandler
342
- }, null, 8, ["size", "model", "config", "name", "prop", "step-active", "expand-more", "label-width", "onChange"])) : _ctx.type && _ctx.display ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
365
+ }, null, 40, ["size", "model", "config", "name", "prop", "step-active", "expand-more", "label-width", "onChange"])) : _ctx.type && _ctx.display ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
343
366
  vue.createVNode(_component_el_form_item, {
344
367
  style: vue.normalizeStyle(_ctx.config.tip ? "flex: 1" : ""),
368
+ class: vue.normalizeClass({ hidden: `${_ctx.itemLabelWidth}` === "0" || !_ctx.config.text }),
345
369
  prop: _ctx.itemProp,
346
- "label-width": _ctx.config.text ? _ctx.config.labelWidth || _ctx.labelWidth : "0",
370
+ "label-width": _ctx.itemLabelWidth,
347
371
  rules: _ctx.rule
348
372
  }, {
349
373
  label: vue.withCtx(() => [
350
374
  vue.createElementVNode("span", {
351
375
  innerHTML: _ctx.type === "checkbox" ? "" : _ctx.config.text
352
- }, null, 8, _hoisted_1$g)
376
+ }, null, 8, _hoisted_1$f)
353
377
  ]),
354
378
  default: vue.withCtx(() => [
355
379
  _ctx.tooltip ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, { key: 0 }, {
@@ -366,7 +390,7 @@
366
390
  disabled: _ctx.disabled,
367
391
  prop: _ctx.itemProp,
368
392
  onChange: _ctx.onChangeHandler
369
- }, null, 8, ["size", "model", "config", "name", "disabled", "prop", "onChange"]))
393
+ }, null, 40, ["size", "model", "config", "name", "disabled", "prop", "onChange"]))
370
394
  ]),
371
395
  _: 1
372
396
  })) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.tagName), {
@@ -378,7 +402,7 @@
378
402
  disabled: _ctx.disabled,
379
403
  prop: _ctx.itemProp,
380
404
  onChange: _ctx.onChangeHandler
381
- }, null, 8, ["size", "model", "config", "name", "disabled", "prop", "onChange"])),
405
+ }, null, 40, ["size", "model", "config", "name", "disabled", "prop", "onChange"])),
382
406
  _ctx.extra ? (vue.openBlock(), vue.createElementBlock("div", {
383
407
  key: 2,
384
408
  innerHTML: _ctx.extra,
@@ -386,19 +410,23 @@
386
410
  }, null, 8, _hoisted_3$7)) : vue.createCommentVNode("", true)
387
411
  ]),
388
412
  _: 1
389
- }, 8, ["style", "prop", "label-width", "rules"]),
413
+ }, 8, ["style", "class", "prop", "label-width", "rules"]),
390
414
  _ctx.config.tip ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
391
415
  key: 0,
392
- placement: "top",
393
- style: { "line-height": "40px", "margin-left": "5px" }
416
+ placement: "left"
394
417
  }, {
395
418
  content: vue.withCtx(() => [
396
419
  vue.createElementVNode("div", {
397
420
  innerHTML: _ctx.config.tip
398
- }, null, 8, _hoisted_5$4)
421
+ }, null, 8, _hoisted_4$6)
399
422
  ]),
400
423
  default: vue.withCtx(() => [
401
- _hoisted_4$6
424
+ vue.createVNode(_component_el_icon, { style: { "line-height": "40px", "margin-left": "5px" } }, {
425
+ default: vue.withCtx(() => [
426
+ vue.createVNode(_component_warning_filled)
427
+ ]),
428
+ _: 1
429
+ })
402
430
  ]),
403
431
  _: 1
404
432
  })) : vue.createCommentVNode("", true)
@@ -411,15 +439,15 @@
411
439
  size: _ctx.size,
412
440
  "step-active": _ctx.stepActive,
413
441
  "expand-more": _ctx.expand,
414
- "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
442
+ "label-width": _ctx.itemLabelWidth,
415
443
  prop: _ctx.itemProp,
416
444
  onChange: _ctx.onChangeHandler
417
445
  }, null, 8, ["model", "config", "size", "step-active", "expand-more", "label-width", "prop", "onChange"]);
418
446
  }), 128)) : vue.createCommentVNode("", true)
419
447
  ], 64)) : vue.createCommentVNode("", true),
420
- _ctx.config.expand && _ctx.type !== "fieldset" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$3, [
448
+ _ctx.config.expand && _ctx.type !== "fieldset" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$4, [
421
449
  vue.createVNode(_component_el_button, {
422
- type: "text",
450
+ text: "",
423
451
  onClick: _ctx.expandHandler
424
452
  }, {
425
453
  default: vue.withCtx(() => [
@@ -430,9 +458,9 @@
430
458
  ])) : vue.createCommentVNode("", true)
431
459
  ], 6)) : vue.createCommentVNode("", true);
432
460
  }
433
- var Container = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$p]]);
461
+ var Container = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$q]]);
434
462
 
435
- const _sfc_main$r = vue.defineComponent({
463
+ const _sfc_main$s = vue.defineComponent({
436
464
  name: "m-form-fieldset",
437
465
  props: {
438
466
  labelWidth: String,
@@ -484,7 +512,7 @@
484
512
  };
485
513
  }
486
514
  });
487
- const _hoisted_1$f = ["innerHTML"];
515
+ const _hoisted_1$e = ["innerHTML"];
488
516
  const _hoisted_2$6 = ["innerHTML"];
489
517
  const _hoisted_3$6 = { key: 1 };
490
518
  const _hoisted_4$5 = ["innerHTML"];
@@ -498,7 +526,7 @@
498
526
  };
499
527
  const _hoisted_10$1 = { style: { "flex": "1" } };
500
528
  const _hoisted_11 = ["src"];
501
- function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
529
+ function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
502
530
  const _component_el_checkbox = vue.resolveComponent("el-checkbox");
503
531
  const _component_m_form_container = vue.resolveComponent("m-form-container");
504
532
  return (_ctx.name ? _ctx.model[_ctx.name] : _ctx.model) ? (vue.openBlock(), vue.createElementBlock("fieldset", {
@@ -518,7 +546,7 @@
518
546
  default: vue.withCtx(() => [
519
547
  vue.createElementVNode("span", {
520
548
  innerHTML: _ctx.config.legend
521
- }, null, 8, _hoisted_1$f),
549
+ }, null, 8, _hoisted_1$e),
522
550
  _ctx.config.extra ? (vue.openBlock(), vue.createElementBlock("span", {
523
551
  key: 0,
524
552
  innerHTML: _ctx.config.extra,
@@ -590,9 +618,9 @@
590
618
  }), 128)) : vue.createCommentVNode("", true)
591
619
  ], 4)) : vue.createCommentVNode("", true);
592
620
  }
593
- var Fieldset = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$o]]);
621
+ var Fieldset = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$p]]);
594
622
 
595
- const _sfc_main$q = vue.defineComponent({
623
+ const _sfc_main$r = vue.defineComponent({
596
624
  name: "m-form-group-list-item",
597
625
  components: { CaretRight: icons.CaretRight, CaretBottom: icons.CaretBottom },
598
626
  props: {
@@ -676,11 +704,11 @@
676
704
  };
677
705
  }
678
706
  });
679
- const _hoisted_1$e = { class: "m-fields-group-list-item" };
707
+ const _hoisted_1$d = { class: "m-fields-group-list-item" };
680
708
  const _hoisted_2$5 = /* @__PURE__ */ vue.createTextVNode("\u4E0A\u79FB");
681
709
  const _hoisted_3$5 = /* @__PURE__ */ vue.createTextVNode("\u4E0B\u79FB");
682
710
  const _hoisted_4$4 = ["innerHTML"];
683
- function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
711
+ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
684
712
  const _component_caret_bottom = vue.resolveComponent("caret-bottom");
685
713
  const _component_caret_right = vue.resolveComponent("caret-right");
686
714
  const _component_el_icon = vue.resolveComponent("el-icon");
@@ -688,7 +716,7 @@
688
716
  const _component_CaretRight = vue.resolveComponent("CaretRight");
689
717
  const _component_CaretBottom = vue.resolveComponent("CaretBottom");
690
718
  const _component_m_form_container = vue.resolveComponent("m-form-container");
691
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$e, [
719
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
692
720
  vue.createElementVNode("div", null, [
693
721
  vue.createVNode(_component_el_icon, {
694
722
  style: { "margin-right": "7px" },
@@ -700,7 +728,7 @@
700
728
  _: 1
701
729
  }, 8, ["onClick"]),
702
730
  vue.createVNode(_component_el_button, {
703
- type: "text",
731
+ text: "",
704
732
  onClick: _ctx.expandHandler
705
733
  }, {
706
734
  default: vue.withCtx(() => [
@@ -709,7 +737,7 @@
709
737
  _: 1
710
738
  }, 8, ["onClick"]),
711
739
  vue.withDirectives(vue.createVNode(_component_el_button, {
712
- type: "text",
740
+ text: "",
713
741
  icon: _ctx.Delete,
714
742
  style: { "color": "#f56c6c" },
715
743
  onClick: _ctx.removeHandler
@@ -718,7 +746,7 @@
718
746
  ]),
719
747
  _ctx.movable() ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
720
748
  vue.withDirectives(vue.createVNode(_component_el_button, {
721
- type: "text",
749
+ text: "",
722
750
  size: "small",
723
751
  onClick: _cache[0] || (_cache[0] = ($event) => _ctx.changeOrder(-1))
724
752
  }, {
@@ -736,7 +764,7 @@
736
764
  [vue.vShow, _ctx.index !== 0]
737
765
  ]),
738
766
  vue.withDirectives(vue.createVNode(_component_el_button, {
739
- type: "text",
767
+ text: "",
740
768
  size: "small",
741
769
  onClick: _cache[1] || (_cache[1] = ($event) => _ctx.changeOrder(1))
742
770
  }, {
@@ -771,9 +799,9 @@
771
799
  }, null, 8, ["config", "model", "labelWidth", "prop", "size", "onChange"])) : vue.createCommentVNode("", true)
772
800
  ]);
773
801
  }
774
- var MFieldsGroupListItem = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$n]]);
802
+ var MFieldsGroupListItem = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$o]]);
775
803
 
776
- const _sfc_main$p = vue.defineComponent({
804
+ const _sfc_main$q = vue.defineComponent({
777
805
  name: "m-form-group-list",
778
806
  components: { MFieldsGroupListItem },
779
807
  props: {
@@ -865,7 +893,7 @@
865
893
  };
866
894
  }
867
895
  });
868
- const _hoisted_1$d = { class: "m-fields-group-list" };
896
+ const _hoisted_1$c = { class: "m-fields-group-list" };
869
897
  const _hoisted_2$4 = ["innerHTML"];
870
898
  const _hoisted_3$4 = {
871
899
  key: 1,
@@ -877,10 +905,10 @@
877
905
  ];
878
906
  const _hoisted_6$1 = /* @__PURE__ */ vue.createTextVNode("\u6DFB\u52A0\u7EC4");
879
907
  const _hoisted_7$1 = /* @__PURE__ */ vue.createTextVNode("\u5207\u6362\u4E3A\u8868\u683C");
880
- function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
908
+ function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
881
909
  const _component_m_fields_group_list_item = vue.resolveComponent("m-fields-group-list-item");
882
910
  const _component_el_button = vue.resolveComponent("el-button");
883
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
911
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
884
912
  _ctx.config.extra ? (vue.openBlock(), vue.createElementBlock("div", {
885
913
  key: 0,
886
914
  innerHTML: _ctx.config.extra,
@@ -924,9 +952,9 @@
924
952
  }, 8, ["onClick"])) : vue.createCommentVNode("", true)
925
953
  ]);
926
954
  }
927
- var GroupList = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["render", _sfc_render$m]]);
955
+ var GroupList = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$n]]);
928
956
 
929
- const _sfc_main$o = vue.defineComponent({
957
+ const _sfc_main$p = vue.defineComponent({
930
958
  name: "m-form-panel",
931
959
  components: { CaretBottom: icons.CaretBottom, CaretRight: icons.CaretRight },
932
960
  props: {
@@ -959,7 +987,7 @@
959
987
  };
960
988
  }
961
989
  });
962
- const _hoisted_1$c = { class: "clearfix" };
990
+ const _hoisted_1$b = { class: "clearfix" };
963
991
  const _hoisted_2$3 = ["innerHTML"];
964
992
  const _hoisted_3$3 = {
965
993
  key: 0,
@@ -967,7 +995,7 @@
967
995
  };
968
996
  const _hoisted_4$2 = { style: { "flex": "1" } };
969
997
  const _hoisted_5$1 = ["src"];
970
- function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
998
+ function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
971
999
  const _component_caret_bottom = vue.resolveComponent("caret-bottom");
972
1000
  const _component_caret_right = vue.resolveComponent("caret-right");
973
1001
  const _component_el_icon = vue.resolveComponent("el-icon");
@@ -979,7 +1007,7 @@
979
1007
  "body-style": { display: _ctx.expand ? "block" : "none" }
980
1008
  }, {
981
1009
  header: vue.withCtx(() => [
982
- vue.createElementVNode("div", _hoisted_1$c, [
1010
+ vue.createElementVNode("div", _hoisted_1$b, [
983
1011
  vue.createElementVNode("a", {
984
1012
  href: "javascript:",
985
1013
  style: { "width": "100%", "display": "block" },
@@ -1037,10 +1065,60 @@
1037
1065
  _: 3
1038
1066
  }, 8, ["body-style"])) : vue.createCommentVNode("", true);
1039
1067
  }
1040
- var Panel = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$l]]);
1068
+ var Panel = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["render", _sfc_render$m]]);
1069
+
1070
+ const _sfc_main$o = vue.defineComponent({
1071
+ props: {
1072
+ labelWidth: String,
1073
+ expandMore: Boolean,
1074
+ span: Number,
1075
+ model: {
1076
+ type: Object,
1077
+ default: () => ({})
1078
+ },
1079
+ config: {
1080
+ type: Object,
1081
+ default: () => ({})
1082
+ },
1083
+ prop: String,
1084
+ size: String
1085
+ },
1086
+ emits: ["change"],
1087
+ setup(props, { emit }) {
1088
+ const mForm = vue.inject("mForm");
1089
+ const changeHandler = () => emit("change", props.model);
1090
+ return {
1091
+ mForm,
1092
+ display: vue.computed(() => display(mForm, props.config.display, props)),
1093
+ changeHandler
1094
+ };
1095
+ }
1096
+ });
1097
+ function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
1098
+ const _component_m_form_container = vue.resolveComponent("m-form-container");
1099
+ const _component_el_col = vue.resolveComponent("el-col");
1100
+ return vue.withDirectives((vue.openBlock(), vue.createBlock(_component_el_col, { span: _ctx.span }, {
1101
+ default: vue.withCtx(() => [
1102
+ vue.createVNode(_component_m_form_container, {
1103
+ model: _ctx.model,
1104
+ config: _ctx.config,
1105
+ prop: _ctx.prop,
1106
+ "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
1107
+ "expand-more": _ctx.expandMore,
1108
+ size: _ctx.size,
1109
+ onChange: _ctx.changeHandler
1110
+ }, null, 8, ["model", "config", "prop", "label-width", "expand-more", "size", "onChange"])
1111
+ ]),
1112
+ _: 1
1113
+ }, 8, ["span"])), [
1114
+ [vue.vShow, _ctx.display && _ctx.config.type !== "hidden"]
1115
+ ]);
1116
+ }
1117
+ var Col = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$l]]);
1041
1118
 
1042
1119
  const _sfc_main$n = vue.defineComponent({
1043
1120
  name: "m-form-row",
1121
+ components: { Col },
1044
1122
  props: {
1045
1123
  labelWidth: String,
1046
1124
  expandMore: Boolean,
@@ -1062,38 +1140,27 @@
1062
1140
  const changeHandler = () => emit("change", props.name ? props.model[props.name] : props.model);
1063
1141
  return {
1064
1142
  mForm,
1065
- display(config) {
1066
- return display(mForm, config.display, props);
1067
- },
1068
1143
  changeHandler
1069
1144
  };
1070
1145
  }
1071
1146
  });
1072
1147
  function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
1073
- const _component_m_form_container = vue.resolveComponent("m-form-container");
1074
- const _component_el_col = vue.resolveComponent("el-col");
1148
+ const _component_Col = vue.resolveComponent("Col");
1075
1149
  const _component_el_row = vue.resolveComponent("el-row");
1076
1150
  return vue.openBlock(), vue.createBlock(_component_el_row, { gutter: 10 }, {
1077
1151
  default: vue.withCtx(() => [
1078
1152
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config.items, (col, index) => {
1079
- return vue.openBlock(), vue.createBlock(_component_el_col, {
1080
- style: vue.normalizeStyle(!_ctx.display(col) || col.type === "hidden" ? "display: none" : ""),
1153
+ return vue.openBlock(), vue.createBlock(_component_Col, {
1081
1154
  key: col[_ctx.mForm?.keyProp || "__key"] ?? index,
1082
- span: col.span || _ctx.config.span || 24 / _ctx.config.items.length
1083
- }, {
1084
- default: vue.withCtx(() => [
1085
- vue.createVNode(_component_m_form_container, {
1086
- model: _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
1087
- config: col,
1088
- prop: _ctx.prop,
1089
- "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
1090
- "expand-more": _ctx.expandMore,
1091
- size: _ctx.size,
1092
- onChange: _ctx.changeHandler
1093
- }, null, 8, ["model", "config", "prop", "label-width", "expand-more", "size", "onChange"])
1094
- ]),
1095
- _: 2
1096
- }, 1032, ["style", "span"]);
1155
+ span: col.span || _ctx.config.span || 24 / _ctx.config.items.length,
1156
+ config: col,
1157
+ labelWidth: _ctx.config.labelWidth || _ctx.labelWidth,
1158
+ expandMore: _ctx.expandMore,
1159
+ model: _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
1160
+ prop: _ctx.prop,
1161
+ size: _ctx.size,
1162
+ onChange: _ctx.changeHandler
1163
+ }, null, 8, ["span", "config", "labelWidth", "expandMore", "model", "prop", "size", "onChange"]);
1097
1164
  }), 128))
1098
1165
  ]),
1099
1166
  _: 1
@@ -1426,7 +1493,7 @@
1426
1493
  }
1427
1494
  emit("select", selection, row);
1428
1495
  if (typeof props.config.onSelect === "function") {
1429
- props.config.onSelect(mForm, { selection, row });
1496
+ props.config.onSelect(mForm, { selection, row, config: props.config });
1430
1497
  }
1431
1498
  },
1432
1499
  toggleRowSelection(row, selected) {
@@ -1552,7 +1619,7 @@
1552
1619
  };
1553
1620
  }
1554
1621
  });
1555
- const _hoisted_1$b = ["innerHTML"];
1622
+ const _hoisted_1$a = ["innerHTML"];
1556
1623
  const _hoisted_2$2 = { class: "el-form-item__content" };
1557
1624
  const _hoisted_3$2 = ["innerHTML"];
1558
1625
  const _hoisted_4$1 = /* @__PURE__ */ vue.createTextVNode("\u6DFB\u52A0");
@@ -1581,7 +1648,7 @@
1581
1648
  key: 0,
1582
1649
  style: { "color": "rgba(0, 0, 0, 0.45)" },
1583
1650
  innerHTML: _ctx.config.extra
1584
- }, null, 8, _hoisted_1$b)) : vue.createCommentVNode("", true),
1651
+ }, null, 8, _hoisted_1$a)) : vue.createCommentVNode("", true),
1585
1652
  vue.createElementVNode("div", _hoisted_2$2, [
1586
1653
  vue.createVNode(_component_el_tooltip, {
1587
1654
  content: "\u62D6\u62FD\u53EF\u6392\u5E8F",
@@ -1622,8 +1689,8 @@
1622
1689
  }, {
1623
1690
  default: vue.withCtx((scope) => [
1624
1691
  vue.withDirectives(vue.createVNode(_component_el_button, {
1625
- style: { "color": "#f56c6c" },
1626
- type: "text",
1692
+ type: "danger",
1693
+ text: "",
1627
1694
  icon: _ctx.Delete,
1628
1695
  onClick: ($event) => _ctx.removeHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
1629
1696
  }, null, 8, ["icon", "onClick"]), [
@@ -1647,8 +1714,9 @@
1647
1714
  vue.createVNode(_component_el_button, {
1648
1715
  plain: "",
1649
1716
  size: "small",
1717
+ type: "primary",
1650
1718
  icon: _ctx.ArrowUp,
1651
- type: "text",
1719
+ text: "",
1652
1720
  onClick: ($event) => _ctx.upHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1),
1653
1721
  onDblclick: ($event) => _ctx.topHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
1654
1722
  }, null, 8, ["icon", "onClick", "onDblclick"])
@@ -1664,8 +1732,9 @@
1664
1732
  vue.createVNode(_component_el_button, {
1665
1733
  plain: "",
1666
1734
  size: "small",
1735
+ type: "primary",
1667
1736
  icon: _ctx.ArrowDown,
1668
- type: "text",
1737
+ text: "",
1669
1738
  onClick: ($event) => _ctx.downHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1),
1670
1739
  onDblclick: ($event) => _ctx.bottomHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
1671
1740
  }, null, 8, ["icon", "onClick", "onDblclick"])
@@ -1742,6 +1811,7 @@
1742
1811
  key: 1,
1743
1812
  icon: _ctx.Grid,
1744
1813
  size: "small",
1814
+ type: "primary",
1745
1815
  onClick: _ctx.toggleMode
1746
1816
  }, {
1747
1817
  default: vue.withCtx(() => [
@@ -1753,6 +1823,7 @@
1753
1823
  key: 2,
1754
1824
  icon: _ctx.FullScreen,
1755
1825
  size: "small",
1826
+ type: "primary",
1756
1827
  onClick: _ctx.toggleFullscreen
1757
1828
  }, {
1758
1829
  default: vue.withCtx(() => [
@@ -1827,11 +1898,11 @@
1827
1898
  const { config, model, prop } = props;
1828
1899
  tab.name = tab.paneName;
1829
1900
  if (typeof config.onTabClick === "function") {
1830
- config.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop });
1901
+ config.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop, config });
1831
1902
  }
1832
1903
  const tabConfig = config.items.find((item) => tab.name === item.status);
1833
1904
  if (tabConfig && typeof tabConfig.onTabClick === "function") {
1834
- tabConfig.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop });
1905
+ tabConfig.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop, config });
1835
1906
  }
1836
1907
  };
1837
1908
  const Tab = vue.defineComponent({
@@ -1886,7 +1957,11 @@
1886
1957
  if (!props.config.name)
1887
1958
  throw new Error("dynamic tab \u5FC5\u987B\u914D\u7F6Ename");
1888
1959
  if (typeof props.config.onTabAdd === "function") {
1889
- props.config.onTabAdd(mForm, { model: props.model });
1960
+ props.config.onTabAdd(mForm, {
1961
+ model: props.model,
1962
+ prop: props.prop,
1963
+ config: props.config
1964
+ });
1890
1965
  } else if (tabs.value.length > 0) {
1891
1966
  const newObj = lodashEs.cloneDeep(tabs.value[0]);
1892
1967
  newObj.title = `\u6807\u7B7E${tabs.value.length + 1}`;
@@ -1899,7 +1974,11 @@
1899
1974
  if (!props.config.name)
1900
1975
  throw new Error("dynamic tab \u5FC5\u987B\u914D\u7F6Ename");
1901
1976
  if (typeof props.config.onTabRemove === "function") {
1902
- props.config.onTabRemove(mForm, tabName, { model: props.model });
1977
+ props.config.onTabRemove(mForm, tabName, {
1978
+ model: props.model,
1979
+ prop: props.prop,
1980
+ config: props.config
1981
+ });
1903
1982
  } else {
1904
1983
  props.model[props.config.name].splice(+tabName, 1);
1905
1984
  if (tabName < activeTabName.value || activeTabName.value >= props.model[props.config.name].length) {
@@ -1914,7 +1993,7 @@
1914
1993
  changeHandler: () => {
1915
1994
  emit("change", props.model);
1916
1995
  if (typeof props.config.onChange === "function") {
1917
- props.config.onChange(mForm, { model: props.model });
1996
+ props.config.onChange(mForm, { model: props.model, prop: props.prop, config: props.config });
1918
1997
  }
1919
1998
  }
1920
1999
  };
@@ -2103,13 +2182,13 @@
2103
2182
  };
2104
2183
  }
2105
2184
  });
2106
- const _hoisted_1$a = {
2185
+ const _hoisted_1$9 = {
2107
2186
  class: "m-cascader",
2108
2187
  style: { "width": "100%" }
2109
2188
  };
2110
2189
  function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
2111
2190
  const _component_el_cascader = vue.resolveComponent("el-cascader");
2112
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
2191
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
2113
2192
  vue.createVNode(_component_el_cascader, {
2114
2193
  modelValue: _ctx.model[_ctx.name],
2115
2194
  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
@@ -2149,7 +2228,7 @@
2149
2228
  } else {
2150
2229
  return props.config.activeValue;
2151
2230
  }
2152
- return "true";
2231
+ return void 0;
2153
2232
  }),
2154
2233
  inactiveValue: vue.computed(() => {
2155
2234
  if (typeof props.config.inactiveValue === "undefined") {
@@ -2159,7 +2238,7 @@
2159
2238
  } else {
2160
2239
  return props.config.inactiveValue;
2161
2240
  }
2162
- return "false";
2241
+ return void 0;
2163
2242
  }),
2164
2243
  changeHandler(value) {
2165
2244
  emit("change", value);
@@ -2232,7 +2311,7 @@
2232
2311
  }
2233
2312
  var CheckboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["render", _sfc_render$e]]);
2234
2313
 
2235
- const _hoisted_1$9 = { key: 0 };
2314
+ const _hoisted_1$8 = { key: 0 };
2236
2315
  const __default__$2 = vue.defineComponent({
2237
2316
  name: "m-fields-color-picker"
2238
2317
  });
@@ -2252,7 +2331,7 @@
2252
2331
  const changeHandler = (value) => emit("change", value);
2253
2332
  return (_ctx, _cache) => {
2254
2333
  const _component_el_color_picker = vue.resolveComponent("el-color-picker");
2255
- return _ctx.model ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
2334
+ return _ctx.model ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
2256
2335
  vue.createVNode(_component_el_color_picker, {
2257
2336
  modelValue: _ctx.model[_ctx.name],
2258
2337
  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
@@ -2288,10 +2367,10 @@
2288
2367
  };
2289
2368
  }
2290
2369
  });
2291
- const _hoisted_1$8 = { key: 0 };
2370
+ const _hoisted_1$7 = { key: 0 };
2292
2371
  function _sfc_render$d(_ctx, _cache, $props, $setup, $data, $options) {
2293
2372
  const _component_el_date_picker = vue.resolveComponent("el-date-picker");
2294
- return _ctx.model ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
2373
+ return _ctx.model ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
2295
2374
  vue.createVNode(_component_el_date_picker, {
2296
2375
  modelValue: _ctx.model[_ctx.modelName],
2297
2376
  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.modelName] = $event),
@@ -2337,6 +2416,14 @@
2337
2416
  });
2338
2417
  } else if (props.model && props.name && v instanceof Date) {
2339
2418
  props.model[props.name] = utils.datetimeFormatter(v.toString(), "");
2419
+ } else if (names?.length) {
2420
+ names.forEach((item) => {
2421
+ if (props.model) {
2422
+ props.model[item] = void 0;
2423
+ }
2424
+ });
2425
+ } else if (props.name) {
2426
+ props.model[props.name] = void 0;
2340
2427
  }
2341
2428
  };
2342
2429
  return {
@@ -2395,10 +2482,10 @@
2395
2482
  };
2396
2483
  }
2397
2484
  });
2398
- const _hoisted_1$7 = { key: 0 };
2485
+ const _hoisted_1$6 = { key: 0 };
2399
2486
  function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
2400
2487
  const _component_el_date_picker = vue.resolveComponent("el-date-picker");
2401
- return _ctx.model ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
2488
+ return _ctx.model ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
2402
2489
  vue.createVNode(_component_el_date_picker, {
2403
2490
  modelValue: _ctx.model[_ctx.name],
2404
2491
  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
@@ -2415,7 +2502,7 @@
2415
2502
  }
2416
2503
  var DateTime = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$b]]);
2417
2504
 
2418
- const _hoisted_1$6 = { key: 0 };
2505
+ const _hoisted_1$5 = { key: 0 };
2419
2506
  const __default__$1 = vue.defineComponent({
2420
2507
  name: "m-fields-display"
2421
2508
  });
@@ -2436,7 +2523,7 @@
2436
2523
  }
2437
2524
  useAddField(props.prop);
2438
2525
  return (_ctx, _cache) => {
2439
- return _ctx.model ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$6, vue.toDisplayString(_ctx.model[vue.unref(n)]), 1)) : vue.createCommentVNode("", true);
2526
+ return _ctx.model ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$5, vue.toDisplayString(_ctx.model[vue.unref(n)]), 1)) : vue.createCommentVNode("", true);
2440
2527
  };
2441
2528
  }
2442
2529
  });
@@ -2506,12 +2593,12 @@
2506
2593
  }
2507
2594
  }
2508
2595
  });
2509
- const _hoisted_1$5 = { class: "m-fields-dynamic-field" };
2596
+ const _hoisted_1$4 = { class: "m-fields-dynamic-field" };
2510
2597
  function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
2511
2598
  const _component_el_input = vue.resolveComponent("el-input");
2512
2599
  const _component_el_form_item = vue.resolveComponent("el-form-item");
2513
2600
  const _component_el_form = vue.resolveComponent("el-form");
2514
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
2601
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
2515
2602
  vue.createVNode(_component_el_form, { size: "small" }, {
2516
2603
  default: vue.withCtx(() => [
2517
2604
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(Object.keys(_ctx.fieldMap.value), (key) => {
@@ -2633,7 +2720,7 @@
2633
2720
  };
2634
2721
  }
2635
2722
  });
2636
- const _hoisted_1$4 = ["href"];
2723
+ const _hoisted_1$3 = ["href"];
2637
2724
  const _hoisted_2$1 = {
2638
2725
  key: 2,
2639
2726
  class: "m-fields-link"
@@ -2647,12 +2734,13 @@
2647
2734
  target: "_blank",
2648
2735
  href: _ctx.href,
2649
2736
  style: vue.normalizeStyle(_ctx.config.css || {})
2650
- }, vue.toDisplayString(_ctx.displayText), 13, _hoisted_1$4)) : _ctx.config.href && _ctx.disabled ? (vue.openBlock(), vue.createElementBlock("span", {
2737
+ }, vue.toDisplayString(_ctx.displayText), 13, _hoisted_1$3)) : _ctx.config.href && _ctx.disabled ? (vue.openBlock(), vue.createElementBlock("span", {
2651
2738
  key: 1,
2652
2739
  style: vue.normalizeStyle(_ctx.config.disabledCss || {})
2653
2740
  }, vue.toDisplayString(_ctx.displayText), 5)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
2654
2741
  vue.createVNode(_component_el_button, {
2655
- type: "text",
2742
+ text: "",
2743
+ type: "primary",
2656
2744
  onClick: _ctx.editHandler
2657
2745
  }, {
2658
2746
  default: vue.withCtx(() => [
@@ -2832,7 +2920,8 @@
2832
2920
  body = body(mForm, {
2833
2921
  model: props.model,
2834
2922
  formValue: mForm?.values,
2835
- formValues: mForm?.values
2923
+ formValues: mForm?.values,
2924
+ config: props.config
2836
2925
  });
2837
2926
  }
2838
2927
  body.query = query.value;
@@ -2855,7 +2944,8 @@
2855
2944
  res = option.afterRequest(mForm, res, {
2856
2945
  model: props.model,
2857
2946
  formValue: mForm?.values,
2858
- formValues: mForm?.values
2947
+ formValues: mForm?.values,
2948
+ config: props.config
2859
2949
  });
2860
2950
  }
2861
2951
  const optionsData = res[option.root];
@@ -2945,8 +3035,10 @@
2945
3035
  vue.watch(() => mForm?.values, () => {
2946
3036
  typeof props.config.options === "function" && Promise.resolve(props.config.options(mForm, {
2947
3037
  model: props.model,
3038
+ prop: props.prop,
2948
3039
  formValues: mForm?.values,
2949
- formValue: mForm?.values
3040
+ formValue: mForm?.values,
3041
+ config: props.config
2950
3042
  })).then((data) => {
2951
3043
  options.value = data;
2952
3044
  });
@@ -2995,11 +3087,10 @@
2995
3087
  options,
2996
3088
  moreLoadingVisible,
2997
3089
  popperClass: mForm?.popperClass,
3090
+ getOptions,
2998
3091
  getRequestFuc() {
2999
3092
  return getConfig("request");
3000
3093
  },
3001
- async getInitOption() {
3002
- },
3003
3094
  changeHandler(value) {
3004
3095
  emit("change", value);
3005
3096
  },
@@ -3016,10 +3107,6 @@
3016
3107
  options.value = await getOptions();
3017
3108
  }
3018
3109
  },
3019
- async editAfterAction() {
3020
- pgIndex.value = 0;
3021
- options.value = await getOptions();
3022
- },
3023
3110
  async remoteMethod(q) {
3024
3111
  if (!localOptions.value.length) {
3025
3112
  query.value = q;
@@ -3034,7 +3121,7 @@
3034
3121
  };
3035
3122
  }
3036
3123
  });
3037
- const _hoisted_1$3 = { key: 2 };
3124
+ const _hoisted_1$2 = { key: 2 };
3038
3125
  function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
3039
3126
  const _component_el_option = vue.resolveComponent("el-option");
3040
3127
  const _component_el_option_group = vue.resolveComponent("el-option-group");
@@ -3056,21 +3143,21 @@
3056
3143
  "value-key": _ctx.config.valueKey || "value",
3057
3144
  "allow-create": _ctx.config.allowCreate,
3058
3145
  disabled: _ctx.disabled,
3059
- "remote-method": _ctx.remoteMethod,
3146
+ "remote-method": _ctx.config.remote && _ctx.remoteMethod,
3060
3147
  onChange: _ctx.changeHandler,
3061
3148
  onVisibleChange: _ctx.visibleHandler
3062
3149
  }, {
3063
3150
  default: vue.withCtx(() => [
3064
3151
  _ctx.config.group ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.options, (group, index) => {
3065
3152
  return vue.openBlock(), vue.createBlock(_component_el_option_group, {
3066
- key: group.label + index,
3153
+ key: index,
3067
3154
  label: group.label,
3068
3155
  disabled: group.disabled
3069
3156
  }, {
3070
3157
  default: vue.withCtx(() => [
3071
3158
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(group.options, (item, index2) => {
3072
3159
  return vue.openBlock(), vue.createBlock(_component_el_option, {
3073
- key: item.label + index2,
3160
+ key: index2,
3074
3161
  label: item.label,
3075
3162
  value: item.value,
3076
3163
  disabled: item.disabled
@@ -3087,7 +3174,7 @@
3087
3174
  disabled: option.disabled
3088
3175
  }, null, 8, ["label", "value", "disabled"]);
3089
3176
  }), 128)),
3090
- _ctx.moreLoadingVisible ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, null, 512)), [
3177
+ _ctx.moreLoadingVisible ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, null, 512)), [
3091
3178
  [_directive_loading, true]
3092
3179
  ]) : vue.createCommentVNode("", true)
3093
3180
  ]),
@@ -3164,6 +3251,7 @@
3164
3251
  },
3165
3252
  emits: ["change", "input"],
3166
3253
  setup(props, { emit }) {
3254
+ const mForm = vue.inject("mForm");
3167
3255
  useAddField(props.prop);
3168
3256
  const modelName = vue.computed(() => props.name || props.config.name || "");
3169
3257
  return {
@@ -3172,12 +3260,10 @@
3172
3260
  emit("change", v);
3173
3261
  },
3174
3262
  inputHandler(v) {
3175
- const mForm = vue.inject("mForm");
3176
3263
  emit("input", v);
3177
3264
  mForm?.$emit("field-input", props.prop, v);
3178
3265
  },
3179
3266
  buttonClickHandler() {
3180
- const mForm = vue.inject("mForm");
3181
3267
  if (typeof props.config.append === "string")
3182
3268
  return;
3183
3269
  if (props.config.append?.handler) {
@@ -3241,7 +3327,7 @@
3241
3327
  };
3242
3328
  }
3243
3329
  });
3244
- const _hoisted_1$2 = { key: 0 };
3330
+ const _hoisted_1$1 = { key: 0 };
3245
3331
  function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
3246
3332
  const _component_el_button = vue.resolveComponent("el-button");
3247
3333
  const _component_el_input = vue.resolveComponent("el-input");
@@ -3259,17 +3345,18 @@
3259
3345
  _ctx.config.append ? {
3260
3346
  name: "append",
3261
3347
  fn: vue.withCtx(() => [
3262
- typeof _ctx.config.append === "string" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$2, vue.toDisplayString(_ctx.config.append), 1)) : vue.createCommentVNode("", true),
3348
+ typeof _ctx.config.append === "string" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$1, vue.toDisplayString(_ctx.config.append), 1)) : vue.createCommentVNode("", true),
3263
3349
  typeof _ctx.config.append === "object" && _ctx.config.append.type === "button" ? (vue.openBlock(), vue.createBlock(_component_el_button, {
3264
3350
  key: 1,
3265
3351
  style: { "color": "#409eff" },
3266
- onClick: _ctx.buttonClickHandler
3352
+ size: _ctx.size,
3353
+ onClick: vue.withModifiers(_ctx.buttonClickHandler, ["prevent"])
3267
3354
  }, {
3268
3355
  default: vue.withCtx(() => [
3269
3356
  vue.createTextVNode(vue.toDisplayString(_ctx.config.append.text), 1)
3270
3357
  ]),
3271
3358
  _: 1
3272
- }, 8, ["onClick"])) : vue.createCommentVNode("", true)
3359
+ }, 8, ["size", "onClick"])) : vue.createCommentVNode("", true)
3273
3360
  ])
3274
3361
  } : void 0
3275
3362
  ]), 1032, ["modelValue", "size", "placeholder", "disabled", "onChange", "onInput"]);
@@ -3308,22 +3395,19 @@
3308
3395
  };
3309
3396
  }
3310
3397
  });
3311
- const _hoisted_1$1 = { key: 0 };
3312
3398
  function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
3313
3399
  const _component_el_input = vue.resolveComponent("el-input");
3314
- return _ctx.model ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
3315
- vue.createVNode(_component_el_input, {
3316
- modelValue: _ctx.model[_ctx.name],
3317
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
3318
- type: "textarea",
3319
- size: _ctx.size,
3320
- clearable: "",
3321
- placeholder: _ctx.config.placeholder,
3322
- disabled: _ctx.disabled,
3323
- onChange: _ctx.changeHandler,
3324
- onInput: _ctx.inputHandler
3325
- }, null, 8, ["modelValue", "size", "placeholder", "disabled", "onChange", "onInput"])
3326
- ])) : vue.createCommentVNode("", true);
3400
+ return vue.openBlock(), vue.createBlock(_component_el_input, {
3401
+ modelValue: _ctx.model[_ctx.name],
3402
+ "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
3403
+ type: "textarea",
3404
+ size: _ctx.size,
3405
+ clearable: "",
3406
+ placeholder: _ctx.config.placeholder,
3407
+ disabled: _ctx.disabled,
3408
+ onChange: _ctx.changeHandler,
3409
+ onInput: _ctx.inputHandler
3410
+ }, null, 8, ["modelValue", "size", "placeholder", "disabled", "onChange", "onInput"]);
3327
3411
  }
3328
3412
  var Textarea = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
3329
3413
 
@@ -3471,7 +3555,7 @@
3471
3555
  submitForm: async (native) => {
3472
3556
  try {
3473
3557
  await elForm.value?.validate();
3474
- return native ? values.value : lodashEs.cloneDeep(values.value);
3558
+ return native ? values.value : lodashEs.cloneDeep(vue.toRaw(values.value));
3475
3559
  } catch (invalidFields) {
3476
3560
  const error = [];
3477
3561
  Object.entries(invalidFields).forEach(([, ValidateError]) => {
@@ -3723,7 +3807,7 @@
3723
3807
  }
3724
3808
  var FormDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
3725
3809
 
3726
- var index$1 = '';
3810
+ var index$1 = /* #__PURE__ */ (() => ".m-form-dialog .el-dialog__body {\n padding: 0 !important;\n}\n.m-form-dialog .m-dialog-body {\n padding: 0 20px;\n}\n.m-form-dialog .el-table .m-form-item .el-form-item {\n margin-bottom: 0;\n}\n\n.fade-enter-active,\n.fade-leave-active {\n transition: opacity 0.5s;\n}\n\n.fade-enter, .fade-leave-to {\n opacity: 0;\n}\n\n.m-form .m-form-tip {\n color: rgba(0, 0, 0, 0.45);\n font-size: 12px;\n transition: color 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);\n}\n.m-form .m-form-schematic {\n max-width: 50%;\n height: 100%;\n}\n.m-form .el-table .cell > div.m-form-container {\n display: block;\n}\n.m-form .el-tabs {\n margin-bottom: 10px;\n}\n.m-form .el-form-item.hidden .el-form-item__label {\n display: none;\n}\n\n.magic-datetime-picker-popper .el-picker-panel__footer button:first-child {\n display: none;\n}\n\ndiv.m-fields-link {\n width: fit-content;\n}\n\nfieldset.m-fieldset {\n position: relative;\n border: 1px solid rgb(229, 229, 229);\n margin-top: 10px;\n margin-bottom: 10px;\n min-inline-size: auto;\n}\nfieldset.m-fieldset legend {\n font-size: 14px;\n position: absolute;\n border: 0;\n top: -10px;\n left: 20px;\n background: rgb(255, 255, 255);\n width: auto;\n padding: 0px 3px;\n font-weight: bold;\n line-height: 20px;\n}\nfieldset.m-fieldset .m-form-tip {\n margin-left: 5px;\n}\n\n.m-fields-group-list .el-button--text {\n padding: 0;\n margin-bottom: 7px;\n}\n.m-fields-group-list .el-tree-node__expand-icon {\n padding: 0;\n margin-bottom: 7px;\n}\n.m-fields-group-list .el-tree-node__expand-icon.expand {\n transform: rotate(90deg);\n}\n.m-fields-group-list .m-fields-group-list-item {\n border-bottom: 1px solid #ebeef5;\n margin-bottom: 7px;\n}\n.m-fields-group-list .m-fields-group-list-item:last-of-type {\n border-bottom: 0;\n}\n\n.m-form-panel .el-card__header:hover {\n background: #f2f6fc;\n}\n.m-form-panel .el-card__header a {\n color: #409eff;\n}\n.m-form-panel .el-card__body {\n padding: 10px;\n}\n.m-form-panel .m-form-tip {\n margin-left: 5px;\n}\n\n.m-fields-table {\n width: 100%;\n}\n.m-fields-table.fixed {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n z-index: 100;\n}\n.m-fields-table.fixed::before {\n content: \" \";\n display: block;\n background: rgba(0, 0, 0, 0.5);\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n z-index: 100;\n}\n.m-fields-table.fixed > .el-form-item__content {\n z-index: 101;\n position: relative;\n margin: 10vh auto;\n max-width: fit-content;\n}\n.m-fields-table.fixed table {\n width: 95vw !important;\n}\n.m-fields-table th {\n background-color: #f2f2f2 !important;\n color: #333 !important;\n}\n.m-fields-table .el-table th {\n padding: 0 !important;\n}\n.m-fields-table .el-table__column--dropable {\n cursor: move;\n}\n.m-fields-table .el-form-item__content .el-input-group {\n vertical-align: middle;\n}\n.m-fields-table.m-fields-table-item-extra tr.expanded td {\n border-bottom: 0;\n}\n.m-fields-table .el-table__expanded-cell .m-form-tip {\n margin-left: 80px;\n}\n.m-fields-table .el-form-item {\n margin-bottom: 0;\n}\n\n.m-select {\n width: 100%;\n}")();
3727
3811
 
3728
3812
  const defaultInstallOpt = {};
3729
3813
  const install = (app, opt) => {
@@ -3798,8 +3882,7 @@
3798
3882
  exports.initValue = initValue;
3799
3883
  exports.useAddField = useAddField;
3800
3884
 
3801
- Object.defineProperty(exports, '__esModule', { value: true });
3802
- exports[Symbol.toStringTag] = 'Module';
3885
+ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
3803
3886
 
3804
3887
  }));
3805
3888
  //# sourceMappingURL=tmagic-form.umd.js.map