ps-frame-father/lib/components/Badge/index.js

An enterprise-class UI design language and React components implementation

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

var _react = _interopRequireDefault(require("react"));

var _classnames = _interopRequireDefault(require("classnames"));

var _propTypes = _interopRequireDefault(require("prop-types"));

require("./index.css");

var colorArr = {
  'success': '#52c41a',
  'warning': '#faad14',
  'error': '#f5222d',
  'default': '#d9d9d9',
  'processing': '#1890ff'
};
/**
 * 徽标数组件
 * @param {style} 更改badge样式
 * @param {color} 自定义小圆点的颜色
 * @param {count} 展示的数字
 * @param {dot} 不展示数字,只展示一个小圆点
 * @param {offset} 设置状态点的偏移
 * @param {overflowCount} 展示封顶的数字
 * @param {showZero} 当数值为0时是否展示Badge
 * @param {status} 设置badge为状态点, 类型有success|warning|error|default|processing
 * @param {text} 当设置status时状态点的文本
 */

function Badge(props) {
  var color = props.color,
      _props$count = props.count,
      count = _props$count === void 0 ? 0 : _props$count,
      dot = props.dot,
      offset = props.offset,
      overflowCount = props.overflowCount,
      showZero = props.showZero,
      status = props.status,
      text = props.text,
      style = props.style,
      children = props.children;
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "xBadgeWrap"
  }, status || color ? /*#__PURE__*/_react.default.createElement("div", {
    className: "statusDotWrap"
  }, /*#__PURE__*/_react.default.createElement("span", {
    className: "dot",
    style: {
      backgroundColor: color || colorArr[status] || colorArr.default
    }
  }), text) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", {
    className: (0, _classnames.default)('badge', dot ? 'badgeDot' : ''),
    style: (0, _objectSpread2.default)({
      right: offset ? offset[0] + 'px' : '',
      top: offset ? offset[1] + 'px' : '',
      display: !showZero && !count ? 'none' : 'inline-block'
    }, style)
  }, !dot && (overflowCount && overflowCount < count ? "".concat(overflowCount, "+") : count)), children));
}

Badge.propTypes = {
  style: _propTypes.default.object,
  color: _propTypes.default.string,
  count: _propTypes.default.number,
  dot: _propTypes.default.bool,
  offset: _propTypes.default.array,
  overflowCount: _propTypes.default.number,
  showZero: _propTypes.default.bool,
  status: _propTypes.default.string,
  zIndex: _propTypes.default.number,
  text: _propTypes.default.string
};
var _default = Badge;
exports.default = _default;