@form-create/element-ui 3.1.23 → 3.1.24

package/dist/form-create.js

@@ -1,5 +1,5 @@
 /*!
- * @form-create/element-ui v3.1.23
+ * @form-create/element-ui v3.1.24
  * (c) 2018-2023 xaboy
  * Github https://github.com/xaboy/form-create
  * Released under the MIT License.
@@ -223,7 +223,7 @@
       },
       type: String
     },
-    emits: ['update:modelValue'],
+    emits: ['update:modelValue', 'fc.el'],
     setup: function setup(props, _) {
       var options = vue.toRef(props.formCreateInject, 'options', []);
       var value = vue.toRef(props, 'modelValue');
@@ -249,7 +249,8 @@
       var Type = vue.resolveComponent(name);
       return vue.createVNode(vue.resolveComponent("ElCheckboxGroup"), vue.mergeProps(this.$attrs, {
         "modelValue": this.value,
-        "onUpdate:modelValue": this.onInput
+        "onUpdate:modelValue": this.onInput,
+        "ref": "el"
       }), _objectSpread2({
         "default": function _default() {
           return [_this.options().map(function (opt, index) {
@@ -268,6 +269,9 @@
           }), (_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)];
         }
       }, getSlot(this.$slots, ['default'])));
+    },
+    mounted: function mounted() {
+      this.$emit('fc.el', this.$refs.el);
     }
   });
 
@@ -346,125 +350,125 @@
     }
   }
 
-  var css_248z$2 = "._fc-frame ._fc-files img{display:inline-block;height:100%;vertical-align:top;width:100%}._fc-frame ._fc-upload-btn{border:1px dashed #c0ccda;cursor:pointer}._fc-frame ._fc-upload-cover{background:rgba(0,0,0,.6);bottom:0;left:0;opacity:0;position:absolute;right:0;top:0;-webkit-transition:opacity .3s;-o-transition:opacity .3s;transition:opacity .3s}._fc-frame ._fc-upload-cover i{color:#fff;cursor:pointer;font-size:20px;margin:0 2px}._fc-frame ._fc-files:hover ._fc-upload-cover{opacity:1}._fc-frame .el-upload{display:block}._fc-frame ._fc-upload-icon{cursor:pointer}._fc-files,._fc-frame ._fc-upload-btn{background:#fff;border:1px solid #c0ccda;border-radius:4px;-webkit-box-shadow:2px 2px 5px rgba(0,0,0,.1);box-shadow:2px 2px 5px rgba(0,0,0,.1);-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;height:58px;line-height:58px;margin-right:4px;overflow:hidden;position:relative;text-align:center;width:58px}";
-  styleInject(css_248z$2);
+  var css_248z$3 = "._fc-frame ._fc-files img{display:inline-block;height:100%;vertical-align:top;width:100%}._fc-frame ._fc-upload-btn{border:1px dashed #c0ccda;cursor:pointer}._fc-frame ._fc-upload-cover{background:rgba(0,0,0,.6);bottom:0;left:0;opacity:0;position:absolute;right:0;top:0;-webkit-transition:opacity .3s;-o-transition:opacity .3s;transition:opacity .3s}._fc-frame ._fc-upload-cover i{color:#fff;cursor:pointer;font-size:20px;margin:0 2px}._fc-frame ._fc-files:hover ._fc-upload-cover{opacity:1}._fc-frame .el-upload{display:block}._fc-frame ._fc-upload-icon{cursor:pointer}._fc-files,._fc-frame ._fc-upload-btn{background:#fff;border:1px solid #c0ccda;border-radius:4px;-webkit-box-shadow:2px 2px 5px rgba(0,0,0,.1);box-shadow:2px 2px 5px rgba(0,0,0,.1);-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;height:58px;line-height:58px;margin-right:4px;overflow:hidden;position:relative;text-align:center;width:58px}";
+  styleInject(css_248z$3);
 
-  var script$8 = {
+  var script$6 = {
     name: 'IconCircleClose'
   };
 
-  var _hoisted_1$8 = {
+  var _hoisted_1$6 = {
     "class": "icon",
     viewBox: "0 0 1024 1024",
     xmlns: "http://www.w3.org/2000/svg"
   };
 
-  var _hoisted_2$8 = /*#__PURE__*/vue.createElementVNode("path", {
+  var _hoisted_2$6 = /*#__PURE__*/vue.createElementVNode("path", {
     fill: "currentColor",
     d: "M466.752 512l-90.496-90.496a32 32 0 0145.248-45.248L512 466.752l90.496-90.496a32 32 0 1145.248 45.248L557.248 512l90.496 90.496a32 32 0 11-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 01-45.248-45.248L466.752 512z"
   }, null, -1);
 
-  var _hoisted_3$8 = /*#__PURE__*/vue.createElementVNode("path", {
+  var _hoisted_3$6 = /*#__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$2 = [_hoisted_2$8, _hoisted_3$8];
-  function render$8(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$8, _hoisted_4$2);
+  var _hoisted_4 = [_hoisted_2$6, _hoisted_3$6];
+  function render$6(_ctx, _cache, $props, $setup, $data, $options) {
+    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$6, _hoisted_4);
   }
 
-  script$8.render = render$8;
+  script$6.render = render$6;
 
-  var script$7 = {
+  var script$5 = {
     name: 'IconDocument'
   };
 
-  var _hoisted_1$7 = {
+  var _hoisted_1$5 = {
     "class": "icon",
     viewBox: "0 0 1024 1024",
     xmlns: "http://www.w3.org/2000/svg"
   };
 
-  var _hoisted_2$7 = /*#__PURE__*/vue.createElementVNode("path", {
+  var _hoisted_2$5 = /*#__PURE__*/vue.createElementVNode("path", {
     fill: "currentColor",
     d: "M832 384H576V128H192v768h640V384zm-26.496-64L640 154.496V320h165.504zM160 64h480l256 256v608a32 32 0 01-32 32H160a32 32 0 01-32-32V96a32 32 0 0132-32zm160 448h384v64H320v-64zm0-192h160v64H320v-64zm0 384h384v64H320v-64z"
   }, null, -1);
 
-  var _hoisted_3$7 = [_hoisted_2$7];
-  function render$7(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$7, _hoisted_3$7);
+  var _hoisted_3$5 = [_hoisted_2$5];
+  function render$5(_ctx, _cache, $props, $setup, $data, $options) {
+    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$5, _hoisted_3$5);
   }
 
-  script$7.render = render$7;
+  script$5.render = render$5;
 
-  var script$6 = {
+  var script$4 = {
     name: 'IconDelete'
   };
 
-  var _hoisted_1$6 = {
+  var _hoisted_1$4 = {
     "class": "icon",
     viewBox: "0 0 1024 1024",
     xmlns: "http://www.w3.org/2000/svg"
   };
 
-  var _hoisted_2$6 = /*#__PURE__*/vue.createElementVNode("path", {
+  var _hoisted_2$4 = /*#__PURE__*/vue.createElementVNode("path", {
     fill: "currentColor",
     d: "M160 256H96a32 32 0 010-64h256V95.936a32 32 0 0132-32h256a32 32 0 0132 32V192h256a32 32 0 110 64h-64v672a32 32 0 01-32 32H192a32 32 0 01-32-32V256zm448-64v-64H416v64h192zM224 896h576V256H224v640zm192-128a32 32 0 01-32-32V416a32 32 0 0164 0v320a32 32 0 01-32 32zm192 0a32 32 0 01-32-32V416a32 32 0 0164 0v320a32 32 0 01-32 32z"
   }, null, -1);
 
-  var _hoisted_3$6 = [_hoisted_2$6];
-  function render$6(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$6, _hoisted_3$6);
+  var _hoisted_3$4 = [_hoisted_2$4];
+  function render$4(_ctx, _cache, $props, $setup, $data, $options) {
+    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$4, _hoisted_3$4);
   }
 
-  script$6.render = render$6;
+  script$4.render = render$4;
 
-  var script$5 = {
+  var script$3 = {
     name: 'IconView'
   };
 
-  var _hoisted_1$5 = {
+  var _hoisted_1$3 = {
     "class": "icon",
     viewBox: "0 0 1024 1024",
     xmlns: "http://www.w3.org/2000/svg"
   };
 
-  var _hoisted_2$5 = /*#__PURE__*/vue.createElementVNode("path", {
+  var _hoisted_2$3 = /*#__PURE__*/vue.createElementVNode("path", {
     fill: "currentColor",
     d: "M512 160c320 0 512 352 512 352S832 864 512 864 0 512 0 512s192-352 512-352zm0 64c-225.28 0-384.128 208.064-436.8 288 52.608 79.872 211.456 288 436.8 288 225.28 0 384.128-208.064 436.8-288-52.608-79.872-211.456-288-436.8-288zm0 64a224 224 0 110 448 224 224 0 010-448zm0 64a160.192 160.192 0 00-160 160c0 88.192 71.744 160 160 160s160-71.808 160-160-71.744-160-160-160z"
   }, null, -1);
 
-  var _hoisted_3$5 = [_hoisted_2$5];
-  function render$5(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$5, _hoisted_3$5);
+  var _hoisted_3$3 = [_hoisted_2$3];
+  function render$3(_ctx, _cache, $props, $setup, $data, $options) {
+    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$3, _hoisted_3$3);
   }
 
-  script$5.render = render$5;
+  script$3.render = render$3;
 
-  var script$4 = {
+  var script$2 = {
     name: 'IconFolderOpened'
   };
 
-  var _hoisted_1$4 = {
+  var _hoisted_1$2 = {
     "class": "icon",
     viewBox: "0 0 1024 1024",
     xmlns: "http://www.w3.org/2000/svg"
   };
 
-  var _hoisted_2$4 = /*#__PURE__*/vue.createElementVNode("path", {
+  var _hoisted_2$2 = /*#__PURE__*/vue.createElementVNode("path", {
     fill: "currentColor",
     d: "M878.08 448H241.92l-96 384h636.16l96-384zM832 384v-64H485.76L357.504 192H128v448l57.92-231.744A32 32 0 01216.96 384H832zm-24.96 512H96a32 32 0 01-32-32V160a32 32 0 0132-32h287.872l128.384 128H864a32 32 0 0132 32v96h23.04a32 32 0 0131.04 39.744l-112 448A32 32 0 01807.04 896z"
   }, null, -1);
 
-  var _hoisted_3$4 = [_hoisted_2$4];
-  function render$4(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$4, _hoisted_3$4);
+  var _hoisted_3$2 = [_hoisted_2$2];
+  function render$2(_ctx, _cache, $props, $setup, $data, $options) {
+    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$2, _hoisted_3$2);
   }
 
-  script$4.render = render$4;
+  script$2.render = render$2;
 
-  function _isSlot$1(s) {
+  function _isSlot(s) {
     return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
   }
 
@@ -577,8 +581,8 @@
     },
     emits: ['update:modelValue', 'change'],
     components: {
-      IconFolderOpened: script$4,
-      IconView: script$5
+      IconFolderOpened: script$2,
+      IconView: script$3
     },
     data: function data() {
       return {
@@ -654,7 +658,7 @@
               }
             }, {
               "default": function _default() {
-                return [vue.createVNode(script$8, null, null)];
+                return [vue.createVNode(script$6, null, null)];
               }
             }) : null;
           }
@@ -725,7 +729,7 @@
           "key": '6' + index
         }, {
           "default": function _default() {
-            return [vue.createVNode(script$6, null, null)];
+            return [vue.createVNode(script$4, null, null)];
           }
         });
       },
@@ -739,7 +743,7 @@
             }
           }, {
             "default": function _default() {
-              return [vue.createVNode(script$7, null, null)];
+              return [vue.createVNode(script$5, null, null)];
             }
           }), _this4.makeIcons(src, index)]);
         }));
@@ -845,7 +849,7 @@
           "onClick": function onClick() {
             return _this8.onCancel() !== false && (_this8.frameVisible = false);
           }
-        }, _isSlot$1(closeBtnText) ? closeBtnText : {
+        }, _isSlot(closeBtnText) ? closeBtnText : {
           "default": function _default() {
             return [closeBtnText];
           }
@@ -854,7 +858,7 @@
           "onClick": function onClick() {
             return _this8.onOk() !== false && _this8.closeModel();
           }
-        }, _isSlot$1(okBtnText) ? okBtnText : {
+        }, _isSlot(okBtnText) ? okBtnText : {
           "default": function _default() {
             return [okBtnText];
           }
@@ -960,7 +964,7 @@
       },
       type: String
     },
