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

feat: change radio widgets name radio to radio button

Browse Source
This commit is contained in:
RaktimaNXG
2024-03-13 16:36:03 +05:30
parent 73b2ba6abd
commit 6004522d5c
9 changed files with 70 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/OpenSign/src/components/pdf/DropdownWidgetOption.js
+5 -4
View File
@@ -1,6 +1,7 @@
import React, { useEffect, useState } from "react";
import { themeColor } from "../../constant/const";
import ModalUi from "../../primitives/ModalUi";
import { radioButtonWidget } from "../../constant/Utils";
function DropdownWidgetOption(props) {
const [dropdownOptionList, setDropdownOptionList] = useState([
"option-1",
@@ -143,7 +144,7 @@ function DropdownWidgetOption(props) {
// styleClass={"dropdownModal"}
isOpen={props.showDropdown}
title={props.title}
closeOff={true}
showClose={false}
>
<div style={{ height: "100%", padding: 20 }}>
<form
@@ -153,7 +154,7 @@ function DropdownWidgetOption(props) {
}}
>
<div className="dropdownContainer">
{["checkbox", "radio"].includes(props.type) &&
{["checkbox", radioButtonWidget].includes(props.type) &&
!props.isSignYourself && (
<div>
<input
@@ -285,7 +286,7 @@ function DropdownWidgetOption(props) {
</>
)}
</div>
{["dropdown", "radio"].includes(props.type) && (
{["dropdown", radioButtonWidget].includes(props.type) && (
<>
<label
style={{
@@ -320,7 +321,7 @@ function DropdownWidgetOption(props) {
</select>
</>
)}
{props.type !== "checkbox" && props.type !== "radio" && (
{props.type !== "checkbox" && props.type !== radioButtonWidget && (
<>
<div
style={{
apps/OpenSign/src/components/pdf/Placeholder.js
+27 -16
View File
@@ -6,6 +6,7 @@ import {
defaultWidthHeight,
isMobile,
onChangeInput,
radioButtonWidget,
textInputWidget,
textWidget
} from "../../constant/Utils";
@@ -232,7 +233,7 @@ function Placeholder(props) {
//function to set state value of onclick on widget's setting icon
const handleWidgetsOnclick = () => {
if (props.pos.type === "radio") {
if (props.pos.type === radioButtonWidget) {
props.setIsRadio(true);
} else if (props.pos.type === "dropdown") {
props?.setShowDropdown(true);
@@ -335,10 +336,14 @@ function Placeholder(props) {
className="fa-solid fa-gear settingIcon"
style={{
color: "#188ae2",
right: ["checkbox", "radio"].includes(props.pos.type)
right: ["checkbox", radioButtonWidget].includes(
props.pos.type
)
? "24px"
: "47px",
top: ["checkbox", "radio"].includes(props.pos.type)
top: ["checkbox", radioButtonWidget].includes(
props.pos.type
)
? "-28px"
: "-19px"
}}
@@ -364,12 +369,12 @@ function Placeholder(props) {
color: "#188ae2",
right:
props.pos.type === "checkbox" ||
props.pos.type === "radio"
props.pos.type === radioButtonWidget
? "8px"
: "32px",
top:
props.pos.type === "checkbox" ||
props.pos.type === "radio"
props.pos.type === radioButtonWidget
? "-28px"
: "-18px"
}}
@@ -457,11 +462,13 @@ function Placeholder(props) {
style={{
color: "#188ae2",
right:
props.pos.type === "checkbox" || props.pos.type === "radio"
props.pos.type === "checkbox" ||
props.pos.type === radioButtonWidget
? "-9px"
: "12px",
top:
props.pos.type === "checkbox" || props.pos.type === "radio"
props.pos.type === "checkbox" ||
props.pos.type === radioButtonWidget
? "-28px"
: "-18px"
}}
@@ -490,11 +497,13 @@ function Placeholder(props) {
style={{
color: "#188ae2",
right:
props.pos.type === "checkbox" || props.pos.type === "radio"
props.pos.type === "checkbox" ||
props.pos.type === radioButtonWidget
? "-27px"
: "-8px",
top:
props.pos.type === "checkbox" || props.pos.type === "radio"
props.pos.type === "checkbox" ||
props.pos.type === radioButtonWidget
? "-28px"
: "-18px"
}}
@@ -526,10 +535,10 @@ function Placeholder(props) {
props.data && props.isNeedSign
? props.data?.signerObjId === props.signerObjId &&
props.pos.type !== "checkbox" &&
props.pos.type !== "radio"
props.pos.type !== radioButtonWidget
? true
: false
: props.pos.type !== "radio" &&
: props.pos.type !== radioButtonWidget &&
props.pos.type !== "checkbox" &&
props.pos.key === props.selectWidgetId &&
true,
@@ -614,31 +623,33 @@ function Placeholder(props) {
}}
>
{props.isShowBorder &&
props.pos.type !== "radio" &&
props.pos.type !== radioButtonWidget &&
props.pos.type !== "checkbox" &&
props.pos.key === props.selectWidgetId ? (
<BorderResize
right={
props.pos.type === "checkbox" || props.pos.type === "radio"
props.pos.type === "checkbox" ||
props.pos.type === radioButtonWidget
? -21
: -12
}
top={
props.pos.type === "checkbox" || props.pos.type === "radio"
props.pos.type === "checkbox" ||
props.pos.type === radioButtonWidget
? -21
: -11
}
/>
) : props.data && props.isNeedSign && props.pos.type !== "checkbox" ? (
props.data?.signerObjId === props.signerObjId &&
props.pos.type !== "radio" &&
props.pos.type !== radioButtonWidget &&
props.pos.type !== "checkbox" ? (
<BorderResize />
) : (
<></>
)
) : (
props.pos.type !== "radio" &&
props.pos.type !== radioButtonWidget &&
props.pos.type !== "checkbox" &&
props.pos.key === props.selectWidgetId && <BorderResize />
)}
apps/OpenSign/src/components/pdf/PlaceholderBorder.js
+2 -1
View File
@@ -2,11 +2,12 @@ import React from "react";
import { themeColor } from "../../constant/const";
import {
defaultWidthHeight,
radioButtonWidget,
resizeBorderExtraWidth
} from "../../constant/Utils";
function PlaceholderBorder(props) {
const getResizeBorderExtraWidth =
props.pos.type === "checkbox" || props.pos.type === "radio"
props.pos.type === "checkbox" || props.pos.type === radioButtonWidget
? 38
: resizeBorderExtraWidth();
const defaultWidth = defaultWidthHeight(props.pos.type).width;
apps/OpenSign/src/components/pdf/PlaceholderType.js
+2 -1
View File
@@ -3,6 +3,7 @@ import {
getMonth,
getYear,
onChangeInput,
radioButtonWidget,
range,
textInputWidget,
textWidget
@@ -700,7 +701,7 @@ function PlaceholderType(props) {
<span>{type}</span>
</div>
);
case "radio":
case radioButtonWidget:
return (
<div>
{props.pos.options?.values.map((data, ind) => {
apps/OpenSign/src/components/pdf/WidgetComponent.js
+11 -6
View File
@@ -3,7 +3,12 @@ import ModalUi from "../../primitives/ModalUi";
import RecipientList from "./RecipientList";
import { useDrag } from "react-dnd";
import WidgetList from "./WidgetList";
import { textInputWidget, textWidget, widgets } from "../../constant/Utils";
import {
radioButtonWidget,
textInputWidget,
textWidget,
widgets
} from "../../constant/Utils";
import { themeColor } from "../../constant/const";
function WidgetComponent({
dragSignature,
@@ -152,16 +157,16 @@ function WidgetComponent({
isDragEmail: !!monitor.isDragging()
})
});
const [, radio] = useDrag({
const [, radioButton] = useDrag({
type: "BOX",
item: {
type: "BOX",
id: 15,
text: "radio"
text: radioButtonWidget
},
collect: (monitor) => ({
isDragRadio: !!monitor.isDragging()
isDragRadiotton: !!monitor.isDragging()
})
});
const [, text] = useDrag({
@@ -211,7 +216,7 @@ function WidgetComponent({
textInput,
checkbox,
dropdown,
radio,
radioButton,
image,
email
];
@@ -227,7 +232,7 @@ function WidgetComponent({
const filterWidgets = widget.filter(
(data) =>
data.type !== "dropdown" &&
data.type !== "radio" &&
data.type !== radioButtonWidget &&
data.type !== textWidget
);
const textWidgetData = widget.filter((data) => data.type !== textWidget);
apps/OpenSign/src/constant/Utils.js
+6 -5
View File
@@ -7,6 +7,7 @@ import { rgb } from "pdf-lib";
export const isMobile = window.innerWidth < 767;
export const textInputWidget = "text input";
export const textWidget = "text";
export const radioButtonWidget = "radio button";
export const openInNewTab = (url) => {
window.open(url, "_blank", "noopener,noreferrer");
};
@@ -204,7 +205,7 @@ export const widgets = [
iconSize: "19px"
},
{
type: "radio",
type: radioButtonWidget,
icon: "fa-regular fa-circle-dot",
iconSize: "20px"
},
@@ -260,7 +261,7 @@ export const addWidgetOptions = (type) => {
return { ...defaultOpt, validation: { type: "email", pattern: "" } };
case "dropdown":
return defaultOpt;
case "radio":
case radioButtonWidget:
return { ...defaultOpt, values: [] };
case textWidget:
return defaultOpt;
@@ -346,7 +347,7 @@ export const defaultWidthHeight = (type) => {
return { width: 70, height: 70 };
case "email":
return { width: 150, height: 20 };
case "radio":
case radioButtonWidget:
return { width: 15, height: 30 };
case textWidget:
return { width: 150, height: 17 };
@@ -1078,7 +1079,7 @@ export const multiSignEmbed = async (
? labelDefaultHeight
: scaleHeight;
const widgetHeight =
position.type === "radio"
position.type === radioButtonWidget
? 10
: position.type === "checkbox"
? 10
@@ -1272,7 +1273,7 @@ export const multiSignEmbed = async (
height: scaleHeight
});
dropdown.enableReadOnly();
} else if (position.type === "radio") {
} else if (position.type === radioButtonWidget) {
const radioRandomId = "radio" + randomId();
const radioGroup = form.createRadioGroup(radioRandomId);
let addYPosition = 18;
apps/OpenSign/src/pages/PdfRequestFiles.js
+7 -4
View File
@@ -19,7 +19,8 @@ import {
onImageSelect,
onSaveSign,
onSaveImage,
addDefaultSignatureImg
addDefaultSignatureImg,
radioButtonWidget
} from "../constant/Utils";
import Loader from "../primitives/LoaderWithMsg";
import HandleError from "../primitives/HandleError";
@@ -385,7 +386,8 @@ function PdfRequestFiles() {
for (let j = 0; j < checkUser[0].placeHolder[i].pos.length; j++) {
checkboxExist =
checkUser[0].placeHolder[i].pos[j].type === "checkbox";
radioExist = checkUser[0].placeHolder[i].pos[j].type === "radio";
radioExist =
checkUser[0].placeHolder[i].pos[j].type === radioButtonWidget;
if (checkboxExist) {
requiredCheckbox = checkUser[0].placeHolder[i].pos.filter(
(position) =>
@@ -434,7 +436,8 @@ function PdfRequestFiles() {
} else if (radioExist) {
requiredRadio = checkUser[0].placeHolder[i].pos.filter(
(position) =>
!position.options?.isReadOnly && position.type === "radio"
!position.options?.isReadOnly &&
position.type === radioButtonWidget
);
if (requiredRadio && requiredRadio?.length > 0) {
let checkSigned;
@@ -457,7 +460,7 @@ function PdfRequestFiles() {
const requiredWidgets = checkUser[0].placeHolder[i].pos.filter(
(position) =>
position.options?.status === "required" &&
position.type !== "radio" &&
position.type !== radioButtonWidget &&
position.type !== "checkbox"
);
if (requiredWidgets && requiredWidgets?.length > 0) {
apps/OpenSign/src/pages/PlaceHolderSign.js
+5 -4
View File
@@ -26,7 +26,8 @@ import {
multiSignEmbed,
addWidgetOptions,
textInputWidget,
textWidget
textWidget,
radioButtonWidget
} from "../constant/Utils";
import RenderPdf from "../components/pdf/RenderPdf";
import { useNavigate } from "react-router-dom";
@@ -484,7 +485,7 @@ function PlaceHolderSign() {
setShowDropdown(true);
} else if (dragTypeValue === "checkbox") {
setIsCheckbox(true);
} else if (dragTypeValue === "radio") {
} else if (dragTypeValue === radioButtonWidget) {
setIsRadio(true);
} else if (
dragTypeValue !== textWidget &&
@@ -1070,7 +1071,7 @@ function PlaceHolderSign() {
const getPosData = getXYdata;
const addSignPos = getPosData.map((position) => {
if (position.key === signKey) {
if (widgetType === "radio") {
if (widgetType === radioButtonWidget) {
if (addOption) {
return {
...position,
@@ -1563,7 +1564,7 @@ function PlaceHolderSign() {
setTempSignerId={setTempSignerId}
/>
<DropdownWidgetOption
type="radio"
type={radioButtonWidget}
title="Radio group"
showDropdown={isRadio}
setShowDropdown={setIsRadio}
apps/OpenSign/src/pages/TemplatePlaceholder.js
+5 -4
View File
@@ -23,7 +23,8 @@ import {
defaultWidthHeight,
addWidgetOptions,
textInputWidget,
textWidget
textWidget,
radioButtonWidget
} from "../constant/Utils";
import RenderPdf from "../components/pdf/RenderPdf";
import "../styles/AddUser.css";
@@ -444,7 +445,7 @@ const TemplatePlaceholder = () => {
setShowDropdown(true);
} else if (dragTypeValue === "checkbox") {
setIsCheckbox(true);
} else if (dragTypeValue === "radio") {
} else if (dragTypeValue === radioButtonWidget) {
setIsRadio(true);
} else if (
dragTypeValue !== textWidget &&
@@ -991,7 +992,7 @@ const TemplatePlaceholder = () => {
const getPosData = getXYdata;
const addSignPos = getPosData.map((position) => {
if (position.key === signKey) {
if (widgetType === "radio") {
if (widgetType === radioButtonWidget) {
if (addOption) {
return {
...position,
@@ -1310,7 +1311,7 @@ const TemplatePlaceholder = () => {
</div>
</ModalUi>
<DropdownWidgetOption
type="radio"
type={radioButtonWidget}
title="Radio group"
showDropdown={isRadio}
setShowDropdown={setIsRadio}