mirror of
https://github.com/OpenSignLabs/OpenSign.git
synced 2026-08-21 15:12:34 +02:00
handled placeholder from all devices, remove underline from certificate,login page style,solved reactour issue for document owner from login flow, need your sign reports finish button issue,remove commented code, delete button(cross) on email documents popup issue and solve some minor design issue
This commit is contained in:
RaktimaNXG
@@ -5,54 +5,14 @@ function DefaultSignature({
|
||||
themeColor,
|
||||
defaultSignImg,
|
||||
setShowAlreadySignDoc,
|
||||
setDefaultSignImg,
|
||||
userObjectId,
|
||||
setIsLoading,
|
||||
xyPostion,
|
||||
xyPostion
|
||||
}) {
|
||||
useEffect(() => {
|
||||
getDefaultSignature(userObjectId);
|
||||
}, []);
|
||||
|
||||
//function for fetch default sigature added bu users
|
||||
const getDefaultSignature = async (userObjectId) => {
|
||||
await axios
|
||||
.get(
|
||||
`${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
|
||||
"_appName"
|
||||
)}_Signature?where={"UserId": {"__type": "Pointer","className": "_User", "objectId":"${userObjectId}"}}`,
|
||||
{
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
|
||||
"X-Parse-Session-Token": localStorage.getItem("accesstoken"),
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((Listdata) => {
|
||||
const json = Listdata.data;
|
||||
const res = json.results;
|
||||
|
||||
if (res[0] && res.length > 0) {
|
||||
setDefaultSignImg(res[0].ImageURL);
|
||||
}
|
||||
const loadObj = {
|
||||
isLoad: false,
|
||||
};
|
||||
setIsLoading(loadObj);
|
||||
})
|
||||
.catch((err) => {
|
||||
// this.setState({ loading: false });
|
||||
console.log("axois err ", err);
|
||||
});
|
||||
};
|
||||
|
||||
const confirmToaddDefaultSign = () => {
|
||||
if (xyPostion.length > 0) {
|
||||
const alreadySign = {
|
||||
status: true,
|
||||
mssg: "Are you sure you want to sign at requested locations?",
|
||||
sure: true,
|
||||
sure: true
|
||||
};
|
||||
setShowAlreadySignDoc(alreadySign);
|
||||
} else {
|
||||
@@ -67,7 +27,7 @@ function DefaultSignature({
|
||||
background: themeColor(),
|
||||
color: "white",
|
||||
padding: "5px",
|
||||
fontFamily: "sans-serif",
|
||||
fontFamily: "sans-serif"
|
||||
}}
|
||||
>
|
||||
Signature
|
||||
@@ -78,7 +38,7 @@ function DefaultSignature({
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
marginTop: "10px",
|
||||
fontWeight: "600",
|
||||
fontWeight: "600"
|
||||
}}
|
||||
>
|
||||
{defaultSignImg ? (
|
||||
@@ -90,7 +50,7 @@ function DefaultSignature({
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
objectFit: "contain",
|
||||
objectFit: "contain"
|
||||
}}
|
||||
src={defaultSignImg}
|
||||
/>
|
||||
@@ -100,7 +60,7 @@ function DefaultSignature({
|
||||
background: themeColor(),
|
||||
color: "white",
|
||||
marginTop: "20px",
|
||||
cursor: "pointer",
|
||||
cursor: "pointer"
|
||||
}}
|
||||
type="button"
|
||||
className="finishBtn finishnHover"
|
||||
@@ -111,7 +71,9 @@ function DefaultSignature({
|
||||
</>
|
||||
) : (
|
||||
<div style={{ margin: "10px" }}>
|
||||
<span>Click a signature placeholder to start signing the document!</span>
|
||||
<span>
|
||||
Click a signature placeholder to start signing the document!
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -18,7 +18,7 @@ function EmailComponent({
|
||||
setSuccessEmail,
|
||||
signObjId,
|
||||
pdfName,
|
||||
sender,
|
||||
sender
|
||||
}) {
|
||||
const [emailCount, setEmailCount] = useState([]);
|
||||
const [emailValue, setEmailValue] = useState();
|
||||
@@ -28,28 +28,9 @@ function EmailComponent({
|
||||
setIsLoading(true);
|
||||
let sendMail, recipent;
|
||||
for (let i = 0; i < emailCount.length; i++) {
|
||||
// await axios
|
||||
// .get(
|
||||
// `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem("_appName")}_Contactbook?where={"Email":"${emailCount[i]}"}`,
|
||||
// {
|
||||
// headers: {
|
||||
// "Content-Type": "application/json",
|
||||
// "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
|
||||
// sessionToken: localStorage.getItem("accesstoken"),
|
||||
// },
|
||||
// }
|
||||
// )
|
||||
// .then((Listdata) => {
|
||||
// const json = Listdata.data;
|
||||
// if (json.results[0]) {
|
||||
// recipent = json.results[0];
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// console.log("axois err ", err);
|
||||
// });
|
||||
|
||||
try {
|
||||
console.log("recipients", recipent);
|
||||
|
||||
const imgPng =
|
||||
"https://qikinnovation.ams3.digitaloceanspaces.com/logo.png";
|
||||
// "https://qikinnovation.ams3.digitaloceanspaces.com/mailLogo_2023-08-18T12%3A51%3A31.573Z.png";
|
||||
@@ -58,15 +39,9 @@ function EmailComponent({
|
||||
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");
|
||||
|
||||
// const serverParams = `${newServer}&${localStorage.getItem(
|
||||
// "parseAppId"
|
||||
// )}&${localStorage.getItem("_appName")}`;
|
||||
// let pdfUrlWeb = `<span><a href=https://qik-ai-org.github.io/Sign-MicroappV2/#/login/${signObjId}/${recipent.Email}/${serverParams} style='cursor: pointer;'> ${pdfName}</a><span>`;
|
||||
|
||||
const themeBGcolor = themeColor();
|
||||
let params = {
|
||||
pdfName: pdfName,
|
||||
@@ -83,8 +58,7 @@ function EmailComponent({
|
||||
pdfName +
|
||||
" Standard is attached to this email. Kindly download the document from the attachment.</p></div> </div><div><p>This is an automated email from Open Sign. For any queries regarding this email, please contact the sender " +
|
||||
sender.email +
|
||||
" directly. If you think this email is inappropriate or spam, you may file a complaint with Open Sign here.</p></div></div></body></html>",
|
||||
//"html":"<html><head><meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /> </head> <body> <div style='background-color: #f5f5f5; padding: 20px'> <div style=' box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;background-color: white;padding-bottom: 20px;'> <div><img src="+imgPng +" height='50' style='padding: 20px' /></div> <div style=' padding: 2px;font-family: system-ui;background-color: #47a3ad;'><p style='font-size: 20px;font-weight: 400;color: white;padding-left: 20px;' > Digital Signature Request</p></div><div><p style='padding: 20px;font-family: system-ui;font-size: 14px; margin-bottom: 10px;'> " + recipent.Name + " has requested you to review and sign" +pdfName+"</p><div style='padding: 5px 0px 5px 25px;display: flex;flex-direction: row;justify-content: space-around;'><span>Sender</span><span>" + recipent.Email + " </span></div><div style='display: flex; justify-content: center;margin-top: 10px;'><button style='padding: 8px 15px 8px 15px;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;'>Sign here</button></div></div></div><div><p> This is an automated email from Open Sign. For any queries regarding this email, please contact the sender " + recipent.Email + " 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) {
|
||||
@@ -138,7 +112,6 @@ function EmailComponent({
|
||||
const base64 = await getBase64FromUrl(pdfUrl);
|
||||
printModule({ printable: base64, type: "pdf", base64: true });
|
||||
|
||||
// window.print('https://nxgcreator.s3.ap-south-1.amazonaws.com/exported_file_32_2023-08-22T04%3A59%3A13.432Z.pdf',);
|
||||
};
|
||||
|
||||
//handle download signed pdf
|
||||
@@ -146,6 +119,9 @@ function EmailComponent({
|
||||
saveAs(pdfUrl, `${pdfName}_signed_by_OpenSign™.pdf`);
|
||||
};
|
||||
|
||||
const isAndroid = /Android/i.test(navigator.userAgent);
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
{/* isEmail */}
|
||||
@@ -162,7 +138,7 @@ function EmailComponent({
|
||||
alignItems: "center",
|
||||
zIndex: "20",
|
||||
backgroundColor: "#e6f2f2",
|
||||
opacity: 0.8,
|
||||
opacity: 0.8
|
||||
}}
|
||||
>
|
||||
<img
|
||||
@@ -181,26 +157,28 @@ function EmailComponent({
|
||||
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
<div></div>
|
||||
<button
|
||||
onClick={handleToPrint}
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
}}
|
||||
className="btn btn-primary btn-sm"
|
||||
>
|
||||
<i
|
||||
className="fa fa-print"
|
||||
{!isAndroid && (
|
||||
<button
|
||||
onClick={handleToPrint}
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
color: "white",
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Print
|
||||
</button>
|
||||
className="btn btn-primary btn-sm"
|
||||
>
|
||||
<i
|
||||
className="fa fa-print"
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
color: "white"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Print
|
||||
</button>
|
||||
)}
|
||||
|
||||
<button
|
||||
className="btn btn-danger btn-sm"
|
||||
@@ -209,7 +187,7 @@ function EmailComponent({
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
marginLeft: "10px",
|
||||
marginLeft: "10px"
|
||||
}}
|
||||
>
|
||||
<i
|
||||
@@ -217,7 +195,7 @@ function EmailComponent({
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
@@ -231,7 +209,7 @@ function EmailComponent({
|
||||
<div
|
||||
style={{
|
||||
position: "absolute",
|
||||
marginLeft: "50px",
|
||||
marginLeft: "50px"
|
||||
}}
|
||||
>
|
||||
<img
|
||||
@@ -249,7 +227,7 @@ function EmailComponent({
|
||||
verticalAlign: "baseline",
|
||||
fontWeight: "500",
|
||||
color: "#403f3e",
|
||||
fontSize: "15px",
|
||||
fontSize: "15px"
|
||||
}}
|
||||
>
|
||||
Recipients added here will get a copy of the signed document.
|
||||
@@ -261,18 +239,20 @@ function EmailComponent({
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
width: "450px",
|
||||
flexWrap: "wrap",
|
||||
|
||||
flexWrap: "wrap"
|
||||
}}
|
||||
>
|
||||
{emailCount.map((data, ind) => {
|
||||
return (
|
||||
<div className="emailChip" key={ind}>
|
||||
<div className="emailChip"
|
||||
style={{display:"flex", flexDirection:"row", alignItems:"center"}}
|
||||
key={ind}>
|
||||
<span
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "13px",
|
||||
marginRight: "20px",
|
||||
marginRight: "20px"
|
||||
}}
|
||||
>
|
||||
{data}
|
||||
@@ -317,7 +297,7 @@ function EmailComponent({
|
||||
)}
|
||||
<span
|
||||
style={{
|
||||
cursor: emailValue && "pointer",
|
||||
cursor: emailValue && "pointer"
|
||||
}}
|
||||
onClick={() => {
|
||||
if (emailValue) {
|
||||
@@ -330,7 +310,7 @@ function EmailComponent({
|
||||
backgroundColor: themeColor(),
|
||||
padding: "2px 10px",
|
||||
marginTop: "10px",
|
||||
color: "white",
|
||||
color: "white"
|
||||
}}
|
||||
className="fa fa-plus"
|
||||
aria-hidden="true"
|
||||
@@ -342,7 +322,7 @@ function EmailComponent({
|
||||
background: "#e3e2e1",
|
||||
marginTop: "30px",
|
||||
padding: "5px",
|
||||
borderRadius: "3px",
|
||||
borderRadius: "3px"
|
||||
}}
|
||||
>
|
||||
<span style={{ fontWeight: "700" }}>Note:</span>
|
||||
@@ -356,7 +336,7 @@ function EmailComponent({
|
||||
<Modal.Footer>
|
||||
<button
|
||||
style={{
|
||||
color: "black",
|
||||
color: "black"
|
||||
}}
|
||||
type="button"
|
||||
className="finishBtn"
|
||||
@@ -368,7 +348,7 @@ function EmailComponent({
|
||||
disabled={emailCount.length === 0 && true}
|
||||
style={{
|
||||
background: themeColor(),
|
||||
color: "white",
|
||||
color: "white"
|
||||
}}
|
||||
type="button"
|
||||
className={emailCount.length === 0 ? "defaultBtn" : "finishBtn"}
|
||||
|
||||
@@ -36,8 +36,8 @@ function FieldsComponent({
|
||||
}) {
|
||||
const signStyle = pdfUrl ? "disableSign" : "signatureBtn";
|
||||
|
||||
const isMobile = window.innerWidth < 712;
|
||||
|
||||
const isMobile = window.innerWidth <767;
|
||||
|
||||
const SelectItem = React.forwardRef(
|
||||
({ children, className, ...props }, forwardedRef) => {
|
||||
return (
|
||||
@@ -107,7 +107,7 @@ function FieldsComponent({
|
||||
}}
|
||||
>
|
||||
<Select.Trigger
|
||||
className="SelectTrigger"
|
||||
className={selectedEmail ? "selectEmail": "SelectTrigger"}
|
||||
style={{
|
||||
background: isSelectListId
|
||||
? color[isSelectListId % color.length]
|
||||
@@ -115,7 +115,10 @@ function FieldsComponent({
|
||||
}}
|
||||
aria-label="Food"
|
||||
>
|
||||
<Select.Value placeholder="Select signer.." />
|
||||
<Select.Value
|
||||
|
||||
placeholder="Select signer.." />
|
||||
{!selectedEmail &&
|
||||
<Select.Icon className="SelectIcon">
|
||||
<i
|
||||
style={{
|
||||
@@ -127,7 +130,7 @@ function FieldsComponent({
|
||||
className="fa fa-angle-down"
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
</Select.Icon>
|
||||
</Select.Icon>}
|
||||
</Select.Trigger>
|
||||
<Select.Portal>
|
||||
<Select.Content
|
||||
|
||||
@@ -33,8 +33,9 @@ function Header({
|
||||
decline,
|
||||
currentSigner,
|
||||
dataTut4,
|
||||
alreadySign
|
||||
}) {
|
||||
const isMobile = window.innerWidth < 712;
|
||||
const isMobile = window.innerWidth < 767;
|
||||
const navigate = useNavigate();
|
||||
|
||||
//for go to previous page
|
||||
@@ -49,7 +50,7 @@ function Header({
|
||||
const handleDeclinePdfAlert = async () => {
|
||||
const currentDecline = {
|
||||
currnt: "Sure",
|
||||
isDeclined: true,
|
||||
isDeclined: true
|
||||
};
|
||||
setIsDecline(currentDecline);
|
||||
};
|
||||
@@ -108,7 +109,7 @@ function Header({
|
||||
fontSize: "13px",
|
||||
fontWeight: "600",
|
||||
marginLeft: "10px",
|
||||
marginRight: "10px",
|
||||
marginRight: "10px"
|
||||
}}
|
||||
>
|
||||
{pageNumber || (allPages ? 1 : "--")} of {allPages || "--"}
|
||||
@@ -132,7 +133,7 @@ function Header({
|
||||
color: themeColor(),
|
||||
border: "none",
|
||||
fontWeight: "650",
|
||||
fontSize: "16px",
|
||||
fontSize: "16px"
|
||||
}}
|
||||
>
|
||||
<i className="fa fa-ellipsis-v" aria-hidden="true"></i>
|
||||
@@ -151,7 +152,7 @@ function Header({
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
flexDirection: "row"
|
||||
}}
|
||||
>
|
||||
<i
|
||||
@@ -164,6 +165,7 @@ function Header({
|
||||
</DropdownMenu.Item>
|
||||
<DropdownMenu.Item className="DropdownMenuItem">
|
||||
<PDFDownloadLink
|
||||
style={{ textDecoration: "none" }}
|
||||
document={<Certificate pdfData={pdfDetails} />}
|
||||
fileName={`completion certificate-${
|
||||
pdfDetails[0] && pdfDetails[0].Name
|
||||
@@ -175,22 +177,26 @@ function Header({
|
||||
{loading ? (
|
||||
"Loading document..."
|
||||
) : (
|
||||
<div
|
||||
<button
|
||||
type="button"
|
||||
className="defaultBtn certificateBtn"
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
<i
|
||||
className="fa fa-certificate"
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Certificate
|
||||
</div>
|
||||
</button>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
@@ -216,7 +222,7 @@ function Header({
|
||||
border: "none",
|
||||
fontWeight: "650",
|
||||
fontSize: "16px",
|
||||
marginRight: "10px",
|
||||
marginRight: "10px"
|
||||
}}
|
||||
>
|
||||
Decline
|
||||
@@ -224,18 +230,16 @@ function Header({
|
||||
)}
|
||||
{isPlaceholder ? (
|
||||
<div
|
||||
|
||||
onClick={() => {
|
||||
if (!isMailSend) {
|
||||
alertSendEmail();
|
||||
}
|
||||
}}
|
||||
|
||||
style={{
|
||||
color: isMailSend ? "gray" : themeColor(),
|
||||
border: "none",
|
||||
fontWeight: "650",
|
||||
fontSize: "16px",
|
||||
fontSize: "16px"
|
||||
}}
|
||||
data-tut={dataTut4}
|
||||
>
|
||||
@@ -243,7 +247,7 @@ function Header({
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
data-tut="reactourThird"
|
||||
data-tut="reactourThird"
|
||||
onClick={() => {
|
||||
if (!pdfUrl) {
|
||||
embedImages();
|
||||
@@ -253,7 +257,7 @@ function Header({
|
||||
color: themeColor(),
|
||||
border: "none",
|
||||
fontWeight: "650",
|
||||
fontSize: "16px",
|
||||
fontSize: "16px"
|
||||
}}
|
||||
>
|
||||
Finish
|
||||
@@ -277,10 +281,8 @@ function Header({
|
||||
pdfUrl || isAlreadySign.mssg ? (
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
{pdfDetails[0] && pdfDetails.length > 0 && (
|
||||
// <Certificate
|
||||
// pdfData={completePdfData}
|
||||
// />
|
||||
<PDFDownloadLink
|
||||
style={{ textDecoration: "none" }}
|
||||
document={<Certificate pdfData={pdfDetails} />}
|
||||
fileName={`completion certificate-${
|
||||
pdfDetails[0] && pdfDetails[0].Name
|
||||
@@ -296,7 +298,7 @@ function Header({
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
<i
|
||||
@@ -304,7 +306,7 @@ function Header({
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
@@ -319,7 +321,7 @@ function Header({
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
className="defaultBtn printBtn"
|
||||
>
|
||||
@@ -328,7 +330,7 @@ function Header({
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
color: "white",
|
||||
color: "white"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
@@ -340,7 +342,7 @@ function Header({
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
className="defaultBtn downloadBtn"
|
||||
onClick={() => handleDownloadPdf()}
|
||||
@@ -350,7 +352,7 @@ function Header({
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
@@ -361,7 +363,7 @@ function Header({
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
<button
|
||||
style={{
|
||||
background: "#de4337",
|
||||
background: "#de4337"
|
||||
}}
|
||||
className="finishBtn hoverCss"
|
||||
onClick={() => {
|
||||
@@ -374,7 +376,7 @@ function Header({
|
||||
<button
|
||||
data-tut="reactourThird"
|
||||
style={{
|
||||
background: !pdfUrl ? "#188ae2" : "#d3edeb",
|
||||
background: !pdfUrl ? "#188ae2" : "#d3edeb"
|
||||
}}
|
||||
className="finishBtn sendHover"
|
||||
onClick={() => {
|
||||
@@ -387,85 +389,6 @@ function Header({
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
) : pdfUrl || (documentStatus && documentStatus.isCompleted) ? (
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
<PDFDownloadLink
|
||||
document={<Certificate pdfData={pdfDetails} />}
|
||||
fileName={`completion certificate-${
|
||||
pdfDetails[0] && pdfDetails[0].Name
|
||||
}.pdf`}
|
||||
>
|
||||
{({ blob, url, loading, error }) =>
|
||||
loading ? (
|
||||
"Loading document..."
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
}}
|
||||
className="defaultBtn certificateBtn"
|
||||
>
|
||||
<i
|
||||
className="fa fa-certificate"
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Certificate
|
||||
</button>
|
||||
)
|
||||
}
|
||||
</PDFDownloadLink>
|
||||
<button
|
||||
onClick={handleToPrint}
|
||||
type="button"
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
}}
|
||||
className="defaultBtn printBtn"
|
||||
>
|
||||
<i
|
||||
className="fa fa-print"
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
color: "white",
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Print
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="defaultBtn downloadBtn"
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
marginLeft: "10px",
|
||||
}}
|
||||
onClick={() => handleDownloadPdf()}
|
||||
>
|
||||
<i
|
||||
className="fa fa-download"
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Download
|
||||
</button>
|
||||
</div>
|
||||
) : isPlaceholder ? (
|
||||
<>
|
||||
{!isMailSend &&
|
||||
@@ -502,7 +425,7 @@ function Header({
|
||||
data-tut="reactourFour"
|
||||
style={{
|
||||
background: isMailSend ? "rgb(203, 203, 203)" : "#188ae2",
|
||||
color: isMailSend && "rgb(77, 75, 75)",
|
||||
color: isMailSend && "rgb(77, 75, 75)"
|
||||
}}
|
||||
onClick={() => {
|
||||
alertSendEmail();
|
||||
@@ -514,10 +437,11 @@ function Header({
|
||||
</div>
|
||||
</>
|
||||
) : isPdfRequestFiles ? (
|
||||
isSigned ? (
|
||||
alreadySign ? (
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
{isCompleted.isCertificate && (
|
||||
<PDFDownloadLink
|
||||
style={{ textDecoration: "none" }}
|
||||
document={<Certificate pdfData={pdfDetails} />}
|
||||
fileName={`completion certificate-${
|
||||
pdfDetails[0] && pdfDetails[0].Name
|
||||
@@ -533,7 +457,7 @@ function Header({
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
<i
|
||||
@@ -541,7 +465,7 @@ function Header({
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
@@ -558,7 +482,7 @@ function Header({
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
>
|
||||
<i
|
||||
@@ -566,7 +490,7 @@ function Header({
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
color: "white",
|
||||
color: "white"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
@@ -579,7 +503,7 @@ function Header({
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
onClick={() => handleDownloadPdf()}
|
||||
>
|
||||
@@ -588,7 +512,7 @@ function Header({
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
@@ -610,7 +534,7 @@ function Header({
|
||||
<>
|
||||
<button
|
||||
style={{
|
||||
background: "#de4337",
|
||||
background: "#de4337"
|
||||
}}
|
||||
className="finishBtn hoverCss"
|
||||
onClick={() => {
|
||||
@@ -621,7 +545,7 @@ function Header({
|
||||
</button>
|
||||
<button
|
||||
style={{
|
||||
background: "#188ae2",
|
||||
background: "#188ae2"
|
||||
}}
|
||||
type="button"
|
||||
className="finishBtn sendHover"
|
||||
@@ -635,6 +559,86 @@ function Header({
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
) : pdfUrl || (documentStatus && documentStatus.isCompleted) ? (
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
<PDFDownloadLink
|
||||
style={{ textDecoration: "none" }}
|
||||
document={<Certificate pdfData={pdfDetails} />}
|
||||
fileName={`completion certificate-${
|
||||
pdfDetails[0] && pdfDetails[0].Name
|
||||
}.pdf`}
|
||||
>
|
||||
{({ blob, url, loading, error }) =>
|
||||
loading ? (
|
||||
"Loading document..."
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center"
|
||||
}}
|
||||
className="defaultBtn certificateBtn"
|
||||
>
|
||||
<i
|
||||
className="fa fa-certificate"
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Certificate
|
||||
</button>
|
||||
)
|
||||
}
|
||||
</PDFDownloadLink>
|
||||
<button
|
||||
onClick={handleToPrint}
|
||||
type="button"
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center"
|
||||
}}
|
||||
className="defaultBtn printBtn"
|
||||
>
|
||||
<i
|
||||
className="fa fa-print"
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
marginRight: "3px",
|
||||
color: "white"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Print
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="defaultBtn downloadBtn"
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
marginLeft: "10px"
|
||||
}}
|
||||
onClick={() => handleDownloadPdf()}
|
||||
>
|
||||
<i
|
||||
className="fa fa-download"
|
||||
style={{
|
||||
color: "white",
|
||||
fontSize: "15px",
|
||||
marginRight: "3px"
|
||||
}}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Download
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<div>
|
||||
<button
|
||||
@@ -649,7 +653,7 @@ function Header({
|
||||
|
||||
<button
|
||||
style={{
|
||||
background: "#188ae2",
|
||||
background: "#188ae2"
|
||||
}}
|
||||
type="button"
|
||||
className="finishBtn sendHover"
|
||||
|
||||
@@ -5,8 +5,6 @@ import { Rnd } from "react-rnd";
|
||||
import { themeColor } from "../../utils/ThemeColor/backColor";
|
||||
import { Document, Page, pdfjs } from "react-pdf";
|
||||
|
||||
// import Draggable from "react-draggable";
|
||||
|
||||
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
|
||||
|
||||
function RenderPdf({
|
||||
@@ -41,19 +39,64 @@ function RenderPdf({
|
||||
placeholder,
|
||||
pdfLoadFail
|
||||
}) {
|
||||
const isMobile = window.innerWidth < 712;
|
||||
|
||||
const isMobile = window.innerWidth < 767;
|
||||
const newWidth = window.innerWidth;
|
||||
const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
|
||||
//function for render placeholder block over pdf document
|
||||
|
||||
const checkSignedSignes = (data) => {
|
||||
// console.log("data",data)
|
||||
const checkSign = signedSigners.filter(
|
||||
(sign) => sign.objectId === data.signerObjId
|
||||
);
|
||||
if (data.signerObjId === signerObjectId) {
|
||||
setCurrentSigner(true);
|
||||
}
|
||||
const xPos = (pos) => {
|
||||
//checking both condition mobile and desktop view
|
||||
if (isMobile) {
|
||||
//if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
|
||||
if (!pos.isMobile) {
|
||||
return pos.xPosition / scale;
|
||||
}
|
||||
//pos.isMobile true -- placeholder save from mobile view(small device) handle position in mobile view(small screen) view divided by scale
|
||||
else {
|
||||
return pos.xPosition * (pos.scale / scale);
|
||||
}
|
||||
} else {
|
||||
//else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
|
||||
|
||||
if (pos.isMobile) {
|
||||
return pos.scale && pos.xPosition * pos.scale + 50;
|
||||
}
|
||||
//else placeholder save from desktop(bigscreen) and show in desktop(bigscreen)
|
||||
else {
|
||||
return pos.xPosition;
|
||||
}
|
||||
}
|
||||
};
|
||||
const yPos = (pos) => {
|
||||
//checking both condition mobile and desktop view
|
||||
if (isMobile) {
|
||||
//if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
|
||||
if (!pos.isMobile) {
|
||||
return pos.yPosition / scale;
|
||||
}
|
||||
//pos.isMobile true -- placeholder save from mobile view(small device) handle position in mobile view(small screen) view divided by scale
|
||||
else {
|
||||
return pos.yPosition * (pos.scale / scale);
|
||||
}
|
||||
} else {
|
||||
//else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
|
||||
|
||||
if (pos.isMobile) {
|
||||
return pos.scale && pos.yPosition * pos.scale + 50;
|
||||
}
|
||||
//else placeholder save from desktop(bigscreen) and show in desktop(bigscreen)
|
||||
else {
|
||||
return pos.yPosition;
|
||||
}
|
||||
}
|
||||
};
|
||||
return (
|
||||
checkSign.length === 0 &&
|
||||
data.placeHolder.map((placeData, key) => {
|
||||
@@ -96,10 +139,8 @@ function RenderPdf({
|
||||
}}
|
||||
lockAspectRatio={pos.Width && 2.5}
|
||||
default={{
|
||||
x: pos.scale
|
||||
? pos.xPosition * pos.scale
|
||||
: pos.xPosition,
|
||||
y: pos.scale ? pos.yPosition * pos.scale : pos.yPosition
|
||||
x: xPos(pos),
|
||||
y: yPos(pos)
|
||||
}}
|
||||
onClick={() => {
|
||||
setIsSignPad(true);
|
||||
@@ -160,8 +201,8 @@ function RenderPdf({
|
||||
borderWidth: "0.2px"
|
||||
}}
|
||||
default={{
|
||||
x: pos.scale ? pos.xPosition * pos.scale : pos.xPosition,
|
||||
y: pos.scale ? pos.yPosition * pos.scale : pos.yPosition
|
||||
x: xPos(pos),
|
||||
y: yPos(pos)
|
||||
}}
|
||||
size={{
|
||||
width: pos.Width ? pos.Width : 150,
|
||||
@@ -174,7 +215,7 @@ function RenderPdf({
|
||||
fontSize: "12px",
|
||||
color: "black",
|
||||
fontWeight: "600",
|
||||
// justifyContent: "center",
|
||||
|
||||
marginTop: "0px"
|
||||
}}
|
||||
>
|
||||
@@ -191,26 +232,10 @@ function RenderPdf({
|
||||
|
||||
return (
|
||||
<>
|
||||
{isMobile ? (
|
||||
// <RSC
|
||||
// style={{
|
||||
// position: "relative",
|
||||
// boxShadow: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
|
||||
// width:
|
||||
// pdfOriginalWidth > pdfNewWidth ? pdfNewWidth : pdfOriginalWidth,
|
||||
// height: window.innerHeight - 110 + "px",
|
||||
// marginTop: "50px",
|
||||
// }}
|
||||
// noScrollY={false}
|
||||
// noScrollX={pdfNewWidth < pdfOriginalWidth ? false : true}
|
||||
// >
|
||||
{isMobile && scale ? (
|
||||
<div
|
||||
style={{
|
||||
border: "0.1px solid #ebe8e8"
|
||||
// marginTop: "50px",
|
||||
|
||||
// height:window.innerHeight-100+'px',
|
||||
// width:window.innerWidth
|
||||
}}
|
||||
ref={drop}
|
||||
id="container"
|
||||
@@ -273,9 +298,17 @@ function RenderPdf({
|
||||
height: pos.Height ? pos.Height : 60
|
||||
}}
|
||||
lockAspectRatio={pos.Width && 2.5}
|
||||
//if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divide by scale
|
||||
|
||||
//else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
|
||||
default={{
|
||||
x: pos.xPosition,
|
||||
y: pos.yPosition
|
||||
x: !pos.isMobile
|
||||
? pos.xPosition / scale
|
||||
: pos.xPosition * (pos.scale / scale) - 50,
|
||||
|
||||
y: !pos.isMobile
|
||||
? pos.yPosition / scale
|
||||
: pos.yPosition * (pos.scale / scale)
|
||||
}}
|
||||
onClick={() => {
|
||||
setIsSignPad(true);
|
||||
@@ -333,8 +366,16 @@ function RenderPdf({
|
||||
}}
|
||||
disableDragging={true}
|
||||
default={{
|
||||
x: pos.xPosition,
|
||||
y: pos.yPosition
|
||||
//if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divide by scale
|
||||
//else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
|
||||
|
||||
x: !pos.isMobile
|
||||
? pos.xPosition / scale
|
||||
: pos.xPosition * (pos.scale / scale) - 50,
|
||||
|
||||
y: !pos.isMobile
|
||||
? pos.yPosition / scale
|
||||
: pos.yPosition * (pos.scale / scale)
|
||||
}}
|
||||
onClick={() => {
|
||||
setIsSignPad(true);
|
||||
@@ -409,7 +450,14 @@ function RenderPdf({
|
||||
right: { display: "none" },
|
||||
bottomRight: { display: "block" }
|
||||
}}
|
||||
onDragStop={handleStop}
|
||||
onDragStop={(event, dragElement) =>
|
||||
handleStop(
|
||||
event,
|
||||
dragElement,
|
||||
data.signerObjId,
|
||||
pos.key
|
||||
)
|
||||
}
|
||||
default={{
|
||||
x: pos.xPosition,
|
||||
y: pos.yPosition
|
||||
@@ -437,13 +485,6 @@ function RenderPdf({
|
||||
data.signerObjId
|
||||
);
|
||||
}}
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleDeleteSign(
|
||||
// pos.key,
|
||||
// data.signerObjId
|
||||
// );
|
||||
// }}
|
||||
style={{
|
||||
position: "absolute",
|
||||
right: 0,
|
||||
@@ -461,7 +502,7 @@ function RenderPdf({
|
||||
fontSize: "12px",
|
||||
color: "black",
|
||||
fontWeight: "600",
|
||||
// justifyContent: "center",
|
||||
|
||||
marginTop: "0px"
|
||||
}}
|
||||
>
|
||||
@@ -532,7 +573,6 @@ function RenderPdf({
|
||||
>
|
||||
{" "}
|
||||
<div
|
||||
// className="dragElm"
|
||||
onTouchStart={(e) => {
|
||||
if (!isDragging) {
|
||||
setTimeout(() => {
|
||||
@@ -545,18 +585,12 @@ function RenderPdf({
|
||||
}}
|
||||
>
|
||||
<div
|
||||
// className="dragElm"
|
||||
ref={nodeRef}
|
||||
onTouchStart={(e) => {
|
||||
e.stopPropagation();
|
||||
handleDeleteSign(pos.key);
|
||||
setIsStamp(false);
|
||||
}}
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleDeleteSign(pos.key);
|
||||
// setIsStamp(false);
|
||||
// }}
|
||||
style={{
|
||||
position: "absolute",
|
||||
right: 0,
|
||||
@@ -590,10 +624,8 @@ function RenderPdf({
|
||||
<>
|
||||
<Rnd
|
||||
allowAnyClick
|
||||
// cancel=".dragElm"
|
||||
ref={nodeRef}
|
||||
key={pos.key}
|
||||
// lockAspectRatio={2.5}
|
||||
lockAspectRatio={
|
||||
pos.Width ? pos.Width / pos.Height : 2.5
|
||||
}
|
||||
@@ -616,53 +648,22 @@ function RenderPdf({
|
||||
onDrag={(e) => {
|
||||
handleTabDrag(pos.key, e);
|
||||
}}
|
||||
// onMouseUp={(e) => handleTabDrag(pos.key, e)}
|
||||
onDragStop={handleStop}
|
||||
size={{
|
||||
width: pos.Width ? pos.Width : 150,
|
||||
height: pos.Height ? pos.Height : 60
|
||||
}}
|
||||
// onMouseDown={(e) => {
|
||||
|
||||
// if (!isDragging) {
|
||||
// console.log("child m=event",isDragging);
|
||||
// setTimeout(() => {
|
||||
// if(isDeleted){
|
||||
// setIsSignPad(true);
|
||||
// // setIsSignPad(false)
|
||||
// setSignKey(pos.key);
|
||||
// setIsStamp(pos.isStamp);
|
||||
|
||||
// }else{
|
||||
// setIsSignPad(true);
|
||||
// // setIsSignPad(false)
|
||||
// setSignKey(pos.key);
|
||||
// setIsStamp(pos.isStamp);
|
||||
// }
|
||||
|
||||
// }, 500);
|
||||
// }
|
||||
// }}
|
||||
default={{
|
||||
x: pos.xPosition,
|
||||
y: pos.yPosition
|
||||
}}
|
||||
|
||||
// onClick={(e) => {
|
||||
// if (!isDragging) {
|
||||
// e.stopPropagation();
|
||||
// setIsSignPad(true);
|
||||
// setSignKey(pos.key);
|
||||
// setIsStamp(pos.isStamp);
|
||||
// }
|
||||
// }}
|
||||
>
|
||||
<div
|
||||
onTouchStart={(e) => {
|
||||
if (!isDragging) {
|
||||
setTimeout(() => {
|
||||
setIsSignPad(true);
|
||||
//setIsSignPad(false)
|
||||
|
||||
setSignKey(pos.key);
|
||||
setIsStamp(pos.isStamp);
|
||||
}, 500);
|
||||
@@ -686,21 +687,9 @@ function RenderPdf({
|
||||
}}
|
||||
>
|
||||
<div
|
||||
// onMouseDown={(e) => {
|
||||
// console.log("child m=event")
|
||||
// e.preventDefault();
|
||||
// setIsDragging(true)
|
||||
|
||||
// handleDeleteSign(pos.key);
|
||||
// setIsStamp(false);
|
||||
// setTimeout(()=>{
|
||||
// setIsDragging(false)
|
||||
// },2000)
|
||||
// }}
|
||||
onTouchStart={(e) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
// setIsDragging(true);
|
||||
|
||||
handleDeleteSign(pos.key);
|
||||
setIsStamp(false);
|
||||
@@ -756,7 +745,6 @@ function RenderPdf({
|
||||
onLoadSuccess={pageDetails}
|
||||
ref={pdfRef}
|
||||
file={pdfUrl ? pdfUrl : pdfDetails[0] && pdfDetails[0].URL}
|
||||
// file="https://qikinnovation.ams3.digitaloceanspaces.com/exported_file_2068_2023-08-30T05%3A04%3A26.334Z.pdf" // "https://api.printnode.com/static/test/pdf/multipage.pdf" // {pdfUrl ? pdfUrl : signPdfUrl}
|
||||
>
|
||||
{Array.from(new Array(numPages), (el, index) => (
|
||||
<Page
|
||||
@@ -764,7 +752,6 @@ function RenderPdf({
|
||||
pageNumber={pageNumber}
|
||||
width={window.innerWidth}
|
||||
height={window.innerHeight}
|
||||
// scale={1}
|
||||
renderAnnotationLayer={false}
|
||||
renderTextLayer={false}
|
||||
onGetAnnotationsError={(error) => {
|
||||
@@ -776,7 +763,6 @@ function RenderPdf({
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
// </RSC>
|
||||
<RSC
|
||||
style={{
|
||||
position: "relative",
|
||||
@@ -854,12 +840,15 @@ function RenderPdf({
|
||||
height: pos.Height ? pos.Height : 60
|
||||
}}
|
||||
lockAspectRatio={pos.Width && 2.5}
|
||||
//if pos.isMobile false -- placeholder saved from mobile view then handle position in desktop view to multiply by scale
|
||||
|
||||
default={{
|
||||
x: pos.scale
|
||||
? pos.xPosition * pos.scale
|
||||
x: pos.isMobile
|
||||
? pos.scale &&
|
||||
pos.xPosition * pos.scale + 20
|
||||
: pos.xPosition,
|
||||
y: pos.scale
|
||||
? pos.yPosition * pos.scale
|
||||
y: pos.isMobile
|
||||
? pos.scale && pos.yPosition * pos.scale
|
||||
: pos.yPosition
|
||||
}}
|
||||
onClick={() => {
|
||||
@@ -917,12 +906,15 @@ function RenderPdf({
|
||||
height: pos.Height ? pos.Height : 60
|
||||
}}
|
||||
disableDragging={true}
|
||||
//if pos.isMobile false -- placeholder saved from mobile view then handle position in desktop view to multiply by scale
|
||||
|
||||
default={{
|
||||
x: pos.scale
|
||||
? pos.xPosition * pos.scale
|
||||
x: pos.isMobile
|
||||
? pos.scale &&
|
||||
pos.xPosition * pos.scale + 20
|
||||
: pos.xPosition,
|
||||
y: pos.scale
|
||||
? pos.yPosition * pos.scale
|
||||
y: pos.isMobile
|
||||
? pos.scale && pos.yPosition * pos.scale
|
||||
: pos.yPosition
|
||||
}}
|
||||
onClick={() => {
|
||||
@@ -998,7 +990,14 @@ function RenderPdf({
|
||||
right: { display: "none" },
|
||||
bottomRight: { display: "block" }
|
||||
}}
|
||||
onDragStop={handleStop}
|
||||
onDragStop={(event, dragElement) =>
|
||||
handleStop(
|
||||
event,
|
||||
dragElement,
|
||||
data.signerObjId,
|
||||
pos.key
|
||||
)
|
||||
}
|
||||
default={{
|
||||
x: pos.xPosition,
|
||||
y: pos.yPosition
|
||||
@@ -1043,7 +1042,7 @@ function RenderPdf({
|
||||
fontSize: "12px",
|
||||
color: "black",
|
||||
fontWeight: "600",
|
||||
// justifyContent: "center",
|
||||
|
||||
marginTop: "0px"
|
||||
}}
|
||||
>
|
||||
@@ -1067,7 +1066,6 @@ function RenderPdf({
|
||||
<Rnd
|
||||
ref={nodeRef}
|
||||
key={pos.key}
|
||||
// lockAspectRatio={2.5}
|
||||
lockAspectRatio={
|
||||
pos.Width ? pos.Width / pos.Height : 2.5
|
||||
}
|
||||
@@ -1158,7 +1156,6 @@ function RenderPdf({
|
||||
<Rnd
|
||||
ref={nodeRef}
|
||||
key={pos.key}
|
||||
// lockAspectRatio={2.5}
|
||||
lockAspectRatio={
|
||||
pos.Width ? pos.Width / pos.Height : 2.5
|
||||
}
|
||||
@@ -1264,13 +1261,11 @@ function RenderPdf({
|
||||
onLoadSuccess={pageDetails}
|
||||
ref={pdfRef}
|
||||
file={pdfUrl ? pdfUrl : pdfDetails[0] && pdfDetails[0].URL}
|
||||
// file="https://qikinnovation.ams3.digitaloceanspaces.com/exported_file_2068_2023-08-30T05%3A04%3A26.334Z.pdf" // "https://api.printnode.com/static/test/pdf/multipage.pdf" // {pdfUrl ? pdfUrl : signPdfUrl}
|
||||
>
|
||||
{Array.from(new Array(numPages), (el, index) => (
|
||||
<Page
|
||||
key={index}
|
||||
pageNumber={pageNumber}
|
||||
// width={pdfNewWidth}
|
||||
renderAnnotationLayer={false}
|
||||
renderTextLayer={false}
|
||||
onGetAnnotationsError={(error) => {
|
||||
|
||||
Reference in New Issue
Block a user