-    emits: ['update:modelValue'],
+    emits: ['update:modelValue', 'fc.el'],
     setup: function setup(props, _) {
       var options = vue.toRef(props.formCreateInject, 'options', []);
       var value = vue.toRef(props, 'modelValue');
@@ -986,7 +990,8 @@
       var Type = vue.resolveComponent(name);
       return vue.createVNode(vue.resolveComponent("ElRadioGroup"), vue.mergeProps(this.$attrs, {
         "modelValue": this.value,
-        "onUpdate:modelValue": this.onInput
+        "onUpdate:modelValue": this.onInput,
+        "ref": "el"
       }), _objectSpread2({
         "default": function _default() {
           return [_this.options().map(function (opt, index) {
@@ -1005,6 +1010,9 @@
           }), (_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)];
         }
       }, getSlot(this.$slots, ['default'])));
+    },
+    mounted: function mounted() {
+      this.$emit('fc.el', this.$refs.el);
     }
   });
 
@@ -1020,7 +1028,7 @@
       },
       type: String
     },
-    emits: ['update:modelValue'],
+    emits: ['update:modelValue', 'fc.el'],
     setup: function setup(props) {
       var options = vue.toRef(props.formCreateInject, 'options', []);
       var value = vue.toRef(props, 'modelValue');
@@ -1043,7 +1051,8 @@
         "modelValue": this.value,
         "onUpdate:modelValue": function onUpdateModelValue(v) {
           return _this.$emit('update:modelValue', v);
-        }
+        },
+        "ref": "el"
       }), _objectSpread2({
         "default": function _default() {
           return [_this.options().map(function (props, index) {
@@ -1053,6 +1062,9 @@
           }), (_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)];
         }
       }, getSlot(this.$slots, ['default'])));
