Skip to content

Commit a3ba4e2

Browse files
Merge pull request #469 from OpenSignLabs/fix_managesign
fix: signature not saving in managesign
2 parents 5cad0a9 + dd95862 commit a3ba4e2

File tree

1 file changed

+87
-182
lines changed

1 file changed

+87
-182
lines changed

apps/OpenSign/src/pages/Managesign.js

Lines changed: 87 additions & 182 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@ import React, { useState, useRef, useEffect } from "react";
22
import SignatureCanvas from "react-signature-canvas";
33
import "../styles/managesign.css";
44
import "../styles/signature.css";
5-
import axios from "axios";
65
import { toDataUrl } from "../constant/Utils";
7-
6+
import Parse from "parse";
7+
import { appInfo } from "../constant/appinfo";
88
const ManageSign = () => {
9-
let appName;
9+
const appName = appInfo.appname;
1010
const [penColor, setPenColor] = useState("blue");
1111
const [initialPen, setInitialPen] = useState("blue");
1212
const [image, setImage] = useState();
@@ -25,59 +25,40 @@ const ManageSign = () => {
2525
const imageRef = useRef(null);
2626
const initailsRef = useRef(null);
2727
useEffect(() => {
28-
getLocalStorageValue();
28+
fetchUserSign();
2929
// eslint-disable-next-line
3030
}, []);
31-
//function for get localstorage value first and than call another function.
32-
const getLocalStorageValue = () => {
33-
let User = JSON.parse(
34-
localStorage.getItem(
35-
"Parse/" + localStorage.getItem("parseAppId") + "/currentUser"
36-
)
37-
);
38-
appName =
39-
localStorage.getItem("_appName") && localStorage.getItem("_appName");
31+
const fetchUserSign = async () => {
32+
const User = Parse.User.current();
4033
if (User) {
41-
fetchUserSign(User);
42-
}
43-
};
44-
45-
const fetchUserSign = async (User) => {
46-
const userId = {
47-
__type: "Pointer",
48-
className: "_User",
49-
objectId: User.objectId
50-
};
51-
const strObj = JSON.stringify(userId);
52-
const url =
53-
localStorage.getItem("baseUrl") +
54-
`classes/${appName}_Signature?where={"UserId":${strObj}}&limit=1`;
55-
56-
const headers = {
57-
"Content-Type": "application/json",
58-
"X-Parse-Application-Id": localStorage.getItem("parseAppId")
59-
// "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
60-
};
61-
const res = await axios
62-
.get(url, { headers: headers })
63-
.then((res) => {
64-
if (res.data.results.length > 0) {
65-
setId(res.data.results[0].objectId);
66-
setSignName(res.data.results[0].SignatureName);
67-
setImage(res.data.results[0].ImageURL);
68-
if (res.data.results[0] && res.data.results[0].Initials) {
69-
setInitials(res.data.results[0].Initials);
34+
const userId = {
35+
__type: "Pointer",
36+
className: "_User",
37+
objectId: User.id
38+
};
39+
try {
40+
const signCls = `${appName}_Signature`;
41+
const signQuery = new Parse.Query(signCls);
42+
signQuery.equalTo("UserId", userId);
43+
const signRes = await signQuery.first();
44+
if (signRes) {
45+
const res = signRes.toJSON();
46+
setId(res.objectId);
47+
setSignName(res?.SignatureName);
48+
setImage(res.ImageURL);
49+
if (res && res.Initials) {
50+
setInitials(res.Initials);
7051
setIsInitials(true);
7152
}
53+
} else {
54+
setSignName(User?.get("name") || "");
7255
}
7356
setIsLoader(false);
74-
return res;
75-
})
76-
.catch((error) => {
77-
console.log(error);
78-
alert(`${error.message}`);
79-
});
80-
return res;
57+
} catch (err) {
58+
console.log("Err", err);
59+
alert(`${err.message}`);
60+
}
61+
}
8162
};
8263
const handleSignatureChange = () => {
8364
if (imageRef.current) {
@@ -108,18 +89,6 @@ const ManageSign = () => {
10889
setIsInitials(false);
10990
};
11091

111-
// const handleReset = () => {
112-
// if (canvasRef.current) {
113-
// canvasRef.current.clear();
114-
// }
115-
// if (imageRef.current) {
116-
// imageRef.current.value = "";
117-
// }
118-
// setImage("");
119-
// setSignature("");
120-
// setIsValue(false);
121-
// setSignName("");
122-
// };
12392
const onImageChange = async (event) => {
12493
if (canvasRef.current) {
12594
canvasRef.current.clear();
@@ -146,28 +115,31 @@ const ManageSign = () => {
146115
const replaceSpace = signName.replace(/ /g, "_");
147116
let file;
148117
if (signature) {
149-
file = base64StringtoFile(signature, `${replaceSpace}.png`);
118+
file = base64StringtoFile(signature, `${replaceSpace}_sign.png`);
150119
} else {
151120
if (!isUrl) {
152-
file = base64StringtoFile(image, `${replaceSpace}.png`);
121+
file = base64StringtoFile(image, `${replaceSpace}__sign.png`);
153122
}
154123
}
155-
// console.log("isUrl ", isUrl);
156124
let imgUrl;
157125
if (!isUrl) {
158126
imgUrl = await uploadFile(file);
159127
} else {
160-
imgUrl = { data: { imageUrl: image } };
128+
imgUrl = image;
161129
}
162130
let initialsUrl = "";
163-
if (Initials) {
164-
const initialsImg = base64StringtoFile(Initials, `${replaceSpace}.png`);
131+
const isInitialsUrl = Initials.includes("https");
132+
if (!isInitialsUrl && Initials) {
133+
const initialsImg = base64StringtoFile(
134+
Initials,
135+
`${replaceSpace}_initials.png`
136+
);
165137
initialsUrl = await uploadFile(initialsImg);
166138
}
167-
if (imgUrl.data && imgUrl.data.imageUrl) {
139+
if (imgUrl) {
168140
await saveEntry({
169141
name: signName,
170-
url: imgUrl.data.imageUrl,
142+
url: imgUrl,
171143
initialsUrl: initialsUrl
172144
});
173145
}
@@ -186,110 +158,54 @@ const ManageSign = () => {
186158
}
187159

188160
const uploadFile = async (file) => {
189-
let parseBaseUrl = localStorage.getItem("baseUrl");
190-
parseBaseUrl = parseBaseUrl.slice(0, -4);
191-
const url = parseBaseUrl + `file_upload`;
192-
const formData = new FormData();
193-
formData.append("file", file);
194-
const config = {
195-
headers: {
196-
"content-type": "multipart/form-data",
197-
"X-Parse-Application-Id": localStorage.getItem("parseAppId")
198-
}
199-
};
200-
const response = await axios
201-
.post(url, formData, config)
202-
.then((res) => {
203-
if (res.data.status === "Error") {
204-
alert(res.data.message);
205-
}
206-
return res;
207-
})
208-
.catch((error) => {
209-
console.log(error);
210-
setIsLoader(false);
211-
alert(`${error.message}`);
212-
});
213-
return response;
161+
try {
162+
const parseFile = new Parse.File(file.name, file);
163+
const response = await parseFile.save();
164+
return response?.url();
165+
} catch (err) {
166+
console.log("sign upload err", err);
167+
setIsLoader(false);
168+
alert(`${err.message}`);
169+
}
214170
};
215171

216172
const saveEntry = async (obj) => {
173+
const signCls = `${appName}_Signature`;
174+
const User = Parse.User.current().id;
175+
const userId = { __type: "Pointer", className: "_User", objectId: User };
217176
if (id) {
218-
const User = JSON.parse(
219-
localStorage.getItem(
220-
"Parse/" + localStorage.getItem("parseAppId") + "/currentUser"
221-
)
222-
);
223-
const url =
224-
localStorage.getItem("baseUrl") +
225-
`classes/${localStorage.getItem("_appName")}_Signature/${id}`;
226-
const body = {
227-
Initials: obj.initialsUrl ? obj.initialsUrl.data.imageUrl : "",
228-
ImageURL: obj.url,
229-
SignatureName: obj.name,
230-
UserId: {
231-
__type: "Pointer",
232-
className: "_User",
233-
objectId: User.objectId
234-
}
235-
};
236-
const headers = {
237-
"Content-Type": "application/json",
238-
"X-Parse-Application-Id": localStorage.getItem("parseAppId")
239-
// "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
240-
};
241-
const res = await axios
242-
.put(url, body, { headers: headers })
243-
.then((res) => {
244-
// handleReset();
245-
setIsLoader(false);
246-
setIsSuccess(true);
247-
return res;
248-
})
249-
.catch((error) => {
250-
console.log(error);
251-
setIsLoader(false);
252-
alert(`${error.message}`);
253-
});
254-
return res;
177+
try {
178+
const updateSign = new Parse.Object(signCls);
179+
updateSign.id = id;
180+
updateSign.set("Initials", obj.initialsUrl ? obj.initialsUrl : "");
181+
updateSign.set("ImageURL", obj.url);
182+
updateSign.set("SignatureName", obj.name);
183+
updateSign.set("UserId", userId);
184+
const res = await updateSign.save();
185+
setIsLoader(false);
186+
setIsSuccess(true);
187+
return res;
188+
} catch (err) {
189+
console.log(err);
190+
setIsLoader(false);
191+
alert(`${err.message}`);
192+
}
255193
} else {
256-
const User = JSON.parse(
257-
localStorage.getItem(
258-
"Parse/" + localStorage.getItem("parseAppId") + "/currentUser"
259-
)
260-
);
261-
const url =
262-
localStorage.getItem("baseUrl") +
263-
`classes/${localStorage.getItem("_appName")}_Signature`;
264-
const body = {
265-
Initials: obj.initialsUrl ? obj.initialsUrl.data.imageUrl : "",
266-
ImageURL: obj.url,
267-
SignatureName: obj.name,
268-
UserId: {
269-
__type: "Pointer",
270-
className: "_User",
271-
objectId: User.objectId
272-
}
273-
};
274-
const headers = {
275-
"Content-Type": "application/json",
276-
"X-Parse-Application-Id": localStorage.getItem("parseAppId")
277-
// "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
278-
};
279-
const res = await axios
280-
.post(url, body, { headers: headers })
281-
.then((res) => {
282-
// handleReset();
283-
setIsLoader(false);
284-
setIsSuccess(true);
285-
return res;
286-
})
287-
.catch((error) => {
288-
console.log(error);
289-
setIsLoader(false);
290-
alert(`${error.message}`);
291-
});
292-
return res;
194+
try {
195+
const updateSign = new Parse.Object(signCls);
196+
updateSign.set("Initials", obj.initialsUrl ? obj.initialsUrl : "");
197+
updateSign.set("ImageURL", obj.url);
198+
updateSign.set("SignatureName", obj.name);
199+
updateSign.set("UserId", userId);
200+
const res = await updateSign.save();
201+
setIsLoader(false);
202+
setIsSuccess(true);
203+
return res;
204+
} catch (err) {
205+
console.log(err);
206+
setIsLoader(false);
207+
alert(`${err.message}`);
208+
}
293209
}
294210
};
295211
const handleSignatureBtn = () => {
@@ -337,7 +253,6 @@ const ManageSign = () => {
337253
Signature saved successfully!
338254
</div>
339255
)}
340-
341256
<div
342257
className="mainDiv"
343258
style={{
@@ -461,9 +376,7 @@ const ManageSign = () => {
461376
<div
462377
style={{
463378
position: "relative",
464-
465-
border: "2px solid #888",
466-
marginBottom: 6
379+
border: "2px solid #888"
467380
}}
468381
className="signatureCanvas"
469382
>
@@ -498,7 +411,6 @@ const ManageSign = () => {
498411
display: "flex",
499412
flexDirection: "row",
500413
justifyContent: "space-between"
501-
// width: 460,
502414
}}
503415
className="penContainerDefault"
504416
>
@@ -569,21 +481,14 @@ const ManageSign = () => {
569481
</div>
570482
<div style={{ position: "relative" }}>
571483
<div style={{ margin: "6px 5px 18px" }}>
572-
<span
573-
// onClick={() => handleSignatureBtn()}
574-
className="signature"
575-
>
576-
Initials
577-
</span>
484+
<span className="signature">Initials</span>
578485
</div>
579486
<div>
580487
{isInitials ? (
581488
<div
582489
style={{
583490
position: "relative",
584-
585-
border: "2px solid #888",
586-
marginBottom: 6
491+
border: "2px solid #888"
587492
}}
588493
className="intialSignature"
589494
>

0 commit comments

Comments
 (0)