@form-create/component-elm-group 3.0.0-alpha.4 → 3.1.2
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/LICENSE +1 -1
- package/README.md +1 -1
- package/dist/index.esm.js +83 -14
- package/dist/index.esm.min.js +2 -2
- package/dist/index.js +82 -13
- package/dist/index.min.js +2 -2
- package/package.json +4 -3
- package/src/IconCirclePlus.vue +14 -0
- package/src/IconRemove.vue +13 -0
- package/src/component.jsx +16 -8
package/LICENSE
CHANGED
package/README.md
CHANGED
|
@@ -2,5 +2,5 @@
|
|
|
2
2
|
|
|
3
3
|
@form-create/element-ui 内置组件
|
|
4
4
|
|
|
5
|
-
[GitHub](https://github.com/xaboy/form-create) | [文档](http://form-create.com/
|
|
5
|
+
[GitHub](https://github.com/xaboy/form-create) | [文档](http://form-create.com/v3/) | [Document](http://form-create.com/v3/)
|
|
6
6
|
|
package/dist/index.esm.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.
|
|
2
|
+
* @form-create/component-elm-group v3.1.2
|
|
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);
|
|
@@ -131,6 +131,65 @@ function hasProperty(rule, k) {
|
|
|
131
131
|
return {}.hasOwnProperty.call(rule, k);
|
|
132
132
|
}
|
|
133
133
|
|
|
134
|
+
var script$1 = {
|
|
135
|
+
name: 'IconCirclePlus'
|
|
136
|
+
};
|
|
137
|
+
|
|
138
|
+
var _hoisted_1$1 = {
|
|
139
|
+
"class": "icon",
|
|
140
|
+
viewBox: "0 0 1024 1024",
|
|
141
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
142
|
+
};
|
|
143
|
+
|
|
144
|
+
var _hoisted_2$1 = /*#__PURE__*/createElementVNode("path", {
|
|
145
|
+
fill: "currentColor",
|
|
146
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
147
|
+
}, null, -1);
|
|
148
|
+
|
|
149
|
+
var _hoisted_3$1 = /*#__PURE__*/createElementVNode("path", {
|
|
150
|
+
fill: "currentColor",
|
|
151
|
+
d: "M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"
|
|
152
|
+
}, null, -1);
|
|
153
|
+
|
|
154
|
+
var _hoisted_4$1 = /*#__PURE__*/createElementVNode("path", {
|
|
155
|
+
fill: "currentColor",
|
|
156
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
157
|
+
}, null, -1);
|
|
158
|
+
|
|
159
|
+
var _hoisted_5 = [_hoisted_2$1, _hoisted_3$1, _hoisted_4$1];
|
|
160
|
+
function render$1(_ctx, _cache, $props, $setup, $data, $options) {
|
|
161
|
+
return openBlock(), createElementBlock("svg", _hoisted_1$1, _hoisted_5);
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
script$1.render = render$1;
|
|
165
|
+
|
|
166
|
+
var script = {
|
|
167
|
+
name: 'IconRemove'
|
|
168
|
+
};
|
|
169
|
+
|
|
170
|
+
var _hoisted_1 = {
|
|
171
|
+
"class": "icon",
|
|
172
|
+
viewBox: "0 0 1024 1024",
|
|
173
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
174
|
+
};
|
|
175
|
+
|
|
176
|
+
var _hoisted_2 = /*#__PURE__*/createElementVNode("path", {
|
|
177
|
+
fill: "currentColor",
|
|
178
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
179
|
+
}, null, -1);
|
|
180
|
+
|
|
181
|
+
var _hoisted_3 = /*#__PURE__*/createElementVNode("path", {
|
|
182
|
+
fill: "currentColor",
|
|
183
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
184
|
+
}, null, -1);
|
|
185
|
+
|
|
186
|
+
var _hoisted_4 = [_hoisted_2, _hoisted_3];
|
|
187
|
+
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
188
|
+
return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_4);
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
script.render = render;
|
|
192
|
+
|
|
134
193
|
function _isSlot(s) {
|
|
135
194
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
|
|
136
195
|
}
|
|
@@ -180,9 +239,9 @@ var Group = defineComponent({
|
|
|
180
239
|
onBeforeAdd: {
|
|
181
240
|
type: Function,
|
|
182
241
|
"default": function _default() {}
|
|
183
|
-
}
|
|
242
|
+
},
|
|
243
|
+
formCreateInject: Object
|
|
184
244
|
},
|
|
185
|
-
inject: ['formCreateInject'],
|
|
186
245
|
data: function data() {
|
|
187
246
|
return {
|
|
188
247
|
len: 0,
|
|
@@ -360,24 +419,31 @@ var Group = defineComponent({
|
|
|
360
419
|
this.input(this.modelValue);
|
|
361
420
|
},
|
|
362
421
|
addIcon: function addIcon(key) {
|
|
363
|
-
return createVNode("
|
|
422
|
+
return createVNode(resolveComponent("ElIcon"), {
|
|
364
423
|
"key": "a".concat(key),
|
|
365
|
-
"class": "el-icon-circle-plus-outline",
|
|
366
424
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"),
|
|
367
425
|
"onClick": this.add
|
|
368
|
-
},
|
|
426
|
+
}, {
|
|
427
|
+
"default": function _default() {
|
|
428
|
+
return [createVNode(script$1, null, null)];
|
|
429
|
+
}
|
|
430
|
+
});
|
|
369
431
|
},
|
|
370
432
|
delIcon: function delIcon(index, key) {
|
|
371
433
|
var _this7 = this;
|
|
372
434
|
|
|
373
|
-
return createVNode("
|
|
435
|
+
return createVNode(resolveComponent("ElIcon"), {
|
|
374
436
|
"key": "d".concat(key),
|
|
375
437
|
"class": "el-icon-remove-outline",
|
|
376
438
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266', ";"),
|
|
377
439
|
"onClick": function onClick() {
|
|
378
440
|
return _this7.del(index, key);
|
|
379
441
|
}
|
|
380
|
-
},
|
|
442
|
+
}, {
|
|
443
|
+
"default": function _default() {
|
|
444
|
+
return [createVNode(script, null, null)];
|
|
445
|
+
}
|
|
446
|
+
});
|
|
381
447
|
},
|
|
382
448
|
makeIcon: function makeIcon(total, index, key) {
|
|
383
449
|
var _this8 = this;
|
|
@@ -432,13 +498,16 @@ var Group = defineComponent({
|
|
|
432
498
|
return keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
|
|
433
499
|
vm: this,
|
|
434
500
|
add: this.add
|
|
435
|
-
}) : createVNode("
|
|
436
|
-
"key":
|
|
437
|
-
"class": "el-icon-circle-plus-outline",
|
|
501
|
+
}) : createVNode(resolveComponent("ElIcon"), {
|
|
502
|
+
"key": 1,
|
|
438
503
|
"style": "font-size:".concat(this.fontSize, "px;vertical-align:middle;color:").concat(this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer', ";"),
|
|
439
504
|
"onClick": this.add
|
|
440
|
-
},
|
|
441
|
-
"
|
|
505
|
+
}, {
|
|
506
|
+
"default": function _default() {
|
|
507
|
+
return [createVNode(script$1, null, null)];
|
|
508
|
+
}
|
|
509
|
+
}) : createVNode("div", {
|
|
510
|
+
"key": 2
|
|
442
511
|
}, [keys.map(function (key, index) {
|
|
443
512
|
var _slot;
|
|
444
513
|
|
package/dist/index.esm.min.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.
|
|
2
|
+
* @form-create/component-elm-group v3.1.2
|
|
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 o,markRaw as r,nextTick as i,createVNode as l,resolveComponent as u,isVNode as a}from"vue";function c(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 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 m(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 m(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 m(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 m(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 p={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&&!p.Object(e)},trueArray:function(e){return Array.isArray(e)&&e.length>0}};["Date","Object","Function","String","Boolean","Array","Number"].forEach((function(e){p[e]=function(t){return p.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,o,r,i,l,u){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)];g.render=function(n,o,r,i,l,u){return e(),t("svg",O,j)};var R=o({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:r(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,o=this.cacheRule,r=Object.keys(o);if(r.filter((function(e){return o[e].$f})).length===r.length){var i=r.map((function(o){var r=e===o?t:s({},n.cacheRule[o].$f.form),i=n.field?r[n.field]||null:r;return n.cache(o,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,o=this.formCreateInject.form.copyRules(this.rule||[]),r=this.options?s({},this.options):{submitBtn:!1,resetBtn:!1};this.cacheRule[++this.len]={rule:o,options:r},t&&i((function(){return n.$emit("add",o,Object.keys(n.cacheRule).length-1)}))},add$f:function(e,t,n){var o=this;this.cacheRule[t].$f=n,this.subForm(),i((function(){o.syncDisabled&&n.disabled(o.disabled),o.$emit("itemMounted",n,Object.keys(o.cacheRule).indexOf(t))}))},subForm:function(){var e=this;this.formCreateInject.subForm(Object.keys(this.cacheRule).map((function(t){return e.cacheRule[t].$f})))},removeRule:function(e,t){var n=this,o=Object.keys(this.cacheRule).indexOf(e);delete this.cacheRule[e],delete this.cacheValue[e],t&&i((function(){return n.$emit("remove",o)}))},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 l(u("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(u("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 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(h(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,t=Object.keys(this.cacheRule),n=this.button,o=this.form;return 0===t.length?this.$slots.default?this.$slots.default({vm:this,add:this.add}):l(u("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(r,i){var c,s=e.cacheRule[r],f=s.rule,h=s.options;return l(u("ElRow"),{align:"middle",type:"flex",key:r,style:"border-bottom:1px dashed #DCDFE6;margin-bottom:10px;"},{default:function(){return[l(u("ElCol"),{span:n?20:24},{default:function(){return[l(u("ElFormItem"),null,{default:function(){return[l(o,{key:r,"onUpdate:modelValue":function(t){return e.formData(r,t)},modelValue:e.field?d({},e.field,e._value(e.modelValue[i])):e.modelValue[i],"onEmit-event":function(t){for(var n=arguments.length,o=new Array(n>1?n-1:0),l=1;l<n;l++)o[l-1]=arguments[l];return e.emitEvent(t,o,i,r)},"onUpdate:api":function(t){return e.add$f(i,r,t)},rule:f,option:h,extendOption:!0},null)]}})]}}),n?l(u("ElCol"),{span:2,pull:1,push:1},(s=c=e.makeIcon(t.length,i,r),"function"==typeof s||"[object Object]"===Object.prototype.toString.call(s)&&!a(s)?c:{default:function(){return[c]}})):null];var s}})}))])}});export{R as default};
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.
|
|
2
|
+
* @form-create/component-elm-group v3.1.2
|
|
3
3
|
* (c) 2018-2022 xaboy
|
|
4
4
|
* Github https://github.com/xaboy/form-create with group
|
|
5
5
|
* Released under the MIT License.
|
|
@@ -135,6 +135,65 @@
|
|
|
135
135
|
return {}.hasOwnProperty.call(rule, k);
|
|
136
136
|
}
|
|
137
137
|
|
|
138
|
+
var script$1 = {
|
|
139
|
+
name: 'IconCirclePlus'
|
|
140
|
+
};
|
|
141
|
+
|
|
142
|
+
var _hoisted_1$1 = {
|
|
143
|
+
"class": "icon",
|
|
144
|
+
viewBox: "0 0 1024 1024",
|
|
145
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
146
|
+
};
|
|
147
|
+
|
|
148
|
+
var _hoisted_2$1 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
149
|
+
fill: "currentColor",
|
|
150
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
151
|
+
}, null, -1);
|
|
152
|
+
|
|
153
|
+
var _hoisted_3$1 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
154
|
+
fill: "currentColor",
|
|
155
|
+
d: "M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"
|
|
156
|
+
}, null, -1);
|
|
157
|
+
|
|
158
|
+
var _hoisted_4$1 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
159
|
+
fill: "currentColor",
|
|
160
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
161
|
+
}, null, -1);
|
|
162
|
+
|
|
163
|
+
var _hoisted_5 = [_hoisted_2$1, _hoisted_3$1, _hoisted_4$1];
|
|
164
|
+
function render$1(_ctx, _cache, $props, $setup, $data, $options) {
|
|
165
|
+
return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$1, _hoisted_5);
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
script$1.render = render$1;
|
|
169
|
+
|
|
170
|
+
var script = {
|
|
171
|
+
name: 'IconRemove'
|
|
172
|
+
};
|
|
173
|
+
|
|
174
|
+
var _hoisted_1 = {
|
|
175
|
+
"class": "icon",
|
|
176
|
+
viewBox: "0 0 1024 1024",
|
|
177
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
178
|
+
};
|
|
179
|
+
|
|
180
|
+
var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
181
|
+
fill: "currentColor",
|
|
182
|
+
d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
|
|
183
|
+
}, null, -1);
|
|
184
|
+
|
|
185
|
+
var _hoisted_3 = /*#__PURE__*/vue.createElementVNode("path", {
|
|
186
|
+
fill: "currentColor",
|
|
187
|
+
d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
|
|
188
|
+
}, null, -1);
|
|
189
|
+
|
|
190
|
+
var _hoisted_4 = [_hoisted_2, _hoisted_3];
|
|
191
|
+
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
192
|
+
return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1, _hoisted_4);
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
script.render = render;
|
|
196
|
+
|
|
138
197
|
function _isSlot(s) {
|
|
139
198
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
|
|
140
199
|
}
|
|
@@ -184,9 +243,9 @@
|
|
|
184
243
|
onBeforeAdd: {
|
|
185
244
|
type: Function,
|
|
186
245
|
"default": function _default() {}
|
|
187
|
-
}
|
|
246
|
+
},
|
|
247
|
+
formCreateInject: Object
|
|
188
248
|
},
|
|
189
|
-
inject: ['formCreateInject'],
|
|
190
249
|
data: function data() {
|
|
191
250
|
return {
|
|
192
251
|
len: 0,
|
|
@@ -364,24 +423,31 @@
|
|
|
364
423
|
this.input(this.modelValue);
|
|
365
424
|
},
|
|
366
425
|
addIcon: function addIcon(key) {
|
|
367
|
-
return vue.createVNode("
|
|
426
|
+
return vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
368
427
|
"key": "a".concat(key),
|
|
369
|
-
"class": "el-icon-circle-plus-outline",
|
|
370
428
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"),
|
|
371
429
|
"onClick": this.add
|
|
372
|
-
},
|
|
430
|
+
}, {
|
|
431
|
+
"default": function _default() {
|
|
432
|
+
return [vue.createVNode(script$1, null, null)];
|
|
433
|
+
}
|
|
434
|
+
});
|
|
373
435
|
},
|
|
374
436
|
delIcon: function delIcon(index, key) {
|
|
375
437
|
var _this7 = this;
|
|
376
438
|
|
|
377
|
-
return vue.createVNode("
|
|
439
|
+
return vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
378
440
|
"key": "d".concat(key),
|
|
379
441
|
"class": "el-icon-remove-outline",
|
|
380
442
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266', ";"),
|
|
381
443
|
"onClick": function onClick() {
|
|
382
444
|
return _this7.del(index, key);
|
|
383
445
|
}
|
|
384
|
-
},
|
|
446
|
+
}, {
|
|
447
|
+
"default": function _default() {
|
|
448
|
+
return [vue.createVNode(script, null, null)];
|
|
449
|
+
}
|
|
450
|
+
});
|
|
385
451
|
},
|
|
386
452
|
makeIcon: function makeIcon(total, index, key) {
|
|
387
453
|
var _this8 = this;
|
|
@@ -436,13 +502,16 @@
|
|
|
436
502
|
return keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
|
|
437
503
|
vm: this,
|
|
438
504
|
add: this.add
|
|
439
|
-
}) : vue.createVNode("
|
|
440
|
-
"key":
|
|
441
|
-
"class": "el-icon-circle-plus-outline",
|
|
505
|
+
}) : vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
506
|
+
"key": 1,
|
|
442
507
|
"style": "font-size:".concat(this.fontSize, "px;vertical-align:middle;color:").concat(this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer', ";"),
|
|
443
508
|
"onClick": this.add
|
|
444
|
-
},
|
|
445
|
-
"
|
|
509
|
+
}, {
|
|
510
|
+
"default": function _default() {
|
|
511
|
+
return [vue.createVNode(script$1, null, null)];
|
|
512
|
+
}
|
|
513
|
+
}) : vue.createVNode("div", {
|
|
514
|
+
"key": 2
|
|
446
515
|
}, [keys.map(function (key, index) {
|
|
447
516
|
var _slot;
|
|
448
517
|
|
package/dist/index.min.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @form-create/component-elm-group v3.
|
|
2
|
+
* @form-create/component-elm-group v3.1.2
|
|
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){
|
|
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){l(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 l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(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 a={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&&!a.Object(e)},trueArray:function(e){return Array.isArray(e)&&e.length>0}};["Date","Object","Function","String","Boolean","Array","Number"].forEach((function(e){a[e]=function(t){return a.type(t,e)}}));var c={name:"IconCirclePlus"},s={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},d=[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,l,i){return t.openBlock(),t.createElementBlock("svg",s,d)};var f={name:"IconRemove"},h={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},m=[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)];f.render=function(e,n,o,r,l,i){return t.openBlock(),t.createElementBlock("svg",h,m)};var p=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 l=r;l<0;l++)this.addRule(e.length+l);for(var i=0;i<o;i++)this.setValue(n[i],e[i])}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,l=Object.keys(r);if(l.filter((function(e){return r[e].$f})).length===l.length){var i=l.map((function(r){var l=e===r?t:o({},n.cacheRule[r].$f.form),i=n.field?l[n.field]||null:l;return n.cache(r,i),i}));this.input(i)}},setValue:function(e,t){var n=this.field;n&&(t=l({},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||[]),i=this.options?o({},this.options):{submitBtn:!1,resetBtn:!1};this.cacheRule[++this.len]={rule:l,options:i},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.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("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(f,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(i(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(i,u){var a,c=e.cacheRule[i],s=c.rule,d=c.options;return t.createVNode(t.resolveComponent("ElRow"),{align:"middle",type:"flex",key:i,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:i,"onUpdate:modelValue":function(t){return e.formData(i,t)},modelValue:e.field?l({},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,i)},"onUpdate:api":function(t){return e.add$f(u,i,t)},rule:s,option:d,extendOption:!0},null)]}})]}}),o?t.createVNode(t.resolveComponent("ElCol"),{span:2,pull:1,push:1},(c=a=e.makeIcon(n.length,u,i),"function"==typeof c||"[object Object]"===Object.prototype.toString.call(c)&&!t.isVNode(c)?a:{default:function(){return[a]}})):null];var c}})}))])}});e.default=p,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.
|
|
3
|
+
"version": "3.1.2",
|
|
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.
|
|
33
|
+
"@form-create/utils": "^3.1.2"
|
|
34
34
|
},
|
|
35
35
|
"bugs": {
|
|
36
36
|
"url": "https://github.com/xaboy/form-create/issues"
|
|
@@ -46,5 +46,6 @@
|
|
|
46
46
|
"umd",
|
|
47
47
|
"esm"
|
|
48
48
|
]
|
|
49
|
-
}
|
|
49
|
+
},
|
|
50
|
+
"gitHead": "e95ebb3f256032d0a7bb64e739b721fbf58b80ff"
|
|
50
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,7 @@
|
|
|
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';
|
|
3
5
|
|
|
4
6
|
const NAME = 'fcGroup';
|
|
5
7
|
|
|
@@ -48,8 +50,8 @@ export default defineComponent({
|
|
|
48
50
|
default: () => {
|
|
49
51
|
}
|
|
50
52
|
},
|
|
53
|
+
formCreateInject: Object,
|
|
51
54
|
},
|
|
52
|
-
inject: ['formCreateInject'],
|
|
53
55
|
data() {
|
|
54
56
|
return {
|
|
55
57
|
len: 0,
|
|
@@ -185,14 +187,18 @@ export default defineComponent({
|
|
|
185
187
|
this.input(this.modelValue);
|
|
186
188
|
},
|
|
187
189
|
addIcon(key) {
|
|
188
|
-
return <
|
|
190
|
+
return <ElIcon key={`a${key}`}
|
|
189
191
|
style={`font-size:${this.fontSize}px;cursor:${this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer'};`}
|
|
190
|
-
onClick={this.add}
|
|
192
|
+
onClick={this.add}>
|
|
193
|
+
<IconCirclePlus/>
|
|
194
|
+
</ElIcon>
|
|
191
195
|
},
|
|
192
196
|
delIcon(index, key) {
|
|
193
|
-
return <
|
|
197
|
+
return <ElIcon key={`d${key}`} class="el-icon-remove-outline"
|
|
194
198
|
style={`font-size:${this.fontSize}px;cursor:${this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266'};`}
|
|
195
|
-
onClick={() => this.del(index, key)}
|
|
199
|
+
onClick={() => this.del(index, key)}>
|
|
200
|
+
<IconRemove/>
|
|
201
|
+
</ElIcon>
|
|
196
202
|
},
|
|
197
203
|
makeIcon(total, index, key) {
|
|
198
204
|
if (this.$slots.button) {
|
|
@@ -238,10 +244,12 @@ export default defineComponent({
|
|
|
238
244
|
(this.$slots.default ? (this.$slots.default({
|
|
239
245
|
vm: this,
|
|
240
246
|
add: this.add
|
|
241
|
-
})) : <
|
|
247
|
+
})) : <ElIcon key={1}
|
|
242
248
|
style={`font-size:${this.fontSize}px;vertical-align:middle;color:${this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer'};`}
|
|
243
|
-
onClick={this.add}
|
|
244
|
-
|
|
249
|
+
onClick={this.add}>
|
|
250
|
+
<IconCirclePlus/>
|
|
251
|
+
</ElIcon>) :
|
|
252
|
+
<div key={2}>{keys.map((key, index) => {
|
|
245
253
|
const {rule, options} = this.cacheRule[key];
|
|
246
254
|
return <ElRow align="middle" type="flex" key={key}
|
|
247
255
|
style="border-bottom:1px dashed #DCDFE6;margin-bottom:10px;">
|