mojiahui/dafuweng-saiadmin6.x
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化主页数据统计

Browse Source
This commit is contained in:
zhenhui
2026-03-10 12:42:29 +08:00
parent fdd8f6dffa
commit 6f56574aac
8 changed files with 279 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
saiadmin-artd/src/views/dashboard/console/modules/card-list.vue
View File

@@ -2,73 +2,95 @@
<ElRow :gutter="20" class="flex">
<ElCol :sm="12" :md="6" :lg="6">
<div class="art-card relative flex flex-col justify-center h-35 px-5 mb-5 max-sm:mb-4">
<span class="text-g-700 text-sm">用户统计</span>
<ArtCountTo class="text-[26px] font-medium mt-2" :target="statData.user" :duration="1300" />
<span class="text-g-700 text-sm">玩家注册</span>
<ArtCountTo class="text-[26px] font-medium mt-2" :target="statData.player_count" :duration="1300" />
<div class="flex-c mt-1">
<span class="text-xs text-g-600">较上周</span>
<span class="ml-1 text-xs font-semibold text-success">+10%</span>
<span
class="ml-1 text-xs font-semibold"
:class="changeClass(statData.player_count_change)"
>
{{ formatChange(statData.player_count_change) }}
</span>
</div>
<div
class="absolute top-0 bottom-0 right-5 m-auto size-12.5 rounded-xl flex-cc bg-theme/10"
>
<ArtSvgIcon icon="ri:group-line" class="text-xl text-theme" />
<ArtSvgIcon icon="ri:user-add-line" class="text-xl text-theme" />
</div>
</div>
</ElCol>
<ElCol :sm="12" :md="6" :lg="6">
<div class="art-card relative flex flex-col justify-center h-35 px-5 mb-5 max-sm:mb-4">
<span class="text-g-700 text-sm">附件统计</span>
<span class="text-g-700 text-sm">玩家充值</span>
<ArtCountTo
class="text-[26px] font-medium mt-2"
:target="statData.attach"
:target="statData.charge_amount"
:duration="1300"
:decimals="2"
/>
<div class="flex-c mt-1">
<span class="text-xs text-g-600">较上周</span>
<span class="ml-1 text-xs font-semibold text-success">+10%</span>
<span
class="ml-1 text-xs font-semibold"
:class="changeClass(statData.charge_amount_change)"
>
{{ formatChange(statData.charge_amount_change) }}
</span>
</div>
<div
class="absolute top-0 bottom-0 right-5 m-auto size-12.5 rounded-xl flex-cc bg-theme/10"
>
<ArtSvgIcon icon="ri:attachment-line" class="text-xl text-theme" />
<ArtSvgIcon icon="ri:money-dollar-circle-line" class="text-xl text-theme" />
</div>
</div>
</ElCol>
<ElCol :sm="12" :md="6" :lg="6">
<div class="art-card relative flex flex-col justify-center h-35 px-5 mb-5 max-sm:mb-4">
<span class="text-g-700 text-sm">登录统计</span>
<span class="text-g-700 text-sm">玩家提现</span>
<ArtCountTo
class="text-[26px] font-medium mt-2"
:target="statData.login"
:target="statData.withdraw_amount"
:duration="1300"
:decimals="2"
/>
<div class="flex-c mt-1">
<span class="text-xs text-g-600">较上周</span>
<span class="ml-1 text-xs font-semibold text-success">+12%</span>
<span
class="ml-1 text-xs font-semibold"
:class="changeClass(statData.withdraw_amount_change)"
>
{{ formatChange(statData.withdraw_amount_change) }}
</span>
</div>
<div
class="absolute top-0 bottom-0 right-5 m-auto size-12.5 rounded-xl flex-cc bg-theme/10"
>
<ArtSvgIcon icon="ri:fire-line" class="text-xl text-theme" />
<ArtSvgIcon icon="ri:bank-card-line" class="text-xl text-theme" />
</div>
</div>
</ElCol>
<ElCol :sm="12" :md="6" :lg="6">
<div class="art-card relative flex flex-col justify-center h-35 px-5 mb-5 max-sm:mb-4">
<span class="text-g-700 text-sm">操作统计</span>
<span class="text-g-700 text-sm">玩家游玩次数</span>
<ArtCountTo
class="text-[26px] font-medium mt-2"
:target="statData.operate"
:target="statData.play_count"
:duration="1300"
/>
<div class="flex-c mt-1">
<span class="text-xs text-g-600">较上周</span>
<span class="ml-1 text-xs font-semibold text-danger">-5%</span>
<span
class="ml-1 text-xs font-semibold"
:class="changeClass(statData.play_count_change)"
>
{{ formatChange(statData.play_count_change) }}
</span>
</div>
<div
class="absolute top-0 bottom-0 right-5 m-auto size-12.5 rounded-xl flex-cc bg-theme/10"
>
<ArtSvgIcon icon="ri:pie-chart-line" class="text-xl text-theme" />
<ArtSvgIcon icon="ri:gamepad-line" class="text-xl text-theme" />
</div>
</div>
</ElCol>
@@ -79,15 +101,40 @@
import { fetchStatistics } from '@/api/dashboard'
const statData = ref({
user: 0,
attach: 0,
login: 0,
operate: 0
player_count: 0,
player_count_change: 0,
charge_amount: 0,
charge_amount_change: 0,
withdraw_amount: 0,
withdraw_amount_change: 0,
play_count: 0,
play_count_change: 0
})
function formatChange(val: number): string {
if (val > 0) return `+${val}%`
if (val < 0) return `${val}%`
return '0%'
}
function changeClass(val: number): string {
if (val > 0) return 'text-success'
if (val < 0) return 'text-danger'
return 'text-g-600'
}
onMounted(() => {
fetchStatistics().then((data) => {
statData.value = data
fetchStatistics().then((data: any) => {
statData.value = {
player_count: data?.player_count ?? 0,
player_count_change: data?.player_count_change ?? 0,
charge_amount: data?.charge_amount ?? 0,
charge_amount_change: data?.charge_amount_change ?? 0,
withdraw_amount: data?.withdraw_amount ?? 0,
withdraw_amount_change: data?.withdraw_amount_change ?? 0,
play_count: data?.play_count ?? 0,
play_count_change: data?.play_count_change ?? 0
}
})
})
</script>