+    },
+    mounted: function mounted() {
+      this.$emit('fc.el', this.$refs.el);
     }
   });
 
@@ -1078,7 +1090,7 @@
         }
       }
     },
-    emits: ['update:modelValue'],
+    emits: ['update:modelValue', 'fc.el'],
     watch: {
       modelValue: function modelValue() {
         this.setValue();
@@ -1117,33 +1129,34 @@
     },
     mounted: function mounted() {
       this.setValue();
+      this.$emit('fc.el', this.$refs.tree);
     }
   });
 
-  var css_248z$1 = "._fc-exceed .el-upload{display:none}";
-  styleInject(css_248z$1);
+  var css_248z$2 = "._fc-exceed .el-upload{display:none}";
+  styleInject(css_248z$2);
 
-  var script$3 = {
+  var script$1 = {
     name: 'IconUpload'
   };
 
-  var _hoisted_1$3 = {
+  var _hoisted_1$1 = {
     "class": "icon",
     viewBox: "0 0 1024 1024",
     xmlns: "http://www.w3.org/2000/svg"
   };
 
-  var _hoisted_2$3 = /*#__PURE__*/vue.createElementVNode("path", {
+  var _hoisted_2$1 = /*#__PURE__*/vue.createElementVNode("path", {
     fill: "currentColor",
     d: "M160 832h704a32 32 0 110 64H160a32 32 0 110-64zm384-578.304V704h-64V247.296L237.248 490.048 192 444.8 508.8 128l316.8 316.8-45.312 45.248L544 253.696z"
   }, null, -1);
 
-  var _hoisted_3$3 = [_hoisted_2$3];
-  function render$3(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$3, _hoisted_3$3);
+  var _hoisted_3$1 = [_hoisted_2$1];
+  function render$1(_ctx, _cache, $props, $setup, $data, $options) {
+    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$1, _hoisted_3$1);
   }
 
-  script$3.render = render$3;
+  script$1.render = render$1;
 
   function parseFile(file, i) {
     return {
@@ -1175,7 +1188,7 @@
       modalTitle: String,
       modelValue: [Array, String]
     },
-    emits: ['update:modelValue', 'change', 'remove'],
+    emits: ['update:modelValue', 'change', 'remove', 'fc.el'],
     data: function data() {
       return {
         previewVisible: false,
@@ -1239,12 +1252,13 @@
         "onPreview": this.handlePreview,
         "onChange": this.handleChange,
         "onRemove": this.handleRemove,
-        "fileList": this.fileList
+        "fileList": this.fileList,
+        "ref": "upload"
       }), _objectSpread2({
         "default": function _default() {
           return [((_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)) || vue.createVNode(vue.resolveComponent("ElIcon"), null, {
             "default": function _default() {
-              return [vue.createVNode(script$3, null, null)];
+              return [vue.createVNode(script$1, null, null)];
             }
           })];
         }
@@ -1262,6 +1276,9 @@
           }, null)];
         }
       })]);
