From 6981d0fc10a6587dc59d03b28af1ce567a052c11 Mon Sep 17 00:00:00 2001 From: =bhagwanSingh <=bhagwan.r@hicglobalsolutions.com> Date: Tue, 19 Aug 2025 18:47:29 +0530 Subject: [PATCH] Client Side Fill Tags and Attribute Update --- src/components/client/SignDocument.tsx | 54 +++++++++++-------- .../rightSideBar/RightSideBar.tsx | 2 +- src/components/signature/SignCon.tsx | 2 +- src/utlity/maskUtils.ts | 15 ++++++ 4 files changed, 50 insertions(+), 23 deletions(-) diff --git a/src/components/client/SignDocument.tsx b/src/components/client/SignDocument.tsx index 845bde3..6fe79ac 100644 --- a/src/components/client/SignDocument.tsx +++ b/src/components/client/SignDocument.tsx @@ -28,6 +28,7 @@ import SignCompletionScreen from "./SignCompletionScreen"; import api from "../../config/api"; import RightSideBar from "../process/processStepTwo/rightSideBar/RightSideBar"; import { RiDragMoveFill } from "react-icons/ri"; +import { handleGroupBorderPosition } from "../../utlity/tagGroupConUtils"; @@ -71,7 +72,7 @@ interface TransactionType { interface TagSubmitData { id: string; type?: string; - subType: string; + subType?: string; signed: boolean; value: string; } @@ -152,7 +153,7 @@ const SignDocument = () => { const [tagJson, setTagJson] = useState([]); const [transaction, setTransaction] = useState(null); const [recSignStatus, setRecSignStatus] = useState(null); - const [droppedItems, setDroppedItems] = useState([]); + const [droppedItems, setDroppedItems] = useState([]); const [signTagId, setSignTagId] = useState(0) const [stamp, setStamp] = useState({ open: false, blob: "" }); @@ -444,7 +445,7 @@ const SignDocument = () => { const tagData: TagSubmitData = { id: tag.id as string, type: tag.type, - subType: tag.subType ? tag.subType : "", + // subType: tag.subType ? tag.subType : "", signed: true, value: tag.value ? tag.value as string : "" } @@ -662,7 +663,7 @@ const SignDocument = () => { let prepData = { ...data.properties, icon: typeToIconMap[field.label.toUpperCase()] || , - type: dragElemData.label, + type: dragElemData.label.toUpperCase(), label: dragElemData.label, // subType: (dragElemData.label in droppedTagsDefaultField) ? droppedTagsDefaultField[dragElemData.label] : '', dimensions: { @@ -700,7 +701,7 @@ const SignDocument = () => { // } } - if (prepData.type === "temporal") { + if (prepData.type.toLowerCase() === "temporal") { prepData.currentTimeStamp = true; } @@ -853,10 +854,7 @@ const SignDocument = () => { (async () => { if ("id" in tag) { try { - const accountId = 4; - const transactionId = 23; - - const response = await api.delete(`/api/accounts/${accountId}/transactions/${transactionId}/recipients/${recipientId}/tags/${tag.id}`) + const response = await api.delete(`/api/sign/tags?recipientId=${recipientId}`, { data: [ { tagId: tag.id } ] }) if (response.status !== 200) throw "Tag Deletion error" } catch (err) { return; @@ -1170,7 +1168,7 @@ const SignDocument = () => { */} { - !item.multiLine &&

{ @@ -1185,15 +1183,14 @@ const SignDocument = () => { >

} { - item.multiLine &&

{ const val = e.currentTarget.textContent; handleTagUpdate(index, val as string); }} contentEditable={true} className="w-full outline-none max-h-max" - > -

+ >

} { "maskType" in item && "maskCharacter" in item && item.maskType &&

{ // }} onBlur={(e) => { let val = e.target.textContent; - if (typeof item.maskType === "string" && typeof val === "string") { + if (typeof item.maskType === "string" && typeof val === "string" && item.maskCharacter) { val = val.replace(/ /g, ""); e.target.textContent = maskUtils(item.maskType, val, item.maskCharacter) } @@ -1306,6 +1303,25 @@ const SignDocument = () => { {/* NAME FIELD - END */} + {/* NUMBER FIELD - START */} + { + item.type === "NUMBER" && +

+ { + + } +
+ } + {/* NUMBER FIELD - END */} + + {/* COMPANY FIELD - START */} { @@ -1501,7 +1517,7 @@ const SignDocument = () => {

- {(item.id && item.id in dateValues) ? dateValues[item.id] : item.subType?.toLowerCase()} + {(item.id && item.id in dateValues) ? dateValues[item.id] : item.dateFormat?.toLowerCase()}

{ let val = e.target.value; // Adding dummy time in case of time as it giving Invalid date without that - if (item.subType?.toLowerCase() === "time") val = "09/02/2025 " + val + if (item.dateFormat?.toLowerCase() === "time") val = "09/02/2025 " + val if (!item.id) return; setIsDateOpen(null); @@ -1527,7 +1543,7 @@ const SignDocument = () => { onClick={() => { }} - type={`${item.subType?.toLowerCase() === "date" ? "date" : (item.subType?.toLowerCase() === "time" ? "time" : "datetime-local")}`} + type={`${item.dateFormat?.toLowerCase() === "date" ? "date" : (item.dateFormat?.toLowerCase() === "time" ? "time" : "datetime-local")}`} /> @@ -1687,10 +1703,6 @@ const SignDocument = () => { - - - - {/* */} diff --git a/src/components/process/processStepTwo/rightSideBar/RightSideBar.tsx b/src/components/process/processStepTwo/rightSideBar/RightSideBar.tsx index 6d9bc24..5f7a762 100644 --- a/src/components/process/processStepTwo/rightSideBar/RightSideBar.tsx +++ b/src/components/process/processStepTwo/rightSideBar/RightSideBar.tsx @@ -29,7 +29,7 @@ import DirectionalControls from "./DirectionalControls"; export interface DroppedItemProps { droppedItems: DroppedItem[] selectedTag: DroppedItem - setDroppedItems: React.Dispatch> + setDroppedItems: React.Dispatch> | React.Dispatch> selTagKey: string, selTagIndx: number, signClient: boolean, diff --git a/src/components/signature/SignCon.tsx b/src/components/signature/SignCon.tsx index e550131..02fdf31 100644 --- a/src/components/signature/SignCon.tsx +++ b/src/components/signature/SignCon.tsx @@ -55,7 +55,7 @@ interface AddSignatureModalProps { setOpenSign: React.Dispatch>; saved: SaveType; setSaved: React.Dispatch>; - signTagId: boolean + signTagId: number } interface Account { diff --git a/src/utlity/maskUtils.ts b/src/utlity/maskUtils.ts index 138d0d1..c32936c 100644 --- a/src/utlity/maskUtils.ts +++ b/src/utlity/maskUtils.ts @@ -1,3 +1,5 @@ +import { MASKCHARACTER } from "../components/process/processStepTwo/rightSideBar/RightSideBar"; + const type_all = (str: string, changeWith: string): string => { return str.replace(/./g, changeWith); }; @@ -38,6 +40,19 @@ const type_social_insurance = (str: string, changeWith: string): string => { }; const maskUtils = (type: string, original: string, changeWith: string): string => { + + switch (changeWith) { + case MASKCHARACTER.ASTERISK: + changeWith = "*"; + break; + case MASKCHARACTER.DOT: + changeWith = "."; + break; + case MASKCHARACTER.X: + changeWith = "x"; + break; + } + switch (type) { case "ALL": return type_all(original, changeWith);