lu-lowcode-package-form 0.9.1 → 0.9.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.
- package/dist/index.cjs.js +71 -71
- package/dist/index.es.js +7717 -7231
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/components/field/upload/upload-image.jsx +63 -19
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.fabsolute{position:absolute}.frelative{position:relative}.fz-10{z-index:10}.fmb-5{margin-bottom:1.25rem}.fmt-2{margin-top:.5rem}.fflex{display:flex}.fhidden{display:none}.fh-11{height:2.75rem}.fh-24{height:6rem}.fh-8{height:2rem}.fh-full{height:100%}.fmax-h-full{max-height:100%}.fmin-h-5{min-height:1.25rem}.fw-24{width:6rem}.fw-\[960px\]{width:960px}.fw-full{width:100%}.fmin-w-36{min-width:9rem}.fmax-w-full{max-width:100%}.fcursor-pointer{cursor:pointer}.fflex-col{flex-direction:column}.fflex-wrap{flex-wrap:wrap}.fitems-center{align-items:center}.fitems-stretch{align-items:stretch}.fjustify-center{justify-content:center}.fjustify-between{justify-content:space-between}.fgap-1{gap:.25rem}.fgap-2{gap:.5rem}.fgap-3{gap:.75rem}.foverflow-hidden{overflow:hidden}.frounded{border-radius:.25rem}.fborder{border-width:1px}.fborder-l-4{border-left-width:4px}.fborder-dashed{border-style:dashed}.fborder-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.fborder-
|
|
1
|
+
*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.fabsolute{position:absolute}.frelative{position:relative}.fleft-0{left:0}.ftop-0{top:0}.fz-10{z-index:10}.fmb-5{margin-bottom:1.25rem}.fmt-2{margin-top:.5rem}.fflex{display:flex}.fhidden{display:none}.fh-11{height:2.75rem}.fh-24{height:6rem}.fh-8{height:2rem}.fh-full{height:100%}.fmax-h-full{max-height:100%}.fmin-h-5{min-height:1.25rem}.fw-24{width:6rem}.fw-\[960px\]{width:960px}.fw-full{width:100%}.fmin-w-36{min-width:9rem}.fmax-w-full{max-width:100%}.fcursor-pointer{cursor:pointer}.fflex-col{flex-direction:column}.fflex-wrap{flex-wrap:wrap}.fitems-center{align-items:center}.fitems-stretch{align-items:stretch}.fjustify-center{justify-content:center}.fjustify-between{justify-content:space-between}.fgap-1{gap:.25rem}.fgap-2{gap:.5rem}.fgap-3{gap:.75rem}.foverflow-hidden{overflow:hidden}.frounded{border-radius:.25rem}.fborder{border-width:1px}.fborder-l-4{border-left-width:4px}.fborder-dashed{border-style:dashed}.fborder-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.fborder-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.fborder-slate-300{--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity))}.fbg-gray-900{--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity))}.fbg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity))}.fbg-slate-100{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.fbg-transparent{background-color:transparent}.fbg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.fbg-opacity-50{--tw-bg-opacity: .5}.fobject-contain{object-fit:contain}.fp-4{padding:1rem}.fp-6{padding:1.5rem}.fpb-10{padding-bottom:2.5rem}.fpl-2{padding-left:.5rem}.ftext-lg{font-size:1.125rem;line-height:1.75rem}.ftext-sm{font-size:.875rem;line-height:1.25rem}.ftext-xs{font-size:.75rem;line-height:1rem}.ffont-medium{font-weight:500}.ftext-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ftext-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.hover\:fborder-\[\#3e92f8\]:hover{--tw-border-opacity: 1;border-color:rgb(62 146 248 / var(--tw-border-opacity))}.hover\:ftext-\[\#3e92f8\]:hover{--tw-text-opacity: 1;color:rgb(62 146 248 / var(--tw-text-opacity))}.hover\:ftext-gray-200:hover{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}.fgroup:hover .group-hover\:fflex{display:flex}.fgroup:hover .group-hover\:fbg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))}
|
package/package.json
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Upload as OriginalUpload, Button, Image } from "antd";
|
|
1
|
+
import { Upload as OriginalUpload, Button, Image, Spin } from "antd";
|
|
2
2
|
|
|
3
3
|
import { BaseWrapper } from "../base.jsx"
|
|
4
4
|
import { DeleteOutlined, EyeOutlined, PlusOutlined } from "@ant-design/icons";
|
|
@@ -17,7 +17,7 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
|
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
if (Array.isArray(value))
|
|
20
|
+
if ((!fileList || fileList.length == 0 ) && Array.isArray(value))
|
|
21
21
|
setFileList(value)
|
|
22
22
|
}
|
|
23
23
|
}, [value]);
|
|
@@ -26,6 +26,15 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
|
|
|
26
26
|
const [previewImage, setPreviewImage] = useState('');
|
|
27
27
|
const [previewImageIndex, setPreviewImageIndex] = useState(0);
|
|
28
28
|
const [previewOpen, setPreviewOpen] = useState(false);
|
|
29
|
+
|
|
30
|
+
const getBase64 = (file) =>
|
|
31
|
+
new Promise((resolve, reject) => {
|
|
32
|
+
const reader = new FileReader();
|
|
33
|
+
reader.readAsDataURL(file);
|
|
34
|
+
reader.onload = () => resolve(reader.result);
|
|
35
|
+
reader.onerror = (error) => reject(error);
|
|
36
|
+
});
|
|
37
|
+
|
|
29
38
|
const handlePreview = async (file, index) => {
|
|
30
39
|
if (!file.url && !file.preview) {
|
|
31
40
|
file.preview = await getBase64(file.originFileObj);
|
|
@@ -36,26 +45,30 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
|
|
|
36
45
|
setPreviewOpen(true);
|
|
37
46
|
};
|
|
38
47
|
|
|
39
|
-
const handleDelete =
|
|
48
|
+
const handleDelete = async (file, index) => {
|
|
40
49
|
|
|
41
50
|
setFileList(fileList.filter((item, i) => i !== index))
|
|
42
51
|
}
|
|
43
52
|
|
|
44
53
|
const uploadButton = (<>
|
|
45
|
-
<div className="fw-
|
|
54
|
+
<div className="fw-full fh-full fflex fflex-col fitems-center fjustify-center fborder fborder-dashed fcursor-pointer frounded">
|
|
46
55
|
<PlusOutlined />
|
|
47
56
|
<div className="fmt-2">点击上传</div>
|
|
48
57
|
</div>
|
|
49
58
|
</>
|
|
50
59
|
|
|
51
60
|
);
|
|
52
|
-
const handleChange = ({ fileList: newFileList }) => {
|
|
53
|
-
|
|
61
|
+
const handleChange = async ({ fileList: newFileList }) => {
|
|
62
|
+
for (let i = 0; i < newFileList.length; i++) {
|
|
63
|
+
var file = newFileList[i];
|
|
54
64
|
if (file.status == "done" && file.response) {
|
|
55
65
|
file.url = file.response;
|
|
56
66
|
}
|
|
57
|
-
|
|
58
|
-
|
|
67
|
+
if (!file.url && file.originFileObj)
|
|
68
|
+
file.base64 = await getBase64(file.originFileObj)
|
|
69
|
+
newFileList[i] = file
|
|
70
|
+
}
|
|
71
|
+
console.log("newFileList", JSON.parse(JSON.stringify(newFileList)))
|
|
59
72
|
onChange(newFileList.map((file) => {
|
|
60
73
|
return {
|
|
61
74
|
uid: file.uid,
|
|
@@ -70,17 +83,48 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
|
|
|
70
83
|
return (
|
|
71
84
|
<BaseWrapper {...props}>
|
|
72
85
|
<div className="fflex fgap-3 fflex-wrap">
|
|
73
|
-
{fileList.map((file, index) =>
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
<
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
86
|
+
{/* {fileList.map((file, index) => {
|
|
87
|
+
console.log("file.base64",file.base64)
|
|
88
|
+
return (
|
|
89
|
+
<>
|
|
90
|
+
<div key={`file-${file.uid}`} className={"fgroup fw-24 fh-24 fbg-transparent fborder frounded fflex fitems-center fjustify-center foverflow-hidden fcursor-pointer frelative" + (file.status == "error" ?" fborder-red-500":"")}>
|
|
91
|
+
<div className=" fhidden fabsolute fw-full fh-full fbg-gray-900 fbg-opacity-50 fitems-center fjustify-center fz-10 group-hover:fflex ftext-white ftext-lg fgap-2">
|
|
92
|
+
{file.status == "done" && <EyeOutlined onClick={() => { handlePreview(file, index) }} className="hover:ftext-gray-200" />}
|
|
93
|
+
<DeleteOutlined onClick={() => { handleDelete(file, index) }} className="hover:ftext-gray-200" />
|
|
94
|
+
</div>
|
|
95
|
+
<img src={file.url || file.base64} alt="Example Image" class="fmax-w-full fmax-h-full fobject-contain " />
|
|
96
|
+
</div>
|
|
97
|
+
</>
|
|
98
|
+
)
|
|
99
|
+
})} */}
|
|
82
100
|
<OriginalUpload
|
|
83
101
|
{...props}
|
|
102
|
+
itemRender={
|
|
103
|
+
(originNode, file, fileList) => {
|
|
104
|
+
console.log("file", file)
|
|
105
|
+
let index = fileList.findIndex((item) => item.uid === file.uid)
|
|
106
|
+
return (
|
|
107
|
+
<>
|
|
108
|
+
<div key={`file-${file.uid}`} className={"fgroup fw-full fh-full fbg-transparent fborder frounded fflex fitems-center fjustify-center foverflow-hidden fcursor-pointer frelative" + (file.status == "error" ?" fborder-red-500":"")}>
|
|
109
|
+
<div className=" fhidden fabsolute fw-full fh-full fbg-gray-900 fbg-opacity-50 fitems-center fjustify-center fz-10 group-hover:fflex ftext-white ftext-lg fgap-2">
|
|
110
|
+
{file.status == "done" && <EyeOutlined onClick={() => { handlePreview(file, index) }} className="hover:ftext-gray-200" />}
|
|
111
|
+
<DeleteOutlined onClick={() => { handleDelete(file, index) }} className="hover:ftext-gray-200" />
|
|
112
|
+
|
|
113
|
+
</div>
|
|
114
|
+
{file.status == "uploading" && <div className=" fw-full fh-full fflex fitems-center fjustify-center fabsolute ftop-0 fleft-0 "><Spin></Spin></div>}
|
|
115
|
+
<img src={file.url || file.base64} alt="Example Image" class="fmax-w-full fmax-h-full fobject-contain " />
|
|
116
|
+
</div>
|
|
117
|
+
</>
|
|
118
|
+
)
|
|
119
|
+
// console.log("originNode", originNode)
|
|
120
|
+
// console.log("index", index)
|
|
121
|
+
// console.log("file", file)
|
|
122
|
+
// console.log("fileList", fileList)
|
|
123
|
+
return null
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
listType="picture-card"
|
|
127
|
+
fileList={fileList}
|
|
84
128
|
maxCount={maxCount}
|
|
85
129
|
onPreview={handlePreview}
|
|
86
130
|
onChange={handleChange}
|
|
@@ -92,9 +136,9 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
|
|
|
92
136
|
{previewImage && (
|
|
93
137
|
<Image.PreviewGroup preview={{
|
|
94
138
|
visible: previewOpen,
|
|
95
|
-
current: previewImageIndex,
|
|
139
|
+
current: previewImageIndex,
|
|
96
140
|
onVisibleChange: (visible) => setPreviewOpen(visible),
|
|
97
|
-
onChange:(index)=>{setPreviewImageIndex(index)}
|
|
141
|
+
onChange: (index) => { setPreviewImageIndex(index) }
|
|
98
142
|
}}>
|
|
99
143
|
{fileList.map((file, index) => <><Image
|
|
100
144
|
wrapperStyle={{ display: 'none' }}
|