fix: signature is not visiable in completion certificate

This commit is contained in:
RaktimaNXG
2024-05-03 15:50:52 +05:30
parent 68edecae18
commit 53bd13e03b
4 changed files with 187 additions and 74 deletions
+122 -46
View File
@@ -541,55 +541,88 @@ export const signPdfFun = async (
setIsAlert,
objectId,
isSubscribed,
activeMailAdapter
activeMailAdapter,
xyPosition
) => {
let singleSign,
isCustomCompletionMail = false;
//get tenant details
const tenantDetails = await getTenantDetails(objectId);
if (tenantDetails && tenantDetails === "user does not exist!") {
alert("User does not exist");
} else {
if (
tenantDetails?.CompletionBody &&
tenantDetails?.CompletionSubject &&
(!isEnableSubscription || isSubscribed)
) {
isCustomCompletionMail = true;
}
}
singleSign = {
mailProvider: activeMailAdapter,
pdfFile: base64Url,
docId: documentId,
userId: signerObjectId,
isCustomCompletionMail: isCustomCompletionMail
};
const response = await axios
.post(`${localStorage.getItem("baseUrl")}functions/signPdf`, singleSign, {
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
// sessionToken: localStorage.getItem("accesstoken")
"X-Parse-Session-Token": localStorage.getItem("accesstoken")
try {
//get tenant details
const tenantDetails = await getTenantDetails(objectId);
if (tenantDetails && tenantDetails === "user does not exist!") {
alert("User does not exist");
} else {
if (
tenantDetails?.CompletionBody &&
tenantDetails?.CompletionSubject &&
(!isEnableSubscription || isSubscribed)
) {
isCustomCompletionMail = true;
}
})
.then((Listdata) => {
const json = Listdata.data;
const res = json.result;
return res;
})
.catch((err) => {
console.log("Err ", err);
setIsAlert({
isShow: true,
alertMessage: "something went wrong"
});
});
}
return response;
let getSignature;
for (let item of xyPosition) {
const typeExist = item.pos.some((data) => data?.type);
if (typeExist) {
getSignature = item.pos.filter((data) => data?.type === "signature");
} else {
getSignature = item.pos.filter((data) => !data.isStamp);
}
}
let base64Sign = getSignature[0].SignUrl;
//check https type signature (default signature exist) then convert in base64
const isUrl = base64Sign.includes("https");
if (isUrl) {
try {
base64Sign = await fetchImageBase64(base64Sign);
} catch (e) {
console.log("error", e);
}
}
//change image width and height to 104/44 in png base64
const getNewse64 = await changeImageWH(base64Sign);
//remove suffiix of base64
const suffixbase64 = getNewse64 && getNewse64.split(",").pop();
singleSign = {
mailProvider: activeMailAdapter,
pdfFile: base64Url,
docId: documentId,
userId: signerObjectId,
isCustomCompletionMail: isCustomCompletionMail,
signature: suffixbase64
};
const response = await axios
.post(`${localStorage.getItem("baseUrl")}functions/signPdf`, singleSign, {
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) => {
const json = Listdata.data;
const res = json.result;
return res;
})
.catch((err) => {
console.log("Err ", err);
setIsAlert({
isShow: true,
alertMessage: "something went wrong"
});
});
return response;
} catch (e) {
setIsAlert({
isShow: true,
alertMessage: "something went wrong"
});
}
};
export const randomId = () => {
@@ -1126,7 +1159,6 @@ export const onImageSelect = (event, setImgWH, setImage) => {
const imageType = event.target.files[0].type;
const reader = new FileReader();
reader.readAsDataURL(event.target.files[0]);
reader.onloadend = function (e) {
let width, height;
const image = new Image();
@@ -1154,6 +1186,50 @@ export const onImageSelect = (event, setImgWH, setImage) => {
};
};
//convert https url to base64
export const fetchImageBase64 = async (imageUrl) => {
try {
const response = await fetch(imageUrl);
const blob = await response.blob();
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(blob);
reader.onloadend = () => {
const base64data = reader.result;
resolve(base64data);
};
reader.onerror = (error) => {
reject(error);
};
});
} catch (error) {
throw new Error("Error converting URL to base64:", error);
}
};
//function for select image and upload image
export const changeImageWH = async (base64Image) => {
const newWidth = 100;
const newHeight = 40;
return new Promise((resolve, reject) => {
const img = new Image();
img.src = base64Image;
img.onload = async () => {
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
canvas.width = newWidth;
canvas.height = newHeight;
ctx.imageSmoothingEnabled = false;
ctx.drawImage(img, 0, 0, newWidth, newHeight);
const resizedBase64 = canvas.toDataURL("image/png", 1);
resolve(resizedBase64);
};
img.onerror = (error) => {
reject(error);
};
});
};
//function for embed multiple signature using pdf-lib
export const multiSignEmbed = async (
pngUrl,
@@ -1268,8 +1344,8 @@ export const multiSignEmbed = async (
position.type === radioButtonWidget
? 10
: position.type === "checkbox"
? 10
: newUpdateHeight;
? 10
: newUpdateHeight;
const newHeight = ind ? (ind > 0 ? widgetHeight : 0) : widgetHeight;
if (signyourself) {
+19 -11
View File
@@ -472,7 +472,8 @@ function PdfRequestFiles() {
const maxCount =
requiredCheckbox[i].options?.validation?.maxRequiredCount;
const parseMax = maxCount && parseInt(maxCount);
const response = requiredCheckbox[i].options?.response?.length;
const response =
requiredCheckbox[i].options?.response?.length;
const defaultValue =
requiredCheckbox[i].options?.defaultValue?.length;
if (parseMin === 0 && parseMax === 0) {
@@ -616,7 +617,8 @@ function PdfRequestFiles() {
setIsAlert,
objectId,
isSubscribed,
activeMailAdapter
activeMailAdapter,
pngUrl
);
if (res && res.status === "success") {
setPdfUrl(res.data);
@@ -642,11 +644,14 @@ function PdfRequestFiles() {
if (user) {
const expireDate = pdfDetails?.[0].ExpiryDate.iso;
const newDate = new Date(expireDate);
const localExpireDate = newDate.toLocaleDateString("en-US", {
day: "numeric",
month: "long",
year: "numeric"
});
const localExpireDate = newDate.toLocaleDateString(
"en-US",
{
day: "numeric",
month: "long",
year: "numeric"
}
);
let senderEmail = pdfDetails?.[0].ExtUserPtr.Email;
let senderPhone = pdfDetails?.[0]?.ExtUserPtr?.Phone;
const senderName = `${pdfDetails?.[0].ExtUserPtr.Name}`;
@@ -683,7 +688,10 @@ function PdfRequestFiles() {
requestSubject &&
(!isEnableSubscription || isSubscribed)
) {
const replacedRequestBody = requestBody.replace(/"/g, "'");
const replacedRequestBody = requestBody.replace(
/"/g,
"'"
);
const htmlReqBody =
"<html><head><meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /></head><body>" +
replacedRequestBody +
@@ -1157,9 +1165,9 @@ function PdfRequestFiles() {
isDecline.currnt === "Sure"
? "Are you sure want to decline this document ?"
: isDecline.currnt === "YouDeclined"
? "You have declined this document!"
: isDecline.currnt === "another" &&
"You can not sign this document as it has been declined/revoked."
? "You have declined this document!"
: isDecline.currnt === "another" &&
"You can not sign this document as it has been declined/revoked."
}
footerMessage={isDecline.currnt === "Sure"}
declineDoc={declineDoc}
+42 -13
View File
@@ -29,7 +29,9 @@ import {
textWidget,
getTenantDetails,
checkIsSubscribed,
convertPdfArrayBuffer
convertPdfArrayBuffer,
fetchImageBase64,
changeImageWH
} from "../constant/Utils";
import { useParams } from "react-router-dom";
import Tour from "reactour";
@@ -194,13 +196,18 @@ function SignYourSelf() {
setPdfDetails(documentData);
setExtUserId(documentData[0]?.ExtUserPtr?.objectId);
const url = documentData[0] && documentData[0]?.URL;
//convert document url in array buffer format to use embed widgets in pdf using pdf-lib
const arrayBuffer = await convertPdfArrayBuffer(url);
if (arrayBuffer === "Error") {
setHandleError("Error: Something went wrong!");
if (url) {
//convert document url in array buffer format to use embed widgets in pdf using pdf-lib
const arrayBuffer = await convertPdfArrayBuffer(url);
if (arrayBuffer === "Error") {
setHandleError("Error: Something went wrong!");
} else {
setPdfArrayBuffer(arrayBuffer);
}
} else {
setPdfArrayBuffer(arrayBuffer);
setHandleError("Error: Something went wrong!");
}
isCompleted = documentData[0].IsCompleted && documentData[0].IsCompleted;
if (isCompleted) {
setIsCompleted(true);
@@ -443,13 +450,13 @@ function SignYourSelf() {
Width: widgetTypeExist
? calculateInitialWidthHeight(dragTypeValue, widgetValue).getWidth
: dragTypeValue === "initials"
? defaultWidthHeight(dragTypeValue).width
: "",
? defaultWidthHeight(dragTypeValue).width
: "",
Height: widgetTypeExist
? calculateInitialWidthHeight(dragTypeValue, widgetValue).getHeight
: dragTypeValue === "initials"
? defaultWidthHeight(dragTypeValue).height
: "",
? defaultWidthHeight(dragTypeValue).height
: "",
options: addWidgetOptions(dragTypeValue)
};
@@ -526,7 +533,6 @@ function SignYourSelf() {
setSelectWidgetId(key);
setSignKey(key);
};
//function for send placeholder's co-ordinate(x,y) position embed signature url or stamp url
async function embedWidgetsData() {
let showAlert = false;
@@ -613,7 +619,6 @@ function SignYourSelf() {
});
}
}
// console.log("signyourself", xyPostion);
//function for get digital signature
const signPdfFun = async (base64Url, documentId) => {
let isCustomCompletionMail = false;
@@ -630,12 +635,36 @@ function SignYourSelf() {
isCustomCompletionMail = true;
}
}
let getSignature;
for (let item of xyPostion) {
const typeExist = item.pos.some((data) => data?.type);
if (typeExist) {
getSignature = item.pos.filter((data) => data?.type === "signature");
} else {
getSignature = item.pos.filter((data) => !data.isStamp);
}
}
let base64Sign = getSignature[0].SignUrl;
//check https type signature (default signature exist) then convert in base64
const isUrl = base64Sign.includes("https");
if (isUrl) {
try {
base64Sign = await fetchImageBase64(base64Sign);
} catch (e) {
console.log("error", e);
}
}
//change image width and height to 104/44 in png base64
const getNewse64 = await changeImageWH(base64Sign);
//remove suffiix of base64
const suffixbase64 = getNewse64 && getNewse64.split(",").pop();
let singleSign = {
pdfFile: base64Url,
docId: documentId,
isCustomCompletionMail: isCustomCompletionMail,
mailProvider: activeMailAdapter
mailProvider: activeMailAdapter,
signature: suffixbase64
};
await axios
@@ -250,7 +250,7 @@ export default async function GenerateCertificate(docDetails) {
let yPosition5 = 395;
let yPosition6 = 360;
auditTrail.slice(0, 3).forEach(async (x, i) => {
const embedPng = x.signature ? await pdfDoc.embedPng(x.signature) : '';
const embedPng = x.Signature ? await pdfDoc.embedPng(x.Signature) : '';
page.drawText(`Signer ${i + 1}`, {
x: 30,
y: yPosition1,
@@ -282,7 +282,7 @@ export default async function GenerateCertificate(docDetails) {
color: textKeyColor,
});
page.drawText(`${new Date(x.SignedOn).toUTCString()}`, {
page.drawText(`${new Date(x.ViewedOn).toUTCString()}`, {
x: half + 75,
y: yPosition2,
size: text,
@@ -396,7 +396,7 @@ export default async function GenerateCertificate(docDetails) {
let currentPageIndex = 1;
let currentPage = page;
auditTrail.slice(3).forEach(async (x, i) => {
const embedPng = x.signature ? await pdfDoc.embedPng(x.signature) : '';
const embedPng = x.Signature ? await pdfDoc.embedPng(x.Signature) : '';
// Calculate remaining space on current page
const remainingSpace = yPosition6;
@@ -453,7 +453,7 @@ export default async function GenerateCertificate(docDetails) {
color: textKeyColor,
});
currentPage.drawText(`${new Date(x.SignedOn).toUTCString()}`, {
currentPage.drawText(`${new Date(x.ViewedOn).toUTCString()}`, {
x: half + 75,
y: yPosition2,
size: text,