|
@@ -0,0 +1,52 @@
|
|
1
|
+import React from 'react';
|
|
2
|
+import { Upload, Icon, message } from 'antd';
|
|
3
|
+import './style.less';
|
|
4
|
+import { uploaderProps } from '../../utils/upload';
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+class ImageUpload extends React.Component {
|
|
9
|
+
|
|
10
|
+ state = {
|
|
11
|
+ loading: false,
|
|
12
|
+ fileList: [],
|
|
13
|
+ };
|
|
14
|
+
|
|
15
|
+ handleChange = info => {
|
|
16
|
+ this.setState({ fileList: info.fileList })
|
|
17
|
+ if (info.file.status === "uploading") {
|
|
18
|
+ this.setState({ loading: true });
|
|
19
|
+ return;
|
|
20
|
+ }
|
|
21
|
+ };
|
|
22
|
+
|
|
23
|
+ handleUploadSucess = (url) => {
|
|
24
|
+ console.log(url,"33-------")
|
|
25
|
+ if (typeof this.props.onChange === 'function') {
|
|
26
|
+ this.props.onChange(url);
|
|
27
|
+ }
|
|
28
|
+ }
|
|
29
|
+
|
|
30
|
+ render() {
|
|
31
|
+ const uploadButton = (
|
|
32
|
+ <div>
|
|
33
|
+ <Icon style={{ fontSize: '2em', color: '#aaa' }} type={this.state.loading ? "loading" : "plus"} />
|
|
34
|
+ </div>
|
|
35
|
+ );
|
|
36
|
+
|
|
37
|
+ return (
|
|
38
|
+ <Upload
|
|
39
|
+ {...uploaderProps}
|
|
40
|
+ listType="picture-card"
|
|
41
|
+ className="avatar-uploader"
|
|
42
|
+ onChange={this.handleChange}
|
|
43
|
+ fileList={this.state.fileList}
|
|
44
|
+ onSuccess={this.handleUploadSucess}
|
|
45
|
+ >
|
|
46
|
+ {this.state.fileList.length >= 1 ? null : uploadButton}
|
|
47
|
+ </Upload>
|
|
48
|
+ );
|
|
49
|
+ }
|
|
50
|
+}
|
|
51
|
+
|
|
52
|
+export default ImageUpload;
|