Skip to content

C
CivManage
Commit 9b42e376 authored by 陈前坚's avatar 陈前坚
Browse files
Options

perf: 输入框正则验证

parent 587e1833
Hide whitespace changes
Inline Side-by-side
Showing with 175 additions and 59 deletions
src/pages/userCenter/UserManage.js
View file @ 9b42e376
......@@ -114,6 +114,13 @@ const UserManage = () => {
const { TabPane } = Tabs;
const { Search } = Input;
/** ***正则验证**** */
const noChinese = new RegExp(/^[^\u4e00-\u9fa5]+$/); // 不能包含中文
const isPhone = new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/); // 手机号
const isEmail = new RegExp(
/^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/,
); // 邮箱
// 获取搜索框的值
const handleSearch = e => {
setSearchWord(e.target.value);
......@@ -411,6 +418,13 @@ const UserManage = () => {
// 添加用户
const addUser = () => {
setUserVisible(true);
addUserForm.setFieldsValue({
loginName: '',
userName: '',
password: '',
phone: '',
email: '',
});
};
// 添加顶级机构
const addOrg = () => {
......@@ -434,6 +448,7 @@ const UserManage = () => {
setEditOrgVisible(true);
editOrgForm.setFieldsValue({
OUName: orgTitle,
// desrciption: '',
});
};
// 删除机构
......@@ -535,32 +550,71 @@ const UserManage = () => {
/** ***表单提交相关操作****** */
// 提交-添加用户
const submitAddUser = () => {
postAddUser({
OUID: orgID,
loginName: addUserForm.getFieldValue('loginName'),
userName: addUserForm.getFieldValue('userName'),
password: addUserForm.getFieldValue('password'),
phone: addUserForm.getFieldValue('phone') || '',
email: addUserForm.getFieldValue('email') || '',
})
.then(res => {
if (res.success) {
setUserVisible(false);
notification.success({
message: '提交成功',
});
// 重新获取用户表
onSelect([orgID]);
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
const loginName = addUserForm.getFieldValue('loginName');
const userName = addUserForm.getFieldValue('userName');
const password = addUserForm.getFieldValue('password');
const phone = addUserForm.getFieldValue('phone') || '';
const email = addUserForm.getFieldValue('email') || '';
// 正则验证
if (!noChinese.test(loginName)) {
notification.error({
message: '提交失败',
description: '登录名不支持中文!',
});
}
if (password.length < 6) {
notification.error({
message: '提交失败',
description: '密码至少为6位!',
});
}
if (userName === '') {
notification.error({
message: '提交失败',
description: '用户名称不能为空!',
});
}
if (phone !== '' && !isPhone.test(phone)) {
notification.error({
message: '提交失败',
description: '请输入11位手机号!',
});
}
if (email !== '' && !isEmail.test(email)) {
notification.error({
message: '提交失败',
description: '邮箱格式不正确!',
});
}
// 所有验证通过才可以提交,phone/email为空时不验证
if (
noChinese.test(loginName) &&
password.length >= 6 &&
userName &&
(phone === '' || isPhone.test(phone)) &&
(email === '' || isEmail.test(email))
) {
postAddUser({ OUID: orgID, loginName, userName, password, phone, email })
.then(res => {
if (res.success) {
setUserVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取用户表
onSelect([orgID]);
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
}
};
// 提交-添加下级机构
......@@ -576,6 +630,7 @@ const UserManage = () => {
setAddOrgVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
......@@ -610,6 +665,7 @@ const UserManage = () => {
setEditOrgVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
......@@ -634,6 +690,7 @@ const UserManage = () => {
setDeleteOrgVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
......@@ -713,6 +770,7 @@ const UserManage = () => {
// setExpandedKeys([`${currentUser.OUID}`]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
......@@ -745,6 +803,7 @@ const UserManage = () => {
onSelect([currentSelectOrg]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
......@@ -768,6 +827,7 @@ const UserManage = () => {
// setExpandedKeys([`${newOrgID}`]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
......@@ -793,6 +853,7 @@ const UserManage = () => {
onSelect([newOrgID]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
......@@ -809,6 +870,15 @@ const UserManage = () => {
const password = passwordForm.getFieldValue('password');
const newPassword = passwordForm.getFieldValue('newPassword');
const passwordConfirm = passwordForm.getFieldValue('passwordConfirm');
if (
(newPassword && newPassword.length < 6) ||
(passwordConfirm && passwordConfirm < 6)
) {
notification.error({
message: '提交失败',
description: '密码至少为6位!',
});
}
if (newPassword && passwordConfirm && newPassword === passwordConfirm) {
updateUserPassword(
currentUser.userID,
......@@ -821,6 +891,7 @@ const UserManage = () => {
setPasswordVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
......@@ -844,35 +915,77 @@ const UserManage = () => {
});
}
};
// 提交-编辑用户
const submitEditUser = () =>
postEditUser(
currentUser.userID,
editUserForm.getFieldValue('loginName'),
editUserForm.getFieldValue('userName'),
editUserForm.getFieldValue('phone') || '',
editUserForm.getFieldValue('email') || '',
)
.then(res => {
if (res.success) {
setEditUserVisible(false);
// 重新获取用户表
onSelect([`${currentUser.OUID}`]);
// setExpandedKeys([`${currentUser.OUID}`]);
notification.success({
message: '提交成功',
});
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
setTableLoading(false);
message.error(err);
const submitEditUser = () => {
const loginName = editUserForm.getFieldValue('loginName');
const userName = editUserForm.getFieldValue('userName');
const phone = editUserForm.getFieldValue('phone') || '';
const email = editUserForm.getFieldValue('email') || '';
// 正则验证
if (loginName === '') {
notification.error({
message: '提交失败',
description: '登录名称不能为空!',
});
} else if (!noChinese.test(loginName)) {
notification.error({
message: '提交失败',
description: '登录名不支持中文!',
});
}
if (userName === '') {
notification.error({
message: '提交失败',
description: '用户姓名不能为空!',
});
}
if (phone !== '' && !isPhone.test(phone)) {
notification.error({
message: '提交失败',
description: '请输入11位手机号!',
});
}
if (email !== '' && !isEmail.test(email)) {
notification.error({
message: '提交失败',
description: '邮箱格式不正确!',
});
}
// 所有验证通过才可以提交,phone/email为空时不验证
if (
loginName &&
noChinese.test(loginName) &&
userName &&
(phone === '' || isPhone.test(phone)) &&
(email === '' || isEmail.test(email))
) {
postEditUser(currentUser.userID, loginName, userName, phone, email)
.then(res => {
if (res.success) {
setEditUserVisible(false);
// 重新获取用户表
onSelect([`${currentUser.OUID}`]);
// setExpandedKeys([`${currentUser.OUID}`]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
setTableLoading(false);
message.error(err);
});
}
};
// 提交-冻结用户
const submitFreezeUser = () => {
let state = '';
......@@ -890,6 +1003,7 @@ const UserManage = () => {
// setExpandedKeys([`${currentUser.OUID}`]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
......@@ -911,6 +1025,7 @@ const UserManage = () => {
setDeleteUserVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取用户表
onSelect([`${currentUser.OUID}`]);
......@@ -937,6 +1052,7 @@ const UserManage = () => {
setDeleteUserVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取用户表
onSelect([currentSelectOrg]);
......@@ -1114,7 +1230,7 @@ const UserManage = () => {
label="账户密码"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入账户密码" />
<Input placeholder="请输入账户密码,至少6位" />
</Form.Item>
<Form.Item
name="userName"
......@@ -1129,11 +1245,11 @@ const UserManage = () => {
rules={[
{
pattern: new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/),
message: '请输入有效的手机号码!',
message: '请输入11位手机号码!',
},
]}
>
<Input placeholder="请输入手机号码" />
<Input placeholder="请输入11位手机号码" autoComplete="off" />
</Form.Item>
<Form.Item
name="email"
......@@ -1141,7 +1257,7 @@ const UserManage = () => {
rules={[
{
type: 'email',
message: '请输入有效的电子邮箱!',
message: '请输入正确的电子邮箱!',
},
]}
>
......@@ -1334,11 +1450,11 @@ const UserManage = () => {
rules={[
{
pattern: new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/),
message: '请输入有效的手机号码!',
message: '请输入11位手机号码!',
},
]}
>
<Input placeholder="请输入手机号码" autoComplete="off" />
<Input placeholder="请输入11位手机号码" autoComplete="off" />
</Form.Item>
<Form.Item
name="email"
......@@ -1346,7 +1462,7 @@ const UserManage = () => {
rules={[
{
type: 'email',
message: '请输入有效的电子邮箱!',
message: '请输入正确的电子邮箱!',
},
]}
>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment