ant-design/components/card/index.jsx

40 lines
1.3 KiB
React
Raw Normal View History

2016-02-19 19:35:49 +08:00
import React from 'react';
import classNames from 'classnames';
export default props => {
2016-04-10 15:38:52 +08:00
let { prefixCls = 'ant-card', className, children, extra, bodyStyle,
title, loading, bordered = true, ...other } = props;
2016-02-19 19:35:49 +08:00
const classString = classNames({
[prefixCls]: true,
[className]: !!className,
2016-02-22 16:25:13 +08:00
[`${prefixCls}-loading`]: loading,
2016-04-10 15:38:52 +08:00
[`${prefixCls}-bordered`]: bordered,
2016-02-19 19:35:49 +08:00
});
2016-02-22 16:25:13 +08:00
if (loading) {
children = (
<div>
2016-03-30 19:06:05 +08:00
<p></p>
2016-02-22 16:25:13 +08:00
<p> </p>
2016-03-30 19:06:05 +08:00
<p> </p>
2016-02-22 16:25:13 +08:00
<p>  </p>
2016-03-30 19:06:05 +08:00
<p>  </p>
2016-02-22 16:25:13 +08:00
</div>
);
}
2016-02-20 16:40:18 +08:00
const head = title ? (
<div className={`${prefixCls}-head`}>
<h3 className={`${prefixCls}-head-title`}>{title}</h3>
</div>
) : null;
2016-02-22 16:25:13 +08:00
2016-02-19 19:35:49 +08:00
return (
<div {...other} className={classString}>
2016-02-20 16:40:18 +08:00
{head}
{extra ? <div className={`${prefixCls}-extra`}>{extra}</div> : null}
<div className={`${prefixCls}-body`} style={bodyStyle}>{children}</div>
2016-02-19 19:35:49 +08:00
</div>
);
};