2015-08-09 18:00:20 +08:00
|
|
|
import React from 'react';
|
2015-08-21 16:19:28 +08:00
|
|
|
import getFileItem from './getFileItem';
|
2015-08-09 18:00:20 +08:00
|
|
|
const prefixCls = 'ant-upload';
|
2015-08-21 17:12:42 +08:00
|
|
|
import Animate from 'rc-animate';
|
2015-08-09 18:00:20 +08:00
|
|
|
|
|
|
|
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) {
|
2015-08-09 18:00:20 +08:00
|
|
|
let items = this.state.items;
|
2015-08-21 16:19:28 +08:00
|
|
|
let removeItem = getFileItem(file, items);
|
2015-08-09 18:23:18 +08:00
|
|
|
if (removeItem) {
|
2015-08-21 16:19:28 +08:00
|
|
|
items.splice(items.indexOf(removeItem), 1);
|
2015-08-09 18:23:18 +08:00
|
|
|
}
|
2015-08-09 18:00:20 +08:00
|
|
|
this.setState({
|
|
|
|
items: items
|
|
|
|
});
|
2015-08-27 15:45:38 +08:00
|
|
|
this.props.onRemove(file.file);
|
2015-08-09 18:00:20 +08:00
|
|
|
},
|
|
|
|
render() {
|
2015-08-21 16:19:28 +08:00
|
|
|
let items = this.state.items;
|
|
|
|
let downloadItem = (file) => {
|
2015-08-27 15:45:38 +08:00
|
|
|
let statusIcon = file.status === 'done' ? <i className={'anticon anticon-check ' + prefixCls + '-success-icon'}></i> :
|
|
|
|
<i className="anticon anticon-loading"></i>;
|
2015-08-09 18:00:20 +08:00
|
|
|
return (
|
2015-08-21 16:19:28 +08:00
|
|
|
<div className={prefixCls + '-list-item'} key={file.index}>
|
2015-08-09 18:00:20 +08:00
|
|
|
{statusIcon}
|
2015-08-21 16:43:18 +08:00
|
|
|
<b className={prefixCls + '-item-name'}>{file.filename}</b>
|
2015-08-18 17:06:23 +08:00
|
|
|
<i className="anticon anticon-cross" ref="theCloseBtn"
|
2015-08-21 17:37:54 +08:00
|
|
|
onClick={this.handleClose.bind(this, file)}></i>
|
2015-08-09 18:00:20 +08:00
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
2015-08-21 17:12:42 +08:00
|
|
|
return (<div className={prefixCls + '-list'}>
|
2015-08-21 17:37:54 +08:00
|
|
|
<Animate transitionName={prefixCls + '-margin-top'}>
|
|
|
|
{items.map(downloadItem)}
|
2015-08-21 17:12:42 +08:00
|
|
|
</Animate>
|
|
|
|
</div>);
|
2015-08-09 18:00:20 +08:00
|
|
|
}
|
|
|
|
});
|