104 lines
2.3 KiB
Vue
104 lines
2.3 KiB
Vue
<template>
|
|
<PerformanceReport
|
|
title="请求日志报告"
|
|
:site="name"
|
|
:reportOptions="requestLogsOptions"
|
|
/>
|
|
</template>
|
|
|
|
<script>
|
|
import dayjs from '../../../utils/dayjs';
|
|
import PerformanceReport from './PerformanceReport.vue';
|
|
|
|
export default {
|
|
name: 'SiteRequestLogs',
|
|
props: ['name'],
|
|
components: {
|
|
PerformanceReport
|
|
},
|
|
data() {
|
|
return {
|
|
date: null,
|
|
start: 0
|
|
};
|
|
},
|
|
computed: {
|
|
requestLogsOptions() {
|
|
return {
|
|
resource: () => {
|
|
return {
|
|
url: 'jcloud.api.analytics.request_logs',
|
|
makeParams: params => {
|
|
// for filterControls to work
|
|
if (params) return params;
|
|
|
|
return {
|
|
name: this.name,
|
|
timezone: dayjs.tz.guess(),
|
|
sort: 'CPU Time (Descending)',
|
|
date: this.today,
|
|
start: this.start
|
|
};
|
|
},
|
|
auto: true,
|
|
initialData: [],
|
|
transform: data => {
|
|
return data.map(log => {
|
|
log.time = dayjs(log.timestamp).format('HH:mm:ss z');
|
|
log.method = log.request.method;
|
|
log.path = log.request.path;
|
|
log.status = log.request.status_code;
|
|
log.cpu_time = log.duration / 1000000;
|
|
return log;
|
|
});
|
|
}
|
|
};
|
|
},
|
|
columns: [
|
|
{ label: '时间', fieldname: 'time', width: 1 },
|
|
{ label: '方法', fieldname: 'method', width: 0.5 },
|
|
{ label: '路径', fieldname: 'path', width: 2, class: 'font-mono' },
|
|
{
|
|
label: '状态码',
|
|
fieldname: 'status',
|
|
width: 0.5,
|
|
align: 'right'
|
|
},
|
|
{
|
|
label: 'CPU 时间 (秒)',
|
|
fieldname: 'cpu_time',
|
|
width: 1,
|
|
class: 'text-gray-600',
|
|
align: 'right',
|
|
format: value => value.toFixed(2)
|
|
}
|
|
],
|
|
filterControls: () => [
|
|
{
|
|
type: 'select',
|
|
label: '排序',
|
|
fieldname: 'sort',
|
|
class: !this.$isMobile ? 'w-48' : '',
|
|
options: [
|
|
'时间 (升序)',
|
|
'时间 (降序)',
|
|
'CPU 时间 (降序)'
|
|
],
|
|
default: 'CPU Time (Descending)'
|
|
},
|
|
{
|
|
type: 'date',
|
|
label: '日期',
|
|
fieldname: 'date',
|
|
class: !this.$isMobile ? 'w-48' : '',
|
|
default: this.today
|
|
}
|
|
]
|
|
};
|
|
},
|
|
today() {
|
|
return dayjs().format('YYYY-MM-DD');
|
|
}
|
|
}
|
|
};
|
|
</script> |