@vxe-ui/plugin-render-antd 4.0.2 → 4.0.4

package/dist/form/index.js

@@ -0,0 +1,235 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defineFormRender = defineFormRender;
+var _vue = require("vue");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * 表单 - 渲染器
+ */
+function defineFormRender(VxeUI) {
+  function isEmptyValue(cellValue) {
+    return cellValue === null || cellValue === undefined || cellValue === '';
+  }
+  function getOnName(type) {
+    return 'on' + type.substring(0, 1).toLocaleUpperCase() + type.substring(1);
+  }
+  function getModelProp(renderOpts) {
+    var prop = 'value';
+    switch (renderOpts.name) {
+      case 'ASwitch':
+        prop = 'checked';
+        break;
+    }
+    return prop;
+  }
+  function getModelEvent(renderOpts) {
+    var type = 'update:value';
+    switch (renderOpts.name) {
+      case 'ASwitch':
+        type = 'update:checked';
+        break;
+    }
+    return type;
+  }
+  function getChangeEvent(renderOpts) {
+    return 'change';
+  }
+  function getItemProps(renderOpts, params, value, defaultProps) {
+    return _xeUtils["default"].assign({}, defaultProps, renderOpts.props, _defineProperty({}, getModelProp(renderOpts), value));
+  }
+  function formatText(cellValue) {
+    return '' + (isEmptyValue(cellValue) ? '' : cellValue);
+  }
+  function getOns(renderOpts, params, inputFunc, changeFunc) {
+    var events = renderOpts.events;
+    var modelEvent = getModelEvent(renderOpts);
+    var changeEvent = getChangeEvent(renderOpts);
+    var isSameEvent = changeEvent === modelEvent;
+    var ons = {};
+    _xeUtils["default"].objectEach(events, function (func, key) {
+      ons[getOnName(key)] = function () {
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        func.apply(void 0, [params].concat(args));
+      };
+    });
+    if (inputFunc) {
+      ons[getOnName(modelEvent)] = function (targetEvnt) {
+        inputFunc(targetEvnt);
+        if (events && events[modelEvent]) {
+          events[modelEvent](params, targetEvnt);
+        }
+        if (isSameEvent && changeFunc) {
+          changeFunc(targetEvnt);
+        }
+      };
+    }
+    if (!isSameEvent && changeFunc) {
+      ons[getOnName(changeEvent)] = function () {
+        for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+          args[_key2] = arguments[_key2];
+        }
+        changeFunc.apply(void 0, args);
+        if (events && events[changeEvent]) {
+          events[changeEvent].apply(events, [params].concat(args));
+        }
+      };
+    }
+    return ons;
+  }
+  function getItemOns(renderOpts, params) {
+    var $form = params.$form,
+      data = params.data,
+      field = params.field;
+    return getOns(renderOpts, params, function (value) {
+      // 处理 model 值双向绑定
+      _xeUtils["default"].set(data, field, value);
+    }, function () {
+      // 处理 change 事件相关逻辑
+      $form.updateStatus(params);
+    });
+  }
+  function cellText(cellValue) {
+    return [formatText(cellValue)];
+  }
+  function createFormItemRender(defaultProps) {
+    return function (renderOpts, params) {
+      var data = params.data,
+        field = params.field;
+      var name = renderOpts.name;
+      var attrs = renderOpts.attrs;
+      var itemValue = _xeUtils["default"].get(data, field);
+      return [(0, _vue.h)((0, _vue.resolveComponent)(name), _objectSpread(_objectSpread(_objectSpread({}, attrs), getItemProps(renderOpts, params, itemValue, defaultProps)), getItemOns(renderOpts, params)))];
+    };
+  }
+  function defaultButtonItemRender(renderOpts, params) {
+    var attrs = renderOpts.attrs;
+    var props = getItemProps(renderOpts, params, null);
+    return [(0, _vue.h)((0, _vue.resolveComponent)('a-button'), _objectSpread(_objectSpread(_objectSpread({}, attrs), props), getItemOns(renderOpts, params)), {
+      "default": function _default() {
+        return cellText(renderOpts.content || props.content);
+      }
+    })];
+  }
+  function defaultButtonsItemRender(renderOpts, params) {
+    var children = renderOpts.children;
+    if (children) {
+      return children.map(function (childRenderOpts) {
+        return defaultButtonItemRender(childRenderOpts, params)[0];
+      });
+    }
+    return [];
+  }
+  function createFormItemRadioAndCheckboxRender() {
+    return function (renderOpts, params) {
+      var name = renderOpts.name,
+        _renderOpts$options = renderOpts.options,
+        options = _renderOpts$options === void 0 ? [] : _renderOpts$options,
+        _renderOpts$optionPro = renderOpts.optionProps,
+        optionProps = _renderOpts$optionPro === void 0 ? {} : _renderOpts$optionPro;
+      var data = params.data,
+        field = params.field;
+      var attrs = renderOpts.attrs;
+      var labelProp = optionProps.label || 'label';
+      var valueProp = optionProps.value || 'value';
+      var itemValue = _xeUtils["default"].get(data, field);
+      return [(0, _vue.h)((0, _vue.resolveComponent)("".concat(name, "Group")), _objectSpread(_objectSpread(_objectSpread({}, attrs), getItemProps(renderOpts, params, itemValue)), getItemOns(renderOpts, params)), {
+        "default": function _default() {
+          return options.map(function (option, oIndex) {
+            return (0, _vue.h)((0, _vue.resolveComponent)(name), {
+              key: oIndex,
+              value: option[valueProp],
+              disabled: option.disabled
+            }, {
+              "default": function _default() {
+                return cellText(option[labelProp]);
+              }
+            });
+          });
+        }
+      })];
+    };
+  }
+  VxeUI.renderer.mixin({
+    AAutoComplete: {
+      renderFormItemContent: createFormItemRender()
+    },
+    AInput: {
+      renderFormItemContent: createFormItemRender()
+    },
+    AInputNumber: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ASelect: {
+      renderFormItemContent: function renderFormItemContent(renderOpts, params) {
+        var _renderOpts$options2 = renderOpts.options,
+          options = _renderOpts$options2 === void 0 ? [] : _renderOpts$options2,
+          optionGroups = renderOpts.optionGroups;
+        var data = params.data,
+          field = params.field;
+        var attrs = renderOpts.attrs;
+        var itemValue = _xeUtils["default"].get(data, field);
+        var props = getItemProps(renderOpts, params, itemValue);
+        var ons = getItemOns(renderOpts, params);
+        if (optionGroups) {
+          return [(0, _vue.h)((0, _vue.resolveComponent)('a-select'), _objectSpread(_objectSpread(_objectSpread({}, attrs), props), {}, {
+            options: optionGroups
+          }, ons))];
+        }
+        return [(0, _vue.h)((0, _vue.resolveComponent)('a-select'), _objectSpread(_objectSpread(_objectSpread({}, attrs), props), {}, {
+          options: props.options || options
+        }, ons))];
+      }
+    },
+    ACascader: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ADatePicker: {
+      renderFormItemContent: createFormItemRender()
+    },
+    AMonthPicker: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ARangePicker: {
+      renderFormItemContent: createFormItemRender()
+    },
+    AWeekPicker: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ATimePicker: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ATreeSelect: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ARate: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ASwitch: {
+      renderFormItemContent: createFormItemRender()
+    },
+    ARadio: {
+      renderFormItemContent: createFormItemRadioAndCheckboxRender()
+    },
+    ACheckbox: {
+      renderFormItemContent: createFormItemRadioAndCheckboxRender()
+    },
+    AButton: {
+      renderFormItemContent: defaultButtonItemRender
+    },
+    AButtons: {
+      renderFormItemContent: defaultButtonsItemRender
+    }
+  });
+}

