diff --git a/apps/OpenSign/public/locales/en/translation.json b/apps/OpenSign/public/locales/en/translation.json index 40d56f9f4..d69716733 100644 --- a/apps/OpenSign/public/locales/en/translation.json +++ b/apps/OpenSign/public/locales/en/translation.json @@ -709,5 +709,9 @@ }, "expiry-date": "Expiry Date", "expiry-date-updated": "The expiry date has been successfully extended to {{newexpirydate}}", - "expiry-date-error": "Please provide a new expiry date that is later than the current one" + "expiry-date-error": "Please provide a new expiry date that is later than the current one", + "delete-page":"Delete page", + "delete-alert":"Can not delete single page", + "delete-alert-2":"Are you sure want to delete this page ?", + "delete-note":"Note - once delete this page you can not undo" } diff --git a/apps/OpenSign/public/locales/es/translation.json b/apps/OpenSign/public/locales/es/translation.json index bb0ed8987..392a13d9e 100644 --- a/apps/OpenSign/public/locales/es/translation.json +++ b/apps/OpenSign/public/locales/es/translation.json @@ -709,5 +709,9 @@ }, "expiry-date": "Date d'expiration", "expiry-date-updated": "La fecha de vencimiento se ha extendido con éxito hasta el {{newexpirydate}}", - "expiry-date-error": "Proporcione una nueva fecha de vencimiento que sea posterior a la actual" + "expiry-date-error": "Proporcione una nueva fecha de vencimiento que sea posterior a la actual", + "delete-page": "eliminar página", + "delete-alert": "No se puede eliminar una sola página", + "delete-alert-2": "¿Está seguro de que desea eliminar esta página?", + "delete-note": "Nota: una vez que elimines esta página, no podrás deshacerla" } diff --git a/apps/OpenSign/public/locales/fr/translation.json b/apps/OpenSign/public/locales/fr/translation.json index eb515ef3e..0b947df60 100644 --- a/apps/OpenSign/public/locales/fr/translation.json +++ b/apps/OpenSign/public/locales/fr/translation.json @@ -708,5 +708,9 @@ }, "expiry-date": "Fecha de caducidad", "expiry-date-updated": "La fecha de vencimiento se ha extendido con éxito hasta el {{newexpirydate}}", - "expiry-date-error": "Veuillez fournir une nouvelle date d'expiration postérieure à la date actuelle" + "expiry-date-error": "Veuillez fournir une nouvelle date d'expiration postérieure à la date actuelle", + "delete-page": "supprimer la page", + "delete-alert": "Impossible de supprimer une seule page", + "delete-alert-2": "Etes-vous sûr de vouloir supprimer cette page ?", + "delete-note": "Remarque : une fois cette page supprimée, vous ne pouvez plus l'annuler" } diff --git a/apps/OpenSign/src/components/RotateAlert.js b/apps/OpenSign/src/components/RotateAlert.js index a7448b6f1..05806ce7c 100644 --- a/apps/OpenSign/src/components/RotateAlert.js +++ b/apps/OpenSign/src/components/RotateAlert.js @@ -6,9 +6,9 @@ function RotateAlert(props) { const { t } = useTranslation(); return ( props.setIsRotate({ status: false, degree: 0 })} + handleClose={() => props.setShowRotateAlert({ status: false, degree: 0 })} > {" "}
@@ -16,7 +16,9 @@ function RotateAlert(props) {
+ setIsDeletePage(false)} + > +
+

{t("delete-alert-2")}

+

{t("delete-note")}

+ {/*

{t("deletepage-alert")}

*/} +
+ + +
+
); } diff --git a/apps/OpenSign/src/components/pdf/PdfZoom.js b/apps/OpenSign/src/components/pdf/PdfZoom.js index c315a16da..23699b0d7 100644 --- a/apps/OpenSign/src/components/pdf/PdfZoom.js +++ b/apps/OpenSign/src/components/pdf/PdfZoom.js @@ -1,47 +1,115 @@ -import React from "react"; +import React, { useState } from "react"; import { useTranslation } from "react-i18next"; +import { deletePdfPage, handleRemoveWidgets } from "../../constant/Utils"; +import ModalUi from "../../primitives/ModalUi"; function PdfZoom(props) { const { t } = useTranslation(); + const [isDeletePage, setIsDeletePage] = useState(false); + const handleDetelePage = async () => { + props.setIsUploadPdf(true); + try { + const pdfupdatedData = await deletePdfPage( + props.pdfArrayBuffer, + props.pageNumber + ); + if (pdfupdatedData?.totalPages === 1) { + alert(t("delete-alert")); + } else { + props.setPdfBase64Url(pdfupdatedData.base64); + props.setPdfArrayBuffer(pdfupdatedData.arrayBuffer); + setIsDeletePage(false); + handleRemoveWidgets( + props.setSignerPos, + props.signerPos, + props.pageNumber, + props.userId + ); + } + } catch (e) { + console.log("error in delete pdf page", e); + } + }; return ( - - props.clickOnZoomIn()} - title={t("zoom-in")} - > - - - {!props?.isDisableRotate && ( - <> + <> + + props.clickOnZoomIn()} + title={t("zoom-in")} + > + + + {!props.isDisableDelete && ( props.handleRotationFun(90)} - title={t("rotate-right")} + onClick={() => setIsDeletePage(true)} + title={t("delete-page")} > - + - props.handleRotationFun(-90)} - > - - - - )} - props.clickOnZoomOut()} - style={{ - cursor: props.zoomPercent > 0 ? "pointer" : "default" - }} - title={t("zoom-out")} - > - + )} + + {!props?.isDisableRotate && ( + <> + props.handleRotationFun(90)} + title={t("rotate-right")} + > + + + props.handleRotationFun(-90)} + > + + + + )} + props.clickOnZoomOut()} + style={{ + cursor: props.zoomPercent > 0 ? "pointer" : "default" + }} + title={t("zoom-out")} + > + + - + + setIsDeletePage(false)} + > +
+

Are you sure want to delete this page ?

+

+ Note - once delete this page you can not undo +

+ {/*

{t("deletepage-alert")}

*/} +
+ + +
+ + ); } diff --git a/apps/OpenSign/src/components/pdf/RenderAllPdfPage.js b/apps/OpenSign/src/components/pdf/RenderAllPdfPage.js index 381f19be4..b64081f68 100644 --- a/apps/OpenSign/src/components/pdf/RenderAllPdfPage.js +++ b/apps/OpenSign/src/components/pdf/RenderAllPdfPage.js @@ -13,7 +13,7 @@ function RenderAllPdfPage({ signerPos, signerObjectId, containerWH, - pdfRotateBase64 + pdfBase64Url }) { const { t } = useTranslation(); const [signPageNumber, setSignPageNumber] = useState([]); @@ -67,7 +67,7 @@ function RenderAllPdfPage({ ) ); }; - const pdfDataBase64 = `data:application/pdf;base64,${pdfRotateBase64}`; + const pdfDataBase64 = `data:application/pdf;base64,${pdfBase64Url}`; return (
@@ -80,7 +80,7 @@ function RenderAllPdfPage({ {Array.from(new Array(allPages), (el, index) => (
{successEmail && ( @@ -377,10 +376,11 @@ function RenderPdf({ return ( {data.pageNumber === pageNumber && - data.pos.map((pos) => { + data.pos.map((pos, id) => { return ( pos && ( { }; //function to rotate pdf page -export async function rotatePdfPage( - url, - rotateDegree, - pageNumber, - pdfRotateBase64 -) { - let file; - - //condition to handle pdf base64 in arrayBuffer format - if (pdfRotateBase64) { - file = base64ToArrayBuffer(pdfRotateBase64); - } else { - //condition to handle pdf url in arrayBuffer format - file = await convertPdfArrayBuffer(url); - } +export async function rotatePdfPage(rotateDegree, pageNumber, pdfArrayBuffer) { // Load the existing PDF - const pdfDoc = await PDFDocument.load(file); + const pdfDoc = await PDFDocument.load(pdfArrayBuffer); // Get the page according to page number const page = pdfDoc.getPage(pageNumber); //get current page rotation angle @@ -2507,21 +2493,35 @@ export const handleRemoveWidgets = ( setSignerPos, signerPos, pageNumber, + userId, setIsRotate ) => { - const updatedSignerPos = signerPos.map((placeholderObj) => { - return { - ...placeholderObj, - placeHolder: placeholderObj?.placeHolder?.filter( - (data) => data?.pageNumber !== pageNumber - ) - }; - }); - setSignerPos(updatedSignerPos); - setIsRotate({ - status: false, - degree: 0 - }); + const isSigners = signerPos.some((data) => data.signerPtr); + if (isSigners) { + const updatedSignerPos = signerPos.map((placeholderObj) => { + if (placeholderObj.Id === userId) { + return { + ...placeholderObj, + placeHolder: placeholderObj?.placeHolder?.filter( + (data) => data?.pageNumber !== pageNumber + ) + }; + } else { + return placeholderObj; + } + }); + setSignerPos(updatedSignerPos); + setIsRotate && + setIsRotate({ + status: false, + degree: 0 + }); + } else { + const updatedSignerPos = signerPos.filter( + (data) => data?.pageNumber !== pageNumber + ); + setSignerPos(updatedSignerPos); + } }; //function to show warning when user rotate page and there are some already widgets on that page export const handleRotateWarning = (signerPos, pageNumber) => { @@ -2610,3 +2610,23 @@ export const formatDate = (date) => { const format = formattedDate.replaceAll(/ /g, "-"); return format; }; + +export const deletePdfPage = async (pdfArrayBuffer, pageNumber) => { + // Load the existing PDF + const pdfDoc = await PDFDocument.load(pdfArrayBuffer); + // Get the total number of pages + const totalPages = pdfDoc.getPageCount(); + // Ensure the page index is valid + if (totalPages > 1) { + //Remove the specified page + pdfDoc.removePage(pageNumber - 1); + // Save the modified PDF + const modifiedPdfBytes = await pdfDoc.saveAsBase64({ + useObjectStreams: false + }); + const arrayBuffer = base64ToArrayBuffer(modifiedPdfBytes); + return { arrayBuffer: arrayBuffer, base64: modifiedPdfBytes }; + } else { + return { totalPages: 1 }; + } +}; diff --git a/apps/OpenSign/src/pages/PdfRequestFiles.js b/apps/OpenSign/src/pages/PdfRequestFiles.js index 98828177b..57c726592 100644 --- a/apps/OpenSign/src/pages/PdfRequestFiles.js +++ b/apps/OpenSign/src/pages/PdfRequestFiles.js @@ -41,7 +41,8 @@ import { fetchUrl, signatureTypes, handleSignatureType, - getTenantDetails + getTenantDetails, + getBase64FromUrl } from "../constant/Utils"; import Header from "../components/pdf/PdfHeader"; import RenderPdf from "../components/pdf/RenderPdf"; @@ -146,6 +147,7 @@ function PdfRequestFiles(props) { const divRef = useRef(null); const [isDownloadModal, setIsDownloadModal] = useState(false); const [signatureType, setSignatureType] = useState([]); + const [pdfBase64Url, setPdfBase64Url] = useState(""); const isMobile = window.innerWidth < 767; let isGuestSignFlow = false; @@ -323,10 +325,9 @@ function PdfRequestFiles(props) { documentData[0] && (documentData[0]?.SignedUrl || documentData[0]?.URL); 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(t("something-went-wrong-mssg")); + const base64Pdf = await getBase64FromUrl(url); + if (base64Pdf) { + setPdfBase64Url(base64Pdf); } } else { setHandleError(t("something-went-wrong-mssg")); @@ -443,10 +444,9 @@ function PdfRequestFiles(props) { documentData[0] && (documentData[0]?.SignedUrl || documentData[0]?.URL); 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(t("something-went-wrong-mssg")); + const base64Pdf = await getBase64FromUrl(url); + if (base64Pdf) { + setPdfBase64Url(base64Pdf); } } else { setHandleError(t("something-went-wrong-mssg")); @@ -2063,15 +2063,12 @@ function PdfRequestFiles(props) { {/* pdf render view */}
@@ -2079,6 +2076,7 @@ function PdfRequestFiles(props) { clickOnZoomIn={clickOnZoomIn} clickOnZoomOut={clickOnZoomOut} isDisableRotate={true} + isDisableDelete={true} />
{/* this modal is used show this document is already sign */} @@ -2272,6 +2270,7 @@ function PdfRequestFiles(props) { uniqueId={uniqueId} ispublicTemplate={isPublicTemplate} handleUserDetails={handleUserDetails} + pdfBase64Url={pdfBase64Url} /> )}
diff --git a/apps/OpenSign/src/pages/PlaceHolderSign.js b/apps/OpenSign/src/pages/PlaceHolderSign.js index 3018953cb..7b21231b8 100644 --- a/apps/OpenSign/src/pages/PlaceHolderSign.js +++ b/apps/OpenSign/src/pages/PlaceHolderSign.js @@ -41,7 +41,8 @@ import { handleRotateWarning, signatureTypes, handleSignatureType, - formatDate + formatDate, + getBase64FromUrl } from "../constant/Utils"; import RenderPdf from "../components/pdf/RenderPdf"; import { useNavigate } from "react-router-dom"; @@ -140,7 +141,7 @@ function PlaceHolderSign() { const [pdfArrayBuffer, setPdfArrayBuffer] = useState(""); const isHeader = useSelector((state) => state.showHeader); const [activeMailAdapter, setActiveMailAdapter] = useState(""); - const [isRotate, setIsRotate] = useState({ + const [showRotateAlert, setShowRotateAlert] = useState({ status: false, degree: 0 }); @@ -152,11 +153,12 @@ function PlaceHolderSign() { const [isCustomize, setIsCustomize] = useState(false); const [zoomPercent, setZoomPercent] = useState(0); const [scale, setScale] = useState(1); - const [pdfRotateBase64, setPdfRotatese64] = useState(""); + const [pdfBase64Url, setPdfBase64Url] = useState(""); const [planCode, setPlanCode] = useState(""); const [unSignedWidgetId, setUnSignedWidgetId] = useState(""); const [signatureType, setSignatureType] = useState(signatureTypes); const [emailResetDate, setEmailResetDate] = useState(""); + const [isUploadPdf, setIsUploadPdf] = useState(false); const isMobile = window.innerWidth < 767; const [, drop] = useDrop({ accept: "BOX", @@ -266,9 +268,11 @@ function PlaceHolderSign() { 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); + const base64Pdf = await getBase64FromUrl(url); if (arrayBuffer === "Error") { setHandleError(t("something-went-wrong-mssg")); } else { + setPdfBase64Url(base64Pdf); setPdfArrayBuffer(arrayBuffer); } if (documentData[0]?.ExtUserPtr?.LastEmailCountReset?.iso) { @@ -859,15 +863,12 @@ function PlaceHolderSign() { } catch (e) { console.log("error to convertBase64ToFile in placeholder flow", e); } - } else if (pdfRotateBase64) { + } else if (pdfBase64Url) { try { const pdfUrl = await convertBase64ToFile( pdfDetails[0].Name, - pdfRotateBase64 + pdfBase64Url ); - const tenantId = localStorage.getItem("TenantId"); - const buffer = atob(pdfRotateBase64); - SaveFileSize(buffer.length, pdfUrl, tenantId); return pdfUrl; } catch (e) { console.log("error to convertBase64ToFile in placeholder flow", e); @@ -940,7 +941,6 @@ function PlaceHolderSign() { } } }; - useEffect(() => { const timer = setTimeout(() => { if (signerPos?.length > 0 && !pdfDetails?.[0]?.IsCompleted) { @@ -949,7 +949,7 @@ function PlaceHolderSign() { }, 2000); return () => clearTimeout(timer); // eslint-disable-next-line react-hooks/exhaustive-deps - }, [signerPos, signersdata, signatureType]); + }, [signerPos, signersdata, signatureType, pdfBase64Url]); // `autosavedetails` is used to save doc details after every 2 sec when changes are happern in placeholder like drag-drop widgets, remove signers const autosavedetails = async () => { @@ -963,12 +963,20 @@ function PlaceHolderSign() { } return acc; }, []); + let pdfUrl; + if (isUploadPdf) { + pdfUrl = await convertBase64ToFile(pdfDetails[0].Name, pdfBase64Url); + } try { const docCls = new Parse.Object("contracts_Document"); docCls.id = documentId; docCls.set("Placeholders", signerPos); docCls.set("Signers", signers); docCls.set("SignatureType", signatureType); + if (pdfUrl) { + docCls.set("URL", pdfUrl); + } + await docCls.save(); } catch (e) { console.log("error", e); @@ -1741,30 +1749,36 @@ function PlaceHolderSign() { }; //`handleRotationFun` function is used to roatate pdf particular page const handleRotationFun = async (rotateDegree) => { - const isRotate = handleRotateWarning(signerPos, pageNumber); - if (isRotate) { - setIsRotate({ status: true, degree: rotateDegree }); + const rotatePlaceholderExist = handleRotateWarning(signerPos, pageNumber); + //show rotation alert if widgets already exist + if (rotatePlaceholderExist) { + setShowRotateAlert({ status: true, degree: rotateDegree }); } else { + setIsUploadPdf(true); const urlDetails = await rotatePdfPage( - pdfDetails[0].URL, rotateDegree, pageNumber - 1, - pdfRotateBase64 + pdfBase64Url ); setPdfArrayBuffer && setPdfArrayBuffer(urlDetails.arrayBuffer); - setPdfRotatese64(urlDetails.base64); + setPdfBase64Url(urlDetails.base64); } }; const handleRemovePlaceholder = async () => { - handleRemoveWidgets(setSignerPos, signerPos, pageNumber, setIsRotate); + handleRemoveWidgets( + setSignerPos, + signerPos, + pageNumber, + uniqueId, + setShowRotateAlert + ); const urlDetails = await rotatePdfPage( - pdfDetails[0].URL, - isRotate.degree, + showRotateAlert.degree, pageNumber - 1, - pdfRotateBase64 + pdfArrayBuffer ); setPdfArrayBuffer && setPdfArrayBuffer(urlDetails.arrayBuffer); - setPdfRotatese64(urlDetails.base64); + setPdfBase64Url(urlDetails.base64); }; return ( <> @@ -1821,7 +1835,7 @@ function PlaceHolderSign() { setPageNumber={setPageNumber} setSignBtnPosition={setSignBtnPosition} pageNumber={pageNumber} - pdfRotateBase64={pdfRotateBase64} + pdfBase64Url={pdfBase64Url} /> {/* pdf render view */}
@@ -1829,6 +1843,14 @@ function PlaceHolderSign() { clickOnZoomIn={clickOnZoomIn} clickOnZoomOut={clickOnZoomOut} handleRotationFun={handleRotationFun} + pdfArrayBuffer={pdfArrayBuffer} + pageNumber={pageNumber} + setPdfBase64Url={setPdfBase64Url} + setPdfArrayBuffer={setPdfArrayBuffer} + setIsUploadPdf={setIsUploadPdf} + setSignerPos={setSignerPos} + signerPos={signerPos} + userId={uniqueId} />
{/* this modal is used show alert set placeholder for all signers before send mail */} @@ -2093,6 +2115,12 @@ function PlaceHolderSign() { handleRotationFun={handleRotationFun} clickOnZoomIn={clickOnZoomIn} clickOnZoomOut={clickOnZoomOut} + setIsUploadPdf={setIsUploadPdf} + pdfArrayBuffer={pdfArrayBuffer} + setPdfArrayBuffer={setPdfArrayBuffer} + setPdfBase64Url={setPdfBase64Url} + setSignerPos={setSignerPos} + userId={uniqueId} />
diff --git a/apps/OpenSign/src/pages/SignyourselfPdf.js b/apps/OpenSign/src/pages/SignyourselfPdf.js index 721343130..83eec5cbf 100644 --- a/apps/OpenSign/src/pages/SignyourselfPdf.js +++ b/apps/OpenSign/src/pages/SignyourselfPdf.js @@ -37,7 +37,9 @@ import { onClickZoomIn, onClickZoomOut, rotatePdfPage, - signatureTypes + signatureTypes, + getBase64FromUrl, + convertBase64ToFile } from "../constant/Utils"; import { useParams } from "react-router-dom"; import Tour from "reactour"; @@ -129,11 +131,12 @@ function SignYourSelf() { const [zoomPercent, setZoomPercent] = useState(0); const isHeader = useSelector((state) => state.showHeader); const [scale, setScale] = useState(1); - const [pdfRotateBase64, setPdfRotatese64] = useState(""); + const [pdfBase64Url, setPdfBase64Url] = useState(""); const [isRotate, setIsRotate] = useState({ status: false, degree: 0 }); const [isSubscribe, setIsSubscribe] = useState({ plan: "", isValid: true }); const [isDownloadModal, setIsDownloadModal] = useState(false); const [isResize, setIsResize] = useState(false); + const [isUploadPdf, setIsUploadPdf] = useState(false); const divRef = useRef(null); const nodeRef = useRef(null); const [, drop] = useDrop({ @@ -221,13 +224,17 @@ function SignYourSelf() { ? documentData[0]?.Placeholders : []; setXyPostion(placeholders); - const url = documentData[0] && documentData[0]?.URL; + const url = + documentData[0] && + (documentData[0]?.SignedUrl || documentData[0]?.URL); if (url) { //convert document url in array buffer format to use embed widgets in pdf using pdf-lib const arrayBuffer = await convertPdfArrayBuffer(url); + const base64Pdf = await getBase64FromUrl(url); if (arrayBuffer === "Error") { setHandleError(t("something-went-wrong-mssg")); } else { + setPdfBase64Url(base64Pdf); setPdfArrayBuffer(arrayBuffer); } } else { @@ -562,15 +569,23 @@ function SignYourSelf() { }, 2000); return () => clearTimeout(timer); // eslint-disable-next-line react-hooks/exhaustive-deps - }, [xyPostion]); + }, [xyPostion, pdfBase64Url]); // `autosavedetails` is used to save doc details after every 2 sec when changes are happern in placeholder like drag-drop widgets, remove signers const autosavedetails = async () => { try { const docCls = new Parse.Object("contracts_Document"); docCls.id = documentId; + let pdfUrl; + if (isUploadPdf) { + pdfUrl = await convertBase64ToFile(pdfDetails[0].Name, pdfBase64Url); + } + console.log("isUploadPdf", isUploadPdf); docCls.set("Placeholders", xyPostion); docCls.set("IsSignyourself", true); + if (pdfUrl) { + docCls.set("URL", pdfUrl); + } await docCls.save(); } catch (e) { console.log("error", e); @@ -765,7 +780,7 @@ function SignYourSelf() { const signedpdf = JSON.parse(JSON.stringify(resSignPdf)); setPdfUrl(signedpdf); getDocumentDetails(false); - setPdfRotatese64(""); + setPdfBase64Url(""); } }; @@ -1127,14 +1142,14 @@ function SignYourSelf() { if (isPlaceholder) { setIsRotate({ status: true, degree: rotateDegree }); } else { + setIsUploadPdf(true); const urlDetails = await rotatePdfPage( - pdfUrl || pdfDetails[0].URL, rotateDegree, pageNumber - 1, - pdfRotateBase64 + pdfBase64Url ); setPdfArrayBuffer && setPdfArrayBuffer(urlDetails.arrayBuffer); - setPdfRotatese64(urlDetails.base64); + setPdfBase64Url(urlDetails.base64); } }; @@ -1158,10 +1173,10 @@ function SignYourSelf() { pdfUrl || pdfDetails[0].URL, isRotate.degree, pageNumber - 1, - pdfRotateBase64 + pdfArrayBuffer ); setPdfArrayBuffer && setPdfArrayBuffer(urlDetails.arrayBuffer); - setPdfRotatese64(urlDetails.base64); + setPdfBase64Url(urlDetails.base64); setXyPostion(updatePlaceholder); setIsRotate({ status: false, degree: 0 }); }; @@ -1228,13 +1243,20 @@ function SignYourSelf() { setSignBtnPosition={setSignBtnPosition} pageNumber={pageNumber} containerWH={containerWH} - pdfRotateBase64={pdfRotateBase64} + pdfBase64Url={pdfBase64Url} />
{containerWH?.width && containerWH?.height && ( @@ -1388,7 +1416,7 @@ function SignYourSelf() { handleTextSettingModal={handleTextSettingModal} setScale={setScale} scale={scale} - pdfRotateBase64={pdfRotateBase64} + pdfBase64Url={pdfBase64Url} fontSize={fontSize} setFontSize={setFontSize} fontColor={fontColor} diff --git a/apps/OpenSign/src/pages/TemplatePlaceholder.js b/apps/OpenSign/src/pages/TemplatePlaceholder.js index 20e534c80..b8baf80ed 100644 --- a/apps/OpenSign/src/pages/TemplatePlaceholder.js +++ b/apps/OpenSign/src/pages/TemplatePlaceholder.js @@ -33,7 +33,9 @@ import { color, signatureTypes, getTenantDetails, - handleSignatureType + handleSignatureType, + getBase64FromUrl, + convertPdfArrayBuffer } from "../constant/Utils"; import RenderPdf from "../components/pdf/RenderPdf"; import "../styles/AddUser.css"; @@ -102,7 +104,8 @@ const TemplatePlaceholder = () => { const [isNameModal, setIsNameModal] = useState(false); const [isTextSetting, setIsTextSetting] = useState(false); const [pdfLoad, setPdfLoad] = useState(false); - const [pdfRotateBase64, setPdfRotatese64] = useState(""); + const [pdfBase64Url, setPdfBase64Url] = useState(""); + const [isUploadPdf, setIsUploadPdf] = useState(false); const isMobile = window.innerWidth < 767; const [, drop] = useDrop({ accept: "BOX", @@ -139,6 +142,7 @@ const TemplatePlaceholder = () => { const [zoomPercent, setZoomPercent] = useState(0); const [scale, setScale] = useState(1); const [signatureType, setSignatureType] = useState([]); + const [pdfArrayBuffer, setPdfArrayBuffer] = useState(""); useEffect(() => { fetchTemplate(); @@ -247,6 +251,17 @@ const TemplatePlaceholder = () => { tenantSignTypes, docSignTypes ); + const url = documentData[0] && documentData[0]?.URL; + if (url) { + const arrayBuffer = await convertPdfArrayBuffer(url); + const base64Pdf = await getBase64FromUrl(url); + if (arrayBuffer === "Error") { + setHandleError(t("something-went-wrong-mssg")); + } else { + setPdfBase64Url(base64Pdf); + setPdfArrayBuffer(arrayBuffer); + } + } setSignatureType(updatedSignatureType); const updatedPdfDetails = [...documentData]; updatedPdfDetails[0].SignatureType = updatedSignatureType; @@ -709,12 +724,19 @@ const TemplatePlaceholder = () => { } }); } + let pdfUrl; + if (isUploadPdf) { + pdfUrl = await convertBase64ToFile(pdfDetails[0].Name, pdfBase64Url); + } try { const templateCls = new Parse.Object("contracts_Template"); templateCls.id = templateId; templateCls.set("Placeholders", signerPos); templateCls.set("Signers", signers); templateCls.set("SignatureType", signatureType); + if (pdfUrl) { + templateCls.set("URL", pdfUrl); + } await templateCls.save(); } catch (err) { console.log("error in autosave template", err); @@ -739,12 +761,9 @@ const TemplatePlaceholder = () => { }); } let pdfUrl = pdfDetails[0]?.URL; - if (pdfRotateBase64) { + if (pdfBase64Url) { try { - pdfUrl = await convertBase64ToFile( - pdfDetails[0].Name, - pdfRotateBase64 - ); + pdfUrl = await convertBase64ToFile(pdfDetails[0].Name, pdfBase64Url); } catch (e) { console.log("error to convertBase64ToFile in placeholder flow", e); } @@ -900,9 +919,9 @@ const TemplatePlaceholder = () => { setIsCreateDocModal(false); setIsCreateDoc(true); let pdfUrl = pdfDetails[0]?.URL; - if (pdfRotateBase64) { + if (pdfBase64Url) { try { - pdfUrl = await convertBase64ToFile(pdfDetails[0].Name, pdfRotateBase64); + pdfUrl = await convertBase64ToFile(pdfDetails[0].Name, pdfBase64Url); } catch (e) { console.log("error to convertBase64ToFile in placeholder flow", e); } @@ -1327,24 +1346,31 @@ const TemplatePlaceholder = () => { if (isRotate) { setIsRotate({ status: true, degree: rotateDegree }); } else { + setIsUploadPdf(false); const urlDetails = await rotatePdfPage( pdfDetails[0].URL, rotateDegree, pageNumber - 1, - pdfRotateBase64 + pdfArrayBuffer ); - setPdfRotatese64(urlDetails.base64); + setPdfBase64Url(urlDetails.base64); } }; const handleRemovePlaceholder = async () => { - handleRemoveWidgets(setSignerPos, signerPos, pageNumber, setIsRotate); + handleRemoveWidgets( + setSignerPos, + signerPos, + pageNumber, + uniqueId, + setIsRotate + ); const urlDetails = await rotatePdfPage( pdfDetails[0].URL, isRotate.degree, pageNumber - 1, - pdfRotateBase64 + pdfBase64Url ); - setPdfRotatese64(urlDetails.base64); + setPdfBase64Url(urlDetails.base64); }; return ( @@ -1389,6 +1415,7 @@ const TemplatePlaceholder = () => { setPageNumber={setPageNumber} setSignBtnPosition={setSignBtnPosition} pageNumber={pageNumber} + pdfBase64Url={pdfBase64Url} /> {/* pdf render view */} @@ -1397,6 +1424,13 @@ const TemplatePlaceholder = () => { clickOnZoomIn={clickOnZoomIn} clickOnZoomOut={clickOnZoomOut} handleRotationFun={handleRotationFun} + pdfArrayBuffer={pdfArrayBuffer} + pageNumber={pageNumber} + setPdfBase64Url={setPdfBase64Url} + setPdfArrayBuffer={setPdfArrayBuffer} + setIsUploadPdf={setIsUploadPdf} + setSignerPos={setSignerPos} + signerPos={signerPos} />
{/* this modal is used show alert set placeholder for all signers before send mail */} @@ -1542,6 +1576,7 @@ const TemplatePlaceholder = () => { handleRotationFun={handleRotationFun} clickOnZoomIn={clickOnZoomIn} clickOnZoomOut={clickOnZoomOut} + setSignerPos={setSignerPos} />
{ setScale={setScale} scale={scale} setIsSelectId={setIsSelectId} - pdfRotateBase64={pdfRotateBase64} + pdfBase64Url={pdfBase64Url} fontSize={fontSize} setFontSize={setFontSize} fontColor={fontColor} diff --git a/apps/OpenSign/src/script/locales/en/translation.json b/apps/OpenSign/src/script/locales/en/translation.json index 0ac94fe60..49a79b91d 100644 --- a/apps/OpenSign/src/script/locales/en/translation.json +++ b/apps/OpenSign/src/script/locales/en/translation.json @@ -707,7 +707,11 @@ "p1": "The document creator will receive an email notification whenever a signer signs the document.", "note": "Note: Notification email will not be sent for the last signer, as the document creator will receive a completion email instead." }, - "expiry-date":"Expiry date", + "expiry-date": "Expiry date", "expiry-date-updated": "The expiry date has been successfully extended to {{newexpirydate}}", - "expiry-date-error": "Please provide a new expiry date that is later than the current one" + "expiry-date-error": "Please provide a new expiry date that is later than the current one", + "delete-page": "Delete page", + "delete-alert": "Can not delete single page", + "delete-alert-2": "Are you sure want to delete this page ?", + "delete-note": "Note - once delete this page you can not undo" } diff --git a/apps/OpenSign/src/script/locales/es/translation.json b/apps/OpenSign/src/script/locales/es/translation.json index 6217deb97..e1f509018 100644 --- a/apps/OpenSign/src/script/locales/es/translation.json +++ b/apps/OpenSign/src/script/locales/es/translation.json @@ -709,5 +709,9 @@ }, "expiry-date": "Date d'expiration", "expiry-date-updated": "La fecha de vencimiento se ha extendido con éxito hasta el {{newexpirydate}}", - "expiry-date-error": "Proporcione una nueva fecha de vencimiento que sea posterior a la actual" + "expiry-date-error": "Proporcione una nueva fecha de vencimiento que sea posterior a la actual", + "delete-page": "eliminar página", + "delete-alert": "No se puede eliminar una sola página", + "delete-alert-2": "¿Está seguro de que desea eliminar esta página?", + "delete-note": "Nota: una vez que elimines esta página, no podrás deshacerla" } diff --git a/apps/OpenSign/src/script/locales/fr/translation.json b/apps/OpenSign/src/script/locales/fr/translation.json index 005bb76fc..f76d267ae 100644 --- a/apps/OpenSign/src/script/locales/fr/translation.json +++ b/apps/OpenSign/src/script/locales/fr/translation.json @@ -708,5 +708,9 @@ }, "expiry-date": "Fecha de caducidad", "expiry-date-updated": "La date d'expiration a été prolongée avec succès jusqu'au {{newexpirydate}}", - "expiry-date-error": "Veuillez fournir une nouvelle date d'expiration postérieure à la date actuelle" + "expiry-date-error": "Veuillez fournir une nouvelle date d'expiration postérieure à la date actuelle", + "delete-page": "supprimer la page", + "delete-alert": "Impossible de supprimer une seule page", + "delete-alert-2": "Etes-vous sûr de vouloir supprimer cette page ?", + "delete-note": "Remarque : une fois cette page supprimée, vous ne pouvez plus l'annuler" }