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 = () => { ...@@ -114,6 +114,13 @@ const UserManage = () => {
const { TabPane } = Tabs; const { TabPane } = Tabs;
const { Search } = Input; 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 => { const handleSearch = e => {
setSearchWord(e.target.value); setSearchWord(e.target.value);
...@@ -411,6 +418,13 @@ const UserManage = () => { ...@@ -411,6 +418,13 @@ const UserManage = () => {
// 添加用户 // 添加用户
const addUser = () => { const addUser = () => {
setUserVisible(true); setUserVisible(true);
addUserForm.setFieldsValue({
loginName: '',
userName: '',
password: '',
phone: '',
email: '',
});
}; };
// 添加顶级机构 // 添加顶级机构
const addOrg = () => { const addOrg = () => {
...@@ -434,6 +448,7 @@ const UserManage = () => { ...@@ -434,6 +448,7 @@ const UserManage = () => {
setEditOrgVisible(true); setEditOrgVisible(true);
editOrgForm.setFieldsValue({ editOrgForm.setFieldsValue({
OUName: orgTitle, OUName: orgTitle,
// desrciption: '',
}); });
}; };
// 删除机构 // 删除机构
...@@ -535,32 +550,71 @@ const UserManage = () => { ...@@ -535,32 +550,71 @@ const UserManage = () => {
/** ***表单提交相关操作****** */ /** ***表单提交相关操作****** */
// 提交-添加用户 // 提交-添加用户
const submitAddUser = () => { const submitAddUser = () => {
postAddUser({ const loginName = addUserForm.getFieldValue('loginName');
OUID: orgID, const userName = addUserForm.getFieldValue('userName');
loginName: addUserForm.getFieldValue('loginName'), const password = addUserForm.getFieldValue('password');
userName: addUserForm.getFieldValue('userName'), const phone = addUserForm.getFieldValue('phone') || '';
password: addUserForm.getFieldValue('password'), const email = addUserForm.getFieldValue('email') || '';
phone: addUserForm.getFieldValue('phone') || '', // 正则验证
email: addUserForm.getFieldValue('email') || '', if (!noChinese.test(loginName)) {
}) notification.error({
.then(res => { message: '提交失败',
if (res.success) { description: '登录名不支持中文!',
setUserVisible(false); });
notification.success({ }
message: '提交成功', if (password.length < 6) {
}); notification.error({
// 重新获取用户表 message: '提交失败',
onSelect([orgID]); description: '密码至少为6位!',
} else { });
notification.error({ }
message: '提交失败', if (userName === '') {
description: res.message, notification.error({
}); message: '提交失败',
} description: '用户名称不能为空!',
}) });
.catch(err => { }
message.error(err); 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 = () => { ...@@ -576,6 +630,7 @@ const UserManage = () => {
setAddOrgVisible(false); setAddOrgVisible(false);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
// 重新获取机构树与用户表 // 重新获取机构树与用户表
updateTrees(); updateTrees();
...@@ -610,6 +665,7 @@ const UserManage = () => { ...@@ -610,6 +665,7 @@ const UserManage = () => {
setEditOrgVisible(false); setEditOrgVisible(false);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
// 重新获取机构树与用户表 // 重新获取机构树与用户表
updateTrees(); updateTrees();
...@@ -634,6 +690,7 @@ const UserManage = () => { ...@@ -634,6 +690,7 @@ const UserManage = () => {
setDeleteOrgVisible(false); setDeleteOrgVisible(false);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
// 重新获取机构树与用户表 // 重新获取机构树与用户表
updateTrees(); updateTrees();
...@@ -713,6 +770,7 @@ const UserManage = () => { ...@@ -713,6 +770,7 @@ const UserManage = () => {
// setExpandedKeys([`${currentUser.OUID}`]); // setExpandedKeys([`${currentUser.OUID}`]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
} else { } else {
notification.error({ notification.error({
...@@ -745,6 +803,7 @@ const UserManage = () => { ...@@ -745,6 +803,7 @@ const UserManage = () => {
onSelect([currentSelectOrg]); onSelect([currentSelectOrg]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
} else { } else {
notification.error({ notification.error({
...@@ -768,6 +827,7 @@ const UserManage = () => { ...@@ -768,6 +827,7 @@ const UserManage = () => {
// setExpandedKeys([`${newOrgID}`]); // setExpandedKeys([`${newOrgID}`]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
} else { } else {
notification.error({ notification.error({
...@@ -793,6 +853,7 @@ const UserManage = () => { ...@@ -793,6 +853,7 @@ const UserManage = () => {
onSelect([newOrgID]); onSelect([newOrgID]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
} else { } else {
notification.error({ notification.error({
...@@ -809,6 +870,15 @@ const UserManage = () => { ...@@ -809,6 +870,15 @@ const UserManage = () => {
const password = passwordForm.getFieldValue('password'); const password = passwordForm.getFieldValue('password');
const newPassword = passwordForm.getFieldValue('newPassword'); const newPassword = passwordForm.getFieldValue('newPassword');
const passwordConfirm = passwordForm.getFieldValue('passwordConfirm'); const passwordConfirm = passwordForm.getFieldValue('passwordConfirm');
if (
(newPassword && newPassword.length < 6) ||
(passwordConfirm && passwordConfirm < 6)
) {
notification.error({
message: '提交失败',
description: '密码至少为6位!',
});
}
if (newPassword && passwordConfirm && newPassword === passwordConfirm) { if (newPassword && passwordConfirm && newPassword === passwordConfirm) {
updateUserPassword( updateUserPassword(
currentUser.userID, currentUser.userID,
...@@ -821,6 +891,7 @@ const UserManage = () => { ...@@ -821,6 +891,7 @@ const UserManage = () => {
setPasswordVisible(false); setPasswordVisible(false);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
} else { } else {
notification.error({ notification.error({
...@@ -844,35 +915,77 @@ const UserManage = () => { ...@@ -844,35 +915,77 @@ const UserManage = () => {
}); });
} }
}; };
// 提交-编辑用户 // 提交-编辑用户
const submitEditUser = () => const submitEditUser = () => {
postEditUser( const loginName = editUserForm.getFieldValue('loginName');
currentUser.userID, const userName = editUserForm.getFieldValue('userName');
editUserForm.getFieldValue('loginName'), const phone = editUserForm.getFieldValue('phone') || '';
editUserForm.getFieldValue('userName'), const email = editUserForm.getFieldValue('email') || '';
editUserForm.getFieldValue('phone') || '', // 正则验证
editUserForm.getFieldValue('email') || '', if (loginName === '') {
) notification.error({
.then(res => { message: '提交失败',
if (res.success) { description: '登录名称不能为空!',
setEditUserVisible(false); });
// 重新获取用户表 } else if (!noChinese.test(loginName)) {
onSelect([`${currentUser.OUID}`]); notification.error({
// setExpandedKeys([`${currentUser.OUID}`]); message: '提交失败',
notification.success({ description: '登录名不支持中文!',
message: '提交成功', });
}); }
} else { if (userName === '') {
notification.error({ notification.error({
message: '提交失败', message: '提交失败',
description: res.message, description: '用户姓名不能为空!',
});
}
})
.catch(err => {
setTableLoading(false);
message.error(err);
}); });
}
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 = () => { const submitFreezeUser = () => {
let state = ''; let state = '';
...@@ -890,6 +1003,7 @@ const UserManage = () => { ...@@ -890,6 +1003,7 @@ const UserManage = () => {
// setExpandedKeys([`${currentUser.OUID}`]); // setExpandedKeys([`${currentUser.OUID}`]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
} else { } else {
notification.error({ notification.error({
...@@ -911,6 +1025,7 @@ const UserManage = () => { ...@@ -911,6 +1025,7 @@ const UserManage = () => {
setDeleteUserVisible(false); setDeleteUserVisible(false);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
// 重新获取用户表 // 重新获取用户表
onSelect([`${currentUser.OUID}`]); onSelect([`${currentUser.OUID}`]);
...@@ -937,6 +1052,7 @@ const UserManage = () => { ...@@ -937,6 +1052,7 @@ const UserManage = () => {
setDeleteUserVisible(false); setDeleteUserVisible(false);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
duration: 2,
}); });
// 重新获取用户表 // 重新获取用户表
onSelect([currentSelectOrg]); onSelect([currentSelectOrg]);
...@@ -1114,7 +1230,7 @@ const UserManage = () => { ...@@ -1114,7 +1230,7 @@ const UserManage = () => {
label="账户密码" label="账户密码"
rules={[{ required: true, message: '不能为空' }]} rules={[{ required: true, message: '不能为空' }]}
> >
<Input placeholder="请输入账户密码" /> <Input placeholder="请输入账户密码,至少6位" />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="userName" name="userName"
...@@ -1129,11 +1245,11 @@ const UserManage = () => { ...@@ -1129,11 +1245,11 @@ const UserManage = () => {
rules={[ rules={[
{ {
pattern: new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/), 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>
<Form.Item <Form.Item
name="email" name="email"
...@@ -1141,7 +1257,7 @@ const UserManage = () => { ...@@ -1141,7 +1257,7 @@ const UserManage = () => {
rules={[ rules={[
{ {
type: 'email', type: 'email',
message: '请输入有效的电子邮箱!', message: '请输入正确的电子邮箱!',
}, },
]} ]}
> >
...@@ -1334,11 +1450,11 @@ const UserManage = () => { ...@@ -1334,11 +1450,11 @@ const UserManage = () => {
rules={[ rules={[
{ {
pattern: new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/), 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>
<Form.Item <Form.Item
name="email" name="email"
...@@ -1346,7 +1462,7 @@ const UserManage = () => { ...@@ -1346,7 +1462,7 @@ const UserManage = () => {
rules={[ rules={[
{ {
type: 'email', 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