refactor: unified transaction url.

feat: modify admin pages.
This commit is contained in:
2025-08-29 17:11:44 +05:30
parent bbbfcc52d2
commit 78c0fa6e95
9 changed files with 501 additions and 321 deletions

View File

@@ -5,7 +5,7 @@ import { notifications } from "@mantine/notifications";
import { Providers } from "@/app/providers";
import { useRouter } from "next/navigation";
import NextImage from "next/image";
import logo from '@/app/image/logo.jpg';
import logo from '@/app/image/logo1.jpg';
import frontPage from '@/app/image/admin_login.jpg';
import { generateCaptcha } from '@/app/captcha';
@@ -93,114 +93,116 @@ export default function Login() {
return (
<Providers>
<div style={{ backgroundColor: "#f8f9fa", width: "100%", height: "100%", paddingTop: "5%" }}>
<div style={{ backgroundColor: "#f8f9fa", width: "100%", height: "100%" }}>
{/* Header */}
<Box
component="header"
style={{
width: "100%",
padding: "0.8rem 2rem",
background: "linear-gradient(15deg, rgba(10, 114, 40, 1) 55%, rgba(101, 101, 184, 1) 100%)",
display: "flex",
alignItems: "center",
justifyContent: "space-between",
color: "white",
boxShadow: "0 2px 6px rgba(0,0,0,0.15)",
position: "sticky",
top: 0,
zIndex: 100,
}}
>
<Group gap="md">
<Image
src={logo}
component={NextImage}
fit="contain"
alt="ebanking"
style={{ width: "60px", height: "auto" }}
/>
<div>
<Title order={3} style={{ fontFamily: "Roboto", color: "white", marginBottom: 2 }}>
THE KANGRA CENTRAL CO-OPERATIVE BANK LTD.
</Title>
<Text size="xs" c="white" style={{ opacity: 0.85 }}>
Head Office: Dharmshala, Kangra (H.P), Pin: 176215
</Text>
</div>
</Group>
</Box>
{/* Main */}
<Box style={{
position: 'fixed', width: '100%', height: '12%', top: 0, left: 0, zIndex: 100,
flex: 1,
position: "relative",
display: "flex",
justifyContent: "flex-start",
background: "linear-gradient(15deg,rgba(2, 163, 85, 1) 55%, rgba(101, 101, 184, 1) 100%)",
// border: "1px solid black"
justifyContent: "flex-end",
alignItems: "center",
overflow: "hidden",
background: 'linear-gradient(to right, #48ac64ff, #199444ff)'
}}>
<Box style={{ flex: 1, backgroundColor: "#c1e0f0", position: "relative" }}>
<Image
fit="cover"
src={logo}
src={frontPage}
component={NextImage}
alt="ebanking"
style={{ width: "40%", height: "100%", objectFit: "contain", marginLeft: 0 }}
style={{ width: "100%", height: "100%" }}
/>
<Text
style={{
position: 'absolute',
top: '50%',
left: '64%',
color: 'white',
textShadow: '1px 1px 2px blue',
}}
>
{/* <IconBuildingBank/> */}
Head Office : Dharmshala, District: Kangra(H.P), Pincode: 176215
</Box>
<Box w={{ base: "100%", md: "50%" }} p="lg">
<Card shadow="md" padding="xl" radius="md" style={{ maxWidth: 500, margin: "0 auto", height: '70vh', backdropFilter: 'blur(8px)' }}>
{/* @ts-ignore */}
<Title order={3} align='center'>Admin Portal</Title>
<form onSubmit={handleLogin}>
<TextInput
label="User Name"
placeholder="Enter your user name"
value={userName}
onChange={(e) => setUserName(e.currentTarget.value)}
error={error}
withAsterisk
/>
<PasswordInput
label="Password"
placeholder="Enter your password"
value={psw}
onChange={(e) => SetPsw(e.currentTarget.value)}
withAsterisk
mt="sm"
/>
<Group mt="sm" align="center">
<Box style={{ backgroundColor: "#fff", fontSize: "18px", textDecoration: "line-through", padding: "4px 8px", fontFamily: "cursive" }}>{captcha}</Box>
<Button size="xs" variant="light" onClick={regenerateCaptcha}>Refresh</Button>
</Group>
<TextInput
label="Enter CAPTCHA"
placeholder="Enter above text"
value={inputCaptcha}
onChange={(e) => setInputCaptcha(e.currentTarget.value)}
withAsterisk
mt="sm"
/>
<Button type="submit" fullWidth mt="md" disabled={isLogging}>
{isLogging ? "Logging..." : "Login"}
</Button>
</form>
</Card>
</Box>
</Box>
{/* Footer */}
<Box
component="footer"
style={{
width: "100%",
textAlign: "center",
fontSize: "12px",
}}
>
<Text c='dimmed'>
© 2025 KCC Bank. All rights reserved.
</Text>
</Box>
<div>
{/* Main */}
<div style={{
display: "flex", height: "84vh", overflow: "hidden", position: "relative",
background: 'linear-gradient(to right, #48ac64ff, #199444ff)'
}}>
<div style={{ flex: 1, backgroundColor: "#c1e0f0", position: "relative" }}>
<Image
fit="cover"
src={frontPage}
component={NextImage}
alt="ebanking"
style={{ width: "100%", height: "100%" }}
/>
</div>
<Box w={{ base: "100%", md: "50%" }} p="lg">
<Card shadow="md" padding="xl" radius="md" style={{ maxWidth: 500, margin: "0 auto", height: '70vh', backdropFilter: 'blur(8px)' }}>
{/* @ts-ignore */}
<Title order={3} align='center'>Admin Portal</Title>
<form onSubmit={handleLogin}>
<TextInput
label="User Name"
placeholder="Enter your user name"
value={userName}
onChange={(e) => setUserName(e.currentTarget.value)}
error={error}
withAsterisk
/>
<PasswordInput
label="Password"
placeholder="Enter your password"
value={psw}
onChange={(e) => SetPsw(e.currentTarget.value)}
withAsterisk
mt="sm"
/>
{/* <Box style={{ textAlign: "right"}}>
<Anchor
style={{ fontSize: "14px", color: "#1c7ed6", cursor: "pointer" }}
// onClick={() => router.push("/ValidateUser")}
>
Forgot Password?
</Anchor>
</Box> */}
<Group mt="sm" align="center">
<Box style={{ backgroundColor: "#fff", fontSize: "18px", textDecoration: "line-through", padding: "4px 8px", fontFamily: "cursive" }}>{captcha}</Box>
<Button size="xs" variant="light" onClick={regenerateCaptcha}>Refresh</Button>
</Group>
<TextInput
label="Enter CAPTCHA"
placeholder="Enter above text"
value={inputCaptcha}
onChange={(e) => setInputCaptcha(e.currentTarget.value)}
withAsterisk
mt="sm"
/>
<Button type="submit" fullWidth mt="md" disabled={isLogging}>
{isLogging ? "Logging..." : "Login"}
</Button>
</form>
</Card>
</Box>
</div>
{/* Footer */}
<Box
component="footer"
style={{
width: "100%",
textAlign: "center",
fontSize: "12px",
}}
>
<Text c='dimmed'>
© 2025 KCC Bank. All rights reserved.
</Text>
</Box>
</div>
</div>
</Providers>
);