WEBDIENSTE/OpenSign
1
0
Fork 0
mirror of https://github.com/OpenSignLabs/OpenSign.git synced 2026-08-17 21:25:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

handle reactour for recipients,pdf loading, resolve warnings

Browse Source
This commit is contained in:
RaktimaNXG
2023-10-30 16:31:21 +05:30
parent b8cebe5368
commit b75016aaa0
10 changed files with 1079 additions and 1019 deletions
Download Patch File Download Diff File Expand all files Collapse all files
microfrontends/SignDocuments/src/Component/ManageSign.js
+13 -12
View File
@@ -515,20 +515,20 @@ const ManageSign = () => {
border: "none",
margin: "5px",
borderBottom:
key == 0 && penColor == "blue"
key === 0 && penColor === "blue"
? "2px solid blue"
: key == 1 && penColor == "red"
: key === 1 && penColor === "red"
? "2px solid red"
: key == 2 && penColor == "black"
: key === 2 && penColor === "black"
? "2px solid black"
: "2px solid white",
}}
onClick={() => {
if (key == 0) {
if (key === 0) {
setPenColor("blue");
} else if (key == 1) {
} else if (key === 1) {
setPenColor("red");
} else if (key == 2) {
} else if (key === 2) {
setPenColor("black");
}
}}
@@ -629,24 +629,25 @@ const ManageSign = () => {
{allColor.map((data, key) => {
return (
<img
alt="pen"
style={{
border: "none",
margin: "5px",
borderBottom:
key == 0 && initialPen == "blue"
key === 0 && initialPen === "blue"
? "2px solid blue"
: key == 1 && initialPen == "red"
: key === 1 && initialPen === "red"
? "2px solid red"
: key == 2 && initialPen == "black"
: key === 2 && initialPen === "black"
? "2px solid black"
: "2px solid white",
}}
onClick={() => {
if (key == 0) {
if (key === 0) {
setInitialPen("blue");
} else if (key == 1) {
} else if (key === 1) {
setInitialPen("red");
} else if (key == 2) {
} else if (key === 2) {
setInitialPen("black");
}
}}
microfrontends/SignDocuments/src/Component/PdfRequestFiles.js
+56 -47
View File
@@ -1,6 +1,5 @@
import React, { useState, useRef, useEffect } from "react";
import { themeColor } from "../utils/ThemeColor/backColor";
import { PDFDocument, rgb } from "pdf-lib";
import "../css/signature.css";
import axios from "axios";
@@ -16,7 +15,7 @@ import {
contactBook,
contractUsers,
getBase64FromIMG,
getBase64FromUrl,
getBase64FromUrl
} from "../utils/Utils";
import Loader from "./component/loader";
import HandleError from "./component/HandleError";
@@ -44,7 +43,7 @@ function PdfRequestFiles() {
const [handleError, setHandleError] = useState();
const [isLoading, setIsLoading] = useState({
isLoad: true,
message: "This might take some time",
message: "This might take some time"
});
const [defaultSignImg, setDefaultSignImg] = useState();
const [isDocId, setIsDocId] = useState(false);
@@ -58,7 +57,11 @@ function PdfRequestFiles() {
const [currentSigner, setCurrentSigner] = useState(false);
const [isCompleted, setIsCompleted] = useState({
isCertificate: false,
isModal: false,
isModal: false
});
const [pdfLoadFail, setPdfLoadFail] = useState({
status: false,
type: "load"
});
const [isSigned, setIsSigned] = useState(false);
const [isExpired, setIsExpired] = useState(false);
@@ -104,7 +107,7 @@ function PdfRequestFiles() {
setSignerObjectId(objId);
} else if (contractUsersRes === "Error: Something went wrong!") {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -126,8 +129,8 @@ function PdfRequestFiles() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -149,13 +152,13 @@ function PdfRequestFiles() {
setIsSigned(true);
const data = {
isCertificate: true,
isModal: true,
isModal: true
};
setIsCompleted(data);
} else if (declined) {
const currentDecline = {
currnt: "another",
isDeclined: true,
isDeclined: true
};
setIsDecline(currentDecline);
} else if (currDate > expireUpdateDate) {
@@ -226,7 +229,7 @@ function PdfRequestFiles() {
// alert("No data found!");
setNoData(true);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
setIsUiLoading(false);
@@ -235,7 +238,7 @@ function PdfRequestFiles() {
.catch((err) => {
console.log("err", err);
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -251,8 +254,8 @@ function PdfRequestFiles() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -263,13 +266,13 @@ function PdfRequestFiles() {
setDefaultSignImg(res[0].ImageURL);
}
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
})
.catch((err) => {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -311,7 +314,7 @@ function PdfRequestFiles() {
);
const pdfDoc = await PDFDocument.load(existingPdfBytes, {
ignoreEncryption: true,
ignoreEncryption: true
});
let pdfBase64;
@@ -336,11 +339,11 @@ function PdfRequestFiles() {
y: page.getHeight() - 10,
size: fontSize,
font,
color: rgb(0.5, 0.5, 0.5),
color: rgb(0.5, 0.5, 0.5)
});
}
pdfBase64 = await pdfDoc.saveAsBase64({
useObjectStreams: false,
useObjectStreams: false
});
}
@@ -423,7 +426,7 @@ function PdfRequestFiles() {
y: page.getHeight() - 10,
size: fontSize,
font,
color: rgb(0.5, 0.5, 0.5),
color: rgb(0.5, 0.5, 0.5)
});
}
@@ -474,12 +477,12 @@ function PdfRequestFiles() {
x: imgUrlList[id].xPosition,
y: page.getHeight() - imgUrlList[id].yPosition - imgHeight,
width: imgWidth,
height: imgHeight,
height: imgHeight
});
});
}
const pdfBytes = await pdfDoc.saveAsBase64({
useObjectStreams: false,
useObjectStreams: false
});
signPdfFun(pdfBytes, documentId, pngUrl);
@@ -524,8 +527,8 @@ function PdfRequestFiles() {
Bottom: bottomY,
Width: xyPosData.Width ? xyPosData.Width : 150,
Height: height,
Page: pageNo,
},
Page: pageNo
}
};
} else if (
xyPosData &&
@@ -534,7 +537,7 @@ function PdfRequestFiles() {
) {
signgleSign = {
pdfFile: base64Url,
docId: documentId,
docId: documentId
};
}
@@ -546,8 +549,8 @@ function PdfRequestFiles() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken"),
},
sessionToken: localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -569,6 +572,10 @@ function PdfRequestFiles() {
};
//function for get pdf page details
const pageDetails = async (pdf) => {
const load = {
status: true
};
setPdfLoadFail(load);
pdf.getPage(1).then((pdfPage) => {
const pageWidth = pdfPage.view[2];
@@ -666,7 +673,7 @@ function PdfRequestFiles() {
Width: newWidth,
Height: nweHeight,
SignUrl: image.src,
ImageType: image.imgType,
ImageType: image.imgType
};
}
return url;
@@ -715,7 +722,7 @@ function PdfRequestFiles() {
Width: newWidth,
Height: nweHeight,
SignUrl: image.src,
ImageType: image.imgType,
ImageType: image.imgType
};
}
return url;
@@ -801,7 +808,7 @@ function PdfRequestFiles() {
//function for set decline true on press decline button
const declineDoc = async () => {
const data = {
IsDeclined: true,
IsDeclined: true
};
setIsUiLoading(true);
@@ -815,8 +822,8 @@ function PdfRequestFiles() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((result) => {
@@ -824,7 +831,7 @@ function PdfRequestFiles() {
if (res) {
const currentDecline = {
currnt: "YouDeclined",
isDeclined: true,
isDeclined: true
};
setIsDecline(currentDecline);
setIsUiLoading(false);
@@ -859,7 +866,7 @@ function PdfRequestFiles() {
alignItems: "center",
zIndex: "20",
backgroundColor: "#e6f2f2",
opacity: 0.8,
opacity: 0.8
}}
>
<img
@@ -886,7 +893,7 @@ function PdfRequestFiles() {
<div
style={{
marginLeft: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px"
}}
>
<Modal show={isExpired}>
@@ -927,7 +934,7 @@ function PdfRequestFiles() {
<>
<button
style={{
color: "black",
color: "black"
}}
type="button"
className="finishBtn"
@@ -937,7 +944,7 @@ function PdfRequestFiles() {
</button>
<button
style={{
background: "#de4337",
background: "#de4337"
}}
type="button"
className="finishBtn"
@@ -965,7 +972,7 @@ function PdfRequestFiles() {
<Modal.Footer>
<button
style={{
color: "black",
color: "black"
}}
type="button"
className="finishBtn"
@@ -1027,6 +1034,8 @@ function PdfRequestFiles() {
signerObjectId={signerObjectId}
signedSigners={signedSigners}
setCurrentSigner={setCurrentSigner}
setPdfLoadFail={setPdfLoadFail}
pdfLoadFail={pdfLoadFail}
/>
</div>
<div>
@@ -1035,7 +1044,7 @@ function PdfRequestFiles() {
<>
<div
style={{
background: themeColor(),
background: themeColor()
// color:"white"
}}
className="signedStyle"
@@ -1051,7 +1060,7 @@ function PdfRequestFiles() {
flexDirection: "row",
padding: "10px",
background: checkSignerBackColor(obj),
background: checkSignerBackColor(obj)
}}
key={ind}
>
@@ -1065,14 +1074,14 @@ function PdfRequestFiles() {
borderRadius: 30 / 2,
justifyContent: "center",
alignItems: "center",
marginRight: "20px",
marginRight: "20px"
}}
>
<span
style={{
fontSize: "10px",
textAlign: "center",
fontWeight: "bold",
fontWeight: "bold"
}}
>
{" "}
@@ -1082,7 +1091,7 @@ function PdfRequestFiles() {
<div
style={{
display: "flex",
flexDirection: "column",
flexDirection: "column"
}}
>
<span className="userName">{obj.Name}</span>
@@ -1103,7 +1112,7 @@ function PdfRequestFiles() {
color: "white",
padding: "5px",
fontFamily: "sans-serif",
marginTop: signedSigners.length > 0 && "20px",
marginTop: signedSigners.length > 0 && "20px"
}}
>
Yet To Sign
@@ -1116,7 +1125,7 @@ function PdfRequestFiles() {
display: "flex",
flexDirection: "row",
padding: "10px",
background: checkSignerBackColor(obj),
background: checkSignerBackColor(obj)
}}
key={ind}
>
@@ -1130,14 +1139,14 @@ function PdfRequestFiles() {
borderRadius: 30 / 2,
justifyContent: "center",
alignItems: "center",
marginRight: "20px",
marginRight: "20px"
}}
>
<span
style={{
fontSize: "8px",
textAlign: "center",
fontWeight: "bold",
fontWeight: "bold"
}}
>
{" "}
@@ -1147,7 +1156,7 @@ function PdfRequestFiles() {
<div
style={{
display: "flex",
flexDirection: "column",
flexDirection: "column"
}}
>
<span className="userName">{obj.Name}</span>
microfrontends/SignDocuments/src/Component/SignYourselfPdf.js
+74 -61
View File
@@ -1,5 +1,4 @@
import React, { useState, useRef, useEffect } from "react";
import { PDFDocument, rgb } from "pdf-lib";
import "../css/./signature.css";
import sign from "../assests/sign3.png";
@@ -58,7 +57,7 @@ function SignYourSelf() {
const [documentStatus, setDocumentStatus] = useState({ isCompleted: false });
const [isLoading, setIsLoading] = useState({
isLoad: true,
message: "This might take some time",
message: "This might take some time"
});
const [handleError, setHandleError] = useState();
const [isDragging, setIsDragging] = useState(false);
@@ -70,7 +69,11 @@ function SignYourSelf() {
const [noData, setNoData] = useState(false);
const [contractName, setContractName] = useState("");
const [showAlreadySignDoc, setShowAlreadySignDoc] = useState({
status: false
});
const [pdfLoadFail, setPdfLoadFail] = useState({
status: false,
type: "load"
});
const nodeRef = useRef(null);
@@ -78,8 +81,8 @@ function SignYourSelf() {
accept: "BOX",
drop: (item, monitor) => addPositionOfSignature(item, monitor),
collect: (monitor) => ({
isOver: !!monitor.isOver(),
}),
isOver: !!monitor.isOver()
})
});
const pdfRef = useRef();
@@ -90,11 +93,11 @@ function SignYourSelf() {
item: {
type: "BOX",
id: 1,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragSign: !!monitor.isDragging(),
}),
isDragSign: !!monitor.isDragging()
})
});
const [{ isDragStamp }, dragStamp] = useDrag({
@@ -103,11 +106,11 @@ function SignYourSelf() {
item: {
type: "BOX",
id: 2,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragStamp: !!monitor.isDragging(),
}),
isDragStamp: !!monitor.isDragging()
})
});
const [{ isDragSignatureSS }, dragSignatureSS] = useDrag({
type: "BOX",
@@ -115,11 +118,11 @@ function SignYourSelf() {
item: {
type: "BOX",
id: 3,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragSignatureSS: !!monitor.isDragging(),
}),
isDragSignatureSS: !!monitor.isDragging()
})
});
const [{ isDragStampSS }, dragStampSS] = useDrag({
@@ -128,11 +131,11 @@ function SignYourSelf() {
item: {
type: "BOX",
id: 4,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragStampSS: !!monitor.isDragging(),
}),
isDragStampSS: !!monitor.isDragging()
})
});
const index = xyPostion.findIndex((object) => {
@@ -181,8 +184,8 @@ function SignYourSelf() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -194,13 +197,13 @@ function SignYourSelf() {
const isCompleted = res[0].IsCompleted && res[0].IsCompleted;
if (isCompleted) {
const docStatus = {
isCompleted: isCompleted,
isCompleted: isCompleted
};
setDocumentStatus(docStatus);
const alreadySign = {
status: true,
mssg: "You have successfully signed the document!",
mssg: "You have successfully signed the document!"
};
setShowAlreadySignDoc(alreadySign);
setPdfUrl(res[0].SignedUrl);
@@ -209,14 +212,14 @@ function SignYourSelf() {
setNoData(true);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
})
.catch((err) => {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -232,8 +235,8 @@ function SignYourSelf() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -246,14 +249,18 @@ function SignYourSelf() {
})
.catch((err) => {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
});
const contractUsersRes = await contractUsers(jsonSender.objectId);
if (contractUsersRes && contractUsersRes[0]) {
if (
contractUsersRes !== "Error: Something went wrong!" &&
contractUsersRes &&
contractUsersRes[0]
) {
setContractName("_Users");
setSignerUserId(contractUsersRes[0].objectId);
const tourstatuss =
@@ -269,12 +276,12 @@ function SignYourSelf() {
}
}
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
} else if (contractUsersRes === "Error: Something went wrong!") {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -299,7 +306,7 @@ function SignYourSelf() {
}
}
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -366,7 +373,7 @@ function SignYourSelf() {
key: key,
isStamp: monitor,
yBottom: window.innerHeight / 2 - 60,
yBottom: window.innerHeight / 2 - 60
};
dropData.push(dropObj);
@@ -395,7 +402,7 @@ function SignYourSelf() {
isStamp: isDragStamp || isDragStampSS ? true : false,
firstXPos: signBtnPosition[0] && signBtnPosition[0].xPos,
firstYPos: signBtnPosition[0] && signBtnPosition[0].yPos,
yBottom: ybottom,
yBottom: ybottom
};
dropData.push(dropObj);
@@ -416,7 +423,7 @@ function SignYourSelf() {
const newSignPos = updateData.concat(dropData);
let xyPos = {
pageNumber: pageNumber,
pos: newSignPos,
pos: newSignPos
};
xyPostion.splice(index, 1, xyPos);
setIsSignPad(true);
@@ -425,7 +432,7 @@ function SignYourSelf() {
} else {
const xyPos = {
pageNumber: pageNumber,
pos: dropData,
pos: dropData
};
setXyPostion((prev) => [...prev, xyPos]);
setIsSignPad(true);
@@ -456,7 +463,7 @@ function SignYourSelf() {
}, 3000);
const loadObj = {
isLoad: true,
message: "This might take some time",
message: "This might take some time"
};
setIsLoading(loadObj);
const url = pdfDetails[0] && pdfDetails[0].URL;
@@ -467,7 +474,7 @@ function SignYourSelf() {
// Load a PDFDocument from the existing PDF bytes
const pdfDoc = await PDFDocument.load(existingPdfBytes, {
ignoreEncryption: true,
ignoreEncryption: true
});
const pngUrl = xyPostion;
//checking if signature is only one then send image url in jpeg formate to server
@@ -488,11 +495,11 @@ function SignYourSelf() {
y: page.getHeight() - 10,
size: fontSize,
font,
color: rgb(0.5, 0.5, 0.5),
color: rgb(0.5, 0.5, 0.5)
});
}
const pdfBase64 = await pdfDoc.saveAsBase64({
useObjectStreams: false,
useObjectStreams: false
});
for (let i = 0; i < xyPostion.length; i++) {
const imgUrlList = xyPostion[i].pos;
@@ -568,7 +575,7 @@ function SignYourSelf() {
y: page.getHeight() - 10,
size: fontSize,
font,
color: rgb(0.5, 0.5, 0.5),
color: rgb(0.5, 0.5, 0.5)
});
}
for (let i = 0; i < pngUrl.length; i++) {
@@ -621,7 +628,7 @@ function SignYourSelf() {
y:
page.getHeight() - imgUrlList[id].yPosition * scale - imgHeight,
width: imgWidth,
height: imgHeight,
height: imgHeight
});
});
}
@@ -668,13 +675,13 @@ function SignYourSelf() {
Bottom: bottomY,
Width: xyPosData.Width ? xyPosData.Width : 150,
Height: height,
Page: pageNo,
},
Page: pageNo
}
};
} else if (xyPostion.length > 0 && xyPostion[0].pos.length > 0) {
singleSign = {
pdfFile: base64Url,
docId: documentId,
docId: documentId
};
}
// console.log("data",singleSign)
@@ -683,9 +690,9 @@ function SignYourSelf() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken"),
sessionToken: localStorage.getItem("accesstoken")
// sessiontoken,
},
}
})
.then((Listdata) => {
const json = Listdata.data;
@@ -693,12 +700,12 @@ function SignYourSelf() {
setPdfUrl(json.result.data);
if (json.result.data) {
const docStatus = {
isCompleted: true,
isCompleted: true
};
setDocumentStatus(docStatus);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -741,7 +748,7 @@ function SignYourSelf() {
xPosition: dragElement.x,
yPosition: dragElement.y,
isDrag: true,
yBottom: ybottom,
yBottom: ybottom
};
}
return url;
@@ -764,6 +771,10 @@ function SignYourSelf() {
//function for get pdf page details
const pageDetails = async (pdf) => {
const load = {
status: true
};
setPdfLoadFail(load);
pdf.getPage(1).then((pdfPage) => {
const pageWidth = pdfPage.view[2];
@@ -848,7 +859,7 @@ function SignYourSelf() {
const xyPosition = {
xPos: mouseX,
yPos: mouseY,
yPos: mouseY
};
setXYSignature(xyPosition);
@@ -877,7 +888,7 @@ function SignYourSelf() {
...url,
Width: ref.offsetWidth,
Height: ref.offsetHeight,
xPosition: position.x,
xPosition: position.x
};
}
return url;
@@ -901,7 +912,7 @@ function SignYourSelf() {
return {
...url,
Width: ref.offsetWidth,
Height: ref.offsetHeight,
Height: ref.offsetHeight
};
}
return url;
@@ -975,7 +986,7 @@ function SignYourSelf() {
const newXypos = {
pageNumber: getPageNo,
pos: addSign,
pos: addSign
};
xyDefaultPos.push(newXypos);
}
@@ -989,14 +1000,14 @@ function SignYourSelf() {
selector: '[data-tut="reactourFirst"]',
content: `Drag the signature or stamp placeholder onto the PDF to choose your desired signing location.`,
position: "top",
style: { fontSize: "13px" },
style: { fontSize: "13px" }
},
{
selector: '[data-tut="reactourSecond"]',
content: `Drag and drop anywhere in this area. You can resize and move it later.`,
position: "top",
style: { fontSize: "13px" },
},
style: { fontSize: "13px" }
}
];
//function for update TourStatus
@@ -1023,14 +1034,14 @@ function SignYourSelf() {
"_appName"
)}${contractName}/${signerUserId}`,
{
TourStatus: updatedTourStatus,
TourStatus: updatedTourStatus
},
{
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken"),
},
sessionToken: localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -1054,7 +1065,7 @@ function SignYourSelf() {
) : (
<div className="signatureContainer">
{/* this component used for UI interaction and show their functionality */}
{!checkTourStatus && (
{pdfLoadFail && !checkTourStatus && (
<Tour
onRequestClose={closeTour}
steps={tourConfig}
@@ -1079,7 +1090,7 @@ function SignYourSelf() {
<div
style={{
marginLeft: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px"
}}
>
{/* this modal is used show this document is already sign */}
@@ -1099,7 +1110,7 @@ function SignYourSelf() {
borderRadius: "0px",
border: "1.5px solid #e3e2e1",
fontWeight: "600",
color: "black",
color: "black"
}}
className="btn"
onClick={() => setShowAlreadySignDoc({ status: false })}
@@ -1110,7 +1121,7 @@ function SignYourSelf() {
<button
onClick={() => addDefaultSignature()}
style={{
background: themeColor(),
background: themeColor()
}}
type="button"
className="finishBtn"
@@ -1184,6 +1195,8 @@ function SignYourSelf() {
pdfUrl={pdfUrl}
numPages={numPages}
pageDetails={pageDetails}
setPdfLoadFail={setPdfLoadFail}
pdfLoadFail={pdfLoadFail}
/>
</div>
</div>
microfrontends/SignDocuments/src/Component/component/fieldsComponent.js
+1 -1
View File
@@ -1,4 +1,4 @@
import React, { useState } from "react";
import React from "react";
import * as Select from "@radix-ui/react-select";
import classnames from "classnames";
microfrontends/SignDocuments/src/Component/component/header.js
+3
View File
@@ -224,11 +224,13 @@ function Header({
)}
{isPlaceholder ? (
<div
onClick={() => {
if (!isMailSend) {
alertSendEmail();
}
}}
style={{
color: isMailSend ? "gray" : themeColor(),
border: "none",
@@ -241,6 +243,7 @@ function Header({
</div>
) : (
<div
data-tut="reactourThird"
onClick={() => {
if (!pdfUrl) {
embedImages();
microfrontends/SignDocuments/src/Component/component/renderPdf.js
+729 -712
View File
File diff suppressed because it is too large Load Diff
microfrontends/SignDocuments/src/Component/login.js
+1 -2
View File
@@ -1,5 +1,4 @@
import React, { useState } from "react";
import signLogo from "../assests/mailLogo.png";
import "../css/LoginPage.css";
import loader from "../assests/loader2.gif";
import axios from "axios";
@@ -9,7 +8,7 @@ import { useEffect } from "react";
import { useNavigate } from "react-router-dom";
// import { useHistory } from "react-router-dom/cjs/react-router-dom.min";
function Login() {
const { id, userMail, serverUrl,serverId } = useParams();
const { id, userMail, serverUrl } = useParams();
let navigate = useNavigate();
// const history = useHistory();
microfrontends/SignDocuments/src/Component/placeHolderSign.js
+74 -73
View File
@@ -1,5 +1,4 @@
import React, { useState, useRef, useEffect } from "react";
import { Document, Page, pdfjs } from "react-pdf";
import axios from "axios";
import "../css/./signature.css";
import Modal from "react-bootstrap/Modal";
@@ -9,10 +8,8 @@ import { themeColor } from "../utils/ThemeColor/backColor";
import { DndProvider } from "react-dnd";
import { HTML5Backend } from "react-dnd-html5-backend";
import { useDrag, useDrop } from "react-dnd";
import { Rnd } from "react-rnd";
import RenderAllPdfPage from "./component/renderAllPdfPage";
import FieldsComponent from "./component/fieldsComponent";
import RSC from "react-scrollbars-custom";
import Tour from "reactour";
import { useParams } from "react-router-dom";
import Loader from "./component/loader";
@@ -25,8 +22,6 @@ import RenderPdf from "./component/renderPdf";
import ModalComponent from "./component/modalComponent";
function PlaceHolderSign() {
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
const [pdfDetails, setPdfDetails] = useState([]);
const [isMailSend, setIsMailSend] = useState(false);
const [allPages, setAllPages] = useState(null);
@@ -46,7 +41,7 @@ function PlaceHolderSign() {
const [isSend, setIsSend] = useState(false);
const [isLoading, setIsLoading] = useState({
isLoad: true,
message: "This might take some time",
message: "This might take some time"
});
const [handleError, setHandleError] = useState();
const [currentEmail, setCurrentEmail] = useState();
@@ -61,7 +56,10 @@ function PlaceHolderSign() {
const { docId } = useParams();
const [isShowEmail, setIsShowEmail] = useState(false);
const [selectedEmail, setSelectedEmail] = useState(false);
const [pdfLoadFail, setPdfLoadFail] = useState({
status: false,
type: "load"
});
const color = [
"#93a3db",
"#e6c3db",
@@ -74,15 +72,15 @@ function PlaceHolderSign() {
"#cc99ff",
"#ffcc99",
"#66ccff",
"#ffffcc",
"#ffffcc"
];
const [{ isOver }, drop] = useDrop({
accept: "BOX",
drop: (item, monitor) => addPositionOfSignature(item, monitor),
collect: (monitor) => ({
isOver: !!monitor.isOver(),
}),
isOver: !!monitor.isOver()
})
});
const [{ isDragSign }, dragSignature] = useDrag({
type: "BOX",
@@ -90,11 +88,11 @@ function PlaceHolderSign() {
item: {
type: "BOX",
id: 1,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragSign: !!monitor.isDragging(),
}),
isDragSign: !!monitor.isDragging()
})
});
const [{ isDragStamp }, dragStamp] = useDrag({
type: "BOX",
@@ -102,11 +100,11 @@ function PlaceHolderSign() {
item: {
type: "BOX",
id: 2,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragStamp: !!monitor.isDragging(),
}),
isDragStamp: !!monitor.isDragging()
})
});
const [{ isDragSignatureSS }, dragSignatureSS] = useDrag({
@@ -115,11 +113,11 @@ function PlaceHolderSign() {
item: {
type: "BOX",
id: 3,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragSignatureSS: !!monitor.isDragging(),
}),
isDragSignatureSS: !!monitor.isDragging()
})
});
const isMobile = window.innerWidth < 712;
const [{ isDragStampSS }, dragStampSS] = useDrag({
@@ -128,11 +126,11 @@ function PlaceHolderSign() {
item: {
type: "BOX",
id: 4,
text: "drag me",
text: "drag me"
},
collect: (monitor) => ({
isDragStampSS: !!monitor.isDragging(),
}),
isDragStampSS: !!monitor.isDragging()
})
});
const rowLevel =
@@ -176,8 +174,8 @@ function PlaceHolderSign() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -201,7 +199,7 @@ function PlaceHolderSign() {
} else {
setNoData(true);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -209,7 +207,7 @@ function PlaceHolderSign() {
.catch((err) => {
console.log("axois err ", err);
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -230,12 +228,12 @@ function PlaceHolderSign() {
}
}
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
} else if (res === "Error: Something went wrong!") {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -254,7 +252,7 @@ function PlaceHolderSign() {
}
}
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -304,7 +302,7 @@ function PlaceHolderSign() {
// setIsLoading(loadObj);
// });
};
console.log("signerpos", signerPos, isDragStampSS, isDragSignatureSS);
//function for setting position after drop signature button over pdf
const addPositionOfSignature = (item, monitor) => {
const isMobile = window.innerWidth < 712;
@@ -339,12 +337,12 @@ function PlaceHolderSign() {
key: key,
isDrag: false,
scale: isMobile && scale,
yBottom: window.innerHeight / 2 - 60,
yBottom: window.innerHeight / 2 - 60
};
dropData.push(dropObj);
xyPos = {
pageNumber: pageNumber,
pos: dropData,
pos: dropData
};
xyPosArr.push(xyPos);
@@ -367,13 +365,13 @@ function PlaceHolderSign() {
firstXPos: signBtnPosition[0] && signBtnPosition[0].xPos,
firstYPos: signBtnPosition[0] && signBtnPosition[0].yPos,
yBottom: ybottom,
scale: isMobile && scale,
scale: isMobile && scale
};
dropData.push(dropObj);
xyPos = {
pageNumber: pageNumber,
pos: dropData,
pos: dropData
};
xyPosArr.push(xyPos);
@@ -402,7 +400,7 @@ function PlaceHolderSign() {
let xyPos = {
pageNumber: pageNumber,
pos: newSignPos,
pos: newSignPos
};
updatePlace.push(xyPos);
@@ -413,8 +411,8 @@ function PlaceHolderSign() {
signerPtr: {
__type: "Pointer",
className: `${contractName}`,
objectId: signerObjId,
},
objectId: signerObjId
}
};
signerPos.splice(colorIndex, 1, placeHolderPos);
@@ -429,8 +427,8 @@ function PlaceHolderSign() {
signerPtr: {
__type: "Pointer",
className: `${contractName}`,
objectId: signerObjId,
},
objectId: signerObjId
}
};
signerPos.splice(colorIndex, 1, placeHolderPos);
@@ -440,11 +438,11 @@ function PlaceHolderSign() {
signerPtr: {
__type: "Pointer",
className: `${contractName}`,
objectId: signerObjId,
objectId: signerObjId
},
signerObjId: signerObjId,
blockColor: color[isSelectListId],
placeHolder: xyPosArr,
placeHolder: xyPosArr
};
setSignerPos((prev) => [...prev, placeHolderPos]);
@@ -452,6 +450,10 @@ function PlaceHolderSign() {
};
//function for get pdf page details
const pageDetails = async (pdf) => {
const load = {
status: true
};
setPdfLoadFail(load);
pdf.getPage(1).then((pdfPage) => {
const pageWidth = pdfPage.view[2];
@@ -494,7 +496,7 @@ function PlaceHolderSign() {
xPosition: dragElement.x,
yPosition: dragElement.y,
isDrag: true,
yBottom: ybottom,
yBottom: ybottom
};
}
return url;
@@ -607,7 +609,7 @@ function PlaceHolderSign() {
...url,
Width: ref.offsetWidth,
Height: ref.offsetHeight,
xPosition: position.x,
xPosition: position.x
};
}
return url;
@@ -636,7 +638,7 @@ function PlaceHolderSign() {
return {
...url,
Width: ref.offsetWidth,
Height: ref.offsetHeight,
Height: ref.offsetHeight
};
}
return url;
@@ -676,7 +678,7 @@ function PlaceHolderSign() {
const xyPosition = {
xPos: mouseX,
yPos: mouseY,
yPos: mouseY
};
setXYSignature(xyPosition);
@@ -691,13 +693,13 @@ function PlaceHolderSign() {
if (signerPos.length === signersdata.Signers.length) {
const alert = {
mssg: "confirm",
alert: true,
alert: true
};
setIsSendAlert(alert);
} else {
const alert = {
mssg: "sure",
alert: true,
alert: true
};
setIsSendAlert(alert);
@@ -706,7 +708,7 @@ function PlaceHolderSign() {
const sendEmailToSigners = async () => {
const loadObj = {
isLoad: true,
message: "This might take some time",
message: "This might take some time"
};
setIsLoading(loadObj);
setIsSendAlert({});
@@ -717,7 +719,7 @@ function PlaceHolderSign() {
const localExpireDate = newDate.toLocaleDateString("en-US", {
day: "numeric",
month: "long",
year: "numeric",
year: "numeric"
});
let sender = signersdata.ExtUserPtr.Email;
@@ -734,7 +736,7 @@ function PlaceHolderSign() {
const headers = {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken"),
sessionToken: localStorage.getItem("accesstoken")
};
const serverUrl = localStorage.getItem("baseUrl");
const newServer = serverUrl.replaceAll("/", "%2F");
@@ -768,7 +770,7 @@ function PlaceHolderSign() {
signPdf +
"> <button style='padding: 12px 20px 12px 20px;background-color: #d46b0f;color: white; border: 0px;box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;font-weight:bold'>Sign here</button></a> </div> </td><td> </td></tr></table> </div><div style='display: flex; justify-content: center;margin-top: 10px;'> </div></div></div><div><p> This is an automated email from Open Sign. For any queries regarding this email, please contact the sender " +
sender +
" directly.If you think this email is inappropriate or spam, you may file a complaint with Open Sign here.</p> </div></div></body> </html>",
" directly.If you think this email is inappropriate or spam, you may file a complaint with Open Sign here.</p> </div></div></body> </html>"
};
sendMail = await axios.post(url, params, { headers: headers });
} catch (error) {
@@ -780,11 +782,8 @@ function PlaceHolderSign() {
try {
const data = {
Placeholders: signerPos,
SignedUrl: pdfDetails[0].URL,
SignedUrl: pdfDetails[0].URL
};
const isMobile = window.innerWidth < 712;
const newWidth = window.innerWidth;
const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
await axios
.put(
@@ -796,8 +795,8 @@ function PlaceHolderSign() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((result) => {
@@ -805,7 +804,7 @@ function PlaceHolderSign() {
setIsSend(true);
setIsMailSend(true);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
// console.log("save res", res);
@@ -826,26 +825,26 @@ function PlaceHolderSign() {
content: `Select a recipient from this list to add a place-holder where he is supposed to sign.The placeholder will appear in the same colour as the recipient name once you drop it on the document.`,
position: "top",
style: { fontSize: "13px" },
style: { fontSize: "13px" }
},
{
selector: '[data-tut="reactourSecond"]',
content: `Drag the signature or stamp placeholder onto the PDF to choose your desired signing location.`,
position: "top",
style: { fontSize: "13px" },
style: { fontSize: "13px" }
},
{
selector: '[data-tut="reactourThird"]',
content: `Drag the placeholder for a recipient anywhere on the document.Remember, it will appear in the same colour as the name of the recipient for easy reference.`,
position: "top",
style: { fontSize: "13px" },
style: { fontSize: "13px" }
},
{
selector: '[data-tut="reactourFour"]',
content: `Clicking "Send" button will share the document with all the recipients.It will also send out emails to everyone on the recipients list.`,
position: "top",
style: { fontSize: "13px" },
},
style: { fontSize: "13px" }
}
];
//function for update TourStatus
@@ -872,14 +871,14 @@ function PlaceHolderSign() {
"baseUrl"
)}classes/${extUserClass}/${signerUserId}`,
{
TourStatus: updatedTourStatus,
TourStatus: updatedTourStatus
},
{
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken"),
},
sessionToken: localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -927,7 +926,7 @@ function PlaceHolderSign() {
<div
style={{
marginLeft: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px"
}}
>
{/* this modal is used show alert set placeholder for all signers before send mail */}
@@ -967,7 +966,7 @@ function PlaceHolderSign() {
<button
onClick={() => setIsSendAlert({})}
style={{
color: "black",
color: "black"
}}
type="button"
className="finishBtn"
@@ -978,7 +977,7 @@ function PlaceHolderSign() {
<button
onClick={() => sendEmailToSigners()}
style={{
background: "#24b53a",
background: "#24b53a"
}}
type="button"
className="finishBtn"
@@ -992,7 +991,7 @@ function PlaceHolderSign() {
<Modal show={isSend}>
<Modal.Header
style={{
background: themeColor(),
background: themeColor()
}}
// className="bg-danger"
>
@@ -1016,7 +1015,7 @@ function PlaceHolderSign() {
setSignerPos([]);
}}
style={{
color: "black",
color: "black"
}}
type="button"
className="finishBtn"
@@ -1031,7 +1030,7 @@ function PlaceHolderSign() {
<button
style={{
background: themeColor(),
color: "white",
color: "white"
}}
type="button"
className="finishBtn"
@@ -1047,7 +1046,7 @@ function PlaceHolderSign() {
setSignerPos([]);
}}
style={{
color: "black",
color: "black"
}}
type="button"
className="finishBtn"
@@ -1093,6 +1092,8 @@ function PlaceHolderSign() {
handleTabDrag={handleTabDrag}
handleStop={handleStop}
handleImageResize={handleImageResize}
setPdfLoadFail={setPdfLoadFail}
pdfLoadFail={pdfLoadFail}
/>
</div>
</div>
microfrontends/SignDocuments/src/Component/recipientSignPdf.js
+73 -58
View File
@@ -14,7 +14,7 @@ import DefaultSignature from "./component/defaultSignature";
import {
getBase64FromUrl,
getBase64FromIMG,
contactBookName,
contactBookName
} from "../utils/Utils";
import Tour from "reactour";
import Signedby from "./component/signedby";
@@ -46,7 +46,7 @@ function EmbedPdfImage() {
const [handleError, setHandleError] = useState();
const [isLoading, setIsLoading] = useState({
isLoad: true,
message: "This might take some time",
message: "This might take some time"
});
const [defaultSignImg, setDefaultSignImg] = useState();
const [userObjectID, setUserObjectID] = useState();
@@ -62,9 +62,12 @@ function EmbedPdfImage() {
const [noData, setNoData] = useState(false);
const [contractName, setContractName] = useState("");
const [isDecline, setIsDecline] = useState({
isDeclined: false,
isDeclined: false
});
const [pdfLoadFail, setPdfLoadFail] = useState({
status: false,
type: "load"
});
const [pdfLoadFail, setPdfLoadFail] = useState(false);
const docId = id && id;
//"F0hg0twSJH";
@@ -86,7 +89,8 @@ function EmbedPdfImage() {
//aspfUo7wRl
let currUserId, userObjectId;
const json = await contactBookName(userPhone, "_Users");
if (json && json.results[0]) {
if (json !== "Error: Something went wrong!" && json && json.results[0]) {
setContractName("_Users");
if (json.results[0]) {
userObjectId = json.results[0].UserId.objectId;
@@ -109,13 +113,13 @@ function EmbedPdfImage() {
} else {
setNoData(true);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
} else if (json === "Error: Something went wrong!") {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -144,7 +148,7 @@ function EmbedPdfImage() {
} else {
setNoData(true);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -210,8 +214,8 @@ function EmbedPdfImage() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -230,27 +234,27 @@ function EmbedPdfImage() {
//then show alert with completed message
const alreadySign = {
status: true,
mssg: "This document has already been signed!",
mssg: "This document has already been signed!"
};
setIsAlreadySign(alreadySign);
setPdfUrl(res[0].SignedUrl);
setSignedPdfData(json.results);
setCompletePdfData(res);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
} else if (declined) {
const currentDecline = {
currnt: "another",
isDeclined: true,
isDeclined: true
};
setIsDecline(currentDecline);
setSignedPdfData(json.results);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
} else if (currDate > expireUpdateDate) {
@@ -281,7 +285,7 @@ function EmbedPdfImage() {
setSignKey(key);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -301,13 +305,13 @@ function EmbedPdfImage() {
setSignKey(key);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
} else {
@@ -338,12 +342,12 @@ function EmbedPdfImage() {
if (checkAlreadyBySigner && checkAlreadyBySigner.length > 0) {
const alreadySign = {
status: true,
mssg: "You have successfully signed the document!",
mssg: "You have successfully signed the document!"
};
setIsAlreadySign(alreadySign);
setPdfUrl(res[0].SignedUrl);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -363,7 +367,7 @@ function EmbedPdfImage() {
setSignKey(key);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -384,7 +388,7 @@ function EmbedPdfImage() {
setSignKey(key);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
@@ -392,14 +396,14 @@ function EmbedPdfImage() {
} else {
setNoData(true);
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
}
})
.catch((err) => {
const loadObj = {
isLoad: false,
isLoad: false
};
setHandleError("Error: Something went wrong!");
setIsLoading(loadObj);
@@ -414,8 +418,8 @@ function EmbedPdfImage() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -426,7 +430,7 @@ function EmbedPdfImage() {
setDefaultSignImg(res[0].ImageURL);
}
const loadObj = {
isLoad: false,
isLoad: false
};
setIsLoading(loadObj);
})
@@ -438,6 +442,10 @@ function EmbedPdfImage() {
//function for get pdf page details
const pageDetails = async (pdf) => {
const load = {
status: true
};
setPdfLoadFail(load);
pdf.getPage(1).then((pdfPage) => {
const pageWidth = pdfPage.view[2];
@@ -462,7 +470,7 @@ function EmbedPdfImage() {
} else {
const loadObj = {
isLoad: true,
message: "This might take some time",
message: "This might take some time"
};
setIsLoading(loadObj);
const url = pdfUrl
@@ -474,7 +482,7 @@ function EmbedPdfImage() {
// Load a PDFDocument from the existing PDF bytes
const pdfDoc = await PDFDocument.load(existingPdfBytes, {
ignoreEncryption: true,
ignoreEncryption: true
});
const pngUrl = xyPostion;
@@ -499,7 +507,7 @@ function EmbedPdfImage() {
y: page.getHeight() - 10,
size: fontSize,
font,
color: rgb(0.5, 0.5, 0.5),
color: rgb(0.5, 0.5, 0.5)
});
}
pdfBase64 = await pdfDoc.saveAsBase64({ useObjectStreams: false });
@@ -575,7 +583,7 @@ function EmbedPdfImage() {
y: page.getHeight() - 10,
size: fontSize,
font,
color: rgb(0.5, 0.5, 0.5),
color: rgb(0.5, 0.5, 0.5)
});
}
for (let i = 0; i < pngUrl.length; i++) {
@@ -621,11 +629,14 @@ function EmbedPdfImage() {
const newWidth = window.innerWidth;
const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
page.drawImage(img, {
x: imgUrlList[id].xPosition * scale + 50,
x: isMobile
? imgUrlList[id].xPosition * scale + 50
: imgUrlList[id].xPosition,
y:
page.getHeight() - imgUrlList[id].yPosition * scale - imgHeight,
width: imgWidth,
height: imgHeight,
height: imgHeight
});
});
}
@@ -674,13 +685,13 @@ function EmbedPdfImage() {
Bottom: bottomY,
Width: xyPosData.Width ? xyPosData.Width : 150,
Height: height,
Page: pageNo,
},
Page: pageNo
}
};
} else if (xyPostion.length > 0 && xyPostion[0].pos.length > 0) {
signgleSign = {
pdfFile: base64Url,
docId: docId,
docId: docId
};
}
@@ -692,8 +703,8 @@ function EmbedPdfImage() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken"),
},
sessionToken: localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -786,7 +797,7 @@ function EmbedPdfImage() {
//function for set decline true on press decline button
const declineDoc = async () => {
const data = {
IsDeclined: true,
IsDeclined: true
};
await axios
@@ -799,8 +810,8 @@ function EmbedPdfImage() {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((result) => {
@@ -808,7 +819,7 @@ function EmbedPdfImage() {
if (res) {
const currentDecline = {
currnt: "YouDeclined",
isDeclined: true,
isDeclined: true
};
setIsDecline(currentDecline);
}
@@ -834,7 +845,7 @@ function EmbedPdfImage() {
const newXypos = {
pageNumber: getPageNo,
pos: addSign,
pos: addSign
};
xyDefaultPos.push(newXypos);
}
@@ -869,14 +880,14 @@ function EmbedPdfImage() {
"_appName"
)}${contractName}/${signerUserId}`,
{
TourStatus: updatedTourStatus,
TourStatus: updatedTourStatus
},
{
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -896,20 +907,20 @@ function EmbedPdfImage() {
selector: '[data-tut="reactourFirst"]',
content: `You can click "Auto Sign All" to automatically sign at all the locations meant to be signed by you.Make sure that you review the document properly before you click this button.`,
position: "top",
style: { fontSize: "13px" },
style: { fontSize: "13px" }
},
{
selector: '[data-tut="reactourSecond"]',
content: `Click any of such placeholders appearing on the document to sign.You will see the options to draw sign or upload an image once you click here.`,
position: "top",
style: { fontSize: "13px" },
style: { fontSize: "13px" }
},
{
selector: '[data-tut="reactourThird"]',
content: `Click here to finish & download the signed document.You will also receive a copy on your email.`,
position: "top",
style: { fontSize: "13px" },
},
style: { fontSize: "13px" }
}
];
const stepsToShow =
@@ -928,6 +939,7 @@ function EmbedPdfImage() {
/>
);
};
return (
<DndProvider backend={HTML5Backend}>
{isLoading.isLoad ? (
@@ -939,7 +951,10 @@ function EmbedPdfImage() {
) : (
<div className="signatureContainer">
{/* this component used for UI interaction and show their functionality */}
{!isExpired || (!pdfLoadFail && !checkTourStatus && tourFunction())}
{pdfLoadFail.status &&
!isExpired &&
!checkTourStatus &&
tourFunction()}
{/* this component used to render all pdf pages in left side */}
<RenderAllPdfPage
@@ -954,7 +969,7 @@ function EmbedPdfImage() {
<div
style={{
marginLeft: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px",
marginRight: pdfOriginalWidth > 500 && "20px"
}}
>
{/* this modal is used for show decline alert */}
@@ -982,7 +997,7 @@ function EmbedPdfImage() {
<>
<button
style={{
color: "black",
color: "black"
}}
type="button"
className="finishBtn"
@@ -992,7 +1007,7 @@ function EmbedPdfImage() {
</button>
<button
style={{
background: "#de4337",
background: "#de4337"
}}
type="button"
className="finishBtn"
@@ -1004,8 +1019,7 @@ function EmbedPdfImage() {
)}
</Modal.Footer>
</Modal>
{/* this modal component is used for show failed document pdf files */}
<ModalComponent isShow={pdfLoadFail} type={"pdfFail"} />
{/* this modal component is used for show expired document */}
<ModalComponent isShow={isExpired} type={"expire"} />
@@ -1025,7 +1039,7 @@ function EmbedPdfImage() {
borderRadius: "0px",
border: "1.5px solid #e3e2e1",
fontWeight: "600",
color: "black",
color: "black"
}}
className="btn"
onClick={() => setIsAlreadySign({ status: false })}
@@ -1036,7 +1050,7 @@ function EmbedPdfImage() {
<button
onClick={() => addDefaultSignature()}
style={{
background: themeColor(),
background: themeColor()
}}
type="button"
className="finishBtn"
@@ -1063,7 +1077,7 @@ function EmbedPdfImage() {
defaultSign={defaultSignImg}
/>
{/* pdf header which contain funish back button */}
{/* pdf header which contain finish back button */}
<Header
recipient={true}
pdfDetails={completePdfData}
@@ -1095,6 +1109,7 @@ function EmbedPdfImage() {
recipient={true}
isAlreadySign={isAlreadySign}
setPdfLoadFail={setPdfLoadFail}
pdfLoadFail={pdfLoadFail}
/>
</div>
microfrontends/SignDocuments/src/utils/Utils.js
+55 -53
View File
@@ -86,7 +86,7 @@ export function onSaveImage(xyPostion, index, signKey, imgWH, image) {
Width: newWidth,
Height: nweHeight,
SignUrl: image.src,
ImageType: image.imgType,
ImageType: image.imgType
};
}
return url;
@@ -132,7 +132,7 @@ export function onSaveImage(xyPostion, index, signKey, imgWH, image) {
Width: newWidth,
Height: newHeight,
SignUrl: image.src,
ImageType: image.imgType,
ImageType: image.imgType
};
}
return url;
@@ -151,54 +151,54 @@ export function onSaveImage(xyPostion, index, signKey, imgWH, image) {
//function for save button to save signature or image url
export function onSaveSign(xyPostion, index, signKey, signatureImg) {
const updateFilter = xyPostion[index].pos.filter(
(data) => data.key === signKey && data.SignUrl
);
// const updateFilter = xyPostion[index].pos.filter(
// (data) => data.key === signKey && data.SignUrl
// );
if (updateFilter.length > 0) {
const getXYdata = xyPostion[index].pos;
// updateFilter[0].SignUrl = signatureImg;
let getXYdata = xyPostion[index].pos;
let getPosData = getXYdata;
// if (updateFilter.length > 0) {
// updateFilter[0].SignUrl = signatureImg;
const addSign = getPosData.map((url, ind) => {
if (url.key === signKey) {
return {
...url,
Width: getPosData[0].Width ? getPosData[0].Width : 150,
Height: getPosData[0].Height ? getPosData[0].Height : 60,
SignUrl: signatureImg
};
}
return url;
});
const getPosData = getXYdata;
const addSign = getPosData.map((url, ind) => {
if (url.key === signKey) {
return {
...url,
Width: 150,
Height: 60,
SignUrl: signatureImg,
};
}
return url;
});
const newUpdateUrl = xyPostion.map((obj, ind) => {
if (ind === index) {
return { ...obj, pos: addSign };
}
return obj;
});
return newUpdateUrl;
// } else {
// const addSign = getPosData.map((url, ind) => {
// if (url.key === signKey) {
// return {
// ...url,
// SignUrl: signatureImg,
// Width: getPosData[0].Width ? getPosData[0].Width : 150,
// Height: getPosData[0].Height ? getPosData[0].Height : 60
// };
// }
// return url;
// });
const newUpdateUrl = xyPostion.map((obj, ind) => {
if (ind === index) {
return { ...obj, pos: addSign };
}
return obj;
});
return newUpdateUrl;
} else {
const getXYdata = xyPostion[index].pos;
const getPosData = getXYdata;
const addSign = getPosData.map((url, ind) => {
if (url.key === signKey) {
return { ...url, SignUrl: signatureImg, Width: 150, Height: 60 };
}
return url;
});
const newUpdateUrl = xyPostion.map((obj, ind) => {
if (ind === index) {
return { ...obj, pos: addSign };
}
return obj;
});
return newUpdateUrl;
}
// const newUpdateUrl = xyPostion.map((obj, ind) => {
// if (ind === index) {
// return { ...obj, pos: addSign };
// }
// return obj;
// });
// return newUpdateUrl;
// }
}
//function for getting contract_User details
@@ -212,8 +212,8 @@ export const contractUsers = async (objectId) => {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -239,8 +239,8 @@ export const contactBook = async (objectId) => {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -265,8 +265,8 @@ export const contactBookName = async (userPhone, className) => {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
},
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
}
}
)
.then((Listdata) => {
@@ -278,3 +278,5 @@ export const contactBookName = async (userPhone, className) => {
});
return result;
};