diff --git a/components/upload/demo/drag-simple.md b/components/upload/demo/drag-simple.md index 8bb6d29ec5..8b056bd477 100644 --- a/components/upload/demo/drag-simple.md +++ b/components/upload/demo/drag-simple.md @@ -27,5 +27,6 @@ ReactDOM.render( ````css #components-upload-demo-drag-simple { width: 246px; + height: 146px; } ```` diff --git a/components/upload/demo/drag.md b/components/upload/demo/drag.md index 4862b7039b..2cc89b0cba 100644 --- a/components/upload/demo/drag.md +++ b/components/upload/demo/drag.md @@ -27,3 +27,9 @@ ReactDOM.render( document.getElementById('components-upload-demo-drag') ); ```` + +````css +#components-upload-demo-drag { + height: 180px; +} +```` diff --git a/components/upload/index.jsx b/components/upload/index.jsx index baa877732a..c3ce31482c 100644 --- a/components/upload/index.jsx +++ b/components/upload/index.jsx @@ -180,15 +180,9 @@ const AntUpload = React.createClass({ } }, onFileDrop(e) { - if (e.type === 'dragover') { - this.setState({ - dragState: 'dragover' - }); - } else { - this.setState({ - dragState: 'drop' - }); - } + this.setState({ + dragState: e.type + }); }, clearProgressTimer() { clearInterval(this.progressTimer); @@ -206,37 +200,38 @@ const AntUpload = React.createClass({ uploadList = ; } if (type === 'drag') { - let dragUploadingClass = ''; - let fileList = this.state.fileList; - const dragState = this.state.dragState; - for (let i = 0; i < fileList.length; i ++) { - if (fileList[i].status === 'uploading') { - dragUploadingClass = ` ${prefixCls}-drag-uploading ${dragState === 'drop' ? '' : `${prefixCls}-drag-hover`}`; - break; - } - } + let dragUploadingClass = this.state.fileList.some((file) => { + return file.status === 'uploading'; + }) ? `${prefixCls}-drag-uploading` : ''; + + let draggingClass = this.state.dragState === 'dragover' + ? `${prefixCls}-drag-hover` : ''; return ( -
-
+ +
{this.props.children}
- { uploadList } -
+ {uploadList} + ); } else if (type === 'select') { return ( -
+
{this.props.children}
- { uploadList } -
+ {uploadList} + ); } } diff --git a/package.json b/package.json index 7563f6feb9..50800d001a 100644 --- a/package.json +++ b/package.json @@ -60,7 +60,7 @@ "rc-tooltip": "~3.1.0", "rc-tree": "~0.18.1", "rc-trigger": "~1.0.6", - "rc-upload": "~1.6.4", + "rc-upload": "~1.7.0", "rc-util": "~3.0.1", "react-slick": "~0.9.1", "reqwest": "~2.0.5", diff --git a/style/components/upload.less b/style/components/upload.less index 1489d83305..25e98f37b6 100644 --- a/style/components/upload.less +++ b/style/components/upload.less @@ -17,16 +17,16 @@ &.@{upload-prefix-cls}-drag { border: 1px dashed #d9d9d9; - transition: all 0.3s ease; + transition: border-color 0.3s ease; cursor: pointer; border-radius: @border-radius-base; text-align: center; width: 100%; - height: 180px; + height: 100%; position: relative; &.@{upload-prefix-cls}-drag-hover { - border-color: tint(@primary-color, 20%); + border: 2px dashed tint(@primary-color, 20%); } > span {