This commit is contained in:
2025-10-09 15:17:20 +05:30
17 changed files with 326 additions and 139 deletions

View File

@@ -249,7 +249,7 @@ export default function QuickPay() {
toAccount: beneficiaryAcc,
toAccountType: beneficiaryType,
amount: amount,
narration: remarks,
remarks: remarks,
tpassword: txnPassword,
}),
});

View File

@@ -1,14 +1,15 @@
"use client";
import React, { useEffect, useRef, useState } from "react";
import { Button, Center, Group, Modal, Paper, Radio, ScrollArea, Select, Stack, Text, TextInput, Title, Box, PasswordInput } from "@mantine/core";
import React, { useEffect, useState } from "react";
import { Button, Group, Modal, Paper, Radio, Select, Stack, Text, TextInput, Title, PasswordInput } from "@mantine/core";
import { notifications } from "@mantine/notifications";
import { useRouter } from "next/navigation";
import { generateOTP } from '@/app/OTPGenerator';
import SendToBeneficiaryOthers from "./sendBeneficiaryOthers";
import Image from "next/image";
import img from '@/app/image/logo1.jpg';
import { IconRefresh } from "@tabler/icons-react";
import { sendOtp, verifyOtp } from '@/app/_util/otp';
interface accountData {
stAccountNo: string;
@@ -36,25 +37,48 @@ export default function SendToBeneficiaryOwn() {
const [isSubmitting, setIsSubmitting] = useState(false);
const [showOtpField, setShowOtpField] = useState(false);
const [otp, setOtp] = useState("");
const [generateOtp, setGenerateOtp] = useState("");
const [countdown, setCountdown] = useState(180);
const [timerActive, setTimerActive] = useState(false);
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 {
await sendOtp({ type: 'IMPS' });
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 selectedAccount = accountData.find((acc) => acc.stAccountNo === selectedAccNo);
const accountOptions = accountData.map((acc) => ({
value: acc.stAccountNo,
label: `${acc.stAccountNo} (${acc.stAccountType})`,
}));
const FetchBeneficiaryDetails = async () => {
try {
const token = localStorage.getItem("access_token");
@@ -66,7 +90,7 @@ export default function SendToBeneficiaryOwn() {
},
});
const data = await response.json();
console.log(data);
// console.log(data);
if (response.ok && Array.isArray(data)) {
setBeneficiaryData(data);
} else {
@@ -195,21 +219,27 @@ export default function SendToBeneficiaryOwn() {
setIsVisibilityLocked(true);
return;
}
if (showOtpField && !showTxnPassword) {
if (!otp) {
notifications.show({
title: "Error",
message: "Please enter the OTP",
color: "red",
});
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",
});
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;
}
@@ -241,7 +271,7 @@ export default function SendToBeneficiaryOwn() {
toAccount: beneficiaryAcc,
toAccountType: beneficiaryType,
amount: amount,
narration: remarks,
remarks: remarks,
tpassword: txnPassword,
}),
});
@@ -325,7 +355,7 @@ export default function SendToBeneficiaryOwn() {
color="blue"
onClick={async () => {
setConfirmModel(false);
const otp = await handleGenerateOtp();
const otp = await handleSendOtp();
setShowOtpField(true);
notifications.show({
title: "OTP Sent",
@@ -459,7 +489,7 @@ export default function SendToBeneficiaryOwn() {
<IconRefresh
size={22}
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
onClick={handleGenerateOtp}
onClick={handleSendOtp}
/>
)
)}

View File

@@ -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}
/>
)
)}