mirror of
https://github.com/OpenSignLabs/OpenSign.git
synced 2026-08-25 17:12:37 +02:00
fix: radio widget embeding issue in pdf
This commit is contained in:
RaktimaNXG
@@ -59,7 +59,8 @@ function RenderPdf({
|
||||
setIsValidate,
|
||||
setWidgetType,
|
||||
setValidateAlert,
|
||||
setIsRadio
|
||||
setIsRadio,
|
||||
setCurrWidgetsDetails
|
||||
}) {
|
||||
const isMobile = window.innerWidth < 767;
|
||||
const newWidth = containerWH.width;
|
||||
@@ -242,106 +243,6 @@ function RenderPdf({
|
||||
return (
|
||||
pos && (
|
||||
<React.Fragment key={pos.key}>
|
||||
{/* <Rnd
|
||||
disableDragging={true}
|
||||
enableResizing={{
|
||||
top: false,
|
||||
right: false,
|
||||
bottom: false,
|
||||
left: false,
|
||||
topRight: false,
|
||||
bottomRight:
|
||||
data.signerObjId === signerObjectId && true,
|
||||
bottomLeft: false,
|
||||
topLeft: false
|
||||
}}
|
||||
bounds="parent"
|
||||
style={{
|
||||
cursor:
|
||||
data.signerObjId === signerObjectId
|
||||
? "pointer"
|
||||
: "not-allowed",
|
||||
background: data.blockColor,
|
||||
borderColor: themeColor(),
|
||||
borderStyle: "dashed",
|
||||
borderWidth: "0.1px",
|
||||
zIndex: "1"
|
||||
}}
|
||||
className="signYourselfBlock"
|
||||
size={{
|
||||
width: posWidth(pos),
|
||||
height: posHeight(pos)
|
||||
}}
|
||||
onClick={() => {
|
||||
if (data.signerObjId === signerObjectId) {
|
||||
setIsSignPad(true);
|
||||
setSignKey(pos.key);
|
||||
setIsStamp(pos.isStamp);
|
||||
}
|
||||
}}
|
||||
onResize={(e, direction, ref, delta, position) => {
|
||||
e.stopPropagation();
|
||||
handleImageResize(
|
||||
ref,
|
||||
pos.key,
|
||||
data.Id,
|
||||
position,
|
||||
signerPos,
|
||||
pageNumber,
|
||||
setSignerPos,
|
||||
pdfOriginalWidth,
|
||||
containerWH,
|
||||
true
|
||||
);
|
||||
}}
|
||||
lockAspectRatio={
|
||||
pos.Width ? pos.Width / pos.Height : 2.5
|
||||
}
|
||||
default={{
|
||||
x: xPos(pos),
|
||||
y: yPos(pos)
|
||||
}}
|
||||
>
|
||||
<div style={{ pointerEvents: "none" }}>
|
||||
{data.signerObjId === signerObjectId && (
|
||||
<BorderResize />
|
||||
)}
|
||||
{pos.SignUrl ? (
|
||||
<img
|
||||
alt="no img"
|
||||
onClick={() => {
|
||||
setIsSignPad(true);
|
||||
setSignKey(pos.key);
|
||||
}}
|
||||
src={pos.SignUrl}
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
objectFit: "contain"
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
pdfDetails[0].Signers.map((signerData, key) => {
|
||||
return (
|
||||
signerData.objectId === data.signerObjId && (
|
||||
<div
|
||||
key={key}
|
||||
style={{
|
||||
fontSize: "12px",
|
||||
color: "black",
|
||||
fontWeight: "600",
|
||||
|
||||
marginTop: "0px"
|
||||
}}
|
||||
>
|
||||
{signerData.Name}
|
||||
</div>
|
||||
)
|
||||
);
|
||||
})
|
||||
)}
|
||||
</div>
|
||||
</Rnd> */}
|
||||
<Placeholder
|
||||
pos={pos}
|
||||
setSignKey={setSignKey}
|
||||
@@ -429,186 +330,6 @@ function RenderPdf({
|
||||
{placeData.pageNumber === pageNumber &&
|
||||
placeData.pos.map((pos) => {
|
||||
return (
|
||||
// <Rnd
|
||||
// bounds="parent"
|
||||
// enableResizing={{
|
||||
// top: false,
|
||||
// right: false,
|
||||
// bottom: false,
|
||||
// left: false,
|
||||
// topRight: false,
|
||||
// bottomRight: true,
|
||||
// bottomLeft: false,
|
||||
// topLeft: false
|
||||
// }}
|
||||
// key={pos.key}
|
||||
// style={{
|
||||
// cursor: "all-scroll",
|
||||
// background: data.blockColor,
|
||||
// borderColor: data.bac,
|
||||
// zIndex: pos.zIndex
|
||||
// }}
|
||||
// className="signYourselfBlock"
|
||||
// onDrag={() => handleTabDrag(pos.key)}
|
||||
// size={{
|
||||
// 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 : 2.5
|
||||
// }
|
||||
// onDragStop={
|
||||
// (event, dragElement) =>
|
||||
// handleStop(
|
||||
// event,
|
||||
// dragElement,
|
||||
// data.Id,
|
||||
// pos.key
|
||||
// )
|
||||
// // data.signerObjId,
|
||||
// }
|
||||
// // default={{
|
||||
// // x: pos.xPosition,
|
||||
// // y: pos.yPosition
|
||||
// // }}
|
||||
// default={{
|
||||
// x: xPos(pos),
|
||||
// y: yPos(pos)
|
||||
// }}
|
||||
// onResizeStart={() => {
|
||||
// setIsResize(true);
|
||||
// }}
|
||||
// onResizeStop={() => {
|
||||
// setIsResize && setIsResize(false);
|
||||
// }}
|
||||
// onResize={(
|
||||
// e,
|
||||
// direction,
|
||||
// ref,
|
||||
// delta,
|
||||
// position
|
||||
// ) => {
|
||||
// handleImageResize(
|
||||
// ref,
|
||||
// pos.key,
|
||||
// data.Id,
|
||||
// position,
|
||||
// signerPos,
|
||||
// pageNumber,
|
||||
// setSignerPos,
|
||||
// pdfOriginalWidth,
|
||||
// containerWH,
|
||||
// true
|
||||
// );
|
||||
// }}
|
||||
// >
|
||||
// <BorderResize right={-12} top={-11} />
|
||||
// <PlaceholderBorder
|
||||
// pos={pos}
|
||||
// posWidth={posWidth}
|
||||
// posHeight={posHeight}
|
||||
// />
|
||||
// <div
|
||||
// onClick={(e) => {
|
||||
// if (!isDragging) {
|
||||
// handleLinkUser(data.Id);
|
||||
// setUniqueId(data.Id);
|
||||
// }
|
||||
// }}
|
||||
// onTouchEnd={() => {
|
||||
// if (!isDragging) {
|
||||
// handleLinkUser(data.Id);
|
||||
// setUniqueId(data.Id);
|
||||
// }
|
||||
// const dataNewPlace = addZIndex(
|
||||
// signerPos,
|
||||
// pos.key,
|
||||
// setZIndex
|
||||
// );
|
||||
// setSignerPos((prevState) => {
|
||||
// const newState = [...prevState];
|
||||
// newState.splice(
|
||||
// 0,
|
||||
// signerPos.length,
|
||||
// ...dataNewPlace
|
||||
// );
|
||||
// return newState;
|
||||
// });
|
||||
// }}
|
||||
// >
|
||||
// <i
|
||||
// data-tut="reactourLinkUser"
|
||||
// className="fa-regular fa-user signUserIcon"
|
||||
// onTouchEnd={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleLinkUser(data.Id);
|
||||
// setUniqueId(data.Id);
|
||||
// }}
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleLinkUser(data.Id);
|
||||
// setUniqueId(data.Id);
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
// <i
|
||||
// className="fa-regular fa-copy signCopy"
|
||||
// onTouchEnd={(e) => {
|
||||
// e.stopPropagation();
|
||||
// setIsPageCopy(true);
|
||||
// setSignKey(pos.key);
|
||||
// setSignerObjId(data.signerObjId);
|
||||
// setUniqueId(data.Id);
|
||||
// }}
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// setIsPageCopy(true);
|
||||
// setSignKey(pos.key);
|
||||
// setSignerObjId(data.signerObjId);
|
||||
// setUniqueId(data.Id);
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
// <i
|
||||
// className="fa-regular fa-circle-xmark signCloseBtn"
|
||||
// onTouchEnd={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleDeleteSign(pos.key, data.Id);
|
||||
// }}
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleDeleteSign(pos.key, data.Id);
|
||||
// // data.signerObjId
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
|
||||
// <div
|
||||
// style={{
|
||||
// fontSize: "10px",
|
||||
// color: "black",
|
||||
// fontWeight: "500",
|
||||
// marginTop: "0px"
|
||||
// }}
|
||||
// >
|
||||
// <div>{pos.type}</div>
|
||||
// {handleUserName(
|
||||
// data.signerObjId,
|
||||
// data.Role
|
||||
// )}{" "}
|
||||
// </div>
|
||||
// </div>
|
||||
// </Rnd>
|
||||
<React.Fragment key={pos.key}>
|
||||
<Placeholder
|
||||
pos={pos}
|
||||
@@ -645,6 +366,9 @@ function RenderPdf({
|
||||
setIsValidate={setIsValidate}
|
||||
setWidgetType={setWidgetType}
|
||||
setIsRadio={setIsRadio}
|
||||
setCurrWidgetsDetails={
|
||||
setCurrWidgetsDetails
|
||||
}
|
||||
/>
|
||||
</React.Fragment>
|
||||
);
|
||||
@@ -662,138 +386,6 @@ function RenderPdf({
|
||||
data.pos.map((pos) => {
|
||||
return (
|
||||
pos && (
|
||||
// <Rnd
|
||||
// allowAnyClick
|
||||
// enableResizing={{
|
||||
// top: false,
|
||||
// right: false,
|
||||
// bottom: false,
|
||||
// left: false,
|
||||
// topRight: false,
|
||||
// bottomRight: true,
|
||||
// bottomLeft: false,
|
||||
// topLeft: false
|
||||
// }}
|
||||
// lockAspectRatio={
|
||||
// pos.Width ? pos.Width / pos.Height : 2.5
|
||||
// }
|
||||
// bounds="parent"
|
||||
// ref={nodeRef}
|
||||
// key={pos.key}
|
||||
// className="signYourselfBlock"
|
||||
// style={{
|
||||
// border: "1px solid red",
|
||||
// cursor: "all-scroll",
|
||||
// zIndex: "1",
|
||||
// background: "#daebe0"
|
||||
// }}
|
||||
// size={{
|
||||
// width: posWidth(pos, true),
|
||||
// height: posHeight(pos, true)
|
||||
// }}
|
||||
// default={{
|
||||
// x: xPos(pos, true),
|
||||
// y: yPos(pos, true)
|
||||
// }}
|
||||
// onDrag={() => handleTabDrag(pos.key)}
|
||||
// onDragStop={handleStop}
|
||||
// onResize={(
|
||||
// e,
|
||||
// direction,
|
||||
// ref,
|
||||
// delta,
|
||||
// position
|
||||
// ) => {
|
||||
// handleSignYourselfImageResize(
|
||||
// ref,
|
||||
// pos.key,
|
||||
// xyPostion,
|
||||
// index,
|
||||
// setXyPostion
|
||||
// );
|
||||
// }}
|
||||
// >
|
||||
// <BorderResize right={-12} top={-11} />
|
||||
// <PlaceholderBorder
|
||||
// pos={pos}
|
||||
// posWidth={posWidth}
|
||||
// isSignYourself={true}
|
||||
// posHeight={posHeight}
|
||||
// />
|
||||
// <div
|
||||
// style={{
|
||||
// left: xPos(pos, true),
|
||||
// top: yPos(pos, true),
|
||||
// width: posWidth(pos, true),
|
||||
// height: posHeight(pos, true),
|
||||
// zIndex: "10"
|
||||
// }}
|
||||
// onTouchEnd={(e) => {
|
||||
// if (!isDragging && isMobile) {
|
||||
// setTimeout(() => {
|
||||
// e.stopPropagation();
|
||||
// setIsSignPad(true);
|
||||
// setSignKey(pos.key);
|
||||
// setIsStamp(pos.isStamp);
|
||||
// }, 500);
|
||||
// }
|
||||
// }}
|
||||
// >
|
||||
// <i
|
||||
// className="fa-regular fa-copy signCopy"
|
||||
// onTouchEnd={(e) => {
|
||||
// e.stopPropagation();
|
||||
// setIsPageCopy(true);
|
||||
// setSignKey(pos.key);
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
// <i
|
||||
// className="fa-regular fa-circle-xmark signCloseBtn"
|
||||
// onTouchEnd={(e) => {
|
||||
// e.stopPropagation();
|
||||
// if (data) {
|
||||
// handleDeleteSign(
|
||||
// pos.key,
|
||||
// data.signerObjId
|
||||
// );
|
||||
// } else {
|
||||
// handleDeleteSign(pos.key);
|
||||
// setIsStamp(false);
|
||||
// }
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
|
||||
// {pos.SignUrl ? (
|
||||
// <div style={{ pointerEvents: "none" }}>
|
||||
// <img
|
||||
// alt="signimg"
|
||||
// src={pos.SignUrl}
|
||||
// style={{
|
||||
// width: "100%",
|
||||
// height: "100%",
|
||||
// objectFit: "contain"
|
||||
// }}
|
||||
// />
|
||||
// </div>
|
||||
// ) : (
|
||||
// <div
|
||||
// style={{
|
||||
// fontSize: "10px",
|
||||
// color: "black",
|
||||
// justifyContent: "center"
|
||||
// }}
|
||||
// >
|
||||
// {pos.isStamp ? "stamp" : "signature"}
|
||||
// </div>
|
||||
// )}
|
||||
// </div>
|
||||
// </Rnd>
|
||||
<Placeholder
|
||||
pos={pos}
|
||||
setIsPageCopy={setIsPageCopy}
|
||||
@@ -907,169 +499,6 @@ function RenderPdf({
|
||||
{placeData.pageNumber === pageNumber &&
|
||||
placeData.pos.map((pos) => {
|
||||
return (
|
||||
// <Rnd
|
||||
// onClick={() => {
|
||||
// if (!isDragging) {
|
||||
// handleLinkUser(data.Id);
|
||||
// setUniqueId(data.Id);
|
||||
// }
|
||||
// const dataNewPlace = addZIndex(
|
||||
// signerPos,
|
||||
// pos.key,
|
||||
// setZIndex
|
||||
// );
|
||||
// setSignerPos((prevState) => {
|
||||
// const newState = [...prevState];
|
||||
// newState.splice(
|
||||
// 0,
|
||||
// signerPos.length,
|
||||
// ...dataNewPlace
|
||||
// );
|
||||
// return newState;
|
||||
// });
|
||||
// }}
|
||||
// key={pos.key}
|
||||
// enableResizing={{
|
||||
// top: false,
|
||||
// right: false,
|
||||
// bottom: false,
|
||||
// left: false,
|
||||
// topRight: false,
|
||||
// bottomRight: true,
|
||||
// bottomLeft: false,
|
||||
// topLeft: false
|
||||
// }}
|
||||
// bounds="parent"
|
||||
// style={{
|
||||
// cursor: "all-scroll",
|
||||
// background: data.blockColor,
|
||||
// zIndex: pos.zIndex
|
||||
// }}
|
||||
// className="signYourselfBlock"
|
||||
// onDrag={() => handleTabDrag(pos.key)}
|
||||
// size={{
|
||||
// width: posWidth(pos),
|
||||
// height: posHeight(pos)
|
||||
// }}
|
||||
// lockAspectRatio={
|
||||
// pos.Width
|
||||
// ? pos.Width / pos.Height
|
||||
// : 2.5
|
||||
// }
|
||||
// onDragStop={
|
||||
// (event, dragElement) =>
|
||||
// handleStop(
|
||||
// event,
|
||||
// dragElement,
|
||||
// data.Id,
|
||||
// pos.key
|
||||
// )
|
||||
// // data.signerObjId,
|
||||
// }
|
||||
// // default={{
|
||||
// // x: pos.xPosition,
|
||||
// // y: pos.yPosition
|
||||
// // }}
|
||||
// default={{
|
||||
// x: xPos(pos),
|
||||
// y: yPos(pos)
|
||||
// }}
|
||||
// onResizeStart={() => {
|
||||
// setIsResize(true);
|
||||
// }}
|
||||
// onResizeStop={() => {
|
||||
// setIsResize && setIsResize(false);
|
||||
// }}
|
||||
// onResize={(
|
||||
// e,
|
||||
// direction,
|
||||
// ref,
|
||||
// delta,
|
||||
// position
|
||||
// ) => {
|
||||
// e.stopPropagation();
|
||||
// handleImageResize(
|
||||
// ref,
|
||||
// pos.key,
|
||||
// data.Id, //data.signerObjId,
|
||||
// position,
|
||||
// signerPos,
|
||||
// pageNumber,
|
||||
// setSignerPos,
|
||||
// pdfOriginalWidth,
|
||||
// containerWH,
|
||||
// false
|
||||
// );
|
||||
// }}
|
||||
// >
|
||||
// <BorderResize right={-12} top={-11} />
|
||||
// <PlaceholderBorder
|
||||
// pos={pos}
|
||||
// posWidth={posWidth}
|
||||
// posHeight={posHeight}
|
||||
// />
|
||||
// <div>
|
||||
// <i
|
||||
// data-tut="reactourLinkUser"
|
||||
// className="fa-regular fa-user signUserIcon"
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleLinkUser(data.Id);
|
||||
// setUniqueId(data.Id);
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
// <i
|
||||
// className="fa-regular fa-copy signCopy"
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// setIsPageCopy(true);
|
||||
// setSignKey(pos.key);
|
||||
// setUniqueId(data.Id);
|
||||
// setSignerObjId(
|
||||
// data.signerObjId
|
||||
// );
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
// <i
|
||||
// className="fa-regular fa-circle-xmark signCloseBtn"
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleDeleteSign(
|
||||
// pos.key,
|
||||
// data.Id
|
||||
// );
|
||||
// // data.signerObjId
|
||||
// }}
|
||||
// style={{
|
||||
// color: "#188ae2"
|
||||
// }}
|
||||
// ></i>
|
||||
|
||||
// <div
|
||||
// style={{
|
||||
// fontSize: "10px",
|
||||
// color: "black",
|
||||
// justifyContent: "center"
|
||||
// }}
|
||||
// >
|
||||
// {pos.isStamp ? (
|
||||
// <div>stamp</div>
|
||||
// ) : (
|
||||
// <div>signature</div>
|
||||
// )}
|
||||
// {handleUserName(
|
||||
// data.signerObjId,
|
||||
// data.Role
|
||||
// )}
|
||||
// </div>
|
||||
// </div>
|
||||
// </Rnd>
|
||||
<React.Fragment key={pos.key}>
|
||||
<Placeholder
|
||||
pos={pos}
|
||||
@@ -1106,6 +535,9 @@ function RenderPdf({
|
||||
setIsValidate={setIsValidate}
|
||||
setWidgetType={setWidgetType}
|
||||
setIsRadio={setIsRadio}
|
||||
setCurrWidgetsDetails={
|
||||
setCurrWidgetsDetails
|
||||
}
|
||||
/>
|
||||
</React.Fragment>
|
||||
);
|
||||
@@ -1123,72 +555,6 @@ function RenderPdf({
|
||||
data.pos.map((pos) => {
|
||||
return (
|
||||
pos && (
|
||||
// <Rnd
|
||||
// ref={nodeRef}
|
||||
// key={pos.key}
|
||||
// lockAspectRatio={
|
||||
// pos.Width ? pos.Width / pos.Height : 2.5
|
||||
// }
|
||||
// enableResizing={{
|
||||
// top: false,
|
||||
// right: false,
|
||||
// bottom: false,
|
||||
// left: false,
|
||||
// topRight: false,
|
||||
// bottomRight: true,
|
||||
// bottomLeft: false,
|
||||
// topLeft: false
|
||||
// }}
|
||||
// bounds="parent"
|
||||
// className="signYourselfBlock"
|
||||
// style={{
|
||||
// border: "1px solid red",
|
||||
// cursor: "all-scroll",
|
||||
// zIndex: "1",
|
||||
// background: "#daebe0"
|
||||
// }}
|
||||
// onDrag={() => handleTabDrag(pos.key)}
|
||||
// size={{
|
||||
// width: pos.Width ? pos.Width : 150,
|
||||
// height: pos.Height ? pos.Height : 60
|
||||
// }}
|
||||
// onDragStop={handleStop}
|
||||
// default={{
|
||||
// x: pos.xPosition,
|
||||
// y: pos.yPosition
|
||||
// }}
|
||||
// onClick={() => {
|
||||
// if (!isDragging) {
|
||||
// setIsSignPad(true);
|
||||
// setSignKey(pos.key);
|
||||
// setIsStamp(pos.isStamp);
|
||||
// }
|
||||
// }}
|
||||
// onResize={(
|
||||
// e,
|
||||
// direction,
|
||||
// ref,
|
||||
// delta,
|
||||
// position
|
||||
// ) => {
|
||||
// e.stopPropagation();
|
||||
// handleSignYourselfImageResize(
|
||||
// ref,
|
||||
// pos.key,
|
||||
// xyPostion,
|
||||
// index,
|
||||
// setXyPostion
|
||||
// );
|
||||
// }}
|
||||
// >
|
||||
// <BorderResize right={-12} top={-11} />
|
||||
// <PlaceholderBorder
|
||||
// pos={pos}
|
||||
// posWidth={posWidth}
|
||||
// posHeight={posHeight}
|
||||
// />
|
||||
// <PlaceholderDesign pos={pos} />
|
||||
// </Rnd>
|
||||
<React.Fragment key={pos.key}>
|
||||
<Placeholder
|
||||
pos={pos}
|
||||
|
||||
Reference in New Issue
Block a user