choerodon-ui/pro/es/upload/UploadList.js

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

import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _extends from "@babel/runtime/helpers/extends";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _inherits from "@babel/runtime/helpers/inherits";
import _createSuper from "@babel/runtime/helpers/createSuper";
import React from 'react';
import classnames from 'classnames';
import { FormField } from '../field/FormField';
import Icon from '../icon';
import Progress from '../progress';
import { Size } from '../core/enum';

var UploadList = /*#__PURE__*/function (_FormField) {
  _inherits(UploadList, _FormField);

  var _super = _createSuper(UploadList);

  function UploadList() {
    _classCallCheck(this, UploadList);

    return _super.apply(this, arguments);
  }

  _createClass(UploadList, [{
    key: "render",
    value: function render() {
      var prefixCls = this.prefixCls,
          _this$props = this.props,
          items = _this$props.items,
          remove = _this$props.remove,
          showPreviewImage = _this$props.showPreviewImage,
          previewImageWidth = _this$props.previewImageWidth;
      var list = items.map(function (file) {
        var _classnames2;

        var previewImg;
        var progress;
        var removeIcon;
        var progressProps = {
          value: file.percent,
          size: Size.small,
          showInfo: false
        };

        if (showPreviewImage && file.type.startsWith('image')) {
          // temporarily set img[width] to 100
          previewImg = /*#__PURE__*/React.createElement("img", {
            width: previewImageWidth,
            alt: file.filename,
            src: file.url
          });
        }

        if (file.status === 'uploading') {
          progress = /*#__PURE__*/React.createElement("div", {
            className: "".concat(prefixCls, "-item-progress")
          }, /*#__PURE__*/React.createElement(Progress, _extends({}, progressProps)));
        } else {
          var rmProps = {
            className: classnames("".concat(prefixCls, "-item-icon"), _defineProperty({}, "".concat(prefixCls, "-item-remove"), true)),
            type: 'close',
            onClick: function onClick() {
              remove(file);
            }
          };
          removeIcon = /*#__PURE__*/React.createElement(Icon, _extends({}, rmProps));
        }

        var listProps = {
          className: classnames("".concat(prefixCls, "-item"), (_classnames2 = {}, _defineProperty(_classnames2, "".concat(prefixCls, "-item-error"), file.status === 'error'), _defineProperty(_classnames2, "".concat(prefixCls, "-item-success"), file.status === 'success'), _classnames2))
        };
        return /*#__PURE__*/React.createElement("div", _extends({}, listProps, {
          key: file.uid
        }), previewImg, /*#__PURE__*/React.createElement("span", {
          className: "".concat(prefixCls, "-item-name")
        }, file.name), progress, removeIcon);
      });
      var listWrapperCls = items.length ? "".concat(prefixCls) : "".concat(prefixCls, "-empty");
      return /*#__PURE__*/React.createElement("div", {
        className: listWrapperCls
      }, list);
    }
  }]);

  return UploadList;
}(FormField);

export { UploadList as default };
UploadList.displayName = 'UploadList';
UploadList.defaultProps = _objectSpread(_objectSpread({}, FormField.defaultProps), {}, {
  suffixCls: 'upload-list',
  items: []
});
//# sourceMappingURL=UploadList.js.map