lu-lowcode-package-form 0.9.2 → 0.9.4

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lu-lowcode-package-form",
3
- "version": "0.9.2",
3
+ "version": "0.9.4",
4
4
  "dependencies": {
5
5
  "@ant-design/icons": "^4.8.1",
6
6
  "@testing-library/jest-dom": "^5.17.0",
@@ -2,7 +2,7 @@ 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";
5
- import React, { useEffect, useState } from "react";
5
+ import React, { useEffect, useRef, useState, version } from "react";
6
6
 
7
7
  const UploadImage = ({ maxCount, value, onChange, ...props }) => {
8
8
  useEffect(() => {
@@ -17,8 +17,19 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
17
17
  }
18
18
  }
19
19
 
20
- if ((!fileList || fileList.length == 0 ) && Array.isArray(value))
21
- setFileList(value)
20
+ let _fileList = []
21
+ if (Array.isArray(value))
22
+ for (let i = 0; i < value.length; i++) {
23
+ let file = value[i]
24
+ var oldfile = fileMap.current.find((item) => item.uid === file.uid)
25
+ console.log("set file", file)
26
+ console.log("set oldfile", oldfile)
27
+ if (!oldfile ||( (oldfile.version||0) < (file.version||0 )))
28
+ _fileList.push(file)
29
+ else _fileList.push(oldfile)
30
+ }
31
+
32
+ setFileList(_fileList)
22
33
  }
23
34
  }, [value]);
24
35
  maxCount = maxCount || 9;
@@ -26,6 +37,7 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
26
37
  const [previewImage, setPreviewImage] = useState('');
27
38
  const [previewImageIndex, setPreviewImageIndex] = useState(0);
28
39
  const [previewOpen, setPreviewOpen] = useState(false);
40
+ const fileMap = useRef([]);
29
41
 
30
42
  const getBase64 = (file) =>
31
43
  new Promise((resolve, reject) => {
@@ -59,26 +71,41 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
59
71
 
60
72
  );
61
73
  const handleChange = async ({ fileList: newFileList }) => {
74
+
75
+ let handleFileList = []
76
+
62
77
  for (let i = 0; i < newFileList.length; i++) {
63
78
  var file = newFileList[i];
64
- if (file.status == "done" && file.response) {
65
- file.url = file.response;
79
+ file.version = new Date().getTime()
80
+ var oldfile = fileMap.current.find((item) => item.uid === file.uid)
81
+ console.log("oldfile", JSON.parse(JSON.stringify(oldfile)))
82
+ if (oldfile && oldfile.status != "uploading") {
83
+ handleFileList.push(oldfile)
84
+ }
85
+ else {
86
+ if (file.status == "done" && file.response) {
87
+ file.url = file.response;
88
+ }
89
+ if (!file.url && file.originFileObj)
90
+ file.base64 = await getBase64(file.originFileObj)
91
+ newFileList[i] = file
92
+ handleFileList.push(file)
66
93
  }
67
- if (!file.url && file.originFileObj)
68
- file.base64 = await getBase64(file.originFileObj)
69
- newFileList[i] = file
70
94
  }
71
95
  console.log("newFileList", JSON.parse(JSON.stringify(newFileList)))
72
- onChange(newFileList.map((file) => {
96
+ console.log("handleFileList", JSON.parse(JSON.stringify(handleFileList)))
97
+ fileMap.current = handleFileList
98
+ setFileList(handleFileList);
99
+ onChange(handleFileList.map((file) => {
73
100
  return {
74
101
  uid: file.uid,
75
102
  name: file.name,
76
103
  status: file.status,
77
104
  url: file.url || file.response || "",
78
105
  error: file.error,
106
+ version: file.version || 0
79
107
  }
80
108
  }))
81
- setFileList(newFileList);
82
109
  }
83
110
  return (
84
111
  <BaseWrapper {...props}>
@@ -105,13 +132,13 @@ const UploadImage = ({ maxCount, value, onChange, ...props }) => {
105
132
  let index = fileList.findIndex((item) => item.uid === file.uid)
106
133
  return (
107
134
  <>
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":"")}>
135
+ <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
136
  <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" />}
137
+ {file.status == "done" && <EyeOutlined onClick={() => { handlePreview(file, index) }} className="hover:ftext-gray-200" />}
111
138
  <DeleteOutlined onClick={() => { handleDelete(file, index) }} className="hover:ftext-gray-200" />
112
-
139
+
113
140
  </div>
114
- {file.status == "uploading" && <div className=" fw-full fh-full fflex fitems-center fjustify-center fabsolute ftop-0 fleft-0 "><Spin></Spin></div>}
141
+ {file.status == "uploading" && <div className=" fw-full fh-full fflex fitems-center fjustify-center fabsolute ftop-0 fleft-0 "><Spin></Spin></div>}
115
142
  <img src={file.url || file.base64} alt="Example Image" class="fmax-w-full fmax-h-full fobject-contain " />
116
143
  </div>
117
144
  </>