@form-create/element-ui 3.1.3 → 3.1.4

package/dist/form-create.esm.js

@@ -1,5 +1,5 @@
 /*!
- * @form-create/element-ui v3.1.3
+ * @form-create/element-ui v3.1.4
  * (c) 2018-2022 xaboy
  * Github https://github.com/xaboy/form-create
  * Released under the MIT License.
@@ -1532,8 +1532,6 @@ var Group = defineComponent({
             for (var _i2 = 0; _i2 < len; _i2++) {
               this.removeRule(keys[total - _i2 - 1]);
             }
-
-            this.subForm();
           }
 
           n.forEach(function (val, i) {
@@ -1541,8 +1539,7 @@ var Group = defineComponent({
           });
         }
       },
-      deep: true,
-      flush: 'post'
+      deep: true
     }
   },
   methods: {
@@ -1621,7 +1618,6 @@ var Group = defineComponent({
       var _this4 = this;
 
       this.cacheRule[key].$f = $f;
-      this.subForm();
       this.formData(key, $f.formData());
       nextTick(function () {
         if (_this4.syncDisabled) {
@@ -1631,15 +1627,8 @@ var Group = defineComponent({
         _this4.$emit('itemMounted', $f, Object.keys(_this4.cacheRule).indexOf(key));
       });
     },
-    subForm: function subForm() {
-      var _this5 = this;
-
-      this.formCreateInject.subForm(Object.keys(this.cacheRule).map(function (k) {
-        return _this5.cacheRule[k].$f;
-      }));
-    },
     removeRule: function removeRule(key, emit) {
-      var _this6 = this;
+      var _this5 = this;
 
       var index = Object.keys(this.cacheRule).indexOf(key);
       delete this.cacheRule[key];
@@ -1647,7 +1636,7 @@ var Group = defineComponent({
 
       if (emit) {
         nextTick(function () {
-          return _this6.$emit('remove', index);
+          return _this5.$emit('remove', index);
         });
       }
     },
@@ -1665,7 +1654,6 @@ var Group = defineComponent({
       }
 
       this.removeRule(key, true);
-      this.subForm();
       this.modelValue.splice(index, 1);
       this.input(this.modelValue);
     },
@@ -1681,14 +1669,14 @@ var Group = defineComponent({
       });
     },
     delIcon: function delIcon(index, key) {
-      var _this7 = this;
+      var _this6 = this;
 
       return createVNode(resolveComponent("ElIcon"), {
         "key": "d".concat(key),
         "class": "el-icon-remove-outline",
         "style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#606266', ";"),
         "onClick": function onClick() {
-          return _this7.del(index, key);
+          return _this6.del(index, key);
         }
       }, {
         "default": function _default() {
@@ -1697,7 +1685,7 @@ var Group = defineComponent({
       });
     },
     makeIcon: function makeIcon(total, index, key) {
-      var _this8 = this;
+      var _this7 = this;
 
       if (this.$slots.button) {
         return this.$slots.button({
@@ -1706,7 +1694,7 @@ var Group = defineComponent({
           vm: this,
           key: key,
           del: function del() {
-            return _this8.del(index, key);
+            return _this7.del(index, key);
           },
           add: this.add
         });
@@ -1741,7 +1729,7 @@ var Group = defineComponent({
     }
   },
   render: function render() {
-    var _this9 = this;
+    var _this8 = this;
 
     var keys = Object.keys(this.cacheRule);
     var button = this.button;
@@ -1762,9 +1750,9 @@ var Group = defineComponent({
     }, [keys.map(function (key, index) {
       var _slot;
 
-      var _this9$cacheRule$key = _this9.cacheRule[key],
-          rule = _this9$cacheRule$key.rule,
-          options = _this9$cacheRule$key.options;
+      var _this8$cacheRule$key = _this8.cacheRule[key],
+          rule = _this8$cacheRule$key.rule,
+          options = _this8$cacheRule$key.options;
       return createVNode(resolveComponent("ElRow"), {
         "align": "middle",
         "type": "flex",
@@ -1780,19 +1768,20 @@ var Group = defineComponent({
                 "default": function _default() {
                   return [createVNode(Type, {
                     "key": key,
+                    "inFor": true,
                     "onUpdate:modelValue": function onUpdateModelValue(formData) {
-                      return _this9.formData(key, formData);
+                      return _this8.formData(key, formData);
                     },
-                    "modelValue": _this9.field ? _defineProperty({}, _this9.field, _this9._value(_this9.modelValue[index])) : _this9.modelValue[index],
+                    "modelValue": _this8.field ? _defineProperty({}, _this8.field, _this8._value(_this8.modelValue[index])) : _this8.modelValue[index],
                     "onEmit-event": function onEmitEvent(name) {
                       for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
                         args[_key - 1] = arguments[_key];
                       }
 
-                      return _this9.emitEvent(name, args, index, key);
+                      return _this8.emitEvent(name, args, index, key);
                     },
                     "onUpdate:api": function onUpdateApi($f) {
-                      return _this9.add$f(index, key, $f);
+                      return _this8.add$f(index, key, $f);
                     },
                     "rule": rule,
                     "option": options,
@@ -1805,7 +1794,7 @@ var Group = defineComponent({
             "span": 2,
             "pull": 1,
             "push": 1
-          }, _isSlot(_slot = _this9.makeIcon(keys.length, index, key)) ? _slot : {
+          }, _isSlot(_slot = _this8.makeIcon(keys.length, index, key)) ? _slot : {
             "default": function _default() {
               return [_slot];
             }
@@ -1882,7 +1871,6 @@ var Sub = defineComponent({
       var _this = this;
 
       this.subApi = api;
-      this.formCreateInject.subForm(api);
       nextTick(function () {
         _this.syncDisabled && api.disabled(_this.disabled);
 
@@ -1929,6 +1917,21 @@ script.render = render;
 var components = [Checkbox, Frame, Radio, Select, Tree, Upload, Group, Sub, script];
 
 var NAME$1 = 'FormCreate';
+
+var getRuleInject = function getRuleInject(vm, parent) {
+  if (vm === parent) {
+    return;
+  }
+
+  if (vm.ctx.formCreateInject) {
+    return vm.ctx.formCreateInject;
+  }
+
+  if (vm.parent) {
+    return getRuleInject(vm.parent, parent);
+  }
+};
+
 function $FormCreate(FormCreate) {
   return defineComponent({
     name: NAME$1,
@@ -1949,7 +1952,12 @@ function $FormCreate(FormCreate) {
       extendOption: Boolean,
       modelValue: Object,
       api: Object,
-      name: String
+      name: String,
+      subForm: {
+        type: Boolean,
+        "default": true
+      },
+      inFor: Boolean
     },
     emits: ['update:api', 'update:modelValue', 'mounted', 'submit', 'change', 'emit-event', 'control', 'remove-rule', 'remove-field', 'sync', 'reload', 'repeat-field', 'update'],
     render: function render() {
@@ -1962,7 +1970,9 @@ function $FormCreate(FormCreate) {
 
       var _toRefs = toRefs(props),
           rule = _toRefs.rule,
-          modelValue = _toRefs.modelValue;
+          modelValue = _toRefs.modelValue,
+          subForm = _toRefs.subForm,
+          inFor = _toRefs.inFor;
 
       var data = reactive({
         ctxInject: {},
@@ -1974,16 +1984,60 @@ function $FormCreate(FormCreate) {
       });
       var fc = new FormCreate(vm);
       var fapi = fc.api();
+      var isMore = inFor.value;
+
+      var addSubForm = function addSubForm() {
+        if (parent) {
+          var _inject = getRuleInject(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 = getRuleInject(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();
+          }
+        }
+      };
+
       onMounted(function () {
         fc.mounted();
       });
       onBeforeUnmount(function () {
+        rmSubForm();
         data.destroyed = true;
         fc.unmount();
       });
       onUpdated(function () {
         fc.updated();
       });
+      watch(subForm, function (n) {
+        n ? addSubForm() : rmSubForm();
+      }, {
+        immediate: true
+      });
       watch(function () {
         return _toConsumableArray(rule.value);
       }, function (n) {
@@ -1998,8 +2052,8 @@ function $FormCreate(FormCreate) {
         fapi.refresh();
       });
       watch(modelValue, function (n) {
-        if (JSON.stringify(n) === data.updateValue) return;
-        fapi.setValue(n);
+        if (JSON.stringify(n || {}) === data.updateValue) return;
+        fapi.setValue(n || {});
       }, {
         deep: true
       });
@@ -2716,6 +2770,25 @@ function Api(h) {
         return origin ? ctx.origin : ctx.rule;
       }
     },
+    setEffect: function setEffect(id, attr, value) {
+      var ctx = h.getCtx(id);
+
+      if (ctx && attr) {
+        if (attr[0] === '$') {
+          attr = attr.substr(1);
+        }
+
+        if (hasProperty(ctx.rule, '$' + attr)) {
+          $set(ctx.rule, '$' + attr, value);
+        }
+
+        if (!hasProperty(ctx.rule, 'effect')) {
+          ctx.rule.effect = {};
+        }
+
+        $set(ctx.rule.effect, attr, value);
+      }
+    },
     updateValidate: function updateValidate(id, validate, merge) {
       if (merge) {
         api.mergeRule(id, {
@@ -3132,11 +3205,15 @@ function useRender$1(Render) {
           subForm: function subForm(_subForm) {
             _this6.$handle.addSubForm(ctx, _subForm);
           },
+          getSubForm: function getSubForm() {
+            return _this6.$handle.subForm[ctx.id];
+          },
           options: [],
           children: [],
           preview: false,
           field: ctx.field,
-          rule: ctx.rule
+          rule: ctx.rule,
+          input: ctx.input
         };
       }
 
@@ -4234,9 +4311,7 @@ function useInput(Handler) {
       delete this.appendData[rule.field];
     },
     addSubForm: function addSubForm(ctx, subForm) {
-      if (ctx.input) {
-        this.subForm[ctx.id] = subForm;
-      }
+      this.subForm[ctx.id] = subForm;
     },
     deferSyncValue: function deferSyncValue(fn, sync) {
       if (!this.deferSyncFn) {
@@ -5048,44 +5123,6 @@ var $fetch = {
     }
   }
 };
-var $required = {
-  name: 'required',
-  load: function load(inject, rule) {
-    var val = parseVa(inject.getValue());
-
-    var validate = _objectSpread2(_objectSpread2({}, val), {}, {
-      required: true,
-      validator: function validator(_, v) {
-        return new Promise(function (resolve, reject) {
-          is.empty(v) ? reject(validate.message) : resolve();
-        });
-      }
-    });
-
-    if (!validate.message) {
-      validate.message = rule.title + ' is required';
-    }
-
-    inject.getProp().validate = [validate];
-  },
-  watch: function watch() {
-    $required.load.apply($required, arguments);
-  }
-};
-
-function parseVa(val) {
-  if (is.Boolean(val)) {
-    return {};
-  } else if (is.String(val)) {
-    return {
-      message: val
-    };
-  } else if (!is.Object(val)) {
-    return {};
-  } else {
-    return val;
-  }
-}
 
 function parseOpt(option) {
   if (is.String(option)) {
@@ -5157,8 +5194,7 @@ function run(inject, rule, api) {
 }
 
 var $provider = {
-  fetch: $fetch,
-  required: $required
+  fetch: $fetch
 };
 
 var name$6 = 'html';
@@ -5232,7 +5268,9 @@ function FormCreateFactory(config) {
   exportAttrs(config.attrs || {});
 
   function getApi(name) {
-    return instance[name];
+    var val = instance[name];
+    if (Array.isArray(val)) return _toConsumableArray(val);
+    return val;
   }
 
   function useApp(fn) {
@@ -5367,6 +5405,7 @@ function FormCreateFactory(config) {
       modelFields: modelFields,
       rules: vm.props.rule,
       name: vm.props.name,
+      inFor: vm.props.inFor,
       prop: {
         components: components,
         directives: directives
@@ -5393,7 +5432,12 @@ function FormCreateFactory(config) {
     this.$handle = new Handler(this);
 
     if (this.name) {
-      instance[this.name] = this.api();
+      if (this.inFor) {
+        if (!instance[this.name]) instance[this.name] = [];
+        instance[this.name].push(this.api());
+      } else {
+        instance[this.name] = this.api();
+      }
     }
   }
 
@@ -5461,7 +5505,12 @@ function FormCreateFactory(config) {
     },
     unmount: function unmount() {
       if (this.name) {
-        delete instance[this.name];
+        if (this.inFor) {
+          var idx = instance[this.name].indexOf(this.api());
+          instance[this.name].splice(idx, 1);
+        } else {
+          delete instance[this.name];
+        }
       }
 
       this.unwatch && this.unwatch();
@@ -6314,11 +6363,57 @@ function extendApi(api, h) {
   return api;
 }
 
+var required = {
+  name: 'required',
+  load: function load(inject, rule, api) {
+    var val = parseVa(inject.getValue());
+
+    if (val.required === false) {
+      inject.clearProp();
+    } else {
+      var validate = _objectSpread2(_objectSpread2({}, val), {}, {
+        required: true,
+        validator: function validator(_, v, call) {
+          is.empty(v) ? call(validate.message) : call();
+        }
+      });
+
+      if (!validate.message) {
+        validate.message = rule.title + ' is required';
+      }
+
+      inject.getProp().validate = [validate];
+    }
+
+    api.sync(rule);
+  },
+  watch: function watch() {
+    required.load.apply(required, arguments);
+  }
+};
+
+function parseVa(val) {
+  if (is.Boolean(val)) {
+    return {
+      required: val
+    };
+  } else if (is.String(val)) {
+    return {
+      message: val
+    };
+  } else if (!is.Object(val)) {
+    return {};
+  } else {
+    return val;
+  }
+}
+
 function install(FormCreate) {
   FormCreate.componentAlias(alias);
   components.forEach(function (component) {
     FormCreate.component(component.name, component);
   });
+  FormCreate.register(required);
   parsers.forEach(function (parser) {
     FormCreate.parser(parser);
   });
@@ -6336,7 +6431,7 @@ function install(FormCreate) {
 function elmFormCreate() {
   return FormCreateFactory({
     ui: 'element-ui',
-    version: '3.1.3',
+    version: '3.1.4',
     manager: manager,
     extendApi: extendApi,
     install: install,