+    },
+    mounted: function mounted() {
+      this.$emit('fc.el', this.$refs.upload);
     }
   });
 
@@ -1307,65 +1324,6 @@
     return {}.hasOwnProperty.call(rule, k);
   }
 
-  var script$2 = {
-    name: 'IconCirclePlus'
-  };
-
-  var _hoisted_1$2 = {
-    "class": "icon",
-    viewBox: "0 0 1024 1024",
-    xmlns: "http://www.w3.org/2000/svg"
-  };
-
-  var _hoisted_2$2 = /*#__PURE__*/vue.createElementVNode("path", {
-    fill: "currentColor",
-    d: "M352 480h320a32 32 0 110 64H352a32 32 0 010-64z"
-  }, null, -1);
-
-  var _hoisted_3$2 = /*#__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$2, _hoisted_3$2, _hoisted_4$1];
-  function render$2(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$2, _hoisted_5);
-  }
-
-  script$2.render = render$2;
-
-  var script$1 = {
-    name: 'IconRemove'
-  };
-
-  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: "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$1, _hoisted_3$1];
-  function render$1(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$1, _hoisted_4);
-  }
-
-  script$1.render = render$1;
-
   function $set(target, field, value) {
     target[field] = value;
   }
@@ -1441,9 +1399,8 @@
     return _extends.apply(this, arguments);
   }
 
-  function _isSlot(s) {
-    return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
-  }
+  var css_248z$1 = "._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$1);
 
   var NAME$3 = 'fcGroup';
   var Group = vue.defineComponent({
@@ -1472,6 +1429,10 @@
         }
       },
       defaultValue: Object,
+      sortBtn: {
+        type: Boolean,
+        "default": true
+      },
       disabled: {
         type: Boolean,
         "default": false
@@ -1480,10 +1441,6 @@
         type: Boolean,
         "default": true
       },
-      fontSize: {
-        type: Number,
-        "default": 28
-      },
       onBeforeRemove: {
         type: Function,
         "default": function _default() {}
@@ -1492,13 +1449,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())
       };
     },
@@ -1552,7 +1511,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;
 
@@ -1594,7 +1553,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;
@@ -1640,6 +1599,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
@@ -1655,7 +1619,6 @@
         var _this5 = this;
 
         this.cacheRule[key].$f = $f;
-        this.formData(key, $f.formData());
         vue.nextTick(function () {
           if (_this5.syncDisabled) {
             $f.disabled(_this5.disabled);
@@ -1677,13 +1640,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)) {
@@ -1691,38 +1656,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$2, 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$1, 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({
@@ -1731,19 +1714,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]));
@@ -1755,6 +1750,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++) {
@@ -1766,75 +1770,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$2, 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]);
     }
   });
 
@@ -3337,6 +3324,13 @@
               vn.el.__rule__ = ctx.rule;
 
               _this7.onMounted(ctx, vn.el);
+            },
+            'fc.el': function fcEl(el) {
+              ctx.exportEl = el;
+
+              if (el) {
+                (el.$el || el).__rule__ = ctx.rule;
+              }
             }
           }
         }];
@@ -3706,6 +3700,7 @@
       refRule: {},
       input: isInput,
       el: undefined,
+      exportEl: undefined,
       defaultValue: isInput ? deepCopy(defaultValue) : undefined,
       field: rule.field || undefined
     });
@@ -4229,6 +4224,8 @@
 
           !isCopy && !isInit && _this6.effect(ctx, 'load');
 
+          _this6.effect(ctx, 'created');
+
           var _load = ctx.loadChildrenPending();
 
           ctx.parser.loadChildren === false || loadChildren(_load, ctx);
@@ -5048,6 +5045,8 @@
             data.mergeProp = function (prop) {
               return mergeRule(data.getProp(), [prop]);
             };
+
+            data.id = ctx.id;
           }
 
           _this4.bus.$emit("p:".concat(attr, ":").concat(_type, ":").concat(p.input ? 1 : 0), event, [data, rule, _this4.api]);
@@ -5064,9 +5063,13 @@
 
   function getComponent(p) {
     var c = p.components;
-    if (Array.isArray(c)) return unique(c.filter(function (v) {
-      return v !== '*';
-    }));else if (is.String(c)) return [c];else return false;
+
+    if (Array.isArray(c)) {
+      var arr = unique(c.filter(function (v) {
+        return v !== '*';
+      }));
+      return arr.length ? arr : false;
+    } else if (is.String(c)) return [c];else return false;
   }
 
   function Handler(fc) {
@@ -5375,6 +5378,58 @@
     render: function render(children) {}
   });
 
+  var loadData = function loadData(fc) {
+    var loadData = {
+      name: 'loadData',
+      _fn: [],
+      created: function created(inject, rule, api) {
+        this.deleted(inject);
+        var attrs = toArray(inject.getValue());
+        var events = [];
+        attrs.forEach(function (attr) {
+          if (attr) {
+            var on = function on() {
+              if (attr.watch !== false) {
+                fc.bus.$off('p.loadData.' + attr.attr, on);
+                fc.bus.$once('p.loadData.' + attr.attr, on);
+              }
+
+              var value = undefined;
+
+              if (attr.attr) {
+                value = fc.loadData[attr.attr] || attr["default"];
+
+                if (attr.copy) {
+                  value = deepCopy(value);
+                }
+              }
+
+              deepSet(inject.getProp(), attr.to || 'options', value);
+              api.sync(rule);
+            };
+
+            events.push(function () {
+              return fc.bus.$off('p.loadData.' + attr.attr, on);
+            });
+            on();
+          }
+        });
+        this._fn[inject.id] = events;
+      },
+      deleted: function deleted(inject) {
+        if (this._fn[inject.id]) {
+          this._fn[inject.id].forEach(function (un) {
+            un();
+          });
+        }
+
+        inject.clearProp();
+      }
+    };
+    loadData.watch = loadData.created;
+    return loadData;
+  };
+
   var componentValidate = {
     name: 'componentValidate',
     load: function load(attr, rule, api) {
@@ -5467,6 +5522,15 @@
 
             if (is.Function(option.parse)) {
               fn = option.parse;
+            } else if (option.parse && is.String(option.parse)) {
+              fn = function fn(v) {
+                option.parse.split('.').forEach(function (k) {
+                  if (v) {
+                    v = v[k];
+                  }
+                });
+                return v;
+              };
             }
 
             set(fn(body, rule, api));
@@ -5505,6 +5569,7 @@
 
   var $provider = {
     fetch: fetch,
+    loadData: loadData,
     componentValidate: componentValidate
   };
 
@@ -5574,14 +5639,20 @@
     var globalConfig = {
       global: {}
     };
-    var data = {};
+    var loadData = {};
     var CreateNode = CreateNodeFactory();
     exportAttrs(config.attrs || {});
 
     function getApi(name) {
       var val = instance[name];
-      if (Array.isArray(val)) return _toConsumableArray(val);
-      return val;
+
+      if (Array.isArray(val)) {
+        return val.map(function (v) {
+          return v.api();
+        });
+      } else if (val) {
+        return val.api();
+      }
     }
 
     function useApp(fn) {
@@ -5691,7 +5762,7 @@
           providers: providers,
           useApps: useApps,
           maker: maker,
-          data: data
+          loadData: loadData
         };
       } else {
         delete _config.inherit;
@@ -5704,6 +5775,27 @@
       modelFields[name] = field;
     }
 
+    function _emitData(id) {
+      Object.keys(instance).forEach(function (v) {
+        var apis = Array.isArray(instance[v]) ? instance[v] : [instance[v]];
+        apis.forEach(function (that) {
+          that.bus.$emit('p.loadData.' + id);
+        });
+      });
+    }
+
+    function setData(id, data) {
+      loadData[id] = data;
+
+      _emitData(id);
+    }
+
+    function removeData(id) {
+      delete loadData[id];
+
+      _emitData(id);
+    }
+
     function FormCreate(vm) {
       var _this = this;
 
@@ -5716,12 +5808,13 @@
         providers: providers,
         modelFields: modelFields,
         rules: vm.props.rule,
-        name: vm.props.name,
+        name: vm.props.name || uniqueId(),
         inFor: vm.props.inFor,
         prop: {
           components: components,
           directives: directives
         },
+        loadData: loadData,
         CreateNode: CreateNode,
         bus: new Mitt(),
         unwatch: null,
@@ -5746,9 +5839,9 @@
       if (this.name) {
         if (this.inFor) {
           if (!instance[this.name]) instance[this.name] = [];
-          instance[this.name].push(this.api());
+          instance[this.name].push(this);
         } else {
-          instance[this.name] = this.api();
+          instance[this.name] = this;
         }
       }
     }
@@ -5818,7 +5911,7 @@
       unmount: function unmount() {
         if (this.name) {
           if (this.inFor) {
-            var idx = instance[this.name].indexOf(this.api());
+            var idx = instance[this.name].indexOf(this);
             instance[this.name].splice(idx, 1);
           } else {
             delete instance[this.name];
@@ -5841,7 +5934,8 @@
       extend(formCreate, {
         version: config.version,
         ui: config.ui,
-        data: data,
+        setData: setData,
+        removeData: removeData,
         maker: maker,
         component: component,
         directive: directive,
@@ -5911,7 +6005,7 @@
       inherit.providers && extend(providers, inherit.providers);
       inherit.useApps && extend(useApps, inherit.useApps);
       inherit.maker && extend(maker, inherit.maker);
-      inherit.data && extend(data, inherit.data);
+      inherit.loadData && extend(loadData, inherit.loadData);
     }
 
     return create;
@@ -6550,6 +6644,14 @@
 
   function extendApi(api, h) {
     extend(api, {
+      formEl: function formEl() {
+        return h.$manager.form();
+      },
+      wrapEl: function wrapEl(id) {
+        var ctx = h.getFieldCtx(id);
+        if (!ctx) return;
+        return h.vm.refs[ctx.wrapRef];
+      },
       validate: function validate(callback) {
         return new Promise(function (resolve, reject) {
           var forms = api.children;
@@ -6781,7 +6883,7 @@
   function elmFormCreate() {
     return FormCreateFactory({
       ui: 'element-ui',
-      version: '3.1.23',
+      version: '3.1.24',
       manager: manager,
       extendApi: extendApi,
       install: install,