feat : In home page "get statement" worked.
feat : After 5 minutes session timeout automatically. feat: realtime otp feature up
This commit is contained in:
@@ -4,10 +4,10 @@ import React, { useEffect, useRef, useState } from "react";
|
||||
import { Button, Center, Divider, Group, List, Modal, Paper, PasswordInput, Radio, ScrollArea, Select, Stack, Text, TextInput, ThemeIcon, Title } from "@mantine/core";
|
||||
import { notifications } from "@mantine/notifications";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { generateOTP } from '@/app/OTPGenerator';
|
||||
import { IconAlertTriangle, IconRefresh } from "@tabler/icons-react";
|
||||
import Image from "next/image";
|
||||
import img from '@/app/image/logo1.jpg'
|
||||
import { sendOtp, verifyOtp } from "@/app/_util/otp";
|
||||
|
||||
|
||||
interface accountData {
|
||||
@@ -38,16 +38,57 @@ export default function SendToBeneficiaryOthers() {
|
||||
const [otp, setOtp] = useState("");
|
||||
const [countdown, setCountdown] = useState(180);
|
||||
const [timerActive, setTimerActive] = useState(false);
|
||||
const [generateOtp, setGenerateOtp] = useState("");
|
||||
|
||||
async function handleGenerateOtp() {
|
||||
// const value = await generateOTP(6);
|
||||
const value = "123456";
|
||||
setGenerateOtp(value);
|
||||
setCountdown(180);
|
||||
setTimerActive(true);
|
||||
return value;
|
||||
async function handleSendOtp() {
|
||||
const mobileNumber = localStorage.getItem('remitter_mobile_no');
|
||||
if (!mobileNumber) {
|
||||
notifications.show({
|
||||
title: 'Error',
|
||||
message: 'Mobile number not found.Contact to administrator',
|
||||
color: 'red',
|
||||
});
|
||||
return;
|
||||
}
|
||||
try {
|
||||
if (paymentMode === "IMPS") { await sendOtp({ type: 'IMPS' }); }
|
||||
if (paymentMode === "RTGS") {
|
||||
await sendOtp(
|
||||
{
|
||||
type: 'RTGS',
|
||||
amount: amount ? Number(amount) : undefined,
|
||||
beneficiary: beneficiaryName || undefined
|
||||
});
|
||||
}
|
||||
if (paymentMode === "NEFT") {
|
||||
await sendOtp(
|
||||
{
|
||||
type: 'NEFT',
|
||||
amount: amount ? Number(amount) : undefined,
|
||||
beneficiary: beneficiaryName || undefined
|
||||
});
|
||||
}
|
||||
setShowOtpField(true);
|
||||
setCountdown(180);
|
||||
setTimerActive(true);
|
||||
} catch (err: any) {
|
||||
console.error('Send OTP failed', err);
|
||||
notifications.show({
|
||||
title: 'Error',
|
||||
message: err.message || 'Send OTP failed.Please try again later.',
|
||||
color: 'red',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function handleVerifyOtp() {
|
||||
try {
|
||||
await verifyOtp(otp);
|
||||
return true;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
const getAmountError = () => {
|
||||
if (!amount || !selectedAccount) return null;
|
||||
const amt = Number(amount);
|
||||
@@ -78,7 +119,7 @@ export default function SendToBeneficiaryOthers() {
|
||||
},
|
||||
});
|
||||
const data = await response.json();
|
||||
console.log(data);
|
||||
// console.log(data);
|
||||
if (response.ok && Array.isArray(data)) {
|
||||
setBeneficiaryData(data);
|
||||
} else {
|
||||
@@ -216,20 +257,43 @@ export default function SendToBeneficiaryOthers() {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!otp) {
|
||||
notifications.show({
|
||||
title: "Enter OTP",
|
||||
message: "Please enter the OTP",
|
||||
color: "red",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (otp !== generateOtp) {
|
||||
notifications.show({
|
||||
title: "Invalid OTP",
|
||||
message: "The OTP entered does not match",
|
||||
color: "red",
|
||||
});
|
||||
// if (!otp) {
|
||||
// notifications.show({
|
||||
// title: "Enter OTP",
|
||||
// message: "Please enter the OTP",
|
||||
// color: "red",
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
// if (otp !== generateOtp) {
|
||||
// notifications.show({
|
||||
// title: "Invalid OTP",
|
||||
// message: "The OTP entered does not match",
|
||||
// color: "red",
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
if (showOtpField && !showTxnPassword) {
|
||||
if (!otp) {
|
||||
notifications.show({
|
||||
title: "Error",
|
||||
message: "Please enter the OTP",
|
||||
color: "red",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const verified = await handleVerifyOtp();
|
||||
if (!verified) {
|
||||
notifications.show({
|
||||
title: "Invalid OTP",
|
||||
message: "The OTP entered does not match",
|
||||
color: "red",
|
||||
});
|
||||
return;
|
||||
}
|
||||
// If OTP verified successfully → show transaction password field
|
||||
setShowTxnPassword(true);
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -271,7 +335,8 @@ export default function SendToBeneficiaryOthers() {
|
||||
amount: amount,
|
||||
beneficiaryName: beneficiaryName,
|
||||
remitterName: remitter_name,
|
||||
tpassword: txnPassword
|
||||
tpassword: txnPassword,
|
||||
remarks: remarks
|
||||
}),
|
||||
});
|
||||
const result = await res.json();
|
||||
@@ -321,59 +386,6 @@ export default function SendToBeneficiaryOthers() {
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* <Modal
|
||||
opened={showIntroModal}
|
||||
onClose={() => setShowIntroModal(false)}
|
||||
centered
|
||||
withCloseButton={false} // force them to press OK
|
||||
>
|
||||
<Stack gap={1}>
|
||||
<Title order={4} style={{ textAlign: "center" }}>Important Note</Title>
|
||||
<Text size="sm">• <strong>IMPS</strong> is available 24X7. Limit: up to ₹5,00,000. Money is transfer instantly.</Text>
|
||||
<Text size="sm">• <strong>NEFT</strong> is available 24x7. Can be used for any amount but not instant.</Text>
|
||||
<Text size="sm">• <strong>RTGS</strong> is for ₹2,00,000 and above. Available during banking hours.As per directions of RBI, RTGS transactions are subjected to the following{" "}
|
||||
<strong>Time Varying Tariff</strong> in addition to the existing <strong>RTGS</strong>
|
||||
Commission. The tariff will be calculated based on the time of completion
|
||||
of transaction.</Text>
|
||||
<List
|
||||
spacing="xs"
|
||||
size="sm"
|
||||
icon={
|
||||
<ThemeIcon color="red" size={20} radius="xl">
|
||||
<IconAlertTriangle size={14} />
|
||||
</ThemeIcon>
|
||||
}
|
||||
>
|
||||
<List.Item>
|
||||
From <strong>09:00 hrs</strong> to <strong>12:00 hrs</strong> →{" "}
|
||||
<strong>₹0.00</strong>
|
||||
</List.Item>
|
||||
<List.Item>
|
||||
After <strong>12:00 hrs</strong> up to <strong>15:30 hrs</strong> →{" "}
|
||||
<strong>₹1.00</strong>
|
||||
</List.Item>
|
||||
<List.Item>
|
||||
After <strong>15:30 hrs</strong> → <strong>₹5.00</strong>
|
||||
</List.Item>
|
||||
</List>
|
||||
<Divider my="sm" variant="dashed" />
|
||||
<Text size="xs" c="blue">
|
||||
• Minimum Transfer Amount on this Day is Rs. 1.00
|
||||
</Text>
|
||||
<Text size="xs" c="blue">
|
||||
• Maximum Transfer Limit per Day is Rs. 500000.00
|
||||
</Text>
|
||||
<Text size="xs" c="blue">
|
||||
• Available Transfer Amount on this Day is Rs. 500000.00
|
||||
</Text>
|
||||
<Group justify="flex-end" mt="md">
|
||||
<Button color="blue" onClick={() => setShowIntroModal(false)}>
|
||||
Okay
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Modal> */}
|
||||
|
||||
<Modal
|
||||
opened={showIntroModal}
|
||||
onClose={() => setShowIntroModal(false)}
|
||||
@@ -456,9 +468,6 @@ export default function SendToBeneficiaryOthers() {
|
||||
</Stack>
|
||||
</Modal>
|
||||
|
||||
|
||||
|
||||
|
||||
<Modal
|
||||
opened={showConfirmModel}
|
||||
onClose={() => setConfirmModel(false)}
|
||||
@@ -491,7 +500,7 @@ export default function SendToBeneficiaryOthers() {
|
||||
color="blue"
|
||||
onClick={async () => {
|
||||
setConfirmModel(false);
|
||||
const otp = await handleGenerateOtp();
|
||||
const otp = await handleSendOtp();
|
||||
setShowOtpField(true);
|
||||
notifications.show({
|
||||
title: "OTP Sent",
|
||||
@@ -505,6 +514,7 @@ export default function SendToBeneficiaryOthers() {
|
||||
</Button>
|
||||
</Group>
|
||||
</Modal>
|
||||
|
||||
{/* main content */}
|
||||
{!showIntroModal && (
|
||||
<div style={{ maxHeight: "290px", overflowY: "auto" }}>
|
||||
@@ -625,7 +635,7 @@ export default function SendToBeneficiaryOthers() {
|
||||
<IconRefresh
|
||||
size={22}
|
||||
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
|
||||
onClick={handleGenerateOtp}
|
||||
onClick={handleSendOtp}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user