@fle-ui/pro-layout/lib/components/proCard/index.js

@fle-ui/pro-layout

"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }

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

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

var _next = require("@fle-ui/next");

var _icons = require("@ant-design/icons");

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

require("./index.less");

var _excluded = ["colSpan", "gutter", "justify", "align", "wrap", "dividertype", "spaceSize", "cardSize", "tooltip", "children", "title", "style", "headBordered", "ghost", "direction", "contentLayout"];

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

var TabPane = _next.Tabs.TabPane;

var ProCard = function ProCard(props) {
  var _classnames;

  var colSpan = props.colSpan,
      gutter = props.gutter,
      justify = props.justify,
      align = props.align,
      wrap = props.wrap,
      dividertype = props.dividertype,
      spaceSize = props.spaceSize,
      cardSize = props.cardSize,
      tooltip = props.tooltip,
      children = props.children,
      title = props.title,
      style = props.style,
      headBordered = props.headBordered,
      ghost = props.ghost,
      direction = props.direction,
      contentLayout = props.contentLayout,
      resetCardProps = _objectWithoutProperties(props, _excluded);

  var renderCardTitle = function renderCardTitle(title, tooltip) {
    if (tooltip) {
      return /*#__PURE__*/_react.default.createElement(_next.Space, null, /*#__PURE__*/_react.default.createElement("span", null, title), /*#__PURE__*/_react.default.createElement(_next.Tooltip, {
        placement: "top",
        title: tooltip
      }, /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_icons.QuestionCircleOutlined, null))));
    }

    return title;
  };

  var getBodyStyle = function getBodyStyle() {
    if (dividertype || ghost) {
      return {
        padding: 0
      };
    }

    return {};
  };

  var cardProps = _objectSpread(_objectSpread({}, resetCardProps), {}, {
    size: cardSize,
    title: renderCardTitle(title, tooltip),
    style: _objectSpread({}, style),
    headStyle: {
      borderBottom: headBordered ? '1px solid rgb(240, 240, 240)' : 'none'
    },
    bodyStyle: {
      padding: getBodyStyle()
    }
  });

  var containerCardProps = _objectSpread({}, cardProps);

  var rowProps = {
    gutter: gutter,
    justify: justify,
    align: align,
    wrap: wrap
  };
  var colProps = {
    span: colSpan
  };
  var prefixCls = 'pro-card';
  var containerClass = (0, _classnames3.default)(prefixCls, (_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-ghost"), ghost), _defineProperty(_classnames, "".concat(prefixCls, "-").concat(contentLayout), contentLayout), _classnames));
  var classNames = (0, _classnames3.default)("".concat(prefixCls, "-wrapper"), _defineProperty({}, "".concat(prefixCls, "-").concat(direction, "-wrapper"), direction));

  var renderLayoutRow = function renderLayoutRow(rowProps, colProps, children) {
    return /*#__PURE__*/_react.default.createElement(_next.Row, _extends({}, rowProps, {
      className: classNames
    }), renderLayoutCols(colProps, children));
  };

  var renderLayoutCols = function renderLayoutCols(colProps, children) {
    return _react.Children.map(children, function (child) {
      return /*#__PURE__*/_react.default.createElement(_next.Col, colProps, child);
    });
  }; // 只要在card内部进行嵌套card时才会渲染布局


  var renderCardInnerLayout = function renderCardInnerLayout(children) {
    var reactNodes = _react.Children.toArray(children);

    var ComponentName = 'ProCard'; // 内部只要出现了procard嵌套就会开启响应式布局渲染

    var hasRenderLayout = reactNodes.some(function (reactNode) {
      var _reactNode$type = reactNode.type,
          type = _reactNode$type === void 0 ? {} : _reactNode$type;
      var displayName = type.displayName,
          name = type.name;
      return displayName === ComponentName || name === ComponentName;
    });

    if (hasRenderLayout) {
      return renderLayoutRow(rowProps, colProps, children);
    }

    return children;
  };

  return /*#__PURE__*/_react.default.createElement(_next.Card, _extends({
    className: containerClass
  }, containerCardProps), renderCardInnerLayout(children));
};

ProCard.defaultProps = {
  colSpan: 24,
  gutter: 0,
  justify: 'start',
  align: 'top',
  wrap: true,
  spaceSize: 'small',
  bordered: true,
  hoverable: false,
  loading: false,
  cardSize: 'default',
  headBordered: true,
  ghost: false
};
ProCard.displayName = 'ProCard';
var _default = ProCard;
exports.default = _default;