From c32240127104aaa17491e10eb3cabe97d9150e2f Mon Sep 17 00:00:00 2001 From: ky_yusj <2655568377@qq.com> Date: Wed, 16 Jun 2021 10:07:14 +0800 Subject: [PATCH] update --- Api/Ewide.Core/Service/Log/Dto/OpLogOutput.cs | 2 +- .../Service/Log/Dto/VisLogOutput.cs | 2 +- .../src/components/query-table/index.jsx | 2 +- .../src/pages/system/log/oplog/index.jsx | 28 ++- .../src/pages/system/log/vislog/index.jsx | 235 ++++++++++++++++++ 5 files changed, 259 insertions(+), 10 deletions(-) create mode 100644 web-react/src/pages/system/log/vislog/index.jsx diff --git a/Api/Ewide.Core/Service/Log/Dto/OpLogOutput.cs b/Api/Ewide.Core/Service/Log/Dto/OpLogOutput.cs index 5c6acf1..d87db72 100644 --- a/Api/Ewide.Core/Service/Log/Dto/OpLogOutput.cs +++ b/Api/Ewide.Core/Service/Log/Dto/OpLogOutput.cs @@ -5,6 +5,6 @@ /// public class OpLogOutput : OpLogInput { - + public int Id { get; set; } } } diff --git a/Api/Ewide.Core/Service/Log/Dto/VisLogOutput.cs b/Api/Ewide.Core/Service/Log/Dto/VisLogOutput.cs index 3910f4b..b685285 100644 --- a/Api/Ewide.Core/Service/Log/Dto/VisLogOutput.cs +++ b/Api/Ewide.Core/Service/Log/Dto/VisLogOutput.cs @@ -5,6 +5,6 @@ /// public class VisLogOutput : VisLogInput { - + public int Id { get; set; } } } diff --git a/web-react/src/components/query-table/index.jsx b/web-react/src/components/query-table/index.jsx index 8b3ba36..1e51f2d 100644 --- a/web-react/src/components/query-table/index.jsx +++ b/web-react/src/components/query-table/index.jsx @@ -223,7 +223,7 @@ export default class QueryTable extends Component { columns: (columns || []).filter(p => !p.hidden), bordered: true, size: 'middle', - rowKey: record => record.id || record, + rowKey: record => record.id || Math.random().toString(16).slice(2), ...this.props } diff --git a/web-react/src/pages/system/log/oplog/index.jsx b/web-react/src/pages/system/log/oplog/index.jsx index 1f2d47b..40fc3da 100644 --- a/web-react/src/pages/system/log/oplog/index.jsx +++ b/web-react/src/pages/system/log/oplog/index.jsx @@ -1,5 +1,5 @@ import React, { Component } from 'react' -import { Alert, Button, Card, Descriptions, Form, Popconfirm, Input, message as Message, Select } from 'antd' +import { Alert, Button, Card, Descriptions, Form, Popconfirm, Input, message as Message, Select, DatePicker } from 'antd' import { Auth, Container, QueryTable } from 'components' import { api } from 'common/api' import { toCamelCase } from 'util/format' @@ -7,6 +7,8 @@ import { isEqual } from 'lodash' import getDicData from 'util/dic' import moment from 'moment' +const { RangePicker } = DatePicker; + const apiAction = { page: api.sysOpLogPage, delete: api.sysOpLogDelete @@ -95,11 +97,11 @@ export default class index extends Component { * @returns */ loadData = async (params, query) => { - // if (query.dates && query.dates.length) { - // query.searchBeginTime = moment(query.dates[0]).format('YYYY-MM-DD HH:mm:ss'); - // query.searchEndTime = moment(query.dates[1]).format('YYYY-MM-DD HH:mm:ss'); - // delete query.dates; - // } + if (query.dates && query.dates.length) { + query.searchBeginTime = moment(query.dates[0]).format('YYYY-MM-DD HH:mm:ss'); + query.searchEndTime = moment(query.dates[1]).format('YYYY-MM-DD HH:mm:ss'); + delete query.dates; + } const { data } = await apiAction.page({ ...params, ...query, @@ -182,7 +184,7 @@ export default class index extends Component { } - + + + + + } operator={ diff --git a/web-react/src/pages/system/log/vislog/index.jsx b/web-react/src/pages/system/log/vislog/index.jsx new file mode 100644 index 0000000..b0651eb --- /dev/null +++ b/web-react/src/pages/system/log/vislog/index.jsx @@ -0,0 +1,235 @@ +import React, { Component } from 'react' +import { Alert, Button, Card, Descriptions, Form, Popconfirm, Input, message as Message, Select, DatePicker } from 'antd' +import { Auth, Container, QueryTable } from 'components' +import { api } from 'common/api' +import { toCamelCase } from 'util/format' +import { isEqual } from 'lodash' +import getDicData from 'util/dic' +import moment from 'moment' + +const { RangePicker } = DatePicker; + +const apiAction = { + page: api.sysVisLogPage, + delete: api.sysVisLogDelete +} +export default class index extends Component { + state = { + codes: { + visType: [] + } + } + // 表格实例 + table = React.createRef() + // 表格字段 + columns = [ + { + title: '日志名称', + dataIndex: 'name', + sorter: true, + }, + { + title: '访问类型', + dataIndex: 'visType', + render: text => (<>{this.bindCodeValue(text, 'vis_type')}), + sorter: true, + }, + { + title: '是否成功', + dataIndex: 'success', + render: text => (<> {text ? '是' : '否'}), + sorter: true, + }, + { + title: 'ip', + dataIndex: 'ip', + sorter: true, + }, + { + title: '浏览器', + dataIndex: 'browser', + sorter: true, + }, + { + title: '访问时间', + dataIndex: 'visTime', + sorter: true, + }, + { + title: '访问人', + dataIndex: 'account', + sorter: true, + }, + ] + + /** + * 阻止外部组件引发的渲染,提升性能 + * 可自行添加渲染条件 + * [必要] + * @param {*} props + * @param {*} state + * @returns + */ + shouldComponentUpdate(props, state) { + return !isEqual(this.state, state) + } + + /** + * 加载字典数据,之后开始加载表格数据 + * 如果必须要加载字典数据,可直接对表格设置autoLoad=true + */ + componentDidMount() { + this.table.current.onLoading() + getDicData('vis_type').then(res => { + this.setState({ + codes: res + }, () => { + this.table.current.onLoadData() + }) + }) + } + + /** + * 调用加载数据接口,可在调用前对query进行处理 + * [异步,必要] + * @param {*} params + * @param {*} query + * @returns + */ + loadData = async (params, query) => { + if (query.dates && query.dates.length) { + query.searchBeginTime = moment(query.dates[0]).format('YYYY-MM-DD HH:mm:ss'); + query.searchEndTime = moment(query.dates[1]).format('YYYY-MM-DD HH:mm:ss'); + delete query.dates; + } + const { data } = await apiAction.page({ + ...params, + ...query, + }) + return data + } + /** + * 绑定字典数据 + * @param {*} code + * @param {*} name + * @returns + */ + bindCodeValue(code, name) { + name = toCamelCase(name) + const codes = this.state.codes[name] + if (codes) { + const c = codes.find((p) => +p.code === code) + if (c) { + return c.value + } + } + return null + } + + /** + * 对表格上的操作进行统一处理 + * [异步] + * @param {*} action + * @param {*} successMessage + */ + async onAction(action, successMessage) { + this.table.current.onLoading() + try { + await action + Message.success(successMessage) + this.table.current.onReloadData() + } catch { + this.table.current.onLoaded() + } + } + + onVisLogClear() { + this.onAction( + apiAction.delete(), + '清空成功' + ) + } + + render() { + return ( + +
+ +
+ + + + + + + + + + + + + + + + + } + operator={ + + this.onVisLogClear()} + > + + + + } + expandable={{ + expandedRowRender: record => + + + {record.message} + + + }} + /> + +
+ ) + } +} \ No newline at end of file