test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-01 03:29:39 +08:00
Code Issues Actions 69 Packages Projects Releases Wiki Activity

improve transfer operation implement

Browse Source
This commit is contained in:
afc163 2015-12-24 15:23:26 +08:00
parent 7156c7526d
commit 50565eef0f
1 changed files with 32 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
components/transfer/operation.jsx
View File

@ -7,13 +7,39 @@ function noop() {
class TransferOperation extends Component {
render() {
const { moveToLeft, moveToRight, leftArrowText, rightArrowText, leftActive, rightActive, prefixCls, height } = this.props;
const {
moveToLeft,
moveToRight,
leftArrowText,
rightArrowText,
leftActive,
rightActive,
prefixCls,
} = this.props;
return <div className={`${prefixCls}`} style={{marginTop: (height + 35) / 2 - 24}}>
{ rightArrowText ? <Button type="primary" style={{ 'marginBottom': '4px' }} disabled={ !rightActive ? 'disabled' : false } onClick={moveToRight}>{rightArrowText}<Icon type="right" /></Button> :
<Button type="primary" style={{ 'marginBottom': '4px' }} disabled={ !rightActive ? 'disabled' : false } onClick={moveToRight}><Icon type="right" /></Button>}
{leftArrowText ? <Button type="primary" disabled={ !leftActive ? 'disabled' : false } onClick={moveToLeft}><Icon type="left" />{leftArrowText}</Button> :
<Button type="primary" disabled={ !leftActive ? 'disabled' : false } onClick={moveToLeft}><Icon type="left" /></Button>}
const moveToLeftButton = (
<Button type="primary" disabled={!leftActive} onClick={moveToLeft}>
{
leftArrowText
? <Icon type="left" /> + leftArrowText
: <Icon type="left" />
}
</Button>
);
const moveToRightButton = (
<Button type="primary" disabled={!rightActive} onClick={moveToRight}>
{
rightArrowText
? rightArrowText + <Icon type="right" />
: <Icon type="right" />
}
</Button>
);
return <div className={prefixCls}>
{moveToLeftButton}
{moveToRightButton}
</div>;
}
}
@ -22,7 +48,6 @@ TransferOperation.defaultProps = {
prefixCls: 'ant-transfer-operation',
leftArrowText: '',
rightArrowText: '',
height: 150,
moveToLeft: noop,
moveToRight: noop,
};