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

feat: remove widgets border on click pdf

Browse Source
This commit is contained in:
RaktimaNXG
2024-02-15 19:55:30 +05:30
parent ce86510d8e
commit 987a4bd04c
6 changed files with 63 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
microfrontends/SignDocuments/src/Component/SignYourselfPdf.js
+4
View File
@@ -81,6 +81,7 @@ function SignYourSelf() {
const [contractName, setContractName] = useState("");
const [containerWH, setContainerWH] = useState({});
const [isPageCopy, setIsPageCopy] = useState(false);
const [selectWidgetId, setSelectWidgetId] = useState("");
const [showAlreadySignDoc, setShowAlreadySignDoc] = useState({
status: false
});
@@ -469,6 +470,7 @@ function SignYourSelf() {
setIsInitial(true);
}
setWidgetType(dragTypeValue);
setSelectWidgetId(key);
};
//function for send placeholder's co-ordinate(x,y) position embed signature url or stamp url
@@ -1017,6 +1019,8 @@ function SignYourSelf() {
setIsPageCopy={setIsPageCopy}
setIsInitial={setIsInitial}
setWidgetType={setWidgetType}
setSelectWidgetId={setSelectWidgetId}
selectWidgetId={selectWidgetId}
/>
)}
</div>
microfrontends/SignDocuments/src/Component/TemplatePlaceholder.js
+4 -1
View File
@@ -81,7 +81,7 @@ const TemplatePlaceholder = () => {
const [showDropdown, setShowDropdown] = useState(false);
const [widgetType, setWidgetType] = useState("");
const [isRadio, setIsRadio] = useState(false);
const [validateError, setValidateError] = useState("");
const [selectWidgetId, setSelectWidgetId] = useState("");
const [isValidate, setIsValidate] = useState(false);
const [textValidate, setTextValidate] = useState("");
const [pdfLoadFail, setPdfLoadFail] = useState({
@@ -500,6 +500,7 @@ const TemplatePlaceholder = () => {
setCurrWidgetsDetails("");
setWidgetType(dragTypeValue);
setSignKey(key);
setSelectWidgetId(key);
setIsMailSend(false);
} else {
@@ -1405,6 +1406,8 @@ const TemplatePlaceholder = () => {
setIsRadio={setIsRadio}
setIsCheckboxRequired={setIsCheckboxRequired}
setIsValidate={setIsValidate}
setSelectWidgetId={setSelectWidgetId}
selectWidgetId={selectWidgetId}
/>
)}
</div>
microfrontends/SignDocuments/src/Component/WidgetComponent/placeholder.js
+21 -7
View File
@@ -99,6 +99,7 @@ function Placeholder(props) {
//onclick placeholder function to open signature pad
const handlePlaceholderClick = () => {
props.setSelectWidgetId(props.pos.key);
const widgetTypeExist = [
"text",
"checkbox",
@@ -133,6 +134,13 @@ function Placeholder(props) {
props.setSignKey(props.pos.key);
props.setIsStamp(props.pos?.isStamp ? props.pos.isStamp : false);
}
} else if (
props.isPlaceholder &&
!props.isDragging &&
props.pos.type !== "label"
) {
props.handleLinkUser(props.data.Id);
props.setUniqueId(props.data.Id);
} else if (!props.pos.type) {
if (
!props.pos.type &&
@@ -380,7 +388,7 @@ function Placeholder(props) {
return (
<Rnd
// ref={nodeRef}
//ref={nodeRef}
key={props.pos.key}
lockAspectRatio={
props.pos.Width
@@ -401,7 +409,9 @@ function Placeholder(props) {
props.pos.type !== "radio"
? true
: false
: props.pos.type !== "radio" && true,
: props.pos.type !== "radio" &&
props.pos.key === props.selectWidgetId &&
true,
bottomLeft: false,
topLeft: false
}}
@@ -480,7 +490,9 @@ function Placeholder(props) {
: props.isSignYourself && handlePlaceholderClick();
}}
>
{props.isShowBorder && props.pos.type !== "radio" ? (
{props.isShowBorder &&
props.pos.type !== "radio" &&
props.pos.key === props.selectWidgetId ? (
<BorderResize
right={
(props.pos.type === "checkbox" || props.pos.type === "radio") &&
@@ -503,10 +515,11 @@ function Placeholder(props) {
<></>
)
) : (
props.pos.type !== "radio" && <BorderResize />
props.pos.type !== "radio" &&
props.pos.key === props.selectWidgetId && <BorderResize />
)}
{props.isShowBorder && (
{props.isShowBorder && props.pos.key === props.selectWidgetId && (
<PlaceholderBorder
setDraggingEnabled={setDraggingEnabled}
pos={props.pos}
@@ -531,7 +544,8 @@ function Placeholder(props) {
: props.isSignYourself && handlePlaceholderClick();
}}
>
<PlaceholderIcon />
{props.pos.key === props.selectWidgetId && <PlaceholderIcon />}
<PlaceholderType
pos={props.pos}
xyPostion={props.xyPostion}
@@ -556,7 +570,7 @@ function Placeholder(props) {
</div>
) : (
<>
<PlaceholderIcon />
{props.pos.key === props.selectWidgetId && <PlaceholderIcon />}
<PlaceholderType
pos={props.pos}
microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderType.js
+11 -1
View File
@@ -254,7 +254,8 @@ function PlaceholderType(props) {
/>
);
case "text":
return (
return props.isSignYourself ||
(props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
<input
className="inputPlaceholder"
ref={inputRef}
@@ -287,6 +288,15 @@ function PlaceholderType(props) {
);
}}
/>
) : (
<div
style={{
color: "black",
fontSize: calculateFontSize()
}}
>
<span>{props.pos.type}</span>
</div>
);
case "dropdown":
return props.data?.signerObjId === props.signerObjId ? (
microfrontends/SignDocuments/src/Component/component/renderPdf.js
+18 -4
View File
@@ -21,7 +21,7 @@ function RenderPdf({
drop,
signerPos,
successEmail,
nodeRef,
handleTabDrag,
handleStop,
isDragging,
@@ -31,7 +31,7 @@ function RenderPdf({
setSignKey,
pdfDetails,
xyPostion,
pdfRef,
pdfUrl,
numPages,
pageDetails,
@@ -47,7 +47,7 @@ function RenderPdf({
index,
containerWH,
setIsResize,
setZIndex,
handleLinkUser,
setUniqueId,
signersdata,
@@ -60,7 +60,9 @@ function RenderPdf({
setWidgetType,
setValidateAlert,
setIsRadio,
setCurrWidgetsDetails
setCurrWidgetsDetails,
setSelectWidgetId,
selectWidgetId
}) {
const isMobile = window.innerWidth < 767;
const newWidth = containerWH.width;
@@ -369,6 +371,8 @@ function RenderPdf({
setCurrWidgetsDetails={
setCurrWidgetsDetails
}
setSelectWidgetId={setSelectWidgetId}
selectWidgetId={selectWidgetId}
/>
</React.Fragment>
);
@@ -413,6 +417,8 @@ function RenderPdf({
isDragging={isDragging}
setIsInitial={setIsInitial}
setWidgetType={setWidgetType}
setSelectWidgetId={setSelectWidgetId}
selectWidgetId={selectWidgetId}
/>
)
);
@@ -539,6 +545,8 @@ function RenderPdf({
setCurrWidgetsDetails={
setCurrWidgetsDetails
}
setSelectWidgetId={setSelectWidgetId}
selectWidgetId={selectWidgetId}
/>
</React.Fragment>
);
@@ -586,6 +594,8 @@ function RenderPdf({
isDragging={isDragging}
setIsInitial={setIsInitial}
setWidgetType={setWidgetType}
setSelectWidgetId={setSelectWidgetId}
selectWidgetId={selectWidgetId}
/>
</React.Fragment>
)
@@ -606,6 +616,10 @@ function RenderPdf({
}}
loading={"Loading Document.."}
onLoadSuccess={pageDetails}
onClick={() => {
console.log("click on pdf");
setSelectWidgetId("");
}}
// ref={pdfRef}
file={
pdfUrl
microfrontends/SignDocuments/src/Component/placeHolderSign.js
+5
View File
@@ -101,6 +101,7 @@ function PlaceHolderSign() {
const [isUiLoading, setIsUiLoading] = useState(false);
const [isRadio, setIsRadio] = useState(false);
const [currWidgetsDetails, setCurrWidgetsDetails] = useState([]);
const [selectWidgetId, setSelectWidgetId] = useState("");
const color = [
"#93a3db",
@@ -427,6 +428,7 @@ function PlaceHolderSign() {
}
if (signer && dragTypeValue !== "label") {
setSelectWidgetId(key);
let filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
const { blockColor, Role } = signer;
@@ -499,6 +501,7 @@ function PlaceHolderSign() {
setWidgetType(dragTypeValue);
setSignKey(key);
} else {
setSelectWidgetId(key);
let filterSignerPos = signerPos.filter(
(data) => data.Role === "prefill"
);
@@ -1552,6 +1555,8 @@ function PlaceHolderSign() {
setWidgetType={setWidgetType}
setIsRadio={setIsRadio}
setCurrWidgetsDetails={setCurrWidgetsDetails}
setSelectWidgetId={setSelectWidgetId}
selectWidgetId={selectWidgetId}
/>
)}
</div>