This commit is contained in:
2025-09-02 16:34:32 +05:30
4 changed files with 139 additions and 5 deletions

View File

@@ -7,6 +7,8 @@ import { useRouter } from "next/navigation";
import { generateOTP } from '@/app/OTPGenerator'; import { generateOTP } from '@/app/OTPGenerator';
import OutsideQuickPay from "./outside_quick_pay"; import OutsideQuickPay from "./outside_quick_pay";
import { IconRefresh } from "@tabler/icons-react"; import { IconRefresh } from "@tabler/icons-react";
import Image from "next/image";
import img from '@/app/image/logo1.jpg'
interface accountData { interface accountData {
stAccountNo: string; stAccountNo: string;
@@ -305,6 +307,17 @@ export default function QuickPay() {
centered centered
> >
<Stack> <Stack>
<Image
src={img}
alt="KCC Bank Logo"
width={70}
height={70}
style={{
//border: "2px solid black",
marginTop: "-5px",
marginRight: "10px",
}}
/>
<Title order={4}>Confirm Transaction</Title> <Title order={4}>Confirm Transaction</Title>
<Text><strong>Debit Account:</strong> {selectedAccNo}</Text> <Text><strong>Debit Account:</strong> {selectedAccNo}</Text>
<Text><strong>Payee Account:</strong> {beneficiaryAcc}</Text> <Text><strong>Payee Account:</strong> {beneficiaryAcc}</Text>

View File

@@ -1,12 +1,13 @@
"use client"; "use client";
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { Button, Group, Modal, Paper, Radio, ScrollArea, Select, Stack, Text, TextInput, Title } from "@mantine/core"; import { Button, Center, Group, Modal, Paper, Radio, ScrollArea, Select, Stack, Text, TextInput, Title, Box } from "@mantine/core";
import { notifications } from "@mantine/notifications"; import { notifications } from "@mantine/notifications";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { generateOTP } from '@/app/OTPGenerator'; import { generateOTP } from '@/app/OTPGenerator';
import SendToBeneficiaryOthers from "./sendBeneficiaryOthers"; import SendToBeneficiaryOthers from "./sendBeneficiaryOthers";
import Image from "next/image";
import img from '@/app/image/logo1.jpg';
interface accountData { interface accountData {
stAccountNo: string; stAccountNo: string;
@@ -271,8 +272,23 @@ export default function SendToBeneficiaryOwn() {
onClose={() => setConfirmModel(false)} onClose={() => setConfirmModel(false)}
// title="Confirm Transaction" // title="Confirm Transaction"
centered centered
> >
<Stack> <Stack >
{/* <Center> */}
<Image
src={img}
alt="KCC Bank Logo"
width={70}
height={70}
style={{
//border: "2px solid black",
marginTop: "-5px",
marginRight: "10px",
}}
/>
{/* </Center> */}
<Title order={4}>Confirm Transaction</Title> <Title order={4}>Confirm Transaction</Title>
<Text><strong>Debit Account:</strong> {selectedAccNo}</Text> <Text><strong>Debit Account:</strong> {selectedAccNo}</Text>
<Text><strong>Beneficiary Account:</strong> {beneficiaryAcc}</Text> <Text><strong>Beneficiary Account:</strong> {beneficiaryAcc}</Text>
@@ -301,6 +317,9 @@ export default function SendToBeneficiaryOwn() {
</Button> </Button>
</Group> </Group>
</Modal> </Modal>
{/* main content */} {/* main content */}
<Paper shadow="sm" radius="md" p="md" withBorder h={400}> <Paper shadow="sm" radius="md" p="md" withBorder h={400}>
<Title order={3} mb="md"> <Title order={3} mb="md">

View File

@@ -1,11 +1,14 @@
"use client"; "use client";
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { Button, Divider, Group, List, Modal, Paper, Radio, ScrollArea, Select, Stack, Text, TextInput, ThemeIcon, Title } from "@mantine/core"; import { Button, Center, Divider, Group, List, Modal, Paper, Radio, ScrollArea, Select, Stack, Text, TextInput, ThemeIcon, Title } from "@mantine/core";
import { notifications } from "@mantine/notifications"; import { notifications } from "@mantine/notifications";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { generateOTP } from '@/app/OTPGenerator'; import { generateOTP } from '@/app/OTPGenerator';
import { IconAlertTriangle } from "@tabler/icons-react"; import { IconAlertTriangle } from "@tabler/icons-react";
import Image from "next/image";
import img from '@/app/image/logo1.jpg'
interface accountData { interface accountData {
stAccountNo: string; stAccountNo: string;
@@ -298,7 +301,7 @@ export default function SendToBeneficiaryOthers() {
return ( return (
<> <>
<Modal {/* <Modal
opened={showIntroModal} opened={showIntroModal}
onClose={() => setShowIntroModal(false)} onClose={() => setShowIntroModal(false)}
centered centered
@@ -343,6 +346,88 @@ export default function SendToBeneficiaryOthers() {
<Text size="xs" c="blue"> <Text size="xs" c="blue">
• Available Transfer Amount on this Day is Rs. 500000.00 • Available Transfer Amount on this Day is Rs. 500000.00
</Text> </Text>
<Group justify="flex-end" mt="md">
<Button color="blue" onClick={() => setShowIntroModal(false)}>
Okay
</Button>
</Group>
</Stack>
</Modal> */}
<Modal
opened={showIntroModal}
onClose={() => setShowIntroModal(false)}
centered
withCloseButton={false} // force them to press OK
>
<Stack gap={1}>
<Center>
<Image
src={img}
alt="KCC Bank Logo"
width={100}
height={100}
style={{ border: "2px solid black" }}
/>
</Center>
<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"> <Group justify="flex-end" mt="md">
<Button color="blue" onClick={() => setShowIntroModal(false)}> <Button color="blue" onClick={() => setShowIntroModal(false)}>
Okay Okay
@@ -350,6 +435,10 @@ export default function SendToBeneficiaryOthers() {
</Group> </Group>
</Stack> </Stack>
</Modal> </Modal>
<Modal <Modal
opened={showConfirmModel} opened={showConfirmModel}
onClose={() => setConfirmModel(false)} onClose={() => setConfirmModel(false)}
@@ -357,6 +446,17 @@ export default function SendToBeneficiaryOthers() {
centered centered
> >
<Stack> <Stack>
<Image
src={img}
alt="KCC Bank Logo"
width={70}
height={70}
style={{
//border: "2px solid black",
marginTop: "-5px",
marginRight: "10px",
}}
/>
<Title order={4}>Confirm Transaction</Title> <Title order={4}>Confirm Transaction</Title>
<Text><strong>Debit Account:</strong> {selectedAccNo}</Text> <Text><strong>Debit Account:</strong> {selectedAccNo}</Text>
<Text><strong>Beneficiary Account:</strong> {beneficiaryAcc}</Text> <Text><strong>Beneficiary Account:</strong> {beneficiaryAcc}</Text>

View File

@@ -18,6 +18,7 @@ export default function ChangePassword() {
const [generatedOtp, setGeneratedOtp] = useState(''); const [generatedOtp, setGeneratedOtp] = useState('');
const [otpValidated, setOtpValidated] = useState(false); const [otpValidated, setOtpValidated] = useState(false);
const [step, setStep] = useState<"form" | "otp" | "final">("form"); const [step, setStep] = useState<"form" | "otp" | "final">("form");
const [passwordHistory] = useState(["Pass@1234", "OldPass@123", "MyPass#2023"]);
const icon = <IconLock size={18} stroke={1.5} />; const icon = <IconLock size={18} stroke={1.5} />;
const handleGenerateOtp = async () => { const handleGenerateOtp = async () => {
@@ -176,6 +177,7 @@ export default function ChangePassword() {
return ( return (
<Paper shadow="sm" radius="md" p="md" withBorder h={400}> <Paper shadow="sm" radius="md" p="md" withBorder h={400}>
<Title order={3} style={{ color: "red" }}>More Updates comming soon .....</Title>
<Title order={3} mb="sm"> <Title order={3} mb="sm">
Change Login Password Change Login Password
</Title> </Title>