tntd/es/page/Box.js

tntd是基于 TNT Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _utils = require("./utils");
var _card = _interopRequireDefault(require("../card"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
var __rest = void 0 && (void 0).__rest || function (s, e) {
  var t = {};
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  }
  return t;
};
var Box = function Box(_a) {
  var inLayout = _a.inLayout,
    _a$clsPrefix = _a.clsPrefix,
    clsPrefix = _a$clsPrefix === void 0 ? 'tntd-page' : _a$clsPrefix,
    children = _a.children,
    _a$noPadding = _a.noPadding,
    noPadding = _a$noPadding === void 0 ? false : _a$noPadding,
    headerHeight = _a.headerHeight,
    _a$bordered = _a.bordered,
    bordered = _a$bordered === void 0 ? false : _a$bordered,
    _a$bodyStyle = _a.bodyStyle,
    bodyStyle = _a$bodyStyle === void 0 ? {} : _a$bodyStyle,
    _a$headStyle = _a.headStyle,
    headStyle = _a$headStyle === void 0 ? {} : _a$headStyle,
    height = _a.height,
    _a$size = _a.size,
    size = _a$size === void 0 ? 'small' : _a$size,
    _a$contentTotalMargin = _a.contentTotalMargin,
    contentTotalMargin = _a$contentTotalMargin === void 0 ? '0px' : _a$contentTotalMargin,
    restProps = __rest(_a, ["inLayout", "clsPrefix", "children", "noPadding", "headerHeight", "bordered", "bodyStyle", "headStyle", "height", "size", "contentTotalMargin"]);
  var cardTitleHeight = 0;
  if (restProps.title) {
    // 根据Card的size,计算Card的title的高度值
    cardTitleHeight = size === 'small' ? 40 : 60;
    // 如果Card的自定义高度，Card的title就使用此高度
    if (headStyle.hasOwnProperty(height)) {
      cardTitleHeight = headStyle.height;
    }
  }
  // 如果设置了noPadding，优先级最高
  if (noPadding) {
    bodyStyle.padding = 0;
    headStyle.padding = 0;
  }
  // 如果传入只有数字，需要默认加px
  cardTitleHeight = (0, _utils.addUnitForValue)(cardTitleHeight);
  var cardBodyHeight = "calc(".concat(height, " - ").concat(headerHeight, " - ").concat(contentTotalMargin, " - ").concat(cardTitleHeight, ")");
  return _react["default"].createElement(_card["default"], Object.assign({
    className: "".concat(clsPrefix, "-box-card"),
    bordered: bordered,
    bodyStyle: Object.assign(Object.assign({}, bodyStyle), {
      // overflow: 'auto',
      height: inLayout ? "calc(100% - ".concat(headerHeight, ")") : cardBodyHeight
    }),
    size: size,
    headStyle: headStyle
  }, restProps), children);
};
var _default = exports["default"] = Box;