diff --git a/frontend/src/Routes.js b/frontend/src/Routes.js
index 1af702b..43b3d0f 100644
--- a/frontend/src/Routes.js
+++ b/frontend/src/Routes.js
@@ -45,6 +45,8 @@ import BusinessProofUpload from "./customer/onboarding/businessProofComponents/B
import Selfie from "./customer/onboarding/businessProofComponents/Selfie";
import BankData from "./customer/onboarding/mobileBankLinkComponents/BankData";
import PhoneNumber from "./customer/onboarding/mobileBankLinkComponents/PhoneNumber";
+import PanUploaded from "./customer/onboarding/panProofComponents/PanUploaded";
+import BankDetails from "./customer/onboarding/mobileBankLinkComponents/BankDetails";
const Routes = () => {
return (
@@ -80,6 +82,13 @@ const Routes = () => {
+
+
+
+
+
+
+
diff --git a/frontend/src/customer/onboarding/BusinessOption.js b/frontend/src/customer/onboarding/BusinessOption.js
index 0136097..0a9e4e2 100644
--- a/frontend/src/customer/onboarding/BusinessOption.js
+++ b/frontend/src/customer/onboarding/BusinessOption.js
@@ -4,6 +4,7 @@ import Radio from "@mui/material/Radio";
import RadioGroup from "@mui/material/RadioGroup";
import FormControlLabel from "@mui/material/FormControlLabel";
import FormControl from "@mui/material/FormControl";
+import { lime, pink, white } from "@mui/material/colors";
import { useHistory } from "react-router-dom";
const BusinessOption = () => {
@@ -20,27 +21,72 @@ const BusinessOption = () => {
}
+ control={
+
+ }
label="UDYAM"
/>
}
+ control={
+
+ }
label="Shop establishment"
/>
}
+ control={
+
+ }
label="FSSAI"
/>
}
+ control={
+
+ }
label="GST"
/>
}
+ control={
+
+ }
label="Others"
/>
diff --git a/frontend/src/customer/onboarding/Consent.js b/frontend/src/customer/onboarding/Consent.js
index 39b180b..e6804b9 100644
--- a/frontend/src/customer/onboarding/Consent.js
+++ b/frontend/src/customer/onboarding/Consent.js
@@ -1,5 +1,6 @@
import React from "react";
import { Box, Button, Container, Typography } from "@mui/material";
+import { useHistory } from "react-router-dom";
const Item1 = ({ sno, path1, path2, path3, text }) => {
return (
@@ -143,6 +144,7 @@ const Item2 = ({ sno, path1, path2, text }) => {
};
const Consent = () => {
+ const history = useHistory();
return (
<>
@@ -218,6 +220,9 @@ const Consent = () => {
backgroundColor: "#fff",
color: "#7165E3",
}}
+ onClick={() => {
+ history.push("./finish");
+ }}
>
I AGREE
diff --git a/frontend/src/customer/onboarding/MobileBankLink.js b/frontend/src/customer/onboarding/MobileBankLink.js
index 4876e34..eb4bdc4 100644
--- a/frontend/src/customer/onboarding/MobileBankLink.js
+++ b/frontend/src/customer/onboarding/MobileBankLink.js
@@ -49,7 +49,7 @@ const MobileBankLink = () => {
backgroundColor: "#9EA6BE",
}}
onClick={()=>{
- history.push("./bankdetail")
+ history.push("./bankdetailupload")
}}
>
No
diff --git a/frontend/src/customer/onboarding/MobileBankUpload.js b/frontend/src/customer/onboarding/MobileBankUpload.js
index b5c5d84..ac17b18 100644
--- a/frontend/src/customer/onboarding/MobileBankUpload.js
+++ b/frontend/src/customer/onboarding/MobileBankUpload.js
@@ -11,7 +11,6 @@ import {
} from "@mui/material";
import PhoneNumber from "./mobileBankLinkComponents/PhoneNumber";
-import BankData from "./mobileBankLinkComponents/BankData";
const MobileBankUpload = () => {
const [bank, setBank] = useState("");
diff --git a/frontend/src/customer/onboarding/PanProof.js b/frontend/src/customer/onboarding/PanProof.js
index 7405602..3ad79f1 100644
--- a/frontend/src/customer/onboarding/PanProof.js
+++ b/frontend/src/customer/onboarding/PanProof.js
@@ -1,9 +1,7 @@
import React, { useState } from "react";
-import { Container, Box, Typography } from "@mui/material";
-import LinearProgress from "@mui/material/LinearProgress";
+import { Container, Box, Typography, LinearProgress } from "@mui/material";
import PanUpload from "./panProofComponents/PanUpload";
import PanUploaded from "./panProofComponents/PanUploaded";
-import Aadhar from "./panProofComponents/Aadhar";
const LinearProgressWithLabel = (props) => {
return (
@@ -21,7 +19,6 @@ const LinearProgressWithLabel = (props) => {
};
const PanProof = () => {
- const [progress, setProgress] = useState(30);
const [next, setNext] = useState("panUpload");
const handleClick = (component) => {
@@ -47,23 +44,15 @@ const PanProof = () => {
display: "flex",
justifyContent: "center",
alignItems: "center",
+ color: "#fff",
}}
>
1/6
-
+
- {(() => {
- switch (next) {
- case "panUpload":
- return ;
- case "panUploaded":
- return ;
- default:
- return ;
- }
- })()}
+
>
);
diff --git a/frontend/src/customer/onboarding/Summary.js b/frontend/src/customer/onboarding/Summary.js
index 71abcb4..38cac21 100644
--- a/frontend/src/customer/onboarding/Summary.js
+++ b/frontend/src/customer/onboarding/Summary.js
@@ -1,7 +1,9 @@
import React from "react";
import { Box, Button, Container, Stack, Typography } from "@mui/material";
+import { useHistory } from "react-router-dom";
const Summary = () => {
+ const history = useHistory();
const Item = ({ name }) => {
return (
<>
@@ -58,6 +60,9 @@ const Summary = () => {
float: "right",
backgroundColor: "#7165E3",
}}
+ onClick={() => {
+ history.push("./consent");
+ }}
>
Confirm
diff --git a/frontend/src/customer/onboarding/businessProofComponents/FssaiUpload.js b/frontend/src/customer/onboarding/businessProofComponents/FssaiUpload.js
index efffc91..e598f8d 100644
--- a/frontend/src/customer/onboarding/businessProofComponents/FssaiUpload.js
+++ b/frontend/src/customer/onboarding/businessProofComponents/FssaiUpload.js
@@ -142,50 +142,52 @@ const FssaiUpload = () => {
const FssaiUploadedForm = () => {
return (
<>
-
-
+
- FSSAI Certificate
-
-
-
+
+ FSSAI Certificate
+
-
-
-
+ />
+
+
+
+
+
+
@@ -201,8 +203,8 @@ const FssaiUpload = () => {
diff --git a/frontend/src/customer/onboarding/businessProofComponents/ShopEstUpload.js b/frontend/src/customer/onboarding/businessProofComponents/ShopEstUpload.js
index 1cbf623..38775d7 100644
--- a/frontend/src/customer/onboarding/businessProofComponents/ShopEstUpload.js
+++ b/frontend/src/customer/onboarding/businessProofComponents/ShopEstUpload.js
@@ -144,50 +144,52 @@ const ShopEstUpload = () => {
const ShopEstUploadedForm = () => {
return (
<>
-
-
+
- Shop Establishment Certificate
-
-
-
+
+ Shop Establishment Certificate
+
- {
- setSelectedFile("");
+ style={{
+ backgroundColor: "#C4C4C4",
+ width: "102px",
+ height: "102px",
+ objectFit: "cover",
+ borderRadius: "12px",
}}
- >
- Recapture
-
-
-
+ />
+
+
+ {
+ setSelectedFile("");
+ }}
+ >
+ Recapture
+
+
+
+
@@ -204,8 +206,8 @@ const ShopEstUpload = () => {
{
- history.push("./utilitybill")
+ onClick={() => {
+ history.push("./utilitybill");
}}
>
Next
diff --git a/frontend/src/customer/onboarding/businessProofComponents/UdyamUpload.js b/frontend/src/customer/onboarding/businessProofComponents/UdyamUpload.js
index 7eb5d26..235da91 100644
--- a/frontend/src/customer/onboarding/businessProofComponents/UdyamUpload.js
+++ b/frontend/src/customer/onboarding/businessProofComponents/UdyamUpload.js
@@ -137,50 +137,52 @@ const UdyamUpload = () => {
};
return (
<>
-
-
+
- UDYAM Certificate
-
-
-
+
+ UDYAM Certificate
+
- {
- setSelectedFile("");
+ style={{
+ backgroundColor: "#C4C4C4",
+ width: "102px",
+ height: "102px",
+ objectFit: "cover",
+ borderRadius: "12px",
}}
- >
- Recapture
-
-
-
+ />
+
+
+ {
+ setSelectedFile("");
+ }}
+ >
+ Recapture
+
+
+
+
@@ -194,8 +196,8 @@ const UdyamUpload = () => {
{
- history.push("./utilitybill")
+ onClick={() => {
+ history.push("./utilitybill");
}}
>
Next
@@ -224,6 +226,7 @@ const UdyamUpload = () => {
display: "flex",
justifyContent: "center",
alignItems: "center",
+ color: "#fff",
}}
>
3/6
diff --git a/frontend/src/customer/onboarding/mobileBankLinkComponents/BankData.js b/frontend/src/customer/onboarding/mobileBankLinkComponents/BankData.js
index 403f2b0..decfa0a 100644
--- a/frontend/src/customer/onboarding/mobileBankLinkComponents/BankData.js
+++ b/frontend/src/customer/onboarding/mobileBankLinkComponents/BankData.js
@@ -1,12 +1,62 @@
import React, { useState } from "react";
-import { Container, Stack, Box, Typography, Button } from "@mui/material";
+import {
+ Container,
+ Stack,
+ Box,
+ Typography,
+ Button,
+ LinearProgress,
+ TextField,
+} from "@mui/material";
+import { useHistory } from "react-router-dom";
+
+const LinearProgressWithLabel = (props) => {
+ return (
+
+
+
+
+
+ {`${Math.round(
+ props.value
+ )}%`}
+
+
+ );
+};
const BankData = () => {
+ const history = useHistory();
const [verify, setVerify] = useState(false); //for frontend side
const [verified, setVerified] = useState(false); //to set verification from backend
return (
<>
+
+
+
+ 6/6
+
+
+
+
{
>
Bank Account No
- XXXXXXXXXXXXXX
+
{
>
IFSC Code
- SBIN01578
+
{verified ? (
@@ -67,6 +117,9 @@ const BankData = () => {
{
+ history.push("./summary");
+ }}
>
Next
diff --git a/frontend/src/customer/onboarding/mobileBankLinkComponents/BankDetails.js b/frontend/src/customer/onboarding/mobileBankLinkComponents/BankDetails.js
new file mode 100644
index 0000000..ed7b5b0
--- /dev/null
+++ b/frontend/src/customer/onboarding/mobileBankLinkComponents/BankDetails.js
@@ -0,0 +1,171 @@
+import React, { useState } from "react";
+import {
+ Container,
+ Stack,
+ Box,
+ Typography,
+ Button,
+ LinearProgress,
+} from "@mui/material";
+import { useHistory } from "react-router-dom";
+
+const LinearProgressWithLabel = (props) => {
+ return (
+
+
+
+
+
+ {`${Math.round(
+ props.value
+ )}%`}
+
+
+ );
+};
+
+const BankDetails = () => {
+ const history = useHistory();
+ const [verify, setVerify] = useState(false); //for frontend side
+ const [verified, setVerified] = useState(false); //to set verification from backend
+
+ return (
+ <>
+
+
+
+ 3/6
+
+
+
+
+
+
+
+
+ Bank Account No
+
+ XXXXXXXXXXXXXX
+
+
+
+ IFSC Code
+
+ SBIN01578
+
+
+ {verified ? (
+
+
+ Verified !
+
+
+
+
+ Next
+
+
+
+ ) : !verify ? (
+
+ Please confirm your account
+
+ ) : (
+
+ Please wait while we verify your account
+
+ )}
+
+ {verified ? (
+ ""
+ ) : (
+
+ {
+ setVerify(true);
+ history.push("./summary");
+ }}
+ >
+ Confirm
+
+
+ )}
+ >
+ );
+};
+
+export default BankDetails;
diff --git a/frontend/src/customer/onboarding/mobileBankLinkComponents/PhoneNumber.js b/frontend/src/customer/onboarding/mobileBankLinkComponents/PhoneNumber.js
index 3c34892..14a15f8 100644
--- a/frontend/src/customer/onboarding/mobileBankLinkComponents/PhoneNumber.js
+++ b/frontend/src/customer/onboarding/mobileBankLinkComponents/PhoneNumber.js
@@ -1,8 +1,9 @@
import React, { useState } from "react";
import { Container, Typography, Box, TextField, Button } from "@mui/material";
-import { Link } from "react-router-dom";
+import { Link, useHistory } from "react-router-dom";
const PhoneNumber = () => {
+ const history = useHistory();
const [mobileNumber, setMobileNumber] = useState("");
const [otp, setOtp] = useState("");
const [display, setDisplay] = useState(false);
@@ -112,7 +113,14 @@ const PhoneNumber = () => {
{display ? OtpForm() : ""}
-
+ {
+ history.push("./bankdetail");
+ }}
+ >
Next
diff --git a/frontend/src/customer/onboarding/panProofComponents/Aadhar.js b/frontend/src/customer/onboarding/panProofComponents/Aadhar.js
index 0993d0d..8b9ea6b 100644
--- a/frontend/src/customer/onboarding/panProofComponents/Aadhar.js
+++ b/frontend/src/customer/onboarding/panProofComponents/Aadhar.js
@@ -15,6 +15,7 @@ import {
import { ToastContainer, toast } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import SyncLoader from "react-spinners/SyncLoader";
+import { useHistory } from "react-router-dom";
const LinearProgressWithLabel = (props) => {
return (
@@ -32,6 +33,7 @@ const LinearProgressWithLabel = (props) => {
};
const Aadhar = () => {
+ const history = useHistory();
const [page, setPage] = useState(0);
const [display, setDisplay] = useState(0);
const [aadhar, setAadhar] = useState("");
@@ -127,7 +129,7 @@ const Aadhar = () => {
async function onSendAadharOtp() {
try {
setotpLoading(true);
- let res = await sendAadhaarOTP(aadhar, "Aniruddha Shahaji Thorat", "");
+ let res = await sendAadhaarOTP(aadhar, "Sudhanshu Tripathi", "");
setotpLoading(false);
if (res.status) {
setAadharData({ ...aadharData, ...res });
@@ -143,31 +145,6 @@ const Aadhar = () => {
return (
<>
-
-
-
- 2/6
-
-
-
-
{
};
return (
<>
-
+
{
{}}
+ onClick={() => {
+ history.push("./businessoption");
+ }}
>
Next
@@ -305,7 +284,36 @@ const Aadhar = () => {
);
};
- return <>{page ? aadharUploadedForm() : aadharForm()}>;
+ return (
+ <>
+
+
+
+ 2/6
+
+
+
+
+ {page ? aadharUploadedForm() : aadharForm()}
+ >
+ );
};
export default Aadhar;
diff --git a/frontend/src/customer/onboarding/panProofComponents/PanUpload.js b/frontend/src/customer/onboarding/panProofComponents/PanUpload.js
index 0f78e29..b50fff1 100644
--- a/frontend/src/customer/onboarding/panProofComponents/PanUpload.js
+++ b/frontend/src/customer/onboarding/panProofComponents/PanUpload.js
@@ -1,8 +1,13 @@
import { useRef, useState } from "react";
import { Box, Typography, Button, Container } from "@mui/material";
import { getOCRFetch } from '../../../services/serviceHelper';
+import { useHistory } from "react-router-dom";
+
+const PanUpload = () => {
+
+ const history = useHistory();
+ const [panData, setPanData] = useState({});
-const PanUpload = ({ handleClick }) => {
const [selectedFile, setSelectedFile] = useState();
// Reference to the hidden file input element
const hiddenFileInput = useRef(null);
@@ -13,10 +18,16 @@ const PanUpload = ({ handleClick }) => {
// Handle file selection
const handleChange = async (event) => {
- setSelectedFile(event.target.files[0]);
- const res = await getOCRFetch(selectedFile, '');
- console.log(res);
+ let url = event.target.files[0]
+ setSelectedFile(url);
+ const res = await getOCRFetch(url, '');
+ setPanData(({...panData,...res}));
+ };
+
+ const handleNext = async (event) => {
+ // Redirect to Verification page
+ history.push({ pathname: './PanUploaded', state: { 'data': panData } });
};
return (
@@ -63,7 +74,7 @@ const PanUpload = ({ handleClick }) => {
{ handleClick("panUploaded") }}
+ onClick={handleNext}
>
Next
@@ -72,4 +83,4 @@ const PanUpload = ({ handleClick }) => {
);
};
-export default PanUpload;
+export default PanUpload;
\ No newline at end of file
diff --git a/frontend/src/customer/onboarding/panProofComponents/PanUploaded.js b/frontend/src/customer/onboarding/panProofComponents/PanUploaded.js
index abc9d78..3491b5a 100644
--- a/frontend/src/customer/onboarding/panProofComponents/PanUploaded.js
+++ b/frontend/src/customer/onboarding/panProofComponents/PanUploaded.js
@@ -1,49 +1,108 @@
-import React from "react";
-import { Box, Typography, Button, Container, Stack } from "@mui/material";
-import { useHistory } from "react-router-dom";
+import React, { useEffect } from "react";
+import {
+ Box,
+ Typography,
+ Button,
+ Container,
+ Stack,
+ LinearProgress,
+} from "@mui/material";
+import { useHistory, useLocation } from "react-router-dom";
+
+const LinearProgressWithLabel = (props) => {
+ return (
+
+
+
+
+
+ {`${Math.round(
+ props.value
+ )}%`}
+
+
+ );
+};
const PanUploaded = () => {
const history = useHistory();
+ const location = useLocation();
+ const panDetails = location?.state?.data ?? "";
+ let fullName = panDetails.data.result[0].details.name["value"];
+ const nameArray = fullName.split(" ");
+
+ // useEffect(() => {
+ // console.log(panDetails);
+ // }, []);
+
return (
<>
-
-
+
- PAN Card
-
-
+ 1/6
+
+
+
+
+
+
-
+ >
+
+ PAN Card
+
-
- Recapture
-
-
-
+
+
+
+ Recapture
+
+
+
+
+
{
}}
>
PAN No
- ABCDE1234Z
+
+ {panDetails.data.result[0].details.panNo["value"]}
+
{
}}
>
First Name
- Test
+ {nameArray[0]}
{
}}
>
Last Name
- Test
+
+ {nameArray[nameArray.length - 1]}
+
{
}}
>
DOB
- 00/00/0000
+
+ {panDetails.data.result[0].details.date["value"]}
+
{
}}
>
Father’s Name
- Test
+
+ {panDetails.data.result[0].details.father["value"]}
+