fix: placeholder disappear issue in template flow

This commit is contained in:
RaktimaNXG
2024-09-03 15:49:37 +05:30
parent 1f60b0bbcb
commit 740b5ea719
7 changed files with 64 additions and 86 deletions
@@ -329,7 +329,6 @@ function Placeholder(props) {
//condition for only placeholder and template flow
if (props.data && props?.pos?.type !== textWidget) {
props.setSignerObjId(props?.data?.signerObjId);
props.setUniqueId(props?.data?.Id);
const checkIndex = props.xyPostion.findIndex(
(data) => data.Id === props.data.Id
@@ -360,7 +359,6 @@ function Placeholder(props) {
//and on save or cancel button of copy all page popup i have set this temp signer Id in unique id
if (props.data && props?.pos?.type !== textWidget) {
props.setSignerObjId(props?.data?.signerObjId);
props.setUniqueId(props?.data?.Id);
const checkIndex = props.xyPostion.findIndex(
(data) => data.Id === props.data.Id
@@ -369,7 +367,6 @@ function Placeholder(props) {
props.setIsSelectId(checkIndex || 0);
} else if (props.data && props.pos.type === textWidget) {
props.setTempSignerId(props.uniqueId);
props.setSignerObjId(props?.data?.signerObjId);
props.setUniqueId(props?.data?.Id);
const checkIndex = props.xyPostion.findIndex(
(data) => data.Id === props.data.Id
@@ -16,7 +16,7 @@ const RecipientList = (props) => {
//function for onhover signer name change background color
const inputRef = useRef(null);
const isWidgetExist = (Id) => {
return props.signerPos.some((x) => x.Id === Id);
return props.signerPos.some((x) => x.Id === Id && x.placeHolder);
};
//handle drag start
@@ -63,9 +63,7 @@ const RecipientList = (props) => {
remainingItems.splice(index, 0, ...draggedItem);
//set current draggable recipient details,objectId,index,contract_className ... after replace recipient list
props?.setSignersData(remainingItems);
props?.setSignerObjId(remainingItems[index]?.objectId || "");
props?.setIsSelectId(index);
props?.setContractName(remainingItems[index]?.className || "");
props?.setUniqueId(remainingItems[index]?.Id);
props?.setRoleName(remainingItems[index]?.Role);
props?.setBlockColor(remainingItems[index]?.blockColor);
@@ -121,9 +119,7 @@ const RecipientList = (props) => {
}}
onClick={(e) => {
e.preventDefault();
props.setSignerObjId(obj?.objectId || "");
props.setIsSelectId(ind);
props.setContractName(obj?.className || "");
props.setUniqueId(obj.Id);
props.setRoleName(obj.Role);
props.setBlockColor(obj?.blockColor);
@@ -41,7 +41,6 @@ function RenderPdf({
setUniqueId,
signersdata,
setIsPageCopy,
setSignerObjId,
setShowDropdown,
setIsInitial,
setIsValidate,
@@ -319,7 +318,6 @@ function RenderPdf({
index={pageNumber}
xyPostion={signerPos}
setXyPostion={setSignerPos}
setSignerObjId={setSignerObjId}
data={data}
setIsResize={setIsResize}
setShowDropdown={setShowDropdown}
@@ -508,7 +506,6 @@ function RenderPdf({
index={pageNumber}
xyPostion={signerPos}
setXyPostion={setSignerPos}
setSignerObjId={setSignerObjId}
data={data}
setIsResize={setIsResize}
setShowDropdown={setShowDropdown}
@@ -20,9 +20,7 @@ function WidgetComponent({
addPositionOfSignature,
signersdata,
isSelectListId,
setSignerObjId,
setIsSelectId,
setContractName,
isSigners,
dataTut,
isMailSend,
@@ -360,9 +358,7 @@ function WidgetComponent({
signerPos={signerPos}
signersdata={signersdata}
isSelectListId={isSelectListId}
setSignerObjId={setSignerObjId}
setIsSelectId={setIsSelectId}
setContractName={setContractName}
setUniqueId={setUniqueId}
setRoleName={setRoleName}
handleDeleteUser={handleDeleteUser}
+25 -33
View File
@@ -77,7 +77,6 @@ function PlaceHolderSign() {
const [xySignature, setXYSignature] = useState({});
const [dragKey, setDragKey] = useState();
const [signersdata, setSignersData] = useState([]);
const [signerObjId, setSignerObjId] = useState();
const [signerPos, setSignerPos] = useState([]);
const [isSelectListId, setIsSelectId] = useState();
const [isSendAlert, setIsSendAlert] = useState({});
@@ -98,7 +97,6 @@ function PlaceHolderSign() {
const [tourStatus, setTourStatus] = useState([]);
const [signerUserId, setSignerUserId] = useState();
const [pdfOriginalWH, setPdfOriginalWH] = useState([]);
const [contractName, setContractName] = useState("");
const [containerWH, setContainerWH] = useState();
const { docId } = useParams();
const signRef = useRef(null);
@@ -341,8 +339,6 @@ function PlaceHolderSign() {
else if (documentData[0].Signers && documentData[0].Signers.length > 0) {
const currEmail = documentData[0].ExtUserPtr.Email;
setCurrentId(currEmail);
setSignerObjId(documentData[0].Signers[0].objectId);
setContractName(documentData[0].Signers[0].className);
setIsSelectId(0);
//if condition when placeholder array present then update signers local array according to placeholder length
if (
@@ -466,8 +462,6 @@ function PlaceHolderSign() {
getSignerPos(item, monitor);
};
const getSignerPos = (item, monitor) => {
// setSignerObjId("");
// setContractName("");
if (uniqueId) {
const posZIndex = zIndex + 1;
setZIndex(posZIndex);
@@ -583,7 +577,6 @@ function PlaceHolderSign() {
Role: "prefill",
Id: key
};
signerPos.push(prefileTextWidget);
setSignerPos(signerPos);
} else {
@@ -760,9 +753,10 @@ function PlaceHolderSign() {
} else {
const updatedData = signerPos.map((item) => {
if (item.Id === Id) {
// Destructuring to remove the name field
const { placeHolder, ...rest } = item;
return rest;
// Create a copy of the item object and delete the placeHolder field
const updatedItem = { ...item };
delete updatedItem.placeHolder;
return updatedItem;
}
return item;
});
@@ -848,9 +842,9 @@ function PlaceHolderSign() {
const filterPrefill = signerPos?.filter((data) => data.Role !== "prefill");
const getPrefill = signerPos?.filter((data) => data.Role === "prefill");
let isLabel = false;
const prefillPlaceholder = getPrefill[0]?.placeHolder;
//condition is used to check text widget data is empty or have response
if (getPrefill && getPrefill.length > 0) {
const prefillPlaceholder = getPrefill[0].placeHolder;
if (prefillPlaceholder) {
prefillPlaceholder.map((data) => {
if (!isLabel) {
@@ -860,28 +854,33 @@ function PlaceHolderSign() {
}
}
let isSignatureExist = true; // variable is used to check a signature widget exit or not then execute other code
//for loop is used to check signature widget exist or not
for (let item of filterPrefill) {
let signatureExist = false; // Reset for each iteration
for (let x of item.placeHolder) {
if (!signatureExist) {
const typeExist = x.pos.some((data) => data?.type);
if (typeExist) {
signatureExist = x.pos.some((data) => data?.type === "signature");
} else {
signatureExist = x.pos.some((data) => !data.isStamp);
if (prefillPlaceholder) {
//for loop is used to check signature widget exist or not
for (let item of filterPrefill) {
let signatureExist = false; // Reset for each iteration
for (let x of item.placeHolder) {
if (!signatureExist) {
const typeExist = x.pos.some((data) => data?.type);
if (typeExist) {
signatureExist = x.pos.some((data) => data?.type === "signature");
} else {
signatureExist = x.pos.some((data) => !data.isStamp);
}
}
}
}
if (!signatureExist) {
isSignatureExist = false;
setIsSendAlert({ mssg: "sure", alert: true });
if (!signatureExist) {
isSignatureExist = false;
setIsSendAlert({ mssg: "sure", alert: true });
}
}
}
if (getPrefill && isLabel) {
setIsSendAlert({ mssg: textWidget, alert: true });
} else if (isSignatureExist) {
if (filterPrefill.length === signersdata.length) {
const isPlaceholderExist = filterPrefill.every(
(data) => data.placeHolder
);
if (isPlaceholderExist) {
const IsSignerNotExist = filterPrefill?.filter((x) => !x.signerObjId);
if (IsSignerNotExist && IsSignerNotExist?.length > 0) {
setSignerExistModal(true);
@@ -1629,8 +1628,6 @@ function PlaceHolderSign() {
setUniqueId(newId);
setIsSelectId(signersdata.length - 1);
setBlockColor(color[signersdata.length]);
setContractName("contracts_Contactbook");
setSignerObjId(data.objectId);
};
const closePopup = () => {
@@ -2063,7 +2060,6 @@ function PlaceHolderSign() {
setIsPageCopy={setIsPageCopy}
signersdata={signersdata}
setSignKey={setSignKey}
setSignerObjId={setSignerObjId}
handleLinkUser={handleLinkUser}
setUniqueId={setUniqueId}
isDragging={isDragging}
@@ -2112,9 +2108,7 @@ function PlaceHolderSign() {
signerPos={signerPos}
signersdata={signersdata}
isSelectListId={isSelectListId}
setSignerObjId={setSignerObjId}
setIsSelectId={setIsSelectId}
setContractName={setContractName}
isSigners={true}
setIsShowEmail={setIsShowEmail}
isMailSend={isMailSend}
@@ -2143,9 +2137,7 @@ function PlaceHolderSign() {
signerPos={signerPos}
signersdata={signersdata}
isSelectListId={isSelectListId}
setSignerObjId={setSignerObjId}
setIsSelectId={setIsSelectId}
setContractName={setContractName}
setUniqueId={setUniqueId}
setRoleName={setRoleName}
sendInOrder={pdfDetails[0].SendinOrder}
+18 -24
View File
@@ -62,7 +62,6 @@ const TemplatePlaceholder = () => {
const [xySignature, setXYSignature] = useState({});
const [dragKey, setDragKey] = useState();
const [signersdata, setSignersData] = useState([]);
const [signerObjId, setSignerObjId] = useState();
const [signerPos, setSignerPos] = useState([]);
const [isSelectListId, setIsSelectId] = useState();
const [isSendAlert, setIsSendAlert] = useState(false);
@@ -84,7 +83,6 @@ const TemplatePlaceholder = () => {
const [tourStatus, setTourStatus] = useState([]);
const [signerUserId, setSignerUserId] = useState();
const [pdfOriginalWH, setPdfOriginalWH] = useState([]);
const [contractName, setContractName] = useState("");
const [containerWH, setContainerWH] = useState();
const signRef = useRef(null);
const dragRef = useRef(null);
@@ -241,8 +239,6 @@ const TemplatePlaceholder = () => {
setPdfDetails(documentData);
setIsSigners(true);
if (documentData[0].Signers && documentData[0].Signers.length > 0) {
setSignerObjId(documentData[0].Signers[0].objectId);
setContractName(documentData[0].Signers[0].className);
setIsSelectId(0);
if (
documentData[0].Placeholders &&
@@ -446,8 +442,8 @@ const TemplatePlaceholder = () => {
pos: dropData
};
}
const getPlaceHolder = signer?.placeHolder;
let filterSignerPos = signerPos.find((data) => data.Id === uniqueId);
const getPlaceHolder = filterSignerPos?.placeHolder;
if (getPlaceHolder) {
//checking exist placeholder on same page
currentPagePosition = getPlaceHolder.find(
@@ -601,10 +597,6 @@ const TemplatePlaceholder = () => {
//function for delete signature block
const handleDeleteSign = (key, Id) => {
const updateData = [];
// const filterSignerPos = signerPos.filter(
// (data) => data.signerObjId === signerId
// );
const filterSignerPos = signerPos.filter((data) => data.Id === Id);
if (filterSignerPos.length > 0) {
@@ -637,11 +629,11 @@ const TemplatePlaceholder = () => {
setSignerPos(newUpdateSigner);
} else {
const updateFilter = signerPos.filter((data) => data.Id !== Id);
const getRemainPage = filterSignerPos[0].placeHolder.filter(
(data) => data.pageNumber !== pageNumber
);
//condition to check placeholder length is greater than 1 do not need to remove whole placeholder
//array only resove particular widgets
if (getRemainPage && getRemainPage.length > 0) {
const newUpdatePos = filterSignerPos.map((obj) => {
if (obj.Id === Id) {
@@ -655,7 +647,16 @@ const TemplatePlaceholder = () => {
setSignerPos(signerupdate);
} else {
setSignerPos(updateFilter);
const updatedData = signerPos.map((item) => {
if (item.Id === Id) {
// Create a copy of the item object and delete the placeHolder field
const updatedItem = { ...item };
delete updatedItem.placeHolder;
return updatedItem;
}
return item;
});
setSignerPos(updatedData);
}
}
}
@@ -690,12 +691,12 @@ const TemplatePlaceholder = () => {
const handleMouseLeave = () => {
setSignBtnPosition([xySignature]);
};
const alertSendEmail = async () => {
if (signerPos.length !== signersdata.length) {
setIsSendAlert(true);
} else {
const isPlaceholderExist = signerPos.every((data) => data.placeHolder);
if (isPlaceholderExist) {
handleSaveTemplate();
} else {
setIsSendAlert(true);
}
};
@@ -944,8 +945,6 @@ const TemplatePlaceholder = () => {
// save Role in entry in signerList and user
const handleAddRole = (e) => {
e.preventDefault();
setSignerObjId("");
setContractName("");
const count = signersdata.length > 0 ? signersdata.length + 1 : 1;
const Id = randomId();
const index = signersdata.length;
@@ -1577,7 +1576,6 @@ const TemplatePlaceholder = () => {
signersdata={signersdata}
setIsPageCopy={setIsPageCopy}
setSignKey={setSignKey}
setSignerObjId={setSignerObjId}
isDragging={isDragging}
setShowDropdown={setShowDropdown}
setCurrWidgetsDetails={setCurrWidgetsDetails}
@@ -1620,9 +1618,7 @@ const TemplatePlaceholder = () => {
signerPos={signerPos}
signersdata={signersdata}
isSelectListId={isSelectListId}
setSignerObjId={setSignerObjId}
setIsSelectId={setIsSelectId}
setContractName={setContractName}
isSigners={isSigners}
setIsShowEmail={setIsShowEmail}
isMailSend={isMailSend}
@@ -1652,10 +1648,8 @@ const TemplatePlaceholder = () => {
setSignerPos={setSignerPos}
signersdata={signersdata}
isSelectListId={isSelectListId}
setSignerObjId={setSignerObjId}
setRoleName={setRoleName}
setIsSelectId={setIsSelectId}
setContractName={setContractName}
handleAddSigner={handleAddSigner}
setUniqueId={setUniqueId}
handleDeleteUser={handleDeleteUser}
@@ -1740,20 +1740,26 @@ const ReportTable = (props) => {
</tr>
</thead>
<tbody>
{item.Placeholders.map((x, i) => (
<tr key={i} className="text-sm font-medium">
{props.ReportName === "Templates" && (
<td className="text-[12px] p-2 pl-3 w-[30%]">
{x.Role && x.Role}
</td>
)}
<td className="pl-3 text-[12px] py-2 break-all">
{x.email
? x.email
: x?.signerPtr?.Email || "-"}
</td>
</tr>
))}
{item.Placeholders.map(
(x, i) =>
x.Role !== "prefill" && (
<tr
key={i}
className="text-sm font-medium"
>
{props.ReportName === "Templates" && (
<td className="text-[12px] p-2 pl-3 w-[30%]">
{x.Role && x.Role}
</td>
)}
<td className="pl-3 text-[12px] py-2 break-all">
{x.email
? x.email
: x?.signerPtr?.Email || "-"}
</td>
</tr>
)
)}
</tbody>
</table>
</ModalUi>