|
@@ -1,165 +1,42 @@
|
|
|
import React, { useState, useEffect, useRef } from 'react';
|
|
|
-import { Form, Input, Button, Table, Select, Pagination, Space, Menu, Dropdown, Modal, Breadcrumb, message, Row, Col } from 'antd';
|
|
|
+import { Form, Input, Button, Table, Pagination, Row, Col, Tooltip, DatePicker } from 'antd';
|
|
|
import { DownOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
|
|
|
import '@common/common.less';
|
|
|
-import { useSelector } from 'react-redux'
|
|
|
import apiObj from '@api/index';
|
|
|
+import moment from "moment";
|
|
|
+import "moment/locale/zh-cn"
|
|
|
const { post, api, xPost } = apiObj;
|
|
|
-const { Option } = Select;
|
|
|
+const { RangePicker } = DatePicker;
|
|
|
function OperationLog() {
|
|
|
useEffect(() => {
|
|
|
getOperationLog();
|
|
|
}, []);
|
|
|
- const [userList, setUserList] = useState([]);
|
|
|
- const [title, setTitle] = useState("");
|
|
|
- const [visible, setVisible] = useState(false);
|
|
|
- const [userId, setUserId] = useState("");
|
|
|
- const [msvisible, setMsvisible] = useState(false);
|
|
|
- const [modalType, setModalType] = useState("");
|
|
|
- const [type, setType] = useState("");
|
|
|
- const [formData, setFormData] = useState(null);
|
|
|
- const [username, setUsername] = useState(null);
|
|
|
- const [roleList, setRoleList] = useState([]);
|
|
|
+ const [logList, setLogList] = useState([]);
|
|
|
const [total, setTotal] = useState(0);
|
|
|
+ const [size, setSize] = useState(15);
|
|
|
const [form] = Form.useForm();
|
|
|
- const tipText = {
|
|
|
- 1: '确定要删除该用户?',
|
|
|
- 2: '禁用后该用户将无法登录,确定要禁用该用户?',
|
|
|
- 3: '确定要重置该用户密码?',
|
|
|
- };
|
|
|
- const staticInfo = useSelector(state => {
|
|
|
- return state.staticInfo;
|
|
|
- });
|
|
|
+
|
|
|
let list = []
|
|
|
let params = {
|
|
|
pages: 1,
|
|
|
current: 1,
|
|
|
size: 15
|
|
|
}
|
|
|
- const { statusList } = staticInfo;
|
|
|
- //新增弹窗
|
|
|
- const showModal = (name, type, flag, userId) => {
|
|
|
- setVisible(type);
|
|
|
- setTitle(name);
|
|
|
- setType(flag)
|
|
|
- setUserId(userId)
|
|
|
- if (flag == 1) {
|
|
|
- setFormData({
|
|
|
- status: '1'
|
|
|
- })
|
|
|
- }
|
|
|
- if (flag == 3 || flag == 2) {
|
|
|
- getUserById(userId)
|
|
|
- }
|
|
|
- }
|
|
|
//表格数据
|
|
|
function getOperationLog() {
|
|
|
post(api.getOperationLog, params).then((res) => {
|
|
|
if (res.data.code === 200) {
|
|
|
const data = res.data.data;
|
|
|
- setUserList(data.records);
|
|
|
+ setLogList(data.records);
|
|
|
setTotal(data.total)
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
- //查看用户
|
|
|
- function getUserById(userId) {
|
|
|
- xPost(api.getUserById, { userId: userId }).then((res) => {
|
|
|
- if (res.data.code === 200) {
|
|
|
- const data = res.data.data;
|
|
|
- let roles = []
|
|
|
- data.roles.forEach(item => {
|
|
|
- roles.push(item.roleId)
|
|
|
- })
|
|
|
- const arr = {
|
|
|
- username: data.username,
|
|
|
- mobilePhone: data.mobilePhone,
|
|
|
- password: data.password,
|
|
|
- againpassword: data.password,
|
|
|
- name: data.name,
|
|
|
- idcard: data.idcard,
|
|
|
- addHospitalTreeVO: getHospitals(data.hospitals),
|
|
|
- titleId: data.titleId,
|
|
|
- jobNo: data.jobNo,
|
|
|
- roles: roles,
|
|
|
- orderNo: data.orderNo,
|
|
|
- status: data.status,
|
|
|
- }
|
|
|
- setRoleList(data.roles)
|
|
|
- setFormData(arr)
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- // 处理组织结构数据回显
|
|
|
- function getHospitals(arr) {
|
|
|
- arr.forEach((item, i, array) => {
|
|
|
- item.value = item.hospitalId
|
|
|
- item.title = item.hospitalName
|
|
|
- if (!item.children && item.depts) {
|
|
|
- item.depts.forEach(it => {
|
|
|
- it.value = item.parentId + '-' + it.deptId
|
|
|
- if (it.relation == 1) {
|
|
|
- list.push(it.value)
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- if (item.type != 0 && item.relation == 1) {
|
|
|
- list.push(item.value)
|
|
|
- console.log(list)
|
|
|
- }
|
|
|
- if (item.children) {
|
|
|
- getHospitals(item.children)
|
|
|
- }
|
|
|
- })
|
|
|
- return list
|
|
|
- }
|
|
|
- // 禁用/启用接口
|
|
|
- function disableUser(userId, status) {
|
|
|
- const param = { userId: userId, status: status };
|
|
|
- xPost(api.disableUser, param).then((res) => {
|
|
|
- if (res.data.code === 200) {
|
|
|
- getOperationLog();
|
|
|
- setMsvisible(false);
|
|
|
- message.success((status ? '启用' : '禁用') + "成功");
|
|
|
- } else {
|
|
|
- message.warning(res.data.msg || '操作失败');
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
- message.error("接口出错");
|
|
|
- });
|
|
|
- }
|
|
|
- //重置密码
|
|
|
- function onResetPsd(userId) {
|
|
|
- const param = { userId: userId };
|
|
|
- xPost(api.resetPasswordUser, param).then((res) => {
|
|
|
- if (res.data.code === 200) {
|
|
|
- getOperationLog();
|
|
|
- message.success("重置成功");
|
|
|
- } else {
|
|
|
- message.warning(res.data.msg || '操作失败');
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
- message.error("接口出错");
|
|
|
- });
|
|
|
- }
|
|
|
- //删除
|
|
|
- function deleteUser() {
|
|
|
- const param = { userId: userId };
|
|
|
- xPost(api.deleteUser, param).then((res) => {
|
|
|
- if (res.data.code === 200) {
|
|
|
- getOperationLog();
|
|
|
- setMsvisible(false);
|
|
|
- message.success("删除成功");
|
|
|
- } else {
|
|
|
- message.warning(res.data.msg || '操作失败');
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
- message.error("接口出错");
|
|
|
- });
|
|
|
- }
|
|
|
+
|
|
|
function onSizeChange(current, pageSize) {
|
|
|
params.current = current
|
|
|
params.size = pageSize
|
|
|
+ setSize(pageSize)
|
|
|
getOperationLog()
|
|
|
}
|
|
|
function changePage(page, pageSize) {
|
|
@@ -167,10 +44,13 @@ function OperationLog() {
|
|
|
params.size = pageSize
|
|
|
getOperationLog()
|
|
|
}
|
|
|
+
|
|
|
const onFinish = (value) => {
|
|
|
+ value.startDate = moment(value.time[0]).format('YYYY-MM-DD HH:mm:ss')
|
|
|
+ value.endDate = moment(value.time[1]).format('YYYY-MM-DD HH:mm:ss')
|
|
|
params = {
|
|
|
...params,
|
|
|
- ...value
|
|
|
+ ...value,
|
|
|
}
|
|
|
getOperationLog();
|
|
|
};
|
|
@@ -178,82 +58,20 @@ function OperationLog() {
|
|
|
form.resetFields();
|
|
|
getOperationLog();
|
|
|
};
|
|
|
- const messageBox = (type, id) => {
|
|
|
- setMsvisible(true)
|
|
|
- setUserId(id)
|
|
|
- setModalType(type)
|
|
|
- }
|
|
|
-
|
|
|
- //提示框确认事件
|
|
|
- function handleOk() {
|
|
|
- if (modalType == 1) {
|
|
|
- deleteUser(userId)
|
|
|
- } else if (modalType == 2) {
|
|
|
- disableUser(userId, 0)
|
|
|
- } else if (modalType == 3) {
|
|
|
- onResetPsd(userId);
|
|
|
- }
|
|
|
- }
|
|
|
- //提示框取消
|
|
|
- function handleCancel() {
|
|
|
- setMsvisible(false);
|
|
|
- }
|
|
|
- function cancel() {
|
|
|
- setVisible(false)
|
|
|
- setFormData(null)
|
|
|
- }
|
|
|
- function userChange() {
|
|
|
- setVisible(false)
|
|
|
- }
|
|
|
const columns = [
|
|
|
- { title: '用户名', dataIndex: 'username', key: 'index' },
|
|
|
- { title: '姓名', dataIndex: 'name', key: 'index' },
|
|
|
- { title: '所属组织', dataIndex: 'hospitalName', key: 'index' },
|
|
|
- { title: '工号', dataIndex: 'jobNo', key: 'index' },
|
|
|
+ { title: '编号', dataIndex: 'operationId', key: 'index' },
|
|
|
+ { title: '操作人', dataIndex: 'operationName', key: 'index' },
|
|
|
+ { title: '操作日期', dataIndex: 'operationDate', key: 'index' },
|
|
|
+ { title: 'IP地址', dataIndex: 'operationIp', key: 'index' },
|
|
|
{
|
|
|
- title: '状态', dataIndex: 'status', key: 'status', render: (text, record) => (
|
|
|
- <Space size="middle">
|
|
|
- {record.status == 1 ?
|
|
|
- <span className="Enable">启用</span>
|
|
|
- :
|
|
|
- <span className="Disable">禁用</span>
|
|
|
- }
|
|
|
- </Space>
|
|
|
+ title: '操作记录', dataIndex: 'status', key: 'status', render: (text, record) => (
|
|
|
+ <Tooltip placement="top" title={record.jsonResult}>
|
|
|
+ <span className="record">{record.jsonResult}</span>
|
|
|
+ </Tooltip>
|
|
|
+
|
|
|
)
|
|
|
},
|
|
|
- {
|
|
|
- title: '操作', dataIndex: 'key', render: (text, record) => (
|
|
|
- <Space size="middle">
|
|
|
- <a onClick={e => showModal('查看用户', true, 3, record.userId)}>查看</a>
|
|
|
- <a onClick={e => showModal('修改用户', true, 2, record.userId)} >修改</a>
|
|
|
- <Dropdown overlay={menu.bind(this, record)} record={record}>
|
|
|
- <a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
|
|
|
- 更多 <DownOutlined />
|
|
|
- </a>
|
|
|
- </Dropdown>
|
|
|
- </Space>
|
|
|
- )
|
|
|
- }
|
|
|
]
|
|
|
- const menu = (record) => {
|
|
|
- return (
|
|
|
- <Menu>
|
|
|
- <Menu.Item key="0" className="menuItem" >
|
|
|
- <a onClick={() => messageBox(3, record.userId)}>
|
|
|
- 重置密码
|
|
|
- </a>
|
|
|
- </Menu.Item>
|
|
|
- <Menu.Item key="1" className="menuItem" >
|
|
|
- {record.status === '1' ? (<a onClick={() => messageBox(2, record.userId)}>禁用</a>) : (<a onClick={() => disableUser(record.userId, 1)}>启用</a>)}
|
|
|
- </Menu.Item>
|
|
|
- <Menu.Item key="2" className="menuItem" >
|
|
|
- <a onClick={() => messageBox(1, record.userId)}>
|
|
|
- 删除
|
|
|
- </a>
|
|
|
- </Menu.Item>
|
|
|
- </Menu>
|
|
|
- )
|
|
|
- }
|
|
|
return (
|
|
|
<div className="wrapper">
|
|
|
<div className="filter-box">
|
|
@@ -265,26 +83,17 @@ function OperationLog() {
|
|
|
>
|
|
|
<Row gutter={24}>
|
|
|
<Col span={5} key={0}>
|
|
|
- <Form.Item label="用户名" name="username">
|
|
|
+ <Form.Item label="操作人" name="operationName">
|
|
|
<Input placeholder="用户名" />
|
|
|
</Form.Item>
|
|
|
</Col>
|
|
|
<Col span={5} key={1}>
|
|
|
- <Form.Item label="姓名" name="name">
|
|
|
- <Input placeholder="姓名" />
|
|
|
- </Form.Item>
|
|
|
- </Col>
|
|
|
- <Col span={5} key={2}>
|
|
|
- <Form.Item name="status" label="当前状态">
|
|
|
- <Select
|
|
|
- allowClear
|
|
|
- >
|
|
|
- {statusList.map((item) => {
|
|
|
- return (
|
|
|
- <Option value={item.name} key={item.name}>{item.val}</Option>
|
|
|
- )
|
|
|
- })}
|
|
|
- </Select>
|
|
|
+ <Form.Item name="time">
|
|
|
+ <RangePicker
|
|
|
+ showTime={{ format: 'HH:mm' }}
|
|
|
+ format="YYYY-MM-DD HH:mm"
|
|
|
+ placeholder={['开始时间', '结束时间']}
|
|
|
+ />
|
|
|
</Form.Item>
|
|
|
</Col>
|
|
|
<Col span={6} key={3}>
|
|
@@ -303,17 +112,16 @@ function OperationLog() {
|
|
|
|
|
|
<div className="table">
|
|
|
<div className="table-header">
|
|
|
- <h2 className="table-title">用户管理</h2>
|
|
|
- <Button type="primary" icon={<PlusOutlined />} onClick={e => showModal('新增用户', true, 1)}>新增用户</Button>
|
|
|
+ <h2 className="table-title">操作日志</h2>
|
|
|
</div>
|
|
|
|
|
|
<Table
|
|
|
columns={columns}
|
|
|
- dataSource={userList}
|
|
|
- rowKey={record => record.userId + record.hospitalName}
|
|
|
+ dataSource={logList}
|
|
|
+ rowKey={record => record.operationDate}
|
|
|
pagination={{
|
|
|
pageNo: 1,
|
|
|
- pageSize: params.size,
|
|
|
+ pageSize: size,
|
|
|
pageSizeOptions: ['15', '30', '60', '120'],
|
|
|
showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
|
|
|
onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
|
|
@@ -321,17 +129,6 @@ function OperationLog() {
|
|
|
total: total
|
|
|
}} />
|
|
|
</div>
|
|
|
- <Modal
|
|
|
- title="提示"
|
|
|
- okText='确定'
|
|
|
- cancelText='取消'
|
|
|
- width={400}
|
|
|
- visible={msvisible}
|
|
|
- onOk={handleOk}
|
|
|
- onCancel={handleCancel}
|
|
|
- >
|
|
|
- <p>{tipText[modalType]}</p>
|
|
|
- </Modal>
|
|
|
</div >
|
|
|
)
|
|
|
}
|