@form-create/component-elm-group 3.1.1 → 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/dist/index.esm.js +70 -8
- package/dist/index.esm.min.js +2 -2
- package/dist/index.js +69 -7
- 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 +10 -6
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.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
|
}
|
|
@@ -360,13 +419,13 @@ var Group = defineComponent({
|
|
|
360
419
|
this.input(this.modelValue);
|
|
361
420
|
},
|
|
362
421
|
addIcon: function addIcon(key) {
|
|
363
|
-
return createVNode(resolveComponent("
|
|
422
|
+
return createVNode(resolveComponent("ElIcon"), {
|
|
364
423
|
"key": "a".concat(key),
|
|
365
424
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"),
|
|
366
425
|
"onClick": this.add
|
|
367
426
|
}, {
|
|
368
427
|
"default": function _default() {
|
|
369
|
-
return [createVNode(
|
|
428
|
+
return [createVNode(script$1, null, null)];
|
|
370
429
|
}
|
|
371
430
|
});
|
|
372
431
|
},
|
|
@@ -382,7 +441,7 @@ var Group = defineComponent({
|
|
|
382
441
|
}
|
|
383
442
|
}, {
|
|
384
443
|
"default": function _default() {
|
|
385
|
-
return [createVNode(
|
|
444
|
+
return [createVNode(script, null, null)];
|
|
386
445
|
}
|
|
387
446
|
});
|
|
388
447
|
},
|
|
@@ -439,12 +498,15 @@ var Group = defineComponent({
|
|
|
439
498
|
return keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
|
|
440
499
|
vm: this,
|
|
441
500
|
add: this.add
|
|
442
|
-
}) : createVNode("
|
|
501
|
+
}) : createVNode(resolveComponent("ElIcon"), {
|
|
443
502
|
"key": 1,
|
|
444
|
-
"class": "el-icon-circle-plus-outline",
|
|
445
503
|
"style": "font-size:".concat(this.fontSize, "px;vertical-align:middle;color:").concat(this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer', ";"),
|
|
446
504
|
"onClick": this.add
|
|
447
|
-
},
|
|
505
|
+
}, {
|
|
506
|
+
"default": function _default() {
|
|
507
|
+
return [createVNode(script$1, null, null)];
|
|
508
|
+
}
|
|
509
|
+
}) : createVNode("div", {
|
|
448
510
|
"key": 2
|
|
449
511
|
}, [keys.map(function (key, index) {
|
|
450
512
|
var _slot;
|
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.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.1.
|
|
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
|
}
|
|
@@ -364,13 +423,13 @@
|
|
|
364
423
|
this.input(this.modelValue);
|
|
365
424
|
},
|
|
366
425
|
addIcon: function addIcon(key) {
|
|
367
|
-
return vue.createVNode(vue.resolveComponent("
|
|
426
|
+
return vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
368
427
|
"key": "a".concat(key),
|
|
369
428
|
"style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"),
|
|
370
429
|
"onClick": this.add
|
|
371
430
|
}, {
|
|
372
431
|
"default": function _default() {
|
|
373
|
-
return [vue.createVNode(
|
|
432
|
+
return [vue.createVNode(script$1, null, null)];
|
|
374
433
|
}
|
|
375
434
|
});
|
|
376
435
|
},
|
|
@@ -386,7 +445,7 @@
|
|
|
386
445
|
}
|
|
387
446
|
}, {
|
|
388
447
|
"default": function _default() {
|
|
389
|
-
return [vue.createVNode(
|
|
448
|
+
return [vue.createVNode(script, null, null)];
|
|
390
449
|
}
|
|
391
450
|
});
|
|
392
451
|
},
|
|
@@ -443,12 +502,15 @@
|
|
|
443
502
|
return keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
|
|
444
503
|
vm: this,
|
|
445
504
|
add: this.add
|
|
446
|
-
}) : vue.createVNode("
|
|
505
|
+
}) : vue.createVNode(vue.resolveComponent("ElIcon"), {
|
|
447
506
|
"key": 1,
|
|
448
|
-
"class": "el-icon-circle-plus-outline",
|
|
449
507
|
"style": "font-size:".concat(this.fontSize, "px;vertical-align:middle;color:").concat(this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer', ";"),
|
|
450
508
|
"onClick": this.add
|
|
451
|
-
},
|
|
509
|
+
}, {
|
|
510
|
+
"default": function _default() {
|
|
511
|
+
return [vue.createVNode(script$1, null, null)];
|
|
512
|
+
}
|
|
513
|
+
}) : vue.createVNode("div", {
|
|
452
514
|
"key": 2
|
|
453
515
|
}, [keys.map(function (key, index) {
|
|
454
516
|
var _slot;
|
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.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.1.
|
|
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.1.
|
|
33
|
+
"@form-create/utils": "^3.1.2"
|
|
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": "e95ebb3f256032d0a7bb64e739b721fbf58b80ff"
|
|
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,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
|
|
|
@@ -185,17 +187,17 @@ 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
192
|
onClick={this.add}>
|
|
191
|
-
<
|
|
192
|
-
</
|
|
193
|
+
<IconCirclePlus/>
|
|
194
|
+
</ElIcon>
|
|
193
195
|
},
|
|
194
196
|
delIcon(index, key) {
|
|
195
197
|
return <ElIcon key={`d${key}`} class="el-icon-remove-outline"
|
|
196
198
|
style={`font-size:${this.fontSize}px;cursor:${this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266'};`}
|
|
197
199
|
onClick={() => this.del(index, key)}>
|
|
198
|
-
<
|
|
200
|
+
<IconRemove/>
|
|
199
201
|
</ElIcon>
|
|
200
202
|
},
|
|
201
203
|
makeIcon(total, index, key) {
|
|
@@ -242,9 +244,11 @@ export default defineComponent({
|
|
|
242
244
|
(this.$slots.default ? (this.$slots.default({
|
|
243
245
|
vm: this,
|
|
244
246
|
add: this.add
|
|
245
|
-
})) : <
|
|
247
|
+
})) : <ElIcon key={1}
|
|
246
248
|
style={`font-size:${this.fontSize}px;vertical-align:middle;color:${this.disabled ? '#c9cdd4;cursor: not-allowed' : '#606266;cursor:pointer'};`}
|
|
247
|
-
onClick={this.add}
|
|
249
|
+
onClick={this.add}>
|
|
250
|
+
<IconCirclePlus/>
|
|
251
|
+
</ElIcon>) :
|
|
248
252
|
<div key={2}>{keys.map((key, index) => {
|
|
249
253
|
const {rule, options} = this.cacheRule[key];
|
|
250
254
|
return <ElRow align="middle" type="flex" key={key}
|