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

update

master
cyril.tsui 2 years ago
parent
ae77186d9e
commit
4fc037c21d
6 changed files with 138 additions and 41 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -1
      src/components/FiDataGrid.js
  2. +2
    -2
      src/pages/PublicNotice/ListPanel/BaseGrid.js
  3. +1
    -1
      src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
  4. +72
    -29
      src/pages/authentication/auth-forms/BusCustomFormWizard.js
  5. +61
    -7
      src/pages/authentication/auth-forms/CustomFormWizard.js
  6. +1
    -1
      src/utils/ApiPathConst.js

+ 1
- 1
src/components/FiDataGrid.js View File

@@ -14,7 +14,7 @@ export function FiDataGrid({ rows, columns, sx, autoHeight,
const [_columns, set_columns] = React.useState([]);
const [_rowModesModel, set_rowModesModel] = React.useState({});
const [_editMode, set_editMode] = React.useState("row");
const [_pageSizeOptions, set_pageSizeOptions] = React.useState([5, 10, 25]);
const [_pageSizeOptions, set_pageSizeOptions] = React.useState([10, 25, 50]);

const [_autoHeight, set_autoHeight] = React.useState(true);
const [myHideFooterSelectedRowCount, setMyHideFooterSelectedRowCount] = React.useState(true);


+ 2
- 2
src/pages/PublicNotice/ListPanel/BaseGrid.js View File

@@ -90,13 +90,13 @@ export default function BaseGrid({rows}) {
}

return (
<div style={{height: 400, width: '100%', padding: 4}}>
<div style={{height: '100%', width: '100%', padding: 4}}>
<FiDataGrid
rows={rows}
columns={columns}
initialState={{
pagination: {
paginationModel: {page: 0, pageSize: 5},
paginationModel: {page: 0, pageSize: 10},
},
}}
onRowDoubleClick={handleRowDoubleClick}


+ 1
- 1
src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js View File

@@ -101,7 +101,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
columns={columns}
initialState={{
pagination: {
paginationModel: { page: 0, pageSize: 5 },
paginationModel: { page: 0, pageSize: 10 },
},
}}
onRowDoubleClick={handleRowDoubleClick}


+ 72
- 29
src/pages/authentication/auth-forms/BusCustomFormWizard.js View File

@@ -30,7 +30,7 @@ import * as yup from 'yup';
import { strengthColorChi, strengthIndicator } from 'utils/password-strength';
// import {apiPath} from "auth/utils";
import axios from "axios";
import { POST_PUBLIC_USER_REGISTER, POST_CAPTCHA, GET_USERNAME } from "utils/ApiPathConst";
import { POST_PUBLIC_USER_REGISTER, POST_CAPTCHA, GET_USERNAME, GET_USER_EMAIL } from "utils/ApiPathConst";
// import * as HttpUtils from 'utils/HttpUtils';
import * as ComboData from "utils/ComboData";

@@ -65,7 +65,7 @@ const BusCustomFormWizard = (props) => {
const [checkUpload, setCheckUpload] = useState(false);
const [isLoading, setLoding] = useState(true);
const [updateRows, setUpdateRows] = useState([]);
const [userNameList, setUserNameList] = useState([]);
// const [userNameList, setUserNameList] = useState([]);

const [captcha, setCaptcha] = useState([]);
const [captchaImg, setCaptchaImage] = useState([]);
@@ -92,7 +92,12 @@ const BusCustomFormWizard = (props) => {
const [termsAndConNotAccept, setTermsAndConNotAccept] = useState(false);
const [isValid, setisValid] = useState(false);
const [checkCountry, setCheckCountry] = useState(false);
const username = document.getElementById("username-login")
const [checkUsername, setCheckUsername] = useState(false);
const [checkUsernameBlur, setCheckUsernameBlur] = useState(false)
const email = document.getElementById("email-login")
const [checkEmail, setCheckEmail] = useState(false)
const [checkEmailBlur, setCheckEmailBlur] = useState(false)

const address4ComboList = ComboData.district;
const address5ComboList = ComboData.country;
@@ -115,19 +120,19 @@ const BusCustomFormWizard = (props) => {
// localStorage.setItem("checkCode",null);
// localStorage.setItem("base64Url",null);
// }else{
onCaptchaChange();
// }
axios.get(`${GET_USERNAME}`)
.then((response) => {
if (response.status === 200) {
setUserNameList(response.data);
}
// onCaptchaChange();
// // }
// axios.get(`${GET_USERNAME}`)
// .then((response) => {
// if (response.status === 200) {
// setUserNameList(response.data);
// }

})
.catch(error => {
console.log(error);
return false;
});
// })
// .catch(error => {
// console.log(error);
// return false;
// });
}, []);

const handleCheckUsername = async () => {
@@ -142,6 +147,48 @@ const BusCustomFormWizard = (props) => {
}
}

const handleCheckEmail = async () => {
if (values?.email) {
const response = await axios.get(`${GET_USER_EMAIL}`, {
params: {
email: values.email,
}
})
setCheckEmail((Number(response.data[0]) === 1))
return Number(response.data[0]) === 1
}
}

useEffect(() => {
if (username) {
username.addEventListener("blur", function () {
setCheckUsernameBlur(true)
})
}
}, [username])

useEffect(() => {
if (checkUsernameBlur) {
handleCheckUsername()
setCheckUsernameBlur(false)
}
}, [checkUsernameBlur])

useEffect(() => {
if (email) {
email.addEventListener("blur", function () {
setCheckEmailBlur(true)
})
}
}, [email])

useEffect(() => {
if (checkEmailBlur) {
handleCheckEmail()
setCheckEmailBlur(false)
}
}, [checkEmailBlur])

const onCaptchaChange = () => {
HttpUtils.post({
url: POST_CAPTCHA,
@@ -355,6 +402,7 @@ const BusCustomFormWizard = (props) => {
formData.append("userFaxNo", JSON.stringify(userFaxNo));
formData.append("busUserContactTel", JSON.stringify(busUserContactTel));
formData.append("busUserAddress", JSON.stringify(busUserAddress));
// formData.append("preferLocale", "en");

if (isValid) {
axios.post(POST_PUBLIC_USER_REGISTER, formData, {
@@ -466,17 +514,7 @@ const BusCustomFormWizard = (props) => {
}),

validationSchema: yup.object().shape({
username: yup.string().min(6, displayErrorMsg('用戶名稱最少6位')).required(displayErrorMsg('請輸入用戶名稱')).test(
"checkUserNameUsed",
displayErrorMsg("此用戶登入名稱已被注冊，請使用其他用戶登入名稱"),
function (value) {
if (userNameList.some(item => item.username === value)) {
return false
} else {
return true
}
}
)
username: yup.string().min(6, displayErrorMsg('用戶名稱最少6位')).required(displayErrorMsg('請輸入用戶名稱'))
.matches(/^[aA-zZ0-9\s]+$/, { message: displayErrorMsg("用戶名稱不包含特殊字符") })
.matches(/^\S*$/, { message: displayErrorMsg('用戶名稱不包含空格') }),
password: yup.string().min(8, displayErrorMsg('請輸入最少8位密碼')).required(displayErrorMsg('請輸入密碼'))
@@ -563,12 +601,12 @@ const BusCustomFormWizard = (props) => {
<Typography variant="h5">
用戶登入名稱
<span style={{ color: '#f10000' }}>*</span>
<Button
{/* <Button
variant="contained"
onClick={handleCheckUsername}
sx={{ ml: 2, height: "40px" }}>
<Typography variant="h6">檢查是否重覆</Typography>
</Button>
</Button> */}
</Typography>
</InputLabel>
<OutlinedInput
@@ -583,7 +621,7 @@ const BusCustomFormWizard = (props) => {
}}
placeholder="用戶登入名稱"
fullWidth
error={Boolean(formik.touched.username && formik.errors.username)}
error={Boolean((formik.touched.username && formik.errors.username) || checkUsername)}
onBlur={formik.handleBlur}
inputProps={{
onKeyDown: (e) => {
@@ -1039,7 +1077,7 @@ const BusCustomFormWizard = (props) => {
</InputLabel>
<OutlinedInput
fullWidth
error={Boolean(formik.touched.email && formik.errors.email)}
error={Boolean((formik.touched.email && formik.errors.email) || checkEmail)}
id="email-login"
type="email"
value={formik.values.email.trim()}
@@ -1060,6 +1098,11 @@ const BusCustomFormWizard = (props) => {
{formik.errors.email}
</FormHelperText>
)}
{checkEmail && (
<FormHelperText error id="helper-text-email-signup">
此電郵已被注冊，請使用其他電郵
</FormHelperText>
)}
</Stack>
</Grid>
<Grid item xs={12} md={6}>


+ 61
- 7
src/pages/authentication/auth-forms/CustomFormWizard.js View File

@@ -29,7 +29,7 @@ import * as yup from 'yup';
import { strengthColorChi, strengthIndicator } from 'utils/password-strength';
// import {apiPath} from "auth/utils";
import axios from "axios";
import { POST_PUBLIC_USER_REGISTER, POST_CAPTCHA, GET_USERNAME } from "utils/ApiPathConst";
import { POST_PUBLIC_USER_REGISTER, POST_CAPTCHA, GET_USERNAME, GET_USER_EMAIL } from "utils/ApiPathConst";
// import * as HttpUtils from 'utils/HttpUtils';
import * as ComboData from "utils/ComboData";

@@ -93,7 +93,12 @@ const CustomFormWizard = (props) => {
const [termsAndConNotAccept, setTermsAndConNotAccept] = useState(false);
const [isValid, setisValid] = useState(false);
const [checkCountry, setCheckCountry] = useState(false);
const username = document.getElementById("username-login")
const [checkUsername, setCheckUsername] = useState(false);
const [checkUsernameBlur, setCheckUsernameBlur] = useState(false)
const email = document.getElementById("email-login")
const [checkEmail, setCheckEmail] = useState(false)
const [checkEmailBlur, setCheckEmailBlur] = useState(false)

const idDocTypeComboList = ComboData.idDocType;
const address4ComboList = ComboData.district;
@@ -125,6 +130,48 @@ const CustomFormWizard = (props) => {
}
}

const handleCheckEmail = async () => {
if (values?.email) {
const response = await axios.get(`${GET_USER_EMAIL}`, {
params: {
email: values.email,
}
})
setCheckEmail((Number(response.data[0]) === 1))
return Number(response.data[0]) === 1
}
}

useEffect(() => {
if (username) {
username.addEventListener("blur", function () {
setCheckUsernameBlur(true)
})
}
}, [username])

useEffect(() => {
if (checkUsernameBlur) {
handleCheckUsername()
setCheckUsernameBlur(false)
}
}, [checkUsernameBlur])

useEffect(() => {
if (email) {
email.addEventListener("blur", function () {
setCheckEmailBlur(true)
})
}
}, [email])

useEffect(() => {
if (checkEmailBlur) {
handleCheckEmail()
setCheckEmailBlur(false)
}
}, [checkEmailBlur])

const onCaptchaChange = () => {
HttpUtils.post({
url: POST_CAPTCHA,
@@ -162,7 +209,8 @@ const CustomFormWizard = (props) => {
handlePhone(data.phone) &&
handleUsername(data.username) &&
handleCaptcha(data.captchaField) &&
!checkUsername
!checkUsername &&
!checkEmail
) {
setisValid(true)
return isValid
@@ -324,6 +372,7 @@ const CustomFormWizard = (props) => {
formData.append("userFaxNo", JSON.stringify(userFaxNo));
formData.append("userMobileNumber", JSON.stringify(userMobileNumber));
formData.append("userAddress", JSON.stringify(userAddress));
// formData.append("preferLocale", "en");

// if(refCode){
// formData.append("refCode", refCode);
@@ -503,7 +552,7 @@ const CustomFormWizard = (props) => {
captchaField: ''
}),
validationSchema: yup.object().shape({
username: yup.string().min(6, displayErrorMsg('用戶名稱最少6位')).required(displayErrorMsg("請輸入用戶登入名稱"))
username: yup.string().min(6, displayErrorMsg('用戶名稱最少6位')).required(displayErrorMsg("請輸入用戶名稱"))
.matches(/^[aA-zZ0-9\s]+$/, { message: displayErrorMsg("用戶名稱不包含特殊字符") })
.matches(/^\S*$/, { message: displayErrorMsg("用戶名稱不包含空格") }),
password: yup.string().min(8, displayErrorMsg('請輸入最少8位密碼')).required(displayErrorMsg('請輸入密碼'))
@@ -626,13 +675,13 @@ const CustomFormWizard = (props) => {
<InputLabel htmlFor="username-signup">
<Typography variant="h5">
用戶登入名稱
<span style={{ color: '#f10000' }}>*</span>
{/* <span style={{ color: '#f10000' }}>*</span>
<Button
variant="contained"
onClick={handleCheckUsername}
sx={{ ml: 2, height: "40px" }}>
<Typography variant="h6">檢查是否重覆</Typography>
</Button>
</Button> */}
</Typography>
</InputLabel>
<OutlinedInput
@@ -647,7 +696,7 @@ const CustomFormWizard = (props) => {
}}
placeholder="用戶登入名稱"
fullWidth
error={Boolean(formik.touched.username && formik.errors.username)}
error={Boolean((formik.touched.username && formik.errors.username) || checkUsername)}
onBlur={formik.handleBlur}
inputProps={{
onKeyDown: (e) => {
@@ -1168,7 +1217,7 @@ const CustomFormWizard = (props) => {
</InputLabel>
<OutlinedInput
fullWidth
error={Boolean(formik.touched.email && formik.errors.email)}
error={Boolean((formik.touched.email && formik.errors.email) || checkEmail)}
id="email-login"
type="email"
value={formik.values.email.trim()}
@@ -1189,6 +1238,11 @@ const CustomFormWizard = (props) => {
{formik.errors.email}
</FormHelperText>
)}
{checkEmail && (
<FormHelperText error id="helper-text-email-signup">
此電郵已被注冊，請使用其他電郵
</FormHelperText>
)}
</Stack>
</Grid>
<Grid item xs={12} md={6}>


+ 1
- 1
src/utils/ApiPathConst.js View File

@@ -44,7 +44,7 @@ export const POST_CAPTCHA = apiPath+'/captcha';
//register
export const POST_PUBLIC_USER_REGISTER = apiPath+'/user/register';
export const GET_USERNAME = apiPath+'/user/username';
export const GET_USER_EMAIL = apiPath+'/user/email';

//Public
export const GET_PUBLIC_ORG_USER_LIST = apiPath+'/user/listOrg';


Write Preview
Loading…
Cancel
Save