Skip to content

C
CivManage
Commit 287c5901 authored by 陈前坚's avatar 陈前坚
Browse files
Options

perf: 用户管理模块划分

parent 7b571f25
Show whitespace changes
Inline Side-by-side
Showing with 650 additions and 649 deletions
src/pages/userCenter/userManage/AddSubOrgModal.jsx 0 → 100644
View file @ 287c5901
import React, { useEffect } from 'react';
import { Modal, Form, Input, notification, message } from 'antd';
import { addOrg } from '@/services/userCenter/userManage/api';
const AddUserModal = props => {
const { title, visible, orgID, onCancel, updateTrees, onSelect } = props;
const [addOrgForm] = Form.useForm(); // 添加用户
useEffect(() => {
addOrgForm.resetFields();
}, [orgID]);
// 提交-添加下级机构
const submitAddOrg = () => {
addOrg(
orgID,
addOrgForm.getFieldValue('OUName'),
addOrgForm.getFieldValue('desrciption') || '',
'',
)
.then(res => {
if (res.success) {
onCancel();
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
onSelect([`${res.OUID}`]);
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
};
return (
<Modal
title={title}
visible={visible}
onCancel={onCancel}
onOk={submitAddOrg}
okText="确认"
cancelText="取消"
>
<Form form={addOrgForm} labelCol={{ span: 4 }}>
<Form.Item
name="OUName"
label="机构名称"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入机构名称" />
</Form.Item>
<Form.Item name="description" label="描述">
<Input placeholder="请输入相关描述" />
</Form.Item>
</Form>
</Modal>
);
};
export default AddUserModal;
src/pages/userCenter/userManage/AddUserModal.jsx
View file @ 287c5901
import React, { useState, useEffect } from 'react';
import { Modal, Form, Input, notification, message, Select } from 'antd';
import React, { useEffect } from 'react';
import { Modal, Form, Input, notification, message } from 'antd';
import { addUser } from '@/services/userCenter/userManage/api';
const { Option } = Select;
const AddUserModal = props =>{
const {title,visible,orgID,onCancel} = props;
const AddUserModal = props => {
const { title, visible, orgID, onCancel, onSelect } = props;
const [addUserForm] = Form.useForm(); // 添加用户
/** ***正则验证**** */
const noChinese = new RegExp(/^[^\u4e00-\u9fa5]+$/); // 不能包含中文
......@@ -68,13 +67,13 @@ const AddUserModal = props =>{
.then(res => {
if (res.success) {
addUserForm.resetFields();
onCancel;
onCancel(); // 设置Modal不可见
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取用户表
// onSelect([orgID]);
onSelect();
} else {
notification.error({
message: '提交失败',
......@@ -87,12 +86,15 @@ const AddUserModal = props =>{
});
}
};
return (<Modal
return (
<Modal
title={title}
visible={visible}
onCancel={onCancel}
onOk={submitAddUser}
>
okText="确认"
cancelText="取消"
>
<Form form={addUserForm} labelCol={{ span: 4 }}>
<Form.Item
name="loginName"
......@@ -140,7 +142,8 @@ const AddUserModal = props =>{
<Input placeholder="请输入电子邮箱" autoComplete="off" />
</Form.Item>
</Form>
</Modal>)
}
</Modal>
);
};
export default AddUserModal;
src/pages/userCenter/userManage/ChangePasswordModal.jsx 0 → 100644
View file @ 287c5901
import React, { useEffect } from 'react';
import { Modal, Form, Input, notification, message } from 'antd';
import { updateUserPassword } from '@/services/userCenter/userManage/api';
const ChangePasswordModal = props => {
const { visible, currentUser, onCancel } = props;
const [passwordForm] = Form.useForm(); // 修改密码
useEffect(() => {
passwordForm.setFieldsValue({
oldPassword: currentUser.password,
newPassword: '',
passwordConfirm: '',
});
}, [currentUser]);
// 提交-修改密码
const submitChangePassword = () => {
const oldPassword = passwordForm.getFieldValue('oldPassword');
const newPassword = passwordForm.getFieldValue('newPassword');
const passwordConfirm = passwordForm.getFieldValue('passwordConfirm');
if (
newPassword &&
newPassword.length >= 6 &&
passwordConfirm &&
newPassword.length >= 6 &&
newPassword === passwordConfirm
) {
updateUserPassword({
UserId: +currentUser.userID,
OldPassWord: oldPassword,
NewPassWord: newPassword,
})
.then(res => {
if (res.code === 0) {
onCancel();
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
} else if (newPassword === '' || passwordConfirm === '') {
notification.error({
message: '提交失败',
description: '带*号为必填项，不能为空',
});
} else if (
(newPassword && newPassword.length < 6) ||
(passwordConfirm && passwordConfirm < 6)
) {
notification.error({
message: '提交失败',
description: '密码至少为6位!',
});
} else if (newPassword !== passwordConfirm) {
notification.error({
message: '提交失败',
description: '确认密码不一致!',
});
}
};
return (
<Modal
title="修改密码"
visible={visible}
onOk={submitChangePassword}
onCancel={onCancel}
okText="确认"
cancelText="取消"
>
<Form form={passwordForm} labelCol={{ span: 4 }}>
<Form.Item name="oldPassword" label="原始密码">
<Input disabled />
</Form.Item>
<Form.Item
name="newPassword"
label="新密码"
rules={[{ required: true, message: '不能为空' }]}
>
<Input
placeholder="请输入新密码"
type="password"
autoComplete="off"
/>
</Form.Item>
<Form.Item
name="passwordConfirm"
label="确认密码"
rules={[{ required: true, message: '不能为空' }]}
>
<Input
placeholder="再次确认新密码"
type="password"
autoComplete="off"
/>
</Form.Item>
</Form>
</Modal>
);
};
export default ChangePasswordModal;
src/pages/userCenter/userManage/DeleteOrgModal.jsx 0 → 100644
View file @ 287c5901
import React from 'react';
import { Modal, notification, message } from 'antd';
import { deleteOrg } from '@/services/userCenter/userManage/api';
const DeleteOrgModal = props => {
const { title, visible, orgID, onCancel, updateTrees } = props;
// 提交-删除机构
const submitDeleteOrg = () =>
deleteOrg(orgID)
.then(res => {
if (res.success) {
onCancel();
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
return (
<Modal
title={title}
visible={visible}
onCancel={onCancel}
onOk={submitDeleteOrg}
okText="确认"
cancelText="取消"
>
<p>即将删除该机构，是否确认删除？</p>
</Modal>
);
};
export default DeleteOrgModal;
src/pages/userCenter/userManage/EditOrgModal.jsx 0 → 100644
View file @ 287c5901
import React, { useEffect } from 'react';
import { Modal, Form, Input, notification, message } from 'antd';
import { editOrgInfo } from '@/services/userCenter/userManage/api';
const EditOrgModal = props => {
const {
title,
visible,
orgID,
orgTitle,
description,
onCancel,
updateTrees,
onSelect,
} = props;
const [editOrgForm] = Form.useForm(); // 添加用户
useEffect(() => {
editOrgForm.setFieldsValue({
OUName: orgTitle,
description,
});
}, [orgTitle, description]);
// 提交-编辑当前机构
const submitEditOrg = () =>
editOrgInfo(
orgID,
editOrgForm.getFieldValue('OUName'),
editOrgForm.getFieldValue('description') || '',
'',
)
.then(res => {
if (res.success) {
onCancel();
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
onSelect([orgID]);
// setExpandedKeys([`${orgID}`]);
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
return (
<Modal
title={title}
visible={visible}
onCancel={onCancel}
onOk={submitEditOrg}
okText="确认"
cancelText="取消"
>
<Form form={editOrgForm} labelCol={{ span: 4 }}>
<Form.Item
name="OUName"
label="机构名称"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入机构名称" />
</Form.Item>
<Form.Item name="description" label="描述">
<Input placeholder="请输入相关描述" />
</Form.Item>
</Form>
</Modal>
);
};
export default EditOrgModal;
src/pages/userCenter/userManage/EditUserModal.jsx 0 → 100644
View file @ 287c5901
import React, { useEffect } from 'react';
import { Modal, Form, Input, notification, message } from 'antd';
import voca from 'voca';
import { editUser } from '@/services/userCenter/userManage/api';
const EditUserModal = props => {
const { visible, currentUser, onCancel, onSelect } = props;
const [editUserForm] = Form.useForm(); // 编辑用户
/** ***正则验证**** */
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,}$/,
); // 邮箱
useEffect(() => {
editUserForm.setFieldsValue({
loginName: voca.stripTags(currentUser.loginName),
userName: voca.stripTags(currentUser.userName),
phone: currentUser.phone || '',
email: currentUser.email || '',
});
}, [currentUser]);
// 提交-编辑用户
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: '登录名不支持中文!',
});
} else if (userName === '') {
notification.error({
message: '提交失败',
description: '用户姓名不能为空!',
});
} else if (phone !== '' && !isPhone.test(phone)) {
notification.error({
message: '提交失败',
description: '请输入11位手机号!',
});
} else if (email !== '' && !isEmail.test(email)) {
notification.error({
message: '提交失败',
description: '邮箱格式不正确!',
});
}
// 所有验证通过才可以提交,phone/email为空时不验证
else if (
loginName &&
noChinese.test(loginName) &&
userName &&
(phone === '' || isPhone.test(phone)) &&
(email === '' || isEmail.test(email))
) {
editUser(currentUser.userID, loginName, userName, phone, email)
.then(res => {
if (res.success) {
onCancel();
// 重新获取用户表
onSelect([`${currentUser.OUID}`]);
// setExpandedKeys([`${currentUser.OUID}`]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
}
};
return (
<Modal
title="编辑用户"
visible={visible}
onOk={submitEditUser}
onCancel={onCancel}
okText="确认"
cancelText="取消"
>
<Form form={editUserForm} labelCol={{ span: 4 }}>
<Form.Item
name="loginName"
label="登录名称"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入登录名称" />
</Form.Item>
<Form.Item
name="userName"
label="用户姓名"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入用户姓名" />
</Form.Item>
<Form.Item
name="phone"
label="手机号码"
rules={[
{
pattern: new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/),
message: '请输入11位手机号码!',
},
]}
>
<Input placeholder="请输入11位手机号码" autoComplete="off" />
</Form.Item>
<Form.Item
name="email"
label="电子邮箱"
rules={[
{
type: 'email',
message: '请输入正确的电子邮箱!',
},
]}
>
<Input placeholder="请输入电子邮箱" autoComplete="off" />
</Form.Item>
</Form>
</Modal>
);
};
export default EditUserModal;
src/pages/userCenter/userManage/RelateRoleModal.jsx 0 → 100644
View file @ 287c5901
import React, { useState, useCallback } from 'react';
import { Modal, Spin, Tabs, notification, message } from 'antd';
import {
setUserRelation,
setUserRelations,
} from '@/services/userCenter/userManage/api';
import ListCardItem from '../../orgnazation/listCardItem';
const RelateRoleModal = props => {
const {
currentUser,
currentSelectOrg,
userIDs,
visible,
rolelist,
stationlist,
multiRelateRoles,
onCancel,
onSelect,
loading,
} = props;
const { TabPane } = Tabs;
const [roleValueList, setRoleValueList] = useState({}); // 勾选的角色列表
const [stationValueList, setStationValueList] = useState({}); // 勾选的站点列表
const getRoleValueCallback = useCallback((value, index) => {
roleValueList[index] = value;
setRoleValueList({ ...roleValueList });
}, []);
const getStationValueCallback = useCallback((value, index) => {
stationValueList[index] = value;
setStationValueList({ ...stationValueList });
}, []);
// 提交-关联角色
const submitRole = () => {
setUserRelation(
currentUser.userID,
Object.keys(roleValueList)
.map(k => roleValueList[k])
.flat(),
Object.keys(stationValueList)
.map(k => stationValueList[k])
.flat(),
)
.then(res => {
if (res.success) {
onCancel();
// 跳转到新组织机构下的用户表
onSelect([`${currentUser.OUID}`]);
// setExpandedKeys([`${currentUser.OUID}`]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
};
// 提交-批量关联角色
const submitRoles = () => {
setUserRelations(
userIDs,
Object.keys(roleValueList)
.map(k => roleValueList[k])
.flat()
.toString(),
Object.keys(stationValueList)
.map(k => stationValueList[k])
.flat()
.toString(),
)
.then(res => {
if (res.code === 0) {
onCancel();
// 跳转到组织
onSelect([currentSelectOrg]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.msg,
});
}
})
.catch(err => {
message.error(err);
});
};
return (
<Modal
title="关联角色"
visible={visible}
onOk={multiRelateRoles ? submitRoles : submitRole}
onCancel={onCancel}
okText="确认"
cancelText="取消"
width="920px"
>
<Spin spinning={loading} tip="loading">
<Tabs defaultActiveKey="1" style={{ marginTop: '-16px' }}>
<TabPane tab="角色" key="1">
{visible &&
rolelist.map((role, index) => (
<ListCardItem
itemid={index}
key={`item${index}key`}
userList={role.roleList}
OUName={role.visibleTitle}
getValueCallback={getRoleValueCallback}
/>
))}
</TabPane>
<TabPane tab="站点" key="2">
{visible &&
stationlist.map((station, index) => (
<ListCardItem
itemid={index}
key={`item${index}key`}
userList={station.stationList}
OUName={station.visibleTitle}
getValueCallback={getStationValueCallback}
/>
))}
</TabPane>
</Tabs>
</Spin>
</Modal>
);
};
export default RelateRoleModal;
src/pages/userCenter/userManage/UserManage.js
View file @ 287c5901
import React, { useState, useEffect, useCallback } from 'react';
import React, { useState, useEffect } from 'react';
import {
Tree,
Table,
Space,
message,
Modal,
Form,
Input,
notification,
Tooltip,
Card,
Tabs,
Button,
Spin,
Dropdown,
......@@ -36,25 +34,23 @@ import zhCN from 'antd/es/locale/zh_CN';
import {
addToOrg,
addToOrgs,
editOrgInfo,
getOneOUUserListNew,
getUserByKey,
getUserRelationList,
getUserTree,
addUser as postAddUser,
deleteUser as postDeleteUser,
setUserState as postSetUserState,
editUser as postEditUser,
submitAddOrg as postAddOrg,
deleteOrg as postDeleteOrg,
updateUserPassword,
setUserRelation,
setUserRelations,
multiDeleteUsers,
} from '@/services/userCenter/userManage/api';
import classnames from 'classnames';
import ListCardItem from '../../orgnazation/listCardItem';
import AddUserModal from './AddUserModal';
import AddSubOrgModal from './AddSubOrgModal';
import EditOrgModal from './EditOrgModal';
import DeleteOrgModal from './DeleteOrgModal';
import RelateRoleModal from './RelateRoleModal';
import EditUserModal from './EditUserModal';
import ChangePasswordModal from './ChangePasswordModal';
import styles from './UserManage.less';
const UserManage = () => {
......@@ -88,6 +84,7 @@ const UserManage = () => {
const [deleteUserVisible, setDeleteUserVisible] = useState(false); // 删除用户
const [orgTitle, setOrgTitle] = useState('当前机构'); // 弹框标题
const [description, setDescription] = useState(''); // 机构描述信息
const [selectedRowKeys, setSelectedRowKeys] = useState([]); // 已选用户数,机构改变时重置
const [tableLength, setTableLength] = useState(0); // 当前机构用户总数
const [orgID, setOrgID] = useState(); // 当前选择的机构ID
......@@ -102,40 +99,7 @@ const UserManage = () => {
const [rolelist, setRolelist] = useState([]); // 角色列表
const [stationlist, setStationlist] = useState([]); // 站点列表
const [roleValueList, setRoleValueList] = useState({}); // 勾选的角色列表
const [stationValueList, setStationValueList] = useState({}); // 勾选的站点列表
/** ***表单相关**** */
const [addUserForm] = Form.useForm(); // 添加用户
const [addOrgForm] = Form.useForm(); // 添加机构
const [editOrgForm] = Form.useForm(); // 编辑机构
const [editUserForm] = Form.useForm(); // 编辑用户
const [passwordForm] = Form.useForm(); // 修改密码
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);
};
const getRoleValueCallback = useCallback((value, index) => {
roleValueList[index] = value;
setRoleValueList({ ...roleValueList });
}, []);
const getStationValueCallback = useCallback((value, index) => {
stationValueList[index] = value;
setStationValueList({ ...stationValueList });
}, []);
// 用户表列名
const columns = [
{
......@@ -289,6 +253,11 @@ const UserManage = () => {
},
];
// 获取搜索框的值
const handleSearch = e => {
setSearchWord(e.target.value);
};
const rowSelection = {
selectedRowKeys,
onChange: (RowKeys, Rows) => {
......@@ -371,6 +340,7 @@ const UserManage = () => {
setTableLoading(false);
setSearchWord(''); // 搜索框置空
setOrgTitle(res.data.GroupName);
setDescription(res.data.GroupName);
// 返回用户表数据结构处理，扁平化
const temp = flatten(getUsers(res.data));
// 设置过滤字段
......@@ -422,38 +392,19 @@ const UserManage = () => {
// 添加用户
const addUser = () => {
setUserVisible(true);
// addUserForm.setFieldsValue({
// loginName: '',
// userName: '',
// password: '',
// phone: '',
// email: '',
// });
};
// 添加顶级机构
const addOrg = () => {
setAddOrgVisible(true);
setOrgID('-1');
addOrgForm.setFieldsValue({
OUName: '',
desrciption: '',
});
};
// 添加下级机构
const addSubOrg = () => {
setAddOrgVisible(true);
addOrgForm.setFieldsValue({
OUName: '',
desrciption: '',
});
};
// 编辑机构
const editOrg = () => {
setEditOrgVisible(true);
editOrgForm.setFieldsValue({
OUName: orgTitle,
// desrciption: '',
});
};
// 删除机构
const deleteOrg = () => {
......@@ -502,22 +453,11 @@ const UserManage = () => {
// 修改密码
const changePassword = record => {
setPasswordVisible(true);
passwordForm.setFieldsValue({
oldPassword: record.password,
newPassword: '',
passwordConfirm: '',
});
setCurrentUser(record);
};
// 编辑用户
const editUser = record => {
setEditUserVisible(true);
editUserForm.setFieldsValue({
loginName: voca.stripTags(record.loginName),
userName: voca.stripTags(record.userName),
phone: record.phone || '',
email: record.email || '',
});
setCurrentUser(record);
};
// 冻结用户
......@@ -554,164 +494,7 @@ const UserManage = () => {
};
/** ***表单提交相关操作****** */
// 提交-添加用户
const submitAddUser = () => {
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 (loginName === '') {
notification.error({
message: '提交失败',
description: '登录名不能为空!',
});
} else if (!noChinese.test(loginName)) {
notification.error({
message: '提交失败',
description: '登录名不支持中文!',
});
} else if (password.length < 6) {
notification.error({
message: '提交失败',
description: '密码至少为6位!',
});
} else if (userName === '') {
notification.error({
message: '提交失败',
description: '用户名称不能为空!',
});
} else if (phone !== '' && !isPhone.test(phone)) {
notification.error({
message: '提交失败',
description: '请输入11位手机号!',
});
} else if (email !== '' && !isEmail.test(email)) {
notification.error({
message: '提交失败',
description: '邮箱格式不正确!',
});
}
// 所有验证通过才可以提交,phone/email为空时不验证
else 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);
});
}
};
// 提交-添加下级机构
const submitAddOrg = () => {
postAddOrg(
orgID,
addOrgForm.getFieldValue('OUName'),
addOrgForm.getFieldValue('desrciption') || '',
'',
)
.then(res => {
if (res.success) {
setAddOrgVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
onSelect([`${res.OUID}`]);
// updateTrees().then(() => {
// // 只能是字符串，数字没有选择效果
// onSelect([`${res.OUID}`]);
// // setExpandedKeys([`${res.OUID}`]);
// });
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
};
// 提交-编辑当前机构
const submitEditOrg = () =>
editOrgInfo(
orgID,
editOrgForm.getFieldValue('OUName'),
editOrgForm.getFieldValue('desrciption') || '',
'',
)
.then(res => {
if (res.success) {
setEditOrgVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
onSelect([orgID]);
// setExpandedKeys([`${orgID}`]);
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
// 提交-删除机构
const submitDeleteOrg = () =>
postDeleteOrg(orgID)
.then(res => {
if (res.success) {
setDeleteOrgVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
// 重新获取机构树与用户表
updateTrees();
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
setTableLoading(false);
message.error(err);
});
// 根据当前 userID 获取用户关联角色
const getRoleList = () => {
setLoading(true);
......@@ -758,71 +541,6 @@ const UserManage = () => {
message.error(err);
});
};
// 提交-关联角色
const submitRole = () => {
setUserRelation(
currentUser.userID,
Object.keys(roleValueList)
.map(k => roleValueList[k])
.flat(),
Object.keys(stationValueList)
.map(k => stationValueList[k])
.flat(),
)
.then(res => {
if (res.success) {
setRoleVisible(false);
// 跳转到新组织机构下的用户表
onSelect([`${currentUser.OUID}`]);
// setExpandedKeys([`${currentUser.OUID}`]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
};
// 提交-批量关联角色
const submitRoles = () => {
setUserRelations(
userIDs,
Object.keys(roleValueList)
.map(k => roleValueList[k])
.flat()
.toString(),
Object.keys(stationValueList)
.map(k => stationValueList[k])
.flat()
.toString(),
)
.then(res => {
if (res.code === 0) {
setRoleVisible(false);
// 跳转到组织
onSelect([currentSelectOrg]);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.msg,
});
}
})
.catch(err => {
message.error(err);
});
};
// 提交-更改机构
const submitChangeOrg = () =>
addToOrg(currentUser.userID, currentUser.OUID, newOrgID)
......@@ -871,126 +589,6 @@ const UserManage = () => {
.catch(err => {
message.error(err);
});
// 提交-修改密码
const submitChangePassword = () => {
const oldPassword = passwordForm.getFieldValue('oldPassword');
const newPassword = passwordForm.getFieldValue('newPassword');
const passwordConfirm = passwordForm.getFieldValue('passwordConfirm');
if (
newPassword &&
newPassword.length >= 6 &&
passwordConfirm &&
newPassword.length >= 6 &&
newPassword === passwordConfirm
) {
updateUserPassword({
UserId: +currentUser.userID,
OldPassWord: oldPassword,
NewPassWord: newPassword,
})
.then(res => {
if (res.code === 0) {
setPasswordVisible(false);
notification.success({
message: '提交成功',
duration: 2,
});
} else {
notification.error({
message: '提交失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
} else if (newPassword === '' || passwordConfirm === '') {
notification.error({
message: '提交失败',
description: '带*号为必填项，不能为空',
});
} else if (
(newPassword && newPassword.length < 6) ||
(passwordConfirm && passwordConfirm < 6)
) {
notification.error({
message: '提交失败',
description: '密码至少为6位!',
});
} else if (newPassword !== passwordConfirm) {
notification.error({
message: '提交失败',
description: '确认密码不一致!',
});
}
};
// 提交-编辑用户
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: '登录名不支持中文!',
});
} else if (userName === '') {
notification.error({
message: '提交失败',
description: '用户姓名不能为空!',
});
} else if (phone !== '' && !isPhone.test(phone)) {
notification.error({
message: '提交失败',
description: '请输入11位手机号!',
});
} else if (email !== '' && !isEmail.test(email)) {
notification.error({
message: '提交失败',
description: '邮箱格式不正确!',
});
}
// 所有验证通过才可以提交,phone/email为空时不验证
else 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 = () => {
......@@ -1137,7 +735,7 @@ const UserManage = () => {
blockNode
autoExpandParent
// expandedKeys={[currentSelectOrg]}
// defaultExpandAll
defaultExpandAll
selectedKeys={[currentSelectOrg]}
onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
......@@ -1220,171 +818,59 @@ const UserManage = () => {
}}
/>
</div>
{/* Modal弹框 */}
{/* 添加用户 */}
<AddUserModal
title={`在${orgTitle}下添加用户`}
visible={userVisible}
orgID={orgID}
onCancel={() => setUserVisible(false)}
// closeModal={() => setUserVisible(false)}
okText="确认"
cancelText="取消"
onSelect={() => onSelect([orgID])}
/>
{/* <Modal
title={`在${orgTitle}下添加用户`}
visible={userVisible}
onOk={submitAddUser}
onCancel={() => setUserVisible(false)}
okText="确认"
cancelText="取消"
>
<Form form={addUserForm} labelCol={{ span: 4 }}>
<Form.Item
name="loginName"
label="登录名称"
rules={[{ required: true, message: '不能为空且不支持中文' }]}
>
<Input placeholder="登录名称不支持中文" />
</Form.Item>
<Form.Item
name="password"
label="账户密码"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入账户密码,至少6位" />
</Form.Item>
<Form.Item
name="userName"
label="用户名称"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入用户姓名" />
</Form.Item>
<Form.Item
name="phone"
label="手机号码"
rules={[
{
pattern: new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/),
message: '请输入11位手机号码!',
},
]}
>
<Input placeholder="请输入11位手机号码" autoComplete="off" />
</Form.Item>
<Form.Item
name="email"
label="电子邮箱"
rules={[
{
type: 'email',
message: '请输入正确的电子邮箱!',
},
]}
>
<Input placeholder="请输入电子邮箱" autoComplete="off" />
</Form.Item>
</Form>
</Modal> */}
{/* 添加下级机构 */}
<Modal
<AddSubOrgModal
title={orgID === '-1' ? '添加顶级机构' : `在${orgTitle}下添加机构`}
visible={addOrgVisible}
onOk={submitAddOrg}
orgID={orgID}
onCancel={() => setAddOrgVisible(false)}
okText="确认"
cancelText="取消"
>
<Form form={addOrgForm} labelCol={{ span: 4 }}>
<Form.Item
name="OUName"
label="机构名称"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入机构名称" />
</Form.Item>
<Form.Item name="description" label="描述">
<Input placeholder="请输入相关描述" />
</Form.Item>
</Form>
</Modal>
onSelect={onSelect}
updateTrees={updateTrees}
/>
{/* 编辑机构 */}
<Modal
<EditOrgModal
title={`编辑${orgTitle}`}
visible={editOrgVisible}
onOk={submitEditOrg}
orgID={orgID}
orgTitle={orgTitle}
description={description}
onCancel={() => setEditOrgVisible(false)}
okText="确认"
cancelText="取消"
>
<Form form={editOrgForm} labelCol={{ span: 4 }}>
<Form.Item
name="OUName"
label="机构名称"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入机构名称" />
</Form.Item>
<Form.Item name="description" label="描述">
<Input placeholder="请输入相关描述" />
</Form.Item>
</Form>
</Modal>
<Modal
onSelect={onSelect}
updateTrees={updateTrees}
/>
{/* 删除机构 */}
<DeleteOrgModal
title="确认删除机构"
visible={deleteOrgVisible}
onOk={submitDeleteOrg}
orgID={orgID}
updateTrees={updateTrees}
onCancel={() => setDeleteOrgVisible(false)}
okText="确认"
cancelText="取消"
>
<p>即将删除该机构，是否确认删除？</p>
</Modal>
/>
{/* 关联角色 */}
<Modal
title="关联角色"
<RelateRoleModal
currentUser={currentUser}
userIDs={userIDs}
currentSelectOrg={currentSelectOrg}
visible={roleVisible}
onOk={multiRelateRoles ? submitRoles : submitRole}
rolelist={rolelist}
loading={loading}
stationlist={stationlist}
multiRelateRoles={multiRelateRoles}
onSelect={onSelect}
onCancel={() => {
setRoleVisible(false);
setMultiRelateRoles(false);
}}
okText="确认"
cancelText="取消"
width="920px"
>
<Spin spinning={loading} tip="loading">
<Tabs defaultActiveKey="1" style={{ marginTop: '-16px' }}>
<TabPane tab="角色" key="1">
{roleVisible &&
rolelist.map((role, index) => (
<ListCardItem
itemid={index}
key={`item${index}key`}
userList={role.roleList}
OUName={role.visibleTitle}
getValueCallback={getRoleValueCallback}
/>
))}
</TabPane>
<TabPane tab="站点" key="2">
{roleVisible &&
stationlist.map((station, index) => (
<ListCardItem
itemid={index}
key={`item${index}key`}
userList={station.stationList}
OUName={station.visibleTitle}
getValueCallback={getStationValueCallback}
/>
))}
</TabPane>
</Tabs>
</Spin>
</Modal>
{/* 更改机构 */}
<Modal
title="更改机构"
......@@ -1416,92 +902,18 @@ const UserManage = () => {
)}
</Modal>
{/* 修改密码 */}
<Modal
title="修改密码"
<ChangePasswordModal
visible={passwordVisible}
onOk={submitChangePassword}
currentUser={currentUser}
onCancel={() => setPasswordVisible(false)}
okText="确认"
cancelText="取消"
>
<Form form={passwordForm} labelCol={{ span: 4 }}>
<Form.Item name="oldPassword" label="原始密码">
<Input disabled />
</Form.Item>
<Form.Item
name="newPassword"
label="新密码"
rules={[{ required: true, message: '不能为空' }]}
>
<Input
placeholder="请输入新密码"
type="password"
autoComplete="off"
/>
</Form.Item>
<Form.Item
name="passwordConfirm"
label="确认密码"
rules={[{ required: true, message: '不能为空' }]}
>
<Input
placeholder="再次确认新密码"
type="password"
autoComplete="off"
/>
</Form.Item>
</Form>
</Modal>
{/* 编辑用户 */}
<Modal
title="编辑用户"
<EditUserModal
visible={editUserVisible}
onOk={submitEditUser}
currentUser={currentUser}
onSelect={onSelect}
onCancel={() => setEditUserVisible(false)}
okText="确认"
cancelText="取消"
>
<Form form={editUserForm} labelCol={{ span: 4 }}>
<Form.Item
name="loginName"
label="登录名称"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入登录名称" />
</Form.Item>
<Form.Item
name="userName"
label="用户姓名"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入用户姓名" />
</Form.Item>
<Form.Item
name="phone"
label="手机号码"
rules={[
{
pattern: new RegExp(/^1(3|4|5|6|7|8|9)\d{9}$/),
message: '请输入11位手机号码!',
},
]}
>
<Input placeholder="请输入11位手机号码" autoComplete="off" />
</Form.Item>
<Form.Item
name="email"
label="电子邮箱"
rules={[
{
type: 'email',
message: '请输入正确的电子邮箱!',
},
]}
>
<Input placeholder="请输入电子邮箱" autoComplete="off" />
</Form.Item>
</Form>
</Modal>
/>
{/* 冻结用户 */}
<Modal
title="请确认"
......
src/services/userCenter/userManage/api.js
View file @ 287c5901
......@@ -58,7 +58,7 @@ export const addUser = ({
email,
});
export const submitAddOrg = (orgID, OUName, description, comment) =>
export const addOrg = (orgID, OUName, description, comment) =>
get(`${CITY_SERVICE}/OMS.svc/U_AddOU`, {
_version: 9999,
_dc: Date.now(),
......
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