@form-create/component-elm-group 3.1.19 → 3.1.24

package/dist/index.js

@@ -1,5 +1,5 @@
 /*!
- * @form-create/component-elm-group v3.1.19
+ * @form-create/component-elm-group v3.1.24
  * (c) 2018-2023 xaboy
  * Github https://github.com/xaboy/form-create with group
  * Released under the MIT License.
@@ -154,65 +154,6 @@
     return {}.hasOwnProperty.call(rule, k);
   }
 
-  var script$1 = {
-    name: 'IconCirclePlus'
-  };
-
-  var _hoisted_1$1 = {
-    "class": "icon",
-    viewBox: "0 0 1024 1024",
-    xmlns: "http://www.w3.org/2000/svg"
-  };
-
-  var _hoisted_2$1 = /*#__PURE__*/vue.createElementVNode("path", {
-    fill: "currentColor",
-    d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
-  }, null, -1);
-
-  var _hoisted_3$1 = /*#__PURE__*/vue.createElementVNode("path", {
-    fill: "currentColor",
-    d: "M480 672V352a32 32 0 1164 0v320a32 32 0 01-64 0z"
-  }, null, -1);
-
-  var _hoisted_4$1 = /*#__PURE__*/vue.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);
-
-  var _hoisted_5 = [_hoisted_2$1, _hoisted_3$1, _hoisted_4$1];
-  function render$1(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$1, _hoisted_5);
-  }
-
-  script$1.render = render$1;
-
-  var script = {
-    name: 'IconRemove'
-  };
-
-  var _hoisted_1 = {
-    "class": "icon",
-    viewBox: "0 0 1024 1024",
-    xmlns: "http://www.w3.org/2000/svg"
-  };
-
-  var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
-    fill: "currentColor",
-    d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
-  }, null, -1);
-
-  var _hoisted_3 = /*#__PURE__*/vue.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);
-
-  var _hoisted_4 = [_hoisted_2, _hoisted_3];
-  function render(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1, _hoisted_4);
-  }
-
-  script.render = render;
-
   function $set(target, field, value) {
     target[field] = value;
   }
@@ -285,10 +226,36 @@
     return _extends.apply(this, arguments);
   }
 
