fastlion-amis
Version:
一种MIS页面生成工具
88 lines (87 loc) • 5.94 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Card = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var helper_1 = require("../utils/helper");
var theme_1 = require("../theme");
var Card = /** @class */ (function (_super) {
(0, tslib_1.__extends)(Card, _super);
function Card(props) {
var _this = _super.call(this, props) || this;
_this.handleClick = _this.handleClick.bind(_this);
return _this;
}
Card.prototype.handleClick = function (e) {
if ((0, helper_1.isClickOnInput)(e)) {
return;
}
this.props.onClick && this.props.onClick(e);
};
Card.prototype.render = function () {
var _a, _b;
var _c = this.props, cx = _c.classnames, className = _c.className, headerClassName = _c.headerClassName, bodyClassName = _c.bodyClassName, titleClassName = _c.titleClassName, subTitleClassName = _c.subTitleClassName, descriptionClassName = _c.descriptionClassName, avatarClassName = _c.avatarClassName, avatarTextStyle = _c.avatarTextStyle, imageClassName = _c.imageClassName, avatarTextClassName = _c.avatarTextClassName, secondaryClassName = _c.secondaryClassName, footerClassName = _c.footerClassName, media = _c.media, mediaPosition = _c.mediaPosition, actions = _c.actions, children = _c.children, onClick = _c.onClick, toolbar = _c.toolbar, title = _c.title, subTitle = _c.subTitle, subTitlePlaceholder = _c.subTitlePlaceholder, description = _c.description, descriptionPlaceholder = _c.descriptionPlaceholder, secondary = _c.secondary, avatar = _c.avatar, avatarText = _c.avatarText, env = _c.env;
var baseUrl = ((_b = (_a = env === null || env === void 0 ? void 0 : env.axiosInstance) === null || _a === void 0 ? void 0 : _a.defaults) === null || _b === void 0 ? void 0 : _b.baseURL) || (env === null || env === void 0 ? void 0 : env.ajaxApi);
var heading = null;
var isShowHeading = avatar ||
avatarText ||
title ||
subTitle ||
subTitlePlaceholder ||
description ||
descriptionPlaceholder ||
toolbar;
if (isShowHeading) {
heading = (react_1.default.createElement("div", { className: cx('Card-heading', headerClassName) },
avatar ? (react_1.default.createElement("span", { className: cx('Card-avtar', avatarClassName) },
react_1.default.createElement("img", { className: cx('Card-img', imageClassName), src: (baseUrl ? baseUrl : '') + avatar }))) : avatarText ? (react_1.default.createElement("span", { className: cx('Card-avtarText', avatarTextClassName), style: avatarTextStyle }, avatarText)) : null,
react_1.default.createElement("div", { className: cx('Card-meta') },
title ? (react_1.default.createElement("div", { className: cx('Card-title', titleClassName) }, title)) : null,
subTitle || subTitlePlaceholder ? (react_1.default.createElement("div", { className: cx('Card-subTitle', subTitleClassName) }, subTitle
? subTitle
: subTitlePlaceholder
? subTitlePlaceholder
: null)) : null,
description || descriptionPlaceholder ? (react_1.default.createElement("div", { className: cx('Card-desc', descriptionClassName) }, description
? description
: descriptionPlaceholder
? descriptionPlaceholder
: null)) : null),
toolbar));
}
var body = children;
return (react_1.default.createElement("div", { onClick: this.handleClick, className: cx('Card', className, {
'Card--link': onClick
}) }, media ? (react_1.default.createElement("div", { className: cx("Card-multiMedia--" + mediaPosition) },
media,
react_1.default.createElement("div", { className: cx('Card-multiMedia-flex') },
heading,
body ? (react_1.default.createElement("div", { className: cx('Card-body', bodyClassName) }, body)) : null,
secondary || actions ? (react_1.default.createElement("div", { className: cx('Card-footer-wrapper', footerClassName) },
secondary ? (react_1.default.createElement("div", { className: cx('Card-secondary', secondaryClassName) }, secondary)) : null,
actions ? (react_1.default.createElement("div", { className: cx('Card-actions-wrapper') }, actions)) : null)) : null))) : (react_1.default.createElement(react_1.default.Fragment, null,
heading,
body ? (react_1.default.createElement("div", { className: cx('Card-body', bodyClassName) }, body)) : null,
secondary || actions ? (react_1.default.createElement("div", { className: cx('Card-footer-wrapper', footerClassName) },
secondary ? (react_1.default.createElement("div", { className: cx('Card-secondary', secondaryClassName) }, secondary)) : null,
actions ? (react_1.default.createElement("div", { className: cx('Card-actions-wrapper') }, actions)) : null)) : null))));
};
Card.defaultProps = {
className: '',
avatarClassName: '',
headerClassName: '',
footerClassName: '',
secondaryClassName: '',
avatarTextClassName: '',
bodyClassName: '',
titleClassName: '',
subTitleClassName: '',
descriptionClassName: '',
imageClassName: '',
mediaPosition: 'left'
};
return Card;
}(react_1.default.Component));
exports.Card = Card;
exports.default = (0, theme_1.themeable)(Card);
//# sourceMappingURL=./components/Card.js.map