ant-design/components/upload/uploadList.jsx

52 lines
1.3 KiB
React
Raw Normal View History

import React from 'react';
2015-08-21 17:12:42 +08:00
import Animate from 'rc-animate';
2015-10-02 16:52:34 +08:00
import Icon from '../iconfont';
const prefixCls = 'ant-upload';
export default React.createClass({
getDefaultProps() {
return {
items: []
};
},
getInitialState() {
return {
items: this.props.items
};
},
componentWillReceiveProps(nextProps) {
if ('items' in nextProps) {
this.setState({
items: nextProps.items
});
}
},
2015-08-09 18:23:18 +08:00
handleClose(file) {
this.props.onRemove(file);
},
render() {
2015-08-31 18:13:16 +08:00
let list = this.state.items.map((file) => {
let statusIcon = file.status === 'done' ?
2015-10-02 16:52:34 +08:00
<Icon type="check" className={prefixCls + '-success-icon'} /> :
<Icon type="loading" />;
let filename = file.url ?
2015-10-23 16:31:15 +08:00
<a className={prefixCls + '-item-name'} href={file.url} target="_blank">{file.name}</a> :
2015-08-31 21:26:34 +08:00
<b className={prefixCls + '-item-name'}>{file.name}</b>;
return (
2015-08-31 21:26:34 +08:00
<div className={prefixCls + '-list-item'} key={file.uid}>
{statusIcon}
{filename}
2015-10-02 16:52:34 +08:00
<Icon type="cross" ref="thisCloseBtn" onClick={this.handleClose.bind(this, file)} />
</div>
);
2015-08-31 18:13:16 +08:00
});
return <div className={prefixCls + '-list'}>
2015-08-21 17:37:54 +08:00
<Animate transitionName={prefixCls + '-margin-top'}>
2015-08-31 18:13:16 +08:00
{list}
2015-08-21 17:12:42 +08:00
</Animate>
</div>;
}
});