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"] 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"] 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: 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>
);
}

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

@@ -1,13 +1,12 @@
"use client"; "use client";
import React from 'react'; 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 { Button, Input, Group, Stack, Text, Title, Box, Select, Paper,Switch} from '@mantine/core';
import { IconBook, IconBuildingBank, IconCurrencyRupee, IconEye, IconHome, IconLogout, IconPhoneFilled, IconSettings } from '@tabler/icons-react'; import { IconBuildingBank, IconEye} from '@tabler/icons-react';
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { Providers } from "../providers"; import { Providers } from "../providers";
import logo from '@/app/image/logo.jpg';
import NextImage from 'next/image';
export default function Home() { export default function Home() {
const [authorized, SetAuthorized] = useState<boolean | null>(null); const [authorized, SetAuthorized] = useState<boolean | null>(null);
@@ -46,54 +45,7 @@ export default function Home() {
if (authorized) { if (authorized) {
return ( return (
<Providers> <Providers>
<div <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={{ style={{
flex: 1, flex: 1,
@@ -233,9 +185,6 @@ export default function Home() {
</Group> </Group>
</Box> </Box>
</div> </div>
<Flex justify="center" align="center">
<Text c="dimmed" size="xs">© 2025 Kangra Central Co- Operative Bank</Text>
</Flex>
</div> </div>
</Providers> </Providers>
); );

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

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