@wufengteam/wform/lib/components/ColumnsRender/index.js

@wufengteam/wform

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _antd = require("antd");
var _datapreview = require("@wufengteam/datapreview");
var _DataQueryPreview = _interopRequireDefault(require("../DataQueryPreview"));
var _utils = require("../../utils");
var _dsl = require("../../utils/dsl");
var _tool = require("../../utils/tool");
var _image = _interopRequireDefault(require("./assets/image.png"));
var _video = _interopRequireDefault(require("./assets/video.png"));
var _attach = _interopRequireDefault(require("./assets/attach.png"));
var _edit = _interopRequireDefault(require("./assets/edit.png"));
var _table = _interopRequireDefault(require("./assets/table.png"));
var _richText = _interopRequireDefault(require("./assets/richText.png"));
var _location = _interopRequireDefault(require("./assets/location.png"));
require("./index.css");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } /* eslint-disable no-console */ // @ts-ignore
// @ts-ignore
// @ts-ignore
// @ts-ignore
// @ts-ignore
// @ts-ignore
// @ts-ignore
var cssClsPrefix = "".concat(_utils.prefix, "-data");
// @ts-ignore
var findTitlesByValues = function findTitlesByValues(data, values) {
  var result = [];
  function search(children, vals) {
    // eslint-disable-next-line no-restricted-syntax
    var _iterator = _createForOfIteratorHelper(children),
      _step;
    try {
      for (_iterator.s(); !(_step = _iterator.n()).done;) {
        var item = _step.value;
        if (vals.includes(item.value)) {
          result.push(item.title);
        }
        if (item.children && item.children.length > 0) {
          search(item.children, values);
        }
      }
    } catch (err) {
      _iterator.e(err);
    } finally {
      _iterator.f();
    }
  }
  search(data, values);
  return result;
};
var ColumnsRender = function ColumnsRender(parames) {
  var _a, _b, _c, _d;
  var dataSource = parames.dataSource,
    attrCode = parames.attrCode,
    appId = parames.appId,
    dsl = parames.dsl,
    platform = parames.platform,
    getEngineApis = parames.getEngineApis,
    _parames$ellipsis = parames.ellipsis,
    ellipsis = _parames$ellipsis === void 0 ? true : _parames$ellipsis;
  // 开关组件字段渲染
  if (attrCode.startsWith('Switch')) {
    return /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, "".concat(dataSource) === 'true' ? '开启' : '关闭', " ");
  }
  if (!dataSource) return /*#__PURE__*/_react.default.createElement("span", null, "-");
  var value = dataSource;
  if (!(typeof dataSource === 'string' && /^\d{16,}$/.test(dataSource))) {
    try {
      value = JSON.parse(dataSource);
    } catch (error) {
      value = dataSource;
    }
  }
  // 图片上传、文本识别组件字段渲染
  if (attrCode.startsWith('image') || attrCode.startsWith('ImgUpload') || attrCode.startsWith('TextRecognition')) {
    var data = [];
    if (value && Array.isArray(value)) {
      value.map(function (item) {
        return data.push(Object.assign(Object.assign({}, item), {
          appId: appId
        }));
      });
    }
    return /*#__PURE__*/_react.default.createElement(_datapreview.ImgPreview, {
      title: "\u56FE\u7247\u4E0B\u8F7D",
      data: data,
      platform: platform,
      getEngineApis: getEngineApis
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-preview-btn"),
      style: {
        color: '#0dd19a',
        background: 'rgba(13, 240, 192, 0.3)',
        display: 'flex',
        width: 'fit-content',
        cursor: 'pointer'
      }
    }, /*#__PURE__*/_react.default.createElement("img", {
      alt: "",
      src: _image.default
    }), /*#__PURE__*/_react.default.createElement("span", null, value && Array.isArray(value) && value.length || 0)));
  }
  // 视频上传、视频上传组件字段渲染
  if (attrCode.startsWith('video') || attrCode.startsWith('Video')) {
    var _data = [];
    if (value && Array.isArray(value)) {
      value.map(function (item) {
        return _data.push(Object.assign(Object.assign({}, item), {
          appId: appId
        }));
      });
    }
    return /*#__PURE__*/_react.default.createElement(_datapreview.FileDownloadList, {
      data: _data,
      platform: platform,
      title: "\u89C6\u9891",
      getEngineApis: getEngineApis
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-preview-btn"),
      style: {
        color: '#47e',
        background: 'rgba(68, 119, 238, 0.2)'
      }
    }, /*#__PURE__*/_react.default.createElement("img", {
      alt: "",
      src: _video.default
    }), /*#__PURE__*/_react.default.createElement("span", null, value && Array.isArray(value) && value.length || 0)));
  }
  // 签名组件字段渲染
  if (attrCode.startsWith('Autograph')) {
    return /*#__PURE__*/_react.default.createElement(_datapreview.ImgPreview, {
      title: "\u56FE\u7247\u4E0B\u8F7D",
      data: [value],
      platform: platform,
      getEngineApis: getEngineApis
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-preview-btn"),
      style: {
        color: '#f88c2d',
        background: 'rgba(248, 140, 45, 0.3)'
      }
    }, /*#__PURE__*/_react.default.createElement("img", {
      alt: "",
      src: _edit.default
    }), /*#__PURE__*/_react.default.createElement("span", null, "1")));
  }
  // 附件上传、附件下载、附件校验组件字段渲染
  if (attrCode.startsWith('StdUpload') || attrCode.startsWith('CheckUpload') || attrCode.startsWith('Attachments')) {
    return /*#__PURE__*/_react.default.createElement(_datapreview.FileDownloadList, {
      data: value,
      platform: platform,
      title: "\u9644\u4EF6\u4E0A\u4F20",
      getEngineApis: getEngineApis
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-preview-btn"),
      style: {
        color: '#7a7bfb',
        background: 'rgba(122, 123, 251, 0.3)'
      }
    }, /*#__PURE__*/_react.default.createElement("img", {
      alt: "",
      src: _attach.default
    }), /*#__PURE__*/_react.default.createElement("span", null, value && Array.isArray(value) && value.length || 0)));
  }
  // 添加成员、添加部门组件字段渲染
  if ((attrCode.startsWith('AddMember') || attrCode.startsWith('AddDepartment')) && Array.isArray(value)) {
    var nameList = (value || []).map(function (it) {
      if ((it === null || it === void 0 ? void 0 : it.isSonOrg) === 1) {
        return "".concat(it === null || it === void 0 ? void 0 : it.orgName, "(\u542B\u5B50\u90E8\u95E8)");
      }
      return (it === null || it === void 0 ? void 0 : it.staffName) || (it === null || it === void 0 ? void 0 : it.orgName);
    });
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
      title: nameList.join('、')
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-ellipsis")
    }, nameList.join('、')))) : ( /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, nameList.join('、'))));
  }
  // 关联数据组件字段渲染
  if (attrCode.startsWith('DataLinkage')) {
    return /*#__PURE__*/_react.default.createElement("span", null, "-");
  }
  // 下拉复选、复选组组件字段渲染
  if ((attrCode.startsWith('CheckboxGroup') || attrCode.startsWith('MultipleSelect')) && Array.isArray(value)) {
    var dslData = {};
    try {
      dslData = JSON.parse(dsl);
    } catch (error) {
      dslData = {};
    }
    // DSL与options前置处理
    var options;
    var formData = dslData.formData || [];
    if (formData.length > 0) {
      options = (_a = formData.find(function (item) {
        return item.compCode === attrCode;
      })) === null || _a === void 0 ? void 0 : _a.options;
      // 显示值和选项值转置
      if (Array.isArray(options) && options.length > 0) {
        var map = new Map();
        options === null || options === void 0 ? void 0 : options.forEach(function (item) {
          map.set(item.value, item.title);
        });
        options = map;
      }
    }
    if (options) {
      var valueList = value.map(function (i) {
        return options === null || options === void 0 ? void 0 : options.get("".concat(i));
      });
      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
        title: valueList.join('、')
      }, /*#__PURE__*/_react.default.createElement("span", {
        className: "".concat(cssClsPrefix, "-ellipsis")
      }, valueList.join('、')))) : ( /*#__PURE__*/_react.default.createElement("span", {
        className: "".concat(cssClsPrefix, "-cell")
      }, valueList.join('、'))));
    }
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
      title: value.join('、')
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-ellipsis")
    }, value.join('、')))) : ( /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, value.join('、'))));
  }
  // 树选择组件字段渲染
  if (attrCode.startsWith('TreeSelect')) {
    var _dslData = {};
    try {
      _dslData = JSON.parse(dsl);
    } catch (error) {
      _dslData = {};
    }
    var _options;
    var _formData = _dslData.formData || [];
    if (_formData.length > 0) {
      _options = (_b = _formData.find(function (item) {
        return item.compCode === attrCode;
      })) === null || _b === void 0 ? void 0 : _b.options;
    }
    if (_options && Array.isArray(_options)) {
      var vals = Array.isArray(value) ? value.map(function (i) {
        return "".concat(i);
      }) : ["".concat(value)];
      var _valueList = findTitlesByValues(_options, vals);
      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
        title: _valueList.join('、')
      }, /*#__PURE__*/_react.default.createElement("span", {
        className: "".concat(cssClsPrefix, "-ellipsis")
      }, _valueList.join('、')))) : ( /*#__PURE__*/_react.default.createElement("span", {
        className: "".concat(cssClsPrefix, "-cell")
      }, _valueList.join('、'))));
    }
    if (Array.isArray(value) && value.length > 0) {
      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
        title: value.join('、')
      }, /*#__PURE__*/_react.default.createElement("span", {
        className: "".concat(cssClsPrefix, "-ellipsis")
      }, value.join('、')))) : ( /*#__PURE__*/_react.default.createElement("span", {
        className: "".concat(cssClsPrefix, "-cell")
      }, value.join('、'))));
    }
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
      title: value
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-ellipsis")
    }, value))) : ( /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, value)));
  }
  // 下拉单选、单选组组件字段渲染
  if (attrCode.startsWith('Select') || attrCode.startsWith('Radio')) {
    var _dslData2 = {};
    try {
      _dslData2 = JSON.parse(dsl);
    } catch (error) {
      _dslData2 = {};
    }
    // DSL与options前置处理
    var _options2;
    var _formData2 = _dslData2.formData || [];
    if (_formData2.length > 0) {
      _options2 = (_c = _formData2.find(function (item) {
        return item.compCode === attrCode;
      })) === null || _c === void 0 ? void 0 : _c.options;
      // 显示值和选项值转置
      if (Array.isArray(_options2) && _options2.length > 0) {
        var _map = new Map();
        _options2 === null || _options2 === void 0 ? void 0 : _options2.forEach(function (item) {
          _map.set(item.value, item.title);
        });
        _options2 = _map;
      }
    }
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
      title: (_options2 === null || _options2 === void 0 ? void 0 : _options2.get("".concat(value))) || value
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-ellipsis")
    }, (_options2 === null || _options2 === void 0 ? void 0 : _options2.get("".concat(value))) || value))) : ( /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, (_options2 === null || _options2 === void 0 ? void 0 : _options2.get("".concat(value))) || value)));
  }
  // 时间段选择组件字段渲染
  if (attrCode.startsWith('RangePicker')) {
    return /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, (value || []).join(' 至 '), " ");
  }
  // 密码框组件字段渲染
  if (attrCode.startsWith('Password')) {
    return /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, (0, _utils.plusXing)(value, 0, 0, '*'), " ");
  }
  // 级联组件字段渲染
  if (attrCode.startsWith('Cascader')) {
    var _dslData3 = {};
    try {
      _dslData3 = JSON.parse(dsl);
    } catch (error) {
      _dslData3 = {};
    }
    var _options3;
    var _formData3 = _dslData3.formData || [];
    var cascaderValue = [];
    if (_formData3.length > 0) {
      _options3 = (_d = _formData3.find(function (item) {
        return item.compCode === attrCode;
      })) === null || _d === void 0 ? void 0 : _d.options;
      var titleMapByValue = {};
      var getTitleMapByValue = function getTitleMapByValue(data) {
        data.forEach(function (i) {
          if (i.value) {
            titleMapByValue[i.value] = i.title;
          }
          if (Array.isArray(i.children) && i.children.length > 0) {
            getTitleMapByValue(i.children);
          }
        });
      };
      if (Array.isArray(_options3)) {
        getTitleMapByValue(_options3);
        cascaderValue = value.map(function (i) {
          return titleMapByValue[i];
        });
      }
    }
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
      title: (cascaderValue || []).join('/')
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-ellipsis")
    }, (cascaderValue || []).join('/')))) : ( /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, (cascaderValue || []).join('/'))));
  }
  // 地址组件字段渲染
  if (attrCode.startsWith('Address')) {
    var addressValue = ((value === null || value === void 0 ? void 0 : value.label) || []).join('/');
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
      title: addressValue
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-ellipsis")
    }, addressValue, " "))) : ( /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, addressValue, " ")));
  }
  // 定位组件字段渲染
  if (attrCode.startsWith('Location')) {
    return /*#__PURE__*/_react.default.createElement("div", {
      style: {
        cursor: 'pointer'
      }
    }, /*#__PURE__*/_react.default.createElement(_datapreview.LocationPreview, {
      data: value,
      platform: platform
    }, /*#__PURE__*/_react.default.createElement("div", {
      className: "".concat(cssClsPrefix, "-preview-btn"),
      style: {
        maxWidth: '100%',
        width: 'fit-content',
        display: 'flex',
        justifyContent: 'space-between',
        color: '#47e',
        background: 'rgba(68, 119, 238, 0.2)'
      }
    }, /*#__PURE__*/_react.default.createElement("img", {
      style: {
        width: '16px',
        height: '16px'
      },
      alt: "",
      src: _location.default
    }), /*#__PURE__*/_react.default.createElement("div", {
      style: {
        maxWidth: '100%',
        overflow: 'hidden',
        textOverflow: 'ellipsis',
        whiteSpace: 'nowrap',
        lineHeight: '20px'
      }
    }, value === null || value === void 0 ? void 0 : value.name))));
  }
  // 富文本组件字段渲染
  if (attrCode.startsWith('QuillEditor') || attrCode.startsWith('RichTextEditor')) {
    var htmlText = '';
    if (value) {
      var re = new RegExp('<[^<>]+>', 'g');
      htmlText = value.replace(re, '');
    }
    return /*#__PURE__*/_react.default.createElement("div", {
      style: {
        cursor: 'pointer',
        width: '100%'
      }
    }, /*#__PURE__*/_react.default.createElement(_datapreview.RichTextPreview, {
      data: value,
      platform: platform,
      title: "\u5BCC\u6587\u672C\u8BE6\u60C5"
    }, /*#__PURE__*/_react.default.createElement("div", {
      className: "".concat(cssClsPrefix, "-preview-btn"),
      style: {
        maxWidth: '100%',
        width: 'fit-content',
        display: 'flex',
        justifyContent: 'space-between',
        color: '#47e',
        background: 'rgba(68, 119, 238, 0.2)'
      }
    }, /*#__PURE__*/_react.default.createElement("img", {
      style: {
        width: '16px',
        height: '16px'
      },
      alt: "",
      src: _richText.default
    }), /*#__PURE__*/_react.default.createElement("div", {
      style: {
        maxWidth: '100%',
        overflow: 'hidden',
        textOverflow: 'ellipsis',
        whiteSpace: 'nowrap'
      }
    }, htmlText))));
  }
  // 多行文本组件字段渲染
  if (attrCode.startsWith('TextArea')) {
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
      title: dataSource
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-ellipsis")
    }, dataSource, " "))) : ( /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-cell")
    }, dataSource, " ")));
  }
  // 子表单组件字段渲染
  if (attrCode.startsWith('EditableTable') || attrCode.startsWith('SubForm')) {
    var editableTableColums = {};
    var _dslData4 = {};
    try {
      _dslData4 = JSON.parse(dsl);
    } catch (error) {
      _dslData4 = {};
    }
    var targetProps = (0, _dsl.getCompPropsById)(_dslData4.components, attrCode);
    if ((0, _tool.isPlainObject)(targetProps)) {
      if (attrCode.startsWith('SubForm')) {
        var _targetProps$subFormF = targetProps.subFormFields,
          subFormFields = _targetProps$subFormF === void 0 ? [] : _targetProps$subFormF;
        subFormFields.forEach(function (item) {
          var _ref = (item === null || item === void 0 ? void 0 : item.props) || {},
            fieldName = _ref.fieldName,
            name = _ref.name;
          editableTableColums[fieldName] = name;
        });
      }
      if (attrCode.startsWith('EditableTable')) {
        var _targetProps$tableIte = targetProps.tableItem,
          tableItem = _targetProps$tableIte === void 0 ? [] : _targetProps$tableIte;
        tableItem.forEach(function (item) {
          var _ref2 = (item === null || item === void 0 ? void 0 : item.props) || {},
            fieldName = _ref2.fieldName,
            name = _ref2.name;
          editableTableColums[fieldName] = name;
        });
      }
    }
    return /*#__PURE__*/_react.default.createElement(_datapreview.TablePreview, {
      title: "\u8868\u683C",
      data: value,
      columns: editableTableColums,
      platform: platform,
      getEngineApis: getEngineApis
    }, /*#__PURE__*/_react.default.createElement("span", {
      className: "".concat(cssClsPrefix, "-preview-btn"),
      style: {
        color: '#f88c2d',
        background: 'rgba(248, 140, 45, 0.3)'
      }
    }, /*#__PURE__*/_react.default.createElement("img", {
      style: {
        width: '16px',
        height: '16px'
      },
      alt: "",
      src: _table.default
    }), /*#__PURE__*/_react.default.createElement("span", null, value && Array.isArray(value) && value.length || 0)));
  }
  // 关联表单组件字段渲染
  if (attrCode.startsWith('BindTable')) {
    return /*#__PURE__*/_react.default.createElement(_DataQueryPreview.default, {
      value: value,
      dsl: dsl,
      attrCode: attrCode,
      platform: platform,
      getEngineApis: getEngineApis
    });
  }
  var value2 = value;
  if ((0, _tool.isPlainObject)(value) || Array.isArray(value)) {
    value2 = JSON.stringify(value);
  } else if (value === true || value === false) {
    // 关联数据选择表单为外部数据源且字段为开关时
    value2 = String(value);
  }
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ellipsis ? ( /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
    title: value2
  }, /*#__PURE__*/_react.default.createElement("span", {
    className: "".concat(cssClsPrefix, "-ellipsis")
  }, value2))) : ( /*#__PURE__*/_react.default.createElement("span", {
    className: "".concat(cssClsPrefix, "-cell")
  }, value2)));
  // TODO: 其他组件有需要再处理
};
var _default = exports.default = ColumnsRender;