card 支持 avtarText

This commit is contained in:
2betop 2020-03-05 20:36:07 +08:00
parent 965296f9c3
commit 7cfea50897
2 changed files with 30 additions and 3 deletions

View File

@ -66,6 +66,21 @@
}
}
&-avtarText {
background-color: $primary;
color: $white;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
vertical-align: middle;
border-radius: 500px;
float: left;
margin-right: $gap-base;
font-size: $fontSizeXl;
text-transform: uppercase();
}
&-meta {
display: block;
height: 100%;

View File

@ -280,9 +280,12 @@ export class Card extends React.Component<CardProps> {
subTitleClassName,
descClassName,
checkOnItemClick,
avatarClassName,
checkable,
classnames: cx,
classPrefix: ns
classPrefix: ns,
imageClassName,
avatarTextClassName
} = this.props;
let heading = null;
@ -291,8 +294,7 @@ export class Card extends React.Component<CardProps> {
const {
highlight: highlightTpl,
avatar: avatarTpl,
avatarClassName,
imageClassName,
avatarText: avatarTextTpl,
title: titleTpl,
subTitle: subTitleTpl,
subTitlePlaceholder,
@ -302,6 +304,7 @@ export class Card extends React.Component<CardProps> {
const highlight = !!evalExpression(highlightTpl, data as object);
const avatar = filter(avatarTpl, data);
const avatarText = filter(avatarTextTpl, data);
const title = filter(titleTpl, data);
const subTitle = filter(subTitleTpl, data);
const desc = filter(descTpl, data);
@ -323,6 +326,15 @@ export class Card extends React.Component<CardProps> {
src={avatar}
/>
</span>
) : avatarText ? (
<span
className={cx(
'Card-avtarText',
header.avatarTextClassName || avatarTextClassName
)}
>
{avatarText}
</span>
) : null}
<div className={cx('Card-meta')}>
{highlight ? (