import { useFormik } from 'formik';
import * as yup from 'yup';
import * as React from "react";
import * as HttpUtils from "utils/HttpUtils";
import * as UrlUtils from "utils/ApiPathConst";
import { useNavigate } from "react-router-dom";
import { useDispatch } from "react-redux";
import { handleLogoutFunction,
// handleLogin
} from 'auth/index';
import useJwt from "auth/jwt/useJwt";
import {
Grid,
Typography,
Button,
// RadioGroup,
// Dialog, DialogTitle, DialogContent, DialogActions,
Stack,
InputLabel,
// OutlinedInput,
FormHelperText,
TextField,
IconButton, InputAdornment,
// Box,
// FormControl
} from '@mui/material';
import Loadable from 'components/Loadable';
const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
// import ForwardIcon from '@mui/icons-material/Forward';
import MainCard from 'components/MainCard';
import {PNSPS_LONG_BUTTON_THEME} from "themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
import {FormattedMessage, useIntl} from "react-intl";
import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
import axios from 'axios';
import { useParams,Link } from 'react-router-dom';
import CancelOutlinedIcon from '@mui/icons-material/CancelOutlined';
// import LocaleContext from "components/I18nProvider";
// ==============================|| DASHBOARD - DEFAULT ||============================== //
const Index = () => {
const dispatch = useDispatch()
const navigate = useNavigate()
const [showPassword, setShowPassword] = React.useState(false);
const [showConfirmPassword, setshowConfirmPassword] = React.useState(false);
const [isLoading, setLoding] = React.useState(true);
const [verifyState, setVerifyState] = React.useState(null)
const [enterUseEffect, setEnterUseEffect] = React.useState(false)
const [username, setUsername] = React.useState("")
// const { setLocale } = React.useContext(LocaleContext);
const params = useParams()
const intl = useIntl();
React.useEffect(() => {
console.log(params);
setEnterUseEffect(true)
}, []);
React.useEffect(() => {
// console.log("if (enterUseEffect) handleVerify()");
if (enterUseEffect){
handleVerify()
}
}, [enterUseEffect])
const handleVerify = async () => {
console.log(params);
await axios.get(UrlUtils.GET_FORGOT_PASSWORD_VERIFY_USER_ACCOUNT, {
params: {
email: decodeURIComponent(params.email),
emailVerifyHash: decodeURIComponent(params.verifyCode)
}
}).then(
(response)=>{
if (response.status === 200 && response.data) {
console.log(response)
setUsername(response.data.username)
setVerifyState(true)
} else {
setVerifyState(false)
}
setLoding(false)
}
).catch(error => {
console.log(error)
setVerifyState(false)
setLoding(false)
});
}
const goLogin = async (values) =>{
dispatch(handleLogoutFunction());
HttpUtils.post({
url: UrlUtils.POST_FORGOT_PASSWORD_NEW_PASSWORD,
params:{
username: username,
newPassword: values.password
},
onSuccess: () => {
useJwt
.login({ username: username, password: values.password })
.then((
// response
) => {
// console.log(response)
navigate('/forgot/password/success');
location.reload()
// setSumitting(false)
})
.catch((error) => {
console.error(error)
});
},
onFail: (response)=>{
console.log("Fail");
console.log(response);
// window.location.assign("/iamsmart/loginFail");
},
onError:(error)=>{
console.log(error);
// window.location.assign("/iamsmart/loginFail");
}
});
}
const BackgroundHead = {
backgroundImage: `url(${titleBackgroundImg})`,
width: 'auto',
height: 'auto',
backgroundSize: 'contain',
backgroundRepeat: 'no-repeat',
backgroundColor: '#0C489E',
backgroundPosition: 'right'
}
const handleClickShowPassword = () => {
setShowPassword(!showPassword);
};
const handleClickShowConfirmPassword = () => {
setshowConfirmPassword(!showConfirmPassword);
};
const handleMouseDownPassword = (event) => {
event.preventDefault();
};
const changePassword = (
// value
) => {
// const temp = strengthIndicator(value);
// setLevel(strengthColorChi(temp));
};
const formik = useFormik({
enableReinitialize: true,
initialValues: {
// username: '',
password: '',
confirmPassword: '',
// emailVerifyHash: '',
},
validationSchema: yup.object().shape({
// emailVerifyHash: yup.string().required(intl.formatMessage({id: 'requireSecurityCode'})),
// username: yup.string().required(intl.formatMessage({id: 'requireUsername'})),
password: yup.string().min(8, intl.formatMessage({id: 'atLeast8CharPassword'}))
.required(intl.formatMessage({id: 'requirePassword'}))
.matches(/^\S*$/, { message: (intl.formatMessage({id: 'noSpacePassword'}))})
.matches(/^(?=.*[a-z])/, { message: intl.formatMessage({id: 'atLeastOneSmallLetter'})})
.matches(/^(?=.*[A-Z])/, { message: intl.formatMessage({id: 'atLeastOneCapLetter'})})
.matches(/^(?=.*[0-9])/, { message: intl.formatMessage({id: 'atLeast1Number'})})
.matches(/^(?=.*\W)/, { message: intl.formatMessage({id: 'atLeast1SpecialChar'})}),
confirmPassword: yup.string().min(8, intl.formatMessage({id: 'atLeast8CharPassword'}))
.required(intl.formatMessage({id: 'pleaseConfirmPassword'}))
.oneOf([yup.ref('password'), null], intl.formatMessage({id: 'samePassword'})),
}),
onSubmit: values => {
// console.log(values)
goLogin(values)
}
});
const handleCCPChange = (e) => {
e.preventDefault();
};
return (
isLoading || verifyState == null ?
:
{/*
*/}
{/*
申請公共啟事
*/}
*': {
flexGrow: 1,
flexBasis: '50%'
}
}}
content={false}
border={false}
boxShadow
>
);
};
export default Index;