-  function _isSlot(s) {
-    return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
+  function styleInject(css, ref) {
+    if ( ref === void 0 ) ref = {};
+    var insertAt = ref.insertAt;
+
+    if (!css || typeof document === 'undefined') { return; }
+
+    var head = document.head || document.getElementsByTagName('head')[0];
+    var style = document.createElement('style');
+    style.type = 'text/css';
+
+    if (insertAt === 'top') {
+      if (head.firstChild) {
+        head.insertBefore(style, head.firstChild);
+      } else {
+        head.appendChild(style);
+      }
+    } else {
+      head.appendChild(style);
+    }
+
+    if (style.styleSheet) {
+      style.styleSheet.cssText = css;
+    } else {
+      style.appendChild(document.createTextNode(css));
+    }
   }
 
+  var css_248z = "._fc-group{display:flex;flex-direction:column;justify-content:center;min-height:38px;width:100%}._fc-group-disabled ._fc-group-add,._fc-group-disabled ._fc-group-btn{cursor:not-allowed}._fc-group-handle{background-color:#fff;border:1px dashed #d9d9d9;border-radius:15px;bottom:-15px;display:flex;flex-direction:row;padding:3px 8px;position:absolute;right:30px}._fc-group-btn{cursor:pointer}._fc-group-idx{align-items:center;background:#eee;border-radius:15px;bottom:-15px;display:flex;font-weight:700;height:30px;justify-content:center;left:10px;position:absolute;width:30px}._fc-group-handle ._fc-group-btn+._fc-group-btn{margin-left:7px}._fc-group-container{border:1px dashed #d9d9d9;border-radius:5px;display:flex;flex-direction:column;margin:5px 5px 25px;padding:20px 20px 25px;position:relative}._fc-group-arrow{height:20px;position:relative;width:20px}._fc-group-arrow:before{border-left:2px solid #999;border-top:2px solid #999;content:\"\";height:9px;left:5px;position:absolute;top:8px;transform:rotate(45deg);width:9px}._fc-group-arrow._fc-group-down{transform:rotate(180deg)}._fc-group-plus-minus{cursor:pointer;height:20px;position:relative;width:20px}._fc-group-plus-minus:after,._fc-group-plus-minus:before{background-color:#409eff;content:\"\";height:2px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:60%}._fc-group-plus-minus:before{transform:translate(-50%,-50%) rotate(90deg)}._fc-group-plus-minus._fc-group-minus:before{display:none}._fc-group-plus-minus._fc-group-minus:after{background-color:#f56c6c}._fc-group-add{border:1px solid rgba(64,158,255,.5);border-radius:15px;cursor:pointer;height:25px;width:25px}._fc-group-add._fc-group-plus-minus:after,._fc-group-add._fc-group-plus-minus:before{width:50%}";
+  styleInject(css_248z);
+
   var NAME = 'fcGroup';
   var Group = vue.defineComponent({
     name: NAME,
@@ -316,6 +283,10 @@
         }
       },
       defaultValue: Object,
+      sortBtn: {
+        type: Boolean,
+        "default": true
+      },
       disabled: {
         type: Boolean,
         "default": false
@@ -324,10 +295,6 @@
         type: Boolean,
         "default": true
       },
-      fontSize: {
-        type: Number,
-        "default": 28
-      },
       onBeforeRemove: {
         type: Function,
         "default": function _default() {}
@@ -336,13 +303,15 @@
         type: Function,
         "default": function _default() {}
       },
-      formCreateInject: Object
+      formCreateInject: Object,
+      parse: Function
     },
     data: function data() {
       return {
         len: 0,
         cacheRule: {},
         cacheValue: {},
+        sort: [],
         form: vue.markRaw(this.formCreateInject.form.$form())
       };
     },
@@ -396,7 +365,7 @@
           var _this2 = this;
 
           n = n || [];
-          var keys = Object.keys(this.cacheRule),
+          var keys = Object.keys(this.sort),
               total = keys.length,
               len = total - n.length;
 
@@ -438,7 +407,7 @@
         var _this3 = this;
 
         var cacheRule = this.cacheRule;
