feat: make e-mandate screen responsive.

This commit is contained in:
2025-09-25 15:27:16 +05:30
parent 6beed098c2
commit 649fc5acea
3 changed files with 320 additions and 52 deletions

View File

@@ -183,7 +183,7 @@ export default function MandatePage() {
"Content-Type": "application/json",
},
body: JSON.stringify({
mobileNumber: '7890544527',
mobileNumber: localStorage.getItem("userMobNo"),
type: 'EMandate'
}),
});
@@ -213,20 +213,52 @@ export default function MandatePage() {
}
};
// Resend OTP
const handleResendOtp = async () => {
try {
const response = await fetch("/api/otp/send", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
mobileNumber: localStorage.getItem("userMobNo"),
type: "EMandate",
}),
});
if (!response.ok) throw new Error("Failed to resend OTP");
notifications.show({
withBorder: true,
color: "blue",
title: "OTP Resent",
message: "A new OTP has been sent to your registered mobile number.",
autoClose: 4000,
});
} catch {
notifications.show({
withBorder: true,
color: "red",
title: "Error",
message: "Failed to resend OTP. Please try again.",
autoClose: 5000,
});
}
};
// STEP 2: Verify OTP and complete action
const handleOtpSubmit = async () => {
// if (!otp) {
// notifications.show({
// withBorder: true,
// color: "red",
// title: "Invalid Input",
// message: "Please enter OTP before proceed",
// autoClose: 5000,
// });
// }
if (!otp) {
notifications.show({
withBorder: true,
color: "red",
title: "Invalid Input",
message: "Please enter OTP before proceed",
autoClose: 5000,
});
}
if (!pendingAction) return;
try {
const response = await fetch(`/api/otp/verify?mobileNumber=${7890544527}`, {
const response = await fetch(`/api/otp/verify?mobileNumber=${localStorage.getItem("userMobNo")}`, {
method: "POST",
headers: {
"Content-Type": "application/json",
@@ -400,8 +432,8 @@ export default function MandatePage() {
</Box>
{/* OTP MODAL */}
<Modal opened={otpModalOpen} onClose={() => setOtpModalOpen(false)} title="Enter OTP" centered>
<Text mb="sm">An OTP has been sent to your registered mobile number.</Text>
<Modal opened={otpModalOpen} onClose={() => setOtpModalOpen(false)} title="OTP Verification" centered>
<Text mb="sm" size="sm" ta="center" c="green">An OTP has been sent to your registered mobile number.</Text>
<TextInput
label="OTP"
placeholder="Enter OTP"
@@ -413,7 +445,19 @@ export default function MandatePage() {
}}
/>
<Text size="xs">if you did not received the OTP in SMS,you can click click here to resend the SMS</Text>
<Text mt="md" size="xs" c="dimmed">
If you did not receive the OTP in SMS, you can{" "}
<Text
span
c="blue"
td="underline"
style={{ cursor: "pointer" }}
onClick={handleResendOtp}
>
click here to resend the SMS
</Text>
.
</Text>
<Group mt="md" grow>
<Button color="gray" onClick={() => setOtpModalOpen(false)}>
Cancel