@ecoding/components.antd 0.5.0 → 0.5.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { UploadFile } from 'antd';
|
|
3
2
|
interface IOpts {
|
|
4
3
|
size?: number;
|
|
5
4
|
w?: number;
|
|
@@ -17,17 +16,18 @@ interface IProps {
|
|
|
17
16
|
actionParams?: any;
|
|
18
17
|
i18n?: any;
|
|
19
18
|
opts?: IOpts;
|
|
20
|
-
value?:
|
|
19
|
+
value?: any[];
|
|
21
20
|
headers?: any;
|
|
22
21
|
data?: any;
|
|
23
22
|
gif?: boolean;
|
|
24
23
|
disabled?: boolean;
|
|
24
|
+
objectInValue?: boolean;
|
|
25
25
|
type?: string;
|
|
26
26
|
name?: string;
|
|
27
27
|
action: string | (() => string);
|
|
28
28
|
buttonText?: string;
|
|
29
29
|
maxCount?: number;
|
|
30
|
-
onChange?: (infos:
|
|
30
|
+
onChange?: (infos: any[] | undefined) => void;
|
|
31
31
|
}
|
|
32
32
|
/**
|
|
33
33
|
* @returns 返回地址的string
|
|
@@ -35,33 +35,53 @@ const DraggableUploadListItem = ({ originNode, file, disabled }) => {
|
|
|
35
35
|
*/
|
|
36
36
|
const MultipleImgUpload = (props) => {
|
|
37
37
|
var _a, _b, _c, _d;
|
|
38
|
-
const { i18n, name, buttonText, maxCount, disabled, value, onChange } = props;
|
|
38
|
+
const { i18n, name, buttonText, maxCount, disabled, value, onChange, objectInValue } = props;
|
|
39
39
|
const [previewOpen, setPreviewOpen] = useState(false);
|
|
40
40
|
const [previewImage, setPreviewImage] = useState('');
|
|
41
|
-
const [imgList, setImgList] = useState((
|
|
42
|
-
if (
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
41
|
+
const [imgList, setImgList] = useState(() => {
|
|
42
|
+
if (value && value.length > 0) {
|
|
43
|
+
const temp = [];
|
|
44
|
+
value.forEach((item, index) => {
|
|
45
|
+
if (typeof item === "string" && item) {
|
|
46
|
+
temp.push({
|
|
47
|
+
uid: String(index),
|
|
48
|
+
status: 'done',
|
|
49
|
+
url: item,
|
|
50
|
+
name: item.substring(item.lastIndexOf('/') + 1, item.lastIndexOf('.'))
|
|
51
|
+
});
|
|
52
|
+
}
|
|
53
|
+
else {
|
|
54
|
+
if (item.url) {
|
|
55
|
+
temp.push(item);
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
});
|
|
59
|
+
return temp;
|
|
52
60
|
}
|
|
53
|
-
|
|
61
|
+
return [];
|
|
62
|
+
});
|
|
54
63
|
const updateItems = (newItems) => {
|
|
55
64
|
setImgList(newItems);
|
|
56
65
|
let isEmpty = true;
|
|
57
|
-
const
|
|
58
|
-
|
|
66
|
+
const temp = [];
|
|
67
|
+
newItems && newItems.forEach((item) => {
|
|
68
|
+
if (item.url) {
|
|
69
|
+
temp.push(item);
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
temp.forEach((item) => {
|
|
59
73
|
if (item) {
|
|
60
74
|
isEmpty = false;
|
|
61
75
|
return;
|
|
62
76
|
}
|
|
63
77
|
});
|
|
64
|
-
|
|
78
|
+
if (objectInValue) {
|
|
79
|
+
onChange && onChange(!isEmpty ? temp : undefined);
|
|
80
|
+
}
|
|
81
|
+
else {
|
|
82
|
+
const urls = temp.map((item) => item.url);
|
|
83
|
+
onChange && onChange(!isEmpty ? urls : undefined);
|
|
84
|
+
}
|
|
65
85
|
};
|
|
66
86
|
const handleChange = ({ fileList }) => {
|
|
67
87
|
fileList && fileList.forEach((file) => {
|
|
@@ -73,6 +93,10 @@ const MultipleImgUpload = (props) => {
|
|
|
73
93
|
response.successed) {
|
|
74
94
|
const data = response.data || response.model;
|
|
75
95
|
file.url = data.url;
|
|
96
|
+
delete file.response;
|
|
97
|
+
delete file.xhr;
|
|
98
|
+
delete file.lastModifiedDate;
|
|
99
|
+
delete file.originFileObj;
|
|
76
100
|
}
|
|
77
101
|
}
|
|
78
102
|
else if (file.status === "error") {
|
|
@@ -159,6 +183,8 @@ const MultipleImgUpload = (props) => {
|
|
|
159
183
|
}
|
|
160
184
|
const base64 = yield getBase64(file);
|
|
161
185
|
const wh = yield getImgwh(base64);
|
|
186
|
+
file.width = wh.w;
|
|
187
|
+
file.height = wh.h;
|
|
162
188
|
if (props.opts.w && props.opts.w !== wh.w) {
|
|
163
189
|
message.error(`${props.i18n ? props.i18n.$t('global.img.width') : '图片宽度不符合'} ${props.opts.w}px`);
|
|
164
190
|
return Upload.LIST_IGNORE;
|
|
@@ -192,7 +218,7 @@ const MultipleImgUpload = (props) => {
|
|
|
192
218
|
return Upload.LIST_IGNORE;
|
|
193
219
|
}
|
|
194
220
|
}
|
|
195
|
-
resolve();
|
|
221
|
+
resolve(file);
|
|
196
222
|
}));
|
|
197
223
|
}, []);
|
|
198
224
|
return (React.createElement(React.Fragment, null,
|
|
@@ -242,6 +268,7 @@ const MultipleImgUpload = (props) => {
|
|
|
242
268
|
MultipleImgUpload.defaultProps = {
|
|
243
269
|
maxCount: 6,
|
|
244
270
|
showMessage: true,
|
|
271
|
+
objectInValue: false,
|
|
245
272
|
action: "/api/upload/img",
|
|
246
273
|
name: "file",
|
|
247
274
|
gif: false,
|
|
@@ -20,13 +20,14 @@ interface IProps {
|
|
|
20
20
|
name?: string;
|
|
21
21
|
i18n?: any;
|
|
22
22
|
opts?: IOpts;
|
|
23
|
-
value?:
|
|
23
|
+
value?: any;
|
|
24
24
|
buttonText?: string;
|
|
25
25
|
headers?: any;
|
|
26
26
|
data?: any;
|
|
27
27
|
onChange?: any;
|
|
28
28
|
gif?: boolean;
|
|
29
29
|
disabled?: boolean;
|
|
30
|
+
objectInValue?: boolean;
|
|
30
31
|
isTip?: boolean;
|
|
31
32
|
type?: string;
|
|
32
33
|
}
|
|
@@ -15,7 +15,16 @@ import Toast from "../../core/toast";
|
|
|
15
15
|
const ImgUpload = (props) => {
|
|
16
16
|
var _a, _b, _c, _d;
|
|
17
17
|
const [loading, setLoading] = useState(false);
|
|
18
|
-
const [imageUrl, setImageUrl] = useState(
|
|
18
|
+
const [imageUrl, setImageUrl] = useState(() => {
|
|
19
|
+
const item = props.value;
|
|
20
|
+
if (typeof item === "string" && item) {
|
|
21
|
+
return item;
|
|
22
|
+
}
|
|
23
|
+
if (item.url) {
|
|
24
|
+
return item.url;
|
|
25
|
+
}
|
|
26
|
+
return undefined;
|
|
27
|
+
});
|
|
19
28
|
const action = useMemo(() => {
|
|
20
29
|
if (typeof props.action === "string") {
|
|
21
30
|
return buildURL(props.action, props.actionParams);
|
|
@@ -58,8 +67,18 @@ const ImgUpload = (props) => {
|
|
|
58
67
|
response.successed) {
|
|
59
68
|
const url = data && data.url;
|
|
60
69
|
setImageUrl(url);
|
|
61
|
-
|
|
62
|
-
|
|
70
|
+
if (props.objectInValue) {
|
|
71
|
+
info.file.url = url;
|
|
72
|
+
delete info.file.response;
|
|
73
|
+
delete info.file.xhr;
|
|
74
|
+
delete info.file.lastModifiedDate;
|
|
75
|
+
delete info.file.originFileObj;
|
|
76
|
+
props.onChange && props.onChange(info.file);
|
|
77
|
+
}
|
|
78
|
+
else {
|
|
79
|
+
// Form.item 值注入关键
|
|
80
|
+
props.onChange && props.onChange(url);
|
|
81
|
+
}
|
|
63
82
|
}
|
|
64
83
|
else {
|
|
65
84
|
Toast.error({
|
|
@@ -103,6 +122,8 @@ const ImgUpload = (props) => {
|
|
|
103
122
|
}
|
|
104
123
|
const base64 = yield getBase64(file);
|
|
105
124
|
const wh = yield getImgwh(base64);
|
|
125
|
+
file.width = wh.w;
|
|
126
|
+
file.height = wh.h;
|
|
106
127
|
if (props.opts.w && props.opts.w !== wh.w) {
|
|
107
128
|
message.error(`${props.i18n ? props.i18n.$t('global.img.width') : '图片宽度不符合'} ${props.opts.w}px`);
|
|
108
129
|
reject();
|
|
@@ -143,15 +164,19 @@ const ImgUpload = (props) => {
|
|
|
143
164
|
return;
|
|
144
165
|
}
|
|
145
166
|
}
|
|
146
|
-
resolve();
|
|
167
|
+
resolve(file);
|
|
147
168
|
}));
|
|
148
169
|
}, []);
|
|
149
170
|
const uploadButton = useMemo(() => (React.createElement("div", null,
|
|
150
171
|
loading ? React.createElement(LoadingOutlined, null) : React.createElement(PlusOutlined, null),
|
|
151
172
|
React.createElement("div", { style: { marginTop: 8 } }, props.buttonText))), [loading]);
|
|
152
173
|
useEffect(() => {
|
|
153
|
-
|
|
154
|
-
|
|
174
|
+
const item = props.value;
|
|
175
|
+
if (typeof item === "string" && item) {
|
|
176
|
+
setImageUrl(item);
|
|
177
|
+
}
|
|
178
|
+
if (item.url) {
|
|
179
|
+
setImageUrl(item.url);
|
|
155
180
|
}
|
|
156
181
|
}, [props.value]);
|
|
157
182
|
return (React.createElement(Flex, { style: { fontSize: 0 } },
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ecoding/components.antd",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.2",
|
|
4
4
|
"author": "cxc",
|
|
5
5
|
"homepage": "",
|
|
6
6
|
"license": "MIT",
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"antd": "^6.0.0",
|
|
48
48
|
"axios": "^1.1.2"
|
|
49
49
|
},
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "531ea382cedf74735ce957b15e8860533a3af29e"
|
|
51
51
|
}
|