-        var keys = Object.keys(cacheRule);
+        var keys = this.sort;
 
         if (keys.filter(function (k) {
           return cacheRule[k].$f;
@@ -484,6 +453,11 @@
           extend(options.formData, this.field ? _defineProperty({}, this.field, defVal) : defVal);
         }
 
+        this.parse && this.parse({
+          rule: rule,
+          options: options,
+          index: this.sort.length
+        });
         this.cacheRule[++this.len] = {
           rule: rule,
           options: options
@@ -499,7 +473,6 @@
         var _this5 = this;
 
         this.cacheRule[key].$f = $f;
-        this.formData(key, $f.formData());
         vue.nextTick(function () {
           if (_this5.syncDisabled) {
             $f.disabled(_this5.disabled);
@@ -521,13 +494,15 @@
           });
         }
       },
-      add: function add() {
+      add: function add(i) {
         if (this.disabled || false === this.onBeforeAdd(this.modelValue)) {
           return;
         }
 
-        this.modelValue.push(this.field ? null : {});
-        this.$emit('update:modelValue', this.modelValue);
+        var value = _toConsumableArray(this.modelValue);
+
+        value.push(this.defaultValue ? deepCopy(this.defaultValue) : this.field ? null : {});
+        this.input(value);
       },
       del: function del(index, key) {
         if (this.disabled || false === this.onBeforeRemove(this.modelValue, index)) {
@@ -535,38 +510,56 @@
         }
 
         this.removeRule(key, true);
-        this.modelValue.splice(index, 1);
-        this.input(this.modelValue);
+
+        var value = _toConsumableArray(this.modelValue);
+
+        value.splice(index, 1);
+        this.input(value);
       },
       addIcon: function addIcon(key) {
-        return vue.createVNode(vue.resolveComponent("ElIcon"), {
-          "key": "a".concat(key),
-          "style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"),
+        return vue.createVNode("div", {
+          "class": "_fc-group-btn _fc-group-plus-minus",
           "onClick": this.add
-        }, {
-          "default": function _default() {
-            return [vue.createVNode(script$1, null, null)];
-          }
-        });
+        }, null);
       },
       delIcon: function delIcon(index, key) {
         var _this7 = this;
 
-        return vue.createVNode(vue.resolveComponent("ElIcon"), {
-          "key": "d".concat(key),
-          "class": "el-icon-remove-outline",
-          "style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266', ";"),
+        return vue.createVNode("div", {
+          "class": "_fc-group-btn _fc-group-plus-minus _fc-group-minus",
           "onClick": function onClick() {
             return _this7.del(index, key);
           }
-        }, {
-          "default": function _default() {
-            return [vue.createVNode(script, null, null)];
+        }, null);
+      },
+      sortUpIcon: function sortUpIcon(index) {
+        var _this8 = this;
+
+        return vue.createVNode("div", {
+          "class": "_fc-group-btn _fc-group-arrow _fc-group-up",
+          "onClick": function onClick() {
+            return _this8.changeSort(index, -1);
           }
-        });
+        }, null);
+      },
+      sortDownIcon: function sortDownIcon(index) {
+        var _this9 = this;
+
+        return vue.createVNode("div", {
+          "class": "_fc-group-btn _fc-group-arrow _fc-group-down",
+          "onClick": function onClick() {
+            return _this9.changeSort(index, 1);
+          }
+        }, null);
+      },
+      changeSort: function changeSort(index, sort) {
+        var a = this.sort[index];
+        this.sort[index] = this.sort[index + sort];
+        this.sort[index + sort] = a;
+        this.formData(0);
       },
       makeIcon: function makeIcon(total, index, key) {
-        var _this8 = this;
+        var _this10 = this;
 
         if (this.$slots.button) {
           return this.$slots.button({
@@ -575,19 +568,31 @@
             vm: this,
             key: key,
             del: function del() {
-              return _this8.del(index, key);
+              return _this10.del(index, key);
             },
             add: this.add
           });
         }
 
-        if (index === 0) {
-          return [this.max !== 0 && total >= this.max ? null : this.addIcon(key), this.min === 0 || total > this.min ? this.delIcon(index, key) : null];
+        var btn = [];
+
+        if ((!this.max || total < this.max) && total === index + 1) {
+          btn.push(this.addIcon(key));
         }
 
         if (total > this.min) {
-          return this.delIcon(index, key);
+          btn.push(this.delIcon(index, key));
+        }
+
+        if (this.sortBtn && index) {
+          btn.push(this.sortUpIcon(index));
         }
+
+        if (this.sortBtn && index !== total - 1) {
+          btn.push(this.sortDownIcon(index));
+        }
+
+        return btn;
       },
       emitEvent: function emitEvent(name, args, index, key) {
         this.$emit.apply(this, [name].concat(_toConsumableArray(args), [this.cacheRule[key].$f, index]));
@@ -599,6 +604,15 @@
       }
     },
     created: function created() {
+      var _this11 = this;
+
+      vue.watch(function () {
+        return _objectSpread2({}, _this11.cacheRule);
+      }, function (n) {
+        _this11.sort = Object.keys(n);
+      }, {
+        immediate: true
+      });
       var d = (this.expand || 0) - this.modelValue.length;
 
       for (var i = 0; i < this.modelValue.length; i++) {
@@ -610,75 +624,58 @@
       }
     },
     render: function render() {
-      var _this9 = this;
+      var _this12 = this;
 
-      var keys = Object.keys(this.cacheRule);
+      var keys = this.sort;
       var button = this.button;
       var Type = this.form;
-      return keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
+      var disabled = this.disabled;
+      var children = keys.length === 0 ? this.$slots["default"] ? this.$slots["default"]({
         vm: this,
         add: this.add
-      }) : vue.createVNode(vue.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 _default() {
-          return [vue.createVNode(script$1, null, null)];
-        }
       }) : vue.createVNode("div", {
-        "style": "width: 100%;",
-        "key": 2
-      }, [keys.map(function (key, index) {
-        var _slot;
-
-        var _this9$cacheRule$key = _this9.cacheRule[key],
-            rule = _this9$cacheRule$key.rule,
-            options = _this9$cacheRule$key.options;
-        return vue.createVNode(vue.resolveComponent("ElRow"), {
-          "align": "middle",
-          "key": key,
-          "style": "border-bottom:1px dashed #DCDFE6;margin-bottom:10px;"
+        "key": 'a_def',
+        "class": "_fc-group-plus-minus _fc-group-add",
+        "onClick": this.add
+      }, null) : keys.map(function (key, index) {
+        var _this12$cacheRule$key = _this12.cacheRule[key],
+            rule = _this12$cacheRule$key.rule,
+            options = _this12$cacheRule$key.options;
+        var btn = button && !disabled ? _this12.makeIcon(keys.length, index, key) : [];
+        return vue.createVNode("div", {
+          "class": "_fc-group-container",
+          "key": key
+        }, [vue.createVNode(Type, vue.mergeProps({
+          "key": key
         }, {
-          "default": function _default() {
-            return [vue.createVNode(vue.resolveComponent("ElCol"), {
-              "span": button ? 20 : 24
-            }, {
-              "default": function _default() {
-                return [vue.createVNode(Type, {
-                  "key": key,
-                  "inFor": true,
-                  "onUpdate:modelValue": function onUpdateModelValue(formData) {
-                    return _this9.formData(key, formData);
-                  },
-                  "modelValue": _this9.field ? _defineProperty({}, _this9.field, _this9._value(_this9.modelValue[index])) : _this9.modelValue[index],
-                  "onEmit-event": function onEmitEvent(name) {
-                    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-                      args[_key - 1] = arguments[_key];
-                    }
-
-                    return _this9.emitEvent(name, args, index, key);
-                  },
-                  "onUpdate:api": function onUpdateApi($f) {
-                    return _this9.add$f(index, key, $f);
-                  },
-                  "rule": rule,
-                  "option": options,
-                  "extendOption": true
-                }, null)];
-              }
-            }), button ? vue.createVNode(vue.resolveComponent("ElCol"), {
-              "span": 2,
-              "pull": 1,
-              "push": 1
-            }, _isSlot(_slot = _this9.makeIcon(keys.length, index, key)) ? _slot : {
-              "default": function _default() {
-                return [_slot];
-              }
-            }) : null];
-          }
-        });
-      })]);
+          'onUpdate:modelValue': function onUpdateModelValue(formData) {
+            return _this12.formData(key, formData);
+          },
+          'onEmit-event': function onEmitEvent(name) {
+            for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+              args[_key - 1] = arguments[_key];
+            }
+
+            return _this12.emitEvent(name, args, index, key);
+          },
+          'onUpdate:api': function onUpdateApi($f) {
+            return _this12.add$f(index, key, $f);
+          },
+          inFor: true,
+          modelValue: _this12.field ? _defineProperty({}, _this12.field, _this12._value(_this12.modelValue[index])) : _this12.modelValue[index],
+          rule: rule,
+          option: options,
+          extendOption: true
+        }), null), vue.createVNode("div", {
+          "class": "_fc-group-idx"
+        }, [index + 1]), btn.length ? vue.createVNode("div", {
+          "class": "_fc-group-handle"
+        }, [btn]) : null]);
+      });
+      return vue.createVNode("div", {
+        "key": 'con',
+        "class": '_fc-group ' + (disabled ? '_fc-group-disabled' : '')
+      }, [children]);
     }
   });
 