package/dist/form-design/checkbox-widget.js

@@ -0,0 +1,162 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createWidgetACheckbox = createWidgetACheckbox;
+var _vue = require("vue");
+var _use = require("./use");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function createWidgetACheckbox(VxeUI) {
+  var getWidgetACheckboxConfig = function getWidgetACheckboxConfig(params) {
+    return {
+      title: '复选框',
+      icon: 'vxe-icon-checkbox-checked',
+      options: {
+        options: _xeUtils["default"].range(0, 3).map(function (v, i) {
+          return {
+            value: VxeUI.getI18n('vxe.formDesign.widgetProp.dataSource.defValue', [i + 1])
+          };
+        })
+      }
+    };
+  };
+  var WidgetACheckboxFormComponent = (0, _vue.defineComponent)({
+    props: {
+      renderOpts: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      },
+      renderParams: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      }
+    },
+    emits: [],
+    setup: function setup(props) {
+      var VxeUIFormComponent = VxeUI.getComponent('VxeForm');
+      var VxeUIFormItemComponent = VxeUI.getComponent('VxeFormItem');
+      var VxeUISwitchComponent = VxeUI.getComponent('VxeSwitch');
+      var VxeUIInputComponent = VxeUI.getComponent('VxeInput');
+      var _useWidgetPropDataSou = (0, _use.useWidgetPropDataSource)(VxeUI, props, false),
+        renderDataSourceFormItem = _useWidgetPropDataSou.renderDataSourceFormItem;
+      return function () {
+        var renderParams = props.renderParams;
+        var widget = renderParams.widget;
+        return (0, _vue.h)(VxeUIFormComponent, {
+          "class": 'vxe-form-design--widget-render-form-wrapper',
+          vertical: true,
+          span: 24,
+          titleBold: true,
+          titleOverflow: true,
+          data: widget.options
+        }, {
+          "default": function _default() {
+            return [(0, _vue.h)(VxeUIFormItemComponent, {
+              title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
+            }, {
+              "default": function _default() {
+                return (0, _vue.h)(VxeUIInputComponent, {
+                  modelValue: widget.title,
+                  'onUpdate:modelValue': function onUpdateModelValue(val) {
+                    widget.title = val;
+                  }
+                });
+              }
+            }), (0, _vue.h)(VxeUIFormItemComponent, {
+              title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
+              field: 'placeholder',
+              itemRender: {
+                name: 'ElInput'
+              }
+            }), (0, _vue.h)(VxeUIFormItemComponent, {
+              title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
+            }, {
+              "default": function _default() {
+                return (0, _vue.h)(VxeUISwitchComponent, {
+                  modelValue: widget.required,
+                  'onUpdate:modelValue': function onUpdateModelValue(val) {
+                    widget.required = val;
+                  }
+                });
+              }
+            }), renderDataSourceFormItem()];
+          }
+        });
+      };
+    }
+  });
+  var WidgetACheckboxViewComponent = (0, _vue.defineComponent)({
+    props: {
+      renderOpts: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      },
+      renderParams: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      }
+    },
+    emits: [],
+    setup: function setup(props) {
+      var VxeUIFormItemComponent = VxeUI.getComponent('VxeFormItem');
+      var checkboxOptions = (0, _vue.computed)(function () {
+        var renderParams = props.renderParams;
+        var widget = renderParams.widget;
+        var options = widget.options;
+        return options.options.map(function (item) {
+          return {
+            label: item.value,
+            value: item.value
+          };
+        });
+      });
+      var changeEvent = function changeEvent() {
+        var renderParams = props.renderParams;
+        var widget = renderParams.widget,
+          $formView = renderParams.$formView;
+        if ($formView) {
+          var itemValue = $formView ? $formView.getItemValue(widget) : null;
+          $formView.updateItemStatus(widget, itemValue);
+        }
+      };
+      return function () {
+        var renderParams = props.renderParams;
+        var widget = renderParams.widget,
+          $formView = renderParams.$formView;
+        return (0, _vue.h)(VxeUIFormItemComponent, {
+          "class": ['vxe-form-design--widget-render-form-item'],
+          field: widget.field,
+          title: widget.title
+        }, {
+          "default": function _default() {
+            return (0, _vue.h)((0, _vue.resolveComponent)('a-checkbox-group'), {
+              value: $formView ? $formView.getItemValue(widget) : null,
+              options: checkboxOptions.value,
+              onChange: changeEvent,
+              'onUpdate:value': function onUpdateValue(val) {
+                if ($formView) {
+                  $formView.setItemValue(widget, val);
+                }
+              }
+            });
+          }
+        });
+      };
+    }
+  });
+  return {
+    getWidgetACheckboxConfig: getWidgetACheckboxConfig,
+    WidgetACheckboxFormComponent: WidgetACheckboxFormComponent,
+    WidgetACheckboxViewComponent: WidgetACheckboxViewComponent
+  };
+}

