update with forgot passworf and loayout update

src/pages/DemandNote/Search/index.js

@@ -92,7 +92,11 @@ const UserSearchPage_Individual = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ backgroundColor: 'backgroundColor.default' }} direction="column">
                 <Grid item xs={12}>

src/pages/DemandNote/Search_Public/index.js

@@ -92,7 +92,11 @@ const UserSearchPage_Individual = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ minHeight: '85vh', backgroundColor: 'backgroundColor.default' }} direction="column">
                 <Grid item xs={12}>

src/pages/EmailTemplate/Detail_GLD/index.js

@@ -117,7 +117,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ minHeight: '110vh', backgroundColor: 'backgroundColor.default' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/EmailTemplate/Search_GLD/index.js

@@ -55,7 +55,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ backgroundColor: 'backgroundColor.default' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/Message/Details/index.js

@@ -61,7 +61,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/Organization/DetailPage/index.js

@@ -124,7 +124,11 @@ const OrganizationDetailPage = () => {
 
     return (
         isLoading ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container direction="column" sx={{minHeight: '90vh',backgroundColor:isGLDLoggedIn()?'backgroundColor.default':'#ffffff' }}>
                 <Grid item xs={12}>

src/pages/Organization/SearchPage/index.js

@@ -65,7 +65,11 @@ const OrganizationSearchPage = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{backgroundColor:"backgroundColor.default"}}>
                 <Grid item xs={12}>

src/pages/Payment/Card/index.js

@@ -125,7 +125,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/Payment/Details_GLD/index.js

@@ -79,7 +79,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <div>

src/pages/Payment/Details_Public/index.js

@@ -84,7 +84,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <div>

src/pages/Payment/FPS/AckPage.js

@@ -149,7 +149,11 @@ const AckPage = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             transactionData.paymentdetail?.result?.paymentstatuscode === "APPR" ?
                 (

src/pages/Payment/FPS/FPS.js

@@ -256,7 +256,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/Payment/FPS/fpscallback.js

@@ -139,7 +139,11 @@ const Fpscallback = () => {
     }
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             transactionData.paymentdetail?.result?.paymentstatuscode === "APPR" ?
                 (

src/pages/Payment/PaymentCallback.js

@@ -151,7 +151,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             transactionData.paymentdetail?.result?.paymentstatuscode === "APPR" ?
                 (

src/pages/Proof/Create_FromApp/index.js

@@ -68,9 +68,12 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
-
             <Grid container sx={{ minHeight: '85vh', backgroundColor: "backgroundColor.default" }} direction="column" spacing={1} >
                 <Grid item xs={12}>
                     <div style={BackgroundHead}>

src/pages/Proof/Payment/Pay.js

@@ -80,7 +80,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/Proof/Payment/Pay_Creditor.js

@@ -60,7 +60,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/Proof/Reply_GLD/index.js

@@ -112,7 +112,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ minHeight: '110vh', backgroundColor: 'backgroundColor.default' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/Proof/Reply_Public/index.js

@@ -81,7 +81,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             (
                 <Grid container sx={{ width: '100%', backgroundColor: '#fff' }} direction="column"  justifyContent="flex-start" alignItems="center" >

src/pages/Proof/Search_GLD/index.js

@@ -90,7 +90,11 @@ const UserSearchPage_Individual = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ backgroundColor: 'backgroundColor.default' }} direction="column"
             >

src/pages/PublicNotice/ApplyForm/index.js

@@ -6,6 +6,7 @@ import * as DateUtils from "utils/DateUtils";
 import * as FormatUtils from "utils/FormatUtils";
 
 import {
+    Grid,
     Radio,
     FormControlLabel
 } from '@mui/material';
@@ -64,7 +65,11 @@ const ApplyForm = () => {
 
     return (
         isLoading ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <PublicNoticeApplyForm
                 loadedData={userData}

src/pages/PublicNotice/ListPanel/index.js

@@ -102,7 +102,11 @@ const PublicNotice = () => {
 
     return (
         isLoading ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container>
                 <Grid item xs={12}>

src/pages/PublicNotice/Search_GLD/index.js

@@ -90,7 +90,11 @@ const UserSearchPage_Individual = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ backgroundColor: 'backgroundColor.default' }}>
                 <Grid item xs={12}>

src/pages/User/DetailPage/index.js

@@ -202,7 +202,11 @@ const UserMaintainPage = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ minHeight: '90vh', backgroundColor: 'backgroundColor.default' }}>
                 <Grid item xs={12}>

src/pages/User/DetailsPage_Individual/index.js

@@ -118,7 +118,11 @@ const UserMaintainPage_Individual = () => {
 
     return (
         isLoading ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container direction="column" sx={{minHeight: '90vh', backgroundColor: isGLDLoggedIn()?'backgroundColor.default':'#ffffff', maxWidth:'100%' }}>
                 <Grid item xs={12}>

src/pages/User/DetailsPage_Organization/index.js

@@ -179,7 +179,11 @@ const UserMaintainPage_Organization = () => {
 
     return (
         isLoading ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ backgroundColor: isGLDLoggedIn()?'backgroundColor.default':'#ffffff' }}>
                 <Grid item xs={12}>

src/pages/User/GLDUserProfile/index.js

@@ -75,7 +75,11 @@ const UserMaintainPage = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{minHeight: '90vh',  backgroundColor: 'backgroundColor.default' }}direction="column"
             justifyContent="flex-start">

src/pages/User/SearchPage/index.js

@@ -70,7 +70,11 @@ const UserSettingPage = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ minHeight: '90vh', backgroundColor: "backgroundColor.default" }} direction="column">
                 <Grid item xs={12}>

src/pages/User/SearchPage_Individual/index.js

@@ -65,7 +65,11 @@ const UserSearchPage_Individual = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ minHeight: '90vh', backgroundColor: "backgroundColor.default" }} direction="column">
                 <Grid item xs={12}>

src/pages/User/SearchPage_Organization/index.js

@@ -66,7 +66,11 @@ const UserSearchPage_Organization = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{backgroundColor:"backgroundColor.default"}}>
                 <Grid item xs={12}>

src/pages/authentication/ForgotPassword/AfterForgotPasswordPage.js

@@ -3,33 +3,18 @@ import {
     Grid,
     Typography,
     Button,
-    // RadioGroup,
-    Dialog, DialogTitle, DialogContent, DialogActions,
     Stack, 
     InputLabel,
-    // OutlinedInput,
-    FormHelperText,
-    TextField,
-    IconButton, InputAdornment,
-    // Box,
-    // FormControl
 } from '@mui/material';
