@tmagic/form 1.2.0-beta.2 → 1.2.0-beta.21

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.
Files changed (83) hide show
  1. package/dist/style.css +1 -1
  2. package/dist/tmagic-form.js +3673 -0
  3. package/dist/tmagic-form.js.map +1 -0
  4. package/dist/tmagic-form.umd.cjs +3713 -0
  5. package/dist/tmagic-form.umd.cjs.map +1 -0
  6. package/package.json +10 -9
  7. package/src/Form.vue +124 -159
  8. package/src/FormDialog.vue +108 -126
  9. package/src/containers/Col.vue +24 -38
  10. package/src/containers/Container.vue +143 -171
  11. package/src/containers/Fieldset.vue +15 -8
  12. package/src/containers/GroupList.vue +86 -116
  13. package/src/containers/GroupListItem.vue +91 -125
  14. package/src/containers/Panel.vue +29 -49
  15. package/src/containers/Row.vue +20 -40
  16. package/src/containers/Step.vue +38 -48
  17. package/src/containers/Table.vue +466 -481
  18. package/src/containers/Tabs.vue +94 -118
  19. package/src/fields/Cascader.vue +88 -136
  20. package/src/fields/Checkbox.vue +46 -50
  21. package/src/fields/CheckboxGroup.vue +39 -35
  22. package/src/fields/ColorPicker.vue +5 -3
  23. package/src/fields/Date.vue +21 -27
  24. package/src/fields/DateTime.vue +31 -39
  25. package/src/fields/Daterange.vue +4 -3
  26. package/src/fields/Display.vue +1 -1
  27. package/src/fields/DynamicField.vue +63 -77
  28. package/src/fields/Hidden.vue +1 -1
  29. package/src/fields/Link.vue +65 -86
  30. package/src/fields/Number.vue +32 -34
  31. package/src/fields/RadioGroup.vue +23 -23
  32. package/src/fields/Select.vue +294 -310
  33. package/src/fields/SelectOptionGroups.vue +11 -6
  34. package/src/fields/SelectOptions.vue +5 -3
  35. package/src/fields/Switch.vue +46 -49
  36. package/src/fields/Text.vue +99 -107
  37. package/src/fields/Textarea.vue +32 -44
  38. package/src/fields/Time.vue +21 -30
  39. package/src/index.ts +22 -23
  40. package/src/schema.ts +50 -12
  41. package/src/theme/form.scss +1 -1
  42. package/src/utils/form.ts +9 -5
  43. package/types/Form.vue.d.ts +211 -111
  44. package/types/FormDialog.vue.d.ts +813 -154
  45. package/types/containers/Col.vue.d.ts +96 -40
  46. package/types/containers/Container.vue.d.ts +126 -65
  47. package/types/containers/Fieldset.vue.d.ts +5 -3
  48. package/types/containers/GroupList.vue.d.ts +90 -53
  49. package/types/containers/GroupListItem.vue.d.ts +101 -67
  50. package/types/containers/Panel.vue.d.ts +96 -39
  51. package/types/containers/Row.vue.d.ts +96 -39
  52. package/types/containers/Step.vue.d.ts +106 -42
  53. package/types/containers/Table.vue.d.ts +161 -130
  54. package/types/containers/Tabs.vue.d.ts +97 -50
  55. package/types/fields/Cascader.vue.d.ts +95 -71
  56. package/types/fields/Checkbox.vue.d.ts +95 -56
  57. package/types/fields/CheckboxGroup.vue.d.ts +95 -53
  58. package/types/fields/ColorPicker.vue.d.ts +1 -3
  59. package/types/fields/Date.vue.d.ts +95 -54
  60. package/types/fields/DateTime.vue.d.ts +95 -54
  61. package/types/fields/Daterange.vue.d.ts +1 -3
  62. package/types/fields/Display.vue.d.ts +1 -3
  63. package/types/fields/DynamicField.vue.d.ts +95 -64
  64. package/types/fields/Hidden.vue.d.ts +1 -3
  65. package/types/fields/Link.vue.d.ts +60 -657
  66. package/types/fields/Number.vue.d.ts +99 -56
  67. package/types/fields/RadioGroup.vue.d.ts +96 -52
  68. package/types/fields/Select.vue.d.ts +97 -65
  69. package/types/fields/SelectOptionGroups.vue.d.ts +1 -3
  70. package/types/fields/SelectOptions.vue.d.ts +1 -3
  71. package/types/fields/Switch.vue.d.ts +95 -56
  72. package/types/fields/Text.vue.d.ts +98 -57
  73. package/types/fields/Textarea.vue.d.ts +100 -60
  74. package/types/fields/Time.vue.d.ts +95 -55
  75. package/types/index.d.ts +0 -1
  76. package/types/schema.d.ts +42 -9
  77. package/types/utils/form.d.ts +2 -1
  78. package/dist/tmagic-form.mjs +0 -3925
  79. package/dist/tmagic-form.mjs.map +0 -1
  80. package/dist/tmagic-form.umd.js +0 -3965
  81. package/dist/tmagic-form.umd.js.map +0 -1
  82. package/src/utils/fieldProps.ts +0 -39
  83. package/types/utils/fieldProps.d.ts +0 -21
