@para-ui/core 3.0.104 → 3.0.106
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.
- package/Form/index.js +1 -1
- package/FormItem/index.js +1 -1
- package/README.md +10 -0
- package/Table/index.js +1 -1
- package/Upload/ImageUpload/index.d.ts +2 -7
- package/Upload/index.js +102 -30
- package/Upload/interface.d.ts +18 -0
- package/index.js +1 -1
- package/package.json +1 -1
- package/umd/ComboSelect.js +1 -1
- package/umd/DynamicMultiBox.js +1 -1
- package/umd/Form.js +1 -1
- package/umd/FormItem.js +1 -1
- package/umd/FunctionModal.js +3 -3
- package/umd/Modal.js +2 -2
- package/umd/Table.js +1 -1
- package/umd/Upload.js +5 -5
- /package/_verture/{index-b7e9c13a.js → index-effca97a.js} +0 -0
package/Form/index.js
CHANGED
|
@@ -3,7 +3,7 @@ import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
|
|
|
3
3
|
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
import { DeepClone } from '@paraview/lib';
|
|
5
5
|
import React__default from 'react';
|
|
6
|
-
import { F as FormItem, l as localeJson, v as validate } from '../_verture/index-
|
|
6
|
+
import { F as FormItem, l as localeJson, v as validate } from '../_verture/index-effca97a.js';
|
|
7
7
|
import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
|
|
8
8
|
import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
|
|
9
9
|
import '../_verture/unsupportedIterableToArray-cb478f24.js';
|
package/FormItem/index.js
CHANGED
package/README.md
CHANGED
package/Table/index.js
CHANGED
|
@@ -2943,7 +2943,7 @@ var Table = function Table(propsInit) {
|
|
|
2943
2943
|
width: result.width
|
|
2944
2944
|
};
|
|
2945
2945
|
setHeadDataConfig(Object.assign({}, constData.current.headDataConfig)); // 设置表格列配置,被拖动的width
|
|
2946
|
-
handHeadDataCom(_toConsumableArray(
|
|
2946
|
+
handHeadDataCom(_toConsumableArray(headDataCom)); // 重新计算表格的最小宽度
|
|
2947
2947
|
// 本地记住拖动列宽度
|
|
2948
2948
|
setLocalStorageHeadCom({
|
|
2949
2949
|
headDataConfig: constData.current.headDataConfig,
|
|
@@ -1,14 +1,9 @@
|
|
|
1
1
|
import { FunctionComponent } from 'react';
|
|
2
|
-
import { UploadProps } from '../interface';
|
|
2
|
+
import { UploadProps, DefaultImage } from '../interface';
|
|
3
3
|
import './index.scss';
|
|
4
4
|
export type ImageUploadProps = Omit<UploadProps, 'type'> & {
|
|
5
5
|
/** 默认图片 showUploadList为false时有效 */
|
|
6
|
-
defaultImage?:
|
|
7
|
-
/** 图片地址 */
|
|
8
|
-
imageUrl: string;
|
|
9
|
-
/** 图片名称 */
|
|
10
|
-
imageName?: string;
|
|
11
|
-
};
|
|
6
|
+
defaultImage?: DefaultImage;
|
|
12
7
|
/** 用于控制这个组件只回显图片 不能上传和删除 */
|
|
13
8
|
readonly?: boolean;
|
|
14
9
|
};
|
package/Upload/index.js
CHANGED
|
@@ -16,14 +16,14 @@ import clsx from 'clsx';
|
|
|
16
16
|
import { $ as $prefixCls, a as $rcPrefixCls } from '../_verture/constant-66aa48a1.js';
|
|
17
17
|
import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
|
|
18
18
|
import Forbid from '@para-ui/icons/Forbid';
|
|
19
|
+
import { Button } from '../Button/index.js';
|
|
19
20
|
import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
|
|
20
21
|
import EditOutline from '@para-ui/icons/EditOutline';
|
|
21
|
-
import
|
|
22
|
+
import CloseIcon from '@para-ui/icons/Close';
|
|
22
23
|
import { Slider } from '../Slider/index.js';
|
|
23
24
|
import Cropper from 'react-easy-crop';
|
|
24
25
|
import { Modal } from '../Modal/index.js';
|
|
25
26
|
import '../_verture/unsupportedIterableToArray-cb478f24.js';
|
|
26
|
-
import '@para-ui/core/GlobalContext';
|
|
27
27
|
import '@para-ui/icons/LoadingF';
|
|
28
28
|
import '../Tooltip/index.js';
|
|
29
29
|
import 'rc-tooltip';
|
|
@@ -34,9 +34,9 @@ import 'rc-dropdown';
|
|
|
34
34
|
import '../_verture/usePopupContainer-87febeb9.js';
|
|
35
35
|
import 'dayjs';
|
|
36
36
|
import '@paraview/lib';
|
|
37
|
+
import '@para-ui/core/GlobalContext';
|
|
37
38
|
import 'rc-slider';
|
|
38
39
|
import 'rc-dialog';
|
|
39
|
-
import '@para-ui/icons/Close';
|
|
40
40
|
import '../_verture/index-65bbd1e4.js';
|
|
41
41
|
import 'react-dom';
|
|
42
42
|
import '../AutoTips/index.js';
|
|
@@ -273,7 +273,7 @@ var localeJson = {
|
|
|
273
273
|
en: en
|
|
274
274
|
};
|
|
275
275
|
|
|
276
|
-
var css_248z$2 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/11/11 下午7:31\n* @description\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-upload-image {\n display: inline-flex;\n align-items: center;\n}\n.paraui-v3-upload-image .upload-image-select {\n position: relative;\n width: 100px;\n height: 100px;\n background-color: rgba(171, 176, 185, 0.12);\n border-radius: 4px;\n cursor: pointer;\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-select-loading {\n pointer-events: none;\n}\n.paraui-v3-upload-image .upload-image-select .component-upload {\n display: inline-block;\n width: 100%;\n height: 100%;\n}\n.paraui-v3-upload-image .upload-image-select:hover {\n background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-v3-upload-image .upload-image-select:hover .upload-image-picture-card {\n color: rgb(54, 102, 214);\n}\n.paraui-v3-upload-image .upload-image-picture-card {\n display: inline-flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n align-items: center;\n justify-content: center;\n color: rgb(46, 55, 67);\n font-size: 14px;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper {\n position: relative;\n width: 100%;\n height: 100%;\n cursor: default;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper img {\n width: 100%;\n height: 100%;\n border-radius: 4px;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper::before {\n content: \" \";\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n top: 0;\n background-color: rgba(46, 55, 67, 0.7);\n border-radius: 4px;\n opacity: 0;\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper-name {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n padding: 0 10px;\n font-size: 12px;\n line-height: 24px;\n text-align: center;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n background-color: rgba(46, 55, 67, 0.7);\n border-radius: 0 0 4px 4px;\n color: rgb(255, 255, 255);\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper-action {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n line-height: 0;\n cursor: pointer;\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper-action svg {\n color: rgb(255, 255, 255);\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper:hover::before {\n opacity: 1;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper:hover .upload-img-wrapper-name {\n opacity: 0;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper:hover .upload-img-wrapper-action {\n opacity: 1;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-icon {\n color: rgb(54, 102, 214);\n font-size: 30px;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-loading {\n color: rgb(54, 102, 214);\n font-size: 30px;\n animation: imageLoadingCircle 1s infinite linear;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-text {\n margin-top: 6px;\n color: inherit;\n transition: 0.3s;\n text-align: center;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-text-loading {\n color: rgb(54, 102, 214);\n}\n@keyframes imageLoadingCircle {\n 100% {\n transform: rotate(360deg);\n }\n}";
|
|
276
|
+
var css_248z$2 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/11/11 下午7:31\n* @description\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-upload-image {\n display: inline-flex;\n align-items: center;\n}\n.paraui-v3-upload-image .upload-img-wrapper-container {\n position: relative;\n}\n.paraui-v3-upload-image .upload-img-wrapper-container__del-btn {\n display: none;\n position: absolute;\n top: 10px;\n right: 10px;\n padding: 0;\n width: 14px;\n height: 14px;\n text-align: center;\n border-radius: 50%;\n background: #fff;\n box-shadow: 0px 0px 4px 0px rgba(46, 55, 67, 0.4);\n z-index: 1;\n}\n.paraui-v3-upload-image .upload-img-wrapper-container__del-btn .paraui-icon-small {\n vertical-align: top;\n font-size: 14px;\n color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-upload-image .upload-img-wrapper-container__del-btn:hover .paraui-icon-small {\n color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-upload-image .upload-img-wrapper-container:hover .upload-img-wrapper-container__del-btn {\n display: block;\n}\n.paraui-v3-upload-image .upload-image-select {\n position: relative;\n width: 100px;\n height: 100px;\n background-color: rgba(171, 176, 185, 0.12);\n border-radius: 4px;\n cursor: pointer;\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-select-loading {\n pointer-events: none;\n}\n.paraui-v3-upload-image .upload-image-select .component-upload {\n display: inline-block;\n width: 100%;\n height: 100%;\n}\n.paraui-v3-upload-image .upload-image-select:hover {\n background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-v3-upload-image .upload-image-select:hover .upload-image-picture-card {\n color: rgb(54, 102, 214);\n}\n.paraui-v3-upload-image .upload-image-picture-card {\n display: inline-flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n align-items: center;\n justify-content: center;\n color: rgb(46, 55, 67);\n font-size: 14px;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper {\n position: relative;\n width: 100%;\n height: 100%;\n overflow: hidden;\n cursor: default;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper img {\n width: 100%;\n height: 100%;\n border-radius: 4px;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper::before {\n content: \" \";\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n top: 0;\n background-color: rgba(46, 55, 67, 0.7);\n border-radius: 4px;\n opacity: 0;\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper-name {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n padding: 0 10px;\n font-size: 12px;\n line-height: 24px;\n text-align: center;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n background-color: rgba(46, 55, 67, 0.7);\n border-radius: 0 0 4px 4px;\n color: rgb(255, 255, 255);\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper-action {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n line-height: 0;\n cursor: pointer;\n transition: 0.3s;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper-action svg {\n color: rgb(255, 255, 255);\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper:hover::before {\n opacity: 1;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper:hover .upload-img-wrapper-name {\n opacity: 0;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-img-wrapper:hover .upload-img-wrapper-action {\n opacity: 1;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-icon {\n color: rgb(54, 102, 214);\n font-size: 30px;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-loading {\n color: rgb(54, 102, 214);\n font-size: 30px;\n animation: imageLoadingCircle 1s infinite linear;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-text {\n margin-top: 6px;\n color: inherit;\n transition: 0.3s;\n text-align: center;\n}\n.paraui-v3-upload-image .upload-image-picture-card .upload-image-text-loading {\n color: rgb(54, 102, 214);\n}\n@keyframes imageLoadingCircle {\n 100% {\n transform: rotate(360deg);\n }\n}";
|
|
277
277
|
styleInject(css_248z$2);
|
|
278
278
|
|
|
279
279
|
//ImageUpload
|
|
@@ -308,7 +308,8 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
308
308
|
showLoadingProp = _props$showLoading === void 0 ? false : _props$showLoading,
|
|
309
309
|
defaultImage = props.defaultImage,
|
|
310
310
|
readonly = props.readonly,
|
|
311
|
-
|
|
311
|
+
avatarProps = props.avatarProps,
|
|
312
|
+
restProps = __rest(props, ["className", "style", "onStart", "onSuccess", "onError", "onProgress", "onRemove", "beforeUpload", "onChange", "defaultFileList", "fileList", "showUploadList", "maxCount", "children", "itemRender", "showUploadError", "stash", "uploading", "loading", "showLoading", "defaultImage", "readonly", "avatarProps"]);
|
|
312
313
|
var intl = useFormatMessage('Upload', localeJson);
|
|
313
314
|
var _useState = useState(defaultFileList),
|
|
314
315
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -316,18 +317,34 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
316
317
|
setUploadFileList = _useState2[1]; //文件列表
|
|
317
318
|
var _useState3 = useState(false),
|
|
318
319
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
var _useState5 = useState(
|
|
320
|
+
showResetBtn = _useState4[0],
|
|
321
|
+
setShowResetBtn = _useState4[1]; // 是否展示重置按钮-默认不展示
|
|
322
|
+
var _useState5 = useState(),
|
|
322
323
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
var _useState7 = useState(
|
|
324
|
+
borderRadius = _useState6[0],
|
|
325
|
+
setBorderRadius = _useState6[1]; // border-radius样式
|
|
326
|
+
var _useState7 = useState(false),
|
|
327
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
328
|
+
isAvatar = _useState8[0],
|
|
329
|
+
setIsAvatar = _useState8[1]; // 是否为头像组件
|
|
330
|
+
var _useState9 = useState(true),
|
|
331
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
332
|
+
showPicName = _useState10[0],
|
|
333
|
+
setShowPicName = _useState10[1]; // 是否展示图片名称
|
|
334
|
+
var _useState11 = useState(false),
|
|
335
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
336
|
+
showLoading = _useState12[0],
|
|
337
|
+
setShowLoading = _useState12[1]; //upload loading
|
|
338
|
+
var _useState13 = useState(false),
|
|
339
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
340
|
+
errTip = _useState14[0],
|
|
341
|
+
setErrTip = _useState14[1]; //upload error tip
|
|
342
|
+
var _useState15 = useState({
|
|
326
343
|
imageUrl: ''
|
|
327
344
|
}),
|
|
328
|
-
|
|
329
|
-
avatar =
|
|
330
|
-
setAvatar =
|
|
345
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
346
|
+
avatar = _useState16[0],
|
|
347
|
+
setAvatar = _useState16[1]; //不显示列表时上传头像
|
|
331
348
|
var _ref = typeof showUploadList === 'boolean' ? {} : showUploadList,
|
|
332
349
|
showRemoveIcon = _ref.showRemoveIcon,
|
|
333
350
|
removeIcon = _ref.removeIcon; //显示上传列表
|
|
@@ -339,6 +356,39 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
339
356
|
_ref2$leaveDelay = _ref2.leaveDelay,
|
|
340
357
|
leaveDelay = _ref2$leaveDelay === void 0 ? 2000 : _ref2$leaveDelay; //错误信息提示
|
|
341
358
|
var cropFileRef = useRef(); //裁剪文件
|
|
359
|
+
useEffect(function () {
|
|
360
|
+
if (avatarProps && Object.prototype.toString.call(avatarProps) === "[object Object]" && Object.keys(avatarProps).length > 0) {
|
|
361
|
+
var _ref3 = avatarProps || {},
|
|
362
|
+
_ref3$showReset = _ref3.showReset,
|
|
363
|
+
showReset = _ref3$showReset === void 0 ? false : _ref3$showReset,
|
|
364
|
+
_ref3$borderRadius = _ref3.borderRadius,
|
|
365
|
+
borderRadiusVal = _ref3$borderRadius === void 0 ? "50%" : _ref3$borderRadius,
|
|
366
|
+
avatarDefaultImage = _ref3.defaultImage,
|
|
367
|
+
_ref3$showName = _ref3.showName,
|
|
368
|
+
showName = _ref3$showName === void 0 ? false : _ref3$showName;
|
|
369
|
+
setShowResetBtn(showReset);
|
|
370
|
+
setBorderRadius(String(borderRadiusVal).includes("px") || String(borderRadiusVal).includes("%") ? String(borderRadiusVal) : "".concat(borderRadiusVal, "px"));
|
|
371
|
+
setIsAvatar(true);
|
|
372
|
+
setShowPicName(showName);
|
|
373
|
+
var nextAvatarDefaultImage = avatarDefaultImage || defaultImage || {
|
|
374
|
+
imageUrl: ''
|
|
375
|
+
};
|
|
376
|
+
setAvatar(Object.assign({}, nextAvatarDefaultImage));
|
|
377
|
+
} else if (typeof avatarProps === "boolean" && avatarProps) {
|
|
378
|
+
setBorderRadius("50%");
|
|
379
|
+
setIsAvatar(true);
|
|
380
|
+
setShowPicName(false);
|
|
381
|
+
if (defaultImage) {
|
|
382
|
+
setAvatar(Object.assign({}, defaultImage));
|
|
383
|
+
}
|
|
384
|
+
} else {
|
|
385
|
+
setIsAvatar(false);
|
|
386
|
+
setShowPicName(true);
|
|
387
|
+
if (defaultImage) {
|
|
388
|
+
setAvatar(Object.assign({}, defaultImage));
|
|
389
|
+
}
|
|
390
|
+
}
|
|
391
|
+
}, [avatarProps, defaultImage]);
|
|
342
392
|
useEffect(function () {
|
|
343
393
|
setShowLoading(loading);
|
|
344
394
|
}, [loading]);
|
|
@@ -434,13 +484,13 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
434
484
|
case 0:
|
|
435
485
|
cloneList = _toConsumableArray(changedFileList);
|
|
436
486
|
if (showUploadList) {
|
|
437
|
-
_context2.next =
|
|
487
|
+
_context2.next = 17;
|
|
438
488
|
break;
|
|
439
489
|
}
|
|
440
490
|
//不显示上传列表
|
|
441
491
|
file = cloneList.slice(-1)[0];
|
|
442
492
|
if (!file) {
|
|
443
|
-
_context2.next =
|
|
493
|
+
_context2.next = 14;
|
|
444
494
|
break;
|
|
445
495
|
}
|
|
446
496
|
_context2.next = 6;
|
|
@@ -451,10 +501,17 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
451
501
|
avatar.imageUrl = imageUrl;
|
|
452
502
|
avatar.imageName = file.name;
|
|
453
503
|
setAvatar(Object.assign({}, avatar));
|
|
454
|
-
case 11:
|
|
455
504
|
onChange === null || onChange === void 0 ? void 0 : onChange([file]);
|
|
505
|
+
_context2.next = 16;
|
|
506
|
+
break;
|
|
507
|
+
case 14:
|
|
508
|
+
setAvatar({
|
|
509
|
+
imageUrl: ''
|
|
510
|
+
});
|
|
511
|
+
onChange === null || onChange === void 0 ? void 0 : onChange([]);
|
|
512
|
+
case 16:
|
|
456
513
|
return _context2.abrupt("return");
|
|
457
|
-
case
|
|
514
|
+
case 17:
|
|
458
515
|
if (maxCount === 1) {
|
|
459
516
|
cloneList = cloneList.slice(-1);
|
|
460
517
|
} else if (maxCount) {
|
|
@@ -462,7 +519,7 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
462
519
|
}
|
|
463
520
|
onChange === null || onChange === void 0 ? void 0 : onChange(cloneList);
|
|
464
521
|
setUploadFileList(cloneList);
|
|
465
|
-
case
|
|
522
|
+
case 20:
|
|
466
523
|
case "end":
|
|
467
524
|
return _context2.stop();
|
|
468
525
|
}
|
|
@@ -546,11 +603,6 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
546
603
|
setUploadFileList(_toConsumableArray(fileList));
|
|
547
604
|
}
|
|
548
605
|
}, [fileList]);
|
|
549
|
-
useEffect(function () {
|
|
550
|
-
if (defaultImage) {
|
|
551
|
-
setAvatar(Object.assign({}, defaultImage));
|
|
552
|
-
}
|
|
553
|
-
}, [defaultImage]);
|
|
554
606
|
//渲染上传列表
|
|
555
607
|
var renderUploadList = function renderUploadList() {
|
|
556
608
|
return showUploadList && jsx(UploadList, {
|
|
@@ -566,14 +618,19 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
566
618
|
//渲染内容
|
|
567
619
|
var renderUploadContent = function renderUploadContent() {
|
|
568
620
|
var _a;
|
|
621
|
+
var borderRadiusStyle = borderRadius ? {
|
|
622
|
+
borderRadius: borderRadius
|
|
623
|
+
} : {};
|
|
569
624
|
if (!showUploadList && avatar.imageUrl && !showLoading) {
|
|
570
625
|
return jsxs("div", Object.assign({
|
|
571
|
-
className: 'upload-img-wrapper'
|
|
626
|
+
className: 'upload-img-wrapper',
|
|
627
|
+
style: borderRadiusStyle
|
|
572
628
|
}, {
|
|
573
629
|
children: [jsx("img", {
|
|
574
630
|
src: avatar.imageUrl,
|
|
575
|
-
alt: (_a = avatar.imageName) !== null && _a !== void 0 ? _a : ''
|
|
576
|
-
|
|
631
|
+
alt: (_a = avatar.imageName) !== null && _a !== void 0 ? _a : '',
|
|
632
|
+
style: borderRadiusStyle
|
|
633
|
+
}), avatar.imageName && showPicName && jsx("span", Object.assign({
|
|
577
634
|
className: "upload-img-wrapper-name"
|
|
578
635
|
}, {
|
|
579
636
|
children: avatar.imageName
|
|
@@ -600,9 +657,11 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
600
657
|
};
|
|
601
658
|
//渲染上传控件
|
|
602
659
|
var renderUploadSelector = function renderUploadSelector() {
|
|
603
|
-
if (readonly) return null;
|
|
604
660
|
return jsxs("div", Object.assign({
|
|
605
|
-
className: clsx('upload-image-select', showLoading && 'upload-image-select-loading')
|
|
661
|
+
className: clsx(['upload-image-select', showLoading && 'upload-image-select-loading', isAvatar && 'is-avatar']),
|
|
662
|
+
style: borderRadius ? {
|
|
663
|
+
borderRadius: borderRadius
|
|
664
|
+
} : {}
|
|
606
665
|
}, {
|
|
607
666
|
children: [jsx(RcUpload, Object.assign({}, overrideProps, {
|
|
608
667
|
prefixCls: "".concat($rcPrefixCls, "-upload")
|
|
@@ -618,11 +677,24 @@ var ImageUpload = function ImageUpload(props) {
|
|
|
618
677
|
})]
|
|
619
678
|
}));
|
|
620
679
|
};
|
|
680
|
+
var handleReset = function handleReset() {
|
|
681
|
+
handleRemove(uploadFileList[0]);
|
|
682
|
+
};
|
|
621
683
|
return jsxs("div", Object.assign({
|
|
622
684
|
className: clsx("".concat($prefixCls, "-upload-image"), className),
|
|
623
685
|
style: style
|
|
624
686
|
}, {
|
|
625
|
-
children: [renderUploadList(),
|
|
687
|
+
children: [renderUploadList(), !readonly ? showResetBtn && avatar.imageUrl ? jsxs("div", Object.assign({
|
|
688
|
+
className: "upload-img-wrapper-container"
|
|
689
|
+
}, {
|
|
690
|
+
children: [jsx(Button, Object.assign({
|
|
691
|
+
className: "upload-img-wrapper-container__del-btn",
|
|
692
|
+
variant: "text",
|
|
693
|
+
onClick: handleReset
|
|
694
|
+
}, {
|
|
695
|
+
children: jsx(CloseIcon, {})
|
|
696
|
+
})), renderUploadSelector()]
|
|
697
|
+
})) : renderUploadSelector() : jsx(Fragment, {})]
|
|
626
698
|
}));
|
|
627
699
|
};
|
|
628
700
|
|
package/Upload/interface.d.ts
CHANGED
|
@@ -32,6 +32,22 @@ export interface IShowUploadList {
|
|
|
32
32
|
removeIcon?: React.ReactNode;
|
|
33
33
|
}
|
|
34
34
|
type ItemRender<T = any> = (file: UploadFile, fileList?: Array<UploadFile<T>>) => React.ReactNode;
|
|
35
|
+
export interface DefaultImage {
|
|
36
|
+
/** 图片地址 */
|
|
37
|
+
imageUrl: string;
|
|
38
|
+
/** 图片名称 */
|
|
39
|
+
imageName?: string;
|
|
40
|
+
}
|
|
41
|
+
export interface AvatarProps {
|
|
42
|
+
/** 圆角 */
|
|
43
|
+
borderRadius?: string | number;
|
|
44
|
+
/** 是否展示重置按钮 */
|
|
45
|
+
showReset?: boolean;
|
|
46
|
+
/** 图片地址 */
|
|
47
|
+
defaultImage?: DefaultImage;
|
|
48
|
+
/** 是否展示图片名称 */
|
|
49
|
+
showName?: boolean;
|
|
50
|
+
}
|
|
35
51
|
export interface UploadProps<T = any> {
|
|
36
52
|
/**上传类型*/
|
|
37
53
|
type?: UploadType;
|
|
@@ -59,6 +75,8 @@ export interface UploadProps<T = any> {
|
|
|
59
75
|
accept?: string;
|
|
60
76
|
/**是否支持多选文件,开启后按住 ctrl 可选择多个文件*/
|
|
61
77
|
multiple?: boolean;
|
|
78
|
+
/** 头像 */
|
|
79
|
+
avatarProps?: boolean | AvatarProps;
|
|
62
80
|
/**上传文件改变时的状态*/
|
|
63
81
|
onChange?: (info: UploadFile[]) => void;
|
|
64
82
|
/**上传开始*/
|
package/index.js
CHANGED
|
@@ -22,7 +22,7 @@ export { D as Dropdown } from './_verture/index-77f9e0fb.js';
|
|
|
22
22
|
export { default as DynamicMultiBox } from './DynamicMultiBox/index.js';
|
|
23
23
|
export { default as Empty } from './Empty/index.js';
|
|
24
24
|
export { default as Form } from './Form/index.js';
|
|
25
|
-
export { F as FormItem } from './_verture/index-
|
|
25
|
+
export { F as FormItem } from './_verture/index-effca97a.js';
|
|
26
26
|
export { u as FunctionModal, F as FunctionModalProvider, a as useClose } from './_verture/modalContext-c04790c8.js';
|
|
27
27
|
export { default as GlobalContext, changeConfirmLocale, getConfirmLocale } from './GlobalContext/index.js';
|
|
28
28
|
export { default as Help } from './Help/index.js';
|