mirror of
https://github.com/fawney19/Aether.git
synced 2026-10-07 18:07:47 +08:00
fawney19
a2f33a6c35
- 新增独立热力图 API 端点 (/api/admin/usage/heatmap, /api/users/me/usage/heatmap) - 添加 Redis 缓存层 (5分钟 TTL)，减少数据库查询 - 用户角色变更时清除热力图缓存 - 前端并行加载统计数据和热力图，添加加载/错误状态显示 - 修复 cache_decorator 缺少 JSON 解析错误处理的问题 - 更新 docker-compose 启动命令提示
69 lines
1.9 KiB
Vue
69 lines
1.9 KiB
Vue
<template>
|
|
<Card class="p-4 overflow-hidden">
|
|
<div class="flex items-center justify-between mb-3">
|
|
<p class="text-sm font-semibold">
|
|
{{ title }}
|
|
</p>
|
|
<div
|
|
v-if="hasData"
|
|
class="flex items-center gap-1 text-[11px] text-muted-foreground flex-shrink-0"
|
|
>
|
|
<span class="flex-shrink-0">少</span>
|
|
<div
|
|
v-for="(level, index) in legendLevels"
|
|
:key="index"
|
|
class="w-3 h-3 rounded-[3px] flex-shrink-0"
|
|
:style="{ backgroundColor: `rgba(var(--color-primary-rgb), ${level})` }"
|
|
/>
|
|
<span class="flex-shrink-0">多</span>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="isLoading"
|
|
class="h-full min-h-[160px] flex items-center justify-center text-sm text-muted-foreground"
|
|
>
|
|
<Loader2 class="h-5 w-5 animate-spin mr-2" />
|
|
加载中...
|
|
</div>
|
|
<div
|
|
v-else-if="hasError"
|
|
class="h-full min-h-[160px] flex items-center justify-center text-sm text-destructive"
|
|
>
|
|
<AlertCircle class="h-4 w-4 mr-1.5" />
|
|
加载失败
|
|
</div>
|
|
<ActivityHeatmap
|
|
v-else-if="hasData"
|
|
:data="data"
|
|
:show-header="false"
|
|
/>
|
|
<div
|
|
v-else
|
|
class="h-full min-h-[160px] flex items-center justify-center text-sm text-muted-foreground"
|
|
>
|
|
暂无活跃数据
|
|
</div>
|
|
</Card>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { Loader2, AlertCircle } from 'lucide-vue-next'
|
|
import Card from '@/components/ui/card.vue'
|
|
import ActivityHeatmap from '@/components/stats/ActivityHeatmap.vue'
|
|
import type { ActivityHeatmap as ActivityHeatmapData } from '@/types/activity'
|
|
|
|
const props = defineProps<{
|
|
data: ActivityHeatmapData | null
|
|
title: string
|
|
isLoading?: boolean
|
|
hasError?: boolean
|
|
}>()
|
|
|
|
const legendLevels = [0.08, 0.25, 0.45, 0.65, 0.85]
|
|
|
|
const hasData = computed(() =>
|
|
props.data && props.data.days && props.data.days.length > 0
|
|
)
|
|
</script>
|