-import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
-// import { strengthColorChi, strengthIndicator } from 'utils/password-strength';
 
-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 * as FieldUtils from "utils/FieldUtils";
+
 import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
 import ForwardIcon from '@mui/icons-material/Forward';
 import MainCard from 'components/MainCard';
 
 
 import { useNavigate } from "react-router-dom";
-// import { notifyActionSuccess } from 'utils/CommonFunction';
 import {PNSPS_LONG_BUTTON_THEME} from "themes/buttonConst";
 import {ThemeProvider} from "@emotion/react";
 import {FormattedMessage, useIntl} from "react-intl";
@@ -37,13 +22,7 @@ import {FormattedMessage, useIntl} from "react-intl";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
 const AfterForgotPasswordPage = () => {
-    const [isWarningPopUp, setIsWarningPopUp] = React.useState(false);
-    const [showPassword, setShowPassword] = React.useState(false);
-    const [showConfirmPassword, setshowConfirmPassword] = React.useState(false);
-    // const [level, setLevel] = React.useState();
     const intl = useIntl();
-
-    // const [issueId, setIssueId] = React.useState(loadedData.issueId);
     const navigate = useNavigate();
 
     const BackgroundHead = {
@@ -56,49 +35,11 @@ const AfterForgotPasswordPage = () => {
         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 handleContinue = () => {
+        // setOpen(false);
+        navigate('/login');
     };
 
-    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(/^(?=.*[!@#%&])/, { 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)
-        }
-    });
-
     return (
         <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" alignItems="center">
             <Grid item xs={12} md={12} width="100%" >
@@ -122,11 +63,11 @@ const AfterForgotPasswordPage = () => {
             {/* <Grid item xs={12}>
                     <Typography variant="pnspsFormParagraphBold">申請公共啟事</Typography>
                 </Grid> */}
-            <Grid item xs={12} md={12} width={{ md: "60%", xs: "90%" }}>
+            <Grid item xs={12} md={12} width={{ sx:"90%", sm:"90%",md: "60%", xs: "90%" }}>
                 <MainCard
                     sx={{
-                    maxWidth: { xs: 400, sm:600, md:800, lg: 1000 },
-                    margin: { xs: 2.5, md: 3 },
+                    maxWidth: { xs: 400, sm:730, md:800, lg: 1000 },
+                    margin: { sm: 0, md: 3 },
                     '& > *': {
                         flexGrow: 1,
                         flexBasis: '50%'
@@ -136,253 +77,80 @@ const AfterForgotPasswordPage = () => {
                     border={false}
                     boxShadow
                 >
-                    <form onSubmit={formik.handleSubmit}>
-                        <Grid container spacing={4} sx={{ minHeight: {xs:"75vh", sm:"75vh", md: "70vh", lg:"70vh", xl:"50vh"} }} direction="column" justifyContent="flex-start" alignItems="center">
-                            <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { xs: 'none', sm: 'none', md: 'block' } }}>
-                                <InputLabel htmlFor="email-login-title">
-                                    <Typography variant="h5" >
-                                        <FormattedMessage id="forgotPasswordSubTitle"/>
-                                    </Typography>
-                                </InputLabel>
-                            </Grid>
-                            <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { md: 'none', xl: 'none', lg: 'none' } }}>
-                                <InputLabel htmlFor="email-login-title">
-                                    <Typography variant="h6" >
-                                        <FormattedMessage id="forgotPasswordSubTitle1"/>
-                                    </Typography>
-                                    <Typography variant="h6" >
-                                        <FormattedMessage id="forgotPasswordSubTitle2"/>
-                                    </Typography>
-                                </InputLabel>
-                            </Grid>
-                            <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
-                                <Grid container direction="row" justifyContent="flex-start">
-                                    <Grid item xs={12} md={12} lg={12}>
-                                        <TextField
-                                            fullWidth
-                                            onChange={formik.handleChange}
-                                            id="emailVerifyHash"
-                                            name="emailVerifyHash"
-                                            placeholder={intl.formatMessage({id: 'securityCode'})}
-                                            label={intl.formatMessage({id: 'securityCode'}) + ":"}
-                                            defaultValue={formik.values.emailVerifyHash}
-                                            value={formik.values.emailVerifyHash}
-                                            error={Boolean(formik.touched.emailVerifyHash && formik.errors.emailVerifyHash)}
-                                            onBlur={formik.handleBlur}
-                                            inputProps={{
-                                                maxLength: 50,
-                                                onKeyDown: (e) => {
-                                                    if (e.key === 'Enter') {
-                                                    e.preventDefault();
-                                                    }
-                                                },
-                                            }}
-                                            InputLabelProps={{
-                                                shrink: true
-                                            }}
-                                        />
-                                    </Grid>
-                                    {formik.touched.emailVerifyHash && formik.errors.emailVerifyHash && (
-                                        <FormHelperText error id="standard-weight-helper-text-username-login">
-                                        {formik.errors.emailVerifyHash}
-                                        </FormHelperText>
-                                    )}
+                    <Grid container spacing={4} sx={{ minHeight: {xs:"80vh", sm:"70vh", md: "70vh", lg:"70vh", xl:"50vh"} }} direction="column" justifyContent="flex-start" alignItems="center">
+                        <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { xs: 'none', sm: 'none', md: 'block' } }}>
+                            <Grid container direction="column" alignItems="center">
+                                <Grid item xs={12} md={12} lg={12} >
+                                    <InputLabel htmlFor="email-login-title1">
+                                        <Typography variant="h5" >
+                                            <FormattedMessage id="sentSecurityCode1"/>
+                                        </Typography>
+                                    </InputLabel>
                                 </Grid>
-                            </Grid>
-                            <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
-                                <Grid container direction="row" justifyContent="flex-start">
-                                    <Grid item xs={12} md={12} lg={12}>
-                                        <TextField
-                                            fullWidth
-                                            onChange={formik.handleChange}
-                                            id="username"
-                                            name="username"
-                                            placeholder={intl.formatMessage({id: 'userLoginName'})}
-                                            label={intl.formatMessage({id: 'userLoginName'}) + ":"}
-                                            defaultValue={formik.values.username}
-                                            value={formik.values.username}
-                                            error={Boolean(formik.touched.username && formik.errors.username)}
-                                            onBlur={formik.handleBlur}
-                                            inputProps={{
-                                                maxLength: 50,
-                                                onKeyDown: (e) => {
-                                                    if (e.key === 'Enter') {
-                                                    e.preventDefault();
-                                                    }
-                                                },
-                                            }}
-                                            InputLabelProps={{
-                                                shrink: true
-                                            }}
-                                        />
-                                    </Grid>
-                                    {formik.touched.username && formik.errors.username && (
-                                        <FormHelperText error id="standard-weight-helper-text-username-login">
-                                        {formik.errors.username}
-                                        </FormHelperText>
-                                    )}
+                                <Grid item xs={12} md={12} lg={12} >
+                                    <InputLabel htmlFor="email-login-title2">
+                                        <Typography variant="h5" >
+                                            <FormattedMessage id="sentSecurityCode2"/>
+                                        </Typography>
+                                    </InputLabel>
                                 </Grid>
+                                {/* <Grid item xs={12} md={12} lg={12} sx={{mt:3}}>
+                                    <InputLabel htmlFor="email-login-title3">
+                                        <Typography variant="h5" >
+                                            <FormattedMessage id="requireSecurityCode"/>
+                                        </Typography>
+                                    </InputLabel>
+                                </Grid> */}
                             </Grid>
-                            <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
-                                <Grid container direction="row" justifyContent="flex-start">
-                                    <Grid item xs={12} md={12} lg={12}>
-                                        <TextField
-                                            fullWidth
-                                            onChange={(e) => {
-                                                formik.handleChange(e);
-                                                changePassword(e.target.value);
-                                            }}
-                                            id="password"
-                                            type={showPassword ? 'text' : 'password'}
-                                            name="password"
-                                            placeholder={intl.formatMessage({id: 'userPassword'})}
-                                            label={intl.formatMessage({id: 'userPassword'}) + ":"}
-                                            // defaultValue={formik.values.password.trim()}
-                                            value={formik.values.password.trim()}
-                                            error={Boolean(formik.touched.password && formik.errors.password)}
-                                            onBlur={formik.handleBlur}
-                                            inputProps={{
-                                                onKeyDown: (e) => {
-                                                    if (e.key === 'Enter') {
-                                                    e.preventDefault();
-                                                    }
-                                                },
-                                            }}
-                                            InputLabelProps={{
-                                                shrink: true
-                                            }}
-                                            InputProps={{
-                                                endAdornment:(
-                                                    <InputAdornment position="end">
-                                                        <IconButton
-                                                            aria-label="toggle password visibility"
-                                                            onClick={handleClickShowPassword}
-                                                            onMouseDown={handleMouseDownPassword}
-                                                            edge="end"
-                                                            size="large"
-                                                        >
-                                                            {showPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
-                                                        </IconButton>
-                                                    </InputAdornment>
-                                                )
-                                            }}
-                                        />
-                                    </Grid>
-                                    {/* <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">
-                                                    <FormattedMessage id={level ? level?.label : "pwWeak" }/>
-                                                </Typography>
-                                            </Grid>
-                                        </Grid>
-                                    </FormControl> */}
-                                    {formik.touched.password && formik.errors.password && (
-                                        <FormHelperText error id="helper-text-password-signup">
-                                            {formik.errors.password}
-                                        </FormHelperText>
-                                    )}
+                        </Grid>
+                        <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { md: 'none', xl: 'none', lg: 'none' } }}>
+                            <Grid container direction="column" alignItems="center">
+                                <Grid item xs={12} md={12} lg={12} >
+                                    <InputLabel htmlFor="email-login-title1">
+                                        <Typography variant="h5" >
+                                            <FormattedMessage id="sentSecurityCode1"/>
+                                        </Typography>
+                                    </InputLabel>
                                 </Grid>
-                            </Grid>
-                            <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
-                                <Grid container direction="row" justifyContent="flex-start">
-                                    <Grid item xs={12} md={12} lg={12}>
-                                        <TextField
-                                            fullWidth
-                                            onChange={(e) => {
-                                                formik.handleChange(e);
-                                                // changePassword(e.target.value);
-                                            }}
-                                            id="confirmPassword"
-                                            type={showConfirmPassword ? 'text' : 'password'}
-                                            name="confirmPassword"
-                                            placeholder={intl.formatMessage({id: 'confirmPassword'})}
-                                            label={intl.formatMessage({id: 'confirmPassword'}) + ":"}
-                                            defaultValue={formik.values.confirmPassword.trim()}
-                                            value={formik.values.confirmPassword.trim()}
-                                            error={Boolean(formik.touched.confirmPassword && formik.errors.confirmPassword)}
-                                            onBlur={formik.handleBlur}
-                                            inputProps={{
-                                                maxLength: 50,
-                                                onKeyDown: (e) => {
-                                                    if (e.key === 'Enter') {
-                                                    e.preventDefault();
-                                                    }
-                                                },
-                                            }}
-                                            InputLabelProps={{
-                                                shrink: true
-                                            }}
-                                            InputProps={{
-                                                endAdornment:( 
-                                                    <InputAdornment position="end">
-                                                        <IconButton
-                                                            aria-label="toggle password visibility"
-                                                            onClick={handleClickShowConfirmPassword}
-                                                            onMouseDown={handleMouseDownPassword}
-                                                            edge="end"
-                                                            size="large"
-                                                        >
-                                                            {showConfirmPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
-                                                        </IconButton>
-                                                    </InputAdornment>
-                                                )
-                                            }}
-                                        />
-                                    </Grid>
-                                    {formik.touched.confirmPassword && formik.errors.confirmPassword && (
-                                        <FormHelperText error id="helper-text-confirmPassword-signup">
-                                            {formik.errors.confirmPassword}
-                                        </FormHelperText>
-                                    )}
+                                <Grid item xs={12} md={12} lg={12} >
+                                    <InputLabel htmlFor="email-login-title2">
+                                        <Typography variant="h5" >
+                                            <FormattedMessage id="sentSecurityCode3"/>
+                                        </Typography>
+                                    </InputLabel>
                                 </Grid>
+                                <Grid item xs={12} md={12} lg={12} >
+                                    <InputLabel htmlFor="email-login-title4">
+                                        <Typography variant="h5" >
+                                            <FormattedMessage id="sentSecurityCode4"/>
+                                        </Typography>
+                                    </InputLabel>
+                                </Grid>
+                                {/* <Grid item xs={12} md={12} lg={12} sx={{mt:3}}>
+                                    <InputLabel htmlFor="email-login-title3">
+                                        <Typography variant="h5" >
+                                            <FormattedMessage id="requireSecurityCode"/>
+                                        </Typography>
+                                    </InputLabel>
+                                </Grid> */}
                             </Grid>
-                            <Grid item xs={12} md={12} lg={12} mt={1} >
-                                <ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
-                                    <Button
-                                        aria-label={intl.formatMessage({id: 'continue'})}
-                                        variant="contained"
-                                        type="submit"
-                                    >
-                                        <FormattedMessage id="continue"/>
-                                    </Button>
-                                </ThemeProvider>
-                            </Grid>
                         </Grid>
-                    </form>
+                        <Grid item xs={12} md={12} lg={12} mt={1} sx={{mb:3}}>
+                            <ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
+                                <Button
+                                    aria-label={intl.formatMessage({id: 'continue'})}
+                                    variant="contained"
+                                    // type="submit"
+                                    onClick={()=>handleContinue()}
+                                >
+                                    <FormattedMessage id="continue"/>
+                                </Button>
+                            </ThemeProvider>
+                        </Grid>
+                    </Grid>
+
                 </MainCard>
             </Grid>
-            <div>
-                <Dialog
-                    open={isWarningPopUp}
-                    onClose={() => setIsWarningPopUp(false)}
-                    PaperProps={{
-                        sx: {
-                            minWidth: '40vw',
-                            maxWidth: { xs: '90vw', s: '90vw', m: '70vw', lg: '70vw' },
-                            maxHeight: { xs: '90vh', s: '70vh', m: '70vh', lg: '60vh' }
-                        }
-                    }}
-                >
-                    <DialogTitle>
-                        <FormattedMessage id="attention"/>
-                    </DialogTitle>
-                    <DialogContent style={{ display: 'flex', }}>
-                        {/* <Typography variant="h3" style={{ padding: '16px' }}>{warningText}</Typography> */}
-                    </DialogContent>
-                    <DialogActions>
-                        <Button
-                            aria-label={intl.formatMessage({id: 'ok'})}
-                            onClick={() => setIsWarningPopUp(false)}
-                        >
-                            <FormattedMessage id="ok" />
-                        </Button>
-                    </DialogActions>
-                </Dialog>
-            </div>
         </Grid>
     );
 };

src/pages/authentication/ForgotPassword/AuthCallback/index.js

@@ -1,85 +1,504 @@
-
+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';
 // ==============================|| 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 params = useParams()
+    const intl = useIntl();
+    
     React.useEffect(() => {
-        goLogin();
+        setEnterUseEffect(true)
     }, []);
 
-    function goLogin(){
-        dispatch(handleLogoutFunction());
+    React.useEffect(() => {
+        // console.log("if (enterUseEffect) handleVerify()");
+        if (enterUseEffect){
+            handleVerify()
+        } 
+    }, [enterUseEffect])
 
-        let params = new URLSearchParams(window.location.search)
-        if(params.get("code")){
-            HttpUtils.post({
-                url: UrlUtils.GET_SMART_LOGIN,
-                params:{
-                    code: params.get("code")
-                },
-                onSuccess: (responseData) => {
-                    console.log("responseData");
-                    console.log(responseData);
-                        const userData = {
-                          id: responseData.id,
-                          fullenName: responseData.name,
-                          fullchName: responseData.chName,
-                          email: responseData.email,
-                          type: responseData.type,
-                          role: responseData.role,
-                          abilities: responseData.abilities,
-                          creditor: responseData.creditor,
-                          locale: responseData.preferLocale,
-                          //avatar: require('src/assets/images/users/avatar-3.png').default,
+    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(true)
+                }
+                setLoding(false)
+            }
+        ).catch(error => {
+            console.log(error)
+            setVerifyState(true)
+            setLoding(false)
+        });
+
+        
+    }
+
+    const goLogin = async (values) =>{
+        dispatch(handleLogoutFunction());
+        console.log(username)
+        await axios.patch(UrlUtils.PATCH_FORGOT_PASSWORD_NEW_PASSWORD, {
+            params: {
+                username: username,
+                newPassword: values.password
+            }
+        }).then(
+            (response)=>{
+                if (response.status === 204) {
+                    useJwt
+                .login({ username: username, password: values.password })
+                .then((response) => {
+                // console.log(response)
+                    const userData = {
+                        id: response.data.id,
+                        fullenName: response.data.name,
+                        fullchName: response.data.chName,
+                        email: response.data.email,
+                        type: response.data.type,
+                        role: response.data.role,
+                        abilities: response.data.abilities,
+                        creditor: response.data.creditor,
+                        locale: response.data.preferLocale,
+                        //avatar: require('src/assets/images/users/avatar-3.png').default,
+                    }
+                    const data = { ...userData, accessToken: response.data.accessToken, refreshToken: response.data.refreshToken }
+                    // setSuccess(true)
+                    // console.log(response.data);
+                    if(response.data.type === "GLD"){
+                        setLocale("en");
+                        localStorage.setItem('locale','en');
+                    }else{
+                        if (response.data.preferLocale ==="zh_HK"){
+                        setLocale("zh-HK");
+                        localStorage.setItem('locale','zh-HK');
                         }
-                        const data = { ...userData, accessToken: responseData.accessToken, refreshToken: responseData.refreshToken }
-                        if(responseData.type === "GLD"){
-                            setLocale("en");
-                            localStorage.setItem('locale','en');
-                        }else{
-                            if (responseData.preferLocale ==="zh_HK"){
-                                setLocale("zh-HK");
-                                localStorage.setItem('locale','zh-HK');
-                            }
-                            if (responseData.preferLocale ==="zh-CN"){
-                                setLocale("zh-CN");
-                                localStorage.setItem('locale','zh-CN');
-                            }
+                        if (response.data.preferLocale ==="zh-CN"){
+                        setLocale("zh-CN");
+                        localStorage.setItem('locale','zh-CN');
                         }
-                        dispatch(handleLogin(data))
-                        navigate('/dashboard');
-                },
-                onFail: (response)=>{
-                    console.log("Fail");
-                    console.log(response);
-                    window.location.assign("/iamsmart/loginFail");
-                },
-                onError:(error)=>{
-                    console.log(error);
-                    window.location.assign("/iamsmart/loginFail");
+                    }
+                    dispatch(handleLogin(data))
+                    navigate('/dashboard');
+                    location.reload()
+                    // setSumitting(false)
+                    })
+                    .catch((error) => {
+                    // setSuccess(false)
+                    console.error(error)
+                    console.error(error.response.data.error)
+                    setErrorMassage(error.response.data.error)
+                    setOpen(true)
+                    });
+                } else {
+                    setVerifyState(true)
                 }
-            });
-        }else{
-            window.location.assign("/iamsmart/loginFail");
-        }
+                setLoding(false)
+            }
+        ).catch(error => {
+            console.log(error)
+            setVerifyState(true)
+            setLoding(false)
+        });
+        HttpUtils.patch({
+            url: UrlUtils.PATCH_FORGOT_PASSWORD_NEW_PASSWORD,
+            params:{
+                username: username,
+                newPassword: values.password
+            },
+            onSuccess: () => {
+                
+            },
+            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(/^(?=.*[!@#%&])/, { 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)
+        }
+    });
+
     return (
-            <LoadingComponent />
+        isLoading || verifyState == null ?
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
+            :
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" alignItems="center">
+                <Grid item xs={12} md={12} width="100%" >
+                    <div style={BackgroundHead}>
+                        <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
+                            <Typography ml={15} color='#FFF' variant="h4" sx={{display: { xs: 'none', sm: 'none', md: 'block' }}}>
+                                <FormattedMessage id="forgotUserPassword"/>
+                            </Typography>
+                        </Stack>
+                    </div>
+                </Grid>
+                {/* <Grid item xs={12} width={{xs:"90%", sm:"90%", md:"60%", lg:"60%"}}>
+                    <Button
+                        aria-label={intl.formatMessage({id: 'back'})}
+                        title={intl.formatMessage({id: 'back'})}
+                        sx={{ ml: 0, mt: 2.5 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate(-1) }}
+                    >
+                        <ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} />
+                    </Button>
+                </Grid> */}
+                {/* <Grid item xs={12}>
+                        <Typography variant="pnspsFormParagraphBold">申請公共啟事</Typography>
+                    </Grid> */}
+                <Grid item xs={12} md={12} width={{ sx:"90%", sm:"90%",md: "60%", xs: "90%" }}>
+                    <MainCard
+                        sx={{
+                        maxWidth: { xs: 400, sm:730, md:800, lg: 1000 },
+                        margin: { sm: 0, md: 3 },
+                        '& > *': {
+                            flexGrow: 1,
+                            flexBasis: '50%'
+                        }
+                        }}
+                        content={false}
+                        border={false}
+                        boxShadow
+                    >
+                        <form onSubmit={formik.handleSubmit}>
+                            {verifyState ?
+                                // SUCCESS page
+                                <Grid container spacing={4} sx={{ minHeight: {xs:"80vh", sm:"50vh", md: "50vh", lg:"70vh", xl:"50vh"} }} direction="column" justifyContent="flex-start" alignItems="center">
+                                    <Grid container direction="column" alignItems="center">
+                                        <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, }}>
+                                            <Typography display="inline" variant="h4">
+                                                <FormattedMessage id="verifySuccess"/>
+                                            </Typography>
+                                        </Grid>
+                                        <Grid item xs={12} md={12} lg={12} sx={{ mb: 1,}}>
+                                            <InputLabel htmlFor="email-login-title3">
+                                                <Typography variant="h5" >
+                                                    <FormattedMessage id="setNewPassword"/>
+                                                </Typography>
+                                            </InputLabel>
+                                        </Grid>
+                                    </Grid>
+                                    {/* <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
+                                        <Grid container direction="row" justifyContent="flex-start">
+                                            <Grid item xs={12} md={12} lg={12}>
+                                                <TextField
+                                                    fullWidth
+                                                    onChange={formik.handleChange}
+                                                    id="emailVerifyHash"
+                                                    name="emailVerifyHash"
+                                                    label={intl.formatMessage({id: 'securityCode'}) + ":"}
+                                                    placeholder={intl.formatMessage({id: 'securityCode'})}
+                                                    defaultValue={formik.values.emailVerifyHash}
+                                                    value={formik.values.emailVerifyHash}
+                                                    error={Boolean(formik.touched.emailVerifyHash && formik.errors.emailVerifyHash)}
+                                                    onBlur={formik.handleBlur}
+                                                    inputProps={{
+                                                        maxLength: 50,
+                                                        onKeyDown: (e) => {
+                                                            if (e.key === 'Enter') {
+                                                            e.preventDefault();
+                                                            }
+                                                        },
+                                                    }}
+                                                    InputLabelProps={{
+                                                        shrink: true
+                                                    }}
+                                                />
+                                            </Grid>
+                                            {formik.touched.emailVerifyHash && formik.errors.emailVerifyHash && (
+                                                <FormHelperText error id="standard-weight-helper-text-username-login">
+                                                {formik.errors.emailVerifyHash}
+                                                </FormHelperText>
+                                            )}
+                                        </Grid>
+                                    </Grid> */}
+                                    <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
+                                        <Grid container direction="row" justifyContent="flex-start">
+                                            <Grid item xs={12} md={12} lg={12}>
+                                                <TextField
+                                                    fullWidth
+                                                    id="username"
+                                                    name="username"
+                                                    label={intl.formatMessage({id: 'userLoginName'}) + ":"}
+                                                    placeholder={intl.formatMessage({id: 'userLoginName'})}
+                                                    defaultValue={username}
+                                                    value={username}
+                                                    disabled={true}                                                />
+                                            </Grid>
+                                        </Grid>
+                                    </Grid>
+                                    <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
+                                        <Grid container direction="row" justifyContent="flex-start">
+                                            <Grid item xs={12} md={12} lg={12}>
+                                                <TextField
+                                                    fullWidth
+                                                    onChange={(e) => {
+                                                        formik.handleChange(e);
+                                                        changePassword(e.target.value);
+                                                    }}
+                                                    id="password"
+                                                    type={showPassword ? 'text' : 'password'}
+                                                    name="password"
+                                                    label={intl.formatMessage({id: 'newPassword'}) + ":"}
+                                                    placeholder={intl.formatMessage({id: 'newPassword'})}
+                                                    // defaultValue={formik.values.password.trim()}
+                                                    value={formik.values.password.trim()}
+                                                    error={Boolean(formik.touched.password && formik.errors.password)}
+                                                    onBlur={formik.handleBlur}
+                                                    inputProps={{
+                                                        onKeyDown: (e) => {
+                                                            if (e.key === 'Enter') {
+                                                            e.preventDefault();
+                                                            }
+                                                        },
+                                                    }}
+                                                    InputLabelProps={{
+                                                        shrink: true
+                                                    }}
+                                                    InputProps={{
+                                                        endAdornment:(
+                                                            <InputAdornment position="end">
+                                                                <IconButton
+                                                                    aria-label="toggle password visibility"
+                                                                    onClick={handleClickShowPassword}
+                                                                    onMouseDown={handleMouseDownPassword}
+                                                                    edge="end"
+                                                                    size="large"
+                                                                >
+                                                                    {showPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
+                                                                </IconButton>
+                                                            </InputAdornment>
+                                                        )
+                                                    }}
+                                                />
+                                            </Grid>
+                                            {/* <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">
+                                                            <FormattedMessage id={level ? level?.label : "pwWeak" }/>
+                                                        </Typography>
+                                                    </Grid>
+                                                </Grid>
+                                            </FormControl> */}
+                                            {formik.touched.password && formik.errors.password && (
+                                                <FormHelperText error id="helper-text-password-signup">
+                                                    {formik.errors.password}
+                                                </FormHelperText>
+                                            )}
+                                        </Grid>
+                                    </Grid>
+                                    <Grid item xs={12} md={12} lg={12} width={{xs:"70%", sm:"60%",md:"50%", lg:"50%"}}>
+                                        <Grid container direction="row" justifyContent="flex-start">
+                                            <Grid item xs={12} md={12} lg={12}>
+                                                <TextField
+                                                    fullWidth
+                                                    onChange={(e) => {
+                                                        formik.handleChange(e);
+                                                        // changePassword(e.target.value);
+                                                    }}
+                                                    id="confirmPassword"
+                                                    type={showConfirmPassword ? 'text' : 'password'}
+                                                    name="confirmPassword"
+                                                    label={intl.formatMessage({id: 'confirmPassword'}) + ":"}
+                                                    placeholder={intl.formatMessage({id: 'confirmPassword'})}
+                                                    defaultValue={formik.values.confirmPassword.trim()}
+                                                    value={formik.values.confirmPassword.trim()}
+                                                    error={Boolean(formik.touched.confirmPassword && formik.errors.confirmPassword)}
+                                                    onBlur={formik.handleBlur}
+                                                    inputProps={{
+                                                        maxLength: 50,
+                                                        onKeyDown: (e) => {
+                                                            if (e.key === 'Enter') {
+                                                            e.preventDefault();
+                                                            }
+                                                        },
+                                                    }}
+                                                    InputLabelProps={{
+                                                        shrink: true
+                                                    }}
+                                                    InputProps={{
+                                                        endAdornment:( 
+                                                            <InputAdornment position="end">
+                                                                <IconButton
+                                                                    aria-label="toggle password visibility"
+                                                                    onClick={handleClickShowConfirmPassword}
+                                                                    onMouseDown={handleMouseDownPassword}
+                                                                    edge="end"
+                                                                    size="large"
+                                                                >
+                                                                    {showConfirmPassword ? <EyeOutlined /> : <EyeInvisibleOutlined />}
+                                                                </IconButton>
+                                                            </InputAdornment>
+                                                        )
+                                                    }}
+                                                />
+                                            </Grid>
+                                            {formik.touched.confirmPassword && formik.errors.confirmPassword && (
+                                                <FormHelperText error id="helper-text-confirmPassword-signup">
+                                                    {formik.errors.confirmPassword}
+                                                </FormHelperText>
+                                            )}
+                                        </Grid>
+                                    </Grid>
+                                    <Grid item xs={12} md={12} lg={12} mt={1} sx={{mb:3}}>
+                                        <ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
+                                            <Button
+                                                aria-label={intl.formatMessage({id: 'confirm'})}
+                                                variant="contained"
+                                                type="submit"
+                                                // onClick={()=>goLogin()}
+                                            >
+                                                <FormattedMessage id="confirm"/>
+                                            </Button>
+                                        </ThemeProvider>
+                                    </Grid>
+                                </Grid>
+                                :
+                                // ERROR page
+                                <Grid container spacing={4} sx={{ minHeight: {xs:"80vh", sm:"70vh", md: "70vh", lg:"70vh", xl:"50vh"} }} direction="column" justifyContent="flex-start" alignItems="center">
+                                    <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { xs: 'none', sm: 'none', md: 'block' } }}>
+                                         {/* <Button disabled={true} hidden={true} variant="contained" type="submit" sx={{ fontSize: 12,height:'25px'}}>Submit</Button> */}
+                                        <CancelOutlinedIcon color="error" sx={{ width: "200px", height: "200px" }} />
+                                    </Grid>  
+                                    <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { xs: 'none', sm: 'none', md: 'block' } }}>
+                                        <Typography display="inline" variant="h4">驗證失敗，請聯絡相關的系統管理員協助。</Typography>
+                                    </Grid>
+                                    <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { xs: 'none', sm: 'none', md: 'block' } }}>
+                                        <Button color="error" variant="outlined" component={Link} to="/login">
+                                            <Typography variant="h5">
+                                                <FormattedMessage id="backToLogin"/>
+                                            </Typography>
+                                        </Button>
+                                    </Grid>
+                                </Grid>
+                            }
+                            
+                            <Grid container spacing={4} sx={{ minHeight: {xs:"80vh", sm:"70vh", md: "70vh", lg:"70vh", xl:"50vh"} }} direction="column" justifyContent="flex-start" alignItems="center">
+                                
+                            </Grid>
+                        </form>
+                    </MainCard>
+                </Grid>
+            </Grid>
     );
 };
 

