fx-form-widget/lib/packages/previewPlatform/component/ContentWrap/renderWidget.js

动态表单组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.setRules = exports["default"] = void 0;
var _col = _interopRequireDefault(require("antd/lib/col"));
var _tooltip = _interopRequireDefault(require("antd/lib/tooltip"));
var _form = _interopRequireDefault(require("antd/lib/form"));
var _react = _interopRequireWildcard(require("react"));
var React = _react;
var _classnames = _interopRequireDefault(require("classnames"));
var _widgets = require("../../widgets");
var _previewPlatform = require("../../../previewPlatform");
var _icons = require("@ant-design/icons");
var _tools = require("../../tools");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
// 不同布局组件的id集合
var LAYOUT_COMPONENTIDS = {
  SUB_FORM_ID: 100,
  GROUP_ID: 101,
  SEPARATOR_ID: 102
};
var DefaultWidgets = _widgets.Widgets;
var Item = _form["default"].Item;

// 添加校验规则
var setRules = exports.setRules = function setRules(viewSchema) {
  var required = viewSchema.required,
    minLength = viewSchema.minLength,
    maxLength = viewSchema.maxLength,
    title = viewSchema.title,
    pattern = viewSchema.pattern,
    patternErrMsg = viewSchema.patternErrMsg;
  // 校验规则
  var rulesList = [];
  rulesList.push({
    required: required,
    message: title + "\u4E0D\u80FD\u4E3A\u7A7A"
  });
  // 最小字数
  if ((0, _tools.isNotNullValue)(minLength)) {
    rulesList.push({
      min: minLength,
      message: "\u8F93\u5165\u4E0D\u80FD\u5C11\u4E8E" + minLength + "\u4E2A\u5B57\u7B26"
    });
  }
  // 最大字数
  if ((0, _tools.isNotNullValue)(maxLength)) {
    rulesList.push({
      max: maxLength,
      message: "\u8F93\u5165\u4E0D\u80FD\u591A\u4E8E" + maxLength + "\u4E2A\u5B57\u7B26"
    });
  }
  if ((0, _tools.isNotNullValue)(pattern)) {
    try {
      var regexp = new RegExp(pattern);
      rulesList.push({
        pattern: regexp,
        message: patternErrMsg || undefined,
        validateTrigger: 'onBlur'
      });
    } catch (error) {
      console.error(error);
    }
  }
  return rulesList;
};
var RenderWidget = function RenderWidget(_ref) {
  var schema = _ref.schema,
    onCheck = _ref.onCheck,
    children = _ref.children;
  var id = schema.id,
    wid = schema.wid,
    widget = schema.widget,
    _schema$viewSchema = schema.viewSchema,
    title = _schema$viewSchema.title,
    description = _schema$viewSchema.description,
    data = _schema$viewSchema.data,
    fieldName = _schema$viewSchema.fieldName,
    required = _schema$viewSchema.required;
  var ContentContext = (0, _react.useContext)(_previewPlatform.Context);
  var Widget = DefaultWidgets[widget];
  if (!Widget) {
    return null;
  }
  var onSchemaChange = ContentContext.onSchemaChange,
    globalData = ContentContext.globalData;
  var _globalData$column = globalData.column,
    column = _globalData$column === void 0 ? 3 : _globalData$column;
  var onChange = function onChange(value) {
    schema.viewSchema.data = value;
    onSchemaChange('edit', schema);
  };
  var renderDescription = function renderDescription(description) {
    if (description) {
      return /*#__PURE__*/React.createElement(_tooltip["default"], {
        title: description
      }, /*#__PURE__*/React.createElement(_icons.ExclamationCircleOutlined, null));
    }
    return null;
  };
  var className = (0, _classnames["default"])('label-content', {
    'label-content-required': required
  });
  var renderTitle = function renderTitle(title) {
    return /*#__PURE__*/React.createElement("div", {
      className: className
    }, title, renderDescription(description));
  };
  if (id === LAYOUT_COMPONENTIDS['SEPARATOR_ID']) {
    return /*#__PURE__*/React.createElement(_col["default"], {
      span: 24
    }, /*#__PURE__*/React.createElement(Item, {
      className: "separator-wrap"
    }, /*#__PURE__*/React.createElement("div", {
      className: "separator-title"
    }, title), /*#__PURE__*/React.createElement(Widget, {
      schema: schema.viewSchema
    })));
  }
  return /*#__PURE__*/React.createElement(_col["default"], {
    span: column === 1 ? 16 : 24 / column
  }, /*#__PURE__*/React.createElement(Item, {
    name: fieldName ? fieldName : wid,
    rules: setRules(schema.viewSchema),
    label: renderTitle(title),
    className: "form-item-widget-wrapper"
  }, /*#__PURE__*/React.createElement(Widget, {
    isInit: true,
    value: data,
    onChange: onChange,
    onCheck: onCheck,
    schema: schema.viewSchema,
    children: children
  })));
};
var _default = exports["default"] = RenderWidget;