@form-create/component-elm-group 3.1.1 → 3.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.esm.js +188 -37
- package/dist/index.esm.min.js +2 -2
- package/dist/index.js +187 -36
- package/dist/index.min.js +2 -2
- package/package.json +3 -3
- package/src/IconCirclePlus.vue +14 -0
- package/src/IconRemove.vue +13 -0
- package/src/component.jsx +20 -14
package/dist/index.esm.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.1.
|
|
2
|
+
* @form-create/component-elm-group v3.1.4
|
|
3
3
|
* (c) 2018-2022 xaboy
|
|
4
4
|
* Github https://github.com/xaboy/form-create with group
|
|
5
5
|
* Released under the MIT License.
|
|
6
6
|
*/
|
|
7
|
-
import { defineComponent, markRaw, nextTick, createVNode, resolveComponent, isVNode } from 'vue';
|
|
7
|
+
import { openBlock, createElementBlock, createElementVNode, defineComponent, markRaw, nextTick, createVNode, resolveComponent, isVNode } from 'vue';
|
|
8
8
|
|
|
9
9
|
function ownKeys(object, enumerableOnly) {
|
|
10
10
|
var keys = Object.keys(object);
|
|
@@ -120,9 +120,28 @@ var is = {
|
|
|
120
120
|
},
|
|
121
121
|
trueArray: function trueArray(data) {
|
|
122
122
|
return Array.isArray(data) && data.length > 0;
|
|
123
|
+
},
|
|
124
|
+
Function: function Function(v) {
|
|
125
|
+
var type = this.getType(v);
|
|
126
|
+
return type === 'Function' || type === 'AsyncFunction';
|
|
127
|
+
},
|
|
128
|
+
getType: function getType(v) {
|
|
129
|
+
var str = Object.prototype.toString.call(v);
|
|
130
|
+
return /^\[object (.*)\]$/.exec(str)[1];
|
|
131
|
+
},
|
|
132
|
+
empty: function empty(value) {
|
|
133
|
+
if (value === undefined || value === null) {
|
|
134
|
+
return true;
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
if (Array.isArray(value) && Array.isArray(value) && !value.length) {
|
|
138
|
+
return true;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
return typeof value === 'string' && !value;
|
|
123
142
|
}
|
|
124
143
|
};
|
|
125
|
-
['Date', 'Object', '
|
|
144
|
+
['Date', 'Object', 'String', 'Boolean', 'Array', 'Number'].forEach(function (t) {
|
|
126
145
|
is[t] = function (arg) {
|
|
127
146
|
return is.type(arg, t);
|
|
128
147
|
};
|
|
@@ -131,6 +150,137 @@ function hasProperty(rule, k) {
|
|
|
131
150
|
return {}.hasOwnProperty.call(rule, k);
|
|
132
151
|
}
|
|
133
152
|
|
|
153
|
+
var script$1 = {
|
|
154
|
+
name: 'IconCirclePlus'
|
|
155
|
+
};
|
|
156
|
+
|
|
157
|
+
var _hoisted_1$1 = {
|
|
158
|
+
"class": "icon",
|
|
159
|
+
viewBox: "0 0 1024 1024",
|
|
160
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
161
|
+
};
|
|
162
|
+
|
|
163
|
+
var _hoisted_2$1 = /*#__PURE__*/createElementVNode("path", {
|
|
164
|
+
fill: "currentColor",
|
|
165
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
166
|
+
}, null, -1);
|
|
167
|
+
|
|
168
|
+
var _hoisted_3$1 = /*#__PURE__*/createElementVNode("path", {
|
|
169
|
+
fill: "currentColor",
|
|
170
|
+
d: "M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"
|
|
171
|
+
}, null, -1);
|
|
172
|
+
|
|
173
|
+
var _hoisted_4$1 = /*#__PURE__*/createElementVNode("path", {
|
|
174
|
+
fill: "currentColor",
|
|
175
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
176
|
+
}, null, -1);
|
|
177
|
+
|
|
178
|
+
var _hoisted_5 = [_hoisted_2$1, _hoisted_3$1, _hoisted_4$1];
|
|
179
|
+
function render$1(_ctx, _cache, $props, $setup, $data, $options) {
|
|
180
|
+
return openBlock(), createElementBlock("svg", _hoisted_1$1, _hoisted_5);
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
script$1.render = render$1;
|
|
184
|
+
|
|
185
|
+
var script = {
|
|
186
|
+
name: 'IconRemove'
|
|
187
|
+
};
|
|
188
|
+
|
|
189
|
+
var _hoisted_1 = {
|
|
190
|
+
"class": "icon",
|
|
191
|
+
viewBox: "0 0 1024 1024",
|
|
192
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
193
|
+
};
|
|
194
|
+
|
|
195
|
+
var _hoisted_2 = /*#__PURE__*/createElementVNode("path", {
|
|
196
|
+
fill: "currentColor",
|
|
197
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
198
|
+
}, null, -1);
|
|
199
|
+
|
|
200
|
+
var _hoisted_3 = /*#__PURE__*/createElementVNode("path", {
|
|
201
|
+
fill: "currentColor",
|
|
202
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
203
|
+
}, null, -1);
|
|
204
|
+
|
|
205
|
+
var _hoisted_4 = [_hoisted_2, _hoisted_3];
|
|
206
|
+
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
207
|
+
return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_4);
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
script.render = render;
|
|
211
|
+
|
|
212
|
+
function $set(target, field, value) {
|
|
213
|
+
target[field] = value;
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
function deepExtend(origin) {
|
|
217
|
+
var target = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
218
|
+
var mode = arguments.length > 2 ? arguments[2] : undefined;
|
|
219
|
+
var isArr = false;
|
|
220
|
+
|
|
221
|
+
for (var key in target) {
|
|
222
|
+
if (Object.prototype.hasOwnProperty.call(target, key)) {
|
|
223
|
+
var clone = target[key];
|
|
224
|
+
|
|
225
|
+
if ((isArr = Array.isArray(clone)) || is.Object(clone)) {
|
|
226
|
+
var nst = origin[key] === undefined;
|
|
227
|
+
|
|
228
|
+
if (isArr) {
|
|
229
|
+
isArr = false;
|
|
230
|
+
nst && $set(origin, key, []);
|
|
231
|
+
} else if (clone._clone && mode !== undefined) {
|
|
232
|
+
if (mode) {
|
|
233
|
+
clone = clone.getRule();
|
|
234
|
+
nst && $set(origin, key, {});
|
|
235
|
+
} else {
|
|
236
|
+
$set(origin, key, clone._clone());
|
|
237
|
+
continue;
|
|
238
|
+
}
|
|
239
|
+
} else {
|
|
240
|
+
nst && $set(origin, key, {});
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
origin[key] = deepExtend(origin[key], clone, mode);
|
|
244
|
+
} else {
|
|
245
|
+
$set(origin, key, clone);
|
|
246
|
+
|
|
247
|
+
if (!is.Undef(clone)) {
|
|
248
|
+
if (!is.Undef(clone.__json)) {
|
|
249
|
+
origin[key].__json = clone.__json;
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
if (!is.Undef(clone.__origin)) {
|
|
253
|
+
origin[key].__origin = clone.__origin;
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
}
|
|
258
|
+
}
|
|
259
|
+
|
|
260
|
+
return mode !== undefined && Array.isArray(origin) ? origin.filter(function (v) {
|
|
261
|
+
return !v || !v.__ctrl;
|
|
262
|
+
}) : origin;
|
|
263
|
+
}
|
|
264
|
+
function deepCopy(value) {
|
|
265
|
+
return deepExtend({}, {
|
|
266
|
+
value: value
|
|
267
|
+
}).value;
|
|
268
|
+
}
|
|
269
|
+
|
|
270
|
+
var _extends = Object.assign || function (a) {
|
|
271
|
+
for (var b, c = 1; c < arguments.length; c++) {
|
|
272
|
+
for (var d in b = arguments[c], b) {
|
|
273
|
+
Object.prototype.hasOwnProperty.call(b, d) && $set(a, d, b[d]);
|
|
274
|
+
}
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
return a;
|
|
278
|
+
};
|
|
279
|
+
|
|
280
|
+
function extend() {
|
|
281
|
+
return _extends.apply(this, arguments);
|
|
282
|
+
}
|
|
283
|
+
|
|
134
284
|
function _isSlot(s) {
|
|
135
285
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
|
|
136
286
|
}
|
|
@@ -161,6 +311,7 @@ var Group = defineComponent({
|
|
|
161
311
|
return [];
|
|
162
312
|
}
|
|
163
313
|
},
|
|
314
|
+
defaultValue: Object,
|
|
164
315
|
disabled: {
|
|
165
316
|
type: Boolean,
|
|
166
317
|
"default": false
|
|
@@ -230,8 +381,6 @@ var Group = defineComponent({
|
|
|
230
381
|
for (var _i2 = 0; _i2 < len; _i2++) {
|
|
231
382
|
this.removeRule(keys[total - _i2 - 1]);
|
|
232
383
|
}
|
|
233
|
-
|
|
234
|
-
this.subForm();
|
|
235
384
|
}
|
|
236
385
|
|
|
237
386
|
n.forEach(function (val, i) {
|
|
@@ -239,8 +388,7 @@ var Group = defineComponent({
|
|
|
239
388
|
});
|
|
240
389
|
}
|
|
241
390
|
},
|
|
242
|
-
deep: true
|
|
243
|
-
flush: 'post'
|
|
391
|
+
deep: true
|
|
244
392
|
}
|
|
245
393
|
},
|
|
246
394
|
methods: {
|
|
@@ -297,6 +445,13 @@ var Group = defineComponent({
|
|
|
297
445
|
submitBtn: false,
|
|
298
446
|
resetBtn: false
|
|
299
447
|
};
|
|
448
|
+
|
|
449
|
+
if (this.defaultValue) {
|
|
450
|
+
if (!options.formData) options.formData = {};
|
|
451
|
+
var defVal = deepCopy(this.defaultValue);
|
|
452
|
+
extend(options.formData, this.field ? _defineProperty({}, this.field, defVal) : defVal);
|
|
453
|
+
}
|
|
454
|
+
|
|
300
455
|
this.cacheRule[++this.len] = {
|
|
301
456
|
rule: rule,
|
|
302
457
|
options: options
|
|
@@ -312,7 +467,7 @@ var Group = defineComponent({
|
|
|
312
467
|
var _this4 = this;
|
|
313
468
|
|
|
314
469
|
this.cacheRule[key].$f = $f;
|
|
315
|
-
this.
|
|
470
|
+
this.formData(key, $f.formData());
|
|
316
471
|
nextTick(function () {
|
|
317
472
|
if (_this4.syncDisabled) {
|
|
318
473
|
$f.disabled(_this4.disabled);
|
|
@@ -321,15 +476,8 @@ var Group = defineComponent({
|
|
|
321
476
|
_this4.$emit('itemMounted', $f, Object.keys(_this4.cacheRule).indexOf(key));
|
|
322
477
|
});
|
|
323
478
|
},
|
|
324
|
-
subForm: function subForm() {
|
|
325
|
-
var _this5 = this;
|
|
326
|
-
|
|
327
|
-
this.formCreateInject.subForm(Object.keys(this.cacheRule).map(function (k) {
|
|
328
|
-
return _this5.cacheRule[k].$f;
|
|
329
|
-
}));
|
|
330
|
-
},
|
|
331
479
|
removeRule: function removeRule(key, emit) {
|
|
332
|
-
var
|
|
480
|
+
var _this5 = this;
|
|
333
481
|
|
|
334
482
|
var index = Object.keys(this.cacheRule).indexOf(key);
|
|
335
483
|
delete this.cacheRule[key];
|
|
@@ -337,7 +485,7 @@ var Group = defineComponent({
|
|
|
337
485
|
|
|
338
486
|
if (emit) {
|
|
339
487
|
nextTick(function () {
|
|
340
|
-
return
|
|
488
|
+
return _this5.$emit('remove', index);
|
|
341
489
|
});
|
|
342
490
|
}
|
|
343
491
|
},
|
|
@@ -355,39 +503,38 @@ var Group = defineComponent({
|
|
|
355
503
|
}
|
|
356
504
|
|
|
357
505
|
this.removeRule(key, true);
|
|
358
|
-
this.subForm();
|
|
359
506
|
this.modelValue.splice(index, 1);
|
|
360
507
|
this.input(this.modelValue);
|
|
361
508
|
},
|
|
362
509
|
addIcon: function addIcon(key) {
|
|
363
|
-
return createVNode(resolveComponent("
|
|
510
|
+
return createVNode(resolveComponent("ElIcon"), {
|
|
364
511
|
"key": "a".concat(key),
|
|
365
512
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"),
|
|
366
513
|
"onClick": this.add
|
|
367
514
|
}, {
|
|
368
515
|
"default": function _default() {
|
|
369
|
-
return [createVNode(
|
|
516
|
+
return [createVNode(script$1, null, null)];
|
|
370
517
|
}
|
|
371
518
|
});
|
|
372
519
|
},
|
|
373
520
|
delIcon: function delIcon(index, key) {
|
|
374
|
-
var
|
|
521
|
+
var _this6 = this;
|
|
375
522
|
|
|
376
523
|
return createVNode(resolveComponent("ElIcon"), {
|
|
377
524
|
"key": "d".concat(key),
|
|
378
525
|
"class": "el-icon-remove-outline",
|
|
379
526
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266', ";"),
|
|
380
527
|
"onClick": function onClick() {
|
|
381
|
-
return
|
|
528
|
+
return _this6.del(index, key);
|
|
382
529
|
}
|
|
383
530
|
}, {
|
|
384
531
|
"default": function _default() {
|
|
385
|
-
return [createVNode(
|
|
532
|
+
return [createVNode(script, null, null)];
|
|
386
533
|
}
|
|
387
534
|
});
|
|
388
535
|
},
|
|
389
536
|
makeIcon: function makeIcon(total, index, key) {
|
|
390
|
-
var
|
|
537
|
+
var _this7 = this;
|
|
391
538
|
|
|
392
539
|
if (this.$slots.button) {
|
|
393
540
|
return this.$slots.button({
|
|
@@ -396,7 +543,7 @@ var Group = defineComponent({
|
|
|
396
543
|
vm: this,
|
|
397
544
|
key: key,
|
|
398
545
|
del: function del() {
|
|
399
|
-
return
|
|
546
|
+
return _this7.del(index, key);
|
|
400
547
|
},
|
|
401
548
|
add: this.add
|
|
402
549
|
});
|
|
@@ -431,7 +578,7 @@ var Group = defineComponent({
|
|
|
431
578
|
}
|
|
432
579
|
},
|
|
433
580
|
render: function render() {
|
|
434
|
-
var
|
|
581
|
+
var _this8 = this;
|
|
435
582
|
|
|
436
583
|
var keys = Object.keys(this.cacheRule);
|
|
437
584
|
var button = this.button;
|
|
@@ -439,19 +586,22 @@ var Group = defineComponent({
|
|
|
439
586
|
return keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
|
|
440
587
|
vm: this,
|
|
441
588
|
add: this.add
|
|
442
|
-
}) : createVNode("
|
|
589
|
+
}) : createVNode(resolveComponent("ElIcon"), {
|
|
443
590
|
"key": 1,
|
|
444
|
-
"class": "el-icon-circle-plus-outline",
|
|
445
591
|
"style": "font-size:".concat(this.fontSize, "px;vertical-align:middle;color:").concat(this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer', ";"),
|
|
446
592
|
"onClick": this.add
|
|
447
|
-
},
|
|
593
|
+
}, {
|
|
594
|
+
"default": function _default() {
|
|
595
|
+
return [createVNode(script$1, null, null)];
|
|
596
|
+
}
|
|
597
|
+
}) : createVNode("div", {
|
|
448
598
|
"key": 2
|
|
449
599
|
}, [keys.map(function (key, index) {
|
|
450
600
|
var _slot;
|
|
451
601
|
|
|
452
|
-
var
|
|
453
|
-
rule =
|
|
454
|
-
options =
|
|
602
|
+
var _this8$cacheRule$key = _this8.cacheRule[key],
|
|
603
|
+
rule = _this8$cacheRule$key.rule,
|
|
604
|
+
options = _this8$cacheRule$key.options;
|
|
455
605
|
return createVNode(resolveComponent("ElRow"), {
|
|
456
606
|
"align": "middle",
|
|
457
607
|
"type": "flex",
|
|
@@ -467,19 +617,20 @@ var Group = defineComponent({
|
|
|
467
617
|
"default": function _default() {
|
|
468
618
|
return [createVNode(Type, {
|
|
469
619
|
"key": key,
|
|
620
|
+
"inFor": true,
|
|
470
621
|
"onUpdate:modelValue": function onUpdateModelValue(formData) {
|
|
471
|
-
return
|
|
622
|
+
return _this8.formData(key, formData);
|
|
472
623
|
},
|
|
473
|
-
"modelValue":
|
|
624
|
+
"modelValue": _this8.field ? _defineProperty({}, _this8.field, _this8._value(_this8.modelValue[index])) : _this8.modelValue[index],
|
|
474
625
|
"onEmit-event": function onEmitEvent(name) {
|
|
475
626
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
476
627
|
args[_key - 1] = arguments[_key];
|
|
477
628
|
}
|
|
478
629
|
|
|
479
|
-
return
|
|
630
|
+
return _this8.emitEvent(name, args, index, key);
|
|
480
631
|
},
|
|
481
632
|
"onUpdate:api": function onUpdateApi($f) {
|
|
482
|
-
return
|
|
633
|
+
return _this8.add$f(index, key, $f);
|
|
483
634
|
},
|
|
484
635
|
"rule": rule,
|
|
485
636
|
"option": options,
|
|
@@ -492,7 +643,7 @@ var Group = defineComponent({
|
|
|
492
643
|
"span": 2,
|
|
493
644
|
"pull": 1,
|
|
494
645
|
"push": 1
|
|
495
|
-
}, _isSlot(_slot =
|
|
646
|
+
}, _isSlot(_slot = _this8.makeIcon(keys.length, index, key)) ? _slot : {
|
|
496
647
|
"default": function _default() {
|
|
497
648
|
return [_slot];
|
|
498
649
|
}
|
package/dist/index.esm.min.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.1.
|
|
2
|
+
* @form-create/component-elm-group v3.1.4
|
|
3
3
|
* (c) 2018-2022 xaboy
|
|
4
4
|
* Github https://github.com/xaboy/form-create with group
|
|
5
5
|
* Released under the MIT License.
|
|
6
6
|
*/
|
|
7
|
-
import{
|
|
7
|
+
import{openBlock as e,createElementBlock as t,createElementVNode as n,defineComponent as r,markRaw as o,nextTick as i,createVNode as l,resolveComponent as a,isVNode as u}from"vue";function c(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function s(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?c(Object(n),!0).forEach((function(t){d(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):c(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function f(e){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},f(e)}function d(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function h(e){return function(e){if(Array.isArray(e))return p(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return p(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return p(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function p(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var m={type:function(e,t){return Object.prototype.toString.call(e)==="[object "+t+"]"},Undef:function(e){return null==e},Element:function(e){return"object"===f(e)&&null!==e&&1===e.nodeType&&!m.Object(e)},trueArray:function(e){return Array.isArray(e)&&e.length>0},Function:function(e){var t=this.getType(e);return"Function"===t||"AsyncFunction"===t},getType:function(e){var t=Object.prototype.toString.call(e);return/^\[object (.*)\]$/.exec(t)[1]},empty:function(e){return null==e||(!(!Array.isArray(e)||!Array.isArray(e)||e.length)||"string"==typeof e&&!e)}};["Date","Object","String","Boolean","Array","Number"].forEach((function(e){m[e]=function(t){return m.type(t,e)}}));var y={name:"IconCirclePlus"},b={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},v=[n("path",{fill:"currentColor",d:"M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"},null,-1),n("path",{fill:"currentColor",d:"M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"},null,-1),n("path",{fill:"currentColor",d:"M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"},null,-1)];y.render=function(n,r,o,i,l,a){return e(),t("svg",b,v)};var g={name:"IconRemove"},O={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},j=[n("path",{fill:"currentColor",d:"M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"},null,-1),n("path",{fill:"currentColor",d:"M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"},null,-1)];function V(e,t,n){e[t]=n}function w(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>2?arguments[2]:void 0,r=!1;for(var o in t)if(Object.prototype.hasOwnProperty.call(t,o)){var i=t[o];if((r=Array.isArray(i))||m.Object(i)){var l=void 0===e[o];if(r)r=!1,l&&V(e,o,[]);else if(i._clone&&void 0!==n){if(!n){V(e,o,i._clone());continue}i=i.getRule(),l&&V(e,o,{})}else l&&V(e,o,{});e[o]=w(e[o],i,n)}else V(e,o,i),m.Undef(i)||(m.Undef(i.__json)||(e[o].__json=i.__json),m.Undef(i.__origin)||(e[o].__origin=i.__origin))}return void 0!==n&&Array.isArray(e)?e.filter((function(e){return!e||!e.__ctrl})):e}function R(e){return w({},{value:e}).value}g.render=function(n,r,o,i,l,a){return e(),t("svg",O,j)};var x=Object.assign||function(e){for(var t,n=1;n<arguments.length;n++)for(var r in t=arguments[n])Object.prototype.hasOwnProperty.call(t,r)&&V(e,r,t[r]);return e};var A=r({name:"fcGroup",props:{field:String,rule:Array,expand:Number,options:Object,button:{type:Boolean,default:!0},max:{type:Number,default:0},min:{type:Number,default:0},modelValue:{type:Array,default:function(){return[]}},defaultValue:Object,disabled:{type:Boolean,default:!1},syncDisabled:{type:Boolean,default:!0},fontSize:{type:Number,default:28},onBeforeRemove:{type:Function,default:function(){}},onBeforeAdd:{type:Function,default:function(){}},formCreateInject:Object},data:function(){return{len:0,cacheRule:{},cacheValue:{},form:o(this.formCreateInject.form.$form())}},emits:["update:modelValue","change","itemMounted","remove"],watch:{disabled:function(e){if(this.syncDisabled){var t=this.cacheRule;Object.keys(t).forEach((function(n){t[n].$f.disabled(e)}))}},expand:function(e){var t=e-this.modelValue.length;t>0&&this.expandRule(t)},modelValue:{handler:function(e){var t=this;e=e||[];var n=Object.keys(this.cacheRule),r=n.length,o=r-e.length;if(o<0){for(var i=o;i<0;i++)this.addRule(e.length+i);for(var l=0;l<r;l++)this.setValue(n[l],e[l])}else{if(o>0)for(var a=0;a<o;a++)this.removeRule(n[r-a-1]);e.forEach((function(r,o){t.setValue(n[o],e[o])}))}},deep:!0}},methods:{_value:function(e){return e&&(t=e,n=this.field,{}.hasOwnProperty.call(t,n))?e[this.field]:e;var t,n},cache:function(e,t){this.cacheValue[e]=JSON.stringify(t)},input:function(e){this.$emit("update:modelValue",e),this.$emit("change",e)},formData:function(e,t){var n=this,r=this.cacheRule,o=Object.keys(r);if(o.filter((function(e){return r[e].$f})).length===o.length){var i=o.map((function(r){var o=e===r?t:s({},n.cacheRule[r].$f.form),i=n.field?o[n.field]||null:o;return n.cache(r,i),i}));this.input(i)}},setValue:function(e,t){var n=this.field;n&&(t=d({},n,this._value(t))),this.cacheValue[e]!==JSON.stringify(n?t[n]:t)&&this.cache(e,t)},addRule:function(e,t){var n=this,r=this.formCreateInject.form.copyRules(this.rule||[]),o=this.options?s({},this.options):{submitBtn:!1,resetBtn:!1};if(this.defaultValue){o.formData||(o.formData={});var l=R(this.defaultValue);!function(){x.apply(this,arguments)}(o.formData,this.field?d({},this.field,l):l)}this.cacheRule[++this.len]={rule:r,options:o},t&&i((function(){return n.$emit("add",r,Object.keys(n.cacheRule).length-1)}))},add$f:function(e,t,n){var r=this;this.cacheRule[t].$f=n,this.formData(t,n.formData()),i((function(){r.syncDisabled&&n.disabled(r.disabled),r.$emit("itemMounted",n,Object.keys(r.cacheRule).indexOf(t))}))},removeRule:function(e,t){var n=this,r=Object.keys(this.cacheRule).indexOf(e);delete this.cacheRule[e],delete this.cacheValue[e],t&&i((function(){return n.$emit("remove",r)}))},add:function(){this.disabled||!1===this.onBeforeAdd(this.modelValue)||(this.modelValue.push(this.field?null:{}),this.$emit("update:modelValue",this.modelValue))},del:function(e,t){this.disabled||!1===this.onBeforeRemove(this.modelValue,e)||(this.removeRule(t,!0),this.modelValue.splice(e,1),this.input(this.modelValue))},addIcon:function(e){return l(a("ElIcon"),{key:"a".concat(e),style:"font-size:".concat(this.fontSize,"px;cursor:").concat(this.disabled?"not-allowed;color:#c9cdd4":"pointer",";"),onClick:this.add},{default:function(){return[l(y,null,null)]}})},delIcon:function(e,t){var n=this;return l(a("ElIcon"),{key:"d".concat(t),class:"el-icon-remove-outline",style:"font-size:".concat(this.fontSize,"px;cursor:").concat(this.disabled?"not-allowed;color:#c9cdd4":"pointer;color:#606266",";"),onClick:function(){return n.del(e,t)}},{default:function(){return[l(g,null,null)]}})},makeIcon:function(e,t,n){var r=this;return this.$slots.button?this.$slots.button({total:e,index:t,vm:this,key:n,del:function(){return r.del(t,n)},add:this.add}):0===t?[0!==this.max&&e>=this.max?null:this.addIcon(n),0===this.min||e>this.min?this.delIcon(t,n):null]:t>=this.min?this.delIcon(t,n):void 0},emitEvent:function(e,t,n,r){this.$emit.apply(this,[e].concat(h(t),[this.cacheRule[r].$f,n]))},expandRule:function(e){for(var t=0;t<e;t++)this.modelValue.push(this.field?null:{})}},created:function(){for(var e=(this.expand||0)-this.modelValue.length,t=0;t<this.modelValue.length;t++)this.addRule(t);e>0&&this.expandRule(e)},render:function(){var e=this,t=Object.keys(this.cacheRule),n=this.button,r=this.form;return 0===t.length?this.$slots.default?this.$slots.default({vm:this,add:this.add}):l(a("ElIcon"),{key:1,style:"font-size:".concat(this.fontSize,"px;vertical-align:middle;color:").concat(this.disabled?"#c9cdd4;cursor: not-allowed":"#606266;cursor:pointer",";"),onClick:this.add},{default:function(){return[l(y,null,null)]}}):l("div",{key:2},[t.map((function(o,i){var c,s=e.cacheRule[o],f=s.rule,h=s.options;return l(a("ElRow"),{align:"middle",type:"flex",key:o,style:"border-bottom:1px dashed #DCDFE6;margin-bottom:10px;"},{default:function(){return[l(a("ElCol"),{span:n?20:24},{default:function(){return[l(a("ElFormItem"),null,{default:function(){return[l(r,{key:o,inFor:!0,"onUpdate:modelValue":function(t){return e.formData(o,t)},modelValue:e.field?d({},e.field,e._value(e.modelValue[i])):e.modelValue[i],"onEmit-event":function(t){for(var n=arguments.length,r=new Array(n>1?n-1:0),l=1;l<n;l++)r[l-1]=arguments[l];return e.emitEvent(t,r,i,o)},"onUpdate:api":function(t){return e.add$f(i,o,t)},rule:f,option:h,extendOption:!0},null)]}})]}}),n?l(a("ElCol"),{span:2,pull:1,push:1},(s=c=e.makeIcon(t.length,i,o),"function"==typeof s||"[object Object]"===Object.prototype.toString.call(s)&&!u(s)?c:{default:function(){return[c]}})):null];var s}})}))])}});export{A as default};
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.1.
|
|
2
|
+
* @form-create/component-elm-group v3.1.4
|
|
3
3
|
* (c) 2018-2022 xaboy
|
|
4
4
|
* Github https://github.com/xaboy/form-create with group
|
|
5
5
|
* Released under the MIT License.
|
|
@@ -124,9 +124,28 @@
|
|
|
124
124
|
},
|
|
125
125
|
trueArray: function trueArray(data) {
|
|
126
126
|
return Array.isArray(data) && data.length > 0;
|
|
127
|
+
},
|
|
128
|
+
Function: function Function(v) {
|
|
129
|
+
var type = this.getType(v);
|
|
130
|
+
return type === 'Function' || type === 'AsyncFunction';
|
|
131
|
+
},
|
|
132
|
+
getType: function getType(v) {
|
|
133
|
+
var str = Object.prototype.toString.call(v);
|
|
134
|
+
return /^\[object (.*)\]$/.exec(str)[1];
|
|
135
|
+
},
|
|
136
|
+
empty: function empty(value) {
|
|
137
|
+
if (value === undefined || value === null) {
|
|
138
|
+
return true;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
if (Array.isArray(value) && Array.isArray(value) && !value.length) {
|
|
142
|
+
return true;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
return typeof value === 'string' && !value;
|
|
127
146
|
}
|
|
128
147
|
};
|
|
129
|
-
['Date', 'Object', '
|
|
148
|
+
['Date', 'Object', 'String', 'Boolean', 'Array', 'Number'].forEach(function (t) {
|
|
130
149
|
is[t] = function (arg) {
|
|
131
150
|
return is.type(arg, t);
|
|
132
151
|
};
|
|
@@ -135,6 +154,137 @@
|
|
|
135
154
|
return {}.hasOwnProperty.call(rule, k);
|
|
136
155
|
}
|
|
137
156
|
|
|
157
|
+
var script$1 = {
|
|
158
|
+
name: 'IconCirclePlus'
|
|
159
|
+
};
|
|
160
|
+
|
|
161
|
+
var _hoisted_1$1 = {
|
|
162
|
+
"class": "icon",
|
|
163
|
+
viewBox: "0 0 1024 1024",
|
|
164
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
165
|
+
};
|
|
166
|
+
|
|
167
|
+
var _hoisted_2$1 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
168
|
+
fill: "currentColor",
|
|
169
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
170
|
+
}, null, -1);
|
|
171
|
+
|
|
172
|
+
var _hoisted_3$1 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
173
|
+
fill: "currentColor",
|
|
174
|
+
d: "M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"
|
|
175
|
+
}, null, -1);
|
|
176
|
+
|
|
177
|
+
var _hoisted_4$1 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
178
|
+
fill: "currentColor",
|
|
179
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
180
|
+
}, null, -1);
|
|
181
|
+
|
|
182
|
+
var _hoisted_5 = [_hoisted_2$1, _hoisted_3$1, _hoisted_4$1];
|
|
183
|
+
function render$1(_ctx, _cache, $props, $setup, $data, $options) {
|
|
184
|
+
return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$1, _hoisted_5);
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
script$1.render = render$1;
|
|
188
|
+
|
|
189
|
+
var script = {
|
|
190
|
+
name: 'IconRemove'
|
|
191
|
+
};
|
|
192
|
+
|
|
193
|
+
var _hoisted_1 = {
|
|
194
|
+
"class": "icon",
|
|
195
|
+
viewBox: "0 0 1024 1024",
|
|
196
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
197
|
+
};
|
|
198
|
+
|
|
199
|
+
var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
200
|
+
fill: "currentColor",
|
|
201
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
202
|
+
}, null, -1);
|
|
203
|
+
|
|
204
|
+
var _hoisted_3 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
205
|
+
fill: "currentColor",
|
|
206
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
207
|
+
}, null, -1);
|
|
208
|
+
|
|
209
|
+
var _hoisted_4 = [_hoisted_2, _hoisted_3];
|
|
210
|
+
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
211
|
+
return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1, _hoisted_4);
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
script.render = render;
|
|
215
|
+
|
|
216
|
+
function $set(target, field, value) {
|
|
217
|
+
target[field] = value;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
function deepExtend(origin) {
|
|
221
|
+
var target = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
222
|
+
var mode = arguments.length > 2 ? arguments[2] : undefined;
|
|
223
|
+
var isArr = false;
|
|
224
|
+
|
|
225
|
+
for (var key in target) {
|
|
226
|
+
if (Object.prototype.hasOwnProperty.call(target, key)) {
|
|
227
|
+
var clone = target[key];
|
|
228
|
+
|
|
229
|
+
if ((isArr = Array.isArray(clone)) || is.Object(clone)) {
|
|
230
|
+
var nst = origin[key] === undefined;
|
|
231
|
+
|
|
232
|
+
if (isArr) {
|
|
233
|
+
isArr = false;
|
|
234
|
+
nst && $set(origin, key, []);
|
|
235
|
+
} else if (clone._clone && mode !== undefined) {
|
|
236
|
+
if (mode) {
|
|
237
|
+
clone = clone.getRule();
|
|
238
|
+
nst && $set(origin, key, {});
|
|
239
|
+
} else {
|
|
240
|
+
$set(origin, key, clone._clone());
|
|
241
|
+
continue;
|
|
242
|
+
}
|
|
243
|
+
} else {
|
|
244
|
+
nst && $set(origin, key, {});
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
origin[key] = deepExtend(origin[key], clone, mode);
|
|
248
|
+
} else {
|
|
249
|
+
$set(origin, key, clone);
|
|
250
|
+
|
|
251
|
+
if (!is.Undef(clone)) {
|
|
252
|
+
if (!is.Undef(clone.__json)) {
|
|
253
|
+
origin[key].__json = clone.__json;
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
if (!is.Undef(clone.__origin)) {
|
|
257
|
+
origin[key].__origin = clone.__origin;
|
|
258
|
+
}
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
return mode !== undefined && Array.isArray(origin) ? origin.filter(function (v) {
|
|
265
|
+
return !v || !v.__ctrl;
|
|
266
|
+
}) : origin;
|
|
267
|
+
}
|
|
268
|
+
function deepCopy(value) {
|
|
269
|
+
return deepExtend({}, {
|
|
270
|
+
value: value
|
|
271
|
+
}).value;
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
var _extends = Object.assign || function (a) {
|
|
275
|
+
for (var b, c = 1; c < arguments.length; c++) {
|
|
276
|
+
for (var d in b = arguments[c], b) {
|
|
277
|
+
Object.prototype.hasOwnProperty.call(b, d) && $set(a, d, b[d]);
|
|
278
|
+
}
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
return a;
|
|
282
|
+
};
|
|
283
|
+
|
|
284
|
+
function extend() {
|
|
285
|
+
return _extends.apply(this, arguments);
|
|
286
|
+
}
|
|
287
|
+
|
|
138
288
|
function _isSlot(s) {
|
|
139
289
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
|
|
140
290
|
}
|
|
@@ -165,6 +315,7 @@
|
|
|
165
315
|
return [];
|
|
166
316
|
}
|
|
167
317
|
},
|
|
318
|
+
defaultValue: Object,
|
|
168
319
|
disabled: {
|
|
169
320
|
type: Boolean,
|
|
170
321
|
"default": false
|
|
@@ -234,8 +385,6 @@
|
|
|
234
385
|
for (var _i2 = 0; _i2 < len; _i2++) {
|
|
235
386
|
this.removeRule(keys[total - _i2 - 1]);
|
|
236
387
|
}
|
|
237
|
-
|
|
238
|
-
this.subForm();
|
|
239
388
|
}
|
|
240
389
|
|
|
241
390
|
n.forEach(function (val, i) {
|
|
@@ -243,8 +392,7 @@
|
|
|
243
392
|
});
|
|
244
393
|
}
|
|
245
394
|
},
|
|
246
|
-
deep: true
|
|
247
|
-
flush: 'post'
|
|
395
|
+
deep: true
|
|
248
396
|
}
|
|
249
397
|
},
|
|
250
398
|
methods: {
|
|
@@ -301,6 +449,13 @@
|
|
|
301
449
|
submitBtn: false,
|
|
302
450
|
resetBtn: false
|
|
303
451
|
};
|
|
452
|
+
|
|
453
|
+
if (this.defaultValue) {
|
|
454
|
+
if (!options.formData) options.formData = {};
|
|
455
|
+
var defVal = deepCopy(this.defaultValue);
|
|
456
|
+
extend(options.formData, this.field ? _defineProperty({}, this.field, defVal) : defVal);
|
|
457
|
+
}
|
|
458
|
+
|
|
304
459
|
this.cacheRule[++this.len] = {
|
|
305
460
|
rule: rule,
|
|
306
461
|
options: options
|
|
@@ -316,7 +471,7 @@
|
|
|
316
471
|
var _this4 = this;
|
|
317
472
|
|
|
318
473
|
this.cacheRule[key].$f = $f;
|
|
319
|
-
this.
|
|
474
|
+
this.formData(key, $f.formData());
|
|
320
475
|
vue.nextTick(function () {
|
|
321
476
|
if (_this4.syncDisabled) {
|
|
322
477
|
$f.disabled(_this4.disabled);
|
|
@@ -325,15 +480,8 @@
|
|
|
325
480
|
_this4.$emit('itemMounted', $f, Object.keys(_this4.cacheRule).indexOf(key));
|
|
326
481
|
});
|
|
327
482
|
},
|
|
328
|
-
subForm: function subForm() {
|
|
329
|
-
var _this5 = this;
|
|
330
|
-
|
|
331
|
-
this.formCreateInject.subForm(Object.keys(this.cacheRule).map(function (k) {
|
|
332
|
-
return _this5.cacheRule[k].$f;
|
|
333
|
-
}));
|
|
334
|
-
},
|
|
335
483
|
removeRule: function removeRule(key, emit) {
|
|
336
|
-
var
|
|
484
|
+
var _this5 = this;
|
|
337
485
|
|
|
338
486
|
var index = Object.keys(this.cacheRule).indexOf(key);
|
|
339
487
|
delete this.cacheRule[key];
|
|
@@ -341,7 +489,7 @@
|
|
|
341
489
|
|
|
342
490
|
if (emit) {
|
|
343
491
|
vue.nextTick(function () {
|
|
344
|
-
return
|
|
492
|
+
return _this5.$emit('remove', index);
|
|
345
493
|
});
|
|
346
494
|
}
|
|
347
495
|
},
|
|
@@ -359,39 +507,38 @@
|
|
|
359
507
|
}
|
|
360
508
|
|
|
361
509
|
this.removeRule(key, true);
|
|
362
|
-
this.subForm();
|
|
363
510
|
this.modelValue.splice(index, 1);
|
|
364
511
|
this.input(this.modelValue);
|
|
365
512
|
},
|
|
366
513
|
addIcon: function addIcon(key) {
|
|
367
|
-
return vue.createVNode(vue.resolveComponent("
|
|
514
|
+
return vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
368
515
|
"key": "a".concat(key),
|
|
369
516
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"),
|
|
370
517
|
"onClick": this.add
|
|
371
518
|
}, {
|
|
372
519
|
"default": function _default() {
|
|
373
|
-
return [vue.createVNode(
|
|
520
|
+
return [vue.createVNode(script$1, null, null)];
|
|
374
521
|
}
|
|
375
522
|
});
|
|
376
523
|
},
|
|
377
524
|
delIcon: function delIcon(index, key) {
|
|
378
|
-
var
|
|
525
|
+
var _this6 = this;
|
|
379
526
|
|
|
380
527
|
return vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
381
528
|
"key": "d".concat(key),
|
|
382
529
|
"class": "el-icon-remove-outline",
|
|
383
530
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266', ";"),
|
|
384
531
|
"onClick": function onClick() {
|
|
385
|
-
return
|
|
532
|
+
return _this6.del(index, key);
|
|
386
533
|
}
|
|
387
534
|
}, {
|
|
388
535
|
"default": function _default() {
|
|
389
|
-
return [vue.createVNode(
|
|
536
|
+
return [vue.createVNode(script, null, null)];
|
|
390
537
|
}
|
|
391
538
|
});
|
|
392
539
|
},
|
|
393
540
|
makeIcon: function makeIcon(total, index, key) {
|
|
394
|
-
var
|
|
541
|
+
var _this7 = this;
|
|
395
542
|
|
|
396
543
|
if (this.$slots.button) {
|
|
397
544
|
return this.$slots.button({
|
|
@@ -400,7 +547,7 @@
|
|
|
400
547
|
vm: this,
|
|
401
548
|
key: key,
|
|
402
549
|
del: function del() {
|
|
403
|
-
return
|
|
550
|
+
return _this7.del(index, key);
|
|
404
551
|
},
|
|
405
552
|
add: this.add
|
|
406
553
|
});
|
|
@@ -435,7 +582,7 @@
|
|
|
435
582
|
}
|
|
436
583
|
},
|
|
437
584
|
render: function render() {
|
|
438
|
-
var
|
|
585
|
+
var _this8 = this;
|
|
439
586
|
|
|
440
587
|
var keys = Object.keys(this.cacheRule);
|
|
441
588
|
var button = this.button;
|
|
@@ -443,19 +590,22 @@
|
|
|
443
590
|
return keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
|
|
444
591
|
vm: this,
|
|
445
592
|
add: this.add
|
|
446
|
-
}) : vue.createVNode("
|
|
593
|
+
}) : vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
447
594
|
"key": 1,
|
|
448
|
-
"class": "el-icon-circle-plus-outline",
|
|
449
595
|
"style": "font-size:".concat(this.fontSize, "px;vertical-align:middle;color:").concat(this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer', ";"),
|
|
450
596
|
"onClick": this.add
|
|
451
|
-
},
|
|
597
|
+
}, {
|
|
598
|
+
"default": function _default() {
|
|
599
|
+
return [vue.createVNode(script$1, null, null)];
|
|
600
|
+
}
|
|
601
|
+
}) : vue.createVNode("div", {
|
|
452
602
|
"key": 2
|
|
453
603
|
}, [keys.map(function (key, index) {
|
|
454
604
|
var _slot;
|
|
455
605
|
|
|
456
|
-
var
|
|
457
|
-
rule =
|
|
458
|
-
options =
|
|
606
|
+
var _this8$cacheRule$key = _this8.cacheRule[key],
|
|
607
|
+
rule = _this8$cacheRule$key.rule,
|
|
608
|
+
options = _this8$cacheRule$key.options;
|
|
459
609
|
return vue.createVNode(vue.resolveComponent("ElRow"), {
|
|
460
610
|
"align": "middle",
|
|
461
611
|
"type": "flex",
|
|
@@ -471,19 +621,20 @@
|
|
|
471
621
|
"default": function _default() {
|
|
472
622
|
return [vue.createVNode(Type, {
|
|
473
623
|
"key": key,
|
|
624
|
+
"inFor": true,
|
|
474
625
|
"onUpdate:modelValue": function onUpdateModelValue(formData) {
|
|
475
|
-
return
|
|
626
|
+
return _this8.formData(key, formData);
|
|
476
627
|
},
|
|
477
|
-
"modelValue":
|
|
628
|
+
"modelValue": _this8.field ? _defineProperty({}, _this8.field, _this8._value(_this8.modelValue[index])) : _this8.modelValue[index],
|
|
478
629
|
"onEmit-event": function onEmitEvent(name) {
|
|
479
630
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
480
631
|
args[_key - 1] = arguments[_key];
|
|
481
632
|
}
|
|
482
633
|
|
|
483
|
-
return
|
|
634
|
+
return _this8.emitEvent(name, args, index, key);
|
|
484
635
|
},
|
|
485
636
|
"onUpdate:api": function onUpdateApi($f) {
|
|
486
|
-
return
|
|
637
|
+
return _this8.add$f(index, key, $f);
|
|
487
638
|
},
|
|
488
639
|
"rule": rule,
|
|
489
640
|
"option": options,
|
|
@@ -496,7 +647,7 @@
|
|
|
496
647
|
"span": 2,
|
|
497
648
|
"pull": 1,
|
|
498
649
|
"push": 1
|
|
499
|
-
}, _isSlot(_slot =
|
|
650
|
+
}, _isSlot(_slot = _this8.makeIcon(keys.length, index, key)) ? _slot : {
|
|
500
651
|
"default": function _default() {
|
|
501
652
|
return [_slot];
|
|
502
653
|
}
|
package/dist/index.min.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.1.
|
|
2
|
+
* @form-create/component-elm-group v3.1.4
|
|
3
3
|
* (c) 2018-2022 xaboy
|
|
4
4
|
* Github https://github.com/xaboy/form-create with group
|
|
5
5
|
* Released under the MIT License.
|
|
6
6
|
*/
|
|
7
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).FcGroup={},e.Vue)}(this,(function(e,t){"use strict";function n(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function o(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{};t%2?n(Object(o),!0).forEach((function(t){i(e,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):n(Object(o)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(o,t))}))}return e}function r(e){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r(e)}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function l(e){return function(e){if(Array.isArray(e))return u(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return u(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return u(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function u(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}var c={type:function(e,t){return Object.prototype.toString.call(e)==="[object "+t+"]"},Undef:function(e){return null==e},Element:function(e){return"object"===r(e)&&null!==e&&1===e.nodeType&&!c.Object(e)},trueArray:function(e){return Array.isArray(e)&&e.length>0}};["Date","Object","Function","String","Boolean","Array","Number"].forEach((function(e){c[e]=function(t){return c.type(t,e)}}));var a=t.defineComponent({name:"fcGroup",props:{field:String,rule:Array,expand:Number,options:Object,button:{type:Boolean,default:!0},max:{type:Number,default:0},min:{type:Number,default:0},modelValue:{type:Array,default:function(){return[]}},disabled:{type:Boolean,default:!1},syncDisabled:{type:Boolean,default:!0},fontSize:{type:Number,default:28},onBeforeRemove:{type:Function,default:function(){}},onBeforeAdd:{type:Function,default:function(){}},formCreateInject:Object},data:function(){return{len:0,cacheRule:{},cacheValue:{},form:t.markRaw(this.formCreateInject.form.$form())}},emits:["update:modelValue","change","itemMounted","remove"],watch:{disabled:function(e){if(this.syncDisabled){var t=this.cacheRule;Object.keys(t).forEach((function(n){t[n].$f.disabled(e)}))}},expand:function(e){var t=e-this.modelValue.length;t>0&&this.expandRule(t)},modelValue:{handler:function(e){var t=this;e=e||[];var n=Object.keys(this.cacheRule),o=n.length,r=o-e.length;if(r<0){for(var i=r;i<0;i++)this.addRule(e.length+i);for(var l=0;l<o;l++)this.setValue(n[l],e[l])}else{if(r>0){for(var u=0;u<r;u++)this.removeRule(n[o-u-1]);this.subForm()}e.forEach((function(o,r){t.setValue(n[r],e[r])}))}},deep:!0,flush:"post"}},methods:{_value:function(e){return e&&(t=e,n=this.field,{}.hasOwnProperty.call(t,n))?e[this.field]:e;var t,n},cache:function(e,t){this.cacheValue[e]=JSON.stringify(t)},input:function(e){this.$emit("update:modelValue",e),this.$emit("change",e)},formData:function(e,t){var n=this,r=this.cacheRule,i=Object.keys(r);if(i.filter((function(e){return r[e].$f})).length===i.length){var l=i.map((function(r){var i=e===r?t:o({},n.cacheRule[r].$f.form),l=n.field?i[n.field]||null:i;return n.cache(r,l),l}));this.input(l)}},setValue:function(e,t){var n=this.field;n&&(t=i({},n,this._value(t))),this.cacheValue[e]!==JSON.stringify(n?t[n]:t)&&this.cache(e,t)},addRule:function(e,n){var r=this,i=this.formCreateInject.form.copyRules(this.rule||[]),l=this.options?o({},this.options):{submitBtn:!1,resetBtn:!1};this.cacheRule[++this.len]={rule:i,options:l},n&&t.nextTick((function(){return r.$emit("add",i,Object.keys(r.cacheRule).length-1)}))},add$f:function(e,n,o){var r=this;this.cacheRule[n].$f=o,this.subForm(),t.nextTick((function(){r.syncDisabled&&o.disabled(r.disabled),r.$emit("itemMounted",o,Object.keys(r.cacheRule).indexOf(n))}))},subForm:function(){var e=this;this.formCreateInject.subForm(Object.keys(this.cacheRule).map((function(t){return e.cacheRule[t].$f})))},removeRule:function(e,n){var o=this,r=Object.keys(this.cacheRule).indexOf(e);delete this.cacheRule[e],delete this.cacheValue[e],n&&t.nextTick((function(){return o.$emit("remove",r)}))},add:function(){this.disabled||!1===this.onBeforeAdd(this.modelValue)||(this.modelValue.push(this.field?null:{}),this.$emit("update:modelValue",this.modelValue))},del:function(e,t){this.disabled||!1===this.onBeforeRemove(this.modelValue,e)||(this.removeRule(t,!0),this.subForm(),this.modelValue.splice(e,1),this.input(this.modelValue))},addIcon:function(e){return t.createVNode(t.resolveComponent("el-icon"),{key:"a".concat(e),style:"font-size:".concat(this.fontSize,"px;cursor:").concat(this.disabled?"not-allowed;color:#c9cdd4":"pointer",";"),onClick:this.add},{default:function(){return[t.createVNode(t.resolveComponent("circle-plus"),null,null)]}})},delIcon:function(e,n){var o=this;return t.createVNode(t.resolveComponent("ElIcon"),{key:"d".concat(n),class:"el-icon-remove-outline",style:"font-size:".concat(this.fontSize,"px;cursor:").concat(this.disabled?"not-allowed;color:#c9cdd4":"pointer;color:#606266",";"),onClick:function(){return o.del(e,n)}},{default:function(){return[t.createVNode(t.resolveComponent("remove"),null,null)]}})},makeIcon:function(e,t,n){var o=this;return this.$slots.button?this.$slots.button({total:e,index:t,vm:this,key:n,del:function(){return o.del(t,n)},add:this.add}):0===t?[0!==this.max&&e>=this.max?null:this.addIcon(n),0===this.min||e>this.min?this.delIcon(t,n):null]:t>=this.min?this.delIcon(t,n):void 0},emitEvent:function(e,t,n,o){this.$emit.apply(this,[e].concat(l(t),[this.cacheRule[o].$f,n]))},expandRule:function(e){for(var t=0;t<e;t++)this.modelValue.push(this.field?null:{})}},created:function(){for(var e=(this.expand||0)-this.modelValue.length,t=0;t<this.modelValue.length;t++)this.addRule(t);e>0&&this.expandRule(e)},render:function(){var e=this,n=Object.keys(this.cacheRule),o=this.button,r=this.form;return 0===n.length?this.$slots.default?this.$slots.default({vm:this,add:this.add}):t.createVNode("i",{key:1,class:"el-icon-circle-plus-outline",style:"font-size:".concat(this.fontSize,"px;vertical-align:middle;color:").concat(this.disabled?"#c9cdd4;cursor: not-allowed":"#606266;cursor:pointer",";"),onClick:this.add},null):t.createVNode("div",{key:2},[n.map((function(l,u){var c,a=e.cacheRule[l],s=a.rule,f=a.options;return t.createVNode(t.resolveComponent("ElRow"),{align:"middle",type:"flex",key:l,style:"border-bottom:1px dashed #DCDFE6;margin-bottom:10px;"},{default:function(){return[t.createVNode(t.resolveComponent("ElCol"),{span:o?20:24},{default:function(){return[t.createVNode(t.resolveComponent("ElFormItem"),null,{default:function(){return[t.createVNode(r,{key:l,"onUpdate:modelValue":function(t){return e.formData(l,t)},modelValue:e.field?i({},e.field,e._value(e.modelValue[u])):e.modelValue[u],"onEmit-event":function(t){for(var n=arguments.length,o=new Array(n>1?n-1:0),r=1;r<n;r++)o[r-1]=arguments[r];return e.emitEvent(t,o,u,l)},"onUpdate:api":function(t){return e.add$f(u,l,t)},rule:s,option:f,extendOption:!0},null)]}})]}}),o?t.createVNode(t.resolveComponent("ElCol"),{span:2,pull:1,push:1},(a=c=e.makeIcon(n.length,u,l),"function"==typeof a||"[object Object]"===Object.prototype.toString.call(a)&&!t.isVNode(a)?c:{default:function(){return[c]}})):null];var a}})}))])}});e.default=a,Object.defineProperty(e,"__esModule",{value:!0})}));
|
|
7
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).FcGroup={},e.Vue)}(this,(function(e,t){"use strict";function n(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function o(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{};t%2?n(Object(o),!0).forEach((function(t){i(e,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):n(Object(o)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(o,t))}))}return e}function r(e){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r(e)}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function l(e){return function(e){if(Array.isArray(e))return a(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return a(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return a(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function a(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}var u={type:function(e,t){return Object.prototype.toString.call(e)==="[object "+t+"]"},Undef:function(e){return null==e},Element:function(e){return"object"===r(e)&&null!==e&&1===e.nodeType&&!u.Object(e)},trueArray:function(e){return Array.isArray(e)&&e.length>0},Function:function(e){var t=this.getType(e);return"Function"===t||"AsyncFunction"===t},getType:function(e){var t=Object.prototype.toString.call(e);return/^\[object (.*)\]$/.exec(t)[1]},empty:function(e){return null==e||(!(!Array.isArray(e)||!Array.isArray(e)||e.length)||"string"==typeof e&&!e)}};["Date","Object","String","Boolean","Array","Number"].forEach((function(e){u[e]=function(t){return u.type(t,e)}}));var c={name:"IconCirclePlus"},s={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},f=[t.createElementVNode("path",{fill:"currentColor",d:"M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"},null,-1),t.createElementVNode("path",{fill:"currentColor",d:"M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"},null,-1),t.createElementVNode("path",{fill:"currentColor",d:"M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"},null,-1)];c.render=function(e,n,o,r,i,l){return t.openBlock(),t.createElementBlock("svg",s,f)};var d={name:"IconRemove"},h={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},p=[t.createElementVNode("path",{fill:"currentColor",d:"M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"},null,-1),t.createElementVNode("path",{fill:"currentColor",d:"M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"},null,-1)];function m(e,t,n){e[t]=n}function y(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>2?arguments[2]:void 0,o=!1;for(var r in t)if(Object.prototype.hasOwnProperty.call(t,r)){var i=t[r];if((o=Array.isArray(i))||u.Object(i)){var l=void 0===e[r];if(o)o=!1,l&&m(e,r,[]);else if(i._clone&&void 0!==n){if(!n){m(e,r,i._clone());continue}i=i.getRule(),l&&m(e,r,{})}else l&&m(e,r,{});e[r]=y(e[r],i,n)}else m(e,r,i),u.Undef(i)||(u.Undef(i.__json)||(e[r].__json=i.__json),u.Undef(i.__origin)||(e[r].__origin=i.__origin))}return void 0!==n&&Array.isArray(e)?e.filter((function(e){return!e||!e.__ctrl})):e}function v(e){return y({},{value:e}).value}d.render=function(e,n,o,r,i,l){return t.openBlock(),t.createElementBlock("svg",h,p)};var b=Object.assign||function(e){for(var t,n=1;n<arguments.length;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&m(e,o,t[o]);return e};var g=t.defineComponent({name:"fcGroup",props:{field:String,rule:Array,expand:Number,options:Object,button:{type:Boolean,default:!0},max:{type:Number,default:0},min:{type:Number,default:0},modelValue:{type:Array,default:function(){return[]}},defaultValue:Object,disabled:{type:Boolean,default:!1},syncDisabled:{type:Boolean,default:!0},fontSize:{type:Number,default:28},onBeforeRemove:{type:Function,default:function(){}},onBeforeAdd:{type:Function,default:function(){}},formCreateInject:Object},data:function(){return{len:0,cacheRule:{},cacheValue:{},form:t.markRaw(this.formCreateInject.form.$form())}},emits:["update:modelValue","change","itemMounted","remove"],watch:{disabled:function(e){if(this.syncDisabled){var t=this.cacheRule;Object.keys(t).forEach((function(n){t[n].$f.disabled(e)}))}},expand:function(e){var t=e-this.modelValue.length;t>0&&this.expandRule(t)},modelValue:{handler:function(e){var t=this;e=e||[];var n=Object.keys(this.cacheRule),o=n.length,r=o-e.length;if(r<0){for(var i=r;i<0;i++)this.addRule(e.length+i);for(var l=0;l<o;l++)this.setValue(n[l],e[l])}else{if(r>0)for(var a=0;a<r;a++)this.removeRule(n[o-a-1]);e.forEach((function(o,r){t.setValue(n[r],e[r])}))}},deep:!0}},methods:{_value:function(e){return e&&(t=e,n=this.field,{}.hasOwnProperty.call(t,n))?e[this.field]:e;var t,n},cache:function(e,t){this.cacheValue[e]=JSON.stringify(t)},input:function(e){this.$emit("update:modelValue",e),this.$emit("change",e)},formData:function(e,t){var n=this,r=this.cacheRule,i=Object.keys(r);if(i.filter((function(e){return r[e].$f})).length===i.length){var l=i.map((function(r){var i=e===r?t:o({},n.cacheRule[r].$f.form),l=n.field?i[n.field]||null:i;return n.cache(r,l),l}));this.input(l)}},setValue:function(e,t){var n=this.field;n&&(t=i({},n,this._value(t))),this.cacheValue[e]!==JSON.stringify(n?t[n]:t)&&this.cache(e,t)},addRule:function(e,n){var r=this,l=this.formCreateInject.form.copyRules(this.rule||[]),a=this.options?o({},this.options):{submitBtn:!1,resetBtn:!1};if(this.defaultValue){a.formData||(a.formData={});var u=v(this.defaultValue);!function(){b.apply(this,arguments)}(a.formData,this.field?i({},this.field,u):u)}this.cacheRule[++this.len]={rule:l,options:a},n&&t.nextTick((function(){return r.$emit("add",l,Object.keys(r.cacheRule).length-1)}))},add$f:function(e,n,o){var r=this;this.cacheRule[n].$f=o,this.formData(n,o.formData()),t.nextTick((function(){r.syncDisabled&&o.disabled(r.disabled),r.$emit("itemMounted",o,Object.keys(r.cacheRule).indexOf(n))}))},removeRule:function(e,n){var o=this,r=Object.keys(this.cacheRule).indexOf(e);delete this.cacheRule[e],delete this.cacheValue[e],n&&t.nextTick((function(){return o.$emit("remove",r)}))},add:function(){this.disabled||!1===this.onBeforeAdd(this.modelValue)||(this.modelValue.push(this.field?null:{}),this.$emit("update:modelValue",this.modelValue))},del:function(e,t){this.disabled||!1===this.onBeforeRemove(this.modelValue,e)||(this.removeRule(t,!0),this.modelValue.splice(e,1),this.input(this.modelValue))},addIcon:function(e){return t.createVNode(t.resolveComponent("ElIcon"),{key:"a".concat(e),style:"font-size:".concat(this.fontSize,"px;cursor:").concat(this.disabled?"not-allowed;color:#c9cdd4":"pointer",";"),onClick:this.add},{default:function(){return[t.createVNode(c,null,null)]}})},delIcon:function(e,n){var o=this;return t.createVNode(t.resolveComponent("ElIcon"),{key:"d".concat(n),class:"el-icon-remove-outline",style:"font-size:".concat(this.fontSize,"px;cursor:").concat(this.disabled?"not-allowed;color:#c9cdd4":"pointer;color:#606266",";"),onClick:function(){return o.del(e,n)}},{default:function(){return[t.createVNode(d,null,null)]}})},makeIcon:function(e,t,n){var o=this;return this.$slots.button?this.$slots.button({total:e,index:t,vm:this,key:n,del:function(){return o.del(t,n)},add:this.add}):0===t?[0!==this.max&&e>=this.max?null:this.addIcon(n),0===this.min||e>this.min?this.delIcon(t,n):null]:t>=this.min?this.delIcon(t,n):void 0},emitEvent:function(e,t,n,o){this.$emit.apply(this,[e].concat(l(t),[this.cacheRule[o].$f,n]))},expandRule:function(e){for(var t=0;t<e;t++)this.modelValue.push(this.field?null:{})}},created:function(){for(var e=(this.expand||0)-this.modelValue.length,t=0;t<this.modelValue.length;t++)this.addRule(t);e>0&&this.expandRule(e)},render:function(){var e=this,n=Object.keys(this.cacheRule),o=this.button,r=this.form;return 0===n.length?this.$slots.default?this.$slots.default({vm:this,add:this.add}):t.createVNode(t.resolveComponent("ElIcon"),{key:1,style:"font-size:".concat(this.fontSize,"px;vertical-align:middle;color:").concat(this.disabled?"#c9cdd4;cursor: not-allowed":"#606266;cursor:pointer",";"),onClick:this.add},{default:function(){return[t.createVNode(c,null,null)]}}):t.createVNode("div",{key:2},[n.map((function(l,a){var u,c=e.cacheRule[l],s=c.rule,f=c.options;return t.createVNode(t.resolveComponent("ElRow"),{align:"middle",type:"flex",key:l,style:"border-bottom:1px dashed #DCDFE6;margin-bottom:10px;"},{default:function(){return[t.createVNode(t.resolveComponent("ElCol"),{span:o?20:24},{default:function(){return[t.createVNode(t.resolveComponent("ElFormItem"),null,{default:function(){return[t.createVNode(r,{key:l,inFor:!0,"onUpdate:modelValue":function(t){return e.formData(l,t)},modelValue:e.field?i({},e.field,e._value(e.modelValue[a])):e.modelValue[a],"onEmit-event":function(t){for(var n=arguments.length,o=new Array(n>1?n-1:0),r=1;r<n;r++)o[r-1]=arguments[r];return e.emitEvent(t,o,a,l)},"onUpdate:api":function(t){return e.add$f(a,l,t)},rule:s,option:f,extendOption:!0},null)]}})]}}),o?t.createVNode(t.resolveComponent("ElCol"),{span:2,pull:1,push:1},(c=u=e.makeIcon(n.length,a,l),"function"==typeof c||"[object Object]"===Object.prototype.toString.call(c)&&!t.isVNode(c)?u:{default:function(){return[u]}})):null];var c}})}))])}});e.default=g,Object.defineProperty(e,"__esModule",{value:!0})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@form-create/component-elm-group",
|
|
3
|
-
"version": "3.1.
|
|
3
|
+
"version": "3.1.4",
|
|
4
4
|
"description": "@form-create/element-ui 内置组件",
|
|
5
5
|
"main": "./dist/index.min.js",
|
|
6
6
|
"module": "./dist/index.esm.js",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"author": "xaboy",
|
|
31
31
|
"license": "MIT",
|
|
32
32
|
"dependencies": {
|
|
33
|
-
"@form-create/utils": "^3.1.
|
|
33
|
+
"@form-create/utils": "^3.1.3"
|
|
34
34
|
},
|
|
35
35
|
"bugs": {
|
|
36
36
|
"url": "https://github.com/xaboy/form-create/issues"
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"esm"
|
|
48
48
|
]
|
|
49
49
|
},
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "060ecdb8dd0f8893fa0e47415ef727472ffb381f"
|
|
51
51
|
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<svg class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
|
|
3
|
+
<path fill="currentColor" d="M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"></path>
|
|
4
|
+
<path fill="currentColor" d="M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"></path>
|
|
5
|
+
<path fill="currentColor"
|
|
6
|
+
d="M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"></path>
|
|
7
|
+
</svg>
|
|
8
|
+
</template>
|
|
9
|
+
|
|
10
|
+
<script>
|
|
11
|
+
export default {
|
|
12
|
+
name: 'IconCirclePlus'
|
|
13
|
+
}
|
|
14
|
+
</script>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<svg class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
|
|
3
|
+
<path fill="currentColor" d="M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"></path>
|
|
4
|
+
<path fill="currentColor"
|
|
5
|
+
d="M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"></path>
|
|
6
|
+
</svg>
|
|
7
|
+
</template>
|
|
8
|
+
|
|
9
|
+
<script>
|
|
10
|
+
export default {
|
|
11
|
+
name: 'IconRemove'
|
|
12
|
+
}
|
|
13
|
+
</script>
|
package/src/component.jsx
CHANGED
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
import {hasProperty} from '@form-create/utils/lib/type';
|
|
2
2
|
import {defineComponent, markRaw, nextTick} from 'vue';
|
|
3
|
+
import IconCirclePlus from './IconCirclePlus.vue';
|
|
4
|
+
import IconRemove from './IconRemove.vue';
|
|
5
|
+
import {deepCopy} from '@form-create/utils/lib/deepextend';
|
|
6
|
+
import extend from '@form-create/utils/lib/extend';
|
|
3
7
|
|
|
4
8
|
const NAME = 'fcGroup';
|
|
5
9
|
|
|
@@ -26,6 +30,7 @@ export default defineComponent({
|
|
|
26
30
|
type: Array,
|
|
27
31
|
default: () => []
|
|
28
32
|
},
|
|
33
|
+
defaultValue: Object,
|
|
29
34
|
disabled: {
|
|
30
35
|
type: Boolean,
|
|
31
36
|
default: false
|
|
@@ -90,7 +95,6 @@ export default defineComponent({
|
|
|
90
95
|
for (let i = 0; i < len; i++) {
|
|
91
96
|
this.removeRule(keys[total - i - 1]);
|
|
92
97
|
}
|
|
93
|
-
this.subForm();
|
|
94
98
|
}
|
|
95
99
|
n.forEach((val, i) => {
|
|
96
100
|
this.setValue(keys[i], n[i]);
|
|
@@ -98,7 +102,6 @@ export default defineComponent({
|
|
|
98
102
|
}
|
|
99
103
|
},
|
|
100
104
|
deep: true,
|
|
101
|
-
flush: 'post',
|
|
102
105
|
}
|
|
103
106
|
},
|
|
104
107
|
methods: {
|
|
@@ -142,6 +145,11 @@ export default defineComponent({
|
|
|
142
145
|
submitBtn: false,
|
|
143
146
|
resetBtn: false,
|
|
144
147
|
};
|
|
148
|
+
if (this.defaultValue) {
|
|
149
|
+
if (!options.formData) options.formData = {};
|
|
150
|
+
const defVal = deepCopy(this.defaultValue);
|
|
151
|
+
extend(options.formData, this.field ? {[this.field]: defVal} : defVal);
|
|
152
|
+
}
|
|
145
153
|
this.cacheRule[++this.len] = {rule, options};
|
|
146
154
|
if (emit) {
|
|
147
155
|
nextTick(() => this.$emit('add', rule, Object.keys(this.cacheRule).length - 1));
|
|
@@ -149,7 +157,7 @@ export default defineComponent({
|
|
|
149
157
|
},
|
|
150
158
|
add$f(i, key, $f) {
|
|
151
159
|
this.cacheRule[key].$f = $f;
|
|
152
|
-
this.
|
|
160
|
+
this.formData(key, $f.formData());
|
|
153
161
|
nextTick(() => {
|
|
154
162
|
if (this.syncDisabled) {
|
|
155
163
|
$f.disabled(this.disabled);
|
|
@@ -157,9 +165,6 @@ export default defineComponent({
|
|
|
157
165
|
this.$emit('itemMounted', $f, Object.keys(this.cacheRule).indexOf(key));
|
|
158
166
|
});
|
|
159
167
|
},
|
|
160
|
-
subForm() {
|
|
161
|
-
this.formCreateInject.subForm(Object.keys(this.cacheRule).map(k => this.cacheRule[k].$f));
|
|
162
|
-
},
|
|
163
168
|
removeRule(key, emit) {
|
|
164
169
|
const index = Object.keys(this.cacheRule).indexOf(key);
|
|
165
170
|
delete this.cacheRule[key];
|
|
@@ -180,22 +185,21 @@ export default defineComponent({
|
|
|
180
185
|
return;
|
|
181
186
|
}
|
|
182
187
|
this.removeRule(key, true);
|
|
183
|
-
this.subForm();
|
|
184
188
|
this.modelValue.splice(index, 1);
|
|
185
189
|
this.input(this.modelValue);
|
|
186
190
|
},
|
|
187
191
|
addIcon(key) {
|
|
188
|
-
return <
|
|
192
|
+
return <ElIcon key={`a${key}`}
|
|
189
193
|
style={`font-size:${this.fontSize}px;cursor:${this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer'};`}
|
|
190
194
|
onClick={this.add}>
|
|
191
|
-
<
|
|
192
|
-
</
|
|
195
|
+
<IconCirclePlus/>
|
|
196
|
+
</ElIcon>
|
|
193
197
|
},
|
|
194
198
|
delIcon(index, key) {
|
|
195
199
|
return <ElIcon key={`d${key}`} class="el-icon-remove-outline"
|
|
196
200
|
style={`font-size:${this.fontSize}px;cursor:${this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266'};`}
|
|
197
201
|
onClick={() => this.del(index, key)}>
|
|
198
|
-
<
|
|
202
|
+
<IconRemove/>
|
|
199
203
|
</ElIcon>
|
|
200
204
|
},
|
|
201
205
|
makeIcon(total, index, key) {
|
|
@@ -242,15 +246,17 @@ export default defineComponent({
|
|
|
242
246
|
(this.$slots.default ? (this.$slots.default({
|
|
243
247
|
vm: this,
|
|
244
248
|
add: this.add
|
|
245
|
-
})) : <
|
|
249
|
+
})) : <ElIcon key={1}
|
|
246
250
|
style={`font-size:${this.fontSize}px;vertical-align:middle;color:${this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer'};`}
|
|
247
|
-
onClick={this.add}
|
|
251
|
+
onClick={this.add}>
|
|
252
|
+
<IconCirclePlus/>
|
|
253
|
+
</ElIcon>) :
|
|
248
254
|
<div key={2}>{keys.map((key, index) => {
|
|
249
255
|
const {rule, options} = this.cacheRule[key];
|
|
250
256
|
return <ElRow align="middle" type="flex" key={key}
|
|
251
257
|
style="border-bottom:1px dashed #DCDFE6;margin-bottom:10px;">
|
|
252
258
|
<ElCol span={button ? 20 : 24}><ElFormItem><Type
|
|
253
|
-
key={key}
|
|
259
|
+
key={key} inFor={true}
|
|
254
260
|
onUpdate:modelValue={(formData) => this.formData(key, formData)}
|
|
255
261
|
modelValue={this.field ? {[this.field]: this._value(this.modelValue[index])} : this.modelValue[index]}
|
|
256
262
|
onEmit-event={(name, ...args) => this.emitEvent(name, args, index, key)}
|