@form-create/element-ui 3.1.27 → 3.1.29

package/dist/form-create.js

@@ -1,5 +1,5 @@
 /*!
- * @form-create/element-ui v3.1.27
+ * @form-create/element-ui v3.1.29
  * (c) 2018-2024 xaboy
  * Github https://github.com/xaboy/form-create
  * Released under the MIT License.
@@ -257,13 +257,16 @@
             var props = _objectSpread2({}, opt);
 
             var value = props.value;
+            var label = props.label;
             delete props.value;
+            delete props.label;
             return vue.createVNode(Type, vue.mergeProps(props, {
               "label": value,
-              "key": name + index + '-' + opt.value
+              "value": value,
+              "key": name + index + '-' + value
             }), {
               "default": function _default() {
-                return [props.label || props.value || ''];
+                return [label || value || ''];
               }
             });
           }), (_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)];
@@ -1001,13 +1004,16 @@
             var props = _objectSpread2({}, opt);
 
             var value = props.value;
+            var label = props.label;
             delete props.value;
+            delete props.label;
             return vue.createVNode(Type, vue.mergeProps(props, {
               "label": value,
-              "key": name + index + '-' + opt.value
+              "value": value,
+              "key": name + index + '-' + value
             }), {
               "default": function _default() {
-                return [props.label || props.value || ''];
+                return [label || value || ''];
               }
             });
           }), (_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)];
@@ -1419,6 +1425,10 @@
   function extend() {
     return _extends.apply(this, arguments);
   }
+  function copy$1(obj) {
+    if (_typeof(obj) !== 'object' || obj === null) return obj;
+    return obj instanceof Array ? _toConsumableArray(obj) : _objectSpread2({}, obj);
+  }
 
   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);
@@ -1802,7 +1812,7 @@
         add: this.add
       }) : vue.createVNode("div", {
         "key": 'a_def',
-        "class": "_fc-group-plus-minus _fc-group-add",
+        "class": "_fc-group-plus-minus _fc-group-add fc-clock",
         "onClick": this.add
       }, null) : keys.map(function (key, index) {
         var _this12$cacheRule$key = _this12.cacheRule[key],
@@ -1836,7 +1846,7 @@
         }), null), vue.createVNode("div", {
           "class": "_fc-group-idx"
         }, [index + 1]), btn.length ? vue.createVNode("div", {
-          "class": "_fc-group-handle"
+          "class": "_fc-group-handle fc-clock"
         }, [btn]) : null]);
       });
       return vue.createVNode("div", {
@@ -1994,6 +2004,7 @@
         },
         extendOption: Boolean,
         modelValue: Object,
+        disabled: Boolean,
         api: Object,
         name: String,
         subForm: {
@@ -2023,7 +2034,7 @@
           isShow: true,
           unique: 1,
           renderRule: _toConsumableArray(rule.value || []),
-          updateValue: JSON.stringify(modelValue || {})
+          updateValue: JSON.stringify(modelValue.value || {})
         });
         var fc = new FormCreate(vm);
         var fapi = fc.api();
@@ -2092,8 +2103,8 @@
         });
         vue.watch(function () {
           return props.option;
-        }, function (n) {
-          fc.initOptions(n);
+        }, function () {
+          fc.initOptions();
           fapi.refresh();
         }, {
           deep: true
@@ -2104,6 +2115,11 @@
         }, {
           deep: true
         });
+        vue.watch(function () {
+          return props.disabled;
+        }, function (n) {
+          fapi.disabled(!!n);
+        });
         return _objectSpread2(_objectSpread2({
           fc: vue.markRaw(fc),
           parent: parent ? vue.markRaw(parent) : parent,
@@ -2126,6 +2142,7 @@
         var vm = vue.getCurrentInstance();
         vm.setupState.fc.init();
         vm.emit('update:api', vm.setupState.fapi);
+        vm.props.disabled && vm.setupState.fapi.disabled(true);
       }
     });
   }
@@ -2199,7 +2216,7 @@
     };
   };
 
-  var keyAttrs = ['type', 'slot', 'emitPrefix', 'value', 'name', 'native', 'hidden', 'display', 'inject', 'options', 'emit', 'link', 'prefix', 'suffix', 'update', 'sync', 'optionsTo', 'key', 'slotUpdate', 'computed', 'preview', 'component', 'cache'];
+  var keyAttrs = ['type', 'slot', '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'];
   function attrs() {
@@ -2230,6 +2247,7 @@
   var SUFFIX = '-FORM-CREATE-SUFFIX]]';
   var $T = '$FN:';
   var $TX = '$FNX:';
+  var $ON = '$GLOBAL:';
   var FUNCTION = 'function';
   function toJson(obj, space) {
     return JSON.stringify(deepExtend([], obj, true), function (key, val) {
@@ -2265,6 +2283,26 @@
         } else if (v.indexOf($T) === 0) {
           v = v.replace($T, '');
           flag = true;
+        } else if (v.indexOf($ON) === 0) {
+          var name = v.replace($ON, '');
+
+          v = function v() {
+            for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+              args[_key] = arguments[_key];
+            }
+
+            var callback = args[0].api.getGlobalEvent(name);
+
+            if (callback) {
+              return callback.call.apply(callback, [this].concat(args));
+            }
+
+            return undefined;
+          };
+
+          v.__json = fn;
+          v.__inject = true;
+          return v;
         } else if (v.indexOf($TX) === 0) {
           v = makeFn('function($inject){' + v.replace($TX, '') + '}');
           v.__json = fn;
@@ -2449,6 +2487,10 @@
     if (prop.slot) delete prop.slot;
     return prop;
   }
+  function setPrototypeOf(o, proto) {
+    Object.setPrototypeOf(o, proto);
+    return o;
+  }
 
   function baseRule() {
     return {
@@ -2525,6 +2567,107 @@
     };
   }
 
+  function getError(action, option, xhr) {
+    var msg = "fail to ".concat(action, " ").concat(xhr.status, "'");
+    var err = new Error(msg);
+    err.status = xhr.status;
+    err.url = action;
+    return err;
+  }
+
+  function getBody(xhr) {
+    var text = xhr.responseText || xhr.response;
+
+    if (!text) {
+      return text;
+    }
+
+    try {
+      return JSON.parse(text);
+    } catch (e) {
+      return text;
+    }
+  }
+
+  function fetch$1(option) {
+    if (typeof XMLHttpRequest === 'undefined') {
+      return;
+    }
+
+    var xhr = new XMLHttpRequest();
+    var action = option.action;
+
+    xhr.onerror = function error(e) {
+      option.onError(e);
+    };
+
+    xhr.onload = function onload() {
+      if (xhr.status < 200 || xhr.status >= 300) {
+        return option.onError(getError(action, option, xhr), getBody(xhr));
+      }
+
+      option.onSuccess(getBody(xhr));
+    };
+
+    xhr.open(option.method || 'get', action, true);
+    var formData;
+
+    if (option.data) {
+      if ((option.dataType || '').toLowerCase() !== 'json') {
+        formData = new FormData();
+        Object.keys(option.data).map(function (key) {
+          formData.append(key, option.data[key]);
+        });
+      } else {
+        formData = JSON.stringify(option.data);
+        xhr.setRequestHeader('content-type', 'application/json');
+      }
+    }
+
+    if (option.withCredentials && 'withCredentials' in xhr) {
+      xhr.withCredentials = true;
+    }
+
+    var headers = option.headers || {};
+    Object.keys(headers).forEach(function (item) {
+      if (headers[item] !== null) {
+        xhr.setRequestHeader(item, headers[item]);
+      }
+    });
+    xhr.send(formData);
+  }
+  function asyncFetch(config) {
+    return new Promise(function (resolve, reject) {
+      fetch$1(_objectSpread2(_objectSpread2({}, config), {}, {
+        onSuccess: function onSuccess(res) {
+          var fn = function fn(v) {
+            return v;
+          };
+
+          var parse = parseFn(config.parse);
+
+          if (is.Function(parse)) {
+            fn = parse;
+          } else if (parse && is.String(parse)) {
+            fn = function fn(v) {
+              parse.split('.').forEach(function (k) {
+                if (v) {
+                  v = v[k];
+                }
+              });
+              return v;
+            };
+          }
+
+          resolve(fn(res));
+        },
+        onError: function onError(err) {
+          reject(err);
+        }
+      }));
+    });
+  }
+
   function copy(value) {
     return deepCopy(value);
   }
@@ -2580,7 +2723,15 @@
       },
 
       get parent() {
-        return h.vm.parent && h.vm.parent.setupState.fapi;
+        return h.vm.setupState.parent && h.vm.setupState.parent.setupState.fapi;
+      },
+
+      get top() {
+        if (api.parent) {
+          return api.parent.top;
+        }
+
+        return api;
       },
 
       get children() {
@@ -2924,6 +3075,84 @@
         var ctx = h.getCtx(field);
         return ctx ? h.subForm[ctx.id] : undefined;
       },
+      getChildrenRuleList: function getChildrenRuleList(id) {
+        var flag = _typeof(id) === 'object';
+        var ctx = flag ? byCtx(id) : h.getCtx(id);
+        var rule = ctx ? ctx.rule : flag ? id : api.getRule(id);
+
+        if (!rule) {
+          return [];
+        }
+
+        var rules = [];
+
+        var findRules = function findRules(children) {
+          children && children.forEach(function (item) {
+            if (_typeof(item) !== 'object') {
+              return;
+            }
+
+            if (item.field) {
+              rules.push(item);
+            }
+
+            rules.push.apply(rules, _toConsumableArray(api.getChildrenRuleList(item)));
+          });
+        };
+
+        findRules(ctx ? ctx.loadChildrenPending() : rule.children);
+        return rules;
+      },
+      getChildrenFormData: function getChildrenFormData(id) {
+        var rules = api.getChildrenRuleList(id);
+        return rules.reduce(function (formData, rule) {
+          formData[rule.field] = copy(rule.value);
+          return formData;
+        }, {});
+      },
+      setChildrenFormData: function setChildrenFormData(id, formData, cover) {
+        var rules = api.getChildrenRuleList(id);
+        rules.forEach(function (rule) {
+          if (hasProperty(formData, rule.field)) {
+            rule.value = formData[rule.field];
+          } else if (cover) {
+            rule.value = undefined;
+          }
+        });
+      },
+      getGlobalEvent: function getGlobalEvent(name) {
+        var event = api.options.globalEvent[name];
+
+        if (event) {
+          if (_typeof(event) === 'object') {
+            event = event.handle;
+          }
+
+          return parseFn(event);
+        }
+
+        return undefined;
+      },
+      getGlobalData: function getGlobalData(name) {
+        return new Promise(function (resolve, inject) {
+          var config = api.options.globalData[name];
+
+          if (!config) {
+            resolve(h.fc.loadData[name]);
+          }
+
+          if (config.type === 'fetch') {
+            asyncFetch(config).then(function (res) {
+              resolve({
+                res: res,
+                config: config
+              });
+            })["catch"](inject);
+          } else {
+            resolve(config.data);
+          }
+        });
+      },
       nextTick: function nextTick(fn) {
         h.bus.$once('next-tick', fn);
         h.refresh();
@@ -3020,7 +3249,8 @@
 
   var id$2 = 0;
   function uniqueId() {
-    return 'F' + Math.random().toString(36).substr(3, 3) + Number("".concat(Date.now()).concat(++id$2)).toString(36);
+    var num = 370 + ++id$2;
+    return 'F' + Math.random().toString(36).substr(3, 3) + Number("".concat(Date.now())).toString(36) + num.toString(36) + 'c';
   }
 
   function deepSet(data, idx, val) {
@@ -3219,7 +3449,7 @@
                 inject.children = children;
                 _vn = slot(inject);
               } else {
-                _vn = preview ? ctx.parser.preview(children, ctx) : ctx.parser.render(children, ctx);
+                _vn = preview ? ctx.parser.preview(copy$1(children), ctx) : ctx.parser.render(copy$1(children), ctx);
               }
 
               _vn = _this4.renderSides(_vn, ctx);
@@ -3229,7 +3459,17 @@
               }
 
               if (ctx.none) {
-                _vn = _this4.display(_vn);
+                if (Array.isArray(_vn)) {
+                  _vn = _vn.map(function (v) {
+                    if (!v || !v.__v_isVNode) {
+                      return v;
+                    }
+
+                    return _this4.none(v);
+                  });
+                } else {
+                  _vn = _this4.none(_vn);
+                }
               }
 
               cacheFlag && !Object.keys(children).length && _this4.setCache(ctx, function () {
@@ -3261,43 +3501,25 @@
           return;
         }
       },
-      getModelField: function getModelField(ctx) {
-        return ctx.rule.modelField || ctx.parser.modelField || this.fc.modelFields[this.vNode.aliasMap[ctx.type]] || this.fc.modelFields[ctx.type] || this.fc.modelFields[ctx.originType] || 'modelValue';
-      },
-      display: function display(vn) {
-        var _this5 = this;
-
-        if (Array.isArray(vn)) {
-          var data = [];
-          vn.forEach(function (v) {
-            if (Array.isArray(v)) return _this5.display(v);
-            if (_this5.none(v)) data.push(v);
-          });
-          return data;
-        } else {
-          return this.none(vn);
-        }
-      },
       none: function none(vn) {
         if (vn) {
-          if (Array.isArray(vn.props.style)) {
-            vn.props.style.push({
-              display: 'none'
-            });
+          if (Array.isArray(vn.props["class"])) {
+            vn.props["class"].push('fc-none');
           } else {
-            vn.props.style = [vn.props.style, {
-              display: 'none'
-            }];
+            vn.props["class"] = [vn.props["class"], 'fc-none'];
           }
 
           return vn;
         }
       },
+      getModelField: function getModelField(ctx) {
+        return ctx.rule.modelField || ctx.parser.modelField || this.fc.modelFields[this.vNode.aliasMap[ctx.type]] || this.fc.modelFields[ctx.type] || this.fc.modelFields[ctx.originType] || 'modelValue';
+      },
       isFragment: function isFragment(ctx) {
         return ctx.type === 'fragment' || ctx.type === 'template';
       },
       injectProp: function injectProp(ctx) {
-        var _this6 = this;
+        var _this5 = this;
 
         var state = this.vm.setupState;
 
@@ -3306,14 +3528,15 @@
             api: this.$handle.api,
             form: this.fc.create,
             subForm: function subForm(_subForm) {
-              _this6.$handle.addSubForm(ctx, _subForm);
+              _this5.$handle.addSubForm(ctx, _subForm);
             },
             getSubForm: function getSubForm() {
-              return _this6.$handle.subForm[ctx.id];
+              return _this5.$handle.subForm[ctx.id];
             },
             options: [],
             children: [],
             preview: false,
+            id: ctx.id,
             field: ctx.field,
             rule: ctx.rule,
             input: ctx.input
@@ -3329,7 +3552,7 @@
         return inject;
       },
       ctxProp: function ctxProp(ctx, custom) {
-        var _this7 = this;
+        var _this6 = this;
 
         var ref = ctx.ref,
             key = ctx.key,
@@ -3344,7 +3567,7 @@
             vnodeMounted: function vnodeMounted(vn) {
               vn.el.__rule__ = ctx.rule;
 
-              _this7.onMounted(ctx, vn.el);
+              _this6.onMounted(ctx, vn.el);
             },
             'fc.el': function fcEl(el) {
               ctx.exportEl = el;
@@ -3360,12 +3583,14 @@
           var field = this.getModelField(ctx);
           var model = {
             callback: function callback(value) {
-              _this7.onInput(ctx, value);
+              _this6.onInput(ctx, value);
             },
             value: this.$handle.getFormData(ctx)
           };
           props.push({
-            on: _defineProperty({}, "update:".concat(field), model.callback),
+            on: _objectSpread2(_defineProperty({}, "update:".concat(field), model.callback), ctx.prop.modelEmit ? _defineProperty({}, ctx.prop.modelEmit, function () {
+              return _this6.onEmitInput(ctx);
+            }) : {}),
             props: _defineProperty({}, field, model.value)
           });
           ctx.prop.model = model;
@@ -3380,10 +3605,18 @@
         this.$handle.effect(ctx, 'mounted');
       },
       onInput: function onInput(ctx, value) {
+        if (ctx.prop.modelEmit) {
+          this.$handle.onBaseInput(ctx, value);
+          return;
+        }
+
         this.$handle.onInput(ctx, value);
       },
+      onEmitInput: function onEmitInput(ctx) {
+        this.$handle.setValue(ctx, ctx.parser.toValue(ctx.modelValue, ctx), ctx.modelValue);
+      },
       renderChildren: function renderChildren(children, ctx) {
-        var _this8 = this;
+        var _this7 = this;
 
         if (!is.trueArray(children)) return {};
         var slotBag = makeSlotBag();
@@ -3392,14 +3625,14 @@
           if (is.String(child)) return slotBag.setSlot(null, child);
 
           if (child.__fc__) {
-            return _this8.renderSlot(slotBag, child.__fc__, ctx);
+            return _this7.renderSlot(slotBag, child.__fc__, ctx);
           }
 
           if (child.type) {
             vue.nextTick(function () {
-              _this8.$handle.loadChildren(children, ctx);
+              _this7.$handle.loadChildren(children, ctx);
 
-              _this8.$handle.refresh();
+              _this7.$handle.refresh();
             });
           }
         });
@@ -3413,7 +3646,7 @@
         return this.vNode.make(lower(ctx.originType), prop, children);
       },
       renderRule: function renderRule(rule, children, origin) {
-        var _this9 = this;
+        var _this8 = this;
 
         if (!rule) return undefined;
         if (is.String(rule)) return rule;
@@ -3437,7 +3670,7 @@
         if (is.trueArray(rule.children)) {
           rule.children.forEach(function (v) {
             v && slotBag.setSlot(v === null || v === void 0 ? void 0 : v.slot, function () {
-              return _this9.renderRule(v);
+              return _this8.renderRule(v);
             });
           });
         }
@@ -3681,16 +3914,6 @@
     });
   }
 
-  function isNone(ctx) {
-    var none = !(is.Undef(ctx.prop.display) || !!ctx.prop.display);
-
-    if (ctx.parent) {
-      return ctx.parent.none || none;
-    } else {
-      return none;
-    }
-  }
-
   function bind(ctx) {
     Object.defineProperties(ctx.origin, {
       __fc__: enumerable(vue.markRaw(ctx), true)
@@ -3713,7 +3936,9 @@
       linkOn: [],
       root: [],
       ctrlRule: [],
+      children: [],
       parent: null,
+      group: rule.subRule ? this : null,
       cacheConfig: null,
       prop: _objectSpread2({}, rule),
       computed: {},
@@ -3731,6 +3956,17 @@
     this.update(handle, true);
   }
   extend(RuleContext.prototype, {
+    getParentGroup: function getParentGroup() {
+      var ctx = this.parent;
+
+      while (ctx) {
+        if (ctx.group) {
+          return ctx;
+        }
+
+        ctx = ctx.parent;
+      }
+    },
     loadChildrenPending: function loadChildrenPending() {
       var _this = this;
 
@@ -3866,7 +4102,7 @@
       })), [this.computed]));
     },
     initNone: function initNone() {
-      this.none = isNone(this);
+      this.none = !(is.Undef(this.prop.display) || !!this.prop.display);
     },
     check: function check(handle) {
       return this.vm === handle.vm;
@@ -3896,6 +4132,11 @@
       this.unwatch();
       this.unlink();
       this.rmCtrl();
+
+      if (this.parent) {
+        this.parent.children.splice(this.parent.children.indexOf(this) >>> 0, 1);
+      }
+
       extend(this, {
         deleted: true,
         prop: _objectSpread2({}, this.rule),
@@ -3907,6 +4148,7 @@
         vm: undef,
         vNode: undef,
         parent: null,
+        children: [],
         cacheConfig: null,
         none: false
       });
@@ -4167,7 +4409,7 @@
           }
         };
 
-        rules.map(function (_rule, index) {
+        var ctxs = rules.map(function (_rule, index) {
           if (parent && !is.Object(_rule)) return;
           if (!_this6.pageEnd && !parent && index >= _this6.first) return;
 
@@ -4235,6 +4477,10 @@
             }
 
             _this6.appendValue(ctx.rule);
+
+            if (ctx.parent && ctx.parent !== parent) {
+              _this6.rmSubRuleData(ctx);
+            }
           }
 
           _this6.parseEmit(ctx);
@@ -4282,7 +4528,13 @@
 
           if (_this6.refreshControl(ctx)) _this6.cycleLoad = true;
           return ctx;
+        }).filter(function (v) {
+          return !!v;
         });
+
+        if (parent) {
+          parent.children = ctxs;
+        }
       },
       refreshControl: function refreshControl(ctx) {
         return ctx.input && ctx.rule.control && this.useCtrl(ctx);
@@ -4485,9 +4737,33 @@
           this.setValue(ctx, val, value);
         }
       },
+      onBaseInput: function onBaseInput(ctx, value) {
+        this.setFormData(ctx, value);
+        ctx.modelValue = value;
+        this.nextRefresh();
+        this.$render.clearCache(ctx);
+      },
       setFormData: function setFormData(ctx, value) {
+        ctx.modelValue = value;
+        var group = ctx.getParentGroup();
+
+        if (group) {
+          if (!this.subRuleData[group.id]) {
+            this.subRuleData[group.id] = {};
+          }
+
+          this.subRuleData[group.id][ctx.field] = ctx.rule.value;
+        }
+
         $set(this.formData, ctx.id, value);
       },
+      rmSubRuleData: function rmSubRuleData(ctx) {
+        var group = ctx.getParentGroup();
+
+        if (group && this.subRuleData[group.id]) {
+          delete this.subRuleData[group.id][ctx.field];
+        }
+      },
       getFormData: function getFormData(ctx) {
         return this.formData[ctx.id];
       },
@@ -4615,40 +4891,6 @@
     mergeProp: function mergeProp(ctx) {}
   };
 
-  var _ = {
-    sum: function sum(arr) {
-      if (Array.isArray(arr)) {
-        var val = 0;
-        arr.map(function (v) {
-          return val += v || 0;
-        });
-        return val;
-      }
-    },
-    column: function column(arr, field) {
-      if (Array.isArray(arr)) {
-        return arr.map(function (v) {
-          return v[field];
-        });
-      }
-
-      return [];
-    },
-    get: function get(obj, field, def) {
-      var lst = field.split('.');
-      var val = obj;
-
-      for (var i = 0; i < lst.length; i++) {
-        if (hasProperty(val, lst[i])) {
-          val = val[lst[i]];
-        } else {
-          return def === undefined ? 0 : def;
-        }
-      }
-
-      return val;
-    }
-  };
   var noneKey = ['field', 'value', 'vm', 'template', 'name', 'config', 'control', 'inject', 'sync', 'payload', 'optionsTo', 'update', 'slotUpdate', 'computed', 'component', 'cache'];
   function useContext(Handler) {
     extend(Handler.prototype, {
@@ -4799,28 +5041,43 @@
             }
           }));
           this.bus.$once('load-end', function () {
-            var computedRef = vue.toRef(ctx.rule, 'computed');
-            ctx.watch.push(vue.watch(function () {
-              var computed = computedRef.value;
-              if (!computed) return undefined;
-              var fn;
-
-              if (is.Function(computed)) {
-                fn = function fn() {
-                  return computed(_this.api.form, _this.api);
-                };
-              } else {
-                fn = function fn() {
-                  return new Function('_', "with(this){ return ".concat(computed, " }")).call(_this.api.form, _);
-                };
-              }
+            var computed = ctx.rule.computed;
 
-              return invoke(fn, undefined);
-            }, function (n) {
-              val.value = n;
-            }, {
-              immediate: !!computedRef.value
-            }));
+            if (!computed) {
+              return;
+            }
+
+            if (_typeof(computed) !== 'object') {
+              computed = {
+                value: computed
+              };
+            }
+
+            Object.keys(computed).forEach(function (k) {
+              ctx.watch.push(vue.watch(function () {
+                var item = computed[k];
+                if (!item) return undefined;
+                var fn;
+
+                if (is.Function(item)) {
+                  fn = function fn() {
+                    return item(_this.api.form, _this.api);
+                  };
+                } else {
+                  var group = ctx.getParentGroup();
+
+                  fn = function fn() {
+                    return new Function('formulas', 'top', 'group', "with(top){with(this){with(group){with(formulas){ return ".concat(item, " }}}}")).call(_this.api.form, _this.fc.formulas, _this.api.top.form, group ? _this.subRuleData[group.id] || {} : {});
+                  };
+                }
+
+                return invoke(fn, undefined);
+              }, function (n) {
+                deepSet(ctx.rule, k, n);
+              }, {
+                immediate: true
+              }));
+            });
           });
         }
 
@@ -4831,7 +5088,7 @@
 
         this.deferSyncValue(function () {
           o && o.forEach(function (child) {
-            if ((n || []).indexOf(child) === -1 && child && !is.String(child) && child.__fc__ && child.__fc__.parent === ctx && child.__fc__.root === o) {
+            if ((n || []).indexOf(child) === -1 && child && !is.String(child) && child.__fc__ && child.__fc__.parent === ctx && child.__fc__.root !== n) {
               _this2.rmCtx(child.__fc__);
             }
           });
@@ -4862,6 +5119,16 @@
         $del(this.formData, id);
         $del(this.subForm, id);
         $del(this.vm.setupState.ctxInject, id);
+        var group = ctx.getParentGroup();
+
+        if (group && this.subRuleData[group.id]) {
+          $del(this.subRuleData[group.id], field);
+        }
+
+        if (ctx.group) {
+          $del(this.subRuleData, id);
+        }
+
         input && this.rmIdCtx(ctx, field, 'field');
         name && this.rmIdCtx(ctx, name, 'name');
 
@@ -5117,6 +5384,7 @@
       deferSyncFn: null,
       isMounted: false,
       formData: vue.reactive({}),
+      subRuleData: vue.reactive({}),
       subForm: {},
       form: vue.reactive({}),
       appendData: {},
@@ -5166,77 +5434,6 @@
   useLifecycle(Handler);
   useEffect(Handler);
 
-  // https://github.com/ElemeFE/element/blob/dev/packages/upload/src/ajax.js
-  function getError(action, option, xhr) {
-    var msg = "fail to ".concat(action, " ").concat(xhr.status, "'");
-    var err = new Error(msg);
-    err.status = xhr.status;
-    err.url = action;
-    return err;
-  }
-
-  function getBody(xhr) {
-    var text = xhr.responseText || xhr.response;
-
-    if (!text) {
-      return text;
-    }
-
-    try {
-      return JSON.parse(text);
-    } catch (e) {
-      return text;
-    }
-  }
-
-  function fetch$1(option) {
-    if (typeof XMLHttpRequest === 'undefined') {
-      return;
-    }
-
-    var xhr = new XMLHttpRequest();
-    var action = option.action;
-
-    xhr.onerror = function error(e) {
-      option.onError(e);
-    };
-
-    xhr.onload = function onload() {
-      if (xhr.status < 200 || xhr.status >= 300) {
-        return option.onError(getError(action, option, xhr), getBody(xhr));
-      }
-
-      option.onSuccess(getBody(xhr));
-    };
-
-    xhr.open(option.method || 'get', action, true);
-    var formData;
-
-    if (option.data) {
-      if ((option.dataType || '').toLowerCase() !== 'json') {
-        formData = new FormData();
-        Object.keys(option.data).map(function (key) {
-          formData.append(key, option.data[key]);
-        });
-      } else {
-        formData = JSON.stringify(option.data);
-        xhr.setRequestHeader('content-type', 'application/json');
-      }
-    }
-
-    if (option.withCredentials && 'withCredentials' in xhr) {
-      xhr.withCredentials = true;
-    }
-
-    var headers = option.headers || {};
-    Object.keys(headers).forEach(function (item) {
-      if (headers[item] !== null) {
-        xhr.setRequestHeader(item, headers[item]);
-      }
-    });
-    xhr.send(formData);
-  }
-
   var NAME = 'fcFragment';
   var fragment = vue.defineComponent({
     name: NAME,
@@ -5380,6 +5577,23 @@
     form: function form() {
       return this.vm.refs[this.ref];
     },
+    getSlot: function getSlot(name) {
+      var _fn = function _fn(vm) {
+        if (vm) {
+          var slot = vm.slots[name];
+
+          if (slot) {
+            return slot;
+          }
+
+          return _fn(vm.setupState.parent);
+        }
+
+        return undefined;
+      };
+
+      return _fn(this.vm);
+    },
     mergeOptions: function mergeOptions(args, opt) {
       var _this2 = this;
 
@@ -5502,22 +5716,23 @@
     function run(inject, rule, api) {
       var option = inject.value;
 
+      if (is.Function(option)) {
+        option = option(rule, api);
+      }
+
+      option = parseOpt(option);
+
       var set = function set(val) {
         if (val === undefined) {
           inject.clearProp();
-          api.sync(rule);
         } else {
           deepSet(inject.getProp(), option.to || 'options', val);
         }
-      };
-
-      if (is.Function(option)) {
-        option = option(rule, api);
-      }
 
-      option = parseOpt(option);
+        api.sync(rule);
+      };
 
-      if (!option || !option.action) {
+      if (!option || !option.action && !option.key) {
         set(undefined);
         return;
       }
@@ -5526,6 +5741,22 @@
         option.to = 'options';
       }
 
+      if (option.key) {
+        var item = fc.$handle.options.globalData[option.key];
+
+        if (!item) {
+          set(undefined);
+          return;
+        }
+
+        if (item.type === 'static') {
+          set(item.data);
+          return;
+        } else {
+          option = _objectSpread2(_objectSpread2({}, option), item);
+        }
+      }
+
       var _onError = option.onError;
 
       var check = function check() {
@@ -5546,11 +5777,13 @@
             return flag ? v : v.data;
           };
 
-          if (is.Function(option.parse)) {
-            fn = option.parse;
-          } else if (option.parse && is.String(option.parse)) {
+          var parse = parseFn(option.parse);
+
+          if (is.Function(parse)) {
+            fn = parse;
+          } else if (parse && is.String(parse)) {
             fn = function fn(v) {
-              option.parse.split('.').forEach(function (k) {
+              parse.split('.').forEach(function (k) {
                 if (v) {
                   v = v[k];
                 }
@@ -5572,8 +5805,8 @@
         }
       });
 
-      fc.options.beforeFetch && invoke(function () {
-        return fc.options.beforeFetch(config, {
+      fc.$handle.options.beforeFetch && invoke(function () {
+        return fc.$handle.options.beforeFetch(config, {
           rule: rule,
           api: api
         });
@@ -5682,6 +5915,7 @@
     };
     var loadData = {};
     var CreateNode = CreateNodeFactory();
+    var formulas = {};
     exportAttrs(config.attrs || {});
 
     function getApi(name) {
@@ -5718,11 +5952,11 @@
 
     function parser() {
       var data = nameProp.apply(void 0, arguments);
-      if (!data.id || !data.prop) return;
+      if (!data.id || !data.prop) return BaseParser;
       var name = toCase(data.id);
       var parser = data.prop;
       var base = parser.merge === true ? parsers[name] : undefined;
-      parsers[name] = _objectSpread2(_objectSpread2({}, base || BaseParser), parser);
+      parsers[name] = setPrototypeOf(parser, base || BaseParser);
       maker[name] = creatorFactory(name);
       parser.maker && extend(maker, parser.maker);
     }
@@ -5742,8 +5976,13 @@
       }
 
       if (!name || !component) return;
+      var nameAlias = toCase(name);
       components[name] = component;
-      components[toCase(name)] = component;
+      components[nameAlias] = component;
+      delete CreateNode.aliasMap[name];
+      delete CreateNode.aliasMap[nameAlias];
+      delete parsers[name];
+      delete parsers[nameAlias];
       if (component.formCreateParser) parser(name, component.formCreateParser);
     }
 
@@ -5803,6 +6042,7 @@
           providers: providers,
           useApps: useApps,
           maker: maker,
+          formulas: formulas,
           loadData: loadData
         };
       } else {
@@ -5816,6 +6056,10 @@
       modelFields[name] = field;
     }
 
+    function setFormula(name, fn) {
+      formulas[name] = fn;
+    }
+
     function _emitData(id) {
       Object.keys(instance).forEach(function (v) {
         var apis = Array.isArray(instance[v]) ? instance[v] : [instance[v]];
@@ -5848,6 +6092,7 @@
         parsers: parsers,
         providers: providers,
         modelFields: modelFields,
+        formulas: formulas,
         rules: vm.props.rule,
         name: vm.props.name || uniqueId(),
         inFor: vm.props.inFor,
@@ -5859,7 +6104,7 @@
         CreateNode: CreateNode,
         bus: new Mitt(),
         unwatch: null,
-        options: vue.ref(vm.props.option || {}),
+        options: vue.ref({}),
         extendApi: config.extendApi || function (api) {
           return api;
         }
@@ -5893,9 +6138,9 @@
 
         if (this.isSub()) {
           this.unwatch = vue.watch(function () {
-            return _this2.vm.parent.option;
+            return _this2.vm.setupState.parent.setupState.fc.options.value;
           }, function () {
-            _this2.initOptions(_this2.options.value);
+            _this2.initOptions();
 
             _this2.$handle.api.refresh();
           }, {
@@ -5903,23 +6148,28 @@
           });
         }
 
-        this.initOptions(this.options.value);
+        this.initOptions();
         this.$handle.init();
       },
       isSub: function isSub() {
         return this.vm.setupState.parent && this.vm.props.extendOption;
       },
-      initOptions: function initOptions(options) {
-        this.options.value = _objectSpread2({
+      initOptions: function initOptions() {
+        this.options.value = {};
+
+        var options = _objectSpread2({
           formData: {},
           submitBtn: {},
-          resetBtn: {}
+          resetBtn: {},
+          globalEvent: {},
+          globalData: {}
         }, deepCopy(globalConfig));
 
         if (this.isSub()) {
-          this.options.value = this.mergeOptions(this.options.value, this.vm.setupState.parent.setupState.fapi.config || {}, true);
+          options = this.mergeOptions(options, this.vm.setupState.parent.setupState.fc.options.value || {}, true);
         }
 
+        options = this.mergeOptions(options, this.vm.props.option);
         this.updateOptions(options);
       },
       mergeOptions: function mergeOptions(target, opt, parent) {
@@ -5981,6 +6231,7 @@
         component: component,
         directive: directive,
         setModelField: setModelField,
+        setFormula: setFormula,
         register: register,
         $vnode: $vnode,
         parser: parser,
@@ -6047,6 +6298,7 @@
       inherit.useApps && extend(useApps, inherit.useApps);
       inherit.maker && extend(maker, inherit.maker);
       inherit.loadData && extend(loadData, inherit.loadData);
+      inherit.formulas && extend(formulas, inherit.formulas);
     }
 
     return create;
@@ -6326,7 +6578,7 @@
       }
     },
     tidyOptions: function tidyOptions(options) {
-      ['submitBtn', 'resetBtn', 'row', 'info', 'wrap', 'col'].forEach(function (name) {
+      ['submitBtn', 'resetBtn', 'row', 'info', 'wrap', 'col', 'title'].forEach(function (name) {
         tidyBool(options, name);
       });
       return options;
@@ -6341,7 +6593,8 @@
       ctx.prop = mergeProps([{
         info: this.options.info || {},
         wrap: this.options.wrap || {},
-        col: this.options.col || {}
+        col: this.options.col || {},
+        title: this.options.title || {}
       }, ctx.prop], {
         info: {
           trigger: 'hover',
@@ -6369,7 +6622,7 @@
             e.preventDefault();
           }
         },
-        "class": [form.className, form["class"], 'form-create'],
+        "class": [form.className, form["class"], 'form-create', this.options.preview ? 'is-preview' : ''],
         style: form.style,
         type: 'form'
       };
@@ -6389,7 +6642,7 @@
     render: function render(children) {
       var _this2 = this;
 
-      if (children.slotLen()) {
+      if (children.slotLen() && !this.options.preview) {
         children.setSlot(undefined, function () {
           return _this2.makeFormBtn();
         });
@@ -6426,7 +6679,7 @@
         }
       }, isTitle ? {
         label: function label() {
-          return _this3.makeInfo(rule, uni);
+          return _this3.makeInfo(rule, uni, ctx);
         }
       } : {}));
       return inline === true || isFalse(_col) || isFalse(col.show) ? item : this.makeCol(rule, uni, [item]);
@@ -6436,7 +6689,7 @@
       var title = rule.title;
       return !(!title.title && !title["native"] || isFalse(title.show));
     },
-    makeInfo: function makeInfo(rule, uni) {
+    makeInfo: function makeInfo(rule, uni, ctx) {
       var _this4 = this;
 
       var titleProp = _objectSpread2({}, rule.title);
@@ -6445,7 +6698,12 @@
 
       var isTip = isTooltip(infoProp);
       var form = this.options.form;
-      var children = [(titleProp.title || '') + (form.labelSuffix || form['label-suffix'] || '')];
+      var titleSlot = this.getSlot('title');
+      var children = [titleSlot ? titleSlot({
+        title: titleProp.title || '',
+        rule: ctx.rule,
+        options: this.options
+      }) : (titleProp.title || '') + (form.labelSuffix || form['label-suffix'] || '')];
 
       if (!isFalse(infoProp.show) && (infoProp.info || infoProp["native"]) && !isFalse(infoProp.icon)) {
         var prop = {
@@ -6671,7 +6929,7 @@
     return maker;
   }
 
-  var css_248z = ".form-create .form-create .el-form-item{margin-bottom:22px}.form-create{width:100%}";
+  var css_248z = ".form-create .form-create .el-form-item{margin-bottom:22px}.form-create{width:100%}.form-create .fc-none,.form-create.is-preview .fc-clock{display:none!important}";
   styleInject(css_248z);
 
   function tidyBtnProp(btn, def) {
@@ -6924,7 +7182,7 @@
   function elmFormCreate() {
     return FormCreateFactory({
       ui: 'element-ui',
-      version: '3.1.27',
+      version: '3.1.29',
       manager: manager,
       extendApi: extendApi,
       install: install,