tomosa.sarkar/IB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: Home design

Browse Source
This commit is contained in:
Tomosa Sarkar
2025-07-10 14:57:42 +05:30
parent e3391315dd
commit df3fa3532f
4 changed files with 240 additions and 203 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
instruction.txt
View File

@@ -4,9 +4,11 @@
aws ssm start-session --target i-0c850dcf8b85b1447 --document-name --profile kccb AWS-StartPortForwardingSession --parameters "portNumber"=["8080"],"localPortNumber"=["8080"]
- run the api in localhost
- run the api in localhost then port forward to Postgres
aws ssm start-session --target i-0c850dcf8b85b1447 --document-name --profile kccb AWS-StartPortForwardingSession --parameters "portNumber"=["5432"],"localPortNumber"=["5431"]
- For CBS port forward
aws ssm start-session --target i-0c850dcf8b85b1447 --document-name --profile kccb AWS-StartPortForwardingSession --parameters "portNumber"=["8686"],"localPortNumber"=["8686"]
______________________________________________________________________
For database:

87
src/app/home/layout.tsx Normal file
View File

@@ -0,0 +1,87 @@
"use client";
import React from 'react';
import { Box, Button, Flex, Group, Image, Text } from '@mantine/core';
import { IconBook, IconCurrencyRupee, IconHome, IconLogout, IconPhoneFilled, IconSettings } from '@tabler/icons-react';
import Link from 'next/link';
import { useRouter } from "next/navigation";
import { Providers } from '../providers';
import logo from '@/app/image/logo.jpg';
import NextImage from 'next/image';
export default function RootLayout({ children }: { children: React.ReactNode }) {
const router = useRouter();
async function handleLogout(e: React.FormEvent) {
e.preventDefault();
localStorage.removeItem("access_token");
router.push("/login")
}
return (
<html lang="en">
<body>
<Providers>
<div style={{ backgroundColor: "#e6ffff", width: "100%", height: '100vh' }}>
{/* Image -Logo */}
<Box style={{
position: 'relative', width: '100%', height: '11%',
display: "flex",
justifyContent: "flex-start",
background: "linear-gradient(15deg,rgba(2, 163, 85, 1) 55%, rgba(101, 101, 184, 1) 100%)",
}}>
<Image
// radius="md"
fit="cover"
src={logo}
component={NextImage}
alt="ebanking"
style={{ width: "100%", height: "100%" }}
/>
<Text
style={{
position: 'absolute',
top: '60%',
left: '80%',
color: 'white',
textShadow: '1px 1px 2px black',
}}
>
<IconPhoneFilled size={20} />
Toll Free No : 1800-180-8008
</Text>
</Box>
<div
style={{
flex: 1,
display: "flex",
alignItems: "left",
justifyContent: "right",
}}>
<Group mt="md" gap="sm">
<Link href="/">
<Button leftSection={<IconHome />} variant="light" color="blue">Home</Button>
</Link>
<Link href="/accounts">
<Button leftSection={<IconBook />} variant="subtle">Accounts</Button>
</Link>
<Link href="/send-money">
<Button leftSection={<IconCurrencyRupee />} variant="subtle">Send Money</Button>
</Link>
<Link href="/settings">
<Button leftSection={<IconSettings />} variant="subtle">Settings</Button>
</Link>
<Button leftSection={<IconLogout />} variant="subtle" onClick={handleLogout}>Logout</Button>
</Group>
</div>
<div>{children}</div>
{/* Footer */}
<Flex justify="center" align="center">
<Text c="dimmed" size="xs">© 2025 Kangra Central Co- Operative Bank</Text>
</Flex>
</div>
</Providers>
</body>
</html>
);
}

63
src/app/home/page.tsx
View File

@@ -1,13 +1,12 @@
"use client";
import React from 'react';
import { AppShell, Button, Input, Group, Stack, Tooltip, UnstyledButton, Text, Avatar, Title, Divider, Box, Select, Paper, Image, Switch, Flex, TextInput, Center } from '@mantine/core';
import { IconBook, IconBuildingBank, IconCurrencyRupee, IconEye, IconHome, IconLogout, IconPhoneFilled, IconSettings } from '@tabler/icons-react';
import { Button, Input, Group, Stack, Text, Title, Box, Select, Paper,Switch} from '@mantine/core';
import { IconBuildingBank, IconEye} from '@tabler/icons-react';
import { useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { Providers } from "../providers";
import logo from '@/app/image/logo.jpg';
import NextImage from 'next/image';
export default function Home() {
const [authorized, SetAuthorized] = useState<boolean | null>(null);
@@ -43,57 +42,10 @@ export default function Home() {
}
}, []);
if (authorized) {
if (authorized) {
return (
<Providers>
<div
style={{
backgroundColor: "#e6ffff", width: "100%", height: '100vh',
}}>
<Box style={{
position: 'relative', width: '100%', height: '11%',
display: "flex",
justifyContent: "flex-start",
background: "linear-gradient(15deg,rgba(2, 163, 85, 1) 55%, rgba(101, 101, 184, 1) 100%)",
}}>
<Image
// radius="md"
fit="cover"
src={logo}
component={NextImage}
alt="ebanking"
style={{ width: "100%", height: "100%" }}
/>
<Text
style={{
position: 'absolute',
top: '60%',
left: '80%',
color: 'white',
textShadow: '1px 1px 2px black',
}}
>
<IconPhoneFilled size={20} />
Toll Free No : 1800-180-8008
</Text>
</Box>
<div
style={{
flex: 1,
display: "flex",
alignItems: "left",
justifyContent: "right",
}}
>
<Group mt="md" gap="sm">
<Button leftSection={<IconHome />} variant="light" color="blue">Home</Button>
<Button leftSection={<IconBook />} variant="subtle">Accounts</Button>
<Button leftSection={<IconCurrencyRupee />} variant="subtle">Send Money</Button>
{/* <Button variant="subtle">IMPS</Button> */}
<Button leftSection={<IconSettings />} variant="subtle">Settings</Button>
<Button leftSection={<IconLogout />} variant="subtle" onClick={handleLogout}>Logout</Button>
</Group>
</div>
<div>
<div
style={{
flex: 1,
@@ -233,11 +185,8 @@ export default function Home() {
</Group>
</Box>
</div>
<Flex justify="center" align="center">
<Text c="dimmed" size="xs">© 2025 Kangra Central Co- Operative Bank</Text>
</Flex>
</div>
</Providers>
);
}
}
}

7
src/app/login/page.tsx
View File

@@ -40,13 +40,10 @@ export default function Login() {
async function handleLogin(e: React.FormEvent) {
e.preventDefault();
setIsLogging(true);
const onlyDigit = /^\d{11}$/;
if (!onlyDigit.test(CIF)) {
setError('Input value must be 11 digit');
}
if (inputCaptcha !== captcha) {
notifications.show({
withBorder: true,
@@ -68,6 +65,7 @@ export default function Login() {
}),
});
const data = await response.json();
setIsLogging(true);
if (response.ok) {
console.log(data);
const token = data.token;
@@ -81,6 +79,7 @@ export default function Login() {
}
else {
setIsLogging(false);
notifications.show({
withBorder: true,
color: "red",
@@ -255,7 +254,7 @@ export default function Login() {
/>
<Button type="submit" disabled={isLogging} fullWidth variant="filled" mt="md">
{/* Login */}
{isLogging ? "Logging.." : "Login"}
{isLogging ? "Logging...." : "Login"}
</Button>
</form>
</Flex>