Commit 5ebb8e4d authored by 陈前坚's avatar 陈前坚

perf: log

parent e66554a4
...@@ -65,9 +65,15 @@ const ServiceLog = () => { ...@@ -65,9 +65,15 @@ const ServiceLog = () => {
key: 'Body', key: 'Body',
}, },
{ {
title: '状态码', title: '结果',
dataIndex: 'Result', dataIndex: 'Result',
key: 'Result', key: 'Result',
render: record => {
if (record === 0) {
return '正常';
}
return '错误';
},
}, },
{ {
title: '错误信息', title: '错误信息',
......
...@@ -23,6 +23,7 @@ const ServiceLog = () => { ...@@ -23,6 +23,7 @@ const ServiceLog = () => {
const [data0, setData0] = useState([]); // 源数据 const [data0, setData0] = useState([]); // 源数据
const [pathCount, setPathCount] = useState([]); // 接口调用次数,统计数据 const [pathCount, setPathCount] = useState([]); // 接口调用次数,统计数据
const [reponseTime, setReponseTime] = useState([]); // 接口调用时长,统计数据 const [reponseTime, setReponseTime] = useState([]); // 接口调用时长,统计数据
const [perMinute, setPerMinute] = useState([]); // 每分钟访问量,统计数据
const [scale, setScale] = useState({}); // 坐标轴别名 const [scale, setScale] = useState({}); // 坐标轴别名
const [startTime, setStartTime] = useState(moment().startOf('day')); // 默认值当天0点 const [startTime, setStartTime] = useState(moment().startOf('day')); // 默认值当天0点
const [endTime, setEndTime] = useState( const [endTime, setEndTime] = useState(
...@@ -65,9 +66,15 @@ const ServiceLog = () => { ...@@ -65,9 +66,15 @@ const ServiceLog = () => {
key: 'Body', key: 'Body',
}, },
{ {
title: '状态码', title: '结果',
dataIndex: 'Result', dataIndex: 'Result',
key: 'Result', key: 'Result',
render: record => {
if (record === 0) {
return '正常';
}
return '错误';
},
}, },
{ {
title: '错误信息', title: '错误信息',
...@@ -133,7 +140,15 @@ const ServiceLog = () => { ...@@ -133,7 +140,15 @@ const ServiceLog = () => {
item.key = index; item.key = index;
return item; return item;
}); });
const dataPerHour = data.map((item, index) => ({
key: index,
minute: item.CallTime.slice(0, 16), // 每分钟minute
hour: item.CallTime.slice(0, 13), // 每分钟minute
date: item.CallTime.slice(0, 10), // 每分钟minute
}));
console.log(dataPerHour);
// 设置坐标轴别名
const scale1 = { const scale1 = {
Path: { Path: {
alias: '接口名称', // 别名 alias: '接口名称', // 别名
...@@ -141,9 +156,26 @@ const ServiceLog = () => { ...@@ -141,9 +156,26 @@ const ServiceLog = () => {
响应时长: { 响应时长: {
alias: '响应时长/ms', // 别名 alias: '响应时长/ms', // 别名
}, },
minute: {
alias: '每分钟访问量',
},
hour: {
alias: '每小时访问量',
},
}; };
setScale(scale1); setScale(scale1);
const dv = new DataSet.View().source(dataPerHour);
dv.transform({
type: 'aggregate', // 别名summary
fields: ['minute'], // 统计字段集
operations: ['count'], // 统计操作集
as: ['计数'], // 存储字段集
groupBy: ['minute'], // 分组字段集
});
console.log(dv.rows);
setPerMinute(dv.rows);
const dv1 = new DataSet.View().source(data); const dv1 = new DataSet.View().source(data);
dv1 dv1
.transform({ .transform({
...@@ -240,7 +272,28 @@ const ServiceLog = () => { ...@@ -240,7 +272,28 @@ const ServiceLog = () => {
</Row> </Row>
<Spin spinning={loading} tip="loading"> <Spin spinning={loading} tip="loading">
<Row className={styles.chart}> <Row className={styles.chart}>
<Col span={12}> <Col span={8}>
<Chart
height={300}
width={400}
autoFit
data={perMinute}
interactions={['active-region']}
padding="auto"
scale={scale}
>
<Axis
name="minute"
// label={{ autoEllipsis: 'true', autoHide: 'true' }}
label="null"
title={{ offset: 20 }}
/>
{/* <Axis name="计数" title /> */}
<Interval position="minute*计数" />
<Tooltip shared />
</Chart>
</Col>
<Col span={8}>
<Chart <Chart
height={300} height={300}
width={400} width={400}
...@@ -261,7 +314,7 @@ const ServiceLog = () => { ...@@ -261,7 +314,7 @@ const ServiceLog = () => {
<Tooltip shared /> <Tooltip shared />
</Chart> </Chart>
</Col> </Col>
<Col span={12}> <Col span={8}>
<Chart <Chart
height={300} height={300}
width={400} width={400}
......
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