@51yzone/pc-components/es/modal-detail/detail.js

An enterprise-class UI design language and React-based implementation

import _extends from "@babel/runtime/helpers/extends";
import "antd/es/descriptions/style";
import _Descriptions from "antd/es/descriptions";
import "antd/es/image/style";
import _Image from "antd/es/image";

/**
 * 关键字：详情页
 * 新增人：徐友万
 * 完善中
 */
import React from 'react';
import classnames from 'classnames';

// 渲染子节点DescriptionItem
var renderChild = function renderChild(item) {
  var newValue = item.value;

  if (item.isImg) {
    // 不是数组先转换成数组
    if (!Array.isArray(newValue)) {
      newValue = [newValue];
    }

    newValue = newValue.map(function (n) {
      var image = n;

      if (image.attchUrlUncompressWithoutWatermark) {
        image.url = n.attchUrl;
        image.uid = n.attchId;
        image.previewUrl = n.attchUrlUncompressWithoutWatermark;
      }

      return /*#__PURE__*/React.createElement(_Image, {
        key: image.uid,
        width: 100,
        height: 100,
        src: image.url,
        preview: {
          src: image.previewUrl || image.url
        }
      });
    });
  }

  return /*#__PURE__*/React.createElement(_Descriptions.Item, {
    key: item.label,
    label: item.label,
    span: item.span || 1
  }, newValue);
}; // 渲染外层节点Descriptions


var renderDetail = function renderDetail(data) {
  return data.map(function (n) {
    return /*#__PURE__*/React.createElement(_Descriptions, _extends({}, n, {
      key: n.key,
      column: n.column || 2
    }), Boolean(n.children && n.children.length) && n.children.map(function (m) {
      return renderChild(m);
    }));
  });
};

var Detail = function Detail(props) {
  var _props$value = props.value,
      value = _props$value === void 0 ? [] : _props$value,
      prefixCls = props.prefixCls,
      className = props.className,
      style = props.style;
  return /*#__PURE__*/React.createElement("div", {
    className: classnames(className, "".concat(prefixCls, "-wrapper")),
    style: style
  }, renderDetail(value));
};

Detail.defaultProps = {
  value: [],
  prefixCls: 'yz-detail',
  className: '',
  style: {}
};
export default Detail;