@form-create/element-ui 3.2.20 → 3.2.21

package/dist/form-create.js

@@ -1,5 +1,5 @@
 /*!
- * @form-create/element-ui v3.2.20
+ * @form-create/element-ui v3.2.21
  * (c) 2018-2025 xaboy
  * Github https://github.com/xaboy/form-create
  * Released under the MIT License.
@@ -2165,424 +2165,122 @@
     return str.replace(str[0], str[0].toLocaleUpperCase());
   }
 
-  var _getGroupInject = function getGroupInject(vm, parent) {
-    if (!vm || vm === parent) {
-      return;
-    }
-
-    if (vm.props.formCreateInject) {
-      return vm.props.formCreateInject;
-    }
-
-    if (vm.parent) {
-      return _getGroupInject(vm.parent, parent);
-    }
-  };
+  var normalMerge = ['props'];
+  var toArrayMerge = ['class', 'style', 'directives'];
+  var functionalMerge = ['on', 'hook'];
 
-  function $FormCreate(FormCreate, components, directives) {
-    return vue.defineComponent({
-      name: 'FormCreate' + (FormCreate.isMobile ? 'Mobile' : ''),
-      components: components,
-      directives: directives,
-      props: {
-        rule: {
-          type: Array,
-          required: true,
-          "default": function _default() {
-            return [];
-          }
-        },
-        option: {
-          type: Object,
-          "default": function _default() {
-            return {};
-          }
-        },
-        extendOption: Boolean,
-        driver: [String, Object],
-        modelValue: Object,
-        disabled: {
-          type: Boolean,
-          "default": undefined
-        },
-        preview: {
-          type: Boolean,
-          "default": undefined
-        },
-        index: [String, Number],
-        api: Object,
-        locale: [String, Object],
-        name: String,
-        subForm: {
-          type: Boolean,
-          "default": true
-        },
-        inFor: Boolean
-      },
-      emits: ['update:api', 'update:modelValue', 'mounted', 'submit', 'reset', 'change', 'emit-event', 'control', 'remove-rule', 'remove-field', 'sync', 'reload', 'repeat-field', 'update', 'validate-field-fail', 'validate-fail', 'created'],
-      render: function render() {
-        return this.fc.render();
-      },
-      setup: function setup(props) {
-        var vm = vue.getCurrentInstance();
-        vue.provide('parentFC', vm);
-        var parent = vue.inject('parentFC', null);
-        var top = parent;
+  var mergeProps = function mergeProps(objects) {
+    var initial = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var opt = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
 
-        if (parent) {
-          while (top.setupState.parent) {
-            top = top.setupState.parent;
-          }
-        } else {
-          top = vm;
-        }
+    var _normalMerge = [].concat(normalMerge, _toConsumableArray(opt['normal'] || []));
 
-        var _toRefs = vue.toRefs(props),
-            rule = _toRefs.rule,
-            modelValue = _toRefs.modelValue,
-            subForm = _toRefs.subForm,
-            inFor = _toRefs.inFor;
+    var _toArrayMerge = [].concat(toArrayMerge, _toConsumableArray(opt['array'] || []));
 
-        var data = vue.reactive({
-          ctxInject: {},
-          destroyed: false,
-          isShow: true,
-          unique: 1,
-          renderRule: _toConsumableArray(rule.value || []),
-          updateValue: JSON.stringify(modelValue.value || {})
-        });
-        var fc = new FormCreate(vm);
-        var fapi = fc.api();
-        var isMore = inFor.value;
+    var _functionalMerge = [].concat(functionalMerge, _toConsumableArray(opt['functional'] || []));
 
-        var addSubForm = function addSubForm() {
-          if (parent) {
-            var _inject = _getGroupInject(vm, parent);
+    var propsMerge = opt['props'] || [];
+    return objects.reduce(function (a, b) {
+      for (var key in b) {
+        if (a[key]) {
+          if (propsMerge.indexOf(key) > -1) {
+            a[key] = mergeProps([b[key]], a[key]);
+          } else if (_normalMerge.indexOf(key) > -1) {
+            a[key] = _objectSpread2(_objectSpread2({}, a[key]), b[key]);
+          } else if (_toArrayMerge.indexOf(key) > -1) {
+            var arrA = a[key] instanceof Array ? a[key] : [a[key]];
+            var arrB = b[key] instanceof Array ? b[key] : [b[key]];
+            a[key] = [].concat(_toConsumableArray(arrA), _toConsumableArray(arrB));
+          } else if (_functionalMerge.indexOf(key) > -1) {
+            for (var event in b[key]) {
+              if (a[key][event]) {
+                var _arrA = a[key][event] instanceof Array ? a[key][event] : [a[key][event]];
 
-            if (_inject) {
-              var sub;
+                var _arrB = b[key][event] instanceof Array ? b[key][event] : [b[key][event]];
 
-              if (isMore) {
-                sub = toArray(_inject.getSubForm());
-                sub.push(fapi);
+                a[key][event] = [].concat(_toConsumableArray(_arrA), _toConsumableArray(_arrB));
               } else {
-                sub = fapi;
+                a[key][event] = b[key][event];
               }
-
-              _inject.subForm(sub);
             }
-          }
-        };
-
-        var rmSubForm = function rmSubForm() {
-          var inject = _getGroupInject(vm, parent);
-
-          if (inject) {
-            if (isMore) {
-              var sub = toArray(inject.getSubForm());
-              var idx = sub.indexOf(fapi);
-
-              if (idx > -1) {
-                sub.splice(idx, 1);
+          } else if (key === 'hook') {
+            for (var hook in b[key]) {
+              if (a[key][hook]) {
+                a[key][hook] = mergeFn(a[key][hook], b[key][hook]);
+              } else {
+                a[key][hook] = b[key][hook];
               }
-            } else {
-              inject.subForm();
             }
+          } else {
+            a[key] = b[key];
           }
-        };
+        } else {
+          if (_normalMerge.indexOf(key) > -1 || _functionalMerge.indexOf(key) > -1 || propsMerge.indexOf(key) > -1) {
+            a[key] = _objectSpread2({}, b[key]);
+          } else if (_toArrayMerge.indexOf(key) > -1) {
+            a[key] = b[key] instanceof Array ? _toConsumableArray(b[key]) : _typeof(b[key]) === 'object' ? _objectSpread2({}, b[key]) : b[key];
+          } else a[key] = b[key];
+        }
+      }
 
-        var styleEl = null;
-        vue.onBeforeMount(function () {
-          vue.watchEffect(function () {
-            var content = '';
-            var globalClass = props.option && props.option.globalClass || {};
-            Object.keys(globalClass).forEach(function (k) {
-              var subCss = '';
-              globalClass[k].style && Object.keys(globalClass[k].style).forEach(function (key) {
-                subCss += toLine(key) + ':' + globalClass[k].style[key] + ';';
-              });
+      return a;
+    }, initial);
+  };
 
-              if (globalClass[k].content) {
-                subCss += globalClass[k].content + ';';
-              }
+  var mergeFn = function mergeFn(fn1, fn2) {
+    return function () {
+      fn1 && fn1.apply(this, arguments);
+      fn2 && fn2.apply(this, arguments);
+    };
+  };
 
-              if (subCss) {
-                content += ".".concat(k, "{").concat(subCss, "}");
-              }
-            });
+  var keyAttrs = ['type', 'slot', 'ignore', 'emitPrefix', 'value', 'name', 'native', 'hidden', 'display', 'inject', 'options', 'emit', 'link', 'prefix', 'suffix', 'update', 'sync', 'optionsTo', 'key', 'slotUpdate', 'computed', 'preview', 'component', 'cache', 'modelEmit'];
+  var arrayAttrs = ['validate', 'children', 'control'];
+  var normalAttrs = ['effect', 'deep', 'renderSlots'];
+  function attrs() {
+    return [].concat(keyAttrs, _toConsumableArray(normalMerge), _toConsumableArray(toArrayMerge), _toConsumableArray(functionalMerge), arrayAttrs, normalAttrs);
+  }
 
-            if (props.option && props.option.style) {
-              content += props.option.style;
-            }
+  function format(type, msg, rule) {
+    return "[form-create ".concat(type, "]: ").concat(msg) + (rule ? '\n\nrule: ' + JSON.stringify(rule.getRule ? rule.getRule() : rule) : '');
+  }
+  function err(msg, rule) {
+    console.error(format('err', msg, rule));
+  }
+  function logError(e) {
+    err(e.toString());
+    console.error(e);
+  }
 
-            if (!styleEl) {
-              styleEl = document.createElement('style');
-              styleEl.type = 'text/css';
-              document.head.appendChild(styleEl);
-            }
+  function toCase(str) {
+    var to = str.replace(/(-[a-z])/g, function (v) {
+      return v.replace('-', '').toLocaleUpperCase();
+    });
+    return lower(to);
+  }
+  function lower(str) {
+    return str.replace(str[0], str[0].toLowerCase());
+  }
 
-            styleEl.innerHTML = content || '';
-          });
-        });
-        var emit$topForm = debounce(function () {
-          fc.bus.$emit('$loadData.$topForm');
-        }, 100);
-        var emit$scopeForm = debounce(function () {
-          fc.bus.$emit('$loadData.$scopeForm');
-        }, 100);
-        var emit$form = debounce(function () {
-          fc.bus.$emit('$loadData.$form');
-        }, 100);
+  var PREFIX = '[[FORM-CREATE-PREFIX-';
+  var SUFFIX = '-FORM-CREATE-SUFFIX]]';
+  function toJson(obj, space) {
+    return JSON.stringify(deepExtend(Array.isArray(obj) ? [] : {}, obj, true), function (key, val) {
+      if (val && val._isVue === true) return undefined;
 
-        var emit$change = function emit$change(field) {
-          fc.bus.$emit('change-$form.' + field);
-        };
+      if (typeof val !== 'function') {
+        return val;
+      }
 
-        vue.onMounted(function () {
-          if (parent) {
-            fapi.top.bus.$on('$loadData.$form', emit$topForm);
-            fapi.top.bus.$on('change', emit$change);
-          }
+      if (val.__json) {
+        return val.__json;
+      }
 
-          if (fapi !== fapi.scope) {
-            fapi.scope.bus.$on('$loadData.$scopeForm', emit$scopeForm);
-          }
-
-          fc.mounted();
-        });
-        vue.onBeforeUnmount(function () {
-          if (parent) {
-            fapi.top.bus.$off('$loadData.$form', emit$topForm);
-            fapi.top.bus.$off('change', emit$change);
-          }
-
-          if (fapi !== fapi.scope) {
-            fapi.scope.bus.$off('$loadData.$scopeForm', emit$scopeForm);
-          }
-
-          styleEl && document.head.removeChild(styleEl);
-          rmSubForm();
-          data.destroyed = true;
-          fc.unmount();
-        });
-        vue.onUpdated(function () {
-          fc.updated();
-        });
-        vue.watch(subForm, function (n) {
-          n ? addSubForm() : rmSubForm();
-        }, {
-          immediate: true
-        });
-        vue.watch(function () {
-          return props.option;
-        }, function () {
-          fc.initOptions();
-          fapi.refresh();
-        }, {
-          deep: true
-        });
-        vue.watch(function () {
-          return _toConsumableArray(rule.value);
-        }, function (n) {
-          if (fc.$handle.isBreakWatch() || n.length === data.renderRule.length && n.every(function (v) {
-            return data.renderRule.indexOf(v) > -1;
-          })) return;
-          fc.$handle.updateAppendData();
-          fc.$handle.reloadRule(rule.value);
-          vm.setupState.renderRule();
-        });
-        vue.watch(function () {
-          return [props.disabled, props.preview];
-        }, function () {
-          fapi.refresh();
-        });
-        vue.watch(modelValue, function (n) {
-          if (JSON.stringify(n || {}) === data.updateValue) return;
-
-          if (fapi.config.forceCoverValue) {
-            fapi.coverValue(n || {});
-          } else {
-            fapi.setValue(n || {});
-          }
-        }, {
-          deep: true,
-          flush: 'post'
-        });
-        vue.watch(function () {
-          return props.index;
-        }, function () {
-          fapi.coverValue({});
-          fc.$handle.updateAppendData();
-          vue.nextTick(function () {
-            vue.nextTick(function () {
-              fapi.clearValidateState();
-            });
-          });
-        }, {
-          flush: 'sync'
-        });
-        return _objectSpread2(_objectSpread2({
-          fc: vue.markRaw(fc),
-          parent: parent ? vue.markRaw(parent) : parent,
-          top: vue.markRaw(top),
-          fapi: vue.markRaw(fapi)
-        }, vue.toRefs(data)), {}, {
-          getGroupInject: function getGroupInject() {
-            return _getGroupInject(vm, parent);
-          },
-          refresh: function refresh() {
-            ++data.unique;
-          },
-          renderRule: function renderRule() {
-            data.renderRule = _toConsumableArray(rule.value || []);
-          },
-          updateValue: function updateValue(value) {
-            if (data.destroyed) return;
-            var json = JSON.stringify(value);
-
-            if (data.updateValue === json) {
-              return;
-            }
-
-            data.updateValue = json;
-            vm.emit('update:modelValue', value);
-            vue.nextTick(function () {
-              emit$form();
-
-              if (!parent) {
-                emit$topForm();
-                emit$scopeForm();
-              } else if (!subForm.value) {
-                emit$scopeForm();
-              }
-            });
-          }
-        });
-      },
-      created: function created() {
-        var vm = vue.getCurrentInstance();
-        vm.emit('update:api', vm.setupState.fapi);
-        vm.setupState.fc.init();
-      }
-    });
-  }
-
-  var normalMerge = ['props'];
-  var toArrayMerge = ['class', 'style', 'directives'];
-  var functionalMerge = ['on', 'hook'];
-
-  var mergeProps = function mergeProps(objects) {
-    var initial = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    var opt = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-
-    var _normalMerge = [].concat(normalMerge, _toConsumableArray(opt['normal'] || []));
-
-    var _toArrayMerge = [].concat(toArrayMerge, _toConsumableArray(opt['array'] || []));
-
-    var _functionalMerge = [].concat(functionalMerge, _toConsumableArray(opt['functional'] || []));
-
-    var propsMerge = opt['props'] || [];
-    return objects.reduce(function (a, b) {
-      for (var key in b) {
-        if (a[key]) {
-          if (propsMerge.indexOf(key) > -1) {
-            a[key] = mergeProps([b[key]], a[key]);
-          } else if (_normalMerge.indexOf(key) > -1) {
-            a[key] = _objectSpread2(_objectSpread2({}, a[key]), b[key]);
-          } else if (_toArrayMerge.indexOf(key) > -1) {
-            var arrA = a[key] instanceof Array ? a[key] : [a[key]];
-            var arrB = b[key] instanceof Array ? b[key] : [b[key]];
-            a[key] = [].concat(_toConsumableArray(arrA), _toConsumableArray(arrB));
-          } else if (_functionalMerge.indexOf(key) > -1) {
-            for (var event in b[key]) {
-              if (a[key][event]) {
-                var _arrA = a[key][event] instanceof Array ? a[key][event] : [a[key][event]];
-
-                var _arrB = b[key][event] instanceof Array ? b[key][event] : [b[key][event]];
-
-                a[key][event] = [].concat(_toConsumableArray(_arrA), _toConsumableArray(_arrB));
-              } else {
-                a[key][event] = b[key][event];
-              }
-            }
-          } else if (key === 'hook') {
-            for (var hook in b[key]) {
-              if (a[key][hook]) {
-                a[key][hook] = mergeFn(a[key][hook], b[key][hook]);
-              } else {
-                a[key][hook] = b[key][hook];
-              }
-            }
-          } else {
-            a[key] = b[key];
-          }
-        } else {
-          if (_normalMerge.indexOf(key) > -1 || _functionalMerge.indexOf(key) > -1 || propsMerge.indexOf(key) > -1) {
-            a[key] = _objectSpread2({}, b[key]);
-          } else if (_toArrayMerge.indexOf(key) > -1) {
-            a[key] = b[key] instanceof Array ? _toConsumableArray(b[key]) : _typeof(b[key]) === 'object' ? _objectSpread2({}, b[key]) : b[key];
-          } else a[key] = b[key];
-        }
-      }
-
-      return a;
-    }, initial);
-  };
-
-  var mergeFn = function mergeFn(fn1, fn2) {
-    return function () {
-      fn1 && fn1.apply(this, arguments);
-      fn2 && fn2.apply(this, arguments);
-    };
-  };
-
-  var keyAttrs = ['type', 'slot', 'ignore', 'emitPrefix', 'value', 'name', 'native', 'hidden', 'display', 'inject', 'options', 'emit', 'link', 'prefix', 'suffix', 'update', 'sync', 'optionsTo', 'key', 'slotUpdate', 'computed', 'preview', 'component', 'cache', 'modelEmit'];
-  var arrayAttrs = ['validate', 'children', 'control'];
-  var normalAttrs = ['effect', 'deep', 'renderSlots'];
-  function attrs() {
-    return [].concat(keyAttrs, _toConsumableArray(normalMerge), _toConsumableArray(toArrayMerge), _toConsumableArray(functionalMerge), arrayAttrs, normalAttrs);
-  }
-
-  function format(type, msg, rule) {
-    return "[form-create ".concat(type, "]: ").concat(msg) + (rule ? '\n\nrule: ' + JSON.stringify(rule.getRule ? rule.getRule() : rule) : '');
-  }
-  function err(msg, rule) {
-    console.error(format('err', msg, rule));
-  }
-  function logError(e) {
-    err(e.toString());
-    console.error(e);
-  }
-
-  function toCase(str) {
-    var to = str.replace(/(-[a-z])/g, function (v) {
-      return v.replace('-', '').toLocaleUpperCase();
-    });
-    return lower(to);
-  }
-  function lower(str) {
-    return str.replace(str[0], str[0].toLowerCase());
-  }
-
-  var PREFIX = '[[FORM-CREATE-PREFIX-';
-  var SUFFIX = '-FORM-CREATE-SUFFIX]]';
-  function toJson(obj, space) {
-    return JSON.stringify(deepExtend(Array.isArray(obj) ? [] : {}, obj, true), function (key, val) {
-      if (val && val._isVue === true) return undefined;
-
-      if (typeof val !== 'function') {
-        return val;
-      }
-
-      if (val.__json) {
-        return val.__json;
-      }
-
-      if (val.__origin) val = val.__origin;
-      if (val.__emit) return undefined;
-      return PREFIX + val + SUFFIX;
-    }, space);
-  }
+      if (val.__origin) val = val.__origin;
+      if (val.__emit) return undefined;
+      return PREFIX + val + SUFFIX;
+    }, space);
+  }
 
   function makeFn(fn) {
     return new Function('return ' + fn)();
@@ -2754,170 +2452,468 @@
             children.push(fn);
           }
         });
-        return children;
-      },
-      getSlots: function getSlots() {
-        var _this = this;
+        return children;
+      },
+      getSlots: function getSlots() {
+        var _this = this;
+
+        var slots = {};
+        Object.keys(slotBag).forEach(function (k) {
+          slots[k] = function () {
+            for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+              args[_key] = arguments[_key];
+            }
+
+            return _this.getSlot(k, args);
+          };
+        });
+        return slots;
+      },
+      slotLen: function slotLen(slot) {
+        slot = slotName(slot);
+        return slotBag[slot] ? slotBag[slot].length : 0;
+      },
+      mergeBag: function mergeBag(bag) {
+        var _this2 = this;
+
+        if (!bag) return this;
+        var slots = is.Function(bag.getSlots) ? bag.getSlots() : bag;
+
+        if (Array.isArray(bag) || vue.isVNode(bag)) {
+          this.setSlot(undefined, function () {
+            return bag;
+          });
+        } else {
+          Object.keys(slots).forEach(function (k) {
+            _this2.setSlot(k, slots[k]);
+          });
+        }
+
+        return this;
+      }
+    };
+  }
+  function toProps(rule) {
+    var prop = _objectSpread2({}, rule.props || {});
+
+    Object.keys(rule.on || {}).forEach(function (k) {
+      if (k.indexOf('-') > 0) {
+        k = toCase(k);
+      }
+
+      var name = "on".concat(upper(k));
+
+      if (Array.isArray(prop[name])) {
+        prop[name] = [].concat(_toConsumableArray(prop[name]), [rule.on[k]]);
+      } else if (prop[name]) {
+        prop[name] = [prop[name], rule.on[k]];
+      } else {
+        prop[name] = rule.on[k];
+      }
+    });
+    prop.key = rule.key;
+    prop.ref = rule.ref;
+    prop["class"] = rule["class"];
+    prop.id = rule.id;
+    prop.style = rule.style;
+    if (prop.slot) delete prop.slot;
+    return prop;
+  }
+  function setPrototypeOf(o, proto) {
+    Object.setPrototypeOf(o, proto);
+    return o;
+  }
+
+  var changeType = function changeType(a, b) {
+    if (typeof a === 'string') {
+      return String(b);
+    } else if (typeof a === 'number') {
+      return Number(b);
+    }
+
+    return b;
+  };
+
+  var condition = {
+    '==': function _(a, b) {
+      return JSON.stringify(a) === JSON.stringify(changeType(a, b));
+    },
+    '!=': function _(a, b) {
+      return !condition['=='](a, b);
+    },
+    '>': function _(a, b) {
+      return a > b;
+    },
+    '>=': function _(a, b) {
+      return a >= b;
+    },
+    '<': function _(a, b) {
+      return a < b;
+    },
+    '<=': function _(a, b) {
+      return a <= b;
+    },
+    on: function on(a, b) {
+      return a && a.indexOf && a.indexOf(changeType(a[0], b)) > -1;
+    },
+    notOn: function notOn(a, b) {
+      return !condition.on(a, b);
+    },
+    "in": function _in(a, b) {
+      return b && b.indexOf && b.indexOf(a) > -1;
+    },
+    notIn: function notIn(a, b) {
+      return !condition["in"](a, b);
+    },
+    between: function between(a, b) {
+      return a > b[0] && a < b[1];
+    },
+    notBetween: function notBetween(a, b) {
+      return a < b[0] || a > b[1];
+    },
+    empty: function empty(a) {
+      return is.empty(a);
+    },
+    notEmpty: function notEmpty(a) {
+      return !is.empty(a);
+    },
+    pattern: function pattern(a, b) {
+      return new RegExp(b, 'g').test(a);
+    }
+  };
+  function deepGet(val, split) {
+    (Array.isArray(split) ? split : (split || '').split('.')).forEach(function (k) {
+      if (val != null) {
+        val = val[k];
+      }
+    });
+    return val;
+  }
+  function extractVar(str) {
+    var regex = /{{\s*(.*?)\s*}}/g;
+    var match;
+    var matches = {};
+
+    while ((match = regex.exec(str)) !== null) {
+      if (match[1]) {
+        matches[match[1]] = true;
+      }
+    }
+
+    return Object.keys(matches);
+  }
+  function convertFieldToConditions(field) {
+    var parts = field.split('.');
+    var conditions = [];
+    var currentCondition = '';
+    parts.forEach(function (part, index) {
+      if (index === 0) {
+        currentCondition = part;
+      } else {
+        currentCondition += '.' + part;
+      }
+
+      conditions.push(currentCondition);
+    });
+    return conditions.join(' && ');
+  }
+
+  var _getGroupInject = function getGroupInject(vm, parent) {
+    if (!vm || vm === parent) {
+      return;
+    }
+
+    if (vm.props.formCreateInject) {
+      return vm.props.formCreateInject;
+    }
+
+    if (vm.parent) {
+      return _getGroupInject(vm.parent, parent);
+    }
+  };
+
+  function $FormCreate(FormCreate, components, directives) {
+    return vue.defineComponent({
+      name: 'FormCreate' + (FormCreate.isMobile ? 'Mobile' : ''),
+      components: components,
+      directives: directives,
+      props: {
+        rule: {
+          type: Array,
+          required: true,
+          "default": function _default() {
+            return [];
+          }
+        },
+        option: {
+          type: Object,
+          "default": function _default() {
+            return {};
+          }
+        },
+        extendOption: Boolean,
+        driver: [String, Object],
+        modelValue: Object,
+        disabled: {
+          type: Boolean,
+          "default": undefined
+        },
+        preview: {
+          type: Boolean,
+          "default": undefined
+        },
+        index: [String, Number],
+        api: Object,
+        locale: [String, Object],
+        name: String,
+        subForm: {
+          type: Boolean,
+          "default": true
+        },
+        inFor: Boolean
+      },
+      emits: ['update:api', 'update:modelValue', 'mounted', 'submit', 'reset', 'change', 'emit-event', 'control', 'remove-rule', 'remove-field', 'sync', 'reload', 'repeat-field', 'update', 'validate-field-fail', 'validate-fail', 'created'],
+      render: function render() {
+        return this.fc.render();
+      },
+      setup: function setup(props) {
+        var vm = vue.getCurrentInstance();
+        vue.provide('parentFC', vm);
+        var parent = vue.inject('parentFC', null);
+        var top = parent;
+
+        if (parent) {
+          while (top.setupState.parent) {
+            top = top.setupState.parent;
+          }
+        } else {
+          top = vm;
+        }
+
+        var _toRefs = vue.toRefs(props),
+            rule = _toRefs.rule,
+            modelValue = _toRefs.modelValue,
+            subForm = _toRefs.subForm,
+            inFor = _toRefs.inFor;
+
+        var data = vue.reactive({
+          ctxInject: {},
+          destroyed: false,
+          isShow: true,
+          unique: 1,
+          renderRule: _toConsumableArray(rule.value || []),
+          updateValue: JSON.stringify(modelValue.value || {})
+        });
+        var fc = new FormCreate(vm);
+        var fapi = fc.api();
+        var isMore = inFor.value;
+
+        var addSubForm = function addSubForm() {
+          if (parent) {
+            var _inject = _getGroupInject(vm, parent);
+
+            if (_inject) {
+              var sub;
+
+              if (isMore) {
+                sub = toArray(_inject.getSubForm());
+                sub.push(fapi);
+              } else {
+                sub = fapi;
+              }
+
+              _inject.subForm(sub);
+            }
+          }
+        };
+
+        var rmSubForm = function rmSubForm() {
+          var inject = _getGroupInject(vm, parent);
+
+          if (inject) {
+            if (isMore) {
+              var sub = toArray(inject.getSubForm());
+              var idx = sub.indexOf(fapi);
+
+              if (idx > -1) {
+                sub.splice(idx, 1);
+              }
+            } else {
+              inject.subForm();
+            }
+          }
+        };
+
+        var styleEl = null;
+        vue.onBeforeMount(function () {
+          vue.watchEffect(function () {
+            var content = '';
+            var globalClass = props.option && props.option.globalClass || {};
+            Object.keys(globalClass).forEach(function (k) {
+              var subCss = '';
+              globalClass[k].style && Object.keys(globalClass[k].style).forEach(function (key) {
+                subCss += toLine(key) + ':' + globalClass[k].style[key] + ';';
+              });
+
+              if (globalClass[k].content) {
+                subCss += globalClass[k].content + ';';
+              }
+
+              if (subCss) {
+                content += ".".concat(k, "{").concat(subCss, "}");
+              }
+            });
+
+            if (props.option && props.option.style) {
+              content += props.option.style;
+            }
+
+            if (!styleEl) {
+              styleEl = document.createElement('style');
+              styleEl.type = 'text/css';
+              document.head.appendChild(styleEl);
+            }
+
+            styleEl.innerHTML = content || '';
+          });
+        });
+        var emit$topForm = debounce(function () {
+          fc.bus.$emit('$loadData.$topForm');
+        }, 100);
+        var emit$scopeForm = debounce(function () {
+          fc.bus.$emit('$loadData.$scopeForm');
+        }, 100);
+        var emit$form = debounce(function () {
+          fc.bus.$emit('$loadData.$form');
+        }, 100);
+
+        var emit$change = function emit$change(field) {
+          fc.bus.$emit('change-$form.' + field);
+        };
+
+        vue.onMounted(function () {
+          if (parent) {
+            fapi.top.bus.$on('$loadData.$form', emit$topForm);
+            fapi.top.bus.$on('change', emit$change);
+          }
+
+          if (fapi !== fapi.scope) {
+            fapi.scope.bus.$on('$loadData.$scopeForm', emit$scopeForm);
+          }
+
+          fc.mounted();
+        });
+        vue.onBeforeUnmount(function () {
+          if (parent) {
+            fapi.top.bus.$off('$loadData.$form', emit$topForm);
+            fapi.top.bus.$off('change', emit$change);
+          }
+
+          if (fapi !== fapi.scope) {
+            fapi.scope.bus.$off('$loadData.$scopeForm', emit$scopeForm);
+          }
+
+          styleEl && document.head.removeChild(styleEl);
+          rmSubForm();
+          data.destroyed = true;
+          fc.unmount();
+        });
+        vue.onUpdated(function () {
+          fc.updated();
+        });
+        addSubForm();
+        vue.watch(function () {
+          return props.option;
+        }, function () {
+          fc.initOptions();
+          fapi.refresh();
+        }, {
+          deep: true
+        });
+        vue.watch(function () {
+          return _toConsumableArray(rule.value);
+        }, function (n) {
+          if (fc.$handle.isBreakWatch() || n.length === data.renderRule.length && n.every(function (v) {
+            return data.renderRule.indexOf(v) > -1;
+          })) return;
+          fc.$handle.updateAppendData();
+          fc.$handle.reloadRule(rule.value);
+          vm.setupState.renderRule();
+        });
+        vue.watch(function () {
+          return [props.disabled, props.preview];
+        }, function () {
+          fapi.refresh();
+        });
+        vue.watch(modelValue, function (n) {
+          if (toJson(n || {}) === data.updateValue) return;
+
+          if (fapi.config.forceCoverValue) {
+            fapi.coverValue(n || {});
+          } else {
+            fapi.setValue(n || {});
+          }
+        }, {
+          deep: true,
+          flush: 'post'
+        });
+        vue.watch(function () {
+          return props.index;
+        }, function () {
+          fapi.coverValue({});
+          fc.$handle.updateAppendData();
+          vue.nextTick(function () {
+            vue.nextTick(function () {
+              fapi.clearValidateState();
+            });
+          });
+        }, {
+          flush: 'sync'
+        });
+        return _objectSpread2(_objectSpread2({
+          fc: vue.markRaw(fc),
+          parent: parent ? vue.markRaw(parent) : parent,
+          top: vue.markRaw(top),
+          fapi: vue.markRaw(fapi)
+        }, vue.toRefs(data)), {}, {
+          getGroupInject: function getGroupInject() {
+            return _getGroupInject(vm, parent);
+          },
+          refresh: function refresh() {
+            ++data.unique;
+          },
+          renderRule: function renderRule() {
+            data.renderRule = _toConsumableArray(rule.value || []);
+          },
+          updateValue: function updateValue(value) {
+            if (data.destroyed) return;
+            var json = toJson(value);
 
-        var slots = {};
-        Object.keys(slotBag).forEach(function (k) {
-          slots[k] = function () {
-            for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-              args[_key] = arguments[_key];
+            if (data.updateValue === json) {
+              return;
             }
 
-            return _this.getSlot(k, args);
-          };
+            data.updateValue = json;
+            vm.emit('update:modelValue', value);
+            vue.nextTick(function () {
+              emit$form();
+
+              if (!parent) {
+                emit$topForm();
+                emit$scopeForm();
+              } else if (!subForm.value) {
+                emit$scopeForm();
+              }
+            });
+          }
         });
-        return slots;
-      },
-      slotLen: function slotLen(slot) {
-        slot = slotName(slot);
-        return slotBag[slot] ? slotBag[slot].length : 0;
       },
-      mergeBag: function mergeBag(bag) {
-        var _this2 = this;
-
-        if (!bag) return this;
-        var slots = is.Function(bag.getSlots) ? bag.getSlots() : bag;
-
-        if (Array.isArray(bag) || vue.isVNode(bag)) {
-          this.setSlot(undefined, function () {
-            return bag;
-          });
-        } else {
-          Object.keys(slots).forEach(function (k) {
-            _this2.setSlot(k, slots[k]);
-          });
-        }
-
-        return this;
-      }
-    };
-  }
-  function toProps(rule) {
-    var prop = _objectSpread2({}, rule.props || {});
-
-    Object.keys(rule.on || {}).forEach(function (k) {
-      if (k.indexOf('-') > 0) {
-        k = toCase(k);
-      }
-
-      var name = "on".concat(upper(k));
-
-      if (Array.isArray(prop[name])) {
-        prop[name] = [].concat(_toConsumableArray(prop[name]), [rule.on[k]]);
-      } else if (prop[name]) {
-        prop[name] = [prop[name], rule.on[k]];
-      } else {
-        prop[name] = rule.on[k];
-      }
-    });
-    prop.key = rule.key;
-    prop.ref = rule.ref;
-    prop["class"] = rule["class"];
-    prop.id = rule.id;
-    prop.style = rule.style;
-    if (prop.slot) delete prop.slot;
-    return prop;
-  }
-  function setPrototypeOf(o, proto) {
-    Object.setPrototypeOf(o, proto);
-    return o;
-  }
-
-  var changeType = function changeType(a, b) {
-    if (typeof a === 'string') {
-      return String(b);
-    } else if (typeof a === 'number') {
-      return Number(b);
-    }
-
-    return b;
-  };
-
-  var condition = {
-    '==': function _(a, b) {
-      return JSON.stringify(a) === JSON.stringify(changeType(a, b));
-    },
-    '!=': function _(a, b) {
-      return !condition['=='](a, b);
-    },
-    '>': function _(a, b) {
-      return a > b;
-    },
-    '>=': function _(a, b) {
-      return a >= b;
-    },
-    '<': function _(a, b) {
-      return a < b;
-    },
-    '<=': function _(a, b) {
-      return a <= b;
-    },
-    on: function on(a, b) {
-      return a && a.indexOf && a.indexOf(changeType(a[0], b)) > -1;
-    },
-    notOn: function notOn(a, b) {
-      return !condition.on(a, b);
-    },
-    "in": function _in(a, b) {
-      return b && b.indexOf && b.indexOf(a) > -1;
-    },
-    notIn: function notIn(a, b) {
-      return !condition["in"](a, b);
-    },
-    between: function between(a, b) {
-      return a > b[0] && a < b[1];
-    },
-    notBetween: function notBetween(a, b) {
-      return a < b[0] || a > b[1];
-    },
-    empty: function empty(a) {
-      return is.empty(a);
-    },
-    notEmpty: function notEmpty(a) {
-      return !is.empty(a);
-    },
-    pattern: function pattern(a, b) {
-      return new RegExp(b, 'g').test(a);
-    }
-  };
-  function deepGet(val, split) {
-    (Array.isArray(split) ? split : (split || '').split('.')).forEach(function (k) {
-      if (val != null) {
-        val = val[k];
-      }
-    });
-    return val;
-  }
-  function extractVar(str) {
-    var regex = /{{\s*(.*?)\s*}}/g;
-    var match;
-    var matches = {};
-
-    while ((match = regex.exec(str)) !== null) {
-      if (match[1]) {
-        matches[match[1]] = true;
-      }
-    }
-
-    return Object.keys(matches);
-  }
-  function convertFieldToConditions(field) {
-    var parts = field.split('.');
-    var conditions = [];
-    var currentCondition = '';
-    parts.forEach(function (part, index) {
-      if (index === 0) {
-        currentCondition = part;
-      } else {
-        currentCondition += '.' + part;
+      created: function created() {
+        var vm = vue.getCurrentInstance();
+        vm.emit('update:api', vm.setupState.fapi);
+        vm.setupState.fc.init();
       }
-
-      conditions.push(currentCondition);
     });
-    return conditions.join(' && ');
   }
 
   function baseRule() {
@@ -3125,8 +3121,15 @@
     }
 
     function props(fields, key, val) {
-      tidyFields(fields).forEach(function (field) {
-        h.getCtxs(field).forEach(function (ctx) {
+      if (is.Undef(fields)) {
+        fields = Object.keys(_objectSpread2(_objectSpread2({}, h.fieldCtx), h.nameCtx));
+      } else if (!Array.isArray(fields)) {
+        fields = [fields];
+      }
+
+      fields.forEach(function (field) {
+        var ctxs = h.fieldCtx[field] || h.nameCtx[field];
+        ctxs && ctxs.forEach(function (ctx) {
           $set(ctx.rule, key, val);
           h.$render.clearCache(ctx);
         });
@@ -3144,6 +3147,14 @@
     }
 
     var api = {
+      get isScope() {
+        return h.vm.props.subForm === false;
+      },
+
+      get isPreview() {
+        return h.preview;
+      },
+
       get config() {
         return h.options;
       },
@@ -5655,7 +5666,7 @@
         return JSON.stringify(this.getFormData(ctx), strFn) !== JSON.stringify(value, strFn);
       },
       isQuote: function isQuote(ctx, value) {
-        return (is.Object(value) || Array.isArray(value)) && value === ctx.rule.value;
+        return (value instanceof Function || is.Object(value) || Array.isArray(value)) && value === ctx.rule.value;
       },
       refreshUpdate: function refreshUpdate(ctx, val, origin, field) {
         var _this5 = this;
@@ -6071,7 +6082,7 @@
                 field = JSON.stringify(_this2.fc.getLoadData(one.variable) || '');
               } else if (one.field) {
                 field = convertFieldToConditions(one.field || '');
-              } else {
+              } else if (!one.mode) {
                 return {
                   v: true
                 };
@@ -6142,6 +6153,8 @@
         return invoke(fn, undefined);
       },
       computeValue: function computeValue(str, ctx, group) {
+        var _this3 = this;
+
         var that = this;
         var formulas = Object.keys(this.fc.formulas).reduce(function (obj, k) {
           obj[k] = function () {
@@ -6161,34 +6174,36 @@
 
           return obj;
         }, {});
-        return new Function('$formulas', '$form', '$scope', '$group', '$rule', '$api', "with($form){with($scope){with(this){with($group){with($formulas){ return ".concat(str, " }}}}}")).call(this.api.form, formulas, this.api.top.form, this.api.top === this.api.scope ? {} : this.api.scope.form, group ? this.subRuleData[group.id] || {} : {}, ctx.rule, this.api);
+        return invoke(function () {
+          return new Function('$formulas', '$form', '$scope', '$group', '$rule', '$api', "with($form){with($scope){with(this){with($group){with($formulas){ return ".concat(str, " }}}}}")).call(_this3.api.form, formulas, _this3.api.top.form, _this3.api.top === _this3.api.scope ? {} : _this3.api.scope.form, group ? _this3.subRuleData[group.id] || {} : {}, ctx.rule, _this3.api);
+        }, undefined);
       },
       updateChildren: function updateChildren(ctx, n, o) {
-        var _this3 = this;
+        var _this4 = this;
 
         this.deferSyncValue(function () {
           o && o.forEach(function (child) {
             if ((n || []).indexOf(child) === -1 && child && !is.String(child) && child.__fc__ && child.__fc__.parent === ctx) {
-              _this3.rmCtx(child.__fc__);
+              _this4.rmCtx(child.__fc__);
             }
           });
 
           if (is.trueArray(n)) {
-            _this3.loadChildren(n, ctx);
+            _this4.loadChildren(n, ctx);
 
-            _this3.bus.$emit('update', _this3.api);
+            _this4.bus.$emit('update', _this4.api);
           }
         });
       },
       rmSub: function rmSub(sub) {
-        var _this4 = this;
+        var _this5 = this;
 
         is.trueArray(sub) && sub.forEach(function (r) {
-          r && r.__fc__ && _this4.rmCtx(r.__fc__);
+          r && r.__fc__ && _this5.rmCtx(r.__fc__);
         });
       },
       rmCtx: function rmCtx(ctx) {
-        var _this5 = this;
+        var _this6 = this;
 
         if (ctx.deleted) return;
         var id = ctx.id,
@@ -6217,19 +6232,19 @@
         }
 
         this.deferSyncValue(function () {
-          if (!_this5.reloading) {
+          if (!_this6.reloading) {
             if (ctx.parser.loadChildren !== false) {
               var children = ctx.getPending('children', ctx.rule.children);
 
               if (is.trueArray(children)) {
                 children.forEach(function (h) {
-                  return h.__fc__ && _this5.rmCtx(h.__fc__);
+                  return h.__fc__ && _this6.rmCtx(h.__fc__);
                 });
               }
             }
 
-            if (ctx.root === _this5.rules) {
-              _this5.vm.setupState.renderRule();
+            if (ctx.root === _this6.rules) {
+              _this6.vm.setupState.renderRule();
             }
           }
         }, input);
@@ -6491,7 +6506,13 @@
         return fc.bus;
       },
       preview: function preview() {
-        return fc.vm.props.preview != null ? fc.vm.props.preview : fc.options.value.preview || false;
+        if (fc.vm.props.preview != null) {
+          return fc.vm.props.preview;
+        } else if (fc.vm.setupState.parent && fc.vm.setupState.parent.props.preview != null) {
+          return fc.vm.setupState.parent.props.preview;
+        }
+
+        return fc.options.value.preview || false;
       }
     });
     extend(this, {
@@ -6596,7 +6617,7 @@
         }
       }).then(function () {
         return _this3.globalBeforeFetch(opt);
-      });
+      })["catch"](function () {});
     }
   });
   useInject(Handler);
@@ -6798,57 +6819,61 @@
     var loadData = {
       name: 'loadData',
       _fn: [],
-      mounted: function mounted(inject, rule, api) {
-        this.deleted(inject);
-        var attrs = toArray(inject.getValue());
-        var unwatchs = [];
-        attrs.forEach(function (attr) {
-          if (attr && (attr.attr || attr.template)) {
-            var fn = function fn(get) {
-              var value;
+      loaded: function loaded(inject, rule, api) {
+        var _this = this;
 
-              if (attr.template) {
-                value = fc.$handle.loadStrVar(attr.template, get);
-              } else if (attr.handler && is.Function(attr.handler)) {
-                value = attr.handler(get, rule, api);
-              } else {
-                value = get(attr.attr, attr["default"]);
-              }
+        this.deleted(inject);
+        vue.nextTick(function () {
+          var attrs = toArray(inject.getValue());
+          var unwatchs = [];
+          attrs.forEach(function (attr) {
+            if (attr && (attr.attr || attr.template)) {
+              var fn = function fn(get) {
+                var value;
+
+                if (attr.template) {
+                  value = fc.$handle.loadStrVar(attr.template, get);
+                } else if (attr.handler && is.Function(attr.handler)) {
+                  value = attr.handler(get, rule, api);
+                } else {
+                  value = get(attr.attr, attr["default"]);
+                }
 
-              if (attr.copy !== false) {
-                value = deepCopy(value);
-              }
+                if (attr.copy !== false) {
+                  value = deepCopy(value);
+                }
 
-              var _rule = attr.modify ? rule : inject.getProp();
+                var _rule = attr.modify ? rule : inject.getProp();
 
-              if (attr.to === 'child') {
-                if (_rule.children) {
-                  _rule.children[0] = value;
+                if (attr.to === 'child') {
+                  if (_rule.children) {
+                    _rule.children[0] = value;
+                  } else {
+                    _rule.children = [value];
+                  }
                 } else {
-                  _rule.children = [value];
+                  deepSet(_rule, attr.to || 'options', value);
                 }
-              } else {
-                deepSet(_rule, attr.to || 'options', value);
-              }
 
-              api.sync(rule);
-            };
+                api.sync(rule);
+              };
 
-            var callback = function callback(get) {
-              return fn(get);
-            };
+              var callback = function callback(get) {
+                return fn(get);
+              };
 
-            var unwatch = fc.watchLoadData(callback);
-            fn = debounce(fn, attr.wait || 300);
+              var unwatch = fc.watchLoadData(callback);
+              fn = debounce(fn, attr.wait || 300);
 
-            if (attr.watch !== false) {
-              unwatchs.push(unwatch);
-            } else {
-              unwatch();
+              if (attr.watch !== false) {
+                unwatchs.push(unwatch);
+              } else {
+                unwatch();
+              }
             }
-          }
+          });
+          _this._fn[inject.id] = unwatchs;
         });
-        this._fn[inject.id] = unwatchs;
       },
       deleted: function deleted(inject) {
         if (this._fn[inject.id]) {
@@ -6862,7 +6887,7 @@
         inject.clearProp();
       }
     };
-    loadData.watch = loadData.mounted;
+    loadData.watch = loadData.loaded;
     return loadData;
   };
 
@@ -7075,7 +7100,6 @@
             }
 
             set(fn(body, rule, api));
-            api.sync(rule);
           },
           onError: function onError(e) {
             set(undefined);
@@ -7792,7 +7816,7 @@
               }
             });
             this.unwatch.push(unwatch);
-            return val;
+            return deepGet(val, split);
           }
         }
       },
@@ -8787,7 +8811,9 @@
         return new Promise(function (resolve, reject) {
           var forms = api.children;
           var all = [h.$manager.validate()];
-          forms.forEach(function (v) {
+          forms.filter(function (v) {
+            return !v.isScope;
+          }).forEach(function (v) {
             all.push(v.validate());
           });
           Promise.all(all).then(function () {
@@ -8808,7 +8834,9 @@
           if (!ctx) return;
           var sub = h.subForm[ctx.id];
           var all = [h.$manager.validateField(ctx.id)];
-          toArray(sub).forEach(function (v) {
+          toArray(sub).filter(function (v) {
+            return !v.isScope;
+          }).forEach(function (v) {
             all.push(v.validate());
           });
           Promise.all(all).then(function () {
@@ -8911,7 +8939,8 @@
       },
       submit: function submit(successFn, failFn) {
         return new Promise(function (resolve, reject) {
-          api.validate().then(function () {
+          var promise = h.options.validateOnSubmit === false ? Promise.resolve() : api.validate();
+          promise.then(function () {
             var formData = api.formData();
             is.Function(successFn) && invoke(function () {
               return successFn(formData, api);
@@ -9027,7 +9056,7 @@
   function elmFormCreate() {
     return FormCreateFactory({
       ui: 'element-ui',
-      version: '3.2.20',
+      version: '3.2.21',
       manager: manager,
       extendApi: extendApi,
       install: install,