github/sub2api
4
0
Fork 0
mirror of https://github.com/Wei-Shaw/sub2api.git synced 2026-10-31 08:25:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4878 from StarryKira/codex/fix-payment-dashboard-currencies

Browse Source 
fix(payment): group dashboard stats by currency
This commit is contained in:
Wesley Liddick
2026-07-27 11:46:23 +08:00
committed by GitHub
parent ad34f89152 6d99e668d2
commit b72d487b85
9 changed files with 324 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/admin/orders/AdminPaymentDashboardView.vue
+28 -9
View File
@@ -41,8 +41,8 @@
<span :class="['inline-block h-3 w-3 rounded-full', methodColor(method.type)]"></span>
<span class="text-sm text-gray-700 dark:text-gray-300">{{ t('payment.methods.' + method.type, method.type) }}</span>
</div>
<div class="text-right">
<span class="text-sm font-medium text-gray-900 dark:text-white">&yen;{{ method.amount.toFixed(2) }}</span>
<div class="space-y-1 text-right">
<span v-for="[currency, amount] in sortedAmounts(method.amount)" :key="currency" class="block text-sm font-medium text-gray-900 dark:text-white">{{ formatMoney(currency, amount) }}</span>
<span class="ml-2 text-xs text-gray-500 dark:text-gray-400">({{ method.count }})</span>
</div>
</div>
@@ -50,14 +50,17 @@
</div>
<div class="card p-4">
<h3 class="mb-4 text-sm font-semibold text-gray-900 dark:text-white">{{ t('payment.admin.topUsers') }}</h3>
<div v-if="!stats.top_users?.length" class="flex h-32 items-center justify-center text-sm text-gray-500 dark:text-gray-400">{{ t('payment.admin.noData') }}</div>
<div v-if="!hasTopUsers(stats.top_users)" class="flex h-32 items-center justify-center text-sm text-gray-500 dark:text-gray-400">{{ t('payment.admin.noData') }}</div>
<div v-else class="space-y-2">
<div v-for="(user, idx) in stats.top_users" :key="user.user_id" class="flex items-center justify-between rounded-lg px-3 py-2 hover:bg-gray-50 dark:hover:bg-dark-700">
<div class="flex items-center gap-3">
<span :class="['flex h-6 w-6 items-center justify-center rounded-full text-xs font-bold', rankClass(idx)]">{{ idx + 1 }}</span>
<span class="text-sm text-gray-700 dark:text-gray-300">{{ user.email }}</span>
<div v-for="[currency, users] in sortedTopUsers(stats.top_users)" :key="currency" class="space-y-2">
<p class="text-xs font-semibold text-gray-500 dark:text-gray-400">{{ currency }}</p>
<div v-for="(user, idx) in users" :key="user.user_id" class="flex items-center justify-between rounded-lg px-3 py-2 hover:bg-gray-50 dark:hover:bg-dark-700">
<div class="flex items-center gap-3">
<span :class="['flex h-6 w-6 items-center justify-center rounded-full text-xs font-bold', rankClass(idx)]">{{ idx + 1 }}</span>
<span class="text-sm text-gray-700 dark:text-gray-300">{{ user.email }}</span>
</div>
<span class="text-sm font-medium text-gray-900 dark:text-white">{{ formatMoney(currency, user.amount) }}</span>
</div>
<span class="text-sm font-medium text-gray-900 dark:text-white">&yen;{{ user.amount.toFixed(2) }}</span>
</div>
</div>
</div>
@@ -73,7 +76,7 @@ import { useI18n } from 'vue-i18n'
import { useAppStore } from '@/stores/app'
import { adminPaymentAPI } from '@/api/admin/payment'
import { extractI18nErrorMessage } from '@/utils/apiError'
import type { DashboardStats } from '@/types/payment'
import type { CurrencyAmounts, DashboardStats, TopUserPaymentStats } from '@/types/payment'
import AppLayout from '@/components/layout/AppLayout.vue'
import LoadingSpinner from '@/components/common/LoadingSpinner.vue'
import Icon from '@/components/icons/Icon.vue'
@@ -104,6 +107,22 @@ function rankClass(idx: number): string {
return 'bg-gray-100 text-gray-500 dark:bg-dark-700 dark:text-gray-400'
}
function sortedAmounts(amounts: CurrencyAmounts): [string, number][] {
return Object.entries(amounts).sort(([left], [right]) => left.localeCompare(right))
}
function sortedTopUsers(usersByCurrency: Record<string, TopUserPaymentStats[]>): [string, TopUserPaymentStats[]][] {
return Object.entries(usersByCurrency).sort(([left], [right]) => left.localeCompare(right))
}
function hasTopUsers(usersByCurrency: Record<string, TopUserPaymentStats[]>): boolean {
return Object.values(usersByCurrency).some(users => users.length > 0)
}
function formatMoney(currency: string, amount: number): string {
return new Intl.NumberFormat(undefined, { style: 'currency', currency }).format(amount)
}
async function loadDashboard() {
loading.value = true
try {