merge both code
This commit is contained in:
@@ -5,9 +5,10 @@ import { notifications } from "@mantine/notifications";
|
||||
import { Providers } from "@/app/providers";
|
||||
import { useRouter } from "next/navigation";
|
||||
import NextImage from "next/image";
|
||||
import myImage from '@/app/image/ebanking.jpg';
|
||||
import logo from '@/app/image/logo.jpg';
|
||||
import changePwdImage from '@/app/image/changepw.png';
|
||||
import CaptchaImage from './CaptchaImage';
|
||||
import { IconEye, IconEyeOff } from '@tabler/icons-react';
|
||||
|
||||
export default function ChangeLoginPwd() {
|
||||
const router = useRouter();
|
||||
@@ -18,6 +19,10 @@ export default function ChangeLoginPwd() {
|
||||
const [captchaInput, setCaptchaInput] = useState('');
|
||||
const [captchaError, setCaptchaError] = useState('');
|
||||
|
||||
|
||||
const [confirmVisible, setConfirmVisible] = useState(false);
|
||||
const toggleConfirmVisibility = () => setConfirmVisible((v) => !v);
|
||||
|
||||
useEffect(() => {
|
||||
generateCaptcha();
|
||||
}, []);
|
||||
@@ -122,11 +127,16 @@ export default function ChangeLoginPwd() {
|
||||
return (
|
||||
<Providers>
|
||||
<div style={{ backgroundColor: "#f8f9fa", width: "100%", height: "auto", paddingTop: "5%" }}>
|
||||
<Box style={{ position: 'fixed', width: '100%', height: '12%', top: 0, left: 0, zIndex: 100 }}>
|
||||
<Box style={{
|
||||
position: 'fixed', width: '100%', height: '12%', top: 0, left: 0, zIndex: 100,
|
||||
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={myImage}
|
||||
src={logo}
|
||||
component={NextImage}
|
||||
alt="ebanking"
|
||||
style={{ width: "100%", height: "100%" }}
|
||||
@@ -162,6 +172,16 @@ export default function ChangeLoginPwd() {
|
||||
id="confirmPassword"
|
||||
value={confirmPassword}
|
||||
onChange={(e) => setConfirmPassword(e.currentTarget.value)}
|
||||
type={confirmVisible ? 'text' : 'password'}
|
||||
rightSection={
|
||||
<button
|
||||
type="button"
|
||||
onClick={toggleConfirmVisibility}
|
||||
style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'grey' }}
|
||||
>
|
||||
{confirmVisible ? <IconEyeOff size={18} /> : <IconEye size={18} />}
|
||||
</button>
|
||||
}
|
||||
onCopy={(e) => e.preventDefault()}
|
||||
onPaste={(e) => e.preventDefault()}
|
||||
onCut={(e) => e.preventDefault()}
|
||||
|
||||
@@ -12,27 +12,14 @@ import { IconEye, IconEyeOff } from '@tabler/icons-react';
|
||||
|
||||
export default function ChangeTransactionPwd() {
|
||||
const router = useRouter();
|
||||
<<<<<<< HEAD
|
||||
const [authorized, SetAuthorized] = useState<boolean | null>(null);
|
||||
const [password, setPassword] = useState("");
|
||||
const [confirmPassword, setConfirmPassword] = useState("");
|
||||
=======
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [CIF, SetCIF] = useState("");
|
||||
const [psw, SetPsw] = useState("");
|
||||
|
||||
|
||||
//const [loginVisible, setLoginVisible] = useState(false);
|
||||
const [confirmVisible, setConfirmVisible] = useState(false);
|
||||
|
||||
// const toggleLoginVisibility = () => setLoginVisible((v) => !v);
|
||||
const toggleConfirmVisibility = () => setConfirmVisible((v) => !v);
|
||||
|
||||
|
||||
>>>>>>> 293a7dbea0766fdf05804199800c4e3fd9174507
|
||||
const [captcha, setCaptcha] = useState("");
|
||||
const [captchaInput, setCaptchaInput] = useState('');
|
||||
const [captchaError, setCaptchaError] = useState('');
|
||||
const [confirmVisible, setConfirmVisible] = useState(false);
|
||||
const toggleConfirmVisibility = () => setConfirmVisible((v) => !v);
|
||||
|
||||
useEffect(() => {
|
||||
generateCaptcha();
|
||||
@@ -123,7 +110,6 @@ export default function ChangeTransactionPwd() {
|
||||
}
|
||||
}
|
||||
|
||||
<<<<<<< HEAD
|
||||
useEffect(() => {
|
||||
const token = localStorage.getItem("access_token");
|
||||
if (!token) {
|
||||
@@ -134,7 +120,8 @@ export default function ChangeTransactionPwd() {
|
||||
SetAuthorized(true);
|
||||
}
|
||||
}, []);
|
||||
=======
|
||||
|
||||
if (authorized) {
|
||||
return (
|
||||
<Providers>
|
||||
<div style={{ backgroundColor: "#f8f9fa", width: "100%", height: "auto", paddingTop: "5%" }}>
|
||||
@@ -153,80 +140,6 @@ export default function ChangeTransactionPwd() {
|
||||
style={{ width: "100%", height: "100%" }}
|
||||
/>
|
||||
</Box>
|
||||
<div style={{ marginTop: '10px' }}>
|
||||
|
||||
<Box style={{ display: "flex", justifyContent: "center", alignItems: "center", columnGap: "5rem" }} bg="#c1e0f0">
|
||||
<Image h="85vh" fit="contain" component={NextImage} src={changePwdImage} alt="Change Password Image" />
|
||||
<Box h="100%" style={{ display: "flex", justifyContent: "center", alignItems: "center" }}>
|
||||
<Card p="xl" w="35vw">
|
||||
<Title order={3}
|
||||
// @ts-ignore
|
||||
align="center" mb="md">Set Transaction Password</Title>
|
||||
<form>
|
||||
<PasswordInput
|
||||
label="Transaction Password"
|
||||
placeholder="Enter your password"
|
||||
required
|
||||
id="loginPassword"
|
||||
onCopy={(e) => e.preventDefault()}
|
||||
onPaste={(e) => e.preventDefault()}
|
||||
onCut={(e) => e.preventDefault()}
|
||||
/>
|
||||
{/* <PasswordInput
|
||||
label="Confirm Transaction Password"
|
||||
placeholder="Enter your password"
|
||||
required
|
||||
id="confirmPassword"
|
||||
onCopy={(e) => e.preventDefault()}
|
||||
onPaste={(e) => e.preventDefault()}
|
||||
onCut={(e) => e.preventDefault()}
|
||||
/> */}
|
||||
<PasswordInput
|
||||
mt="md"
|
||||
label="Confirm Login Password"
|
||||
placeholder="Enter your password"
|
||||
required
|
||||
id="confirmPassword"
|
||||
value={psw}
|
||||
onChange={(e) => SetPsw(e.currentTarget.value)}
|
||||
type={confirmVisible ? 'text' : 'password'}
|
||||
rightSection={
|
||||
<button
|
||||
type="button"
|
||||
onClick={toggleConfirmVisibility}
|
||||
style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'grey' }}
|
||||
>
|
||||
{confirmVisible ? <IconEyeOff size={18} /> : <IconEye size={18} />}
|
||||
</button>
|
||||
}
|
||||
onCopy={(e) => e.preventDefault()}
|
||||
onPaste={(e) => e.preventDefault()}
|
||||
onCut={(e) => e.preventDefault()}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
{/* <Button fullWidth mt="sm" color="blue" onClick={() => {
|
||||
router.push("/login")
|
||||
}} >
|
||||
Set
|
||||
</Button> */}
|
||||
>>>>>>> 293a7dbea0766fdf05804199800c4e3fd9174507
|
||||
|
||||
if (authorized) {
|
||||
return (
|
||||
<Providers>
|
||||
<div style={{ backgroundColor: "#f8f9fa", width: "100%", height: "auto", paddingTop: "5%" }}>
|
||||
<Box style={{ position: 'fixed', width: '100%', height: '12%', top: 0, left: 0, zIndex: 100 }}>
|
||||
<Image
|
||||
// radius="md"
|
||||
fit="cover"
|
||||
src={myImage}
|
||||
component={NextImage}
|
||||
alt="ebanking"
|
||||
style={{ width: "100%", height: "100%" }}
|
||||
/>
|
||||
</Box>
|
||||
<div style={{ marginTop: '10px' }}>
|
||||
<Box style={{ display: "flex", justifyContent: "center", alignItems: "center", columnGap: "5rem" }} bg="#c1e0f0">
|
||||
<Image h="85vh" fit="contain" component={NextImage} src={changePwdImage} alt="Change Password Image" />
|
||||
@@ -253,6 +166,16 @@ export default function ChangeTransactionPwd() {
|
||||
required
|
||||
id="confirmPassword"
|
||||
value={confirmPassword}
|
||||
type={confirmVisible ? 'text' : 'password'}
|
||||
rightSection={
|
||||
<button
|
||||
type="button"
|
||||
onClick={toggleConfirmVisibility}
|
||||
style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'grey' }}
|
||||
>
|
||||
{confirmVisible ? <IconEyeOff size={18} /> : <IconEye size={18} />}
|
||||
</button>
|
||||
}
|
||||
onChange={(e) => setConfirmPassword(e.currentTarget.value)}
|
||||
onCopy={(e) => e.preventDefault()}
|
||||
onPaste={(e) => e.preventDefault()}
|
||||
|
||||
Reference in New Issue
Block a user