Skip to content

Commit 4fe4ca6

Browse files
add receipent required validation
1 parent b8c7110 commit 4fe4ca6

File tree

1 file changed

+173
-156
lines changed

1 file changed

+173
-156
lines changed

microfrontends/SignDocuments/src/Component/TemplatePlaceholder.js

Lines changed: 173 additions & 156 deletions
Original file line numberDiff line numberDiff line change
@@ -156,6 +156,7 @@ const TemplatePlaceholder = () => {
156156
const [isEditTemplate, setIsEditTemplate] = useState(false);
157157
const [isPageCopy, setIsPageCopy] = useState(false);
158158
const [signKey, setSignKey] = useState();
159+
const [IsReceipent, setIsReceipent] = useState(true);
159160
const senderUser =
160161
localStorage.getItem(
161162
`Parse/${localStorage.getItem("parseAppId")}/currentUser`
@@ -339,192 +340,198 @@ const TemplatePlaceholder = () => {
339340

340341
// `getSignerPos` is used to get placeholder position when user place it and save it in array
341342
const getSignerPos = (item, monitor) => {
342-
const posZIndex = zIndex + 1;
343-
setZIndex(posZIndex);
344-
const newWidth = containerWH.width;
345-
const scale = pdfOriginalWidth / newWidth;
346-
const key = randomId();
347-
// let filterSignerPos = signerPos.filter(
348-
// (data) => data.signerObjId === signerObjId
349-
// );
350-
let filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
351-
let dropData = [];
352-
let xyPosArr = [];
353-
let xyPos = {};
354-
if (item === "onclick") {
355-
const dropObj = {
356-
xPosition: window.innerWidth / 2 - 100,
357-
yPosition: window.innerHeight / 2 - 60,
358-
isStamp: monitor,
359-
key: key,
360-
isDrag: false,
361-
scale: scale,
362-
isMobile: isMobile,
363-
yBottom: window.innerHeight / 2 - 60,
364-
zIndex: posZIndex
365-
};
366-
dropData.push(dropObj);
367-
xyPos = {
368-
pageNumber: pageNumber,
369-
pos: dropData
370-
};
371-
372-
xyPosArr.push(xyPos);
373-
} else if (item.type === "BOX") {
374-
const offset = monitor.getClientOffset();
375-
//adding and updating drop position in array when user drop signature button in div
376-
const containerRect = document
377-
.getElementById("container")
378-
.getBoundingClientRect();
379-
const x = offset.x - containerRect.left;
380-
const y = offset.y - containerRect.top;
381-
const ybottom = containerRect.bottom - offset.y;
382-
383-
const dropObj = {
384-
xPosition: signBtnPosition[0] ? x - signBtnPosition[0].xPos : x,
385-
yPosition: signBtnPosition[0] ? y - signBtnPosition[0].yPos : y,
386-
isStamp: isDragStamp || isDragStampSS ? true : false,
387-
key: key,
388-
isDrag: false,
389-
firstXPos: signBtnPosition[0] && signBtnPosition[0].xPos,
390-
firstYPos: signBtnPosition[0] && signBtnPosition[0].yPos,
391-
yBottom: ybottom,
392-
scale: scale,
393-
isMobile: isMobile,
394-
zIndex: posZIndex
395-
};
396-
397-
dropData.push(dropObj);
398-
xyPos = {
399-
pageNumber: pageNumber,
400-
pos: dropData
401-
};
402-
403-
xyPosArr.push(xyPos);
404-
}
405-
const { blockColor, Role } = signersdata.find((x) => x.Id === uniqueId);
406-
//adding placholder in existing signer pos array (placaholder)
407-
if (filterSignerPos.length > 0) {
408-
// const colorIndex = signerPos
409-
// .map((e) => e.signerObjId)
410-
// .indexOf(signerObjId);
343+
const singer = signersdata.find((x) => x.Id === uniqueId);
344+
345+
if (singer) {
346+
const posZIndex = zIndex + 1;
347+
setZIndex(posZIndex);
348+
const newWidth = containerWH.width;
349+
const scale = pdfOriginalWidth / newWidth;
350+
const key = randomId();
351+
// let filterSignerPos = signerPos.filter(
352+
// (data) => data.signerObjId === signerObjId
353+
// );
354+
let filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
355+
let dropData = [];
356+
let xyPosArr = [];
357+
let xyPos = {};
358+
if (item === "onclick") {
359+
const dropObj = {
360+
xPosition: window.innerWidth / 2 - 100,
361+
yPosition: window.innerHeight / 2 - 60,
362+
isStamp: monitor,
363+
key: key,
364+
isDrag: false,
365+
scale: scale,
366+
isMobile: isMobile,
367+
yBottom: window.innerHeight / 2 - 60,
368+
zIndex: posZIndex
369+
};
370+
dropData.push(dropObj);
371+
xyPos = {
372+
pageNumber: pageNumber,
373+
pos: dropData
374+
};
411375

412-
const colorIndex = signerPos.map((e) => e.Id).indexOf(uniqueId);
413-
const getPlaceHolder = filterSignerPos[0].placeHolder;
414-
const updatePlace = getPlaceHolder.filter(
415-
(data) => data.pageNumber !== pageNumber
416-
);
417-
const getPageNumer = getPlaceHolder.filter(
418-
(data) => data.pageNumber === pageNumber
419-
);
376+
xyPosArr.push(xyPos);
377+
} else if (item.type === "BOX") {
378+
const offset = monitor.getClientOffset();
379+
//adding and updating drop position in array when user drop signature button in div
380+
const containerRect = document
381+
.getElementById("container")
382+
.getBoundingClientRect();
383+
const x = offset.x - containerRect.left;
384+
const y = offset.y - containerRect.top;
385+
const ybottom = containerRect.bottom - offset.y;
386+
387+
const dropObj = {
388+
xPosition: signBtnPosition[0] ? x - signBtnPosition[0].xPos : x,
389+
yPosition: signBtnPosition[0] ? y - signBtnPosition[0].yPos : y,
390+
isStamp: isDragStamp || isDragStampSS ? true : false,
391+
key: key,
392+
isDrag: false,
393+
firstXPos: signBtnPosition[0] && signBtnPosition[0].xPos,
394+
firstYPos: signBtnPosition[0] && signBtnPosition[0].yPos,
395+
yBottom: ybottom,
396+
scale: scale,
397+
isMobile: isMobile,
398+
zIndex: posZIndex
399+
};
420400

421-
//add entry of position for same signer on multiple page
422-
if (getPageNumer.length > 0) {
423-
const getPos = getPageNumer[0].pos;
424-
const newSignPos = getPos.concat(dropData);
425-
let xyPos = {
401+
dropData.push(dropObj);
402+
xyPos = {
426403
pageNumber: pageNumber,
427-
pos: newSignPos
404+
pos: dropData
428405
};
429-
updatePlace.push(xyPos);
430-
let placeHolderPos;
431-
if (contractName) {
432-
placeHolderPos = {
433-
blockColor: blockColor ? blockColor : color[isSelectListId],
434-
signerObjId: signerObjId,
435-
placeHolder: updatePlace,
436-
signerPtr: {
437-
__type: "Pointer",
438-
className: `${contractName}`,
439-
objectId: signerObjId
440-
},
441-
Role: Role ? Role : roleName,
442-
Id: uniqueId
406+
407+
xyPosArr.push(xyPos);
408+
}
409+
const { blockColor, Role } = signersdata.find((x) => x.Id === uniqueId);
410+
//adding placholder in existing signer pos array (placaholder)
411+
if (filterSignerPos.length > 0) {
412+
// const colorIndex = signerPos
413+
// .map((e) => e.signerObjId)
414+
// .indexOf(signerObjId);
415+
416+
const colorIndex = signerPos.map((e) => e.Id).indexOf(uniqueId);
417+
const getPlaceHolder = filterSignerPos[0].placeHolder;
418+
const updatePlace = getPlaceHolder.filter(
419+
(data) => data.pageNumber !== pageNumber
420+
);
421+
const getPageNumer = getPlaceHolder.filter(
422+
(data) => data.pageNumber === pageNumber
423+
);
424+
425+
//add entry of position for same signer on multiple page
426+
if (getPageNumer.length > 0) {
427+
const getPos = getPageNumer[0].pos;
428+
const newSignPos = getPos.concat(dropData);
429+
let xyPos = {
430+
pageNumber: pageNumber,
431+
pos: newSignPos
443432
};
433+
updatePlace.push(xyPos);
434+
let placeHolderPos;
435+
if (contractName) {
436+
placeHolderPos = {
437+
blockColor: blockColor ? blockColor : color[isSelectListId],
438+
signerObjId: signerObjId,
439+
placeHolder: updatePlace,
440+
signerPtr: {
441+
__type: "Pointer",
442+
className: `${contractName}`,
443+
objectId: signerObjId
444+
},
445+
Role: Role ? Role : roleName,
446+
Id: uniqueId
447+
};
448+
} else {
449+
placeHolderPos = {
450+
blockColor: blockColor ? blockColor : color[isSelectListId],
451+
signerObjId: "",
452+
placeHolder: updatePlace,
453+
signerPtr: {},
454+
Role: Role ? Role : roleName,
455+
Id: uniqueId
456+
};
457+
}
458+
// signerPos.splice(colorIndex, 1, placeHolderPos);
459+
const newArry = [placeHolderPos];
460+
const newArray = [
461+
...signerPos.slice(0, colorIndex),
462+
...newArry,
463+
...signerPos.slice(colorIndex + 1)
464+
];
465+
setSignerPos(newArray);
444466
} else {
445-
placeHolderPos = {
446-
blockColor: blockColor ? blockColor : color[isSelectListId],
447-
signerObjId: "",
448-
placeHolder: updatePlace,
449-
signerPtr: {},
450-
Role: Role ? Role : roleName,
451-
Id: uniqueId
452-
};
467+
const newSignPoss = getPlaceHolder.concat(xyPosArr[0]);
468+
let placeHolderPos;
469+
if (contractName) {
470+
placeHolderPos = {
471+
blockColor: color[isSelectListId],
472+
signerObjId: signerObjId,
473+
placeHolder: newSignPoss,
474+
signerPtr: {
475+
__type: "Pointer",
476+
className: `${contractName}`,
477+
objectId: signerObjId
478+
},
479+
Role: Role ? Role : roleName,
480+
Id: uniqueId
481+
};
482+
} else {
483+
placeHolderPos = {
484+
blockColor: color[isSelectListId],
485+
signerObjId: "",
486+
placeHolder: newSignPoss,
487+
signerPtr: {},
488+
Role: Role ? Role : roleName,
489+
Id: uniqueId
490+
};
491+
}
492+
493+
const newArry = [placeHolderPos];
494+
const newArray = [
495+
...signerPos.slice(0, colorIndex),
496+
...newArry,
497+
...signerPos.slice(colorIndex + 1)
498+
];
499+
500+
setSignerPos(newArray);
453501
}
454-
// signerPos.splice(colorIndex, 1, placeHolderPos);
455-
const newArry = [placeHolderPos];
456-
const newArray = [
457-
...signerPos.slice(0, colorIndex),
458-
...newArry,
459-
...signerPos.slice(colorIndex + 1)
460-
];
461-
setSignerPos(newArray);
462502
} else {
463-
const newSignPoss = getPlaceHolder.concat(xyPosArr[0]);
503+
//adding new placeholder for selected signer in pos array (placeholder)
464504
let placeHolderPos;
465505
if (contractName) {
466506
placeHolderPos = {
467-
blockColor: color[isSelectListId],
468-
signerObjId: signerObjId,
469-
placeHolder: newSignPoss,
470507
signerPtr: {
471508
__type: "Pointer",
472509
className: `${contractName}`,
473510
objectId: signerObjId
474511
},
512+
signerObjId: signerObjId,
513+
blockColor: blockColor ? blockColor : color[isSelectListId],
514+
placeHolder: xyPosArr,
475515
Role: Role ? Role : roleName,
476516
Id: uniqueId
477517
};
478518
} else {
479519
placeHolderPos = {
480-
blockColor: color[isSelectListId],
481-
signerObjId: "",
482-
placeHolder: newSignPoss,
483520
signerPtr: {},
521+
signerObjId: "",
522+
blockColor: blockColor ? blockColor : color[isSelectListId],
523+
placeHolder: xyPosArr,
484524
Role: Role ? Role : roleName,
485525
Id: uniqueId
486526
};
487527
}
488528

489-
const newArry = [placeHolderPos];
490-
const newArray = [
491-
...signerPos.slice(0, colorIndex),
492-
...newArry,
493-
...signerPos.slice(colorIndex + 1)
494-
];
495-
496-
setSignerPos(newArray);
529+
setSignerPos((prev) => [...prev, placeHolderPos]);
497530
}
531+
setIsMailSend(false);
498532
} else {
499-
//adding new placeholder for selected signer in pos array (placeholder)
500-
let placeHolderPos;
501-
if (contractName) {
502-
placeHolderPos = {
503-
signerPtr: {
504-
__type: "Pointer",
505-
className: `${contractName}`,
506-
objectId: signerObjId
507-
},
508-
signerObjId: signerObjId,
509-
blockColor: blockColor ? blockColor : color[isSelectListId],
510-
placeHolder: xyPosArr,
511-
Role: Role ? Role : roleName,
512-
Id: uniqueId
513-
};
514-
} else {
515-
placeHolderPos = {
516-
signerPtr: {},
517-
signerObjId: "",
518-
blockColor: blockColor ? blockColor : color[isSelectListId],
519-
placeHolder: xyPosArr,
520-
Role: Role ? Role : roleName,
521-
Id: uniqueId
522-
};
523-
}
524-
525-
setSignerPos((prev) => [...prev, placeHolderPos]);
533+
setIsReceipent(false);
526534
}
527-
setIsMailSend(false);
528535
};
529536
//function for get pdf page details
530537
const pageDetails = async (pdf) => {
@@ -1027,6 +1034,16 @@ const TemplatePlaceholder = () => {
10271034
<p>Please add field for all recipients.</p>
10281035
</div>
10291036
</ModalUi>
1037+
<ModalUi
1038+
headerColor={"#dc3545"}
1039+
isOpen={!IsReceipent}
1040+
title={"Receipent required"}
1041+
handleClose={() => setIsReceipent(true)}
1042+
>
1043+
<div style={{ height: "100%", padding: 20 }}>
1044+
<p>Please add receipent.</p>
1045+
</div>
1046+
</ModalUi>
10301047
{/* this modal is used show send mail message and after send mail success message */}
10311048
<ModalUi
10321049
isOpen={isCreateDocModal}

0 commit comments

Comments
 (0)