Commit 6cd25fc0 authored by 陈前坚's avatar 陈前坚

perf: 日志表格固定表头

parent a8db7171
Pipeline #21613 skipped with stages
...@@ -132,7 +132,7 @@ const LoginLog = () => { ...@@ -132,7 +132,7 @@ const LoginLog = () => {
return ( return (
<> <>
<div className={styles.serviceLog}> <div className={styles.loginLog}>
<Row className={styles.head}> <Row className={styles.head}>
<Col span={24}> <Col span={24}>
<span style={{ lineHeight: 2 }}>时间:</span> <span style={{ lineHeight: 2 }}>时间:</span>
...@@ -169,7 +169,7 @@ const LoginLog = () => { ...@@ -169,7 +169,7 @@ const LoginLog = () => {
bordered bordered
columns={columns} columns={columns}
dataSource={data0} dataSource={data0}
scroll={{ x: 'max-content' }} scroll={{ x: 'max-content', y: 'calc(100vh - 208px)' }}
pagination={{ pagination={{
showTotal: (total, range) => showTotal: (total, range) =>
`第${range[0]}-${range[1]} 条/共 ${total} 条`, `第${range[0]}-${range[1]} 条/共 ${total} 条`,
......
.serviceLog{ .loginLog{
.head{ .head{
padding: 10px; padding: 10px;
background: white; background: white;
...@@ -16,8 +16,8 @@ ...@@ -16,8 +16,8 @@
font-weight: 600; font-weight: 600;
color:rgba(0,0,0,0.85); color:rgba(0,0,0,0.85);
} }
.ant-table-content{ .ant-table-body{
height:calc(100vh - 172px); height:calc(100vh - 208px);
border-right: white; border-right: white;
overflow: auto !important; overflow: auto !important;
} }
......
...@@ -31,6 +31,7 @@ const OmsLog = () => { ...@@ -31,6 +31,7 @@ const OmsLog = () => {
title: '操作时间', title: '操作时间',
dataIndex: 'logTime', dataIndex: 'logTime',
key: 'logTime', key: 'logTime',
width: 200,
// defaultSortOrder: 'descend', // defaultSortOrder: 'descend',
sortDirections: ['descend', 'ascend'], sortDirections: ['descend', 'ascend'],
sorter: (a, b) => sorter: (a, b) =>
...@@ -40,6 +41,7 @@ const OmsLog = () => { ...@@ -40,6 +41,7 @@ const OmsLog = () => {
title: '接口名称', title: '接口名称',
dataIndex: 'functionName', dataIndex: 'functionName',
key: 'functionName', key: 'functionName',
width: 300,
// filters: functionNameFilters, // filters: functionNameFilters,
// onFilter: (value, record) => record.functionName === value, // onFilter: (value, record) => record.functionName === value,
}, },
...@@ -47,13 +49,13 @@ const OmsLog = () => { ...@@ -47,13 +49,13 @@ const OmsLog = () => {
title: '标签', title: '标签',
dataIndex: 'label', dataIndex: 'label',
key: 'label', key: 'label',
// width: 300, width: 300,
}, },
{ {
title: '优先级', title: '优先级',
dataIndex: 'level', dataIndex: 'level',
key: 'level', key: 'level',
// width: 100, width: 100,
filters: levelFilters, filters: levelFilters,
onFilter: (value, record) => record.level === value, onFilter: (value, record) => record.level === value,
}, },
...@@ -61,7 +63,7 @@ const OmsLog = () => { ...@@ -61,7 +63,7 @@ const OmsLog = () => {
title: '详情', title: '详情',
dataIndex: 'shortInfo', dataIndex: 'shortInfo',
key: 'shortInfo', key: 'shortInfo',
// ellipsis: 'true', ellipsis: 'true',
// width: 300, // width: 300,
}, },
]; ];
...@@ -188,7 +190,7 @@ const OmsLog = () => { ...@@ -188,7 +190,7 @@ const OmsLog = () => {
bordered bordered
columns={columns} columns={columns}
dataSource={data} dataSource={data}
scroll={{ x: 'max-content' }} scroll={{ x: 'max-content', y: 'calc(100vh - 208px)' }}
pagination={{ pagination={{
showTotal: (total, range) => showTotal: (total, range) =>
`第${range[0]}-${range[1]} 条/共 ${total} 条`, `第${range[0]}-${range[1]} 条/共 ${total} 条`,
......
...@@ -16,13 +16,13 @@ ...@@ -16,13 +16,13 @@
font-weight: 600; font-weight: 600;
color:rgba(0,0,0,0.85); color:rgba(0,0,0,0.85);
} }
.ant-table-content{ .ant-table-body{
height:calc(100vh - 172px); height:calc(100vh - 208px);
border-right: white; border-right: white;
overflow: auto !important; overflow: auto !important;
.ant-table-tbody{ // .ant-table-tbody{
overflow: scroll !important; // overflow: scroll !important;
} // }
} }
.ant-pagination{ .ant-pagination{
z-index: 999; z-index: 999;
......
...@@ -62,44 +62,25 @@ const ServiceLog = () => { ...@@ -62,44 +62,25 @@ const ServiceLog = () => {
dataIndex: 'Path', dataIndex: 'Path',
key: 'Path', key: 'Path',
fixed: 'left', fixed: 'left',
width: 340,
}, },
{ {
title: '调用时间', title: '调用时间',
dataIndex: 'CallTime', dataIndex: 'CallTime',
key: 'CallTime', key: 'CallTime',
width: 160,
}, },
{ {
title: 'IP', title: 'IP',
dataIndex: 'DownstreamRequest', dataIndex: 'DownstreamRequest',
key: 'DownstreamRequest', key: 'DownstreamRequest',
width: 120,
}, },
{ {
title: '返回状态', title: '返回状态',
dataIndex: 'Result', dataIndex: 'Result',
key: 'Result', key: 'Result',
render: record => { width: 80,
let value = '';
switch (record.toString().charAt(0)) {
case '1':
value = '继续请求';
break;
case '2':
value = '请求成功';
break;
case '3':
value = '重定向';
break;
case '4':
value = '客户端错误';
break;
case '5':
value = '服务器错误';
break;
default:
break;
}
return value;
},
}, },
{ {
title: '错误信息', title: '错误信息',
...@@ -116,6 +97,7 @@ const ServiceLog = () => { ...@@ -116,6 +97,7 @@ const ServiceLog = () => {
title: '请求方法', title: '请求方法',
dataIndex: 'Method', dataIndex: 'Method',
key: 'Method', key: 'Method',
width: 100,
}, },
{ {
title: '耗时/ms', title: '耗时/ms',
...@@ -132,7 +114,7 @@ const ServiceLog = () => { ...@@ -132,7 +114,7 @@ const ServiceLog = () => {
dataIndex: 'ResponseSize', dataIndex: 'ResponseSize',
key: 'ResponseSize', key: 'ResponseSize',
fixed: 'right', fixed: 'right',
width: 150, width: 140,
sortDirections: ['descend', 'ascend'], sortDirections: ['descend', 'ascend'],
sorter: (a, b) => a.ResponseSize - b.ResponseSize, sorter: (a, b) => a.ResponseSize - b.ResponseSize,
}, },
...@@ -366,7 +348,8 @@ const ServiceLog = () => { ...@@ -366,7 +348,8 @@ const ServiceLog = () => {
bordered bordered
columns={columns} columns={columns}
dataSource={dataTable} dataSource={dataTable}
scroll={{ x: 'max-content' }} // scroll={{ x: 'max-content'}}
scroll={{ x: 'max-content', y: 'calc(100vh - 562px)' }}
pagination={{ pagination={{
showTotal: (total, range) => showTotal: (total, range) =>
`第${range[0]}-${range[1]} 条/共 ${total} 条`, `第${range[0]}-${range[1]} 条/共 ${total} 条`,
......
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
color:rgba(0,0,0,0.85); color:rgba(0,0,0,0.85);
} }
.ant-table-content{ .ant-table-content{
height:calc(100vh - 520px); height:calc(100vh - 562px);
border-right: white; border-right: white;
overflow: auto !important; overflow: auto !important;
} }
......
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