src/pages/authentication/ForgotPassword/ForgotPasswordApplyForm.js

@@ -60,6 +60,7 @@ const ForgotPasswordApplyForm = () => {
         }),
         onSubmit: values => {
             console.log(values)
+            navigate('/forgot/password/sent');
      
             // HttpUtils.postWithFiles({
             //     url: UrlUtils.POST_PUBLIC_NOTICE_APPLY,
@@ -115,7 +116,7 @@ const ForgotPasswordApplyForm = () => {
                 <MainCard
                     sx={{
                     maxWidth: { xs: 400, sm:600, md:800, lg: 1000 },
-                    margin: { xs: 2.5, md: 3 },
+                    margin: { sm: 2.5, md: 3 },
                     '& > *': {
                         flexGrow: 1,
                         flexBasis: '50%'
@@ -135,7 +136,7 @@ const ForgotPasswordApplyForm = () => {
                                 </InputLabel>
                             </Grid>
                             <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { md: 'none', xl: 'none', lg: 'none' } }}>
-                                <InputLabel htmlFor="email-login-title">
+                                <InputLabel htmlFor="email-login-subtitle">
                                     <Typography variant="h6" >
                                         <FormattedMessage id="forgotPasswordSubTitle1"/>
                                     </Typography>

src/pages/authentication/ForgotPassword/index.js

@@ -5,10 +5,9 @@ import * as React from "react";
 // import * as DateUtils from "utils/DateUtils";
 // import * as FormatUtils from "utils/FormatUtils";
 
-// import {
-//     Radio,
-//     FormControlLabel
-// } from '@mui/material';
+import {
+    Grid
+} from '@mui/material';
 
 import Loadable from 'components/Loadable';
 import { lazy } from 'react';
@@ -33,7 +32,11 @@ const ApplyForm = () => {
 
     return (
         isLoading ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <ForgotPasswordApplyForm
                 // loadedData={userData}

src/pages/authentication/Verify.js

@@ -42,12 +42,12 @@ export default function Verify() {
     }
 
     useEffect(() => {
-        console.log("setEnterUseEffect(true)");
+        // console.log("setEnterUseEffect(true)");
         setEnterUseEffect(true)
     }, [])
 
     useEffect(() => {
-        console.log("if (enterUseEffect) handleVerify()");
+        // console.log("if (enterUseEffect) handleVerify()");
         if (enterUseEffect) handleVerify()
     }, [enterUseEffect])
 
@@ -56,26 +56,38 @@ export default function Verify() {
         <Stack sx={{ width: '100%', fontSize: '2rem', paddingTop: '65px' }} alignItems="center">
             <AuthWrapper>
                 {isLoading || verifyState == null ?
-                    <LoadingComponent /> :
+                    <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                        <Grid item>
+                            <LoadingComponent />
+                        </Grid>
+                    </Grid> :
                     <Grid item xs={12}>
                         {verifyState ?
                             // SUCCESS page
                             <Stack mt={1} direction="column" justifyContent="flex-start" alignItems="center" spacing={2}>
                                 <CheckCircleOutlineIcon color="success" sx={{ width: "200px", height: "200px" }} />
-                                <Typography display="inline" variant="h4">帳戶已成功驗證。</Typography>
-                                <Button variant="outlined" component={Link} to="/login"><Typography variant="h5">
-                                    <FormattedMessage id="backToLogin"/>
-                                </Typography></Button>
+                                <Typography display="inline" variant="h4">
+                                    <FormattedMessage id="verifySuccess"/>
+                                </Typography>
+                                <Button variant="outlined" component={Link} to="/login">
+                                    <Typography variant="h5">
+                                        <FormattedMessage id="backToLogin"/>
+                                    </Typography>
+                                </Button>
                             </Stack>
                             :
                             // ERROR page
                             <Stack mt={1} direction="column" justifyContent="flex-start" alignItems="center" spacing={2}>
                                 {/* <Button disabled={true} hidden={true} variant="contained" type="submit" sx={{ fontSize: 12,height:'25px'}}>Submit</Button> */}
                                 <CancelOutlinedIcon color="error" sx={{ width: "200px", height: "200px" }} />
-                                <Typography display="inline" variant="h4">驗證失敗，請聯絡相關的系統管理員協助。</Typography>
-                                <Button color="error" variant="outlined" component={Link} to="/login"><Typography variant="h5">
-                                    <FormattedMessage id="backToLogin"/>
-                                </Typography></Button>
+                                <Typography display="inline" variant="h4">
+                                    <FormattedMessage id="verifyFail"/>
+                                </Typography>
+                                <Button color="error" variant="outlined" component={Link} to="/login">
+                                    <Typography variant="h5">
+                                        <FormattedMessage id="backToLogin"/>
+                                    </Typography>
+                                </Button>
                             </Stack>
                         }
                     </Grid>

src/pages/iAmSmart/AuthCallback/index.js

@@ -8,7 +8,9 @@ import { handleLogoutFunction, handleLogin } from 'auth/index';
 
 import Loadable from 'components/Loadable';
 const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
-
+import {
+    Grid,
+} from '@mui/material';
 
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
@@ -79,7 +81,11 @@ const Index = () => {
     }
 
     return (
-            <LoadingComponent />
+        <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+            <Grid item>
+                <LoadingComponent />
+            </Grid>
+        </Grid>
     );
 };
 

src/pages/iAmSmart/DirectLoginCallback/index.js

@@ -8,7 +8,9 @@ import { handleLogoutFunction, handleLogin } from 'auth/index';
 
 import Loadable from 'components/Loadable';
 const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
-
+import {
+    Grid,
+} from '@mui/material';
 
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
@@ -64,7 +66,11 @@ const Index = () => {
     }
 
     return (
-            <LoadingComponent />
+        <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+            <Grid item>
+                <LoadingComponent />
+            </Grid>
+        </Grid>
     );
 };
 

src/pages/iAmSmart/FailCallback/index.js

@@ -24,7 +24,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
       
                 <Grid container sx={{ height: '100%', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >

src/pages/iAmSmart/RegistryCallback/index.js

@@ -5,7 +5,9 @@ import * as UrlUtils from "utils/ApiPathConst";
 import { useNavigate } from "react-router-dom";
 import Loadable from 'components/Loadable';
 const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
-
+import {
+    Grid,
+} from '@mui/material';
 
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
@@ -44,7 +46,11 @@ const Index = () => {
     }
 
     return (
-            <LoadingComponent />
+        <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+            <Grid item>
+                <LoadingComponent />
+            </Grid>
+        </Grid>
     );
 };
 

src/pages/iAmSmart/SuccessCallback/index.js

@@ -32,7 +32,11 @@ const Index = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
                 <Grid item xs={12} width="100%">

src/pages/pnspsUserGroupDetailPage/index.js

@@ -167,7 +167,11 @@ const UserMaintainPage = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ backgroundColor: "backgroundColor.default" }}>
                 <Grid item xs={12}>

src/pages/pnspsUserGroupSearchPage/index.js

@@ -73,7 +73,11 @@ const UserGroupSearchPanel = () => {
 
     return (
         !onReady ?
-            <LoadingComponent />
+            <Grid container sx={{ minHeight: '95vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
+                <Grid item>
+                    <LoadingComponent />
+                </Grid>
+            </Grid>
             :
             <Grid container sx={{ minHeight: '90vh', backgroundColor: "backgroundColor.default"}} direction="column">
                 <Grid item xs={12}>

src/routes/AfterLoginRoutes.js

@@ -48,6 +48,22 @@ const AfterLoginRoutes = {
       path: 'verify/:verifyCode/:email',
       element: <Navigate to="/dashboard" />
     },
+    {
+      path: 'forgot/password',
+      element: <Navigate to="/dashboard" />
+    },
+    {
+      path: 'forgot/password/sent',
+      element: <Navigate to="/dashboard" />
+    },
+    {
+      path: 'forgot/password/verify',
+      element: <Navigate to="/dashboard" />
+    },
+    {
+      path: 'forgot/password/loginFail',
+      element: <Navigate to="/dashboard" />
+    },
   ]
 };
 

src/routes/LoginRoutes.js

@@ -14,6 +14,7 @@ const IAmSmartRegister = Loadable(lazy(() => import('pages/authentication/IAmSma
 const ErrorPage = Loadable(lazy(() => import('pages/extra-pages/ErrorPage')));
 const ForgotPassword = Loadable(lazy(() => import('pages/authentication/ForgotPassword')));
 const AfterForgotPasswordPage = Loadable(lazy(() => import('pages/authentication/ForgotPassword/AfterForgotPasswordPage')));
+const ForgotPassword_Callback = Loadable(lazy(() => import('pages/authentication/ForgotPassword/AuthCallback')));
 
 const IAmSmart_DirectLoginCallback = Loadable(lazy(() => import('pages/iAmSmart/DirectLoginCallback')));
 //const IAmSmart_FallCallback = Loadable(lazy(() => import('pages/iAmSmart/FallCallback')));
@@ -107,9 +108,17 @@ const LoginRoutes = {
       element: <ForgotPassword/>
     },
     {
-      path: 'forgot/password/verify',
+      path: 'forgot/password/sent',
       element: <AfterForgotPasswordPage/>
     },
+    {
+      path: 'forgot/password/verify/:verifyCode/:email',
+      element: <ForgotPassword_Callback/>
+    },
+    {
+      path: 'forgot/password/loginFail',
+      element: <IAmSmart_FailCallback/>
+    },
   ]
 };
 

src/translations/en.json

@@ -69,12 +69,18 @@
   "register": "Register",
   "userLoginName": "Username",
   "userPassword": "Password",
+  "newPassword": "New Password",
+  "setNewPassword": "Please enter new password",
   "forgotUserPassword": "Forgot Password",
   "forgotPasswordTitle": "Find Your Account",
   "forgotPasswordSubTitle": "Please enter your username to receive the code to reset your password",
   "forgotPasswordSubTitle1": "Please enter your username to receive",
   "forgotPasswordSubTitle2": "the code to reset your password",
   "securityCode": "Security Code",
+  "sentSecurityCode1": "We sent your code to your setting email",
+  "sentSecurityCode2": "Please check your emails for a message with your code.",
+  "sentSecurityCode3": "Please check your emails for ",
+  "sentSecurityCode4": "a message with your code.",
   "requireSecurityCode": "Please enter security code",
   "learnMore": "Learn More",
   "createOrReActivate": "Create account",
@@ -150,6 +156,8 @@
   "acceptTerms": "I accept",
   "rejectTerms": "I do not accept",
   "verify": "Verify",
+  "verifySuccess": "Account verified successfully",
+  "verifyFail": "Verification failed, please contact the relevant system administrator for assistance.",
   "validVerify": "Please enter valid verification",
   "requiredValid": "Please enter valid ",
   "require": "Please enter ",

src/translations/zh-CN.json

@@ -69,12 +69,18 @@
   "register": "申请",
   "userLoginName": "用户登入名称",
   "userPassword": "密码",
+  "newPassword": "新密码",
+  "setNewPassword": "请输入新密码",
   "forgotUserPassword": "忘记密码",
   "forgotPasswordTitle": "寻找你的帐号",
   "forgotPasswordSubTitle": "请输入你的用户登入名称以重设密码",
   "forgotPasswordSubTitle1": "请输入你的用户登入名称收",
   "forgotPasswordSubTitle2": "以重设密码",
   "securityCode": "安全验证码",
+  "sentSecurityCode1": "我们已将验证码送至你的电邮：",
+  "sentSecurityCode2": "请查看你的电子邮件信箱中是否有包含验证码的信件。",
+  "sentSecurityCode3": "请查看你的电子邮件信箱中",
+  "sentSecurityCode4": "是否有包含验证码的信件。",
   "requireSecurityCode": "请输入安全验证码",
   "learnMore": "了解更多",
   "createOrReActivate": "建立帐户",
@@ -112,6 +118,8 @@
   "requireAtLeast2Number": "请输入最少2位数字",
   "requireDialingCode": "请输入国际区号",
   "requireVerify": "请输入验证",
+  "verifySuccess": "帐户已成功验证。",
+  "verifyFail": "验证失败，请联络相关的系统管理员协助。",
   "dialingCode": "国际区号",
   "userFaxNumber": "传真号码",
   "userIdDoc": "身份证明文件",

src/translations/zh-HK.json

@@ -69,13 +69,20 @@
   "register": "申請",
   "userLoginName": "用戶登入名稱",
   "userPassword": "密碼",
+  "newPassword": "新密碼",
+  "setNewPassword": "請輸入新密碼",
   "forgotUserPassword": "忘記密碼",
   "forgotPasswordTitle": "尋找你的帳號",
   "forgotPasswordSubTitle": "請輸入你的用戶登入名稱以重設密碼",
   "forgotPasswordSubTitle1": "請輸入你的用戶登入名稱",
   "forgotPasswordSubTitle2": "以重設密碼",
   "securityCode": "安全驗證碼",
+  "sentSecurityCode1": "我們已將驗證碼送至你的電郵：",
+  "sentSecurityCode2": "請查看你的電子郵件信箱中是否有包含驗證碼的信件。",
+  "sentSecurityCode3": "請查看你的電子郵件信箱中",
+  "sentSecurityCode4": "是否有包含驗證碼的信件。",
   "requireSecurityCode": "請輸入安全驗證碼",
+  
   "learnMore": "了解更多",
   "createOrReActivate": "建立帳戶",
   "usernameTaken": "此用戶登入名稱已被注冊，請使用其他用戶登入名稱",
@@ -150,6 +157,8 @@
   "acceptTerms": "我接受",
   "rejectTerms": "我不接受",
   "verify": "驗證",
+  "verifySuccess": "帳戶已成功驗證。",
+  "verifyFail": "驗證失敗，請聯絡相關的系統管理員協助。",
   "validVerify": "請輸入有效驗證",
   "requiredValid": "請輸入有效的",
   "require": "請輸入",

src/utils/ApiPathConst.js

@@ -73,6 +73,8 @@ export const GET_USERNAME = apiPath+'/user/username';
 export const GET_USER_EMAIL = apiPath+'/user/email';
 export const GET_ID = apiPath+'/user/verifyID';
 export const GET_VERIFY_USER_ACCOUNT = apiPath+'/user/verifyEmail';
+export const GET_FORGOT_PASSWORD_VERIFY_USER_ACCOUNT = apiPath+'/user/verifyForgotPasswordEmail';
+export const PATCH_FORGOT_PASSWORD_NEW_PASSWORD = apiPath+'/user/forgotPassword/newPassword';
 
 
 //Public