alex
/
PNSPS-frontend-MaterialUI
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

change rounte check login

master
Alex Cheung 2 years ago
parent
9e59247019
commit
707aec91f7
4 changed files with 146 additions and 119 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +128
    -98
      src/pages/authentication/auth-forms/CustomFormWizard.js
  2. +1
    -1
      src/pages/extra-pages/LoadingComponent.js
  3. +4
    -4
      src/routes/MainRoutes.js
  4. +13
    -16
      src/routes/index.js

+ 128
- 98
src/pages/authentication/auth-forms/CustomFormWizard.js View File

@@ -73,6 +73,12 @@ const CustomFormWizard = (props) => {
console.log(data.fax) console.log(data.fax)
console.log(data.phone) console.log(data.phone)
const name = data.ehName +" "+ data.enName const name = data.ehName +" "+ data.enName
const userAddress = {
"addressLine1":data.address1,
"addressLine2":data.address2,
"addressLine3":data.address3,
"country":data.address5
}
console.log(name) console.log(name)
if (data.username !==""){ if (data.username !==""){
axios.post(`${apiPath}/user/register`, { axios.post(`${apiPath}/user/register`, {
@@ -82,13 +88,9 @@ const CustomFormWizard = (props) => {
fullname: name, fullname: name,
enName: data.enName, enName: data.enName,
chName: data.chName, chName: data.chName,
email: data.email,
emailAddress: data.email,
fax: data.fax, fax: data.fax,
address1: data.address1,
address2: data.address2,
address3: data.address3,
address4: data.address4,
address5: data.address5
userAddress:userAddress
}) })
.then((response) => { .then((response) => {
console.log("Success") console.log("Success")
@@ -117,6 +119,7 @@ const CustomFormWizard = (props) => {
confirmPassword: '', confirmPassword: '',
phone:'', phone:'',
idNo:'', idNo:'',
checkDigit:'',
submit: null submit: null
}} }}
validationSchema={Yup.object().shape({ validationSchema={Yup.object().shape({
@@ -130,6 +133,7 @@ const CustomFormWizard = (props) => {
address3: Yup.string().max(255).required('請輸入第三行地址'), address3: Yup.string().max(255).required('請輸入第三行地址'),
email: Yup.string().email('Must be a valid email').max(255).required('Email is required'), email: Yup.string().email('Must be a valid email').max(255).required('Email is required'),
idNo: Yup.string().max(255).required('請輸入身證件號碼'), idNo: Yup.string().max(255).required('請輸入身證件號碼'),
checkDigit:Yup.string().max(1).required('請輸入身證件號碼'),
idType: Yup.string().max(255).required('請輸入第三行地址'), idType: Yup.string().max(255).required('請輸入第三行地址'),
})} })}
> >
@@ -175,99 +179,103 @@ const CustomFormWizard = (props) => {
)} )}
</Stack> </Stack>
</Grid> </Grid>
<Grid item xs={12} md={6}>
<Stack spacing={1}>
<Stack direction="row" justifyContent="space-between">
<InputLabel htmlFor="password-signup">密碼
<span style={{color: '#f10000'}}>*</span>
</InputLabel>
<InputLabel htmlFor="password-rule">密碼規則</InputLabel>
</Stack>
<OutlinedInput
fullWidth
error={Boolean(touched.password && errors.password)}
id="password-signup"
type={showPassword ? 'text' : 'password'}
value={values.password}
name="password"
{...register("password")}
onChange={(e) => {
handleChange(e);
changePassword(e.target.value);
}}
endAdornment={
<InputAdornment position="end">
<IconButton
aria-label="toggle password visibility"
onClick={handleClickShowPassword}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
>
{showPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
</IconButton>
</InputAdornment>
}
placeholder="密碼"
inputProps={{}}
/>
{touched.password && errors.password && (
<FormHelperText error id="helper-text-password-signup">
{errors.password}
</FormHelperText>
)}
</Stack>
<FormControl fullWidth sx={{ mt: 2 }}>
<Grid container spacing={2} alignItems="center">
<Grid item>
<Box sx={{ bgcolor: level?.color, width: 85, height: 8, borderRadius: '7px' }} />
</Grid>
<Grid item>
<Typography variant="subtitle1" fontSize="0.75rem">
{level?.label}
</Typography>
<Grid item xs={12} md={12}>
<Grid container xs={12} md={12}>
<Grid item xs={12} md={6} >
<Stack spacing={1} sx={{mr:{md:1},mb:{xs:1}}}>
<Stack direction="row" justifyContent="space-between">
<InputLabel htmlFor="password-signup">密碼
<span style={{color: '#f10000'}}>*</span>
</InputLabel>
<InputLabel htmlFor="password-rule">密碼規則</InputLabel>
</Stack>
<OutlinedInput
fullWidth
error={Boolean(touched.password && errors.password)}
id="password-signup"
type={showPassword ? 'text' : 'password'}
value={values.password}
name="password"
{...register("password")}
onChange={(e) => {
handleChange(e);
changePassword(e.target.value);
}}
endAdornment={
<InputAdornment position="end">
<IconButton
aria-label="toggle password visibility"
onClick={handleClickShowPassword}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
>
{showPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
</IconButton>
</InputAdornment>
}
placeholder="密碼"
inputProps={{}}
/>
{touched.password && errors.password && (
<FormHelperText error id="helper-text-password-signup">
{errors.password}
</FormHelperText>
)}
</Stack>
<FormControl fullWidth sx={{ mt: 2 }}>
<Grid container spacing={2} alignItems="center">
<Grid item>
<Box sx={{ bgcolor: level?.color, width: 85, height: 8, borderRadius: '7px' }} />
</Grid>
<Grid item>
<Typography variant="subtitle1" fontSize="0.75rem">
{level?.label}
</Typography>
</Grid>
</Grid>
</FormControl>
</Grid> </Grid>
<Grid item xs={12} md={6} >
<Stack spacing={1}>
<InputLabel htmlFor="confirmPassword-signup">確認密碼
<span style={{color: '#f10000'}}>*</span>
</InputLabel>
<OutlinedInput
id="confirmPassword-login"
type={showConfirmPassword ? 'text' : 'password'}
value={values.confirmPassword}
name="confirmPassword"
{...register("confirmPassword")}
onChange={(e) => {
handleChange(e);
changePassword(e.target.value);
}}
endAdornment={
<InputAdornment position="end">
<IconButton
aria-label="toggle password visibility"
onClick={handleClickShowConfirmPassword}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
>
{showConfirmPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
</IconButton>
</InputAdornment>
}
placeholder="確認密碼"
fullWidth
error={Boolean(touched.confirmPassword && errors.confirmPassword)}
/>
{touched.confirmPassword && errors.confirmPassword && (
<FormHelperText error id="helper-text-confirmPassword-signup">
{errors.confirmPassword}
</FormHelperText>
)}
</Stack>
</Grid>
</Grid> </Grid>
</FormControl>
</Grid>
<Grid item xs={12} md={6} >
<Stack spacing={1}>
<InputLabel htmlFor="confirmPassword-signup">確認密碼
<span style={{color: '#f10000'}}>*</span>
</InputLabel>
<OutlinedInput
id="confirmPassword-login"
type={showConfirmPassword ? 'text' : 'password'}
value={values.confirmPassword}
name="confirmPassword"
{...register("confirmPassword")}
onChange={(e) => {
handleChange(e);
changePassword(e.target.value);
}}
endAdornment={
<InputAdornment position="end">
<IconButton
aria-label="toggle password visibility"
onClick={handleClickShowConfirmPassword}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
>
{showConfirmPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
</IconButton>
</InputAdornment>
}
placeholder="確認密碼"
fullWidth
error={Boolean(touched.confirmPassword && errors.confirmPassword)}
/>
{touched.confirmPassword && errors.confirmPassword && (
<FormHelperText error id="helper-text-confirmPassword-signup">
{errors.confirmPassword}
</FormHelperText>
)}
</Stack>
</Grid> </Grid>
<Grid item xs={12} mt={1} mb={1}> <Grid item xs={12} mt={1} mb={1}>
<Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}> <Stack direction="column" justifyContent="space-between" alignItems="baseline" sx={{ mb: { xs: -0.5, sm: 0.5 } }}>
@@ -314,7 +322,7 @@ const CustomFormWizard = (props) => {
</Select> </Select>
</Stack> </Stack>
</Grid> </Grid>
<Grid item xs={12} md={6}>
<Grid item xs={12} md={5}>
<Stack spacing={1}> <Stack spacing={1}>
<OutlinedInput <OutlinedInput
id="idNo-login" id="idNo-login"
@@ -325,6 +333,7 @@ const CustomFormWizard = (props) => {
onChange={handleChange} onChange={handleChange}
placeholder="證件號碼" placeholder="證件號碼"
fullWidth fullWidth
sx={{mr:1}}
error={Boolean(touched.idNo && errors.idNo)} error={Boolean(touched.idNo && errors.idNo)}
/> />
{touched.idNo && errors.idNo && ( {touched.idNo && errors.idNo && (
@@ -334,6 +343,27 @@ const CustomFormWizard = (props) => {
)} )}
</Stack> </Stack>
</Grid> </Grid>
<Grid item xs={12} md={1}>
<Stack spacing={1}>
<OutlinedInput
id="checkDigit-login"
type="text"
value={values.checkDigit}
name="checkDigit"
{...register("checkDigit")}
onChange={handleChange}
placeholder="( )"
inputProps={{ maxLength: 1 }}
fullWidth
error={Boolean(touched.checkDigit && errors.checkDigit)}
/>
{touched.checkDigit && errors.checkDigit && (
<FormHelperText error id="helper-text-enName-signup">
{errors.checkDigit}
</FormHelperText>
)}
</Stack>
</Grid>
</Grid> </Grid>
</Grid> </Grid>


+ 1
- 1
src/pages/extra-pages/LoadingComponent.js View File

@@ -7,7 +7,7 @@ const LoadingComponent = () => {
display="flex" display="flex"
justifyContent="center" justifyContent="center"
alignItems="center" alignItems="center"
autoHeight
autoHeight="true"
> >
<CircularProgress /> <CircularProgress />
</Box> </Box>


+ 4
- 4
src/routes/MainRoutes.js View File

@@ -26,10 +26,6 @@ const MainRoutes = {
path: '/', path: '/',
element: <DashboardDefault /> element: <DashboardDefault />
}, },
{
path: 'color',
element: <Color />
},
{ {
path: '/', path: '/',
children: [ children: [
@@ -39,6 +35,10 @@ const MainRoutes = {
} }
] ]
}, },
{
path: 'color',
element: <Color />
},
{ {
path: 'sample-page', path: 'sample-page',
element: <SamplePage /> element: <SamplePage />


+ 13
- 16
src/routes/index.js View File

@@ -4,26 +4,17 @@ import MainRoutes from './MainRoutes'
import {useRoutes} from 'react-router-dom' import {useRoutes} from 'react-router-dom'
import {isUserLoggedIn} from "utils/Utils"; import {isUserLoggedIn} from "utils/Utils";
import {Navigate} from "react-router"; import {Navigate} from "react-router";
import {useDispatch} from "react-redux";
import {handleLogoutFunction,
import {
setupAxiosInterceptors, setupAxiosInterceptors,
isTokenValid} from "../auth";
import {useNavigate} from "react-router-dom";
} from "../auth";
import SettingRoutes from './SettingRoutes'; import SettingRoutes from './SettingRoutes';
// ==============================|| ROUTING RENDER ||============================== // // ==============================|| ROUTING RENDER ||============================== //


export default function ThemeRoutes() { export default function ThemeRoutes() {
const dispatch = useDispatch()
const navigate = useNavigate()


if(isUserLoggedIn()){ if(isUserLoggedIn()){
setupAxiosInterceptors();

//auto logout if token not valid //auto logout if token not valid
if(!isTokenValid()){
dispatch(handleLogoutFunction());
navigate('/login');
}
setupAxiosInterceptors();
} }


return useRoutes([{ return useRoutes([{
@@ -41,9 +32,15 @@ export default function ThemeRoutes() {
}) })
] ]
}, },
LoginRoutes,
MainRoutes,
SettingRoutes
isUserLoggedIn() ? MainRoutes : LoginRoutes,
isUserLoggedIn() ? SettingRoutes : LoginRoutes,
!isUserLoggedIn()?{
path: '*',
element: <Navigate to="/login"/>
}:
{
path: '*',
element: <Navigate to="/dashboard"/>
},
]); ]);
//return useRoutes([MainRoutes, LoginRoutes]);
} }

Write Preview
Loading…
Cancel
Save