Skip to content

Commit b94e0fa

Browse files
raktima-opensignlabsraktima-opensignlabs
committed
refactor: change order of minimum & maximum input in checkbox setting
1 parent 0e5cffa commit b94e0fa

File tree

3 files changed

+141
-99
lines changed

3 files changed

+141
-99
lines changed

‎apps/OpenSign/src/components/pdf/DropdownWidgetOption.js‎

Lines changed: 30 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -178,36 +178,6 @@ function DropdownWidgetOption(props) {
178178
className="drodown-input"
179179
/>
180180

181-
{props.type === "checkbox" && !props.isSignYourself && (
182-
<>
183-
<label style={{ fontSize: "13px", fontWeight: "600" }}>
184-
Minimun check
185-
</label>
186-
<input
187-
required
188-
defaultValue={0}
189-
value={minCount}
190-
onChange={(e) => {
191-
const count = handleSetMinMax(e);
192-
setMinCount(count);
193-
}}
194-
className="drodown-input"
195-
/>
196-
<label style={{ fontSize: "13px", fontWeight: "600" }}>
197-
Maximum check
198-
</label>
199-
<input
200-
required
201-
defaultValue={0}
202-
value={maxCount}
203-
onChange={(e) => {
204-
const count = handleSetMinMax(e);
205-
setMaxCount(count);
206-
}}
207-
className="drodown-input"
208-
/>
209-
</>
210-
)}
211181
<label
212182
style={{ fontSize: "13px", fontWeight: "600", marginTop: "5px" }}
213183
>
@@ -274,7 +244,6 @@ function DropdownWidgetOption(props) {
274244
></i>
275245
</div>
276246
))}
277-
278247
<i
279248
onClick={handleAddInput}
280249
style={{
@@ -285,6 +254,36 @@ function DropdownWidgetOption(props) {
285254
}}
286255
className="fa-solid fa-square-plus"
287256
></i>
257+
{props.type === "checkbox" && !props.isSignYourself && (
258+
<>
259+
<label style={{ fontSize: "13px", fontWeight: "600" }}>
260+
Minimun check
261+
</label>
262+
<input
263+
required
264+
defaultValue={0}
265+
value={minCount}
266+
onChange={(e) => {
267+
const count = handleSetMinMax(e);
268+
setMinCount(count);
269+
}}
270+
className="drodown-input"
271+
/>
272+
<label style={{ fontSize: "13px", fontWeight: "600" }}>
273+
Maximum check
274+
</label>
275+
<input
276+
required
277+
defaultValue={0}
278+
value={maxCount}
279+
onChange={(e) => {
280+
const count = handleSetMinMax(e);
281+
setMaxCount(count);
282+
}}
283+
className="drodown-input"
284+
/>
285+
</>
286+
)}
288287
</div>
289288
{["dropdown", "radio"].includes(props.type) && (
290289
<>

‎apps/OpenSign/src/components/pdf/Placeholder.js‎

Lines changed: 103 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,78 @@ import PlaceholderType from "./PlaceholderType";
77
import moment from "moment";
88
import "../../styles/opensigndrive.css";
99

10+
const selectFormat = (data) => {
11+
switch (data) {
12+
case "L":
13+
return "MM/dd/yyyy";
14+
case "DD-MM-YYYY":
15+
return "dd-MM-yyyy";
16+
case "DD/MM/YYYY":
17+
return "dd/MM/yyyy";
18+
case "LL":
19+
return "MMMM dd, yyyy";
20+
case "DD MMM, YYYY":
21+
return "dd MMM, yyyy";
22+
case "YYYY-MM-DD":
23+
return "yyyy-MM-dd";
24+
case "MM-DD-YYYY":
25+
return "MM-dd-yyyy";
26+
case "MM.DD.YYYY":
27+
return "MM.dd.yyyy";
28+
case "MMM DD, YYYY":
29+
return "MMM dd, yyyy";
30+
case "DD MMMM, YYYY":
31+
return "dd MMMM, yyyy";
32+
default:
33+
return "MM/dd/yyyy";
34+
}
35+
};
36+
37+
const changeDateToMomentFormat = (format) => {
38+
switch (format) {
39+
case "MM/dd/yyyy":
40+
return "L";
41+
case "dd-MM-yyyy":
42+
return "DD-MM-YYYY";
43+
case "dd/MM/yyyy":
44+
return "DD/MM/YYYY";
45+
case "MMMM dd, yyyy":
46+
return "LL";
47+
case "dd MMM, yyyy":
48+
return "DD MMM, YYYY";
49+
case "yyyy-MM-dd":
50+
return "YYYY-MM-DD";
51+
case "MM-dd-yyyy":
52+
return "MM-DD-YYYY";
53+
case "MM.dd.yyyy":
54+
return "MM.DD.YYYY";
55+
case "MMM dd, yyyy":
56+
return "MMM DD, YYYY";
57+
case "dd MMMM, yyyy":
58+
return "DD MMMM, YYYY";
59+
default:
60+
return "L";
61+
}
62+
};
63+
64+
const getDefaultdate = (selectedDate) =>
65+
selectedDate ? new Date(selectedDate) : new Date();
66+
const getDefaultFormat = (dateFormat) => dateFormat || "MM/dd/yyyy";
67+
1068
function Placeholder(props) {
1169
const [isDraggingEnabled, setDraggingEnabled] = useState(true);
1270
const [isShowDateFormat, setIsShowDateFormat] = useState(false);
13-
const [selectDate, setSelectDate] = useState();
71+
const [selectDate, setSelectDate] = useState({
72+
date: moment(
73+
getDefaultdate(props?.pos?.options?.response).getTime()
74+
).format(changeDateToMomentFormat(props.pos?.options?.validation?.format)),
75+
format: getDefaultFormat(props.pos?.options?.validation?.format)
76+
});
1477
const [dateFormat, setDateFormat] = useState([]);
1578
const [saveDateFormat, setSaveDateFormat] = useState("");
16-
17-
const [startDate, setStartDate] = useState();
79+
const [startDate, setStartDate] = useState(
80+
getDefaultdate(props?.pos?.options?.response)
81+
);
1882
const dateFormatArr = [
1983
"L",
2084
"DD-MM-YYYY",
@@ -27,71 +91,41 @@ function Placeholder(props) {
2791
"DD MMMM, YYYY"
2892
];
2993

30-
const selectFormat = (data) => {
31-
switch (data) {
32-
case "L":
33-
return "MM/dd/yyyy";
34-
case "DD-MM-YYYY":
35-
return "dd-MM-yyyy";
36-
case "DD/MM/YYYY":
37-
return "dd/MM/yyyy";
38-
case "LL":
39-
return "MMMM dd, yyyy";
40-
case "DD MMM, YYYY":
41-
return "dd MMM, YYYY";
42-
case "YYYY-MM-DD":
43-
return "YYYY-MM-dd";
44-
case "MM-DD-YYYY":
45-
return "MM-dd-YYYY";
46-
case "MM.DD.YYYY":
47-
return "MM.dd.YYYY";
48-
case "MMM DD, YYYY":
49-
return "MMM dd, YYYY";
50-
case "DD MMMM, YYYY":
51-
return "dd MMMM, YYYY";
52-
default:
53-
return "dd/MM/yyyy";
54-
}
55-
};
94+
// console.log('props.pos',props.pos?.options?.validation?.format)
5695

5796
//useEffect for to set date and date format for all flow (signyour-self, request-sign,placeholder,template)
5897
//checking if already have data and set else set new date
59-
useEffect(() => {
60-
//set default current date and default format MM/dd/yyyy
61-
// if (props.isSignYourself) {
62-
// const date = new Date();
63-
// const milliseconds = date.getTime();
64-
// const newDate = moment(milliseconds).format("MM/DD/YYYY");
65-
// const dateObj = {
66-
// date: newDate,
67-
// format: "MM/dd/YYYY"
68-
// };
69-
// setSelectDate(dateObj);
70-
// } else {
71-
const defaultRes = props?.pos?.options?.response;
72-
73-
const defaultFormat = props.pos?.options?.validation?.format;
74-
const updateDate = defaultRes
75-
? new Date(props?.pos?.options?.response)
76-
: new Date();
77-
const dateFormat = defaultFormat ? defaultFormat : "MM/DD/YYYY";
78-
const milliseconds = updateDate.getTime();
79-
const newDate = moment(milliseconds).format(dateFormat);
80-
const dateObj = {
81-
date: newDate,
82-
format: props.pos?.options?.validation?.format
83-
? props.pos?.options?.validation?.format
84-
: "MM/dd/YYYY"
85-
};
86-
setSelectDate(dateObj);
87-
setStartDate(updateDate);
98+
// useEffect(() => {
99+
// console.log('go here')
100+
// //set default current date and default format MM/dd/yyyy
101+
// const defaultFormat = props.pos?.options?.validation?.format;
102+
// const updateDate = props?.pos?.options?.response
103+
// ? new Date(props?.pos?.options?.response)
104+
// : new Date();
105+
// //DD-mm-YYYY
106+
// const dateFormat = defaultFormat && defaultFormat;
107+
// // const isMomentType = dateFormat && dateFormat === "MM/dd/YYYY";
108+
// // const selectMomentFormat = isMomentType ? "MM/DD/YYYY" : dateFormat;
109+
// const selectMomentFormat = changeDateToMomentFormat(dateFormat);
88110

89-
// }
90-
// eslint-disable-next-line react-hooks/exhaustive-deps
91-
}, [props.index]);
111+
// // const isFormatType = dateFormat && dateFormat === "MM/dd/YYYY";
112+
// const getFormat = dateFormat || "MM/dd/yyyy";
113+
// const milliseconds = updateDate.getTime();
114+
// const newDate = moment(milliseconds).format(selectMomentFormat);
115+
// // console.log('new date',newDate)
116+
// const dateObj = {
117+
// date: newDate,
118+
// format: getFormat
119+
// };
120+
// console.log("dateobj selectdate useEffect", dateObj);
121+
// setSelectDate(dateObj);
122+
// setStartDate(updateDate);
123+
// // eslint-disable-next-line react-hooks/exhaustive-deps
124+
// }, []);
92125

93-
//function for add selected date and format in selectFormat
126+
//function change format array list with selected date and format
94127
const changeDateFormat = () => {
128+
// console.log("selected date", selectDate);
95129
const updateDate = [];
96130
dateFormatArr.map((data) => {
97131
let date;
@@ -102,17 +136,24 @@ function Placeholder(props) {
102136
date = new Date(selectDate?.date);
103137
}
104138
const milliseconds = date.getTime();
139+
// console.log('data',data)
105140
const newDate = moment(milliseconds).format(data);
141+
// console.log('new date',newDate)
106142
const dateObj = {
107143
date: newDate,
108144
format: selectFormat(data)
109145
};
146+
// console.log('dateobj',dateObj)
110147
updateDate.push(dateObj);
111148
});
149+
// console.log('updated format',updateDate)
112150
setDateFormat(updateDate);
113151
};
152+
153+
// console.log("selected date", selectDate);
114154
useEffect(() => {
115155
if (props.isPlaceholder || props.isSignYourself) {
156+
// console.log("selected date useEffect", selectDate);
116157
selectDate && changeDateFormat();
117158
}
118159
// eslint-disable-next-line react-hooks/exhaustive-deps

‎apps/OpenSign/src/components/pdf/PlaceholderType.js‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import RegexParser from "regex-parser";
88
function PlaceholderType(props) {
99
const type = props?.pos?.type;
1010
const [selectOption, setSelectOption] = useState("");
11-
1211
const [validatePlaceholder, setValidatePlaceholder] = useState("");
1312
const inputRef = useRef(null);
1413
const [textValue, setTextValue] = useState();
@@ -129,11 +128,13 @@ function PlaceholderType(props) {
129128
// eslint-disable-next-line react-hooks/exhaustive-deps
130129
}, [props.pos?.options?.defaultValue]);
131130

131+
//useEffect to save date and format on local array
132132
useEffect(() => {
133133
if (type && type === "date") {
134-
if (props.selectDate) {
134+
if (props?.selectDate) {
135135
let updateDate;
136-
if (props.selectDate.format === "dd-MM-yyyy") {
136+
if (props?.selectDate.format === "dd-MM-yyyy") {
137+
// console.log('saveDateformat',props.saveDateFormat)
137138
const [day, month, year] = props.saveDateFormat.split("-");
138139
updateDate = new Date(`${year}-${month}-${day}`);
139140
} else {
@@ -149,8 +150,9 @@ function PlaceholderType(props) {
149150
? props.selectDate?.format
150151
: props.pos?.options?.validation?.format
151152
? props.pos?.options?.validation?.format
152-
: "MM/dd/YYYY"
153+
: "MM/dd/yyyy"
153154
};
155+
console.log("savedateformat selectdate", dateObj);
154156
props.setSelectDate(dateObj);
155157
onChangeInput(
156158
props.saveDateFormat,
@@ -164,7 +166,7 @@ function PlaceholderType(props) {
164166
? props.selectDate.format
165167
: props.pos?.options?.validation?.format
166168
? props.pos?.options?.validation?.format
167-
: "MM/dd/YYYY"
169+
: "MM/dd/yyyy"
168170
);
169171
}
170172
}
@@ -674,7 +676,7 @@ function PlaceholderType(props) {
674676
? props.selectDate?.format
675677
: props.pos?.options?.validation?.format
676678
? props.pos?.options?.validation?.format
677-
: "MM/dd/YYYY"
679+
: "MM/dd/yyyy"
678680
}
679681
/>
680682
</div>

0 commit comments

Comments
 (0)