@@ -1,3965 +0,0 @@
1
- (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('@element-plus/icons-vue'), require('lodash-es'), require('element-plus'), require('sortablejs'), require('@tmagic/utils')) :
3
- typeof define === 'function' && define.amd ? define(['exports', 'vue', '@element-plus/icons-vue', 'lodash-es', 'element-plus', 'sortablejs', '@tmagic/utils'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.TMagicForm = {}, global.Vue, global.iconsVue, global.lodashEs, global.ElementPlus, global.Sortable, global.utils));
5
- })(this, (function (exports, vue, iconsVue, lodashEs, elementPlus, Sortable, utils) { 'use strict';
6
-
7
- const _interopDefaultLegacy = e => e && typeof e === 'object' && 'default' in e ? e : { default: e };
8
-
9
- const Sortable__default = /*#__PURE__*/_interopDefaultLegacy(Sortable);
10
-
11
- const isTableSelect = (type) => typeof type === "string" && ["table-select", "tableSelect"].includes(type);
12
- const asyncLoadConfig = (value, initValue2, { asyncLoad, name, type }) => {
13
- if (type === "html" && typeof asyncLoad === "object" && typeof name !== "undefined") {
14
- asyncLoad.name = name;
15
- value.asyncLoad = typeof initValue2.asyncLoad === "object" ? initValue2.asyncLoad : asyncLoad;
16
- }
17
- };
18
- const isMultipleValue = (type) => typeof type === "string" && ["checkbox-group", "checkboxGroup", "table", "cascader", "group-list", "groupList"].includes(type);
19
- const initItemsValue = (mForm, value, initValue2, { items, name, extensible }) => {
20
- if (Array.isArray(initValue2[name])) {
21
- value[name] = initValue2[name].map((v, index) => init(mForm, items, v, value[name]?.[index]));
22
- } else {
23
- value[name] = init(mForm, items, initValue2[name], value[name]);
24
- if (extensible) {
25
- value[name] = Object.assign({}, initValue2[name], value[name]);
26
- }
27
- }
28
- };
29
- const setValue = (mForm, value, initValue2, item) => {
30
- const { items, name, type, checkbox } = item;
31
- if (isMultipleValue(type) || type === "tab" && item.dynamic) {
32
- value[name] = initValue2[name] || [];
33
- }
34
- if (items) {
35
- initItemsValue(mForm, value, initValue2, item);
36
- } else {
37
- value[name] = getDefaultValue(mForm, item);
38
- }
39
- if (type === "fieldset" && checkbox) {
40
- if (typeof value[name] === "object") {
41
- value[name].value = typeof initValue2[name] === "object" ? initValue2[name].value || 0 : 0;
42
- }
43
- }
44
- };
45
- const initValueItem = function(mForm, item, initValue2, value) {
46
- const { items } = item;
47
- const { names } = item;
48
- const { type, name } = item;
49
- if (isTableSelect(type) && name) {
50
- value[name] = initValue2[name] || "";
51
- return value;
52
- }
53
- asyncLoadConfig(value, initValue2, item);
54
- if (name && !items && typeof initValue2[name] !== "undefined") {
55
- if (typeof value[name] === "undefined") {
56
- if (type === "number") {
57
- value[name] = Number(initValue2[name]);
58
- } else {
59
- value[name] = typeof initValue2[name] === "object" ? lodashEs.cloneDeep(initValue2[name]) : initValue2[name];
60
- }
61
- }
62
- return value;
63
- }
64
- if (names) {
65
- return names.forEach((n) => value[n] = initValue2[n] || "");
66
- }
67
- if (!name) {
68
- return init(mForm, items, initValue2, value);
69
- }
70
- setValue(mForm, value, initValue2, item);
71
- return value;
72
- };
73
- const init = function(mForm, config = [], initValue2 = {}, value = {}) {
74
- if (Array.isArray(config)) {
75
- config.forEach((item) => {
76
- initValueItem(mForm, item, initValue2, value);
77
- });
78
- }
79
- return value;
80
- };
81
- const getDefaultValue = function(mForm, { defaultValue, type, filter, multiple }) {
82
- if (typeof defaultValue === "function") {
83
- return defaultValue(mForm);
84
- }
85
- if (defaultValue === "undefined") {
86
- return void 0;
87
- }
88
- if (typeof defaultValue !== "undefined") {
89
- return defaultValue;
90
- }
91
- if (type === "number" || filter === "number") {
92
- return 0;
93
- }
94
- if (["switch", "checkbox"].includes(type)) {
95
- return false;
96
- }
97
- if (multiple) {
98
- return [];
99
- }
100
- return "";
101
- };
102
- const filterFunction = (mForm, config, props) => {
103
- if (typeof config !== "function") {
104
- return config;
105
- }
106
- return config(mForm, {
107
- values: mForm?.initValues || {},
108
- model: props.model,
109
- parent: mForm?.parentValues || {},
110
- formValue: mForm?.values || props.model,
111
- prop: props.prop,
112
- config: props.config
113
- });
114
- };
115
- const display = function(mForm, config, props) {
116
- if (typeof config === "function") {
117
- return filterFunction(mForm, config, props);
118
- }
119
- if (config === false) {
120
- return false;
121
- }
122
- return true;
123
- };
124
- const getRules = function(mForm, rules = [], props) {
125
- rules = lodashEs.cloneDeep(rules);
126
- if (typeof rules === "object" && !Array.isArray(rules)) {
127
- rules = [rules];
128
- }
129
- return rules.map((item) => {
130
- if (typeof item.validator === "function") {
131
- const fnc = item.validator;
132
- item.validator = (rule, value, callback, source, options) => fnc(
133
- {
134
- rule,
135
- value: props.config.names ? props.model : value,
136
- callback,
137
- source,
138
- options
139
- },
140
- {
141
- values: mForm?.initValues || {},
142
- model: props.model,
143
- parent: mForm?.parentValues || {},
144
- formValue: mForm?.values || props.model,
145
- prop: props.prop,
146
- config: props.config
147
- },
148
- mForm
149
- );
150
- }
151
- return item;
152
- });
153
- };
154
- const initValue = async (mForm, { initValues, config }) => {
155
- if (!Array.isArray(config))
156
- throw new Error("config\u5E94\u8BE5\u4E3A\u6570\u7EC4");
157
- let valuesTmp = init(mForm, config, vue.toRaw(initValues), {});
158
- const [firstForm] = config;
159
- if (firstForm && typeof firstForm.onInitValue === "function") {
160
- valuesTmp = await firstForm.onInitValue(mForm, {
161
- formValue: valuesTmp,
162
- initValue: initValues
163
- });
164
- }
165
- return valuesTmp || {};
166
- };
167
-
168
- const _sfc_main$u = vue.defineComponent({
169
- name: "m-form-container",
170
- components: { WarningFilled: iconsVue.WarningFilled },
171
- props: {
172
- labelWidth: String,
173
- expandMore: Boolean,
174
- model: {
175
- type: [Object, Array],
176
- required: true
177
- },
178
- config: {
179
- type: Object,
180
- required: true
181
- },
182
- prop: {
183
- type: String,
184
- default: () => ""
185
- },
186
- stepActive: {
187
- type: [String, Number]
188
- },
189
- size: {
190
- type: String,
191
- default: "small"
192
- }
193
- },
194
- emits: ["change"],
195
- setup(props, { emit }) {
196
- const mForm = vue.inject("mForm");
197
- const expand = vue.ref(false);
198
- const name = vue.computed(() => props.config.name || "");
199
- const items = vue.computed(() => props.config.items);
200
- const itemProp = vue.computed(() => {
201
- let n = "";
202
- const { names } = props.config;
203
- if (names?.[0]) {
204
- [n] = names;
205
- } else if (name.value) {
206
- n = name.value;
207
- } else {
208
- return props.prop;
209
- }
210
- return `${props.prop}${props.prop ? "." : ""}${n}`;
211
- });
212
- const tagName = vue.computed(() => {
213
- const component = vue.resolveComponent(`m-${items.value ? "form" : "fields"}-${type.value}`);
214
- if (typeof component !== "string")
215
- return component;
216
- return "m-fields-text";
217
- });
218
- const disabled = vue.computed(() => filterFunction(mForm, props.config.disabled, props));
219
- const tooltip = vue.computed(() => filterFunction(mForm, props.config.tooltip, props));
220
- const extra = vue.computed(() => filterFunction(mForm, props.config.extra, props));
221
- const rule = vue.computed(() => getRules(mForm, props.config.rules, props));
222
- const type = vue.computed(() => {
223
- let { type: type2 } = props.config;
224
- if (typeof type2 === "function") {
225
- type2 = type2(mForm, {
226
- model: props.model
227
- });
228
- }
229
- if (type2 === "form")
230
- return "";
231
- return type2?.replace(/([A-Z])/g, "-$1").toLowerCase() || (items.value ? "" : "text");
232
- });
233
- const display$1 = vue.computed(() => {
234
- if (props.config.display === "expand") {
235
- return expand.value;
236
- }
237
- return display(mForm, props.config.display, props);
238
- });
239
- const itemLabelWidth = vue.computed(() => props.config.labelWidth || props.labelWidth);
240
- vue.watchEffect(() => {
241
- expand.value = props.expandMore;
242
- });
243
- const expandHandler = () => expand.value = !expand.value;
244
- const key = (config) => config[mForm?.keyProps];
245
- const filterHandler = (filter, value) => {
246
- if (typeof filter === "function") {
247
- return filter(mForm, value, {
248
- model: props.model,
249
- values: mForm?.initValues,
250
- formValue: mForm?.values,
251
- prop: itemProp.value,
252
- config: props.config
253
- });
254
- }
255
- if (filter === "number") {
256
- return +value;
257
- }
258
- return value;
259
- };
260
- const changeHandler = (onChange, value) => {
261
- if (typeof onChange === "function") {
262
- return onChange(mForm, value, {
263
- model: props.model,
264
- values: mForm?.initValues,
265
- formValue: mForm?.values,
266
- prop: itemProp.value,
267
- config: props.config
268
- });
269
- }
270
- };
271
- const trimHandler = (trim, value) => {
272
- if (typeof value === "string" && trim) {
273
- return value.replace(/^\s*/, "").replace(/\s*$/, "");
274
- }
275
- };
276
- const onChangeHandler = async function(v, key2) {
277
- const { filter, onChange, trim, name: name2, dynamicKey } = props.config;
278
- let value = v;
279
- try {
280
- value = filterHandler(filter, v);
281
- value = await changeHandler(onChange, value) ?? value;
282
- value = trimHandler(trim, value) ?? value;
283
- } catch (e) {
284
- console.error(e);
285
- }
286
- if ((name2 || name2 === 0) && props.model !== value && (v !== value || props.model[name2] !== value)) {
287
- props.model[name2] = value;
288
- }
289
- if (key2 !== void 0 && dynamicKey) {
290
- props.model[key2] = value;
291
- }
292
- emit("change", props.model);
293
- };
294
- return {
295
- expand,
296
- name,
297
- type,
298
- disabled,
299
- itemProp,
300
- items,
301
- display: display$1,
302
- itemLabelWidth,
303
- tagName,
304
- rule,
305
- tooltip,
306
- extra,
307
- key,
308
- onChangeHandler,
309
- expandHandler
310
- };
311
- }
312
- });
313
-
314
- const _export_sfc = (sfc, props) => {
315
- const target = sfc.__vccOpts || sfc;
316
- for (const [key, val] of props) {
317
- target[key] = val;
318
- }
319
- return target;
320
- };
321
-
322
- const _hoisted_1$c = ["innerHTML"];
323
- const _hoisted_2$7 = ["innerHTML"];
324
- const _hoisted_3$7 = ["innerHTML"];
325
- const _hoisted_4$6 = ["innerHTML"];
326
- const _hoisted_5$4 = {
327
- key: 4,
328
- style: { "text-align": "center" }
329
- };
330
- function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
331
- const _component_m_fields_hidden = vue.resolveComponent("m-fields-hidden");
332
- const _component_el_tooltip = vue.resolveComponent("el-tooltip");
333
- const _component_el_form_item = vue.resolveComponent("el-form-item");
334
- const _component_warning_filled = vue.resolveComponent("warning-filled");
335
- const _component_el_icon = vue.resolveComponent("el-icon");
336
- const _component_m_form_container = vue.resolveComponent("m-form-container");
337
- const _component_el_button = vue.resolveComponent("el-button");
338
- return _ctx.config ? (vue.openBlock(), vue.createElementBlock("div", {
339
- key: 0,
340
- style: vue.normalizeStyle(_ctx.config.tip ? "display: flex;align-items: baseline;" : ""),
341
- class: vue.normalizeClass([_ctx.config.className, "m-form-container"])
342
- }, [
343
- _ctx.type === "hidden" ? (vue.openBlock(), vue.createBlock(_component_m_fields_hidden, {
344
- key: 0,
345
- model: _ctx.model,
346
- config: _ctx.config,
347
- name: _ctx.config.name,
348
- disabled: _ctx.disabled,
349
- prop: _ctx.itemProp
350
- }, null, 8, ["model", "config", "name", "disabled", "prop"])) : _ctx.items && !_ctx.config.text && _ctx.type && _ctx.display ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.tagName), {
351
- key: _ctx.key(_ctx.config),
352
- size: _ctx.size,
353
- model: _ctx.model,
354
- config: _ctx.config,
355
- name: _ctx.name,
356
- prop: _ctx.itemProp,
357
- "step-active": _ctx.stepActive,
358
- "expand-more": _ctx.expand,
359
- "label-width": _ctx.itemLabelWidth,
360
- onChange: _ctx.onChangeHandler
361
- }, 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 }, [
362
- vue.createVNode(_component_el_form_item, {
363
- style: vue.normalizeStyle(_ctx.config.tip ? "flex: 1" : ""),
364
- class: vue.normalizeClass({ hidden: `${_ctx.itemLabelWidth}` === "0" || !_ctx.config.text }),
365
- prop: _ctx.itemProp,
366
- "label-width": _ctx.itemLabelWidth,
367
- rules: _ctx.rule
368
- }, {
369
- label: vue.withCtx(() => [
370
- vue.createElementVNode("span", {
371
- innerHTML: _ctx.type === "checkbox" ? "" : _ctx.config.text
372
- }, null, 8, _hoisted_1$c)
373
- ]),
374
- default: vue.withCtx(() => [
375
- _ctx.tooltip ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, { key: 0 }, {
376
- content: vue.withCtx(() => [
377
- vue.createElementVNode("div", { innerHTML: _ctx.tooltip }, null, 8, _hoisted_2$7)
378
- ]),
379
- default: vue.withCtx(() => [
380
- (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.tagName), {
381
- key: _ctx.key(_ctx.config),
382
- size: _ctx.size,
383
- model: _ctx.model,
384
- config: _ctx.config,
385
- name: _ctx.name,
386
- disabled: _ctx.disabled,
387
- prop: _ctx.itemProp,
388
- onChange: _ctx.onChangeHandler
389
- }, null, 40, ["size", "model", "config", "name", "disabled", "prop", "onChange"]))
390
- ]),
391
- _: 1
392
- })) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.tagName), {
393
- key: _ctx.key(_ctx.config),
394
- size: _ctx.size,
395
- model: _ctx.model,
396
- config: _ctx.config,
397
- name: _ctx.name,
398
- disabled: _ctx.disabled,
399
- prop: _ctx.itemProp,
400
- onChange: _ctx.onChangeHandler
401
- }, null, 40, ["size", "model", "config", "name", "disabled", "prop", "onChange"])),
402
- _ctx.extra ? (vue.openBlock(), vue.createElementBlock("div", {
403
- key: 2,
404
- innerHTML: _ctx.extra,
405
- class: "m-form-tip"
406
- }, null, 8, _hoisted_3$7)) : vue.createCommentVNode("", true)
407
- ]),
408
- _: 1
409
- }, 8, ["style", "class", "prop", "label-width", "rules"]),
410
- _ctx.config.tip ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
411
- key: 0,
412
- placement: "left"
413
- }, {
414
- content: vue.withCtx(() => [
415
- vue.createElementVNode("div", {
416
- innerHTML: _ctx.config.tip
417
- }, null, 8, _hoisted_4$6)
418
- ]),
419
- default: vue.withCtx(() => [
420
- vue.createVNode(_component_el_icon, { style: { "line-height": "40px", "margin-left": "5px" } }, {
421
- default: vue.withCtx(() => [
422
- vue.createVNode(_component_warning_filled)
423
- ]),
424
- _: 1
425
- })
426
- ]),
427
- _: 1
428
- })) : vue.createCommentVNode("", true)
429
- ], 64)) : _ctx.items && _ctx.display ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 3 }, [
430
- (_ctx.name || _ctx.name === 0 ? _ctx.model[_ctx.name] : _ctx.model) ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.items, (item) => {
431
- return vue.openBlock(), vue.createBlock(_component_m_form_container, {
432
- key: _ctx.key(item),
433
- model: _ctx.name || _ctx.name === 0 ? _ctx.model[_ctx.name] : _ctx.model,
434
- config: item,
435
- size: _ctx.size,
436
- "step-active": _ctx.stepActive,
437
- "expand-more": _ctx.expand,
438
- "label-width": _ctx.itemLabelWidth,
439
- prop: _ctx.itemProp,
440
- onChange: _ctx.onChangeHandler
441
- }, null, 8, ["model", "config", "size", "step-active", "expand-more", "label-width", "prop", "onChange"]);
442
- }), 128)) : vue.createCommentVNode("", true)
443
- ], 64)) : vue.createCommentVNode("", true),
444
- _ctx.config.expand && _ctx.type !== "fieldset" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$4, [
445
- vue.createVNode(_component_el_button, {
446
- text: "",
447
- onClick: _ctx.expandHandler
448
- }, {
449
- default: vue.withCtx(() => [
450
- vue.createTextVNode(vue.toDisplayString(_ctx.expand ? "\u6536\u8D77\u914D\u7F6E" : "\u5C55\u5F00\u66F4\u591A\u914D\u7F6E"), 1)
451
- ]),
452
- _: 1
453
- }, 8, ["onClick"])
454
- ])) : vue.createCommentVNode("", true)
455
- ], 6)) : vue.createCommentVNode("", true);
456
- }
457
- const Container = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["render", _sfc_render$o]]);
458
-
459
- const _hoisted_1$b = ["innerHTML"];
460
- const _hoisted_2$6 = ["innerHTML"];
461
- const _hoisted_3$6 = { key: 1 };
462
- const _hoisted_4$5 = ["innerHTML"];
463
- const _hoisted_5$3 = ["innerHTML"];
464
- const _hoisted_6$2 = {
465
- key: 2,
466
- style: { "display": "flex" }
467
- };
468
- const _hoisted_7$2 = { style: { "flex": "1" } };
469
- const _hoisted_8$1 = ["src"];
470
- const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
471
- __name: "Fieldset",
472
- props: {
473
- labelWidth: null,
474
- prop: { default: "" },
475
- size: null,
476
- model: null,
477
- config: null,
478
- rules: { default: {} }
479
- },
480
- emits: ["change"],
481
- setup(__props, { emit }) {
482
- const props = __props;
483
- const mForm = vue.inject("mForm");
484
- const name = vue.computed(() => props.config.name || "");
485
- const show = vue.computed(() => {
486
- if (props.config.expand && name.value) {
487
- return props.model[name.value]?.value;
488
- }
489
- return true;
490
- });
491
- const lWidth = vue.computed(() => {
492
- if (props.config.items) {
493
- return props.config.labelWidth || props.labelWidth;
494
- }
495
- return props.config.labelWidth || props.labelWidth || (props.config.text ? null : "0");
496
- });
497
- const change = () => {
498
- emit("change", props.model);
499
- };
500
- const key = (item, index) => item[mForm?.keyProp || "__key"] ?? index;
501
- if (props.config.checkbox && name.value) {
502
- vue.watch(
503
- () => props.model[name.value]?.value,
504
- () => {
505
- emit("change", props.model);
506
- }
507
- );
508
- }
509
- return (_ctx, _cache) => {
510
- const _component_el_checkbox = vue.resolveComponent("el-checkbox");
511
- const _component_m_form_container = vue.resolveComponent("m-form-container");
512
- return (vue.unref(name) ? __props.model[vue.unref(name)] : __props.model) ? (vue.openBlock(), vue.createElementBlock("fieldset", {
513
- key: 0,
514
- class: "m-fieldset",
515
- style: vue.normalizeStyle(vue.unref(show) ? "padding: 15px 15px 0 5px;" : "border: 0")
516
- }, [
517
- vue.unref(name) && __props.config.checkbox ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(!vue.unref(show) ? "div" : "legend"), { key: 0 }, {
518
- default: vue.withCtx(() => [
519
- vue.createVNode(_component_el_checkbox, {
520
- modelValue: __props.model[vue.unref(name)].value,
521
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.model[vue.unref(name)].value = $event),
522
- prop: `${__props.prop}${__props.prop ? "." : ""}${__props.config.name}.value`,
523
- "true-label": 1,
524
- "false-label": 0
525
- }, {
526
- default: vue.withCtx(() => [
527
- vue.createElementVNode("span", {
528
- innerHTML: __props.config.legend
529
- }, null, 8, _hoisted_1$b),
530
- __props.config.extra ? (vue.openBlock(), vue.createElementBlock("span", {
531
- key: 0,
532
- innerHTML: __props.config.extra,
533
- class: "m-form-tip"
534
- }, null, 8, _hoisted_2$6)) : vue.createCommentVNode("", true)
535
- ]),
536
- _: 1
537
- }, 8, ["modelValue", "prop"])
538
- ]),
539
- _: 1
540
- })) : (vue.openBlock(), vue.createElementBlock("legend", _hoisted_3$6, [
541
- vue.createElementVNode("span", {
542
- innerHTML: __props.config.legend
543
- }, null, 8, _hoisted_4$5),
544
- __props.config.extra ? (vue.openBlock(), vue.createElementBlock("span", {
545
- key: 0,
546
- innerHTML: __props.config.extra,
547
- class: "m-form-tip"
548
- }, null, 8, _hoisted_5$3)) : vue.createCommentVNode("", true)
549
- ])),
550
- __props.config.schematic && vue.unref(show) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$2, [
551
- vue.createElementVNode("div", _hoisted_7$2, [
552
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.config.items, (item, index) => {
553
- return vue.openBlock(), vue.createBlock(_component_m_form_container, {
554
- key: key(item, index),
555
- model: vue.unref(name) ? __props.model[vue.unref(name)] : __props.model,
556
- rules: vue.unref(name) ? __props.rules[vue.unref(name)] : [],
557
- config: item,
558
- prop: __props.prop,
559
- labelWidth: vue.unref(lWidth),
560
- size: __props.size,
561
- onChange: change
562
- }, null, 8, ["model", "rules", "config", "prop", "labelWidth", "size"]);
563
- }), 128))
564
- ]),
565
- vue.createElementVNode("img", {
566
- class: "m-form-schematic",
567
- src: __props.config.schematic
568
- }, null, 8, _hoisted_8$1)
569
- ])) : vue.unref(show) ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 3 }, vue.renderList(__props.config.items, (item, index) => {
570
- return vue.openBlock(), vue.createBlock(_component_m_form_container, {
571
- key: key(item, index),
572
- model: vue.unref(name) ? __props.model[vue.unref(name)] : __props.model,
573
- rules: vue.unref(name) ? __props.rules[vue.unref(name)] : [],
574
- config: item,
575
- prop: __props.prop,
576
- labelWidth: vue.unref(lWidth),
577
- size: __props.size,
578
- onChange: change
579
- }, null, 8, ["model", "rules", "config", "prop", "labelWidth", "size"]);
580
- }), 128)) : vue.createCommentVNode("", true)
581
- ], 4)) : vue.createCommentVNode("", true);
582
- };
583
- }
584
- });
585
-
586
- const _sfc_main$s = vue.defineComponent({
587
- name: "m-form-group-list-item",
588
- components: { CaretBottom: iconsVue.CaretBottom, CaretRight: iconsVue.CaretRight, CaretTop: iconsVue.CaretTop },
589
- props: {
590
- labelWidth: String,
591
- model: {
592
- type: Object,
593
- default: () => ({})
594
- },
595
- config: {
596
- type: Object,
597
- default: () => ({})
598
- },
599
- prop: String,
600
- size: String,
601
- index: {
602
- type: [Number, String, Symbol],
603
- default: 0
604
- },
605
- groupModel: {
606
- type: Array,
607
- default: () => []
608
- }
609
- },
610
- emits: ["swap-item", "remove-item", "change"],
611
- setup(props, { emit }) {
612
- const mForm = vue.inject("mForm");
613
- const expand = vue.ref(false);
614
- vue.watchEffect(() => {
615
- expand.value = !props.index;
616
- });
617
- const rowConfig = vue.computed(() => ({
618
- type: "row",
619
- span: props.config.span || 24,
620
- items: props.config.items,
621
- labelWidth: props.config.labelWidth,
622
- [mForm?.keyProp || "__key"]: `${props.config[mForm?.keyProp || "__key"]}${String(props.index)}`
623
- }));
624
- const title = vue.computed(() => {
625
- if (props.config.titleKey && props.model[props.config.titleKey]) {
626
- return props.model[props.config.titleKey];
627
- }
628
- return `\u7EC4 ${String(props.index)}`;
629
- });
630
- const length = vue.computed(() => props.groupModel?.length || 0);
631
- const itemExtra = vue.computed(() => filterFunction(mForm, props.config.itemExtra, props));
632
- const removeHandler = () => emit("remove-item", props.index);
633
- const changeHandler = () => emit("change");
634
- const expandHandler = () => {
635
- expand.value = !expand.value;
636
- };
637
- const showDelete = (index) => {
638
- const deleteFunc = props.config.delete;
639
- if (deleteFunc && typeof deleteFunc === "function") {
640
- return deleteFunc(props.model, index, mForm?.values);
641
- }
642
- return true;
643
- };
644
- const changeOrder = (offset = 0) => emit("swap-item", props.index, `${String(props.index)}${offset}`);
645
- const movable = () => {
646
- const { movable: movable2 } = props.config;
647
- if (movable2 === void 0)
648
- return true;
649
- if (typeof movable2 === "function") {
650
- return movable2(mForm, props.index || 0, props.model, props.groupModel);
651
- }
652
- return movable2;
653
- };
654
- return {
655
- expand,
656
- expandHandler,
657
- title,
658
- showDelete,
659
- removeHandler,
660
- movable,
661
- changeOrder,
662
- itemExtra,
663
- rowConfig,
664
- changeHandler,
665
- length,
666
- Delete: iconsVue.Delete
667
- };
668
- }
669
- });
670
-
671
- const _hoisted_1$a = { class: "m-fields-group-list-item" };
672
- const _hoisted_2$5 = /* @__PURE__ */ vue.createTextVNode("\u4E0A\u79FB");
673
- const _hoisted_3$5 = /* @__PURE__ */ vue.createTextVNode("\u4E0B\u79FB");
674
- const _hoisted_4$4 = ["innerHTML"];
675
- function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
676
- const _component_CaretBottom = vue.resolveComponent("CaretBottom");
677
- const _component_CaretRight = vue.resolveComponent("CaretRight");
678
- const _component_el_icon = vue.resolveComponent("el-icon");
679
- const _component_el_button = vue.resolveComponent("el-button");
680
- const _component_CaretTop = vue.resolveComponent("CaretTop");
681
- const _component_m_form_container = vue.resolveComponent("m-form-container");
682
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
683
- vue.createElementVNode("div", null, [
684
- vue.createVNode(_component_el_icon, {
685
- style: { "margin-right": "7px" },
686
- onClick: _ctx.expandHandler
687
- }, {
688
- default: vue.withCtx(() => [
689
- _ctx.expand ? (vue.openBlock(), vue.createBlock(_component_CaretBottom, { key: 0 })) : (vue.openBlock(), vue.createBlock(_component_CaretRight, { key: 1 }))
690
- ]),
691
- _: 1
692
- }, 8, ["onClick"]),
693
- vue.createVNode(_component_el_button, {
694
- text: "",
695
- onClick: _ctx.expandHandler
696
- }, {
697
- default: vue.withCtx(() => [
698
- vue.createTextVNode(vue.toDisplayString(_ctx.title), 1)
699
- ]),
700
- _: 1
701
- }, 8, ["onClick"]),
702
- vue.withDirectives(vue.createVNode(_component_el_button, {
703
- text: "",
704
- icon: _ctx.Delete,
705
- style: { "color": "#f56c6c" },
706
- onClick: _ctx.removeHandler
707
- }, null, 8, ["icon", "onClick"]), [
708
- [vue.vShow, _ctx.showDelete(parseInt(String(_ctx.index)))]
709
- ]),
710
- _ctx.movable() ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
711
- vue.withDirectives(vue.createVNode(_component_el_button, {
712
- text: "",
713
- size: "small",
714
- onClick: _cache[0] || (_cache[0] = ($event) => _ctx.changeOrder(-1))
715
- }, {
716
- default: vue.withCtx(() => [
717
- _hoisted_2$5,
718
- vue.createVNode(_component_el_icon, null, {
719
- default: vue.withCtx(() => [
720
- vue.createVNode(_component_CaretTop)
721
- ]),
722
- _: 1
723
- })
724
- ]),
725
- _: 1
726
- }, 512), [
727
- [vue.vShow, _ctx.index !== 0]
728
- ]),
729
- vue.withDirectives(vue.createVNode(_component_el_button, {
730
- text: "",
731
- size: "small",
732
- onClick: _cache[1] || (_cache[1] = ($event) => _ctx.changeOrder(1))
733
- }, {
734
- default: vue.withCtx(() => [
735
- _hoisted_3$5,
736
- vue.createVNode(_component_el_icon, null, {
737
- default: vue.withCtx(() => [
738
- vue.createVNode(_component_CaretBottom)
739
- ]),
740
- _: 1
741
- })
742
- ]),
743
- _: 1
744
- }, 512), [
745
- [vue.vShow, _ctx.index !== _ctx.length - 1]
746
- ])
747
- ], 64)) : vue.createCommentVNode("", true),
748
- _ctx.itemExtra ? (vue.openBlock(), vue.createElementBlock("span", {
749
- key: 1,
750
- innerHTML: _ctx.itemExtra,
751
- class: "m-form-tip"
752
- }, null, 8, _hoisted_4$4)) : vue.createCommentVNode("", true)
753
- ]),
754
- _ctx.expand ? (vue.openBlock(), vue.createBlock(_component_m_form_container, {
755
- key: 0,
756
- config: _ctx.rowConfig,
757
- model: _ctx.model,
758
- labelWidth: _ctx.labelWidth,
759
- prop: `${_ctx.prop}${_ctx.prop ? "." : ""}${String(_ctx.index)}`,
760
- size: _ctx.size,
761
- onChange: _ctx.changeHandler
762
- }, null, 8, ["config", "model", "labelWidth", "prop", "size", "onChange"])) : vue.createCommentVNode("", true)
763
- ]);
764
- }
765
- const MFieldsGroupListItem = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$n]]);
766
-
767
- const _sfc_main$r = vue.defineComponent({
768
- name: "m-form-group-list",
769
- components: { MFieldsGroupListItem },
770
- props: {
771
- labelWidth: String,
772
- model: {
773
- type: Object,
774
- default: () => ({})
775
- },
776
- config: {
777
- type: Object,
778
- default: () => ({})
779
- },
780
- prop: {
781
- type: String,
782
- default: ""
783
- },
784
- size: String,
785
- name: {
786
- type: String,
787
- default: ""
788
- }
789
- },
790
- emits: ["change"],
791
- setup(props, { emit }) {
792
- const mForm = vue.inject("mForm");
793
- const addable = vue.computed(() => {
794
- if (!props.name)
795
- return false;
796
- if (typeof props.config.addable === "function") {
797
- return props.config.addable(mForm, {
798
- model: props.model[props.name],
799
- formValue: mForm?.values,
800
- prop: props.prop,
801
- config: props.config
802
- });
803
- }
804
- return typeof props.config.addable === "undefined" ? true : props.config.addable;
805
- });
806
- const changeHandler = () => {
807
- if (!props.name)
808
- return false;
809
- emit("change", props.model[props.name]);
810
- };
811
- const addHandler = async () => {
812
- if (!props.name)
813
- return false;
814
- let initValues = {};
815
- if (typeof props.config.defaultAdd === "function") {
816
- initValues = await props.config.defaultAdd(mForm, {
817
- model: props.model[props.name],
818
- formValue: mForm?.values,
819
- prop: props.prop,
820
- config: props.config
821
- });
822
- } else if (props.config.defaultAdd) {
823
- initValues = props.config.defaultAdd;
824
- }
825
- const groupValue = await initValue(mForm, {
826
- config: props.config.items,
827
- initValues
828
- });
829
- props.model[props.name].push(groupValue);
830
- };
831
- const removeHandler = (index) => {
832
- if (!props.name)
833
- return false;
834
- props.model[props.name].splice(index, 1);
835
- changeHandler();
836
- };
837
- const swapHandler = (idx1, idx2) => {
838
- if (!props.name)
839
- return false;
840
- const [currRow] = props.model[props.name].splice(idx1, 1);
841
- props.model[props.name].splice(idx2, 0, currRow);
842
- changeHandler();
843
- };
844
- const toggleMode = () => {
845
- props.config.type = "table";
846
- props.config.groupItems = props.config.items;
847
- props.config.items = props.config.tableItems || props.config.items.map((item) => ({
848
- ...item,
849
- label: item.label || item.text,
850
- text: null
851
- }));
852
- };
853
- return {
854
- Grid: iconsVue.Grid,
855
- addable,
856
- toggleMode,
857
- removeHandler,
858
- swapHandler,
859
- changeHandler,
860
- addHandler
861
- };
862
- }
863
- });
864
-
865
- const _hoisted_1$9 = { class: "m-fields-group-list" };
866
- const _hoisted_2$4 = ["innerHTML"];
867
- const _hoisted_3$4 = {
868
- key: 1,
869
- class: "el-table__empty-block"
870
- };
871
- const _hoisted_4$3 = /* @__PURE__ */ vue.createElementVNode("span", { class: "el-table__empty-text" }, "\u6682\u65E0\u6570\u636E", -1);
872
- const _hoisted_5$2 = [
873
- _hoisted_4$3
874
- ];
875
- const _hoisted_6$1 = /* @__PURE__ */ vue.createTextVNode("\u6DFB\u52A0\u7EC4");
876
- const _hoisted_7$1 = /* @__PURE__ */ vue.createTextVNode("\u5207\u6362\u4E3A\u8868\u683C");
877
- function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
878
- const _component_m_fields_group_list_item = vue.resolveComponent("m-fields-group-list-item");
879
- const _component_el_button = vue.resolveComponent("el-button");
880
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
881
- _ctx.config.extra ? (vue.openBlock(), vue.createElementBlock("div", {
882
- key: 0,
883
- innerHTML: _ctx.config.extra,
884
- style: { "color": "rgba(0, 0, 0, 0.45)" }
885
- }, null, 8, _hoisted_2$4)) : vue.createCommentVNode("", true),
886
- !_ctx.model[_ctx.name] || !_ctx.model[_ctx.name].length ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$4, _hoisted_5$2)) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 2 }, vue.renderList(_ctx.model[_ctx.name], (item, index) => {
887
- return vue.openBlock(), vue.createBlock(_component_m_fields_group_list_item, {
888
- key: index,
889
- model: item,
890
- config: _ctx.config,
891
- prop: _ctx.prop,
892
- index,
893
- "label-width": _ctx.labelWidth,
894
- size: _ctx.size,
895
- "group-model": _ctx.model[_ctx.name],
896
- onRemoveItem: _ctx.removeHandler,
897
- onSwapItem: _ctx.swapHandler,
898
- onChange: _ctx.changeHandler
899
- }, null, 8, ["model", "config", "prop", "index", "label-width", "size", "group-model", "onRemoveItem", "onSwapItem", "onChange"]);
900
- }), 128)),
901
- _ctx.addable ? (vue.openBlock(), vue.createBlock(_component_el_button, {
902
- key: 3,
903
- onClick: _ctx.addHandler,
904
- size: "small"
905
- }, {
906
- default: vue.withCtx(() => [
907
- _hoisted_6$1
908
- ]),
909
- _: 1
910
- }, 8, ["onClick"])) : vue.createCommentVNode("", true),
911
- _ctx.config.enableToggleMode ? (vue.openBlock(), vue.createBlock(_component_el_button, {
912
- key: 4,
913
- icon: _ctx.Grid,
914
- size: "small",
915
- onClick: _ctx.toggleMode
916
- }, {
917
- default: vue.withCtx(() => [
918
- _hoisted_7$1
919
- ]),
920
- _: 1
921
- }, 8, ["icon", "onClick"])) : vue.createCommentVNode("", true)
922
- ]);
923
- }
924
- const GroupList = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$m]]);
925
-
926
- const _sfc_main$q = vue.defineComponent({
927
- name: "m-form-panel",
928
- components: { CaretBottom: iconsVue.CaretBottom, CaretRight: iconsVue.CaretRight },
929
- props: {
930
- labelWidth: String,
931
- model: {
932
- type: Object,
933
- default: () => ({})
934
- },
935
- config: {
936
- type: Object,
937
- default: () => ({})
938
- },
939
- prop: String,
940
- size: String,
941
- name: String
942
- },
943
- emits: ["change"],
944
- setup(props, { emit }) {
945
- const mForm = vue.inject("mForm");
946
- const expand = vue.ref(props.config.expand !== false);
947
- const items = vue.computed(() => props.config.items);
948
- const filter = (config) => filterFunction(mForm, config, props);
949
- const changeHandler = () => emit("change", props.model);
950
- return {
951
- mForm,
952
- expand,
953
- items,
954
- filter,
955
- changeHandler
956
- };
957
- }
958
- });
959
-
960
- const _hoisted_1$8 = { class: "clearfix" };
961
- const _hoisted_2$3 = ["innerHTML"];
962
- const _hoisted_3$3 = {
963
- key: 0,
964
- style: { "display": "flex" }
965
- };
966
- const _hoisted_4$2 = { style: { "flex": "1" } };
967
- const _hoisted_5$1 = ["src"];
968
- function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
969
- const _component_caret_bottom = vue.resolveComponent("caret-bottom");
970
- const _component_caret_right = vue.resolveComponent("caret-right");
971
- const _component_el_icon = vue.resolveComponent("el-icon");
972
- const _component_m_form_container = vue.resolveComponent("m-form-container");
973
- const _component_el_card = vue.resolveComponent("el-card");
974
- return _ctx.items && _ctx.items.length ? (vue.openBlock(), vue.createBlock(_component_el_card, {
975
- key: 0,
976
- class: "box-card m-form-panel",
977
- "body-style": { display: _ctx.expand ? "block" : "none" }
978
- }, {
979
- header: vue.withCtx(() => [
980
- vue.createElementVNode("div", _hoisted_1$8, [
981
- vue.createElementVNode("a", {
982
- href: "javascript:",
983
- style: { "width": "100%", "display": "block" },
984
- onClick: _cache[0] || (_cache[0] = ($event) => _ctx.expand = !_ctx.expand)
985
- }, [
986
- vue.createVNode(_component_el_icon, null, {
987
- default: vue.withCtx(() => [
988
- _ctx.expand ? (vue.openBlock(), vue.createBlock(_component_caret_bottom, { key: 0 })) : (vue.openBlock(), vue.createBlock(_component_caret_right, { key: 1 }))
989
- ]),
990
- _: 1
991
- }),
992
- vue.createTextVNode(" " + vue.toDisplayString(_ctx.filter(_ctx.config.title)) + " ", 1),
993
- _ctx.config && _ctx.config.extra ? (vue.openBlock(), vue.createElementBlock("span", {
994
- key: 0,
995
- innerHTML: _ctx.config.extra,
996
- class: "m-form-tip"
997
- }, null, 8, _hoisted_2$3)) : vue.createCommentVNode("", true)
998
- ])
999
- ])
1000
- ]),
1001
- default: vue.withCtx(() => [
1002
- vue.createElementVNode("div", null, [
1003
- vue.renderSlot(_ctx.$slots, "default"),
1004
- _ctx.config.schematic ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$3, [
1005
- vue.createElementVNode("div", _hoisted_4$2, [
1006
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.items, (item, index) => {
1007
- return vue.openBlock(), vue.createBlock(_component_m_form_container, {
1008
- key: item[_ctx.mForm?.keyProp || "__key"] ?? index,
1009
- config: item,
1010
- model: _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
1011
- prop: _ctx.prop,
1012
- size: _ctx.size,
1013
- "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
1014
- onChange: _ctx.changeHandler
1015
- }, null, 8, ["config", "model", "prop", "size", "label-width", "onChange"]);
1016
- }), 128))
1017
- ]),
1018
- vue.createElementVNode("img", {
1019
- class: "m-form-schematic",
1020
- src: _ctx.config.schematic
1021
- }, null, 8, _hoisted_5$1)
1022
- ])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(_ctx.items, (item, index) => {
1023
- return vue.openBlock(), vue.createBlock(_component_m_form_container, {
1024
- key: item[_ctx.mForm?.keyProp || "__key"] ?? index,
1025
- config: item,
1026
- model: _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
1027
- prop: _ctx.prop,
1028
- size: _ctx.size,
1029
- "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
1030
- onChange: _ctx.changeHandler
1031
- }, null, 8, ["config", "model", "prop", "size", "label-width", "onChange"]);
1032
- }), 128))
1033
- ])
1034
- ]),
1035
- _: 3
1036
- }, 8, ["body-style"])) : vue.createCommentVNode("", true);
1037
- }
1038
- const Panel = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$l]]);
1039
-
1040
- const _sfc_main$p = vue.defineComponent({
1041
- props: {
1042
- labelWidth: String,
1043
- expandMore: Boolean,
1044
- span: Number,
1045
- model: {
1046
- type: Object,
1047
- default: () => ({})
1048
- },
1049
- config: {
1050
- type: Object,
1051
- default: () => ({})
1052
- },
1053
- prop: String,
1054
- size: String
1055
- },
1056
- emits: ["change"],
1057
- setup(props, { emit }) {
1058
- const mForm = vue.inject("mForm");
1059
- const changeHandler = () => emit("change", props.model);
1060
- return {
1061
- mForm,
1062
- display: vue.computed(() => display(mForm, props.config.display, props)),
1063
- changeHandler
1064
- };
1065
- }
1066
- });
1067
-
1068
- function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
1069
- const _component_m_form_container = vue.resolveComponent("m-form-container");
1070
- const _component_el_col = vue.resolveComponent("el-col");
1071
- return vue.withDirectives((vue.openBlock(), vue.createBlock(_component_el_col, { span: _ctx.span }, {
1072
- default: vue.withCtx(() => [
1073
- vue.createVNode(_component_m_form_container, {
1074
- model: _ctx.model,
1075
- config: _ctx.config,
1076
- prop: _ctx.prop,
1077
- "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
1078
- "expand-more": _ctx.expandMore,
1079
- size: _ctx.size,
1080
- onChange: _ctx.changeHandler
1081
- }, null, 8, ["model", "config", "prop", "label-width", "expand-more", "size", "onChange"])
1082
- ]),
1083
- _: 1
1084
- }, 8, ["span"])), [
1085
- [vue.vShow, _ctx.display && _ctx.config.type !== "hidden"]
1086
- ]);
1087
- }
1088
- const Col = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["render", _sfc_render$k]]);
1089
-
1090
- const _sfc_main$o = vue.defineComponent({
1091
- name: "m-form-row",
1092
- components: { Col },
1093
- props: {
1094
- labelWidth: String,
1095
- expandMore: Boolean,
1096
- model: {
1097
- type: Object,
1098
- default: () => ({})
1099
- },
1100
- config: {
1101
- type: Object,
1102
- default: () => ({})
1103
- },
1104
- prop: String,
1105
- name: String,
1106
- size: String
1107
- },
1108
- emits: ["change"],
1109
- setup(props, { emit }) {
1110
- const mForm = vue.inject("mForm");
1111
- const changeHandler = () => emit("change", props.name ? props.model[props.name] : props.model);
1112
- return {
1113
- mForm,
1114
- changeHandler
1115
- };
1116
- }
1117
- });
1118
-
1119
- function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
1120
- const _component_Col = vue.resolveComponent("Col");
1121
- const _component_el_row = vue.resolveComponent("el-row");
1122
- return vue.openBlock(), vue.createBlock(_component_el_row, { gutter: 10 }, {
1123
- default: vue.withCtx(() => [
1124
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config.items, (col, index) => {
1125
- return vue.openBlock(), vue.createBlock(_component_Col, {
1126
- key: col[_ctx.mForm?.keyProp || "__key"] ?? index,
1127
- span: col.span || _ctx.config.span || 24 / _ctx.config.items.length,
1128
- config: col,
1129
- labelWidth: _ctx.config.labelWidth || _ctx.labelWidth,
1130
- expandMore: _ctx.expandMore,
1131
- model: _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
1132
- prop: _ctx.prop,
1133
- size: _ctx.size,
1134
- onChange: _ctx.changeHandler
1135
- }, null, 8, ["span", "config", "labelWidth", "expandMore", "model", "prop", "size", "onChange"]);
1136
- }), 128))
1137
- ]),
1138
- _: 1
1139
- });
1140
- }
1141
- const Row = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$j]]);
1142
-
1143
- const _sfc_main$n = vue.defineComponent({
1144
- name: "m-form-step",
1145
- props: {
1146
- model: {
1147
- type: Object,
1148
- default: () => ({})
1149
- },
1150
- config: {
1151
- type: Object,
1152
- default: () => ({})
1153
- },
1154
- stepActive: {
1155
- type: Number,
1156
- default: () => 1
1157
- },
1158
- size: String,
1159
- labelWidth: String
1160
- },
1161
- emits: ["change"],
1162
- setup(props, { emit }) {
1163
- const mForm = vue.inject("mForm");
1164
- const active = vue.ref(1);
1165
- vue.watchEffect(() => {
1166
- active.value = props.stepActive;
1167
- });
1168
- const stepClick = (index) => {
1169
- active.value = index + 1;
1170
- mForm?.$emit("update:stepActive", active.value);
1171
- };
1172
- const changeHandler = () => {
1173
- emit("change", props.model);
1174
- };
1175
- return { mForm, active, stepClick, changeHandler };
1176
- }
1177
- });
1178
-
1179
- function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
1180
- const _component_el_step = vue.resolveComponent("el-step");
1181
- const _component_el_steps = vue.resolveComponent("el-steps");
1182
- const _component_m_form_container = vue.resolveComponent("m-form-container");
1183
- return vue.openBlock(), vue.createElementBlock("div", null, [
1184
- vue.createVNode(_component_el_steps, {
1185
- active: _ctx.active,
1186
- "align-center": "",
1187
- space: _ctx.config.space
1188
- }, {
1189
- default: vue.withCtx(() => [
1190
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config.items, (item, index) => {
1191
- return vue.openBlock(), vue.createBlock(_component_el_step, {
1192
- key: item.__key,
1193
- title: item.title,
1194
- active: _ctx.active,
1195
- onClick: ($event) => _ctx.stepClick(index)
1196
- }, null, 8, ["title", "active", "onClick"]);
1197
- }), 128))
1198
- ]),
1199
- _: 1
1200
- }, 8, ["active", "space"]),
1201
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config.items, (step, index) => {
1202
- return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
1203
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(step.items, (item) => {
1204
- return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
1205
- item ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_m_form_container, {
1206
- key: item[_ctx.mForm?.keyProp || "__key"],
1207
- config: item,
1208
- model: step.name ? _ctx.model[step.name] : _ctx.model,
1209
- prop: step.name,
1210
- size: _ctx.size,
1211
- "label-width": _ctx.config.labelWidth || _ctx.labelWidth,
1212
- onChange: _ctx.changeHandler
1213
- }, null, 8, ["config", "model", "prop", "size", "label-width", "onChange"])), [
1214
- [vue.vShow, _ctx.active - 1 === index]
1215
- ]) : vue.createCommentVNode("", true)
1216
- ], 64);
1217
- }), 256))
1218
- ], 64);
1219
- }), 256))
1220
- ]);
1221
- }
1222
- const MStep = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["render", _sfc_render$i]]);
1223
-
1224
- const _sfc_main$m = vue.defineComponent({
1225
- props: {
1226
- name: {
1227
- type: String,
1228
- required: true
1229
- },
1230
- model: {
1231
- type: Object,
1232
- required: true,
1233
- default: () => ({})
1234
- },
1235
- config: {
1236
- type: Object,
1237
- required: true,
1238
- default: () => ({})
1239
- },
1240
- prop: {
1241
- type: String
1242
- },
1243
- labelWidth: {
1244
- type: String
1245
- },
1246
- sort: {
1247
- type: Boolean,
1248
- default: false
1249
- },
1250
- sortKey: {
1251
- type: String,
1252
- default: ""
1253
- },
1254
- text: {
1255
- type: String
1256
- },
1257
- size: String,
1258
- enableToggleMode: {
1259
- type: Boolean,
1260
- default: true
1261
- },
1262
- showIndex: {
1263
- type: Boolean,
1264
- default: true
1265
- }
1266
- },
1267
- emits: ["change", "select"],
1268
- components: { Delete: iconsVue.Delete },
1269
- setup(props, { emit }) {
1270
- let timer = null;
1271
- const mForm = vue.inject("mForm");
1272
- const elTable = vue.ref();
1273
- const excelBtn = vue.ref();
1274
- const mTable = vue.ref();
1275
- const pagesize = vue.ref(10);
1276
- const pagecontext = vue.ref(0);
1277
- const updateKey = vue.ref(1);
1278
- const isFullscreen = vue.ref(false);
1279
- const modelName = vue.computed(() => props.name || props.config.name || "");
1280
- const sortChange = ({ prop, order }) => {
1281
- if (order === "ascending") {
1282
- props.model[modelName.value] = props.model[modelName.value].sort((a, b) => a[prop] - b[prop]);
1283
- } else if (order === "descending") {
1284
- props.model[modelName.value] = props.model[modelName.value].sort((a, b) => b[prop] - a[prop]);
1285
- }
1286
- };
1287
- const foreUpdate = () => {
1288
- updateKey.value += 1;
1289
- setTimeout(() => rowDrop());
1290
- };
1291
- const swapArray = (index1, index2) => {
1292
- [props.model[modelName.value][index1]] = props.model[modelName.value].splice(
1293
- index2,
1294
- 1,
1295
- props.model[modelName.value][index1]
1296
- );
1297
- if (props.sortKey) {
1298
- for (let i = props.model[modelName.value].length - 1, v = 0; i >= 0; i--, v++) {
1299
- props.model[modelName.value][v][props.sortKey] = i;
1300
- }
1301
- }
1302
- mForm?.$emit("field-change", props.prop, props.model[modelName.value]);
1303
- };
1304
- const rowDrop = () => {
1305
- const tableEl = elTable.value?.$el;
1306
- if (tableEl?.querySelectorAll(".el-table__body > tbody")) {
1307
- const el = tableEl.querySelectorAll(".el-table__body > tbody")[0];
1308
- const sortable = Sortable__default.default.create(el, {
1309
- onEnd: ({ newIndex, oldIndex }) => {
1310
- if (typeof newIndex === "undefined")
1311
- return;
1312
- if (typeof oldIndex === "undefined")
1313
- return;
1314
- swapArray(newIndex, oldIndex);
1315
- emit("change", props.model[modelName.value]);
1316
- foreUpdate();
1317
- sortable.destroy();
1318
- mForm?.$emit("field-change", props.prop, props.model[modelName.value]);
1319
- utils.sleep(1e3).then(() => {
1320
- const eltrs = tableEl.querySelectorAll(".el-table__body > tbody > tr");
1321
- if (eltrs?.[newIndex]) {
1322
- eltrs[newIndex].style.backgroundColor = "rgba(243, 89, 59, 0.2)";
1323
- utils.sleep(1e3).then(() => {
1324
- eltrs[newIndex].style.backgroundColor = "";
1325
- });
1326
- }
1327
- });
1328
- }
1329
- });
1330
- }
1331
- };
1332
- const newHandler = async (row) => {
1333
- if (props.config.max && props.model[modelName.value].length >= props.config.max) {
1334
- elementPlus.ElMessage.error(`\u6700\u591A\u65B0\u589E\u914D\u7F6E\u4E0D\u80FD\u8D85\u8FC7${props.config.max}\u6761`);
1335
- return;
1336
- }
1337
- const columns = props.config.items;
1338
- const enumValues = props.config.enum || [];
1339
- let enumV = [];
1340
- const { length } = props.model[modelName.value];
1341
- const key = props.config.key || "id";
1342
- let inputs = {};
1343
- if (enumValues.length) {
1344
- if (length >= enumValues.length) {
1345
- return;
1346
- }
1347
- enumV = enumValues.filter((item) => {
1348
- let i = 0;
1349
- for (; i < length; i++) {
1350
- if (item[key] === props.model[modelName.value][i][key]) {
1351
- break;
1352
- }
1353
- }
1354
- return i === length;
1355
- });
1356
- if (enumV.length > 0) {
1357
- inputs = enumV[0];
1358
- }
1359
- } else if (Array.isArray(row)) {
1360
- columns.forEach((column, index) => {
1361
- column.name && (inputs[column.name] = row[index]);
1362
- });
1363
- } else {
1364
- if (typeof props.config.defaultAdd === "function") {
1365
- inputs = await props.config.defaultAdd(mForm, {
1366
- model: props.model[modelName.value],
1367
- formValue: mForm?.values
1368
- });
1369
- } else if (props.config.defaultAdd) {
1370
- inputs = props.config.defaultAdd;
1371
- }
1372
- inputs = await initValue(mForm, {
1373
- config: columns,
1374
- initValues: inputs
1375
- });
1376
- }
1377
- if (props.sortKey && length) {
1378
- inputs[props.sortKey] = props.model[modelName.value][length - 1][props.sortKey] - 1;
1379
- }
1380
- props.model[modelName.value].push(inputs);
1381
- emit("change", props.model[modelName.value]);
1382
- };
1383
- if (!globalThis.XLSX) {
1384
- utils.asyncLoadJs("https://cdn.bootcdn.net/ajax/libs/xlsx/0.17.0/xlsx.full.min.js");
1385
- }
1386
- vue.onMounted(() => {
1387
- if (props.config.defautSort) {
1388
- sortChange(props.config.defautSort);
1389
- } else if (props.config.defaultSort) {
1390
- sortChange(props.config.defaultSort);
1391
- }
1392
- if (props.sort && props.sortKey) {
1393
- props.model[modelName.value].sort((a, b) => b[props.sortKey] - a[props.sortKey]);
1394
- }
1395
- if (props.config.dropSort) {
1396
- rowDrop();
1397
- }
1398
- });
1399
- return {
1400
- mForm,
1401
- pagesize,
1402
- pagecontext,
1403
- foreUpdate,
1404
- isFullscreen,
1405
- elTable,
1406
- mTable,
1407
- excelBtn,
1408
- modelName,
1409
- updateKey,
1410
- ArrowDown: iconsVue.ArrowDown,
1411
- ArrowUp: iconsVue.ArrowUp,
1412
- Delete: iconsVue.Delete,
1413
- FullScreen: iconsVue.FullScreen,
1414
- Grid: iconsVue.Grid,
1415
- data: vue.computed(
1416
- () => props.model[modelName.value].filter(
1417
- (item, index) => index >= pagecontext.value * pagesize.value && index + 1 <= (pagecontext.value + 1) * pagesize.value
1418
- )
1419
- ),
1420
- addable: vue.computed(() => {
1421
- if (!props.model[modelName.value].length) {
1422
- return true;
1423
- }
1424
- if (typeof props.config.addable === "function") {
1425
- return props.config.addable(mForm, {
1426
- model: props.model[modelName.value],
1427
- formValue: mForm?.values,
1428
- prop: props.prop
1429
- });
1430
- }
1431
- return typeof props.config.addable === "undefined" ? true : props.config.addable;
1432
- }),
1433
- selection: vue.computed(() => {
1434
- if (typeof props.config.selection === "function") {
1435
- return props.config.selection(mForm, { model: props.model[modelName.value] });
1436
- }
1437
- return props.config.selection;
1438
- }),
1439
- importable: vue.computed(() => {
1440
- if (typeof props.config.importable === "function") {
1441
- return props.config.importable(mForm, {
1442
- formValue: mForm?.values,
1443
- model: props.model[modelName.value]
1444
- });
1445
- }
1446
- return typeof props.config.importable === "undefined" ? false : props.config.importable;
1447
- }),
1448
- sortChange,
1449
- display(fuc) {
1450
- return display(mForm, fuc, props);
1451
- },
1452
- itemExtra(fuc, index) {
1453
- if (typeof fuc === "function") {
1454
- return fuc(mForm, {
1455
- values: mForm?.initValues,
1456
- model: props.model,
1457
- formValue: mForm ? mForm.values : props.model,
1458
- prop: props.prop,
1459
- index
1460
- });
1461
- }
1462
- return fuc;
1463
- },
1464
- newHandler,
1465
- removeHandler(index) {
1466
- props.model[modelName.value].splice(index, 1);
1467
- emit("change", props.model[modelName.value]);
1468
- },
1469
- selectHandle(selection, row) {
1470
- if (typeof props.config.selection === "string" && props.config.selection === "single") {
1471
- elTable.value?.clearSelection();
1472
- elTable.value?.toggleRowSelection(row, true);
1473
- }
1474
- emit("select", selection, row);
1475
- if (typeof props.config.onSelect === "function") {
1476
- props.config.onSelect(mForm, { selection, row, config: props.config });
1477
- }
1478
- },
1479
- toggleRowSelection(row, selected) {
1480
- elTable.value?.toggleRowSelection.call(elTable.value, row, selected);
1481
- },
1482
- makeConfig(config) {
1483
- const newConfig = lodashEs.cloneDeep(config);
1484
- delete newConfig.display;
1485
- return newConfig;
1486
- },
1487
- upHandler(index) {
1488
- if (timer) {
1489
- clearTimeout(timer);
1490
- }
1491
- timer = setTimeout(() => {
1492
- swapArray(index, index - 1);
1493
- }, 300);
1494
- },
1495
- topHandler(index) {
1496
- if (timer) {
1497
- clearTimeout(timer);
1498
- }
1499
- const moveNum = index;
1500
- for (let i = 0; i < moveNum; i++) {
1501
- swapArray(index, index - 1);
1502
- index -= 1;
1503
- }
1504
- },
1505
- downHandler(index) {
1506
- if (timer) {
1507
- clearTimeout(timer);
1508
- }
1509
- timer = setTimeout(() => {
1510
- swapArray(index, index + 1);
1511
- }, 300);
1512
- },
1513
- bottomHandler(index) {
1514
- if (timer) {
1515
- clearTimeout(timer);
1516
- }
1517
- const moveNum = props.model[modelName.value].length - 1 - index;
1518
- for (let i = 0; i < moveNum; i++) {
1519
- swapArray(index, index + 1);
1520
- index += 1;
1521
- }
1522
- },
1523
- showDelete(index) {
1524
- const deleteFunc = props.config.delete;
1525
- if (deleteFunc && typeof deleteFunc === "function") {
1526
- return deleteFunc(props.model[modelName.value], index, mForm?.values);
1527
- }
1528
- return true;
1529
- },
1530
- clearHandler() {
1531
- const len = props.model[modelName.value].length;
1532
- props.model[modelName.value].splice(0, len);
1533
- mForm?.$emit("field-change", props.prop, props.model[modelName.value]);
1534
- },
1535
- excelHandler(file) {
1536
- if (!file || !file.raw) {
1537
- return false;
1538
- }
1539
- const reader = new FileReader();
1540
- reader.onload = () => {
1541
- const data = reader.result;
1542
- const pdata = globalThis.XLSX.read(data, { type: "array" });
1543
- pdata.SheetNames.forEach((sheetName) => {
1544
- const arr = globalThis.XLSX.utils.sheet_to_json(pdata.Sheets[sheetName], { header: 1 });
1545
- if (arr?.[0]) {
1546
- arr.forEach((row) => {
1547
- newHandler(row);
1548
- });
1549
- }
1550
- setTimeout(() => {
1551
- excelBtn.value?.clearFiles();
1552
- }, 300);
1553
- });
1554
- };
1555
- reader.readAsArrayBuffer(file.raw);
1556
- return false;
1557
- },
1558
- handleSizeChange(val) {
1559
- pagesize.value = val;
1560
- },
1561
- handleCurrentChange(val) {
1562
- pagecontext.value = val - 1;
1563
- },
1564
- toggleMode() {
1565
- const calcLabelWidth = (label) => {
1566
- if (!label)
1567
- return "0px";
1568
- const zhLength = label.match(/[^\x00-\xff]/g)?.length || 0;
1569
- const chLength = label.length - zhLength;
1570
- return `${Math.max(chLength * 8 + zhLength * 20, 80)}px`;
1571
- };
1572
- props.config.type = "groupList";
1573
- props.config.enableToggleMode = true;
1574
- props.config.tableItems = props.config.items;
1575
- props.config.items = props.config.groupItems || props.config.items.map((item) => {
1576
- const text = item.text || item.label;
1577
- const labelWidth = calcLabelWidth(text);
1578
- return {
1579
- ...item,
1580
- text,
1581
- labelWidth,
1582
- span: item.span || 12
1583
- };
1584
- });
1585
- },
1586
- toggleFullscreen() {
1587
- if (isFullscreen.value) {
1588
- mTable.value?.classList.remove("fixed");
1589
- isFullscreen.value = false;
1590
- } else {
1591
- mTable.value?.classList.add("fixed");
1592
- isFullscreen.value = true;
1593
- }
1594
- },
1595
- getProp(index) {
1596
- const { prop } = vue.toRefs(props);
1597
- return `${prop.value}${prop.value ? "." : ""}${index + 1 + pagecontext.value * pagesize.value - 1}`;
1598
- }
1599
- };
1600
- }
1601
- });
1602
-
1603
- const _hoisted_1$7 = ["innerHTML"];
1604
- const _hoisted_2$2 = { class: "el-form-item__content" };
1605
- const _hoisted_3$2 = ["innerHTML"];
1606
- const _hoisted_4$1 = /* @__PURE__ */ vue.createTextVNode("\u6DFB\u52A0");
1607
- const _hoisted_5 = /* @__PURE__ */ vue.createTextVNode(" \xA0 ");
1608
- const _hoisted_6 = /* @__PURE__ */ vue.createTextVNode("\u5C55\u5F00\u914D\u7F6E");
1609
- const _hoisted_7 = /* @__PURE__ */ vue.createTextVNode("\u5BFC\u5165EXCEL");
1610
- const _hoisted_8 = /* @__PURE__ */ vue.createTextVNode("\xA0 ");
1611
- const _hoisted_9 = /* @__PURE__ */ vue.createTextVNode("\u6E05\u7A7A");
1612
- const _hoisted_10 = {
1613
- class: "bottom",
1614
- style: { "text-align": "right" }
1615
- };
1616
- function _sfc_render$h(_ctx, _cache, $props, $setup, $data, $options) {
1617
- const _component_el_table_column = vue.resolveComponent("el-table-column");
1618
- const _component_Delete = vue.resolveComponent("Delete");
1619
- const _component_el_icon = vue.resolveComponent("el-icon");
1620
- const _component_el_button = vue.resolveComponent("el-button");
1621
- const _component_el_tooltip = vue.resolveComponent("el-tooltip");
1622
- const _component_m_form_container = vue.resolveComponent("m-form-container");
1623
- const _component_el_table = vue.resolveComponent("el-table");
1624
- const _component_el_upload = vue.resolveComponent("el-upload");
1625
- const _component_el_pagination = vue.resolveComponent("el-pagination");
1626
- return vue.openBlock(), vue.createElementBlock("div", {
1627
- ref: "mTable",
1628
- class: vue.normalizeClass(["m-fields-table", { "m-fields-table-item-extra": _ctx.config.itemExtra }])
1629
- }, [
1630
- _ctx.config.extra ? (vue.openBlock(), vue.createElementBlock("span", {
1631
- key: 0,
1632
- style: { "color": "rgba(0, 0, 0, 0.45)" },
1633
- innerHTML: _ctx.config.extra
1634
- }, null, 8, _hoisted_1$7)) : vue.createCommentVNode("", true),
1635
- vue.createElementVNode("div", _hoisted_2$2, [
1636
- vue.createVNode(_component_el_tooltip, {
1637
- content: "\u62D6\u62FD\u53EF\u6392\u5E8F",
1638
- placement: "left-start",
1639
- disabled: _ctx.config.dropSort !== true
1640
- }, {
1641
- default: vue.withCtx(() => [
1642
- _ctx.model[_ctx.modelName] ? (vue.openBlock(), vue.createBlock(_component_el_table, {
1643
- ref: "elTable",
1644
- style: { "width": "100%" },
1645
- data: _ctx.model[_ctx.modelName],
1646
- border: _ctx.config.border,
1647
- "max-height": _ctx.config.maxHeight,
1648
- "default-expand-all": true,
1649
- key: _ctx.updateKey,
1650
- onSelect: _ctx.selectHandle,
1651
- onSortChange: _ctx.sortChange
1652
- }, {
1653
- default: vue.withCtx(() => [
1654
- _ctx.config.itemExtra ? (vue.openBlock(), vue.createBlock(_component_el_table_column, {
1655
- key: 0,
1656
- fixed: "left",
1657
- width: "30",
1658
- type: "expand"
1659
- }, {
1660
- default: vue.withCtx((scope) => [
1661
- vue.createElementVNode("span", {
1662
- innerHTML: _ctx.itemExtra(_ctx.config.itemExtra, scope.$index),
1663
- class: "m-form-tip"
1664
- }, null, 8, _hoisted_3$2)
1665
- ]),
1666
- _: 1
1667
- })) : vue.createCommentVNode("", true),
1668
- vue.createVNode(_component_el_table_column, {
1669
- label: "\u64CD\u4F5C",
1670
- width: "55",
1671
- align: "center",
1672
- fixed: _ctx.config.fixed === false ? void 0 : "left"
1673
- }, {
1674
- default: vue.withCtx((scope) => [
1675
- vue.withDirectives(vue.createVNode(_component_el_icon, {
1676
- class: "m-table-delete-icon",
1677
- onClick: ($event) => _ctx.removeHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
1678
- }, {
1679
- default: vue.withCtx(() => [
1680
- vue.createVNode(_component_Delete)
1681
- ]),
1682
- _: 2
1683
- }, 1032, ["onClick"]), [
1684
- [vue.vShow, _ctx.showDelete(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)]
1685
- ])
1686
- ]),
1687
- _: 1
1688
- }, 8, ["fixed"]),
1689
- _ctx.sort && _ctx.model[_ctx.modelName] && _ctx.model[_ctx.modelName].length > 1 ? (vue.openBlock(), vue.createBlock(_component_el_table_column, {
1690
- key: 1,
1691
- label: "\u6392\u5E8F",
1692
- width: "60"
1693
- }, {
1694
- default: vue.withCtx((scope) => [
1695
- scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1 !== 0 ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
1696
- key: 0,
1697
- content: "\u70B9\u51FB\u4E0A\u79FB\uFF0C\u53CC\u51FB\u7F6E\u9876",
1698
- placement: "top"
1699
- }, {
1700
- default: vue.withCtx(() => [
1701
- vue.createVNode(_component_el_button, {
1702
- plain: "",
1703
- size: "small",
1704
- type: "primary",
1705
- icon: _ctx.ArrowUp,
1706
- text: "",
1707
- onClick: ($event) => _ctx.upHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1),
1708
- onDblclick: ($event) => _ctx.topHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
1709
- }, null, 8, ["icon", "onClick", "onDblclick"])
1710
- ]),
1711
- _: 2
1712
- }, 1024)) : vue.createCommentVNode("", true),
1713
- scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1 !== _ctx.model[_ctx.modelName].length - 1 ? (vue.openBlock(), vue.createBlock(_component_el_tooltip, {
1714
- key: 1,
1715
- content: "\u70B9\u51FB\u4E0B\u79FB\uFF0C\u53CC\u51FB\u7F6E\u5E95",
1716
- placement: "top"
1717
- }, {
1718
- default: vue.withCtx(() => [
1719
- vue.createVNode(_component_el_button, {
1720
- plain: "",
1721
- size: "small",
1722
- type: "primary",
1723
- icon: _ctx.ArrowDown,
1724
- text: "",
1725
- onClick: ($event) => _ctx.downHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1),
1726
- onDblclick: ($event) => _ctx.bottomHandler(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize - 1)
1727
- }, null, 8, ["icon", "onClick", "onDblclick"])
1728
- ]),
1729
- _: 2
1730
- }, 1024)) : vue.createCommentVNode("", true)
1731
- ]),
1732
- _: 1
1733
- })) : vue.createCommentVNode("", true),
1734
- _ctx.selection ? (vue.openBlock(), vue.createBlock(_component_el_table_column, {
1735
- key: 2,
1736
- align: "center",
1737
- "header-align": "center",
1738
- type: "selection",
1739
- width: "45"
1740
- })) : vue.createCommentVNode("", true),
1741
- _ctx.showIndex && _ctx.config.showIndex ? (vue.openBlock(), vue.createBlock(_component_el_table_column, {
1742
- key: 3,
1743
- width: "60",
1744
- label: "\u5E8F\u53F7"
1745
- }, {
1746
- default: vue.withCtx((scope) => [
1747
- vue.createTextVNode(vue.toDisplayString(scope.$index + 1 + _ctx.pagecontext * _ctx.pagesize), 1)
1748
- ]),
1749
- _: 1
1750
- })) : vue.createCommentVNode("", true),
1751
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config.items, (column, index) => {
1752
- return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
1753
- column.type !== "hidden" && _ctx.display(column.display) ? (vue.openBlock(), vue.createBlock(_component_el_table_column, {
1754
- prop: column.name,
1755
- width: column.width,
1756
- label: column.label,
1757
- sortable: column.sortable,
1758
- "sort-orders": ["ascending", "descending"],
1759
- key: column[_ctx.mForm?.keyProp || "__key"] ?? index,
1760
- "class-name": _ctx.config.dropSort === true ? "el-table__column--dropable" : ""
1761
- }, {
1762
- default: vue.withCtx((scope) => [
1763
- scope.$index > -1 ? (vue.openBlock(), vue.createBlock(_component_m_form_container, {
1764
- key: 0,
1765
- labelWidth: "0",
1766
- prop: _ctx.getProp(scope.$index),
1767
- rules: column.rules,
1768
- config: _ctx.makeConfig(column),
1769
- model: scope.row,
1770
- size: _ctx.size,
1771
- onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("change", _ctx.model[_ctx.modelName]))
1772
- }, null, 8, ["prop", "rules", "config", "model", "size"])) : vue.createCommentVNode("", true)
1773
- ]),
1774
- _: 2
1775
- }, 1032, ["prop", "width", "label", "sortable", "class-name"])) : vue.createCommentVNode("", true)
1776
- ], 64);
1777
- }), 256))
1778
- ]),
1779
- _: 1
1780
- }, 8, ["data", "border", "max-height", "onSelect", "onSortChange"])) : vue.createCommentVNode("", true)
1781
- ]),
1782
- _: 1
1783
- }, 8, ["disabled"]),
1784
- vue.renderSlot(_ctx.$slots, "default"),
1785
- _ctx.addable ? (vue.openBlock(), vue.createBlock(_component_el_button, {
1786
- key: 0,
1787
- size: "small",
1788
- type: "primary",
1789
- plain: "",
1790
- onClick: _cache[1] || (_cache[1] = ($event) => _ctx.newHandler())
1791
- }, {
1792
- default: vue.withCtx(() => [
1793
- _hoisted_4$1
1794
- ]),
1795
- _: 1
1796
- })) : vue.createCommentVNode("", true),
1797
- _hoisted_5,
1798
- _ctx.enableToggleMode && !_ctx.isFullscreen ? (vue.openBlock(), vue.createBlock(_component_el_button, {
1799
- key: 1,
1800
- icon: _ctx.Grid,
1801
- size: "small",
1802
- type: "primary",
1803
- onClick: _ctx.toggleMode
1804
- }, {
1805
- default: vue.withCtx(() => [
1806
- _hoisted_6
1807
- ]),
1808
- _: 1
1809
- }, 8, ["icon", "onClick"])) : vue.createCommentVNode("", true),
1810
- _ctx.config.enableFullscreen !== false ? (vue.openBlock(), vue.createBlock(_component_el_button, {
1811
- key: 2,
1812
- icon: _ctx.FullScreen,
1813
- size: "small",
1814
- type: "primary",
1815
- onClick: _ctx.toggleFullscreen
1816
- }, {
1817
- default: vue.withCtx(() => [
1818
- vue.createTextVNode(vue.toDisplayString(_ctx.isFullscreen ? "\u9000\u51FA\u5168\u5C4F" : "\u5168\u5C4F\u7F16\u8F91"), 1)
1819
- ]),
1820
- _: 1
1821
- }, 8, ["icon", "onClick"])) : vue.createCommentVNode("", true),
1822
- _ctx.importable ? (vue.openBlock(), vue.createBlock(_component_el_upload, {
1823
- key: 3,
1824
- ref: "excelBtn",
1825
- action: "/noop",
1826
- "on-change": _ctx.excelHandler,
1827
- "auto-upload": false,
1828
- style: { "display": "inline-block" }
1829
- }, {
1830
- default: vue.withCtx(() => [
1831
- vue.createVNode(_component_el_button, {
1832
- size: "small",
1833
- type: "success",
1834
- plain: ""
1835
- }, {
1836
- default: vue.withCtx(() => [
1837
- _hoisted_7
1838
- ]),
1839
- _: 1
1840
- })
1841
- ]),
1842
- _: 1
1843
- }, 8, ["on-change"])) : vue.createCommentVNode("", true),
1844
- _hoisted_8,
1845
- _ctx.importable ? (vue.openBlock(), vue.createBlock(_component_el_button, {
1846
- key: 4,
1847
- size: "small",
1848
- type: "warning",
1849
- plain: "",
1850
- onClick: _cache[2] || (_cache[2] = ($event) => _ctx.clearHandler())
1851
- }, {
1852
- default: vue.withCtx(() => [
1853
- _hoisted_9
1854
- ]),
1855
- _: 1
1856
- })) : vue.createCommentVNode("", true)
1857
- ]),
1858
- vue.createElementVNode("div", _hoisted_10, [
1859
- vue.createVNode(_component_el_pagination, {
1860
- layout: "total, sizes, prev, pager, next, jumper",
1861
- "hide-on-single-page": _ctx.model[_ctx.modelName].length < _ctx.pagesize,
1862
- "current-page": _ctx.pagecontext + 1,
1863
- "page-sizes": [_ctx.pagesize, 60, 120, 300],
1864
- "page-size": _ctx.pagesize,
1865
- total: _ctx.model[_ctx.modelName].length,
1866
- onSizeChange: _ctx.handleSizeChange,
1867
- onCurrentChange: _ctx.handleCurrentChange
1868
- }, null, 8, ["hide-on-single-page", "current-page", "page-sizes", "page-size", "total", "onSizeChange", "onCurrentChange"])
1869
- ])
1870
- ], 2);
1871
- }
1872
- const Table = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["render", _sfc_render$h]]);
1873
-
1874
- const getActive = (mForm, props, activeTabName) => {
1875
- const { config, model, prop } = props;
1876
- const { active } = config;
1877
- if (typeof active === "function")
1878
- return active(mForm, { model, formValue: mForm?.values, prop });
1879
- if (+activeTabName >= props.config.items.length)
1880
- return "0";
1881
- if (typeof active !== "undefined")
1882
- return active;
1883
- return "0";
1884
- };
1885
- const tabClickHandler = (mForm, tab, props) => {
1886
- const { config, model, prop } = props;
1887
- tab.name = tab.paneName;
1888
- if (typeof config.onTabClick === "function") {
1889
- config.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop, config });
1890
- }
1891
- const tabConfig = config.items.find((item) => tab.name === item.status);
1892
- if (tabConfig && typeof tabConfig.onTabClick === "function") {
1893
- tabConfig.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop, config });
1894
- }
1895
- };
1896
- const Tab = vue.defineComponent({
1897
- name: "m-form-tab",
1898
- props: {
1899
- labelWidth: String,
1900
- expandMore: Boolean,
1901
- model: {
1902
- type: Object,
1903
- default: () => ({})
1904
- },
1905
- config: {
1906
- type: Object,
1907
- default: () => ({})
1908
- },
1909
- prop: String,
1910
- name: String,
1911
- size: String
1912
- },
1913
- emits: {
1914
- change(values) {
1915
- return values;
1916
- }
1917
- },
1918
- setup(props, { emit }) {
1919
- const mForm = vue.inject("mForm");
1920
- const activeTabName = vue.ref(getActive(mForm, props, ""));
1921
- const tabs = vue.computed(() => {
1922
- if (props.config.dynamic) {
1923
- if (!props.config.name)
1924
- throw new Error("dynamic tab \u5FC5\u987B\u914D\u7F6Ename");
1925
- return props.model[props.config.name] || [];
1926
- }
1927
- return props.config.items;
1928
- });
1929
- const filter = (config) => filterFunction(mForm, config, props);
1930
- vue.watchEffect(() => {
1931
- if (typeof props.config.activeChange === "function") {
1932
- props.config.activeChange(mForm, activeTabName.value, {
1933
- model: props.model,
1934
- prop: props.prop
1935
- });
1936
- }
1937
- });
1938
- return {
1939
- mForm,
1940
- activeTabName,
1941
- tabs,
1942
- filter,
1943
- tabItems: (tab) => props.config.dynamic ? props.config.items : tab.items,
1944
- tabClickHandler: (tab) => tabClickHandler(mForm, tab, props),
1945
- onTabAdd: () => {
1946
- if (!props.config.name)
1947
- throw new Error("dynamic tab \u5FC5\u987B\u914D\u7F6Ename");
1948
- if (typeof props.config.onTabAdd === "function") {
1949
- props.config.onTabAdd(mForm, {
1950
- model: props.model,
1951
- prop: props.prop,
1952
- config: props.config
1953
- });
1954
- } else if (tabs.value.length > 0) {
1955
- const newObj = lodashEs.cloneDeep(tabs.value[0]);
1956
- newObj.title = `\u6807\u7B7E${tabs.value.length + 1}`;
1957
- props.model[props.config.name].push(newObj);
1958
- }
1959
- emit("change", props.model);
1960
- mForm?.$emit("field-change", props.prop, props.model[props.config.name]);
1961
- },
1962
- onTabRemove: (tabName) => {
1963
- if (!props.config.name)
1964
- throw new Error("dynamic tab \u5FC5\u987B\u914D\u7F6Ename");
1965
- if (typeof props.config.onTabRemove === "function") {
1966
- props.config.onTabRemove(mForm, tabName, {
1967
- model: props.model,
1968
- prop: props.prop,
1969
- config: props.config
1970
- });
1971
- } else {
1972
- props.model[props.config.name].splice(+tabName, 1);
1973
- if (tabName < activeTabName.value || activeTabName.value >= props.model[props.config.name].length) {
1974
- activeTabName.value = (+activeTabName.value - 1).toString();
1975
- tabClickHandler(mForm, { name: activeTabName.value }, props);
1976
- }
1977
- }
1978
- emit("change", props.model);
1979
- mForm?.$emit("field-change", props.prop, props.model[props.config.name]);
1980
- },
1981
- display: (displayConfig) => display(mForm, displayConfig, props),
1982
- changeHandler: () => {
1983
- emit("change", props.model);
1984
- if (typeof props.config.onChange === "function") {
1985
- props.config.onChange(mForm, { model: props.model, prop: props.prop, config: props.config });
1986
- }
1987
- }
1988
- };
1989
- }
1990
- });
1991
-
1992
- function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
1993
- const _component_m_form_container = vue.resolveComponent("m-form-container");
1994
- const _component_el_tab_pane = vue.resolveComponent("el-tab-pane");
1995
- const _component_el_tabs = vue.resolveComponent("el-tabs");
1996
- return vue.openBlock(), vue.createBlock(_component_el_tabs, {
1997
- modelValue: _ctx.activeTabName,
1998
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.activeTabName = $event),
1999
- class: vue.normalizeClass(_ctx.config.dynamic ? "magic-form-dynamic-tab" : "magic-form-tab"),
2000
- type: _ctx.config.tabType,
2001
- editable: _ctx.config.editable || false,
2002
- "tab-position": _ctx.config.tabPosition || "top",
2003
- onTabClick: _ctx.tabClickHandler,
2004
- onTabAdd: _ctx.onTabAdd,
2005
- onTabRemove: _ctx.onTabRemove
2006
- }, {
2007
- default: vue.withCtx(() => [
2008
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tabs, (tab, tabIndex) => {
2009
- return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
2010
- _ctx.display(tab.display) && _ctx.tabItems(tab).length ? (vue.openBlock(), vue.createBlock(_component_el_tab_pane, {
2011
- key: tab[_ctx.mForm?.keyProp || "__key"] ?? tabIndex,
2012
- name: _ctx.filter(tab.status) || tabIndex.toString(),
2013
- label: _ctx.filter(tab.title),
2014
- lazy: tab.lazy || false
2015
- }, {
2016
- default: vue.withCtx(() => [
2017
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tabItems(tab), (item) => {
2018
- return vue.openBlock(), vue.createBlock(_component_m_form_container, {
2019
- key: item[_ctx.mForm?.keyProp || "__key"],
2020
- config: item,
2021
- model: _ctx.config.dynamic ? (_ctx.name ? _ctx.model[_ctx.name] : _ctx.model)[tabIndex] : tab.name ? (_ctx.name ? _ctx.model[_ctx.name] : _ctx.model)[tab.name] : _ctx.name ? _ctx.model[_ctx.name] : _ctx.model,
2022
- prop: _ctx.config.dynamic ? `${_ctx.prop}${_ctx.prop ? "." : ""}${String(tabIndex)}` : _ctx.prop,
2023
- size: _ctx.size,
2024
- "label-width": tab.labelWidth || _ctx.labelWidth,
2025
- "expand-more": _ctx.expandMore,
2026
- onChange: _ctx.changeHandler
2027
- }, null, 8, ["config", "model", "prop", "size", "label-width", "expand-more", "onChange"]);
2028
- }), 128))
2029
- ]),
2030
- _: 2
2031
- }, 1032, ["name", "label", "lazy"])) : vue.createCommentVNode("", true)
2032
- ], 64);
2033
- }), 256))
2034
- ]),
2035
- _: 1
2036
- }, 8, ["modelValue", "class", "type", "editable", "tab-position", "onTabClick", "onTabAdd", "onTabRemove"]);
2037
- }
2038
- const Tabs = /* @__PURE__ */ _export_sfc(Tab, [["render", _sfc_render$g]]);
2039
-
2040
- let $MAGIC_FORM = {};
2041
- const setConfig = (option) => {
2042
- $MAGIC_FORM = option;
2043
- };
2044
- const getConfig = (key) => $MAGIC_FORM[key];
2045
-
2046
- const fieldProps = {
2047
- model: {
2048
- type: Object,
2049
- required: true,
2050
- default: () => ({})
2051
- },
2052
- name: {
2053
- type: String,
2054
- default: ""
2055
- },
2056
- disabled: {
2057
- type: Boolean,
2058
- default: false
2059
- },
2060
- size: String,
2061
- prop: String,
2062
- initValues: Object,
2063
- values: Object
2064
- };
2065
-
2066
- const useAddField = (prop) => {
2067
- if (!prop)
2068
- return;
2069
- const mForm = vue.inject("mForm");
2070
- const instance = vue.getCurrentInstance();
2071
- vue.watch(
2072
- () => instance?.proxy,
2073
- (vm) => {
2074
- if (vm) {
2075
- mForm?.setField(prop, vm);
2076
- } else {
2077
- mForm?.deleteField(prop);
2078
- }
2079
- },
2080
- {
2081
- immediate: true
2082
- }
2083
- );
2084
- };
2085
-
2086
- const _sfc_main$l = vue.defineComponent({
2087
- name: "m-fields-cascader",
2088
- props: {
2089
- ...fieldProps,
2090
- config: {
2091
- type: Object,
2092
- required: true
2093
- }
2094
- },
2095
- emits: ["change"],
2096
- setup(props, { emit }) {
2097
- const mForm = vue.inject("mForm");
2098
- const vm = vue.getCurrentInstance();
2099
- useAddField(props.prop);
2100
- const requestFunc = getConfig("request");
2101
- const cascader = vue.ref();
2102
- const dialog = vue.ref();
2103
- const options = Array.isArray(props.config.options) ? vue.ref(props.config.options) : vue.ref([]);
2104
- const remoteData = vue.ref(null);
2105
- const setRemoteOptions = async function() {
2106
- const { config } = props;
2107
- const { option } = config;
2108
- if (!option)
2109
- return;
2110
- let { body } = option;
2111
- const postOptions = {
2112
- url: option.url,
2113
- cache: option.cache,
2114
- timeout: option.timeout,
2115
- data: {}
2116
- };
2117
- if (body && mForm) {
2118
- if (typeof body === "function" && props.model && mForm) {
2119
- body = body(mForm, {
2120
- model: props.model,
2121
- formValue: mForm.values,
2122
- formValues: mForm.values,
2123
- config: props.config
2124
- });
2125
- }
2126
- postOptions.data = body;
2127
- }
2128
- const res = await requestFunc(postOptions);
2129
- remoteData.value = res[option.root];
2130
- if (remoteData.value && typeof option?.item === "function") {
2131
- options.value = option.item(res[option.root]);
2132
- }
2133
- };
2134
- if (typeof props.config.options === "function" && props.model && mForm) {
2135
- vue.watchEffect(
2136
- () => options.value = props.config.options(vm, { model: props.model, formValues: mForm.values })
2137
- );
2138
- } else if (!props.config.options || !props.config.options.length || props.config.remote) {
2139
- Promise.resolve(setRemoteOptions());
2140
- }
2141
- const action = vue.computed(() => {
2142
- if (props.config.add?.action.method === "post") {
2143
- return (options2) => requestFunc({
2144
- ...props.config?.add?.action.body,
2145
- ...options2
2146
- });
2147
- }
2148
- return null;
2149
- });
2150
- return {
2151
- options,
2152
- remoteData,
2153
- addButtonStyle: {
2154
- top: 0,
2155
- left: 0,
2156
- width: "auto"
2157
- },
2158
- dialogVisible: false,
2159
- cascader,
2160
- dialog,
2161
- action,
2162
- setRemoteOptions,
2163
- changeHandler: (value) => {
2164
- if (!cascader.value)
2165
- return;
2166
- cascader.value.query = "";
2167
- cascader.value.previousQuery = null;
2168
- emit("change", value);
2169
- },
2170
- addHandler: () => {
2171
- if (!dialog.value)
2172
- return;
2173
- dialog.value.dialogVisible = true;
2174
- },
2175
- editAfterAction: () => {
2176
- setRemoteOptions();
2177
- }
2178
- };
2179
- }
2180
- });
2181
-
2182
- const _hoisted_1$6 = {
2183
- class: "m-cascader",
2184
- style: { "width": "100%" }
2185
- };
2186
- function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
2187
- const _component_el_cascader = vue.resolveComponent("el-cascader");
2188
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
2189
- vue.createVNode(_component_el_cascader, {
2190
- modelValue: _ctx.model[_ctx.name],
2191
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
2192
- ref: "cascader",
2193
- style: { "width": "100%" },
2194
- clearable: "",
2195
- filterable: "",
2196
- size: _ctx.size,
2197
- placeholder: _ctx.config.placeholder,
2198
- disabled: _ctx.disabled,
2199
- options: _ctx.options,
2200
- props: { multiple: _ctx.config.multiple },
2201
- onChange: _ctx.changeHandler
2202
- }, null, 8, ["modelValue", "size", "placeholder", "disabled", "options", "props", "onChange"])
2203
- ]);
2204
- }
2205
- const Cascader = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["render", _sfc_render$f]]);
2206
-
2207
- const _sfc_main$k = vue.defineComponent({
2208
- name: "m-fields-checkbox",
2209
- props: {
2210
- ...fieldProps,
2211
- config: {
2212
- type: Object,
2213
- required: true
2214
- }
2215
- },
2216
- emits: ["change", "input"],
2217
- setup(props, { emit }) {
2218
- useAddField(props.prop);
2219
- return {
2220
- activeValue: vue.computed(() => {
2221
- if (typeof props.config.activeValue === "undefined") {
2222
- if (props.config.filter === "number") {
2223
- return 1;
2224
- }
2225
- } else {
2226
- return props.config.activeValue;
2227
- }
2228
- return void 0;
2229
- }),
2230
- inactiveValue: vue.computed(() => {
2231
- if (typeof props.config.inactiveValue === "undefined") {
2232
- if (props.config.filter === "number") {
2233
- return 0;
2234
- }
2235
- } else {
2236
- return props.config.inactiveValue;
2237
- }
2238
- return void 0;
2239
- }),
2240
- changeHandler(value) {
2241
- emit("change", value);
2242
- }
2243
- };
2244
- }
2245
- });
2246
-
2247
- function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
2248
- const _component_el_checkbox = vue.resolveComponent("el-checkbox");
2249
- return vue.openBlock(), vue.createBlock(_component_el_checkbox, {
2250
- modelValue: _ctx.model[_ctx.name],
2251
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
2252
- size: _ctx.size,
2253
- trueLabel: _ctx.activeValue,
2254
- falseLabel: _ctx.inactiveValue,
2255
- disabled: _ctx.disabled,
2256
- label: _ctx.config.text,
2257
- onChange: _ctx.changeHandler
2258
- }, null, 8, ["modelValue", "size", "trueLabel", "falseLabel", "disabled", "label", "onChange"]);
2259
- }
2260
- const Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["render", _sfc_render$e]]);
2261
-
2262
- const _sfc_main$j = vue.defineComponent({
2263
- name: "m-fields-checkbox-group",
2264
- props: {
2265
- ...fieldProps,
2266
- config: {
2267
- type: Object,
2268
- required: true
2269
- }
2270
- },
2271
- emits: ["change"],
2272
- setup(props, { emit }) {
2273
- useAddField(props.prop);
2274
- if (props.model && !props.model[props.name]) {
2275
- props.model[props.name] = [];
2276
- }
2277
- return {
2278
- changeHandler: (v) => {
2279
- emit("change", v);
2280
- }
2281
- };
2282
- }
2283
- });
2284
-
2285
- function _sfc_render$d(_ctx, _cache, $props, $setup, $data, $options) {
2286
- const _component_el_checkbox = vue.resolveComponent("el-checkbox");
2287
- const _component_el_checkbox_group = vue.resolveComponent("el-checkbox-group");
2288
- return vue.openBlock(), vue.createBlock(_component_el_checkbox_group, {
2289
- modelValue: _ctx.model[_ctx.name],
2290
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
2291
- size: _ctx.size,
2292
- disabled: _ctx.disabled,
2293
- onChange: _ctx.changeHandler
2294
- }, {
2295
- default: vue.withCtx(() => [
2296
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config.options, (option) => {
2297
- return vue.openBlock(), vue.createBlock(_component_el_checkbox, {
2298
- label: option.value,
2299
- key: option.value
2300
- }, {
2301
- default: vue.withCtx(() => [
2302
- vue.createTextVNode(vue.toDisplayString(option.text), 1)
2303
- ]),
2304
- _: 2
2305
- }, 1032, ["label"]);
2306
- }), 128))
2307
- ]),
2308
- _: 1
2309
- }, 8, ["modelValue", "size", "disabled", "onChange"]);
2310
- }
2311
- const CheckboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$d]]);
2312
-
2313
- const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
2314
- __name: "ColorPicker",
2315
- props: {
2316
- config: null,
2317
- model: null,
2318
- initValues: null,
2319
- values: null,
2320
- name: null,
2321
- prop: null,
2322
- disabled: { type: Boolean },
2323
- size: null
2324
- },
2325
- emits: ["change"],
2326
- setup(__props, { emit }) {
2327
- const props = __props;
2328
- useAddField(props.prop);
2329
- const changeHandler = (value) => emit("change", value);
2330
- return (_ctx, _cache) => {
2331
- const _component_el_color_picker = vue.resolveComponent("el-color-picker");
2332
- return vue.openBlock(), vue.createBlock(_component_el_color_picker, {
2333
- modelValue: __props.model[__props.name],
2334
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.model[__props.name] = $event),
2335
- size: __props.size,
2336
- disabled: __props.disabled,
2337
- showAlpha: true,
2338
- onChange: changeHandler
2339
- }, null, 8, ["modelValue", "size", "disabled"]);
2340
- };
2341
- }
2342
- });
2343
-
2344
- const _sfc_main$h = vue.defineComponent({
2345
- name: "m-fields-date",
2346
- props: {
2347
- ...fieldProps,
2348
- config: {
2349
- type: Object,
2350
- required: true
2351
- }
2352
- },
2353
- emits: ["change", "input"],
2354
- setup(props, { emit }) {
2355
- useAddField(props.prop);
2356
- props.model[props.name] = utils.datetimeFormatter(props.model[props.name], "");
2357
- return {
2358
- changeHandler(v) {
2359
- emit("change", v);
2360
- }
2361
- };
2362
- }
2363
- });
2364
-
2365
- function _sfc_render$c(_ctx, _cache, $props, $setup, $data, $options) {
2366
- const _component_el_date_picker = vue.resolveComponent("el-date-picker");
2367
- return vue.openBlock(), vue.createBlock(_component_el_date_picker, {
2368
- modelValue: _ctx.model[_ctx.name],
2369
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
2370
- type: "date",
2371
- size: _ctx.size,
2372
- placeholder: _ctx.config.placeholder,
2373
- disabled: _ctx.disabled,
2374
- format: _ctx.config.format,
2375
- "value-format": _ctx.config.format || "YYYY-MM-DD HH:mm:ss",
2376
- onChange: _ctx.changeHandler
2377
- }, null, 8, ["modelValue", "size", "placeholder", "disabled", "format", "value-format", "onChange"]);
2378
- }
2379
- const Date$1 = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["render", _sfc_render$c]]);
2380
-
2381
- const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
2382
- __name: "Daterange",
2383
- props: {
2384
- config: null,
2385
- model: null,
2386
- initValues: null,
2387
- values: null,
2388
- name: null,
2389
- prop: null,
2390
- disabled: { type: Boolean },
2391
- size: null
2392
- },
2393
- emits: ["change"],
2394
- setup(__props, { emit }) {
2395
- const props = __props;
2396
- useAddField(props.prop);
2397
- const { names } = props.config;
2398
- const value = vue.ref([]);
2399
- if (props.model !== void 0) {
2400
- if (names?.length) {
2401
- vue.watch(
2402
- [() => props.model[names[0]], () => props.model[names[1]]],
2403
- ([start, end], [preStart, preEnd]) => {
2404
- if (!value.value) {
2405
- value.value = [];
2406
- }
2407
- if (!start || !end)
2408
- value.value = [];
2409
- if (start !== preStart)
2410
- value.value[0] = new Date(start);
2411
- if (end !== preEnd)
2412
- value.value[1] = new Date(end);
2413
- },
2414
- {
2415
- immediate: true
2416
- }
2417
- );
2418
- } else if (props.name && props.model[props.name]) {
2419
- vue.watch(
2420
- () => props.model[props.name],
2421
- (start, preStart) => {
2422
- if (start !== preStart)
2423
- value.value = start.map((item) => item ? new Date(item) : void 0);
2424
- },
2425
- {
2426
- immediate: true
2427
- }
2428
- );
2429
- }
2430
- }
2431
- const setValue = (v) => {
2432
- names?.forEach((item, index) => {
2433
- if (!props.model) {
2434
- return;
2435
- }
2436
- if (Array.isArray(v)) {
2437
- props.model[item] = utils.datetimeFormatter(v[index]?.toString(), "");
2438
- } else {
2439
- props.model[item] = void 0;
2440
- }
2441
- });
2442
- };
2443
- const changeHandler = (v) => {
2444
- const value2 = v || [];
2445
- if (props.name) {
2446
- emit(
2447
- "change",
2448
- value2.map((item) => {
2449
- if (item)
2450
- return utils.datetimeFormatter(item, "");
2451
- return void 0;
2452
- })
2453
- );
2454
- } else {
2455
- if (names?.length) {
2456
- setValue(value2);
2457
- }
2458
- emit("change", value2);
2459
- }
2460
- };
2461
- return (_ctx, _cache) => {
2462
- const _component_el_date_picker = vue.resolveComponent("el-date-picker");
2463
- return vue.openBlock(), vue.createBlock(_component_el_date_picker, {
2464
- modelValue: value.value,
2465
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event),
2466
- type: "datetimerange",
2467
- "range-separator": "-",
2468
- "start-placeholder": "\u5F00\u59CB\u65E5\u671F",
2469
- "end-placeholder": "\u7ED3\u675F\u65E5\u671F",
2470
- size: __props.size,
2471
- "unlink-panels": true,
2472
- disabled: __props.disabled,
2473
- "default-time": __props.config.defaultTime,
2474
- onChange: changeHandler
2475
- }, null, 8, ["modelValue", "size", "disabled", "default-time"]);
2476
- };
2477
- }
2478
- });
2479
-
2480
- const _sfc_main$f = vue.defineComponent({
2481
- name: "m-fields-datetime",
2482
- props: {
2483
- ...fieldProps,
2484
- config: {
2485
- type: Object,
2486
- required: true
2487
- }
2488
- },
2489
- emits: ["change"],
2490
- setup(props, { emit }) {
2491
- useAddField(props.prop);
2492
- const value = props.model?.[props.name].toString();
2493
- if (props.model) {
2494
- if (value === "Invalid Date") {
2495
- props.model[props.name] = "";
2496
- } else {
2497
- props.model[props.name] = utils.datetimeFormatter(props.model[props.name], "", props.config.valueFormat);
2498
- }
2499
- }
2500
- return {
2501
- value,
2502
- changeHandler: (v) => {
2503
- emit("change", v);
2504
- }
2505
- };
2506
- }
2507
- });
2508
-
2509
- function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
2510
- const _component_el_date_picker = vue.resolveComponent("el-date-picker");
2511
- return vue.openBlock(), vue.createBlock(_component_el_date_picker, {
2512
- modelValue: _ctx.model[_ctx.name],
2513
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
2514
- "popper-class": "magic-datetime-picker-popper",
2515
- type: "datetime",
2516
- size: _ctx.size,
2517
- placeholder: _ctx.config.placeholder,
2518
- disabled: _ctx.disabled,
2519
- format: _ctx.config.format || "YYYY-MM-DD HH:mm:ss",
2520
- "value-format": _ctx.config.valueFormat || "YYYY-MM-DD HH:mm:ss",
2521
- "default-time": _ctx.config.defaultTime,
2522
- onChange: _ctx.changeHandler
2523
- }, null, 8, ["modelValue", "size", "placeholder", "disabled", "format", "value-format", "default-time", "onChange"]);
2524
- }
2525
- const DateTime = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["render", _sfc_render$b]]);
2526
-
2527
- const _hoisted_1$5 = { key: 0 };
2528
- const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
2529
- __name: "Display",
2530
- props: {
2531
- config: null,
2532
- model: null,
2533
- initValues: null,
2534
- values: null,
2535
- name: null,
2536
- prop: null
2537
- },
2538
- setup(__props) {
2539
- const props = __props;
2540
- if (props.config.initValue && props.model) {
2541
- props.model[props.name] = props.config.initValue;
2542
- }
2543
- useAddField(props.prop);
2544
- return (_ctx, _cache) => {
2545
- return __props.model ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$5, vue.toDisplayString(__props.model[__props.name]), 1)) : vue.createCommentVNode("", true);
2546
- };
2547
- }
2548
- });
2549
-
2550
- const _sfc_main$d = vue.defineComponent({
2551
- name: "m-fields-dynamic-field",
2552
- props: {
2553
- ...fieldProps,
2554
- config: {
2555
- type: Object,
2556
- required: true
2557
- }
2558
- },
2559
- emits: ["change"],
2560
- setup(props, { emit }) {
2561
- useAddField(props.prop);
2562
- const request = getConfig("request");
2563
- const fieldMap = vue.reactive({
2564
- value: {}
2565
- });
2566
- const fieldLabelMap = vue.reactive({
2567
- value: {}
2568
- });
2569
- const changeFieldMap = async () => {
2570
- if (typeof props.config.returnFields !== "function" || !props.model)
2571
- return;
2572
- const fields = await props.config.returnFields(props.config, props.model, request);
2573
- fieldMap.value = {};
2574
- fieldLabelMap.value = {};
2575
- fields.forEach((v) => {
2576
- if (typeof v !== "object" || v.name === void 0)
2577
- return;
2578
- let oldVal = props.model?.[v.name] || "";
2579
- if (!oldVal && v.defaultValue !== void 0) {
2580
- oldVal = v.defaultValue;
2581
- emit("change", oldVal, v.name);
2582
- }
2583
- fieldMap.value[v.name] = oldVal;
2584
- fieldLabelMap.value[v.name] = v.label || "";
2585
- });
2586
- };
2587
- const unwatch = vue.watch(
2588
- () => props.model?.[props.config.dynamicKey],
2589
- (val) => {
2590
- if (val !== "") {
2591
- changeFieldMap();
2592
- }
2593
- },
2594
- {
2595
- immediate: true
2596
- }
2597
- );
2598
- vue.onBeforeUnmount(() => {
2599
- if (typeof unwatch === "function") {
2600
- unwatch();
2601
- }
2602
- });
2603
- return {
2604
- request,
2605
- fieldMap,
2606
- fieldLabelMap,
2607
- unwatch,
2608
- changeFieldMap,
2609
- inputChangeHandler: (key) => {
2610
- emit("change", fieldMap.value[key], key);
2611
- }
2612
- };
2613
- },
2614
- methods: {
2615
- init() {
2616
- }
2617
- }
2618
- });
2619
-
2620
- const _hoisted_1$4 = { class: "m-fields-dynamic-field" };
2621
- function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
2622
- const _component_el_input = vue.resolveComponent("el-input");
2623
- const _component_el_form_item = vue.resolveComponent("el-form-item");
2624
- const _component_el_form = vue.resolveComponent("el-form");
2625
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
2626
- vue.createVNode(_component_el_form, { size: "small" }, {
2627
- default: vue.withCtx(() => [
2628
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(Object.keys(_ctx.fieldMap.value), (key) => {
2629
- return vue.openBlock(), vue.createBlock(_component_el_form_item, {
2630
- key,
2631
- label: _ctx.fieldLabelMap.value[key]
2632
- }, {
2633
- default: vue.withCtx(() => [
2634
- vue.createVNode(_component_el_input, {
2635
- modelValue: _ctx.fieldMap.value[key],
2636
- "onUpdate:modelValue": ($event) => _ctx.fieldMap.value[key] = $event,
2637
- placeholder: _ctx.fieldLabelMap.value[key],
2638
- onChange: ($event) => _ctx.inputChangeHandler(key)
2639
- }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder", "onChange"])
2640
- ]),
2641
- _: 2
2642
- }, 1032, ["label"]);
2643
- }), 128))
2644
- ]),
2645
- _: 1
2646
- })
2647
- ]);
2648
- }
2649
- const DynamicField = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$a]]);
2650
-
2651
- const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
2652
- __name: "Hidden",
2653
- props: {
2654
- config: null,
2655
- model: null,
2656
- initValues: null,
2657
- values: null,
2658
- name: null,
2659
- prop: null
2660
- },
2661
- setup(__props) {
2662
- const props = __props;
2663
- useAddField(props.prop);
2664
- return (_ctx, _cache) => {
2665
- return __props.model ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
2666
- key: 0,
2667
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.model[__props.name] = $event),
2668
- type: "hidden"
2669
- }, null, 512)), [
2670
- [vue.vModelText, __props.model[__props.name]]
2671
- ]) : vue.createCommentVNode("", true);
2672
- };
2673
- }
2674
- });
2675
-
2676
- const _sfc_main$b = vue.defineComponent({
2677
- name: "m-fields-link",
2678
- props: {
2679
- ...fieldProps,
2680
- config: {
2681
- type: Object,
2682
- required: true
2683
- }
2684
- },
2685
- emits: ["change"],
2686
- setup(props, { emit }) {
2687
- useAddField(props.prop);
2688
- const formValue = vue.ref({});
2689
- const editor = vue.ref();
2690
- const mForm = vue.inject("mForm");
2691
- const href = vue.computed(() => {
2692
- if (typeof props.config.href === "function" && props.model) {
2693
- return props.config.href(props.model);
2694
- }
2695
- return props.config.href || props.model?.[props.name];
2696
- });
2697
- const init = () => {
2698
- formValue.value = props.model?.[props.name] || {};
2699
- };
2700
- return {
2701
- formValue,
2702
- editor,
2703
- href,
2704
- formConfig: vue.computed(() => {
2705
- if (typeof props.config.form === "function") {
2706
- return props.config.form(mForm, {
2707
- model: props.model || {},
2708
- values: props.values || {}
2709
- });
2710
- }
2711
- return props.config.form;
2712
- }),
2713
- disable: vue.computed(() => {
2714
- if (typeof props.config.disabled !== "undefined") {
2715
- return props.config.disabled;
2716
- }
2717
- return !href.value;
2718
- }),
2719
- displayText: vue.computed(() => {
2720
- if (typeof props.config.displayText === "function") {
2721
- return props.config.displayText(mForm, { model: props.model || {} });
2722
- }
2723
- if (props.config.displayText) {
2724
- return props.config.displayText;
2725
- }
2726
- return "\u8DF3\u8F6C";
2727
- }),
2728
- init,
2729
- editHandler: () => {
2730
- init();
2731
- editor.value && (editor.value.dialogVisible = true);
2732
- },
2733
- action: (data) => {
2734
- if (props.model) {
2735
- props.model[props.name] = data;
2736
- formValue.value = data;
2737
- emit("change", props.model[props.name]);
2738
- }
2739
- editor.value && (editor.value.dialogVisible = false);
2740
- }
2741
- };
2742
- }
2743
- });
2744
-
2745
- const _hoisted_1$3 = ["href"];
2746
- const _hoisted_2$1 = {
2747
- key: 2,
2748
- class: "m-fields-link"
2749
- };
2750
- const _hoisted_3$1 = /* @__PURE__ */ vue.createTextVNode("\u70B9\u51FB\u7F16\u8F91");
2751
- function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
2752
- const _component_el_button = vue.resolveComponent("el-button");
2753
- const _component_m_form_dialog = vue.resolveComponent("m-form-dialog");
2754
- return _ctx.config.href && !_ctx.disabled ? (vue.openBlock(), vue.createElementBlock("a", {
2755
- key: 0,
2756
- target: "_blank",
2757
- href: _ctx.href,
2758
- style: vue.normalizeStyle(_ctx.config.css || {})
2759
- }, vue.toDisplayString(_ctx.displayText), 13, _hoisted_1$3)) : _ctx.config.href && _ctx.disabled ? (vue.openBlock(), vue.createElementBlock("span", {
2760
- key: 1,
2761
- style: vue.normalizeStyle(_ctx.config.disabledCss || {})
2762
- }, vue.toDisplayString(_ctx.displayText), 5)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
2763
- vue.createVNode(_component_el_button, {
2764
- text: "",
2765
- type: "primary",
2766
- onClick: _ctx.editHandler
2767
- }, {
2768
- default: vue.withCtx(() => [
2769
- _hoisted_3$1
2770
- ]),
2771
- _: 1
2772
- }, 8, ["onClick"]),
2773
- vue.createVNode(_component_m_form_dialog, {
2774
- ref: "editor",
2775
- title: _ctx.config.formTitle || "\u7F16\u8F91\u6269\u5C55\u914D\u7F6E",
2776
- width: _ctx.config.formWidth,
2777
- values: _ctx.formValue,
2778
- config: _ctx.formConfig,
2779
- parentValues: _ctx.values,
2780
- fullscreen: _ctx.config.fullscreen,
2781
- onSubmit: _ctx.action
2782
- }, null, 8, ["title", "width", "values", "config", "parentValues", "fullscreen", "onSubmit"])
2783
- ]));
2784
- }
2785
- const Link = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$9]]);
2786
-
2787
- const _sfc_main$a = vue.defineComponent({
2788
- name: "m-fields-number",
2789
- props: {
2790
- ...fieldProps,
2791
- config: {
2792
- type: Object,
2793
- required: true
2794
- }
2795
- },
2796
- emits: ["change", "input"],
2797
- setup(props, { emit }) {
2798
- useAddField(props.prop);
2799
- const mForm = vue.inject("mForm");
2800
- return {
2801
- mForm,
2802
- changeHandler: (value) => {
2803
- emit("change", value);
2804
- },
2805
- inputHandler: (v) => {
2806
- emit("input", v);
2807
- mForm?.$emit("field-input", props.prop, v);
2808
- }
2809
- };
2810
- }
2811
- });
2812
-
2813
- function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
2814
- const _component_el_input_number = vue.resolveComponent("el-input-number");
2815
- return _ctx.model ? (vue.openBlock(), vue.createBlock(_component_el_input_number, {
2816
- key: 0,
2817
- modelValue: _ctx.model[_ctx.name],
2818
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
2819
- clearable: "",
2820
- "controls-position": "right",
2821
- size: _ctx.size,
2822
- max: _ctx.config.max,
2823
- min: _ctx.config.min,
2824
- step: _ctx.config.step,
2825
- placeholder: _ctx.config.placeholder,
2826
- disabled: _ctx.disabled,
2827
- onChange: _ctx.changeHandler,
2828
- onInput: _ctx.inputHandler
2829
- }, null, 8, ["modelValue", "size", "max", "min", "step", "placeholder", "disabled", "onChange", "onInput"])) : vue.createCommentVNode("", true);
2830
- }
2831
- const Number$1 = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$8]]);
2832
-
2833
- const _sfc_main$9 = vue.defineComponent({
2834
- name: "m-fields-radio-group",
2835
- props: {
2836
- ...fieldProps,
2837
- config: {
2838
- type: Object,
2839
- required: true
2840
- }
2841
- },
2842
- emits: ["change"],
2843
- setup(props, { emit }) {
2844
- useAddField(props.prop);
2845
- return {
2846
- changeHandler: (v) => emit("change", v)
2847
- };
2848
- }
2849
- });
2850
-
2851
- function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
2852
- const _component_el_radio = vue.resolveComponent("el-radio");
2853
- const _component_el_radio_group = vue.resolveComponent("el-radio-group");
2854
- return _ctx.model ? (vue.openBlock(), vue.createBlock(_component_el_radio_group, {
2855
- key: 0,
2856
- modelValue: _ctx.model[_ctx.name],
2857
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
2858
- size: _ctx.size,
2859
- disabled: _ctx.disabled,
2860
- onChange: _ctx.changeHandler
2861
- }, {
2862
- default: vue.withCtx(() => [
2863
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.config.options, (option) => {
2864
- return vue.openBlock(), vue.createBlock(_component_el_radio, {
2865
- label: option.value,
2866
- key: option.value
2867
- }, {
2868
- default: vue.withCtx(() => [
2869
- vue.createTextVNode(vue.toDisplayString(option.text), 1)
2870
- ]),
2871
- _: 2
2872
- }, 1032, ["label"]);
2873
- }), 128))
2874
- ]),
2875
- _: 1
2876
- }, 8, ["modelValue", "size", "disabled", "onChange"])) : vue.createCommentVNode("", true);
2877
- }
2878
- const RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render$7]]);
2879
-
2880
- const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
2881
- __name: "SelectOptionGroups",
2882
- props: {
2883
- options: null
2884
- },
2885
- setup(__props) {
2886
- return (_ctx, _cache) => {
2887
- const _component_el_option = vue.resolveComponent("el-option");
2888
- const _component_el_option_group = vue.resolveComponent("el-option-group");
2889
- return vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.options, (group, index) => {
2890
- return vue.openBlock(), vue.createBlock(_component_el_option_group, {
2891
- key: index,
2892
- label: group.label,
2893
- disabled: group.disabled
2894
- }, {
2895
- default: vue.withCtx(() => [
2896
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(group.options, (item, index2) => {
2897
- return vue.openBlock(), vue.createBlock(_component_el_option, {
2898
- key: index2,
2899
- label: item.label,
2900
- value: item.value,
2901
- disabled: item.disabled
2902
- }, null, 8, ["label", "value", "disabled"]);
2903
- }), 128))
2904
- ]),
2905
- _: 2
2906
- }, 1032, ["label", "disabled"]);
2907
- }), 128);
2908
- };
2909
- }
2910
- });
2911
-
2912
- const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
2913
- __name: "SelectOptions",
2914
- props: {
2915
- options: null,
2916
- valueKey: null
2917
- },
2918
- setup(__props) {
2919
- return (_ctx, _cache) => {
2920
- const _component_el_option = vue.resolveComponent("el-option");
2921
- return vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.options, (option) => {
2922
- return vue.openBlock(), vue.createBlock(_component_el_option, {
2923
- label: option.text,
2924
- value: option.value,
2925
- key: __props.valueKey ? option.value[__props.valueKey] : option.value,
2926
- disabled: option.disabled
2927
- }, null, 8, ["label", "value", "disabled"]);
2928
- }), 128);
2929
- };
2930
- }
2931
- });
2932
-
2933
- const _sfc_main$6 = vue.defineComponent({
2934
- name: "m-fields-select",
2935
- components: { SelectOptions: _sfc_main$7, SelectOptionGroups: _sfc_main$8 },
2936
- props: {
2937
- ...fieldProps,
2938
- config: {
2939
- type: Object,
2940
- required: true
2941
- }
2942
- },
2943
- emits: ["change"],
2944
- setup(props, { emit }) {
2945
- if (!props.model)
2946
- throw new Error("\u4E0D\u80FD\u6CA1\u6709model");
2947
- useAddField(props.prop);
2948
- const select = vue.ref();
2949
- const mForm = vue.inject("mForm");
2950
- const options = vue.ref([]);
2951
- const localOptions = vue.ref([]);
2952
- const loading = vue.ref(false);
2953
- const moreLoadingVisible = vue.ref(false);
2954
- const total = vue.ref(0);
2955
- const pgIndex = vue.ref(0);
2956
- const pgSize = vue.ref(20);
2957
- const query = vue.ref("");
2958
- const remoteData = vue.ref([]);
2959
- const remote = vue.ref(true);
2960
- const equalValue = (value, v) => {
2961
- if (typeof v === "object") {
2962
- const key = props.config.valueKey || "value";
2963
- return v[key] === value[key];
2964
- }
2965
- return value === v;
2966
- };
2967
- const mapOptions = (data) => {
2968
- const { option } = props.config;
2969
- const { text } = option;
2970
- const { value } = option;
2971
- return data.map((item) => ({
2972
- text: typeof text === "function" ? text(item) : item[text || "text"],
2973
- value: typeof value === "function" ? value(item) : item[value || "value"]
2974
- }));
2975
- };
2976
- const getOptions = async () => {
2977
- if (!props.model)
2978
- return [];
2979
- if (localOptions.value.length) {
2980
- return localOptions.value;
2981
- }
2982
- loading.value = true;
2983
- let items = [];
2984
- const { config } = props;
2985
- const { option } = config;
2986
- let { body } = option;
2987
- let postOptions = {
2988
- method: option.method || "POST",
2989
- url: option.url,
2990
- cache: option.cache,
2991
- timeout: option.timeout,
2992
- mode: option.mode,
2993
- headers: option.headers || {},
2994
- json: option.json || false
2995
- };
2996
- if (body) {
2997
- if (typeof body === "function") {
2998
- body = body(mForm, {
2999
- model: props.model,
3000
- formValue: mForm?.values,
3001
- formValues: mForm?.values,
3002
- config: props.config
3003
- });
3004
- }
3005
- body.query = query.value;
3006
- body.pgSize = pgSize.value;
3007
- body.pgIndex = pgIndex.value;
3008
- postOptions.data = body;
3009
- }
3010
- const requestFuc = getConfig("request");
3011
- if (typeof option.beforeRequest === "function") {
3012
- postOptions = option.beforeRequest(mForm, postOptions, {
3013
- model: props.model,
3014
- formValue: mForm?.values
3015
- });
3016
- }
3017
- if (option.method?.toLocaleLowerCase() === "jsonp") {
3018
- postOptions.jsonpCallback = option.jsonpCallback || "callback";
3019
- }
3020
- let res = await requestFuc(postOptions);
3021
- if (typeof option.afterRequest === "function") {
3022
- res = option.afterRequest(mForm, res, {
3023
- model: props.model,
3024
- formValue: mForm?.values,
3025
- formValues: mForm?.values,
3026
- config: props.config
3027
- });
3028
- }
3029
- const optionsData = res[option.root];
3030
- if (res.total > 0) {
3031
- total.value = res.total;
3032
- }
3033
- remoteData.value = remoteData.value.concat(optionsData);
3034
- if (optionsData) {
3035
- if (typeof option.item === "function") {
3036
- items = option.item(optionsData);
3037
- } else if (optionsData.map) {
3038
- items = mapOptions(optionsData);
3039
- }
3040
- }
3041
- loading.value = false;
3042
- const selectedOptions = [];
3043
- if (props.config.multiple && props.model[props.name]) {
3044
- options.value.forEach((o) => {
3045
- const isInclude = props.model?.[props.name].includes(o.value);
3046
- if (isInclude && !items.find((op) => op.value === o.value)) {
3047
- selectedOptions.push(o);
3048
- }
3049
- });
3050
- }
3051
- return pgIndex.value === 0 ? selectedOptions.concat(items) : options.value.concat(items);
3052
- };
3053
- const getInitLocalOption = async () => {
3054
- if (!props.model)
3055
- return [];
3056
- const value = props.model[props.name];
3057
- const { config } = props;
3058
- localOptions.value = await getOptions();
3059
- remote.value = false;
3060
- if (config.group) {
3061
- if (config.multiple && value.findIndex) {
3062
- return localOptions.value.filter(
3063
- (group) => group.options.findIndex((item) => value.find((v) => equalValue(item.value, v)) > -1) > -1
3064
- );
3065
- }
3066
- return localOptions.value.filter(
3067
- (group) => group.options.findIndex((item) => equalValue(item.value, value)) > -1
3068
- );
3069
- }
3070
- if (config.multiple && value.findIndex) {
3071
- return localOptions.value.filter(
3072
- (item) => value.findIndex((v) => equalValue(item.value, v)) > -1
3073
- );
3074
- }
3075
- return localOptions.value.filter((item) => equalValue(item.value, value));
3076
- };
3077
- const getInitOption = async () => {
3078
- if (!props.model)
3079
- return [];
3080
- const { config } = props;
3081
- const { option } = config;
3082
- let options2 = [];
3083
- let url = option.initUrl;
3084
- if (!url) {
3085
- return getInitLocalOption();
3086
- }
3087
- if (typeof url === "function") {
3088
- url = await url(mForm, { model: props.model, formValue: mForm?.values });
3089
- }
3090
- const postOptions = {
3091
- method: option.method || "POST",
3092
- url,
3093
- data: {
3094
- id: props.model[props.name]
3095
- },
3096
- mode: option.mode,
3097
- headers: option.headers || {},
3098
- json: option.json || false
3099
- };
3100
- if (option.method?.toLocaleLowerCase() === "jsonp") {
3101
- postOptions.jsonpCallback = option.jsonpCallback || "callback";
3102
- }
3103
- const requestFuc = getConfig("request");
3104
- const res = await requestFuc(postOptions);
3105
- let initData = res[option.root];
3106
- if (initData) {
3107
- if (!Array.isArray(initData)) {
3108
- initData = [initData];
3109
- }
3110
- if (typeof option.item === "function") {
3111
- options2 = option.item(initData);
3112
- } else if (initData.map) {
3113
- options2 = mapOptions(initData);
3114
- }
3115
- }
3116
- return options2;
3117
- };
3118
- if (typeof props.config.options === "function") {
3119
- vue.watchEffect(() => {
3120
- typeof props.config.options === "function" && Promise.resolve(
3121
- props.config.options(mForm, {
3122
- model: props.model,
3123
- prop: props.prop,
3124
- formValues: mForm?.values,
3125
- formValue: mForm?.values,
3126
- config: props.config
3127
- })
3128
- ).then((data) => {
3129
- options.value = data;
3130
- });
3131
- });
3132
- } else if (Array.isArray(props.config.options)) {
3133
- vue.watchEffect(() => {
3134
- options.value = props.config.options;
3135
- });
3136
- } else if (props.config.option) {
3137
- vue.onBeforeMount(() => {
3138
- if (!props.model)
3139
- return;
3140
- const v = props.model[props.name];
3141
- if (Array.isArray(v) ? v.length : typeof v !== "undefined") {
3142
- getInitOption().then((data) => {
3143
- options.value = data;
3144
- });
3145
- }
3146
- });
3147
- }
3148
- props.config.remote && vue.onMounted(() => {
3149
- select.value?.scrollbar.wrap$.addEventListener("scroll", async (e) => {
3150
- const el = e.currentTarget;
3151
- if (moreLoadingVisible.value) {
3152
- return;
3153
- }
3154
- if (el.scrollHeight - el.clientHeight - el.scrollTop > 1) {
3155
- return;
3156
- }
3157
- if (total.value <= options.value.length) {
3158
- return;
3159
- }
3160
- moreLoadingVisible.value = true;
3161
- pgIndex.value += 1;
3162
- options.value = await getOptions();
3163
- moreLoadingVisible.value = false;
3164
- });
3165
- });
3166
- return {
3167
- select,
3168
- loading,
3169
- remote,
3170
- options,
3171
- groupOptions: options,
3172
- moreLoadingVisible,
3173
- popperClass: mForm?.popperClass,
3174
- getOptions,
3175
- getRequestFuc() {
3176
- return getConfig("request");
3177
- },
3178
- changeHandler(value) {
3179
- emit("change", value);
3180
- },
3181
- async visibleHandler(visible) {
3182
- if (!visible)
3183
- return;
3184
- if (!props.config.remote)
3185
- return;
3186
- if (query.value && select.value) {
3187
- select.value.query = query.value;
3188
- select.value.previousQuery = query.value;
3189
- select.value.selectedLabel = query.value;
3190
- } else if (options.value.length <= (props.config.multiple ? props.model?.[props.name].length : 1)) {
3191
- options.value = await getOptions();
3192
- }
3193
- },
3194
- async remoteMethod(q) {
3195
- if (!localOptions.value.length) {
3196
- query.value = q;
3197
- pgIndex.value = 0;
3198
- options.value = await getOptions();
3199
- if (props.config.multiple)
3200
- setTimeout(() => {
3201
- select.value?.setSelected();
3202
- }, 0);
3203
- }
3204
- }
3205
- };
3206
- }
3207
- });
3208
-
3209
- const _hoisted_1$2 = { key: 2 };
3210
- function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
3211
- const _component_select_option_groups = vue.resolveComponent("select-option-groups");
3212
- const _component_select_options = vue.resolveComponent("select-options");
3213
- const _component_el_select = vue.resolveComponent("el-select");
3214
- const _directive_loading = vue.resolveDirective("loading");
3215
- return _ctx.model ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_el_select, {
3216
- key: 0,
3217
- modelValue: _ctx.model[_ctx.name],
3218
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
3219
- class: "m-select",
3220
- ref: "select",
3221
- clearable: "",
3222
- filterable: "",
3223
- "popper-class": `m-select-popper ${_ctx.popperClass}`,
3224
- size: _ctx.size,
3225
- remote: _ctx.remote,
3226
- placeholder: _ctx.config.placeholder,
3227
- multiple: _ctx.config.multiple,
3228
- "value-key": _ctx.config.valueKey || "value",
3229
- "allow-create": _ctx.config.allowCreate,
3230
- disabled: _ctx.disabled,
3231
- "remote-method": _ctx.config.remote && _ctx.remoteMethod,
3232
- onChange: _ctx.changeHandler,
3233
- onVisibleChange: _ctx.visibleHandler
3234
- }, {
3235
- default: vue.withCtx(() => [
3236
- _ctx.config.group ? (vue.openBlock(), vue.createBlock(_component_select_option_groups, {
3237
- key: 0,
3238
- options: _ctx.groupOptions
3239
- }, null, 8, ["options"])) : (vue.openBlock(), vue.createBlock(_component_select_options, {
3240
- key: 1,
3241
- options: _ctx.options
3242
- }, null, 8, ["options"])),
3243
- _ctx.moreLoadingVisible ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, null, 512)), [
3244
- [_directive_loading, true]
3245
- ]) : vue.createCommentVNode("", true)
3246
- ]),
3247
- _: 1
3248
- }, 8, ["modelValue", "popper-class", "size", "remote", "placeholder", "multiple", "value-key", "allow-create", "disabled", "remote-method", "onChange", "onVisibleChange"])), [
3249
- [_directive_loading, _ctx.loading]
3250
- ]) : vue.createCommentVNode("", true);
3251
- }
3252
- const Select = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6]]);
3253
-
3254
- const _sfc_main$5 = vue.defineComponent({
3255
- name: "m-fields-switch",
3256
- props: {
3257
- ...fieldProps,
3258
- config: {
3259
- type: Object,
3260
- required: true
3261
- }
3262
- },
3263
- emits: ["change"],
3264
- setup(props, { emit }) {
3265
- useAddField(props.prop);
3266
- return {
3267
- n: vue.computed(() => props.name || props.config.name || ""),
3268
- activeValue: vue.computed(() => {
3269
- if (typeof props.config.activeValue === "undefined") {
3270
- if (props.config.filter === "number") {
3271
- return 1;
3272
- }
3273
- } else {
3274
- return props.config.activeValue;
3275
- }
3276
- return true;
3277
- }),
3278
- inactiveValue: vue.computed(() => {
3279
- if (typeof props.config.inactiveValue === "undefined") {
3280
- if (props.config.filter === "number") {
3281
- return 0;
3282
- }
3283
- } else {
3284
- return props.config.inactiveValue;
3285
- }
3286
- return false;
3287
- }),
3288
- changeHandler: (v) => {
3289
- emit("change", v);
3290
- }
3291
- };
3292
- }
3293
- });
3294
-
3295
- function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
3296
- const _component_el_switch = vue.resolveComponent("el-switch");
3297
- return _ctx.model ? (vue.openBlock(), vue.createBlock(_component_el_switch, {
3298
- key: 0,
3299
- modelValue: _ctx.model[_ctx.n],
3300
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.n] = $event),
3301
- size: _ctx.size,
3302
- activeValue: _ctx.activeValue,
3303
- inactiveValue: _ctx.inactiveValue,
3304
- disabled: _ctx.disabled,
3305
- onChange: _ctx.changeHandler
3306
- }, null, 8, ["modelValue", "size", "activeValue", "inactiveValue", "disabled", "onChange"])) : vue.createCommentVNode("", true);
3307
- }
3308
- const Switch = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$5]]);
3309
-
3310
- const _sfc_main$4 = vue.defineComponent({
3311
- name: "m-fields-text",
3312
- props: {
3313
- ...fieldProps,
3314
- config: {
3315
- type: Object,
3316
- required: true
3317
- }
3318
- },
3319
- emits: ["change", "input"],
3320
- setup(props, { emit }) {
3321
- const mForm = vue.inject("mForm");
3322
- useAddField(props.prop);
3323
- const modelName = vue.computed(() => props.name || props.config.name || "");
3324
- return {
3325
- modelName,
3326
- changeHandler(v) {
3327
- emit("change", v);
3328
- },
3329
- inputHandler(v) {
3330
- emit("input", v);
3331
- mForm?.$emit("field-input", props.prop, v);
3332
- },
3333
- buttonClickHandler() {
3334
- if (typeof props.config.append === "string")
3335
- return;
3336
- if (props.config.append?.handler) {
3337
- props.config.append.handler(mForm, {
3338
- model: props.model,
3339
- values: mForm?.values
3340
- });
3341
- }
3342
- },
3343
- keyUpHandler($event) {
3344
- if (!props.model)
3345
- return;
3346
- if (!modelName.value)
3347
- return;
3348
- const arrowUp = $event.key === "ArrowUp";
3349
- const arrowDown = $event.key === "ArrowDown";
3350
- if (!arrowUp && !arrowDown) {
3351
- return;
3352
- }
3353
- const value = props.model[modelName.value];
3354
- let num;
3355
- let unit;
3356
- if (utils.isNumber(value)) {
3357
- num = +value;
3358
- } else {
3359
- value.replace(/^([0-9.]+)([a-z%]+)$/, ($0, $1, $2) => {
3360
- num = +$1;
3361
- unit = $2;
3362
- });
3363
- }
3364
- if (num === void 0) {
3365
- return;
3366
- }
3367
- const ctrl = navigator.platform.match("Mac") ? $event.metaKey : $event.ctrlKey;
3368
- const shift = $event.shiftKey;
3369
- const alt = $event.altKey;
3370
- if (arrowUp) {
3371
- if (ctrl) {
3372
- num += 100;
3373
- } else if (alt) {
3374
- num = (num * 1e4 + 1e3) / 1e4;
3375
- } else if (shift) {
3376
- num = num + 10;
3377
- } else {
3378
- num += 1;
3379
- }
3380
- } else if (arrowDown) {
3381
- if (ctrl) {
3382
- num -= 100;
3383
- } else if (alt) {
3384
- num = (num * 1e4 - 1e3) / 1e4;
3385
- } else if (shift) {
3386
- num -= 10;
3387
- } else {
3388
- num -= 1;
3389
- }
3390
- }
3391
- props.model[modelName.value] = `${num}${unit || ""}`;
3392
- emit("change", props.model[modelName.value]);
3393
- }
3394
- };
3395
- }
3396
- });
3397
-
3398
- const _hoisted_1$1 = { key: 0 };
3399
- function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
3400
- const _component_el_button = vue.resolveComponent("el-button");
3401
- const _component_el_input = vue.resolveComponent("el-input");
3402
- return vue.openBlock(), vue.createBlock(_component_el_input, {
3403
- modelValue: _ctx.model[_ctx.modelName],
3404
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.modelName] = $event),
3405
- clearable: "",
3406
- size: _ctx.size,
3407
- placeholder: _ctx.config.placeholder,
3408
- disabled: _ctx.disabled,
3409
- onChange: _ctx.changeHandler,
3410
- onInput: _ctx.inputHandler,
3411
- onKeyup: _cache[1] || (_cache[1] = ($event) => _ctx.keyUpHandler($event))
3412
- }, vue.createSlots({ _: 2 }, [
3413
- _ctx.config.append ? {
3414
- name: "append",
3415
- fn: vue.withCtx(() => [
3416
- typeof _ctx.config.append === "string" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$1, vue.toDisplayString(_ctx.config.append), 1)) : vue.createCommentVNode("", true),
3417
- typeof _ctx.config.append === "object" && _ctx.config.append.type === "button" ? (vue.openBlock(), vue.createBlock(_component_el_button, {
3418
- key: 1,
3419
- style: { "color": "#409eff" },
3420
- size: _ctx.size,
3421
- onClick: vue.withModifiers(_ctx.buttonClickHandler, ["prevent"])
3422
- }, {
3423
- default: vue.withCtx(() => [
3424
- vue.createTextVNode(vue.toDisplayString(_ctx.config.append.text), 1)
3425
- ]),
3426
- _: 1
3427
- }, 8, ["size", "onClick"])) : vue.createCommentVNode("", true)
3428
- ])
3429
- } : void 0
3430
- ]), 1032, ["modelValue", "size", "placeholder", "disabled", "onChange", "onInput"]);
3431
- }
3432
- const Text = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$4]]);
3433
-
3434
- const _sfc_main$3 = vue.defineComponent({
3435
- name: "m-fields-textarea",
3436
- props: {
3437
- ...fieldProps,
3438
- config: {
3439
- type: Object,
3440
- required: true
3441
- }
3442
- },
3443
- emits: {
3444
- change(values) {
3445
- return values;
3446
- },
3447
- input(values) {
3448
- return values;
3449
- }
3450
- },
3451
- setup(props, { emit }) {
3452
- useAddField(props.prop);
3453
- const mForm = vue.inject("mForm");
3454
- return {
3455
- mForm,
3456
- changeHandler: (v) => {
3457
- emit("change", v);
3458
- },
3459
- inputHandler: (v) => {
3460
- emit("input", v);
3461
- mForm?.$emit("field-input", props.prop, v);
3462
- }
3463
- };
3464
- }
3465
- });
3466
-
3467
- function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
3468
- const _component_el_input = vue.resolveComponent("el-input");
3469
- return vue.openBlock(), vue.createBlock(_component_el_input, {
3470
- modelValue: _ctx.model[_ctx.name],
3471
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
3472
- type: "textarea",
3473
- size: _ctx.size,
3474
- clearable: "",
3475
- placeholder: _ctx.config.placeholder,
3476
- disabled: _ctx.disabled,
3477
- onChange: _ctx.changeHandler,
3478
- onInput: _ctx.inputHandler
3479
- }, null, 8, ["modelValue", "size", "placeholder", "disabled", "onChange", "onInput"]);
3480
- }
3481
- const Textarea = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
3482
-
3483
- const _sfc_main$2 = vue.defineComponent({
3484
- name: "m-fields-time",
3485
- props: {
3486
- ...fieldProps,
3487
- config: {
3488
- type: Object,
3489
- required: true
3490
- }
3491
- },
3492
- emits: {
3493
- change(values) {
3494
- return values;
3495
- }
3496
- },
3497
- setup(props, { emit }) {
3498
- useAddField(props.prop);
3499
- return {
3500
- changeHandler: (v) => {
3501
- emit("change", v);
3502
- }
3503
- };
3504
- }
3505
- });
3506
-
3507
- function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
3508
- const _component_el_time_picker = vue.resolveComponent("el-time-picker");
3509
- return vue.openBlock(), vue.createBlock(_component_el_time_picker, {
3510
- modelValue: _ctx.model[_ctx.name],
3511
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model[_ctx.name] = $event),
3512
- size: _ctx.size,
3513
- "value-format": "HH:mm:ss",
3514
- placeholder: _ctx.config.placeholder,
3515
- disabled: _ctx.disabled,
3516
- onChange: _ctx.changeHandler
3517
- }, null, 8, ["modelValue", "size", "placeholder", "disabled", "onChange"]);
3518
- }
3519
- const Time = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
3520
-
3521
- const _sfc_main$1 = vue.defineComponent({
3522
- name: "m-form",
3523
- props: {
3524
- initValues: {
3525
- type: Object,
3526
- required: true,
3527
- default: () => ({})
3528
- },
3529
- parentValues: {
3530
- type: Object,
3531
- default: () => ({})
3532
- },
3533
- config: {
3534
- type: Array,
3535
- required: true,
3536
- default: () => []
3537
- },
3538
- labelWidth: {
3539
- type: String,
3540
- default: () => "200px"
3541
- },
3542
- disabled: {
3543
- type: Boolean,
3544
- default: () => false
3545
- },
3546
- height: {
3547
- type: String,
3548
- default: () => "auto"
3549
- },
3550
- stepActive: {
3551
- type: [String, Number],
3552
- default: () => 1
3553
- },
3554
- size: {
3555
- type: String
3556
- },
3557
- inline: {
3558
- type: Boolean,
3559
- default: false
3560
- },
3561
- labelPosition: {
3562
- type: String,
3563
- default: "right"
3564
- },
3565
- keyProp: {
3566
- type: String,
3567
- default: "__key"
3568
- },
3569
- popperClass: {
3570
- type: String
3571
- }
3572
- },
3573
- emits: ["change", "field-input", "field-change"],
3574
- setup(props, { emit }) {
3575
- const elForm = vue.ref();
3576
- const initialized = vue.ref(false);
3577
- const values = vue.ref({});
3578
- const fields = /* @__PURE__ */ new Map();
3579
- const requestFuc = getConfig("request");
3580
- const formState = vue.reactive({
3581
- keyProp: props.keyProp,
3582
- popperClass: props.popperClass,
3583
- config: props.config,
3584
- initValues: props.initValues,
3585
- parentValues: props.parentValues,
3586
- values,
3587
- $emit: emit,
3588
- fields,
3589
- setField: (prop, field) => fields.set(prop, field),
3590
- getField: (prop) => fields.get(prop),
3591
- deleteField: (prop) => fields.delete(prop),
3592
- post: (options) => {
3593
- if (requestFuc) {
3594
- return requestFuc({
3595
- ...options,
3596
- method: "POST"
3597
- });
3598
- }
3599
- }
3600
- });
3601
- vue.provide("mForm", formState);
3602
- vue.watch(
3603
- [() => props.config, () => props.initValues],
3604
- ([config], [preConfig]) => {
3605
- if (!lodashEs.isEqual(vue.toRaw(config), vue.toRaw(preConfig))) {
3606
- initialized.value = false;
3607
- }
3608
- initValue(formState, {
3609
- initValues: props.initValues,
3610
- config: props.config
3611
- }).then((value) => {
3612
- values.value = value;
3613
- initialized.value = true;
3614
- });
3615
- },
3616
- { immediate: true }
3617
- );
3618
- return {
3619
- initialized,
3620
- values,
3621
- elForm,
3622
- formState,
3623
- changeHandler: () => {
3624
- emit("change", values.value);
3625
- },
3626
- resetForm: () => elForm.value?.resetFields(),
3627
- submitForm: async (native) => {
3628
- try {
3629
- await elForm.value?.validate();
3630
- return native ? values.value : lodashEs.cloneDeep(vue.toRaw(values.value));
3631
- } catch (invalidFields) {
3632
- const error = [];
3633
- Object.entries(invalidFields).forEach(([, ValidateError]) => {
3634
- ValidateError.forEach(({ field, message }) => {
3635
- if (field && message)
3636
- error.push(`${field} -> ${message}`);
3637
- if (field && !message)
3638
- error.push(`${field} -> \u51FA\u73B0\u9519\u8BEF`);
3639
- if (!field && message)
3640
- error.push(`${message}`);
3641
- });
3642
- });
3643
- throw new Error(error.join("<br>"));
3644
- }
3645
- }
3646
- };
3647
- }
3648
- });
3649
-
3650
- function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
3651
- const _component_m_form_container = vue.resolveComponent("m-form-container");
3652
- const _component_el_form = vue.resolveComponent("el-form");
3653
- return vue.openBlock(), vue.createBlock(_component_el_form, {
3654
- class: "m-form",
3655
- ref: "elForm",
3656
- model: _ctx.values,
3657
- "label-width": _ctx.labelWidth,
3658
- disabled: _ctx.disabled,
3659
- style: vue.normalizeStyle(`height: ${_ctx.height}`),
3660
- inline: _ctx.inline,
3661
- "label-position": _ctx.labelPosition
3662
- }, {
3663
- default: vue.withCtx(() => [
3664
- _ctx.initialized && Array.isArray(_ctx.config) ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.config, (item, index) => {
3665
- return vue.openBlock(), vue.createBlock(_component_m_form_container, {
3666
- key: item[_ctx.keyProp] ?? index,
3667
- config: item,
3668
- model: _ctx.values,
3669
- "label-width": item.labelWidth || _ctx.labelWidth,
3670
- "step-active": _ctx.stepActive,
3671
- size: _ctx.size,
3672
- onChange: _ctx.changeHandler
3673
- }, null, 8, ["config", "model", "label-width", "step-active", "size", "onChange"]);
3674
- }), 128)) : vue.createCommentVNode("", true)
3675
- ]),
3676
- _: 1
3677
- }, 8, ["model", "label-width", "disabled", "style", "inline", "label-position"]);
3678
- }
3679
- const Form = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
3680
-
3681
- const _sfc_main = vue.defineComponent({
3682
- name: "m-form-dialog",
3683
- props: {
3684
- values: {
3685
- type: Object,
3686
- default: () => ({})
3687
- },
3688
- parentValues: {
3689
- type: Object
3690
- },
3691
- width: [Number, String],
3692
- fullscreen: Boolean,
3693
- title: String,
3694
- config: {
3695
- type: Array,
3696
- required: true,
3697
- default: () => []
3698
- },
3699
- labelWidth: [Number, String],
3700
- size: String,
3701
- confirmText: {
3702
- type: String,
3703
- default: "\u786E\u5B9A"
3704
- }
3705
- },
3706
- emits: ["close", "submit", "error", "change"],
3707
- setup(props, { emit }) {
3708
- const form = vue.ref();
3709
- const dialogVisible = vue.ref(false);
3710
- const saveFetch = vue.ref(false);
3711
- const stepActive = vue.ref(1);
3712
- const bodyHeight = vue.ref(`${document.body.clientHeight - 194}px`);
3713
- const stepCount = vue.computed(() => {
3714
- const { length } = props.config;
3715
- for (let index = 0; index < length; index++) {
3716
- if (props.config[index].type === "step") {
3717
- return props.config[index].items.length;
3718
- }
3719
- }
3720
- return 0;
3721
- });
3722
- const hasStep = vue.computed(() => {
3723
- const { length } = props.config;
3724
- for (let index = 0; index < length; index++) {
3725
- if (props.config[index].type === "step") {
3726
- return true;
3727
- }
3728
- }
3729
- return false;
3730
- });
3731
- const cancel = () => {
3732
- dialogVisible.value = false;
3733
- };
3734
- const closeHandler = () => {
3735
- stepActive.value = 1;
3736
- emit("close");
3737
- };
3738
- const save = async () => {
3739
- try {
3740
- const values = await form.value?.submitForm();
3741
- emit("submit", values);
3742
- } catch (e) {
3743
- emit("error", e);
3744
- }
3745
- };
3746
- const preStep = () => {
3747
- stepActive.value -= 1;
3748
- };
3749
- const nextStep = () => {
3750
- stepActive.value += 1;
3751
- };
3752
- const changeHandler = (value) => {
3753
- emit("change", value);
3754
- };
3755
- return {
3756
- form,
3757
- saveFetch,
3758
- stepActive,
3759
- dialogVisible,
3760
- bodyHeight,
3761
- stepCount,
3762
- hasStep,
3763
- cancel,
3764
- closeHandler,
3765
- save,
3766
- preStep,
3767
- nextStep,
3768
- changeHandler
3769
- };
3770
- }
3771
- });
3772
-
3773
- const _hoisted_1 = { style: { "min-height": "1px" } };
3774
- const _hoisted_2 = /* @__PURE__ */ vue.createTextVNode("\u53D6 \u6D88");
3775
- const _hoisted_3 = /* @__PURE__ */ vue.createTextVNode("\u4E0A\u4E00\u6B65");
3776
- const _hoisted_4 = /* @__PURE__ */ vue.createTextVNode("\u4E0B\u4E00\u6B65");
3777
- function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
3778
- const _component_m_form = vue.resolveComponent("m-form");
3779
- const _component_el_col = vue.resolveComponent("el-col");
3780
- const _component_el_button = vue.resolveComponent("el-button");
3781
- const _component_el_row = vue.resolveComponent("el-row");
3782
- const _component_el_dialog = vue.resolveComponent("el-dialog");
3783
- return vue.openBlock(), vue.createBlock(_component_el_dialog, {
3784
- modelValue: _ctx.dialogVisible,
3785
- "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.dialogVisible = $event),
3786
- class: "m-form-dialog",
3787
- top: "20px",
3788
- "append-to-body": "",
3789
- title: _ctx.title,
3790
- width: _ctx.width,
3791
- fullscreen: _ctx.fullscreen,
3792
- "close-on-click-modal": false,
3793
- onClose: _ctx.closeHandler
3794
- }, {
3795
- footer: vue.withCtx(() => [
3796
- vue.createVNode(_component_el_row, { class: "dialog-footer" }, {
3797
- default: vue.withCtx(() => [
3798
- vue.createVNode(_component_el_col, {
3799
- span: 12,
3800
- style: { "text-align": "left" }
3801
- }, {
3802
- default: vue.withCtx(() => [
3803
- vue.createElementVNode("div", _hoisted_1, [
3804
- vue.renderSlot(_ctx.$slots, "left")
3805
- ])
3806
- ]),
3807
- _: 3
3808
- }),
3809
- vue.createVNode(_component_el_col, { span: 12 }, {
3810
- default: vue.withCtx(() => [
3811
- vue.renderSlot(_ctx.$slots, "footer", {}, () => [
3812
- vue.createVNode(_component_el_button, {
3813
- onClick: _ctx.cancel,
3814
- size: "small"
3815
- }, {
3816
- default: vue.withCtx(() => [
3817
- _hoisted_2
3818
- ]),
3819
- _: 1
3820
- }, 8, ["onClick"]),
3821
- _ctx.hasStep && _ctx.stepActive > 1 ? (vue.openBlock(), vue.createBlock(_component_el_button, {
3822
- key: 0,
3823
- type: "info",
3824
- size: "small",
3825
- onClick: _ctx.preStep
3826
- }, {
3827
- default: vue.withCtx(() => [
3828
- _hoisted_3
3829
- ]),
3830
- _: 1
3831
- }, 8, ["onClick"])) : vue.createCommentVNode("", true),
3832
- _ctx.hasStep && _ctx.stepCount > _ctx.stepActive ? (vue.openBlock(), vue.createBlock(_component_el_button, {
3833
- key: 1,
3834
- type: "info",
3835
- size: "small",
3836
- onClick: _ctx.nextStep
3837
- }, {
3838
- default: vue.withCtx(() => [
3839
- _hoisted_4
3840
- ]),
3841
- _: 1
3842
- }, 8, ["onClick"])) : (vue.openBlock(), vue.createBlock(_component_el_button, {
3843
- key: 2,
3844
- type: "primary",
3845
- size: "small",
3846
- loading: _ctx.saveFetch,
3847
- onClick: _ctx.save
3848
- }, {
3849
- default: vue.withCtx(() => [
3850
- vue.createTextVNode(vue.toDisplayString(_ctx.confirmText), 1)
3851
- ]),
3852
- _: 1
3853
- }, 8, ["loading", "onClick"]))
3854
- ])
3855
- ]),
3856
- _: 3
3857
- })
3858
- ]),
3859
- _: 3
3860
- })
3861
- ]),
3862
- default: vue.withCtx(() => [
3863
- _ctx.dialogVisible ? (vue.openBlock(), vue.createElementBlock("div", {
3864
- key: 0,
3865
- class: "m-dialog-body",
3866
- style: vue.normalizeStyle(`max-height: ${_ctx.bodyHeight}; overflow-y: auto; overflow-x: hidden;`)
3867
- }, [
3868
- vue.createVNode(_component_m_form, {
3869
- modelValue: _ctx.stepActive,
3870
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.stepActive = $event),
3871
- ref: "form",
3872
- size: _ctx.size,
3873
- config: _ctx.config,
3874
- "init-values": _ctx.values,
3875
- "parent-values": _ctx.parentValues,
3876
- "label-width": _ctx.labelWidth,
3877
- onChange: _ctx.changeHandler
3878
- }, null, 8, ["modelValue", "size", "config", "init-values", "parent-values", "label-width", "onChange"]),
3879
- vue.renderSlot(_ctx.$slots, "default")
3880
- ], 4)) : vue.createCommentVNode("", true)
3881
- ]),
3882
- _: 3
3883
- }, 8, ["modelValue", "title", "width", "fullscreen", "onClose"]);
3884
- }
3885
- const FormDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
3886
-
3887
- const index$1 = '';
3888
-
3889
- const defaultInstallOpt = {};
3890
- const install = (app, opt) => {
3891
- const option = Object.assign(defaultInstallOpt, opt);
3892
- app.config.globalProperties.$MAGIC_FORM = option;
3893
- setConfig(option);
3894
- app.component(Form.name, Form);
3895
- app.component(FormDialog.name, FormDialog);
3896
- app.component(Container.name, Container);
3897
- app.component("m-form-fieldset", _sfc_main$t);
3898
- app.component(GroupList.name, GroupList);
3899
- app.component(Panel.name, Panel);
3900
- app.component(Row.name, Row);
3901
- app.component(MStep.name, MStep);
3902
- app.component("m-form-table", Table);
3903
- app.component(Tabs.name, Tabs);
3904
- app.component(Text.name, Text);
3905
- app.component(Number$1.name, Number$1);
3906
- app.component(Textarea.name, Textarea);
3907
- app.component("m-fields-hidden", _sfc_main$c);
3908
- app.component(Date$1.name, Date$1);
3909
- app.component(DateTime.name, DateTime);
3910
- app.component(Time.name, Time);
3911
- app.component(Checkbox.name, Checkbox);
3912
- app.component(Switch.name, Switch);
3913
- app.component("m-fields-daterange", _sfc_main$g);
3914
- app.component("m-fields-color-picker", _sfc_main$i);
3915
- app.component(CheckboxGroup.name, CheckboxGroup);
3916
- app.component(RadioGroup.name, RadioGroup);
3917
- app.component("m-fields-display", _sfc_main$e);
3918
- app.component(Link.name, Link);
3919
- app.component(Select.name, Select);
3920
- app.component(Cascader.name, Cascader);
3921
- app.component(DynamicField.name, DynamicField);
3922
- };
3923
- const index = {
3924
- install
3925
- };
3926
-
3927
- exports.MCascader = Cascader;
3928
- exports.MCheckbox = Checkbox;
3929
- exports.MCheckboxGroup = CheckboxGroup;
3930
- exports.MColorPicker = _sfc_main$i;
3931
- exports.MContainer = Container;
3932
- exports.MDate = Date$1;
3933
- exports.MDateTime = DateTime;
3934
- exports.MDaterange = _sfc_main$g;
3935
- exports.MDisplay = _sfc_main$e;
3936
- exports.MDynamicField = DynamicField;
3937
- exports.MFieldset = _sfc_main$t;
3938
- exports.MForm = Form;
3939
- exports.MFormDialog = FormDialog;
3940
- exports.MGroupList = GroupList;
3941
- exports.MHidden = _sfc_main$c;
3942
- exports.MLink = Link;
3943
- exports.MNumber = Number$1;
3944
- exports.MPanel = Panel;
3945
- exports.MRadioGroup = RadioGroup;
3946
- exports.MRow = Row;
3947
- exports.MSelect = Select;
3948
- exports.MSwitch = Switch;
3949
- exports.MTable = Table;
3950
- exports.MTabs = Tabs;
3951
- exports.MText = Text;
3952
- exports.MTextarea = Textarea;
3953
- exports.MTime = Time;
3954
- exports.default = index;
3955
- exports.display = display;
3956
- exports.fieldProps = fieldProps;
3957
- exports.filterFunction = filterFunction;
3958
- exports.getRules = getRules;
3959
- exports.initValue = initValue;
3960
- exports.useAddField = useAddField;
3961
-
3962
- Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
3963
-
3964
- }));
3965
- //# sourceMappingURL=tmagic-form.umd.js.map