- 将日志监控模块重命名为Bug收集模块 - 更新路由路径从 /log/* 到 /bugcollect/* - 修改导航菜单项名称为"Bug收集" - 更新API代理路径从 /api/log 到 /api/bugcollect - 新增完整的Bug收集前端功能实现 - 添加错误列表、概览、事件流水、漏斗分析等功能页面 - 实现错误详情展示包括堆栈追踪和源码上下文 - 创建新的bugcollect API接口文件和类型定义
73 行
2.2 KiB
Vue
73 行
2.2 KiB
Vue
<template>
|
|
<div>
|
|
<h2 style="margin-bottom: 24px">高频错误排行</h2>
|
|
|
|
<el-card shadow="never">
|
|
<el-table :data="rankings" v-loading="loading" border stripe>
|
|
<el-table-column type="index" label="#" width="60" />
|
|
<el-table-column prop="title" label="错误标题" min-width="300" show-overflow-tooltip>
|
|
<template #default="{ row }">
|
|
<el-button link type="primary" @click="$router.push(`/bugcollect/issues/${row.id}`)">
|
|
{{ row.title }}
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="type" label="类型" width="110">
|
|
<template #default="{ row }">
|
|
<el-tag size="small" :type="issueTypeTag(row.type)">{{ row.type }}</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="platform" label="平台" width="110" />
|
|
<el-table-column prop="count" label="次数" width="100" sortable />
|
|
<el-table-column prop="affectedUsers" label="影响用户" width="110" sortable />
|
|
<el-table-column prop="lastSeenAt" label="最后出现" width="170">
|
|
<template #default="{ row }">
|
|
<span class="time-text">{{ formatTime(row.lastSeenAt) }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted } from 'vue'
|
|
import { bugCollectApi, type BugCollectIssueRanking } from '@/api/bugcollect'
|
|
|
|
const rankings = ref<BugCollectIssueRanking[]>([])
|
|
const loading = ref(false)
|
|
|
|
function issueTypeTag(type: string) {
|
|
const map: Record<string, string> = {
|
|
CRASH: 'danger',
|
|
ERROR: 'warning',
|
|
ANR: 'danger',
|
|
WARNING: '',
|
|
}
|
|
return (map[type] ?? '') as '' | 'success' | 'warning' | 'info' | 'danger'
|
|
}
|
|
|
|
function formatTime(ts: string) {
|
|
if (!ts) return '-'
|
|
return new Date(ts).toLocaleString('zh-CN')
|
|
}
|
|
|
|
onMounted(async () => {
|
|
loading.value = true
|
|
try {
|
|
const res = await bugCollectApi.frequencyRanking()
|
|
rankings.value = res.data.data
|
|
} catch {
|
|
} finally {
|
|
loading.value = false
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.time-text {
|
|
font-size: 13px;
|
|
color: #666;
|
|
}
|
|
</style>
|