@form-create/element-ui 3.0.0-alpha.2 → 3.0.0-alpha.3

package/dist/form-create.js

@@ -1,5 +1,5 @@
 /*!
- * @form-create/element-ui v3.0.0-alpha.2
+ * @form-create/element-ui v3.0.0-alpha.3
  * (c) 2018-2021 xaboy
  * Github https://github.com/xaboy/form-create
  * Released under the MIT License.
@@ -234,25 +234,30 @@
       var trueValue = vue.ref([]);
       var value = vue.toRef(props, 'modelValue');
 
-      var _options = vue.computed(function () {
-        return Array.isArray(options) ? options : [];
-      });
+      var _options = function _options() {
+        return Array.isArray(options.value) ? options.value : [];
+      };
 
       var update = function update() {
-        trueValue.value = value.value ? _options.value.filter(function (opt) {
+        trueValue.value = value.value ? _options().filter(function (opt) {
           return value.value.indexOf(opt.value) !== -1;
         }).map(function (option) {
           return option.label;
         }) : [];
       };
 
-      update();
+      vue.watch(options, function () {
+        update();
+      }, {
+        deep: true,
+        immediate: true
+      });
       return {
         options: _options,
         trueValue: trueValue,
         value: value,
         onInput: function onInput(n) {
-          _.emit('update:modelValue', _options.value.filter(function (opt) {
+          _.emit('update:modelValue', _options().filter(function (opt) {
             return n.indexOf(opt.label) !== -1;
           }).map(function (opt) {
             return opt.value;
@@ -280,7 +285,7 @@
         "onUpdate:modelValue": this.onInput
       }), _objectSpread2({
         "default": function _default() {
-          return [_this.options.map(function (opt, index) {
+          return [_this.options().map(function (opt, index) {
             var props = _objectSpread2({}, opt);
 
             delete props.value;
@@ -855,25 +860,30 @@
       var trueValue = vue.ref([]);
       var value = vue.toRef(props, 'modelValue');
 
-      var _options = vue.computed(function () {
-        return Array.isArray(options) ? options : [];
-      });
+      var _options = function _options() {
+        return Array.isArray(options.value) ? options.value : [];
+      };
 
       var update = function update() {
-        trueValue.value = _options.value.filter(function (opt) {
+        trueValue.value = _options().filter(function (opt) {
           return opt.value === value.value;
         }).reduce(function (initial, opt) {
           return opt.label;
         }, '');
       };
 
-      update();
+      vue.watch(options, function () {
+        update();
+      }, {
+        deep: true,
+        immediate: true
+      });
       return {
         options: _options,
         trueValue: trueValue,
         value: value,
         onInput: function onInput(n) {
-          _.emit('update:modelValue', _options.value.filter(function (opt) {
+          _.emit('update:modelValue', _options().filter(function (opt) {
             return opt.label === n;
           }).reduce(function (initial, opt) {
             return opt.value;
@@ -899,7 +909,7 @@
         "onUpdate:modelValue": this.onInput
       }), _objectSpread2({
         "default": function _default() {
-          return [_this.options.map(function (opt, index) {
+          return [_this.options().map(function (opt, index) {
             var props = _objectSpread2({}, opt);
 
             delete props.value;
@@ -932,9 +942,9 @@
 
       var value = vue.toRef(props, 'modelValue');
 
-      var _options = vue.computed(function () {
-        return Array.isArray(options) ? options : [];
-      });
+      var _options = function _options() {
+        return Array.isArray(options.value) ? options.value : [];
+      };
 
       return {
         options: _options,
@@ -953,7 +963,7 @@
         }
       }), _objectSpread2({
         "default": function _default() {
-          return [_this.options.map(function (props, index) {
+          return [_this.options().map(function (props, index) {
             return vue.createVNode(vue.resolveComponent("ElOption"), vue.mergeProps(props, {
               "key": '' + index + props.value
             }), null);
@@ -1071,7 +1081,8 @@
         uploadList: [],
         previewVisible: false,
         previewImage: '',
-        fileList: []
+        fileList: [],
+        cacheFiles: []
       };
     },
     created: function created() {
@@ -1170,7 +1181,7 @@
           }
 
           return vue.createVNode("div", {
-            "class": 'fc-upload-cover'
+            "class": "fc-upload-cover"
           }, [icons]);
         }
       },
@@ -1180,7 +1191,7 @@
         return this.uploadList.map(function (file, index) {
           return vue.createVNode("div", {
             "key": _this3.key(index),
-            "class": 'fc-files'
+            "class": "fc-files"
           }, [file.percentage !== undefined && file.status !== 'success' ? _this3.makeProgress(file, index) : [_this3.makeItem(file, index), _this3.makeIcons(file, index)]]);
         });
       },
@@ -1201,7 +1212,7 @@
         }), _objectSpread2({
           "default": function _default() {
             return [isShow ? ((_this$$slots$default = (_this$$slots = _this4.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots)) || vue.createVNode("div", {
-              "class": 'fc-upload-btn'
+              "class": "fc-upload-btn"
             }, [vue.createVNode("i", {
               "class": "el-icon-upload2"
             }, null)]) : undefined];
@@ -1214,7 +1225,11 @@
         }).filter(function (url) {
           return url !== undefined;
         });
-        this.$emit('update:modelValue', this.limit === 1 ? files[0] || '' : files);
+
+        if (this.cacheFiles.length !== files.length) {
+          this.cacheFiles = _toConsumableArray(files);
+          this.$emit('update:modelValue', this.limit === 1 ? files[0] || '' : files);
+        }
       },
       handleCancel: function handleCancel() {
         this.previewVisible = false;
@@ -1224,7 +1239,7 @@
       var _this5 = this;
 
       return vue.createVNode("div", {
-        "class": '_fc-upload'
+        "class": "_fc-upload"
       }, [[this.$attrs.showFileList ? [] : this.makeFiles(), this.makeUpload()], vue.createVNode(vue.resolveComponent("ElDialog"), {
         "appendToBody": true,
         "modal": this.previewMask,
@@ -1754,14 +1769,14 @@
         modelValue: Object,
         api: Object
       },
-      emits: ['update:api', 'update:modelValue', 'mounted', 'submit', 'change', 'emit-event', 'control', 'remove-rule', 'remove-field', 'sync'],
+      emits: ['update:api', 'update:modelValue', 'mounted', 'submit', 'change', 'emit-event', 'control', 'remove-rule', 'remove-field', 'sync', 'reload', 'repeat-field', 'update'],
       render: function render() {
         return this.fc.render();
       },
       setup: function setup(props) {
         var vm = vue.getCurrentInstance();
         vue.provide('parentFC', vm);
-        var parent = vue.inject('parentFC');
+        var parent = vue.inject('parentFC', null);
 
         var _toRefs = vue.toRefs(props),
             rule = _toRefs.rule,
@@ -1956,14 +1971,18 @@
           }
 
           origin[key] = deepExtend(origin[key], clone, mode);
-        } else if (is.Undef(clone)) {
-          $set(origin, key, clone);
-        } else if (clone.__json !== undefined) {
-          $set(origin, key, clone.__json);
-        } else if (clone.__origin !== undefined) {
-          $set(origin, key, clone.__origin);
         } else {
           $set(origin, key, clone);
+
+          if (!is.Undef(clone)) {
+            if (clone.__json !== undefined) {
+              origin[key].__json = clone.__json;
+            }
+
+            if (clone.__origin !== undefined) {
+              origin[key].__origin = clone.__origin;
+            }
+          }
         }
       }
     }
@@ -2344,11 +2363,6 @@
     }
 
     var api = {
-      helper: {
-        tidyFields: tidyFields,
-        props: props
-      },
-
       get config() {
         return h.options;
       },
@@ -2496,6 +2510,12 @@
         });
         h.refresh();
       },
+      all: function all(origin) {
+        return Object.keys(h.ctxs).map(function (k) {
+          var ctx = h.ctxs[k];
+          return origin ? ctx.origin : ctx.rule;
+        });
+      },
       model: function model(origin) {
         return h.fields().reduce(function (initial, key) {
           var ctx = h.fieldCtx[key][0];
@@ -2681,6 +2701,15 @@
       nextRefresh: function nextRefresh(fn) {
         h.nextRefresh();
         fn && invoke(fn);
+      },
+      emit: function emit(name) {
+        var _h$vm;
+
+        for (var _len3 = arguments.length, args = new Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) {
+          args[_key3 - 1] = arguments[_key3];
+        }
+
+        (_h$vm = h.vm).emit.apply(_h$vm, [name].concat(args));
       }
     };
     ['on', 'once', 'off', 'set'].forEach(function (n) {
@@ -2826,6 +2855,7 @@
 
         if (ctx.type === 'hidden') return;
         var rule = ctx.rule;
+        var preview = this.options.preview || false;
 
         if (!this.cache[ctx.id] || this.cache[ctx.id].slot !== rule.slot) {
           var vn;
@@ -2861,12 +2891,13 @@
                 _vn = _this4.vm.slots[slot]({
                   rule: rule,
                   prop: prop,
+                  preview: preview,
                   children: children,
                   api: _this4.$handle.api,
                   model: prop.model || {}
                 });
               } else {
-                _vn = ctx.parser.render(_this4.renderChildren(ctx), ctx);
+                _vn = preview ? ctx.parser.preview(children, ctx) : ctx.parser.render(children, ctx);
               }
 
               _vn = _this4.renderSides(_vn, ctx);
@@ -2935,6 +2966,7 @@
         var _this6 = this;
 
         return {
+          preview: this.options.preview || false,
           api: this.$handle.api,
           form: this.fc.create,
           subForm: function subForm(_subForm) {
@@ -3832,6 +3864,7 @@
         this.refresh();
         this.bus.$off('next-tick', this.nextReload);
         this.bus.$once('next-tick', this.nextReload);
+        this.bus.$emit('update', this.api);
       },
       //todo 组件生成全部通过 alias
       refresh: function refresh() {
@@ -3955,7 +3988,7 @@
         this.vm.setupState.updateValue(_objectSpread2({}, this.form));
       },
       isChange: function isChange(ctx, value) {
-        return JSON.stringify(this.getFormData(ctx)) !== JSON.stringify(value);
+        return JSON.stringify(this.getFormData(ctx), strFn) !== JSON.stringify(value, strFn);
       },
       isQuote: function isQuote(ctx, value) {
         return (is.Object(value) || Array.isArray(value)) && value === ctx.rule.value;
@@ -3979,6 +4012,7 @@
         if (this.refreshControl(ctx)) {
           this.$render.clearCacheAll();
           this.loadRule();
+          this.bus.$emit('update', this.api);
           this.refresh();
         }
 
@@ -4006,6 +4040,10 @@
     });
   }
 
+  function strFn(key, val) {
+    return typeof val === 'function' ? '' + val : val;
+  }
+
   var BaseParser = {
     init: function init(ctx) {},
     toFormValue: function toFormValue(value, ctx) {
@@ -4018,6 +4056,9 @@
     render: function render(children, ctx) {
       return ctx.$render.defaultRender(ctx, children);
     },
+    preview: function preview(children, ctx) {
+      return ctx.$render.defaultRender(ctx, children);
+    },
     mergeProp: function mergeProp(ctx) {}
   };
 
@@ -4143,7 +4184,12 @@
                     _this.rmCtx(child.__fc__);
                   }
                 });
-                is.trueArray(n) && _this.loadChildren(n, ctx);
+
+                if (is.trueArray(n)) {
+                  _this.loadChildren(n, ctx);
+
+                  _this.bus.$emit('update', _this.api);
+                }
               });
             }
 
@@ -4215,8 +4261,8 @@
         this.$render.clearCache(ctx);
         ctx["delete"]();
         this.effect(ctx, 'deleted');
-        input && !this.fieldCtx[field] && this.vm.emit('removeField', field, ctx.rule, this.api);
-        ctx.rule.__ctrl || this.vm.emit('removeRule', ctx.rule, this.api);
+        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;
       }
     });
@@ -4705,6 +4751,11 @@
 
   function run(inject, rule, api) {
     var option = inject.value;
+
+    if (is.Function(option)) {
+      option = option(rule, api);
+    }
+
     option = parseOpt(option);
 
     if (!option || !option.action) {
@@ -5029,6 +5080,7 @@
         copyRules: copyRules,
         fetch: fetch,
         $form: $form,
+        parseFn: parseFn,
         parseJson: parseJson,
         toJson: toJson
       });
@@ -5437,40 +5489,35 @@
       var form = this.options.form;
       var children = [(titleProp.title || '') + (form.labelSuffix || form['label-suffix'] || '')];
 
-      var titleFn = function titleFn() {
-        return _this4.$r(mergeProps([titleProp, {
-          props: titleProp,
-          key: "".concat(uni, "tit"),
-          type: titleProp.type || 'span'
-        }]), children);
-      };
-
-      if (!isFalse(infoProp.show) && (infoProp.info || infoProp["native"])) {
-        if (infoProp.icon !== false) {
-          children[infoProp.align !== 'left' ? 'unshift' : 'push'](this.$r({
-            type: 'i',
-            "class": infoProp.icon === true ? 'el-icon-warning' : infoProp.icon,
-            key: "".concat(uni, "i")
-          }, {}, true));
-        }
-
+      if (!isFalse(infoProp.show) && (infoProp.info || infoProp["native"]) && !isFalse(infoProp.icon)) {
         var prop = {
           type: infoProp.type || 'popover',
           props: _objectSpread2({}, infoProp),
           key: "".concat(uni, "pop")
         };
+        delete prop.props.icon;
+        delete prop.props.show;
+        delete prop.props.info;
         var field = 'content';
 
         if (infoProp.info && !hasProperty(prop.props, field)) {
           prop.props[field] = infoProp.info;
         }
 
-        return this.$r(mergeProps([infoProp, prop]), _defineProperty({}, titleProp.slot || (isTip ? 'default' : 'reference'), function () {
-          return titleFn();
-        }));
+        children[infoProp.align !== 'left' ? 'unshift' : 'push'](this.$r(mergeProps([infoProp, prop]), _defineProperty({}, titleProp.slot || (isTip ? 'default' : 'reference'), function () {
+          return _this4.$r({
+            type: 'i',
+            "class": infoProp.icon === true ? 'el-icon-warning' : infoProp.icon,
+            key: "".concat(uni, "i")
+          }, {}, true);
+        })));
       }
 
-      return titleFn();
+      return this.$r(mergeProps([titleProp, {
+        props: titleProp,
+        key: "".concat(uni, "tit"),
+        type: titleProp.type || 'span'
+      }]), children);
     },
     makeCol: function makeCol(rule, uni, children) {
       var col = rule.col;
@@ -5828,7 +5875,7 @@
   function elmFormCreate() {
     return FormCreateFactory({
       ui: 'element-ui',
-      version: '3.0.0-alpha.2',
+      version: '3.0.0-alpha.3',
       manager: manager,
       appUse: appUse,
       extendApi: extendApi,