@djb25/digit-ui-module-ekyc 1.0.2 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +11 -11
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
- package/src/components/ConnectionDetailsView.js +83 -79
- package/src/components/DesktopInbox.js +117 -126
- package/src/components/SearchConsumer.js +103 -102
- package/src/pages/employee/AadhaarVerification.js +403 -320
- package/src/pages/employee/AddressDetails.js +560 -421
- package/src/pages/employee/Review.js +123 -98
package/package.json
CHANGED
|
@@ -4,73 +4,73 @@ import { useTranslation } from "react-i18next";
|
|
|
4
4
|
import { useHistory, useRouteMatch } from "react-router-dom";
|
|
5
5
|
|
|
6
6
|
const ConnectionDetailsView = ({ kNumber, kName, connectionDetails, isLoading }) => {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
const { t } = useTranslation();
|
|
8
|
+
const history = useHistory();
|
|
9
|
+
const { path } = useRouteMatch();
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
|
|
11
|
+
const [showModal, setShowModal] = useState(false);
|
|
12
|
+
const [selectedOption, setSelectedOption] = useState({ code: "SELF", name: "EKYC_SELF" });
|
|
13
13
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
const options = [
|
|
15
|
+
{ code: "SELF", name: "EKYC_SELF" },
|
|
16
|
+
{ code: "OTHER", name: "EKYC_OTHER" },
|
|
17
|
+
];
|
|
18
18
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
const handleStartVerification = () => {
|
|
20
|
+
setShowModal(true);
|
|
21
|
+
};
|
|
22
22
|
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
23
|
+
const onModalConfirm = () => {
|
|
24
|
+
// Correctly handle redirection from create-kyc or dashboard
|
|
25
|
+
const parentPath = path.includes("/create-kyc") ? path.replace("/create-kyc", "") : path.replace("/k-details", "");
|
|
26
|
+
history.push(`${parentPath}/aadhaar-verification`, { kNumber, selectedOption, connectionDetails });
|
|
27
|
+
setShowModal(false);
|
|
28
|
+
};
|
|
29
29
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
30
|
+
const handleRaiseCorrection = () => {
|
|
31
|
+
console.log("Raise Correction clicked");
|
|
32
|
+
};
|
|
33
33
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
34
|
+
if (isLoading) {
|
|
35
|
+
return <Loader />;
|
|
36
|
+
}
|
|
37
37
|
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
38
|
+
if (!connectionDetails) {
|
|
39
|
+
return null;
|
|
40
|
+
}
|
|
41
41
|
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
42
|
+
return (
|
|
43
|
+
<React.Fragment>
|
|
44
|
+
<Card className="ekyc-create-card" style={{ padding: "24px" }}>
|
|
45
|
+
<CardHeader>{t("EKYC_K_NUMBER_DETAILS")}</CardHeader>
|
|
46
|
+
<StatusTable>
|
|
47
|
+
<Row label={t("EKYC_K_NUMBER")} text={kNumber || t("CS_NA")} />
|
|
48
|
+
<Row label={t("EKYC_K_NAME")} text={kName || t("CS_NA")} />
|
|
49
|
+
</StatusTable>
|
|
50
50
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
51
|
+
<CardHeader style={{ marginTop: "24px" }}>{t("EKYC_CONNECTION_DETAILS")}</CardHeader>
|
|
52
|
+
{connectionDetails?.connectionDetailsInfo ? (
|
|
53
|
+
<StatusTable>
|
|
54
|
+
<Row label={t("EKYC_CONSUMER_NAME")} text={connectionDetails.connectionDetailsInfo.consumerName || t("CS_NA")} />
|
|
55
|
+
<Row label={t("EKYC_ADDRESS")} text={connectionDetails.connectionDetailsInfo.address || t("CS_NA")} />
|
|
56
|
+
<Row label={t("EKYC_CONNECTION_TYPE")} text={connectionDetails.connectionDetailsInfo.connectionType || t("CS_NA")} />
|
|
57
|
+
<Row label={t("EKYC_METER_NO")} text={connectionDetails.connectionDetailsInfo.meterNumber || t("CS_NA")} />
|
|
58
|
+
<Row label={t("EKYC_PHONE_NO")} text={connectionDetails.connectionDetailsInfo.phoneNumber || t("CS_NA")} />
|
|
59
|
+
<Row label={t("EKYC_EMAIL")} text={connectionDetails.connectionDetailsInfo.email || t("CS_NA")} />
|
|
60
|
+
<Row label={t("EKYC_STATUS")} text={connectionDetails.connectionDetailsInfo.statusflag || t("CS_NA")} />
|
|
61
|
+
</StatusTable>
|
|
62
|
+
) : (
|
|
63
|
+
<CardLabel>{t("EKYC_NO_CONNECTION_DETAILS_FOUND")}</CardLabel>
|
|
64
|
+
)}
|
|
65
65
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
66
|
+
<div style={{ display: "flex", justifyContent: "flex-end", marginTop: "16px" }}>
|
|
67
|
+
<SubmitBar label={t("EKYC_START_VERIFICATION")} onSubmit={handleStartVerification} style={{ borderRadius: "12px", margin: 0 }} />
|
|
68
|
+
</div>
|
|
69
|
+
{/* <button
|
|
70
70
|
className="submit-bar"
|
|
71
71
|
style={{
|
|
72
72
|
marginLeft: "10px",
|
|
73
|
-
background: "#
|
|
73
|
+
background: "#3A8DCC",
|
|
74
74
|
border: "none",
|
|
75
75
|
color: "#fff",
|
|
76
76
|
padding: "10px 24px",
|
|
@@ -83,32 +83,36 @@ const ConnectionDetailsView = ({ kNumber, kName, connectionDetails, isLoading })
|
|
|
83
83
|
>
|
|
84
84
|
{t("EKYC_RAISE_CORRECTION")}
|
|
85
85
|
</button> */}
|
|
86
|
-
|
|
86
|
+
</Card>
|
|
87
87
|
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
88
|
+
{showModal && (
|
|
89
|
+
<Modal
|
|
90
|
+
headerBarMain={t("EKYC_SELECT_VERIFICATION_TYPE")}
|
|
91
|
+
headerBarEnd={
|
|
92
|
+
<span onClick={() => setShowModal(false)} style={{ cursor: "pointer", padding: "8px" }}>
|
|
93
|
+
X
|
|
94
|
+
</span>
|
|
95
|
+
}
|
|
96
|
+
actionSaveLabel={t("ES_COMMON_CONFIRM")}
|
|
97
|
+
actionSaveOnSubmit={onModalConfirm}
|
|
98
|
+
actionCancelLabel={t("ES_COMMON_CANCEL")}
|
|
99
|
+
actionCancelOnSubmit={() => setShowModal(false)}
|
|
100
|
+
style={{ borderRadius: "12px" }}
|
|
101
|
+
>
|
|
102
|
+
<div style={{ padding: "24px" }}>
|
|
103
|
+
<RadioButtons
|
|
104
|
+
options={options}
|
|
105
|
+
optionsKey="name"
|
|
106
|
+
selectedOption={selectedOption}
|
|
107
|
+
onSelect={setSelectedOption}
|
|
108
|
+
style={{ display: "flex", flexDirection: "column", gap: "12px", buttonStyle: { borderRadius: "5px" } }}
|
|
109
|
+
t={t}
|
|
110
|
+
/>
|
|
111
|
+
</div>
|
|
112
|
+
</Modal>
|
|
113
|
+
)}
|
|
114
|
+
</React.Fragment>
|
|
115
|
+
);
|
|
112
116
|
};
|
|
113
117
|
|
|
114
118
|
export default ConnectionDetailsView;
|
|
@@ -4,144 +4,135 @@ import { Table, SubmitBar, Header, Card, HomeIcon, PersonIcon } from "@djb25/dig
|
|
|
4
4
|
import { Link } from "react-router-dom";
|
|
5
5
|
import StatusCards from "./StatusCards";
|
|
6
6
|
|
|
7
|
-
const DesktopInbox = ({
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
searchFields,
|
|
28
|
-
} = props;
|
|
29
|
-
const { t } = useTranslation();
|
|
30
|
-
const [FilterComponent, setComp] = React.useState(() => Digit.ComponentRegistryService?.getComponent(filterComponent));
|
|
7
|
+
const DesktopInbox = ({ tableConfig, filterComponent, ...props }) => {
|
|
8
|
+
const {
|
|
9
|
+
data,
|
|
10
|
+
isLoading,
|
|
11
|
+
onSort,
|
|
12
|
+
onNextPage,
|
|
13
|
+
onPrevPage,
|
|
14
|
+
currentPage,
|
|
15
|
+
pageSizeLimit,
|
|
16
|
+
onPageSizeChange,
|
|
17
|
+
parentRoute,
|
|
18
|
+
searchParams,
|
|
19
|
+
sortParams,
|
|
20
|
+
totalRecords,
|
|
21
|
+
countData,
|
|
22
|
+
onSearch,
|
|
23
|
+
searchFields,
|
|
24
|
+
} = props;
|
|
25
|
+
const { t } = useTranslation();
|
|
26
|
+
const [FilterComponent, setComp] = React.useState(() => Digit.ComponentRegistryService?.getComponent(filterComponent));
|
|
31
27
|
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
);
|
|
68
|
-
},
|
|
69
|
-
},
|
|
70
|
-
],
|
|
71
|
-
[t, parentRoute]
|
|
72
|
-
);
|
|
28
|
+
const columns = useMemo(
|
|
29
|
+
() => [
|
|
30
|
+
{
|
|
31
|
+
Header: t("EKYC_APPLICATION_NO"),
|
|
32
|
+
accessor: "applicationNumber",
|
|
33
|
+
Cell: ({ row }) => {
|
|
34
|
+
const applicationNumber = row.original?.applicationNumber || "NA";
|
|
35
|
+
return (
|
|
36
|
+
<Link to={`${parentRoute}/application-details/${applicationNumber}`}>
|
|
37
|
+
<span className="ekyc-application-link">{applicationNumber}</span>
|
|
38
|
+
</Link>
|
|
39
|
+
);
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
Header: t("EKYC_CITIZEN_NAME"),
|
|
44
|
+
accessor: "citizenName",
|
|
45
|
+
Cell: ({ row }) => <span>{row.original?.citizenName || "NA"}</span>,
|
|
46
|
+
},
|
|
47
|
+
{
|
|
48
|
+
Header: t("EKYC_MOBILE_NO"),
|
|
49
|
+
accessor: "mobileNumber",
|
|
50
|
+
Cell: ({ row }) => <span>{row.original?.mobileNumber || "NA"}</span>,
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
Header: t("EKYC_STATUS"),
|
|
54
|
+
accessor: "status",
|
|
55
|
+
Cell: ({ row }) => {
|
|
56
|
+
const status = row.original?.status || "DEFAULT";
|
|
57
|
+
return <span className={`ekyc-status-tag ${status}`}>{t(`EKYC_STATUS_${status}`)}</span>;
|
|
58
|
+
},
|
|
59
|
+
},
|
|
60
|
+
],
|
|
61
|
+
[t, parentRoute]
|
|
62
|
+
);
|
|
73
63
|
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
64
|
+
const tableData = useMemo(() => {
|
|
65
|
+
return data?.items || [];
|
|
66
|
+
}, [data]);
|
|
77
67
|
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
68
|
+
return (
|
|
69
|
+
<div className="inbox-container">
|
|
70
|
+
<div className="filters-container">
|
|
71
|
+
{/* Sidebar Title Card */}
|
|
72
|
+
<Card
|
|
73
|
+
className="sidebar-title-card"
|
|
74
|
+
style={{ display: "flex", alignItems: "center", padding: "16px", marginBottom: "16px", borderRadius: "4px" }}
|
|
75
|
+
>
|
|
76
|
+
<div className="icon-container" style={{ color: "#3A8DCC", marginRight: "12px" }}>
|
|
77
|
+
<HomeIcon style={{ width: "24px", height: "24px" }} />
|
|
78
|
+
</div>
|
|
79
|
+
<div style={{ fontWeight: "700", fontSize: "18px", color: "#0B0C0C" }}>{t("ACTION_TEST_EKYC")}</div>
|
|
80
|
+
</Card>
|
|
90
81
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
82
|
+
<div>
|
|
83
|
+
{FilterComponent && (
|
|
84
|
+
<FilterComponent
|
|
85
|
+
defaultSearchParams={props.defaultSearchParams}
|
|
86
|
+
onFilterChange={props.onSearch}
|
|
87
|
+
searchParams={searchParams}
|
|
88
|
+
type="desktop"
|
|
89
|
+
moduleCode="EKYC"
|
|
90
|
+
/>
|
|
91
|
+
)}
|
|
92
|
+
</div>
|
|
93
|
+
</div>
|
|
103
94
|
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
95
|
+
<div style={{ flex: 1, marginLeft: "16px" }}>
|
|
96
|
+
{/* Header Section (retaining for context/actions) */}
|
|
97
|
+
{/* <div className="ekyc-header-container module-header" style={{ marginBottom: "16px", display: "flex", justifyContent: "space-between", alignItems: "center" }}>
|
|
107
98
|
<Header className="title" style={{ margin: 0 }}>{t("EKYC_INBOX_HEADER")}</Header>
|
|
108
99
|
<Link to={`${parentRoute}/create-kyc`}>
|
|
109
100
|
<SubmitBar label={t("EKYC_CREATE_KYC")} style={{ borderRadius: "8px" }} />
|
|
110
101
|
</Link>
|
|
111
102
|
</div> */}
|
|
112
103
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
104
|
+
{/* Metrics Section (The Card) */}
|
|
105
|
+
<Card className="ekyc-metrics-card" style={{ marginBottom: "16px", padding: "16px" }}>
|
|
106
|
+
<StatusCards countData={countData} />
|
|
107
|
+
</Card>
|
|
117
108
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
</div>
|
|
142
|
-
</div>
|
|
109
|
+
{/* Table Section */}
|
|
110
|
+
<div className="result" style={{ flex: 1 }}>
|
|
111
|
+
<Card className="ekyc-table-card" style={{ padding: 0 }}>
|
|
112
|
+
<Table
|
|
113
|
+
t={t}
|
|
114
|
+
data={tableData}
|
|
115
|
+
columns={columns}
|
|
116
|
+
isLoading={isLoading}
|
|
117
|
+
onSort={onSort}
|
|
118
|
+
sortParams={sortParams}
|
|
119
|
+
totalRecords={totalRecords}
|
|
120
|
+
onNextPage={onNextPage}
|
|
121
|
+
onPrevPage={onPrevPage}
|
|
122
|
+
currentPage={currentPage}
|
|
123
|
+
pageSizeLimit={pageSizeLimit}
|
|
124
|
+
onPageSizeChange={onPageSizeChange}
|
|
125
|
+
getCellProps={(cellInfo) => {
|
|
126
|
+
return {
|
|
127
|
+
className: "ekyc-table-cell",
|
|
128
|
+
};
|
|
129
|
+
}}
|
|
130
|
+
/>
|
|
131
|
+
</Card>
|
|
143
132
|
</div>
|
|
144
|
-
|
|
133
|
+
</div>
|
|
134
|
+
</div>
|
|
135
|
+
);
|
|
145
136
|
};
|
|
146
137
|
|
|
147
|
-
export default DesktopInbox;
|
|
138
|
+
export default DesktopInbox;
|