@form-create/element-ui 3.2.13 → 3.2.15

package/dist/form-create.js

@@ -1,5 +1,5 @@
 /*!
- * @form-create/element-ui v3.2.13
+ * @form-create/element-ui v3.2.15
  * (c) 2018-2024 xaboy
  * Github https://github.com/xaboy/form-create
  * Released under the MIT License.
@@ -226,12 +226,14 @@
         }
       },
       type: String,
+      options: Array,
       input: Boolean,
       inputValue: String
     },
     emits: ['update:modelValue', 'fc.el'],
     setup: function setup(props, _) {
       var options = vue.toRef(props.formCreateInject, 'options', []);
+      var opt = vue.toRef(props, 'options');
       var value = vue.toRef(props, 'modelValue');
       var inputValue = vue.toRef(props, 'inputValue', '');
       var customValue = vue.ref(inputValue.value);
@@ -262,9 +264,37 @@
         updateCustomValue(n);
       });
 
-      var _options = function _options() {
-        return Array.isArray(options.value) ? options.value : [];
-      };
+      var _options = vue.computed(function () {
+        var arr = options.value || [];
+
+        if (opt.value) {
+          arr = opt.value || [];
+        }
+
+        return Array.isArray(arr) ? arr : [];
+      });
+
+      vue.watch(value, function (n) {
+        var value = null;
+
+        if (!inputValue.value && n != null && Array.isArray(n) && n.length > 0 && input.value) {
+          var values = _options.value.map(function (item) {
+            return item.value;
+          });
+
+          n.forEach(function (val) {
+            if (values.indexOf(val) === -1) {
+              value = val;
+            }
+          });
+        }
+
+        if (value != null) {
+          customValue.value = value;
+        }
+      }, {
+        immediate: true
+      });
 
       var onInput = function onInput(n) {
         _.emit('update:modelValue', n);
@@ -308,7 +338,7 @@
         "ref": "el"
       }), _objectSpread2({
         "default": function _default() {
-          return [_this.options().map(function (opt, index) {
+          return [_this.options.map(function (opt, index) {
             var props = _objectSpread2({}, opt);
 
             var value = props.value;
@@ -1019,6 +1049,7 @@
         type: [String, Number, Boolean],
         "default": ''
       },
+      options: Array,
       type: String,
       input: Boolean,
       inputValue: String
@@ -1026,15 +1057,11 @@
     emits: ['update:modelValue', 'fc.el'],
     setup: function setup(props, _) {
       var options = vue.toRef(props.formCreateInject, 'options', []);
+      var opt = vue.toRef(props, 'options');
       var value = vue.toRef(props, 'modelValue');
       var inputValue = vue.toRef(props, 'inputValue', '');
       var customValue = vue.ref(inputValue.value);
       var input = vue.toRef(props, 'input', false);
-
-      var _options = function _options() {
-        return Array.isArray(options.value) ? options.value : [];
-      };
-
       vue.watch(inputValue, function (n) {
         if (!input.value) {
           customValue.value = n;
@@ -1044,6 +1071,32 @@
         updateCustomValue(n);
       });
 
+      var _options = vue.computed(function () {
+        var arr = options.value || [];
+
+        if (opt.value) {
+          arr = opt.value || [];
+        }
+
+        return Array.isArray(arr) ? arr : [];
+      });
+
+      vue.watch(value, function (n) {
+        var flag = false;
+
+        if (!inputValue.value && n != null && input.value) {
+          flag = _options.value.map(function (item) {
+            return item.value;
+          }).indexOf(n) === -1;
+        }
+
+        if (flag) {
+          customValue.value = n;
+        }
+      }, {
+        immediate: true
+      });
+
       var onInput = function onInput(n) {
         _.emit('update:modelValue', n);
       };
@@ -1097,7 +1150,7 @@
         "ref": "el"
       }), _objectSpread2({
         "default": function _default() {
-          return [_this.options().map(function (opt, index) {
+          return [_this.options.map(function (opt, index) {
             var props = _objectSpread2({}, opt);
 
             var value = props.value;
@@ -1365,7 +1418,7 @@
       onPreview: Function,
       modalTitle: String,
       listType: String,
-      modelValue: [Array, String]
+      modelValue: [Array, String, Object]
     },
     emits: ['update:modelValue', 'change', 'remove', 'fc.el'],
     data: function data() {
@@ -1441,7 +1494,7 @@
         "ref": "upload"
       }), _objectSpread2({
         "default": function _default() {
-          return [(_this$$slots$default = (_this$$slots = _this.$slots)["default"]) !== null && _this$$slots$default !== void 0 && _this$$slots$default.call(_this$$slots) || ['text', 'picture'].indexOf(_this.listType) === -1 ? vue.createVNode(vue.resolveComponent("ElIcon"), null, {
+          return [((_this$$slots$default = (_this$$slots = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)) || (['text', 'picture'].indexOf(_this.listType) === -1 ? vue.createVNode(vue.resolveComponent("ElIcon"), null, {
             "default": function _default() {
               return [vue.createVNode(script$1, null, null)];
             }
@@ -1451,7 +1504,7 @@
             "default": function _default() {
               return [vue.createTextVNode("\u70B9\u51FB\u4E0A\u4F20")];
             }
-          })];
+          }))];
         }
       }, getSlot(this.$slots, ['default']))), vue.createVNode(vue.resolveComponent("ElDialog"), {
         "appendToBody": true,
@@ -2150,6 +2203,7 @@
         },
         index: [String, Number],
         api: Object,
+        locale: [String, Object],
         name: String,
         subForm: {
           type: Boolean,
@@ -2393,7 +2447,7 @@
 
   var normalMerge = ['props'];
   var toArrayMerge = ['class', 'style', 'directives'];
-  var functionalMerge = ['on'];
+  var functionalMerge = ['on', 'hook'];
 
   var mergeProps = function mergeProps(objects) {
     var initial = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
@@ -2490,15 +2544,11 @@
 
   var PREFIX = '[[FORM-CREATE-PREFIX-';
   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(Array.isArray(obj) ? [] : {}, obj, true), function (key, val) {
       if (val && val._isVue === true) return undefined;
 
-      if (_typeof(val) !== FUNCTION) {
+      if (typeof val !== 'function') {
         return val;
       }
 
@@ -2525,11 +2575,14 @@
         if (v.indexOf(SUFFIX) > 0 && v.indexOf(PREFIX) === 0) {
           v = v.replace(SUFFIX, '').replace(PREFIX, '');
           flag = true;
-        } else if (v.indexOf($T) === 0) {
-          v = v.replace($T, '');
+        } else if (v.indexOf('$FN:') === 0) {
+          v = v.substring(4);
           flag = true;
-        } else if (v.indexOf($ON) === 0) {
-          var name = v.replace($ON, '');
+        } else if (v.indexOf('$EXEC:') === 0) {
+          v = v.substring(6);
+          flag = true;
+        } else if (v.indexOf('$GLOBAL:') === 0) {
+          var name = v.substring(8);
 
           v = function v() {
             for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -2548,17 +2601,26 @@
           v.__json = fn;
           v.__inject = true;
           return v;
-        } else if (v.indexOf($TX) === 0) {
-          v = makeFn('function($inject){' + v.replace($TX, '') + '}');
+        } else if (v.indexOf('$FNX:') === 0) {
+          v = makeFn('function($inject){' + v.substring(5) + '}');
           v.__json = fn;
           v.__inject = true;
           return v;
-        } else if (!mode && v.indexOf(FUNCTION) === 0 && v !== FUNCTION) {
+        } else if (!mode && v.indexOf('function ') === 0 && v !== 'function ') {
+          flag = true;
+        } else if (!mode && v.indexOf('function(') === 0 && v !== 'function(') {
           flag = true;
         }
 
         if (!flag) return fn;
-        var val = makeFn(v.indexOf(FUNCTION) === -1 && v.indexOf('(') !== 0 ? FUNCTION + ' ' + v : v);
+        var val;
+
+        try {
+          val = makeFn(v);
+        } catch (e) {
+          val = makeFn('function ' + v);
+        }
+
         val.__json = fn;
         return val;
       } catch (e) {
@@ -2924,7 +2986,17 @@
     }
 
     var xhr = new XMLHttpRequest();
-    var action = option.action;
+    var action = option.action || '';
+
+    if (option.query) {
+      var queryString = new URLSearchParams(option.query).toString();
+
+      if (action.includes('?')) {
+        action += "&".concat(queryString);
+      } else {
+        action += "?".concat(queryString);
+      }
+    }
 
     xhr.onerror = function error(e) {
       option.onError(e);
@@ -2965,7 +3037,7 @@
     });
     xhr.send(formData);
   }
-  function asyncFetch(config, _fetch) {
+  function asyncFetch(config, _fetch, api) {
     return new Promise(function (resolve, reject) {
       (_fetch || fetch$1)(_objectSpread2(_objectSpread2({}, config), {}, {
         onSuccess: function onSuccess(res) {
@@ -2983,7 +3055,7 @@
             };
           }
 
-          resolve(fn(res));
+          resolve(fn(res, undefined, api));
         },
         onError: function onError(err) {
           reject(err);
@@ -3588,7 +3660,7 @@
           opt = deepCopy(opt);
           opt = h.loadFetchVar(opt);
           h.beforeFetch(opt).then(function () {
-            return asyncFetch(opt, h.fc.create.fetch).then(function (res) {
+            return asyncFetch(opt, h.fc.create.fetch, api).then(function (res) {
               invoke(function () {
                 return opt.onSuccess && opt.onSuccess(res);
               });
@@ -3608,7 +3680,7 @@
 
           _opt = h.loadFetchVar(_opt, get);
           h.beforeFetch(_opt).then(function () {
-            return asyncFetch(_opt, h.fc.create.fetch).then(function (res) {
+            return asyncFetch(_opt, h.fc.create.fetch, api).then(function (res) {
               invoke(function () {
                 return _opt.onSuccess && _opt.onSuccess(res);
               });
@@ -3625,12 +3697,25 @@
       getData: function getData(id, def) {
         return h.fc.getLoadData(id, def);
       },
+      watchData: function watchData(fn) {
+        return h.fc.watchLoadData(function (get, change) {
+          invoke(function () {
+            return fn(get, change);
+          });
+        });
+      },
       setData: function setData(id, data, isGlobal) {
         return h.fc.setData(id, data, isGlobal);
       },
       refreshData: function refreshData(id) {
         return h.fc.refreshData(id);
       },
+      t: function t(id, params) {
+        return h.fc.t(id, params);
+      },
+      getLocale: function getLocale() {
+        return h.fc.getLocale();
+      },
       helper: {
         tidyFields: tidyFields,
         props: props
@@ -3961,15 +4046,19 @@
       },
       none: function none(vn) {
         if (vn) {
-          if (Array.isArray(vn.props["class"])) {
-            vn.props["class"].push('fc-none');
-          } else {
-            vn.props["class"] = vn.props["class"] ? [vn.props["class"], 'fc-none'] : 'fc-none';
-          }
-
+          vn.props["class"] = this.mergeClass(vn.props["class"], 'fc-none');
           return vn;
         }
       },
+      mergeClass: function mergeClass(target, value) {
+        if (Array.isArray(target)) {
+          target.push(value);
+        } else {
+          return target ? [target, value] : value;
+        }
+
+        return target;
+      },
       stable: function stable(vn) {
         var _this5 = this;
 
@@ -4069,6 +4158,7 @@
             callback: function callback(value) {
               _this7.onInput(ctx, value);
             },
+            modelField: field,
             value: this.$handle.getFormData(ctx)
           };
           props.push({
@@ -4087,6 +4177,7 @@
         ctx.el = this.vm.refs[ctx.ref] || el;
         ctx.parser.mounted(ctx);
         this.$handle.effect(ctx, 'mounted');
+        this.$handle.targetHook(ctx, 'mounted');
       },
       onInput: function onInput(ctx, value) {
         if (ctx.prop.modelEmit) {
@@ -4293,7 +4384,7 @@
       },
       getInjectData: function getInjectData(self, inject) {
         var $api = self.__fc__ && self.__fc__.$api;
-        var vm = self.__fc__ && self.__fc__.$handle.vm || this.vm.props;
+        var vm = self.__fc__ && self.__fc__.$handle.vm || this.vm;
         var _vm$props = vm.props,
             option = _vm$props.option,
             rule = _vm$props.rule;
@@ -4469,6 +4560,12 @@
     Object.defineProperties(ctx.origin, {
       __fc__: enumerable(vue.markRaw(ctx), true)
     });
+
+    if (ctx.rule !== ctx.origin) {
+      Object.defineProperties(ctx.rule, {
+        __fc__: enumerable(vue.markRaw(ctx), true)
+      });
+    }
   }
 
   function RuleContext(handle, rule, defaultValue) {
@@ -4648,43 +4745,17 @@
       var rule = _objectSpread2({}, this.rule);
 
       delete rule.children;
+      delete rule.validate;
       this.prop = mergeRule({}, [rule].concat(_toConsumableArray(Object.keys(this.payload).map(function (k) {
         return _this3.payload[k];
       })), [this.computed]));
+      this.prop.validate = [].concat(_toConsumableArray(this.refRule.__$validate.value || []), _toConsumableArray(this.prop.validate || []));
     },
     initNone: function initNone() {
       this.none = !(is.Undef(this.prop.display) || !!this.prop.display);
     },
     injectValidate: function injectValidate() {
-      var _this4 = this;
-
-      return toArray(this.prop.validate).map(function (item) {
-        if (is.Function(item.validator)) {
-          var temp = _objectSpread2({}, item);
-
-          var that = _this4;
-
-          temp.validator = function () {
-            var _item$validator;
-
-            for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-              args[_key] = arguments[_key];
-            }
-
-            return (_item$validator = item.validator).call.apply(_item$validator, [{
-              that: this,
-              id: that.id,
-              field: that.field,
-              rule: that.rule,
-              api: that.$handle.api
-            }].concat(args));
-          };
-
-          return temp;
-        }
-
-        return item;
-      });
+      return this.prop.validate;
     },
     check: function check(handle) {
       return this.vm === handle.vm;
@@ -4734,15 +4805,15 @@
       this.ctrlRule = [];
     },
     rm: function rm() {
-      var _this5 = this;
+      var _this4 = this;
 
       var _rm = function _rm() {
-        var index = _this5.root.indexOf(_this5.origin);
+        var index = _this4.root.indexOf(_this4.origin);
 
         if (index > -1) {
-          _this5.root.splice(index, 1);
+          _this4.root.splice(index, 1);
 
-          _this5.$handle && _this5.$handle.refresh();
+          _this4.$handle && _this4.$handle.refresh();
         }
       };
 
@@ -4753,17 +4824,17 @@
       }
 
       this.$handle.noWatch(function () {
-        _this5.$handle.deferSyncValue(function () {
-          _this5.rmCtrl();
+        _this4.$handle.deferSyncValue(function () {
+          _this4.rmCtrl();
 
           _rm();
 
-          _this5.$handle.rmCtx(_this5);
+          _this4.$handle.rmCtx(_this4);
 
-          extend(_this5, {
+          extend(_this4, {
             root: []
           });
-        }, _this5.input);
+        }, _this4.input);
       });
     },
     update: function update(handle, init) {
@@ -5001,7 +5072,11 @@
 
           _this6.setCtx(ctx);
 
-          !isCopy && !isInit && _this6.effect(ctx, 'load');
+          if (!isCopy && !isInit) {
+            _this6.effect(ctx, 'load');
+
+            _this6.targetHook(ctx, 'load');
+          }
 
           _this6.effect(ctx, 'created');
 
@@ -5253,6 +5328,9 @@
         this.valueChange(ctx, value);
         this.vm.emit('change', ctx.field, value, ctx.origin, this.api, setFlag || false);
         this.effect(ctx, 'value');
+        this.targetHook(ctx, 'value', {
+          value: value
+        });
         this.emitEvent('change', ctx.field, value, {
           rule: ctx.origin,
           api: this.api,
@@ -5598,9 +5676,22 @@
             }
 
             _this.watching = true;
+            vue.nextTick(function () {
+              _this.targetHook(ctx, 'watch', {
+                key: key,
+                oldValue: o,
+                newValue: n
+              });
+            });
 
             if (key === 'hidden' && Boolean(n) !== Boolean(o)) {
               _this.$render.clearCacheAll();
+
+              vue.nextTick(function () {
+                _this.targetHook(ctx, 'hidden', {
+                  value: n
+                });
+              });
             }
 
             if (key === 'ignore' && ctx.input || key === 'hidden' && ctx.input && (ctx.rule.ignore === 'hidden' || _this.options.ignoreHiddenFields)) {
@@ -5642,6 +5733,71 @@
             sync: flag
           }));
         });
+        ctx.refRule['__$title'] = vue.computed(function () {
+          var title = (_typeof(ctx.rule.title) === 'object' ? ctx.rule.title.title : ctx.rule.title) || '';
+
+          if (title) {
+            var match = title.match(/^\{\{\s*\$t\.(.+)\s*\}\}$/);
+
+            if (match) {
+              title = _this.api.t(match[1]);
+            }
+          }
+
+          return title;
+        });
+        ctx.refRule['__$info'] = vue.computed(function () {
+          var info = (_typeof(ctx.rule.info) === 'object' ? ctx.rule.info.info : ctx.rule.info) || '';
+
+          if (info) {
+            var match = info.match(/^\{\{\s*\$t\.(.+)\s*\}\}$/);
+
+            if (match) {
+              info = _this.api.t(match[1]);
+            }
+          }
+
+          return info;
+        });
+        ctx.refRule['__$validate'] = vue.computed(function () {
+          return toArray(ctx.rule.validate).map(function (item) {
+            var temp = _objectSpread2({}, item);
+
+            if (temp.message) {
+              var match = temp.message.match(/^\{\{\s*\$t\.(.+)\s*\}\}$/);
+
+              if (match) {
+                temp.message = _this.api.t(match[1], {
+                  title: ctx.refRule.__$title.value
+                });
+              }
+            }
+
+            if (is.Function(temp.validator)) {
+              var that = ctx;
+
+              temp.validator = function () {
+                var _item$validator;
+
+                for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+                  args[_key] = arguments[_key];
+                }
+
+                return (_item$validator = item.validator).call.apply(_item$validator, [{
+                  that: this,
+                  id: that.id,
+                  field: that.field,
+                  rule: that.rule,
+                  api: that.$handle.api
+                }].concat(args));
+              };
+
+              return temp;
+            }
+
+            return temp;
+          });
+        });
 
         if (ctx.input) {
           var val = vue.toRef(ctx.rule, 'value');
@@ -5729,25 +5885,42 @@
             var or = item.mode === 'OR';
             var valid = true;
 
-            for (var i = 0; i < item.group.length; i++) {
+            var _loop = function _loop(i) {
               var one = item.group[i];
               var flag = void 0;
+              var field = one.field;
+
+              if (one.variable) {
+                field = JSON.stringify(_this2.fc.getLoadData(one.variable) || '');
+              }
 
               if (one.mode) {
                 flag = checkCondition(one);
               } else if (!condition[one.condition]) {
                 flag = false;
+              } else if (is.Function(one.handler)) {
+                flag = invoke(function () {
+                  return one.handler(_this2.api, ctx.rule);
+                });
               } else {
-                flag = new Function('$condition', '$val', '$form', '$group', "with($form){with(this){with($group){ return $condition['".concat(one.condition, "'](").concat(one.field, ", ").concat(one.compare ? one.compare : '$val', "); }}}")).call(_this2.api.form, condition, one.value, _this2.api.top.form, group ? _this2.subRuleData[group.id] || {} : {});
+                flag = new Function('$condition', '$val', '$form', '$group', '$rule', "with($form){with(this){with($group){ return $condition['".concat(one.condition, "'](").concat(field, ", ").concat(one.compare ? one.compare : '$val', "); }}}")).call(_this2.api.form, condition, one.value, _this2.api.top.form, group ? _this2.subRuleData[group.id] || {} : {}, ctx.rule);
               }
 
               if (or && flag) {
-                return true;
+                return {
+                  v: true
+                };
               }
 
               if (!or) {
                 valid = valid && flag;
               }
+            };
+
+            for (var i = 0; i < item.group.length; i++) {
+              var _ret = _loop(i);
+
+              if (_typeof(_ret) === "object") return _ret.v;
             }
 
             return or ? false : valid;
@@ -5783,8 +5956,8 @@
           obj[k] = function () {
             var _that$fc$formulas$k;
 
-            for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-              args[_key] = arguments[_key];
+            for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+              args[_key2] = arguments[_key2];
             }
 
             return (_that$fc$formulas$k = that.fc.formulas[k]).call.apply(_that$fc$formulas$k, [{
@@ -5878,6 +6051,7 @@
         this.$render.clearCache(ctx);
         ctx["delete"]();
         this.effect(ctx, 'deleted');
+        this.targetHook(ctx, 'deleted');
         input && !this.fieldCtx[field] && this.vm.emit('remove-field', field, ctx.rule, this.api);
         ctx.rule.__ctrl || this.vm.emit('remove-rule', ctx.rule, this.api);
         return ctx;
@@ -5924,6 +6098,25 @@
         }
 
         (_this$bus = this.bus).$emit.apply(_this$bus, [name].concat(args));
+      },
+      targetHook: function targetHook(ctx, name, args) {
+        var _ctx$prop,
+            _ctx$prop$hook,
+            _this2 = this;
+
+        var hook = (_ctx$prop = ctx.prop) === null || _ctx$prop === void 0 ? void 0 : (_ctx$prop$hook = _ctx$prop.hook) === null || _ctx$prop$hook === void 0 ? void 0 : _ctx$prop$hook[name];
+
+        if (hook) {
+          hook = Array.isArray(hook) ? hook : [hook];
+          hook.forEach(function (fn) {
+            invoke(function () {
+              return fn(_objectSpread2(_objectSpread2({}, args || {}), {}, {
+                rule: ctx.rule,
+                api: _this2.api
+              }));
+            });
+          });
+        }
       }
     });
   }
@@ -6391,7 +6584,7 @@
         var unwatchs = [];
         attrs.forEach(function (attr) {
           if (attr && (attr.attr || attr.template)) {
-            var unwatch = fc.watchLoadData(debounce(function (get) {
+            var fn = function fn(get) {
               var value;
 
               if (attr.template) {
@@ -6417,7 +6610,14 @@
               }
 
               api.sync(rule);
-            }, attr.wait || 300));
+            };
+
+            var callback = function callback(get) {
+              return fn(get);
+            };
+
+            var unwatch = fc.watchLoadData(callback);
+            fn = debounce(fn, attr.wait || 300);
 
             if (attr.watch !== false) {
               unwatchs.push(unwatch);
@@ -6433,15 +6633,81 @@
           this._fn[inject.id].forEach(function (un) {
             un();
           });
+
+          delete this._fn[inject.id];
         }
 
         inject.clearProp();
       }
     };
-    loadData.watch = loadData.created;
+    loadData.watch = loadData.mounted;
     return loadData;
   };
 
+  var t = function t(fc) {
+    var t = {
+      name: 't',
+      _fn: [],
+      loaded: function loaded(inject, rule, api) {
+        this.deleted(inject);
+        var attrs = inject.getValue() || {};
+        var unwatchs = [];
+        Object.keys(attrs).forEach(function (key) {
+          var attr = attrs[key];
+
+          if (attr) {
+            var isObj = _typeof(attr) === 'object';
+
+            var fn = function fn(get) {
+              var value = fc.t(isObj ? attr.attr : attr, isObj ? attr.params : null, get);
+
+              var _rule = isObj && attr.modify ? rule : inject.getProp();
+
+              if (key === 'child') {
+                if (_rule.children) {
+                  _rule.children[0] = value;
+                } else {
+                  _rule.children = [value];
+                }
+              } else {
+                deepSet(_rule, key, value);
+              }
+
+              api.sync(rule);
+            };
+
+            var callback = function callback(get) {
+              return fn(get);
+            };
+
+            var unwatch = fc.watchLoadData(callback);
+            fn = debounce(fn, attr.wait || 300);
+
+            if (attr.watch !== false) {
+              unwatchs.push(unwatch);
+            } else {
+              unwatch();
+            }
+          }
+        });
+        this._fn[inject.id] = unwatchs;
+      },
+      deleted: function deleted(inject) {
+        if (this._fn[inject.id]) {
+          this._fn[inject.id].forEach(function (un) {
+            un();
+          });
+
+          delete this._fn[inject.id];
+        }
+
+        inject.clearProp();
+      }
+    };
+    t.watch = t.loaded;
+    return t;
+  };
+
   var componentValidate = {
     name: 'componentValidate',
     load: function load(attr, rule, api) {
@@ -6512,6 +6778,13 @@
           deepSet(inject.getProp(), option.to || 'options', val);
         }
 
+        if (val != null && option && option.key && fc.$handle.options.globalData[option.key]) {
+          fc.fetchCache.set(fc.$handle.options.globalData[option.key], {
+            status: true,
+            data: val
+          });
+        }
+
         api.sync(rule);
       };
 
@@ -6629,6 +6902,8 @@
       deleted: function deleted(inject) {
         if (this._fn[inject.id]) {
           this._fn[inject.id]();
+
+          delete this._fn[inject.id];
         }
 
         inject.clearProp();
@@ -6640,6 +6915,7 @@
   var $provider = {
     fetch: fetch,
     loadData: loadData,
+    t: t,
     componentValidate: componentValidate
   };
 
@@ -7042,7 +7318,7 @@
         options: vue.ref({}),
         extendApiFn: extendApiFn,
         fetchCache: new WeakMap(),
-        tmpData: {}
+        tmpData: vue.reactive({})
       });
       listener.forEach(function (item) {
         _this.bus.$on(item.name, item.callback);
@@ -7117,6 +7393,26 @@
           });
         }
       },
+      t: function t(id, params, get) {
+        var value = get ? get('$t.' + id) : this.globalLanguageDriver(id);
+
+        if (value == null && this.vm.appContext.config.globalProperties.$i18n) {
+          return this.vm.appContext.config.globalProperties.$i18n.t(id, params);
+        }
+
+        if (value == null) {
+          value = '';
+        }
+
+        if (value && params) {
+          Object.keys(params).forEach(function (param) {
+            var regex = new RegExp("{".concat(param, "}"), 'g');
+            value = value.replace(regex, params[param]);
+          });
+        }
+
+        return value;
+      },
       globalDataDriver: function globalDataDriver(id) {
         var _this4 = this;
 
@@ -7200,6 +7496,41 @@
           }
         }
       },
+      getLocale: function getLocale() {
+        var locale = this.vm.setupState.top.props.locale;
+
+        if (locale && _typeof(locale) === 'object') {
+          return locale.name;
+        }
+
+        if (typeof locale === 'string') {
+          return locale;
+        }
+
+        if (this.vm.appContext.config.globalProperties.$i18n && this.vm.appContext.config.globalProperties.$i18n.locale) {
+          return this.vm.appContext.config.globalProperties.$i18n.locale;
+        }
+
+        return 'zh-cn';
+      },
+      globalLanguageDriver: function globalLanguageDriver(id) {
+        var locale = this.vm.setupState.top.props.locale;
+        var value = undefined;
+
+        if (locale && _typeof(locale) === 'object') {
+          value = deepGet(locale, id);
+        }
+
+        if (value == null) {
+          var language = this.options.value.language || {};
+
+          var _locale = this.getLocale();
+
+          value = deepGet(language[_locale], id);
+        }
+
+        return value;
+      },
       globalVarDriver: function globalVarDriver(id) {
         var _this5 = this;
 
@@ -7257,6 +7588,12 @@
           } else if (key === '$var') {
             val = this.globalVarDriver(split.join('.'));
             split = [];
+          } else if (key === '$locale') {
+            val = this.getLocale();
+            split = [];
+          } else if (key === '$t') {
+            val = this.globalLanguageDriver(split.join('.'));
+            split = [];
           } else {
             var tmpData = this.vm.setupState.top.setupState.fc.tmpData;
             val = hasProperty(tmpData, key) ? deepGet(tmpData, id) : getData(id);
@@ -7286,8 +7623,9 @@
             return unwatch[id].val;
           }
 
-          var val = _this6.getLoadData(id, def);
-
+          var data = vue.computed(function () {
+            return _this6.getLoadData(id, def);
+          });
           var split = id.split('.');
           var key = split.shift();
           var key2 = split.shift() || '';
@@ -7301,6 +7639,9 @@
               run(true);
             }
           }, 0);
+          var un = vue.watch(data, function (n) {
+            callback();
+          });
 
           _this6.bus.$on('$loadData.' + key, callback);
 
@@ -7315,10 +7656,12 @@
               if (key2) {
                 _this6.bus.$off('$loadData.' + key + '.' + key2, callback);
               }
+
+              un();
             },
-            val: val
+            val: data.value
           };
-          return val;
+          return data.value;
         };
 
         run(false);
@@ -7356,7 +7699,7 @@
       },
       mergeOptions: function mergeOptions(target, opt, parent) {
         opt = deepCopy(opt);
-        parent && ['page', 'onSubmit', 'mounted', 'reload', 'formData', 'el', 'globalClass', 'style'].forEach(function (n) {
+        parent && ['page', 'onSubmit', 'onReset', 'onCreated', 'onChange', 'onMounted', 'mounted', 'onReload', 'reload', 'formData', 'el', 'globalClass', 'style'].forEach(function (n) {
           delete opt[n];
         });
 
@@ -7690,6 +8033,7 @@
     autoComplete: PRE + '-autocomplete',
     auto: PRE + '-autocomplete',
     group: 'fc-group',
+    array: 'fc-group',
     object: 'fc-sub-form',
     subForm: 'fc-sub-form'
   };
@@ -7808,12 +8152,9 @@
       return prop;
     },
     mergeProp: function mergeProp(ctx) {
-      ctx.prop = mergeProps([{
-        info: this.options.info || {},
-        wrap: this.options.wrap || {},
-        col: this.options.col || {},
-        title: this.options.title || {}
-      }, ctx.prop], {
+      var _this2 = this;
+
+      var def = {
         info: {
           trigger: 'hover',
           placement: 'top-start',
@@ -7824,8 +8165,9 @@
           span: 24
         },
         wrap: {}
-      }, {
-        normal: ['title', 'info', 'col', 'wrap']
+      };
+      ['info', 'wrap', 'col', 'title'].forEach(function (name) {
+        ctx.prop[name] = mergeProps([_this2.options[name] || {}, ctx.prop[name] || {}], def[name]);
       });
     },
     getDefaultOptions: function getDefaultOptions() {
@@ -7858,18 +8200,18 @@
       });
     },
     render: function render(children) {
-      var _this2 = this;
+      var _this3 = this;
 
       if (children.slotLen() && !this.$handle.preview) {
         children.setSlot(undefined, function () {
-          return _this2.makeFormBtn();
+          return _this3.makeFormBtn();
         });
       }
 
       return this.$r(this.rule, isFalse(this.options.row.show) ? children.getSlots() : [this.makeRow(children)]);
     },
     makeWrap: function makeWrap(ctx, children) {
-      var _this3 = this;
+      var _this4 = this;
 
       var rule = ctx.prop;
       var uni = "".concat(this.key).concat(ctx.key);
@@ -7888,7 +8230,7 @@
           prop: ctx.id,
           rules: ctx.injectValidate()
         }),
-        "class": rule.className,
+        "class": this.$render.mergeClass(rule.className, 'fc-form-item'),
         key: "".concat(uni, "fi"),
         ref: ctx.wrapRef,
         type: 'formItem'
@@ -7898,7 +8240,7 @@
         }
       }, isTitle ? {
         label: function label() {
-          return _this3.makeInfo(rule, uni, ctx);
+          return _this4.makeInfo(rule, uni, ctx);
         }
       } : {}));
       return inline === true || isFalse(_col) || isFalse(col.show) ? item : this.makeCol(rule, uni, [item]);
@@ -7909,7 +8251,7 @@
       return !(!title.title && !title["native"] || isFalse(title.show));
     },
     makeInfo: function makeInfo(rule, uni, ctx) {
-      var _this4 = this;
+      var _this5 = this;
 
       var titleProp = _objectSpread2({}, rule.title);
 
@@ -7919,10 +8261,10 @@
       var form = this.options.form;
       var titleSlot = this.getSlot('title');
       var children = [titleSlot ? titleSlot({
-        title: titleProp.title || '',
+        title: ctx.refRule.__$title.value,
         rule: ctx.rule,
         options: this.options
-      }) : (titleProp.title || '') + (form.labelSuffix || form['label-suffix'] || '')];
+      }) : ctx.refRule.__$title.value + (form.labelSuffix || form['label-suffix'] || '')];
 
       if (!isFalse(infoProp.show) && (infoProp.info || infoProp["native"]) && !isFalse(infoProp.icon)) {
         var prop = {
@@ -7938,17 +8280,17 @@
         var field = 'content';
 
         if (infoProp.info && !hasProperty(prop.props, field)) {
-          prop.props[field] = infoProp.info;
+          prop.props[field] = ctx.refRule.__$info.value;
         }
 
         children[infoProp.align !== 'left' ? 'unshift' : 'push'](this.$r(mergeProps([infoProp, prop]), _defineProperty({}, titleProp.slot || (isTip ? 'default' : 'reference'), function () {
-          return _this4.$r({
+          return _this5.$r({
             type: 'ElIcon',
             style: 'top:2px',
             key: "".concat(uni, "i")
           }, {
             "default": function _default() {
-              return _this4.$r({
+              return _this5.$r({
                 type: infoProp.icon === true ? 'icon-warning' : infoProp.icon
               });
             }
@@ -7959,6 +8301,7 @@
       var _prop = mergeProps([titleProp, {
         props: tidyRule(titleProp),
         key: "".concat(uni, "tit"),
+        "class": 'fc-form-title',
         type: titleProp.type || 'span'
       }]);
 
@@ -7970,7 +8313,7 @@
     makeCol: function makeCol(rule, uni, children) {
       var col = rule.col;
       return this.$r({
-        "class": col["class"],
+        "class": this.$render.mergeClass(col["class"], 'fc-form-col'),
         type: 'col',
         props: col || {
           span: 24
@@ -7983,7 +8326,7 @@
       return this.$r({
         type: 'row',
         props: row,
-        "class": row["class"],
+        "class": this.$render.mergeClass(row["class"], 'fc-form-row'),
         key: "".concat(this.key, "row")
       }, children);
     },
@@ -8004,10 +8347,12 @@
 
       var item = this.$r({
         type: 'formItem',
+        "class": 'fc-form-item',
         key: "".concat(this.key, "fb")
       }, vn);
       return this.rule.props.inline === true ? item : this.$r({
         type: 'col',
+        "class": 'fc-form-col fc-form-footer',
         props: {
           span: 24
         },
@@ -8015,7 +8360,7 @@
       }, [item]);
     },
     makeResetBtn: function makeResetBtn() {
-      var _this5 = this;
+      var _this6 = this;
 
       var resetBtn = _objectSpread2({}, this.options.resetBtn);
 
@@ -8027,21 +8372,21 @@
       return this.$r({
         type: 'button',
         props: resetBtn,
-        "class": '_fc-reset-btn',
+        "class": 'fc-reset-btn',
         style: {
           width: resetBtn.width
         },
         on: {
           click: function click() {
-            var fApi = _this5.$handle.api;
-            _this5.options.resetBtn.click ? _this5.options.resetBtn.click(fApi) : fApi.resetFields();
+            var fApi = _this6.$handle.api;
+            _this6.options.resetBtn.click ? _this6.options.resetBtn.click(fApi) : fApi.resetFields();
           }
         },
         key: "".concat(this.key, "b2")
       }, [innerText]);
     },
     makeSubmitBtn: function makeSubmitBtn() {
-      var _this6 = this;
+      var _this7 = this;
 
       var submitBtn = _objectSpread2({}, this.options.submitBtn);
 
@@ -8053,14 +8398,14 @@
       return this.$r({
         type: 'button',
         props: submitBtn,
-        "class": '_fc-submit-btn',
+        "class": 'fc-submit-btn',
         style: {
           width: submitBtn.width
         },
         on: {
           click: function click() {
-            var fApi = _this6.$handle.api;
-            _this6.options.submitBtn.click ? _this6.options.submitBtn.click(fApi) : fApi.submit()["catch"](function () {});
+            var fApi = _this7.$handle.api;
+            _this7.options.submitBtn.click ? _this7.options.submitBtn.click(fApi) : fApi.submit()["catch"](function () {});
           }
         },
         key: "".concat(this.key, "b1")
@@ -8150,7 +8495,7 @@
     return maker;
   }
 
-  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 .el-form-item.is-required>.el-form-item__label-wrap>.el-form-item__label:before,.form-create.is-preview .el-form-item.is-required>.el-form-item__label:before,.form-create.is-preview .fc-clock{display:none!important}.fc-wrap-right .el-form-item__label{justify-content:flex-end}.fc-wrap-left .el-form-item__label{justify-content:flex-start}.fc-wrap-top.el-form-item{display:block}.fc-wrap-top.el-form-item .el-form-item__label{display:block;height:auto;line-height:22px;margin-bottom:8px;text-align:left}.el-form--large .fc-wrap-top.el-form-item .el-form-item__label{line-height:22px;margin-bottom:12px}.el-form--default .fc-wrap-top.el-form-item .el-form-item__label{line-height:22px;margin-bottom:8px}.el-form--small .fc-wrap-top.el-form-item .el-form-item__label{line-height:20px;margin-bottom:4px}";
+  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 .el-form-item.is-required>.el-form-item__label-wrap>.el-form-item__label:before,.form-create.is-preview .el-form-item.is-required>.el-form-item__label:before,.form-create.is-preview .fc-clock{display:none!important}.fc-wrap-right>.el-form-item__label{display:flex;justify-content:flex-end}.fc-wrap-left>.el-form-item__label{display:flex;justify-content:flex-start}.fc-wrap-top.el-form-item{display:block}.fc-wrap-top.el-form-item>.el-form-item__label{display:block;height:auto;line-height:22px;margin-bottom:8px;text-align:left}.el-form--large .fc-wrap-top.el-form-item>.el-form-item__label{line-height:22px;margin-bottom:12px}.el-form--default .fc-wrap-top.el-form-item>.el-form-item__label{line-height:22px;margin-bottom:8px}.el-form--small .fc-wrap-top.el-form-item>.el-form-item__label{line-height:20px;margin-bottom:4px}.fc-form-footer{margin-top:12px}";
   styleInject(css_248z);
 
   function tidyBtnProp(btn, def) {
@@ -8342,8 +8687,15 @@
         }, val);
 
         if (!validate.message) {
-          var title = rule.title || '';
-          validate.message = ((_typeof(title) === 'object' ? title.title : title) || '') + '不能为空';
+          validate.message = rule.__fc__.refRule.__$title.value + (api.getLocale() === 'en' ? ' is required' : '不能为空');
+        } else {
+          var match = validate.message.match(/^\{\{\s*\$t\.(.+)\s*\}\}$/);
+
+          if (match) {
+            validate.message = api.t(match[1], {
+              title: rule.__fc__.refRule.__$title.value
+            });
+          }
         }
 
         inject.getProp().validate = [validate];
@@ -8403,7 +8755,7 @@
   function elmFormCreate() {
     return FormCreateFactory({
       ui: 'element-ui',
-      version: '3.2.13',
+      version: '3.2.15',
       manager: manager,
       extendApi: extendApi,
       install: install,