oadmin/xinghuoapi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf(admin): optimize large-dataset loading for dashboard/users/accounts/ops

Browse Source
This commit is contained in:
xvhuan
2026-03-04 13:45:49 +08:00
parent 46ea9170cb
commit 80ae592c23
27 changed files with 1109 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
frontend/src/views/admin/DashboardView.vue
View File

@@ -316,6 +316,7 @@ const trendData = ref<TrendDataPoint[]>([])
const modelStats = ref<ModelStat[]>([])
const userTrend = ref<UserUsageTrendPoint[]>([])
let chartLoadSeq = 0
let usersTrendLoadSeq = 0
// Helper function to format date in local timezone
const formatLocalDate = (date: Date): string => {
@@ -523,67 +524,74 @@ const onDateRangeChange = (range: {
}
// Load data
const loadDashboardStats = async () => {
loading.value = true
const loadDashboardSnapshot = async (includeStats: boolean) => {
const currentSeq = ++chartLoadSeq
if (includeStats && !stats.value) {
loading.value = true
}
chartsLoading.value = true
try {
stats.value = await adminAPI.dashboard.getStats()
const response = await adminAPI.dashboard.getSnapshotV2({
start_date: startDate.value,
end_date: endDate.value,
granularity: granularity.value,
include_stats: includeStats,
include_trend: true,
include_model_stats: true,
include_group_stats: false,
include_users_trend: false
})
if (currentSeq !== chartLoadSeq) return
if (includeStats && response.stats) {
stats.value = response.stats
}
trendData.value = response.trend || []
modelStats.value = response.models || []
} catch (error) {
if (currentSeq !== chartLoadSeq) return
appStore.showError(t('admin.dashboard.failedToLoad'))
console.error('Error loading dashboard stats:', error)
console.error('Error loading dashboard snapshot:', error)
} finally {
if (currentSeq !== chartLoadSeq) return
loading.value = false
chartsLoading.value = false
}
}
const loadChartData = async () => {
const currentSeq = ++chartLoadSeq
chartsLoading.value = true
const loadUsersTrend = async () => {
const currentSeq = ++usersTrendLoadSeq
userTrendLoading.value = true
try {
const params = {
start_date: startDate.value,
end_date: endDate.value,
granularity: granularity.value
}
const [trendResponse, modelResponse] = await Promise.all([
adminAPI.dashboard.getUsageTrend(params),
adminAPI.dashboard.getModelStats({ start_date: startDate.value, end_date: endDate.value })
])
if (currentSeq !== chartLoadSeq) return
trendData.value = trendResponse.trend || []
modelStats.value = modelResponse.models || []
} catch (error) {
if (currentSeq !== chartLoadSeq) return
console.error('Error loading chart data:', error)
} finally {
if (currentSeq !== chartLoadSeq) return
chartsLoading.value = false
}
try {
const params = {
const response = await adminAPI.dashboard.getUserUsageTrend({
start_date: startDate.value,
end_date: endDate.value,
granularity: granularity.value,
limit: 12
}
const userResponse = await adminAPI.dashboard.getUserUsageTrend(params)
if (currentSeq !== chartLoadSeq) return
userTrend.value = userResponse.trend || []
})
if (currentSeq !== usersTrendLoadSeq) return
userTrend.value = response.trend || []
} catch (error) {
if (currentSeq !== chartLoadSeq) return
console.error('Error loading user trend:', error)
if (currentSeq !== usersTrendLoadSeq) return
console.error('Error loading users trend:', error)
userTrend.value = []
} finally {
if (currentSeq !== chartLoadSeq) return
if (currentSeq !== usersTrendLoadSeq) return
userTrendLoading.value = false
}
}
const loadDashboardStats = async () => {
await loadDashboardSnapshot(true)
void loadUsersTrend()
}
const loadChartData = async () => {
await loadDashboardSnapshot(false)
void loadUsersTrend()
}
onMounted(() => {
loadDashboardStats()
loadChartData()
})
</script>