@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.
- package/README.md +1 -0
- package/dist/style.css +9 -11
- package/dist/tmagic-form.es.js +225 -141
- package/dist/tmagic-form.es.js.map +1 -1
- package/dist/tmagic-form.umd.js +228 -145
- package/dist/tmagic-form.umd.js.map +1 -1
- package/dist/types/src/containers/Col.vue.d.ts +42 -0
- package/dist/types/src/containers/Container.vue.d.ts +1 -0
- package/dist/types/src/containers/Row.vue.d.ts +0 -1
- package/dist/types/src/fields/Checkbox.vue.d.ts +2 -2
- package/dist/types/src/fields/DynamicField.vue.d.ts +2 -2
- package/dist/types/src/index.d.ts +1 -1
- package/dist/types/src/schema.d.ts +9 -0
- package/package.json +18 -9
- package/src/Form.vue +2 -2
- package/src/FormDialog.vue +1 -1
- package/src/containers/Col.vue +56 -0
- package/src/containers/Container.vue +33 -8
- package/src/containers/GroupListItem.vue +4 -4
- package/src/containers/Row.vue +13 -17
- package/src/containers/Table.vue +15 -7
- package/src/containers/Tabs.vue +13 -5
- package/src/fields/Checkbox.vue +2 -2
- package/src/fields/Daterange.vue +8 -0
- package/src/fields/Link.vue +1 -1
- package/src/fields/Select.vue +9 -15
- package/src/fields/Text.vue +4 -4
- package/src/fields/Textarea.vue +11 -13
- package/src/schema.ts +9 -0
- package/src/theme/form.scss +24 -17
- package/src/utils/form.ts +7 -1
- package/LICENSE +0 -5432
- package/tsconfig.json +0 -9
- package/vite.config.ts +0 -27
package/dist/tmagic-form.umd.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['exports', 'vue', '
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.TMagicForm = {}, global.
|
|
5
|
-
})(this, (function (exports, vue,
|
|
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
|
-
|
|
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$
|
|
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(() =>
|
|
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$
|
|
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 =
|
|
308
|
-
const _hoisted_5$4 =
|
|
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$
|
|
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.
|
|
363
|
+
"label-width": _ctx.itemLabelWidth,
|
|
341
364
|
onChange: _ctx.onChangeHandler
|
|
342
|
-
}, null,
|
|
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.
|
|
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$
|
|
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,
|
|
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,
|
|
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: "
|
|
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,
|
|
421
|
+
}, null, 8, _hoisted_4$6)
|
|
399
422
|
]),
|
|
400
423
|
default: vue.withCtx(() => [
|
|
401
|
-
|
|
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.
|
|
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",
|
|
448
|
+
_ctx.config.expand && _ctx.type !== "fieldset" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$4, [
|
|
421
449
|
vue.createVNode(_component_el_button, {
|
|
422
|
-
|
|
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$
|
|
461
|
+
var Container = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$q]]);
|
|
434
462
|
|
|
435
|
-
const _sfc_main$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
621
|
+
var Fieldset = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$p]]);
|
|
594
622
|
|
|
595
|
-
const _sfc_main$
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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$
|
|
802
|
+
var MFieldsGroupListItem = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$o]]);
|
|
775
803
|
|
|
776
|
-
const _sfc_main$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
955
|
+
var GroupList = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$n]]);
|
|
928
956
|
|
|
929
|
-
const _sfc_main$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
|
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(
|
|
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
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
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$
|
|
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$
|
|
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
|
-
|
|
1626
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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, {
|
|
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, {
|
|
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$
|
|
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$
|
|
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
|
|
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
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
-
|
|
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$
|
|
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:
|
|
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:
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
-
|
|
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
|
|
3315
|
-
|
|
3316
|
-
|
|
3317
|
-
|
|
3318
|
-
|
|
3319
|
-
|
|
3320
|
-
|
|
3321
|
-
|
|
3322
|
-
|
|
3323
|
-
|
|
3324
|
-
|
|
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.
|
|
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
|