diff --git a/src/pages/authentication/auth-forms/BusCustomFormWizard.js b/src/pages/authentication/auth-forms/BusCustomFormWizard.js index 9c43ce4..a30ed67 100644 --- a/src/pages/authentication/auth-forms/BusCustomFormWizard.js +++ b/src/pages/authentication/auth-forms/BusCustomFormWizard.js @@ -48,6 +48,7 @@ import CancelOutlinedIcon from '@mui/icons-material/CancelOutlined'; import { Link } from 'react-router-dom'; import * as HttpUtils from "../../../utils/HttpUtils" +import LoopIcon from '@mui/icons-material/Loop'; //import { Invaild } from 'utils/IconUtils'; // ============================|| FIREBASE - REGISTER ||============================ // @@ -111,21 +112,25 @@ const BusCustomFormWizard = (props) => { // localStorage.setItem("checkCode",null); // localStorage.setItem("base64Url",null); // }else{ - HttpUtils.post({ - url: POST_CAPTCHA, - params:{width: 100, height: 40}, - onSuccess:(responseData)=>{ - localStorage.setItem("checkCode",responseData.checkCode); - localStorage.setItem("base64Url",responseData.base64Url); - setCaptcha(localStorage.getItem('checkCode')); - setCaptchaImage(localStorage.getItem('base64Url')); - } - }); + onCaptchaChange(); // } }, []); + const onCaptchaChange = ()=>{ + HttpUtils.post({ + url: POST_CAPTCHA, + params:{width: 130, height: 40}, + onSuccess:(responseData)=>{ + localStorage.setItem("checkCode",responseData.checkCode); + localStorage.setItem("base64Url",responseData.base64Url); + setCaptcha(localStorage.getItem('checkCode')); + setCaptchaImage(localStorage.getItem('base64Url')); + } + }); + } + const checkDataField = (data)=> { // console.log(data.brExpiryDate) if (data.username !==""&& @@ -141,10 +146,12 @@ const BusCustomFormWizard = (props) => { data.phoneCountryCode !==""&& termsAndConAccept == true&& fileList.length!==0&& + data.captchaField&& handlePassword(data.password)&& handleEmail(data.email)&& handlePhone(data.phone)&& - handleUserName(data.username) + handleUserName(data.username)&& + handleCaptcha(data.captchaField) ) { setisValid(true) @@ -342,6 +349,10 @@ const BusCustomFormWizard = (props) => { } } + function handleCaptcha(captchaField) { + return captchaField == captcha; + } + function handlePassword(password) { let new_pass = password; // regular expressions to validate password @@ -416,7 +427,7 @@ const BusCustomFormWizard = (props) => { fax: yup.string().min(8,'請輸入最少8位數字'), brExpiryDate: yup.string().min(8,'請輸入商業登記證有效日期'), brNo: yup.string().min(8,'請輸入商業登記證號碼'), - captchaField: yup.string().test("match", "Invalid", function(val){return val == captcha;}) + captchaField: yup.string().required('請輸入驗證').oneOf([captcha], '請輸入有效驗證'), }) }); @@ -1055,28 +1066,8 @@ const BusCustomFormWizard = (props) => { - - - - - - - - { - const value = event.target.value; - formik.setFieldValue("captchaField",value); - }} - sx={{width:'75%'}} - /> - - - - + + @@ -1164,6 +1155,47 @@ const BusCustomFormWizard = (props) => { + + + + + 驗證 + * + + + + + + + {onCaptchaChange()}}> + + + + + { + const value = event.target.value; + formik.setFieldValue("captchaField",value); + }} + sx={{width:'75%'}} + /> + + + {formik.touched.captchaField && formik.errors.captchaField && ( + + {formik.errors.captchaField} + + )} + + +