Skip to content

Commit fd0ec5f

Browse files
prafull-opensignlabsprafull-opensignlabs
committed
resolve resize issue for template placeholder
1 parent f5f19c9 commit fd0ec5f

File tree

6 files changed

+111
-46
lines changed

6 files changed

+111
-46
lines changed

‎microfrontends/SignDocuments/src/Component/PdfRequestFiles.js‎

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -808,7 +808,7 @@ function PdfRequestFiles() {
808808
}}
809809
className="signedStyle"
810810
>
811-
Signed By
811+
Signed by
812812
</div>
813813
<div style={{ marginTop: "2px" }}>
814814
{signedSigners.map((obj, ind) => {
@@ -817,8 +817,8 @@ function PdfRequestFiles() {
817817
style={{
818818
display: "flex",
819819
flexDirection: "row",
820-
padding: "10px",
821-
820+
alignItems: "center",
821+
padding: "10px 0",
822822
background: checkSignerBackColor(obj)
823823
}}
824824
key={ind}
@@ -833,17 +833,18 @@ function PdfRequestFiles() {
833833
borderRadius: 30 / 2,
834834
justifyContent: "center",
835835
alignItems: "center",
836-
marginRight: "20px"
836+
margin: "0 10px 0 5px"
837837
}}
838838
>
839839
<span
840840
style={{
841-
fontSize: "10px",
841+
fontSize: "12px",
842842
textAlign: "center",
843-
fontWeight: "bold"
843+
fontWeight: "bold",
844+
color: "black",
845+
textTransform: "uppercase"
844846
}}
845847
>
846-
{" "}
847848
{getFirstLetter(obj.Name)}
848849
</span>
849850
</div>
@@ -874,7 +875,7 @@ function PdfRequestFiles() {
874875
marginTop: signedSigners.length > 0 && "20px"
875876
}}
876877
>
877-
Yet To Sign
878+
Yet to sign
878879
</div>
879880
<div style={{ marginTop: "5px" }}>
880881
{unsignedSigners.map((obj, ind) => {
@@ -883,7 +884,8 @@ function PdfRequestFiles() {
883884
style={{
884885
display: "flex",
885886
flexDirection: "row",
886-
padding: "10px",
887+
alignItems: "center",
888+
padding:"10px 0",
887889
background: checkSignerBackColor(obj)
888890
}}
889891
key={ind}
@@ -892,23 +894,24 @@ function PdfRequestFiles() {
892894
className="signerStyle"
893895
style={{
894896
background: "#abd1d0",
895-
width: 20,
896-
height: 20,
897+
width: 30,
898+
height: 30,
897899
display: "flex",
898900
borderRadius: 30 / 2,
899901
justifyContent: "center",
900902
alignItems: "center",
901-
marginRight: "20px"
903+
margin: "0 10px 0 5px"
902904
}}
903905
>
904906
<span
905907
style={{
906-
fontSize: "8px",
908+
fontSize: "12px",
907909
textAlign: "center",
908-
fontWeight: "bold"
910+
fontWeight: "bold",
911+
color: "black",
912+
textTransform: "uppercase"
909913
}}
910914
>
911-
{" "}
912915
{getFirstLetter(obj.Name)}
913916
</span>
914917
</div>

‎microfrontends/SignDocuments/src/Component/TemplatePlaceholder.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1090,7 +1090,8 @@ const TemplatePlaceholder = () => {
10901090
allPages={allPages}
10911091
pageNumber={pageNumber}
10921092
signKey={signKey}
1093-
signerObjId={signerObjId}
1093+
// signerObjId={signerObjId}
1094+
Id={uniqueId}
10941095
/>
10951096
{/* pdf header which contain funish back button */}
10961097
<Header
@@ -1141,7 +1142,6 @@ const TemplatePlaceholder = () => {
11411142
)}
11421143
</div>
11431144
</div>
1144-
11451145
{/* signature button */}
11461146
{isMobile ? (
11471147
<div>

‎microfrontends/SignDocuments/src/Component/component/PlaceholderCopy.js‎

Lines changed: 51 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -66,21 +66,30 @@ function PlaceholderCopy(props) {
6666
let newPlaceholderPosition = [];
6767
let newPageNumber = 1;
6868
const signerPosition = props.xyPostion;
69-
69+
const signerId = props.signerObjId ? props.signerObjId : props.Id
7070
//handle placeholder array and copy for multiple signers placeholder at requested location
71-
if (props.signerObjId) {
71+
if (signerId) {
7272
//get current signers data
73-
const filterSignerPosition = signerPosition.filter(
74-
(data) => data.signerObjId === props.signerObjId
75-
);
73+
let filterSignerPosition;
74+
if(props?.signerObjId){
75+
filterSignerPosition = signerPosition.filter(
76+
(data) => data.signerObjId === signerId
77+
);
78+
}else{
79+
filterSignerPosition = signerPosition.filter((item)=> item.Id === signerId)
80+
}
81+
console.log("filterSignerPosition ", filterSignerPosition)
7682
//get current pagenumber's all placeholder position data
7783
const placeholderPosition = filterSignerPosition[0].placeHolder.filter(
7884
(data) => data.pageNumber === props.pageNumber
7985
);
86+
console.log("placeholderPosition ", placeholderPosition)
87+
console.log("props.signKey ", props.signKey)
8088
//get current placeholder position data which user want to copy
8189
const currentPlaceholder = placeholderPosition[0].pos.filter(
8290
(position) => position.key === props.signKey
8391
);
92+
console.log("currentPlaceholder ", currentPlaceholder)
8493
const { key, ...rest } = currentPlaceholder[0];
8594
for (let i = 0; i < props.allPages; i++) {
8695
const newId = randomKey();
@@ -104,18 +113,43 @@ function PlaceholderCopy(props) {
104113
}
105114
newPageNumber++;
106115
}
107-
108-
const updatedSignerPlaceholder = signerPosition.map(
109-
(signersData, ind) => {
110-
if (signersData.signerObjId === props.signerObjId) {
111-
return {
112-
...signersData,
113-
placeHolder: newPlaceholderPosition
114-
};
116+
let updatedSignerPlaceholder;
117+
if(props?.signerObjId){
118+
updatedSignerPlaceholder = signerPosition.map(
119+
(signersData, ind) => {
120+
if (signersData.signerObjId === props.signerObjId) {
121+
return {
122+
...signersData,
123+
placeHolder: newPlaceholderPosition
124+
};
125+
}
126+
return signersData;
127+
}
128+
);
129+
}else{
130+
updatedSignerPlaceholder = signerPosition.map(
131+
(signersData, ind) => {
132+
if (signersData.Id === props.Id) {
133+
return {
134+
...signersData,
135+
placeHolder: newPlaceholderPosition
136+
};
137+
}
138+
return signersData;
115139
}
116-
return signersData;
117-
}
118-
);
140+
);
141+
}
142+
// const updatedSignerPlaceholder = signerPosition.map(
143+
// (signersData, ind) => {
144+
// if (signersData.signerObjId === props.signerObjId) {
145+
// return {
146+
// ...signersData,
147+
// placeHolder: newPlaceholderPosition
148+
// };
149+
// }
150+
// return signersData;
151+
// }
152+
// );
119153

120154
const signersData = signerPosition;
121155
signersData.splice(0, signerPosition.length, ...updatedSignerPlaceholder);
@@ -174,7 +208,7 @@ function PlaceholderCopy(props) {
174208
return (
175209
<Modal show={props.isPageCopy}>
176210
<ModalHeader style={{ background: themeColor() }}>
177-
<span style={{ color: "white" }}>Place All pages</span>
211+
<span style={{ color: "white" }}>Copy to all pages</span>
178212
</ModalHeader>
179213

180214
<Modal.Body>

‎microfrontends/SignDocuments/src/Component/component/renderPdf.js‎

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -510,7 +510,7 @@ function RenderPdf({
510510
</React.Fragment>
511511
);
512512
})
513-
: placeholder
513+
: placeholder // placeholder mobile
514514
? signerPos.map((data, ind) => {
515515
return (
516516
<React.Fragment key={ind}>
@@ -541,9 +541,13 @@ function RenderPdf({
541541
className="signYourselfBlock"
542542
onDrag={() => handleTabDrag(pos.key)}
543543
size={{
544-
width: pos.Width ? pos.Width : 150,
545-
height: pos.Height ? pos.Height : 60
544+
width: posWidth(pos),
545+
height: posHeight(pos)
546546
}}
547+
// size={{
548+
// width: pos.Width ? pos.Width : 150,
549+
// height: pos.Height ? pos.Height : 60
550+
// }}
547551
lockAspectRatio={
548552
pos.Width
549553
? pos.Width / pos.Height
@@ -559,9 +563,13 @@ function RenderPdf({
559563
)
560564
// data.signerObjId,
561565
}
566+
// default={{
567+
// x: pos.xPosition,
568+
// y: pos.yPosition
569+
// }}
562570
default={{
563-
x: pos.xPosition,
564-
y: pos.yPosition
571+
x: xPos(pos),
572+
y: yPos(pos)
565573
}}
566574
onResizeStart={() => {
567575
setIsResize(true);
@@ -1089,10 +1097,11 @@ function RenderPdf({
10891097
delta,
10901098
position
10911099
) => {
1100+
e.stopPropagation()
10921101
handleImageResize(
10931102
ref,
10941103
pos.key,
1095-
data.signerObjId,
1104+
data.Id,//data.signerObjId,
10961105
position,
10971106
signerPos,
10981107
pageNumber,
@@ -1122,7 +1131,9 @@ function RenderPdf({
11221131
onClick={(e) => {
11231132
e.stopPropagation();
11241133
setIsPageCopy(true);
1134+
console.log("pos.key) ", pos.key)
11251135
setSignKey(pos.key);
1136+
setUniqueId(data.Id)
11261137
setSignerObjId(
11271138
data.signerObjId
11281139
);

‎microfrontends/SignDocuments/src/Component/placeHolderSign.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1122,7 +1122,8 @@ function PlaceHolderSign() {
11221122
allPages={allPages}
11231123
pageNumber={pageNumber}
11241124
signKey={signKey}
1125-
signerObjId={signerObjId}
1125+
// signerObjId={signerObjId}
1126+
Id={uniqueId}
11261127
/>
11271128
{/* pdf header which contain funish back button */}
11281129
<Header
@@ -1162,6 +1163,7 @@ function PlaceHolderSign() {
11621163
setIsResize={setIsResize}
11631164
setZIndex={setZIndex}
11641165
setIsPageCopy={setIsPageCopy}
1166+
signersdata={signersdata}
11651167
setSignKey={setSignKey}
11661168
setSignerObjId={setSignerObjId}
11671169
handleLinkUser={handleLinkUser}

‎microfrontends/SignDocuments/src/utils/Utils.js‎

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -669,10 +669,13 @@ export const handleImageResize = (
669669
containerWH,
670670
showResize
671671
) => {
672+
// const filterSignerPos = signerPos.filter(
673+
// (data) => data.signerObjId === signerId
674+
// );
675+
672676
const filterSignerPos = signerPos.filter(
673-
(data) => data.signerObjId === signerId
677+
(data) => data.Id === signerId
674678
);
675-
676679
if (filterSignerPos.length > 0) {
677680
const getPlaceHolder = filterSignerPos[0].placeHolder;
678681
const getPageNumer = getPlaceHolder.filter(
@@ -704,13 +707,19 @@ export const handleImageResize = (
704707
return obj;
705708
});
706709

710+
// const newUpdateSigner = signerPos.map((obj, ind) => {
711+
// if (obj.signerObjId === signerId) {
712+
// return { ...obj, placeHolder: newUpdateSignPos };
713+
// }
714+
// return obj;
715+
// });
716+
707717
const newUpdateSigner = signerPos.map((obj, ind) => {
708-
if (obj.signerObjId === signerId) {
718+
if (obj.Id === signerId) {
709719
return { ...obj, placeHolder: newUpdateSignPos };
710720
}
711721
return obj;
712722
});
713-
714723
setSignerPos(newUpdateSigner);
715724
} else {
716725
const getXYdata = getPageNumer[0].pos;
@@ -734,8 +743,14 @@ export const handleImageResize = (
734743
return obj;
735744
});
736745

746+
// const newUpdateSigner = signerPos.map((obj, ind) => {
747+
// if (obj.signerObjId === signerId) {
748+
// return { ...obj, placeHolder: newUpdateSignPos };
749+
// }
750+
// return obj;
751+
// });
737752
const newUpdateSigner = signerPos.map((obj, ind) => {
738-
if (obj.signerObjId === signerId) {
753+
if (obj.Id === signerId) {
739754
return { ...obj, placeHolder: newUpdateSignPos };
740755
}
741756
return obj;

0 commit comments

Comments
 (0)