package/dist/form-design/date-picker-widget.js

@@ -0,0 +1,143 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createWidgetADatePicker = createWidgetADatePicker;
+var _vue = require("vue");
+function createWidgetADatePicker(VxeUI) {
+  var getWidgetADatePickerConfig = function getWidgetADatePickerConfig(params) {
+    return {
+      title: '日期',
+      icon: 'vxe-icon-input',
+      options: {
+        placeholder: ''
+      }
+    };
+  };
+  var WidgetADatePickerFormComponent = (0, _vue.defineComponent)({
+    props: {
+      renderOpts: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      },
+      renderParams: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      }
+    },
+    emits: [],
+    setup: function setup(props) {
+      var VxeUIFormComponent = VxeUI.getComponent('VxeForm');
+      var VxeUIFormItemComponent = VxeUI.getComponent('VxeFormItem');
+      var VxeUISwitchComponent = VxeUI.getComponent('VxeSwitch');
+      var VxeUIInputComponent = VxeUI.getComponent('VxeInput');
+      return function () {
+        var renderParams = props.renderParams;
+        var widget = renderParams.widget;
+        return (0, _vue.h)(VxeUIFormComponent, {
+          "class": 'vxe-form-design--widget-render-form-wrapper',
+          vertical: true,
+          span: 24,
+          titleBold: true,
+          titleOverflow: true,
+          data: widget.options
+        }, {
+          "default": function _default() {
+            return [(0, _vue.h)(VxeUIFormItemComponent, {
+              title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
+            }, {
+              "default": function _default() {
+                return (0, _vue.h)(VxeUIInputComponent, {
+                  modelValue: widget.title,
+                  'onUpdate:modelValue': function onUpdateModelValue(val) {
+                    widget.title = val;
+                  }
+                });
+              }
+            }), (0, _vue.h)(VxeUIFormItemComponent, {
+              title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
+              field: 'placeholder',
+              itemRender: {
+                name: 'VxeInput'
+              }
+            }), (0, _vue.h)(VxeUIFormItemComponent, {
+              title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
+            }, {
+              "default": function _default() {
+                return (0, _vue.h)(VxeUISwitchComponent, {
+                  modelValue: widget.required,
+                  'onUpdate:modelValue': function onUpdateModelValue(val) {
+                    widget.required = val;
+                  }
+                });
+              }
+            })];
+          }
+        });
+      };
+    }
+  });
+  var WidgetADatePickerViewComponent = (0, _vue.defineComponent)({
+    props: {
+      renderOpts: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      },
+      renderParams: {
+        type: Object,
+        "default": function _default() {
+          return {};
+        }
+      }
+    },
+    emits: [],
+    setup: function setup(props) {
+      var VxeUIFormItemComponent = VxeUI.getComponent('VxeFormItem');
+      var changeEvent = function changeEvent() {
+        var renderParams = props.renderParams;
+        var widget = renderParams.widget,
+          $formView = renderParams.$formView;
+        if ($formView) {
+          var itemValue = $formView ? $formView.getItemValue(widget) : null;
+          $formView.updateItemStatus(widget, itemValue);
+        }
+      };
+      return function () {
+        var renderParams = props.renderParams;
+        var widget = renderParams.widget,
+          $formView = renderParams.$formView;
+        var options = widget.options;
+        return (0, _vue.h)(VxeUIFormItemComponent, {
+          "class": ['vxe-form-design--widget-render-form-item'],
+          field: widget.field,
+          title: widget.title
+        }, {
+          "default": function _default() {
+            return (0, _vue.h)((0, _vue.resolveComponent)('a-date-picker'), {
+              value: $formView ? $formView.getItemValue(widget) : null,
+              placeholder: options.placeholder,
+              onChange: changeEvent,
+              'onUpdate:value': function onUpdateValue(val) {
+                if ($formView) {
+                  $formView.setItemValue(widget, val);
+                }
+              }
+            });
+          }
+        });
+      };
+    }
+  });
+  return {
+    getWidgetADatePickerConfig: getWidgetADatePickerConfig,
+    WidgetADatePickerFormComponent: WidgetADatePickerFormComponent,
+    WidgetADatePickerViewComponent: WidgetADatePickerViewComponent
+  };
+}