package/dist/index.min.js

@@ -1,7 +1,7 @@
 /*!
- * @form-create/component-elm-group v3.1.19
+ * @form-create/component-elm-group v3.1.24
  * (c) 2018-2023 xaboy
  * Github https://github.com/xaboy/form-create with group
  * Released under the MIT License.
  */
-!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"},f={class:"icon",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},s=[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",f,s)};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","add"],watch:{rule:{handler:function(e,t){var n=this;Object.keys(this.cacheRule).forEach((function(o){var r=n.cacheRule[o];if(r.$f){var i=r.$f.formData();if(e===t)r.$f.deferSyncValue((function(){y(r.rule,e),r.$f.setValue(i)}),!0);else{var l=r.$f.formData();r.$f.once("reloading",(function(){r.$f.setValue(l)})),r.rule=v(e)}}}))},deep:!0},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,!0);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]:e>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",{style:"width: 100%;",key:2},[n.map((function(l,a){var u,c=e.cacheRule[l],f=c.rule,s=c.options;return t.createVNode(t.resolveComponent("ElRow"),{align:"middle",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(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:f,option:s,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})}));
+!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 r(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function n(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){i(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function o(e){return o="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},o(e)}function i(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function u(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 r=Object.prototype.toString.call(e).slice(8,-1);"Object"===r&&e.constructor&&(r=e.constructor.name);if("Map"===r||"Set"===r)return Array.from(e);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))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 r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}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"===o(e)&&null!==e&&1===e.nodeType&&!c.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)}};function l(e,t,r){e[t]=r}function s(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=arguments.length>2?arguments[2]:void 0,n=!1;for(var o in t)if(Object.prototype.hasOwnProperty.call(t,o)){var i=t[o];if((n=Array.isArray(i))||c.Object(i)){var u=void 0===e[o];if(n)n=!1,u&&l(e,o,[]);else if(i._clone&&void 0!==r){if(!r){l(e,o,i._clone());continue}i=i.getRule(),u&&l(e,o,{})}else u&&l(e,o,{});e[o]=s(e[o],i,r)}else l(e,o,i),c.Undef(i)||(c.Undef(i.__json)||(e[o].__json=i.__json),c.Undef(i.__origin)||(e[o].__origin=i.__origin))}return void 0!==r&&Array.isArray(e)?e.filter((function(e){return!e||!e.__ctrl})):e}function f(e){return s({},{value:e}).value}["Date","Object","String","Boolean","Array","Number"].forEach((function(e){c[e]=function(t){return c.type(t,e)}}));var d=Object.assign||function(e){for(var t,r=1;r<arguments.length;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&l(e,n,t[n]);return e};!function(e,t){void 0===t&&(t={});var r=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===r&&n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}('._fc-group{display:flex;flex-direction:column;justify-content:center;min-height:38px;width:100%}._fc-group-disabled ._fc-group-add,._fc-group-disabled ._fc-group-btn{cursor:not-allowed}._fc-group-handle{background-color:#fff;border:1px dashed #d9d9d9;border-radius:15px;bottom:-15px;display:flex;flex-direction:row;padding:3px 8px;position:absolute;right:30px}._fc-group-btn{cursor:pointer}._fc-group-idx{align-items:center;background:#eee;border-radius:15px;bottom:-15px;display:flex;font-weight:700;height:30px;justify-content:center;left:10px;position:absolute;width:30px}._fc-group-handle ._fc-group-btn+._fc-group-btn{margin-left:7px}._fc-group-container{border:1px dashed #d9d9d9;border-radius:5px;display:flex;flex-direction:column;margin:5px 5px 25px;padding:20px 20px 25px;position:relative}._fc-group-arrow{height:20px;position:relative;width:20px}._fc-group-arrow:before{border-left:2px solid #999;border-top:2px solid #999;content:"";height:9px;left:5px;position:absolute;top:8px;transform:rotate(45deg);width:9px}._fc-group-arrow._fc-group-down{transform:rotate(180deg)}._fc-group-plus-minus{cursor:pointer;height:20px;position:relative;width:20px}._fc-group-plus-minus:after,._fc-group-plus-minus:before{background-color:#409eff;content:"";height:2px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:60%}._fc-group-plus-minus:before{transform:translate(-50%,-50%) rotate(90deg)}._fc-group-plus-minus._fc-group-minus:before{display:none}._fc-group-plus-minus._fc-group-minus:after{background-color:#f56c6c}._fc-group-add{border:1px solid rgba(64,158,255,.5);border-radius:15px;cursor:pointer;height:25px;width:25px}._fc-group-add._fc-group-plus-minus:after,._fc-group-add._fc-group-plus-minus:before{width:50%}');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[]}},defaultValue:Object,sortBtn:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},syncDisabled:{type:Boolean,default:!0},onBeforeRemove:{type:Function,default:function(){}},onBeforeAdd:{type:Function,default:function(){}},formCreateInject:Object,parse:Function},data:function(){return{len:0,cacheRule:{},cacheValue:{},sort:[],form:t.markRaw(this.formCreateInject.form.$form())}},emits:["update:modelValue","change","itemMounted","remove","add"],watch:{rule:{handler:function(e,t){var r=this;Object.keys(this.cacheRule).forEach((function(n){var o=r.cacheRule[n];if(o.$f){var i=o.$f.formData();if(e===t)o.$f.deferSyncValue((function(){s(o.rule,e),o.$f.setValue(i)}),!0);else{var u=o.$f.formData();o.$f.once("reloading",(function(){o.$f.setValue(u)})),o.rule=f(e)}}}))},deep:!0},disabled:function(e){if(this.syncDisabled){var t=this.cacheRule;Object.keys(t).forEach((function(r){t[r].$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 r=Object.keys(this.sort),n=r.length,o=n-e.length;if(o<0){for(var i=o;i<0;i++)this.addRule(e.length+i,!0);for(var u=0;u<n;u++)this.setValue(r[u],e[u])}else{if(o>0)for(var a=0;a<o;a++)this.removeRule(r[n-a-1]);e.forEach((function(n,o){t.setValue(r[o],e[o])}))}},deep:!0}},methods:{_value:function(e){return e&&(t=e,r=this.field,{}.hasOwnProperty.call(t,r))?e[this.field]:e;var t,r},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 r=this,o=this.cacheRule,i=this.sort;if(i.filter((function(e){return o[e].$f})).length===i.length){var u=i.map((function(o){var i=e===o?t:n({},r.cacheRule[o].$f.form),u=r.field?i[r.field]||null:i;return r.cache(o,u),u}));this.input(u)}},setValue:function(e,t){var r=this.field;r&&(t=i({},r,this._value(t))),this.cacheValue[e]!==JSON.stringify(r?t[r]:t)&&this.cache(e,t)},addRule:function(e,r){var o=this,u=this.formCreateInject.form.copyRules(this.rule||[]),a=this.options?n({},this.options):{submitBtn:!1,resetBtn:!1};if(this.defaultValue){a.formData||(a.formData={});var c=f(this.defaultValue);!function(){d.apply(this,arguments)}(a.formData,this.field?i({},this.field,c):c)}this.parse&&this.parse({rule:u,options:a,index:this.sort.length}),this.cacheRule[++this.len]={rule:u,options:a},r&&t.nextTick((function(){return o.$emit("add",u,Object.keys(o.cacheRule).length-1)}))},add$f:function(e,r,n){var o=this;this.cacheRule[r].$f=n,t.nextTick((function(){o.syncDisabled&&n.disabled(o.disabled),o.$emit("itemMounted",n,Object.keys(o.cacheRule).indexOf(r))}))},removeRule:function(e,r){var n=this,o=Object.keys(this.cacheRule).indexOf(e);delete this.cacheRule[e],delete this.cacheValue[e],r&&t.nextTick((function(){return n.$emit("remove",o)}))},add:function(e){if(!this.disabled&&!1!==this.onBeforeAdd(this.modelValue)){var t=u(this.modelValue);t.push(this.defaultValue?f(this.defaultValue):this.field?null:{}),this.input(t)}},del:function(e,t){if(!this.disabled&&!1!==this.onBeforeRemove(this.modelValue,e)){this.removeRule(t,!0);var r=u(this.modelValue);r.splice(e,1),this.input(r)}},addIcon:function(e){return t.createVNode("div",{class:"_fc-group-btn _fc-group-plus-minus",onClick:this.add},null)},delIcon:function(e,r){var n=this;return t.createVNode("div",{class:"_fc-group-btn _fc-group-plus-minus _fc-group-minus",onClick:function(){return n.del(e,r)}},null)},sortUpIcon:function(e){var r=this;return t.createVNode("div",{class:"_fc-group-btn _fc-group-arrow _fc-group-up",onClick:function(){return r.changeSort(e,-1)}},null)},sortDownIcon:function(e){var r=this;return t.createVNode("div",{class:"_fc-group-btn _fc-group-arrow _fc-group-down",onClick:function(){return r.changeSort(e,1)}},null)},changeSort:function(e,t){var r=this.sort[e];this.sort[e]=this.sort[e+t],this.sort[e+t]=r,this.formData(0)},makeIcon:function(e,t,r){var n=this;if(this.$slots.button)return this.$slots.button({total:e,index:t,vm:this,key:r,del:function(){return n.del(t,r)},add:this.add});var o=[];return(!this.max||e<this.max)&&e===t+1&&o.push(this.addIcon(r)),e>this.min&&o.push(this.delIcon(t,r)),this.sortBtn&&t&&o.push(this.sortUpIcon(t)),this.sortBtn&&t!==e-1&&o.push(this.sortDownIcon(t)),o},emitEvent:function(e,t,r,n){this.$emit.apply(this,[e].concat(u(t),[this.cacheRule[n].$f,r]))},expandRule:function(e){for(var t=0;t<e;t++)this.modelValue.push(this.field?null:{})}},created:function(){var e=this;t.watch((function(){return n({},e.cacheRule)}),(function(t){e.sort=Object.keys(t)}),{immediate:!0});for(var r=(this.expand||0)-this.modelValue.length,o=0;o<this.modelValue.length;o++)this.addRule(o);r>0&&this.expandRule(r)},render:function(){var e=this,r=this.sort,n=this.button,o=this.form,u=this.disabled,a=0===r.length?this.$slots.default?this.$slots.default({vm:this,add:this.add}):t.createVNode("div",{key:"a_def",class:"_fc-group-plus-minus _fc-group-add",onClick:this.add},null):r.map((function(a,c){var l=e.cacheRule[a],s=l.rule,f=l.options,d=n&&!u?e.makeIcon(r.length,c,a):[];return t.createVNode("div",{class:"_fc-group-container",key:a},[t.createVNode(o,t.mergeProps({key:a},{"onUpdate:modelValue":function(t){return e.formData(a,t)},"onEmit-event":function(t){for(var r=arguments.length,n=new Array(r>1?r-1:0),o=1;o<r;o++)n[o-1]=arguments[o];return e.emitEvent(t,n,c,a)},"onUpdate:api":function(t){return e.add$f(c,a,t)},inFor:!0,modelValue:e.field?i({},e.field,e._value(e.modelValue[c])):e.modelValue[c],rule:s,option:f,extendOption:!0}),null),t.createVNode("div",{class:"_fc-group-idx"},[c+1]),d.length?t.createVNode("div",{class:"_fc-group-handle"},[d]):null])}));return t.createVNode("div",{key:"con",class:"_fc-group "+(u?"_fc-group-disabled":"")},[a])}});e.default=p,Object.defineProperty(e,"__esModule",{value:!0})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@form-create/component-elm-group",
-  "version": "3.1.19",
+  "version": "3.1.24",
   "description": "@form-create/element-ui 内置组件",
   "main": "./dist/index.min.js",
   "module": "./dist/index.esm.js",
@@ -30,7 +30,7 @@
   "author": "xaboy",
   "license": "MIT",
   "dependencies": {
-    "@form-create/utils": "^3.1.15"
+    "@form-create/utils": "^3.1.23"
   },
   "bugs": {
     "url": "https://github.com/xaboy/form-create/issues"
@@ -47,5 +47,5 @@
       "esm"
     ]
   },
-  "gitHead": "5313344b1efe37451419d82886c8d5913db63672"
+  "gitHead": "a49b751973d4e82a6dd3fb2d765c8bb5a645d109"
 }