tbfajri/aso
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

verify code/otp

Browse Source
This commit is contained in:
Muhammad Fajar
2022-11-14 14:31:48 +07:00
parent 23be392f18
commit 05bb1f3c7e
4 changed files with 22 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/client-portal/src/pages/auth/Login.tsx
View File

@@ -42,10 +42,10 @@ export default function Login() {
};
useEffect(() => {
// if (state !== null) {
// setFormPhone(state.formPhone);
// }
// console.log(state);
if (state !== null) {
setFormPhone(state.formPhone);
}
console.log(state);
}, [state]);
return (

25
frontend/client-portal/src/pages/auth/VerifyCode.tsx
View File

@@ -1,4 +1,4 @@
import { Link as RouterLink, useLocation, useNavigate } from 'react-router-dom';
import { useLocation, useNavigate } from 'react-router-dom';
// @mui
import { styled } from '@mui/material/styles';
import { Box, Card, Divider, IconButton, Grid, Link, Stack, Typography } from '@mui/material';
@@ -50,7 +50,7 @@ export default function VerifyCode() {
<Grid item xs={6}>
<Image visibleByDefault disabledEffect src="/images/login-image.gif" alt="login" />
</Grid>
<Grid item xs={6} sx={{ padding: 3 }}>
<Grid item xs={6} sx={{ padding: 3, textAlign: 'center' }}>
<Stack direction="column" sx={{ mb: 5 }}>
<Stack direction="row" alignItems="center">
<IconButton
@@ -68,36 +68,35 @@ export default function VerifyCode() {
</Typography>
</Stack>
<Box sx={{ flexGrow: 1 }}>
<Typography variant="body1" sx={{ color: 'text.secondary' }}>
<Typography variant="body1" sx={{ color: 'text.secondary', textAlign: 'left' }}>
Masukkan kode OTP anda disini
</Typography>
</Box>
</Stack>
<VerifyCodeForm />
<VerifyCodeForm phoneOrEmail={state.phoneOrEmail} />
<Typography sx={{ marginTop: 5 }}>Tidak mendapatkan kode?</Typography>
<Link sx={{ marginTop: 1 }}>Kirim Ulang Kode OTP</Link>
<Divider sx={{ marginTop: 5 }}>Atau</Divider>
<Stack sx={{ marginTop: 5 }}>
{state.formPhone === false ? (
{state.formPhone ? (
<Link
align="center"
underline="hover"
onClick={() =>
navigate('/auth/login', { state: { formPhone: state.formPhone } })
}
onClick={() => navigate('/auth/login', { state: { formPhone: false } })}
>
Masuk menggunakan nomor handphone
Masuk menggunakan email
</Link>
) : (
<Link
align="center"
underline="hover"
onClick={() =>
navigate('/auth/login', { state: { formPhone: state.formPhone } })
}
onClick={() => navigate('/auth/login', { state: { formPhone: true } })}
>
Masuk menggunakan email
Masuk menggunakan nomor handphone
</Link>
)}
</Stack>