This commit is contained in:
omkieit 2024-09-07 16:56:52 +05:30
parent 18d967f528
commit d040974f3f
5 changed files with 115 additions and 57 deletions

View File

@ -8,7 +8,7 @@ const secret = process.env.SECRET_KEY;
// This is signup // This is signup
export const signup = async (req, res) => { export const signup = async (req, res) => {
const { title, email, password, firstName, middleName, lastName, termsconditions } = req.body; const { title, email, password, firstName, middleName, lastName, termsconditions, userType } = req.body;
try { try {
// Check if user already exists // Check if user already exists
@ -29,6 +29,7 @@ export const signup = async (req, res) => {
middleName, middleName,
lastName, lastName,
termsconditions, termsconditions,
userType,
}); });
// Generate JWT (if needed) // Generate JWT (if needed)

View File

@ -8,6 +8,7 @@ const userSchema = new mongoose.Schema({
email: { type: String, required: true, unique: true }, email: { type: String, required: true, unique: true },
password: { type: String, required: true }, password: { type: String, required: true },
termsconditions:{type: String,}, termsconditions:{type: String,},
userType:{ type: String, required: true },
tokens:[ tokens:[
{ {
token:{ token:{

File diff suppressed because one or more lines are too long

View File

@ -27,7 +27,7 @@
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css"> <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
<!-- fonts --> <!-- fonts -->
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;800&family=Sen:wght@400;700;800&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;800&family=Sen:wght@400;700;800&display=swap" rel="stylesheet">
<script type="module" crossorigin src="/assets/index-BVbzGpWG.js"></script> <script type="module" crossorigin src="/assets/index-rSI24A6Q.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-CyAHZLBw.css"> <link rel="stylesheet" crossorigin href="/assets/index-CyAHZLBw.css">
</head> </head>

View File

@ -12,35 +12,42 @@ import "primeicons/primeicons.css";
const initialState = { const initialState = {
title: "None", title: "None",
firstName: "", firstName: "",
middleName:"", middleName: "",
lastName: "", lastName: "",
email: "", email: "",
password: "", password: "",
confirmPassword: "", confirmPassword: "",
termsconditions: "", termsconditions: "",
userType: "", // New field for radio button selection
}; };
const Register = () => { const Register = () => {
const [formValue, setFormValue] = useState(initialState); const [formValue, setFormValue] = useState(initialState);
const [isFormValid, setIsFormValid] = useState(false); // New state variable const [isFormValid, setIsFormValid] = useState(false); // New state variable
const { loading, error } = useSelector((state) => ({ ...state.auth })); const { loading, error } = useSelector((state) => ({ ...state.auth }));
const { title, email, password, firstName, middleName, lastName, confirmPassword,termsconditions } = formValue; const { title, email, password, firstName, middleName, lastName, confirmPassword, termsconditions, userType } = formValue; // include userType
const dispatch = useDispatch(); const dispatch = useDispatch();
const navigate = useNavigate(); const navigate = useNavigate();
useEffect(() => { useEffect(() => {
error && toast.error(error); error && toast.error(error);
}, [error]); }, [error]);
useEffect(() => { useEffect(() => {
// Check if all fields are filled and all three checkboxes are selected // Check if all fields are filled and radio button is selected
const isValid = const isValid =
title !== "None" && email && password && firstName && middleName && lastName && confirmPassword && termsconditions; title !== "None" &&
email &&
password &&
firstName &&
middleName &&
lastName &&
confirmPassword &&
termsconditions &&
userType !== ""; // Validate userType selection
setIsFormValid(isValid); setIsFormValid(isValid);
}, [title, email, password, firstName, middleName, lastName, confirmPassword, termsconditions]); }, [title, email, password, firstName, middleName, lastName, confirmPassword, termsconditions, userType]);
const handleSubmit = (e) => { const handleSubmit = (e) => {
e.preventDefault(); e.preventDefault();
@ -78,6 +85,14 @@ const Register = () => {
} }
}; };
// New handler for radio buttons
const handleUserTypeChange = (e) => {
setFormValue((prevData) => ({
...prevData,
userType: e.target.value,
}));
};
return ( return (
<> <>
<Navbar /> <Navbar />
@ -92,14 +107,15 @@ const Register = () => {
> >
<div className="container-fluid px-0"> <div className="container-fluid px-0">
<div className="row gy-4 align-items-center justify-content-center"> <div className="row gy-4 align-items-center justify-content-center">
<div className="col-12 col-md-6 col-xl-20 text-center text-md-start">
{/* <span className="pi pi-dollar" style={{ fontSize: '5rem', color:"#fda417" }} /> */}
<i <div className="col-12 col-md-0 col-xl-20 text-center text-md-start">
{/* <i
className="fa fa-dollar" className="fa fa-dollar"
style={{ fontSize: "2.5rem", color: "#fda417" }} style={{ fontSize: "2.5rem", color: "#fda417" }}
aria-hidden="true" aria-hidden="true"
/> /> */}
<div className="text-bg-primary"> {/* <div className="text-bg-primary">
<div className="px-4"> <div className="px-4">
<hr className="border-primary-subtle mb-4" /> <hr className="border-primary-subtle mb-4" />
<h2 className="h1 mb-4">Empower your investors</h2> <h2 className="h1 mb-4">Empower your investors</h2>
@ -120,8 +136,10 @@ const Register = () => {
</svg> </svg>
</div> </div>
</div> </div>
</div> </div> */}
</div> </div>
<div className="col-12 col-md-6 col-xl-5"> <div className="col-12 col-md-6 col-xl-5">
<div <div
className="card border-0 rounded-4 shadow-lg" className="card border-0 rounded-4 shadow-lg"
@ -132,8 +150,8 @@ const Register = () => {
<div className="col-12"> <div className="col-12">
<div className="mb-4"> <div className="mb-4">
<h2 className="h3">Registration</h2> <h2 className="h3">Registration</h2>
<h3 className="fs-6 fw-normal text-secondary m-0"> <h3 style={{ color: "red" }}>
Enter your details to register All fields are mandatory to enable "Sign up"
</h3> </h3>
</div> </div>
</div> </div>
@ -142,28 +160,67 @@ const Register = () => {
<div className="row gy-3 overflow-hidden"> <div className="row gy-3 overflow-hidden">
<div className="col-12"> {/* Radio buttons for Lender and Borrower */}
<select <div className="col-12">
className="form-floating mb-3 form-control"
aria-label="Default select example" <div className="form-floating mb-3">
name="title" <label className="form-label">Please select the role <br /><br /></label>
value={title} <div className="form-check form-check-inline">
onChange={onInputChange}
>
<option value="None">Please Select Title</option> <input
<option value="Dr">Dr</option> className="form-check-input"
<option value="Prof">Prof</option> type="radio"
<option value="Mr">Mr</option> name="userType"
<option value="Miss">Miss</option> value="Lender"
</select> checked={userType === "Lender"}
<label htmlFor="firstName" className="form-label"> onChange={handleUserTypeChange}
required
/>
<label className="form-check-label">Lender</label>
</div>
<div className="form-check form-check-inline">
<input
className="form-check-input"
type="radio"
name="userType"
value="Borrower"
checked={userType === "Borrower"}
onChange={handleUserTypeChange}
required
/>
<label className="form-check-label">Borrower </label>
<br /><br /><br />
</div>
</div>
</div>
<div className="col-12">
<select
className="form-floating mb-3 form-control"
aria-label="Default select example"
name="title"
value={title}
onChange={onInputChange}
>
<option value="None">Please Select Title</option>
<option value="Dr">Dr</option>
<option value="Prof">Prof</option>
<option value="Mr">Mr</option>
<option value="Miss">Miss</option>
</select>
{/* <label htmlFor="Select" className="form-label">
{title === "Select" ? ( {title === "Select" ? (
<span>You selected {title}</span> <span>You selected {title}</span>
) : ( ) : (
`You selected ${title}` `You selected ${title}`
)} )}
</label> </label> */}
</div> <br />
</div>
<div className="col-12"> <div className="col-12">
<div className="form-floating mb-3"> <div className="form-floating mb-3">
@ -201,8 +258,6 @@ const Register = () => {
</div> </div>
</div> </div>
<div className="col-12"> <div className="col-12">
<div className="form-floating mb-3"> <div className="form-floating mb-3">
<input <input
@ -274,13 +329,13 @@ const Register = () => {
<div className="col-12"> <div className="col-12">
<div className="form-check"> <div className="form-check">
<input <input
className="form-check-input" className="form-check-input"
type="checkbox" type="checkbox"
id="termsconditions" id="termsconditions"
value={termsconditions} value={termsconditions}
name="termsconditions" name="termsconditions"
checked={termsconditions} checked={termsconditions}
onChange={onInputChange} onChange={onInputChange}
required required
/> />
<label <label
@ -298,7 +353,6 @@ const Register = () => {
</div> </div>
</div> </div>
<div className="col-12"> <div className="col-12">
<div className="d-grid"> <div className="d-grid">
<button <button
@ -308,10 +362,12 @@ const Register = () => {
backgroundColor: "#fda417", backgroundColor: "#fda417",
border: "#fda417", border: "#fda417",
}} }}
disabled={!isFormValid || loading}
> >
{loading && <LoadingIcons.Bars />} {loading && <LoadingIcons.Bars />}
Sign up Sign up
</button> </button>
</div> </div>
</div> </div>
</div> </div>