WEBDIENSTE/OpenSign
1
0
Fork 0
mirror of https://github.com/OpenSignLabs/OpenSign.git synced 2026-08-21 07:02:32 +02:00
Code Issues Packages Projects Releases Wiki Activity

resolve resize issue for template placeholder

Browse Source
This commit is contained in:
prafull-opensignlabs
2023-12-26 18:52:53 +05:30
parent f5f19c9b52
commit fd0ec5fd31
6 changed files with 112 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
microfrontends/SignDocuments/src/Component/PdfRequestFiles.js
+18 -15
View File
@@ -808,7 +808,7 @@ function PdfRequestFiles() {
}}
className="signedStyle"
>
Signed By
Signed by
</div>
<div style={{ marginTop: "2px" }}>
{signedSigners.map((obj, ind) => {
@@ -817,8 +817,8 @@ function PdfRequestFiles() {
style={{
display: "flex",
flexDirection: "row",
padding: "10px",
alignItems: "center",
padding: "10px 0",
background: checkSignerBackColor(obj)
}}
key={ind}
@@ -833,17 +833,18 @@ function PdfRequestFiles() {
borderRadius: 30 / 2,
justifyContent: "center",
alignItems: "center",
marginRight: "20px"
margin: "0 10px 0 5px"
}}
>
<span
style={{
fontSize: "10px",
fontSize: "12px",
textAlign: "center",
fontWeight: "bold"
fontWeight: "bold",
color: "black",
textTransform: "uppercase"
}}
>
{" "}
{getFirstLetter(obj.Name)}
</span>
</div>
@@ -874,7 +875,7 @@ function PdfRequestFiles() {
marginTop: signedSigners.length > 0 && "20px"
}}
>
Yet To Sign
Yet to sign
</div>
<div style={{ marginTop: "5px" }}>
{unsignedSigners.map((obj, ind) => {
@@ -883,7 +884,8 @@ function PdfRequestFiles() {
style={{
display: "flex",
flexDirection: "row",
padding: "10px",
alignItems: "center",
padding:"10px 0",
background: checkSignerBackColor(obj)
}}
key={ind}
@@ -892,23 +894,24 @@ function PdfRequestFiles() {
className="signerStyle"
style={{
background: "#abd1d0",
width: 20,
height: 20,
width: 30,
height: 30,
display: "flex",
borderRadius: 30 / 2,
justifyContent: "center",
alignItems: "center",
marginRight: "20px"
margin: "0 10px 0 5px"
}}
>
<span
style={{
fontSize: "8px",
fontSize: "12px",
textAlign: "center",
fontWeight: "bold"
fontWeight: "bold",
color: "black",
textTransform: "uppercase"
}}
>
{" "}
{getFirstLetter(obj.Name)}
</span>
</div>
microfrontends/SignDocuments/src/Component/TemplatePlaceholder.js
+2 -2
View File
@@ -1090,7 +1090,8 @@ const TemplatePlaceholder = () => {
allPages={allPages}
pageNumber={pageNumber}
signKey={signKey}
signerObjId={signerObjId}
// signerObjId={signerObjId}
Id={uniqueId}
/>
{/* pdf header which contain funish back button */}
<Header
@@ -1141,7 +1142,6 @@ const TemplatePlaceholder = () => {
)}
</div>
</div>
{/* signature button */}
{isMobile ? (
<div>
microfrontends/SignDocuments/src/Component/component/PlaceholderCopy.js
+51 -17
View File
@@ -66,21 +66,30 @@ function PlaceholderCopy(props) {
let newPlaceholderPosition = [];
let newPageNumber = 1;
const signerPosition = props.xyPostion;
const signerId = props.signerObjId ? props.signerObjId : props.Id
//handle placeholder array and copy for multiple signers placeholder at requested location
if (props.signerObjId) {
if (signerId) {
//get current signers data
const filterSignerPosition = signerPosition.filter(
(data) => data.signerObjId === props.signerObjId
);
let filterSignerPosition;
if(props?.signerObjId){
filterSignerPosition = signerPosition.filter(
(data) => data.signerObjId === signerId
);
}else{
filterSignerPosition = signerPosition.filter((item)=> item.Id === signerId)
}
console.log("filterSignerPosition ", filterSignerPosition)
//get current pagenumber's all placeholder position data
const placeholderPosition = filterSignerPosition[0].placeHolder.filter(
(data) => data.pageNumber === props.pageNumber
);
console.log("placeholderPosition ", placeholderPosition)
console.log("props.signKey ", props.signKey)
//get current placeholder position data which user want to copy
const currentPlaceholder = placeholderPosition[0].pos.filter(
(position) => position.key === props.signKey
);
console.log("currentPlaceholder ", currentPlaceholder)
const { key, ...rest } = currentPlaceholder[0];
for (let i = 0; i < props.allPages; i++) {
const newId = randomKey();
@@ -104,18 +113,43 @@ function PlaceholderCopy(props) {
}
newPageNumber++;
}
const updatedSignerPlaceholder = signerPosition.map(
(signersData, ind) => {
if (signersData.signerObjId === props.signerObjId) {
return {
...signersData,
placeHolder: newPlaceholderPosition
};
let updatedSignerPlaceholder;
if(props?.signerObjId){
updatedSignerPlaceholder = signerPosition.map(
(signersData, ind) => {
if (signersData.signerObjId === props.signerObjId) {
return {
...signersData,
placeHolder: newPlaceholderPosition
};
}
return signersData;
}
);
}else{
updatedSignerPlaceholder = signerPosition.map(
(signersData, ind) => {
if (signersData.Id === props.Id) {
return {
...signersData,
placeHolder: newPlaceholderPosition
};
}
return signersData;
}
return signersData;
}
);
);
}
// const updatedSignerPlaceholder = signerPosition.map(
// (signersData, ind) => {
// if (signersData.signerObjId === props.signerObjId) {
// return {
// ...signersData,
// placeHolder: newPlaceholderPosition
// };
// }
// return signersData;
// }
// );
const signersData = signerPosition;
signersData.splice(0, signerPosition.length, ...updatedSignerPlaceholder);
@@ -174,7 +208,7 @@ function PlaceholderCopy(props) {
return (
<Modal show={props.isPageCopy}>
<ModalHeader style={{ background: themeColor() }}>
<span style={{ color: "white" }}>Place All pages</span>
<span style={{ color: "white" }}>Copy to all pages</span>
</ModalHeader>
<Modal.Body>
microfrontends/SignDocuments/src/Component/component/renderPdf.js
+17 -6
View File
@@ -510,7 +510,7 @@ function RenderPdf({
</React.Fragment>
);
})
: placeholder
: placeholder // placeholder mobile
? signerPos.map((data, ind) => {
return (
<React.Fragment key={ind}>
@@ -541,9 +541,13 @@ function RenderPdf({
className="signYourselfBlock"
onDrag={() => handleTabDrag(pos.key)}
size={{
width: pos.Width ? pos.Width : 150,
height: pos.Height ? pos.Height : 60
width: posWidth(pos),
height: posHeight(pos)
}}
// size={{
// width: pos.Width ? pos.Width : 150,
// height: pos.Height ? pos.Height : 60
// }}
lockAspectRatio={
pos.Width
? pos.Width / pos.Height
@@ -559,9 +563,13 @@ function RenderPdf({
)
// data.signerObjId,
}
// default={{
// x: pos.xPosition,
// y: pos.yPosition
// }}
default={{
x: pos.xPosition,
y: pos.yPosition
x: xPos(pos),
y: yPos(pos)
}}
onResizeStart={() => {
setIsResize(true);
@@ -1089,10 +1097,11 @@ function RenderPdf({
delta,
position
) => {
e.stopPropagation()
handleImageResize(
ref,
pos.key,
data.signerObjId,
data.Id,//data.signerObjId,
position,
signerPos,
pageNumber,
@@ -1122,7 +1131,9 @@ function RenderPdf({
onClick={(e) => {
e.stopPropagation();
setIsPageCopy(true);
console.log("pos.key) ", pos.key)
setSignKey(pos.key);
setUniqueId(data.Id)
setSignerObjId(
data.signerObjId
);
microfrontends/SignDocuments/src/Component/placeHolderSign.js
+3 -1
View File
@@ -1122,7 +1122,8 @@ function PlaceHolderSign() {
allPages={allPages}
pageNumber={pageNumber}
signKey={signKey}
signerObjId={signerObjId}
// signerObjId={signerObjId}
Id={uniqueId}
/>
{/* pdf header which contain funish back button */}
<Header
@@ -1162,6 +1163,7 @@ function PlaceHolderSign() {
setIsResize={setIsResize}
setZIndex={setZIndex}
setIsPageCopy={setIsPageCopy}
signersdata={signersdata}
setSignKey={setSignKey}
setSignerObjId={setSignerObjId}
handleLinkUser={handleLinkUser}
microfrontends/SignDocuments/src/utils/Utils.js
+21 -6
View File
@@ -669,10 +669,13 @@ export const handleImageResize = (
containerWH,
showResize
) => {
const filterSignerPos = signerPos.filter(
(data) => data.signerObjId === signerId
);
// const filterSignerPos = signerPos.filter(
// (data) => data.signerObjId === signerId
// );
const filterSignerPos = signerPos.filter(
(data) => data.Id === signerId
);
if (filterSignerPos.length > 0) {
const getPlaceHolder = filterSignerPos[0].placeHolder;
const getPageNumer = getPlaceHolder.filter(
@@ -704,13 +707,19 @@ export const handleImageResize = (
return obj;
});
// const newUpdateSigner = signerPos.map((obj, ind) => {
// if (obj.signerObjId === signerId) {
// return { ...obj, placeHolder: newUpdateSignPos };
// }
// return obj;
// });
const newUpdateSigner = signerPos.map((obj, ind) => {
if (obj.signerObjId === signerId) {
if (obj.Id === signerId) {
return { ...obj, placeHolder: newUpdateSignPos };
}
return obj;
});
setSignerPos(newUpdateSigner);
} else {
const getXYdata = getPageNumer[0].pos;
@@ -734,8 +743,14 @@ export const handleImageResize = (
return obj;
});
// const newUpdateSigner = signerPos.map((obj, ind) => {
// if (obj.signerObjId === signerId) {
// return { ...obj, placeHolder: newUpdateSignPos };
// }
// return obj;
// });
const newUpdateSigner = signerPos.map((obj, ind) => {
if (obj.signerObjId === signerId) {
if (obj.Id === signerId) {
return { ...obj, placeHolder: newUpdateSignPos };
}
return obj;