shangzy/new-api-analytics
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add cost metrics to analytics dashboard

Browse Source
This commit is contained in:
shangzy
2026-04-28 11:27:51 +08:00
parent 67e43b02bf
commit ab915e9292
13 changed files with 226 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
app/rankings/page.tsx
View File

@@ -5,16 +5,17 @@ import Link from "next/link";
import { motion } from "motion/react";
import { Trophy, Users, Cpu, Radio, ArrowUpDown, ArrowDown, ArrowUp } from "lucide-react";
import { TimeRangeSelector } from "@/components/TimeRangeSelector";
import { buildQuery, formatNumber, formatTokens } from "@/lib/utils";
import { buildQuery, formatNumber, formatTokens, formatUSD } from "@/lib/utils";
import { useTimeRange } from "@/lib/time-range-context";
import { useI18n } from "@/lib/i18n";
type Tab = "user" | "model" | "channel";
type SortKey = "calls" | "prompt_tokens" | "completion_tokens" | "cache_creation_tokens" | "cache_read_tokens" | "total_tokens";
type SortKey = "calls" | "prompt_tokens" | "completion_tokens" | "cache_creation_tokens" | "cache_read_tokens" | "total_tokens" | "quota_usd";
interface RankItem {
rank: number; name: string; username?: string; id?: number; calls: number;
prompt_tokens: number; completion_tokens: number; cache_creation_tokens: number; cache_read_tokens: number; total_tokens: number;
quota: number; quota_usd: number;
}
export default function RankingsPage() {
@@ -74,6 +75,7 @@ export default function RankingsPage() {
{ key: "cache_read_tokens", label: t("th.cacheRead"), align: "right" },
{ key: "completion_tokens", label: t("th.output"), align: "right" },
{ key: "total_tokens", label: t("th.totalToken"), align: "right" },
{ key: "quota_usd", label: t("th.cost"), align: "right" },
];
return (
@@ -127,7 +129,7 @@ export default function RankingsPage() {
</thead>
<tbody>
{loading ? (
<tr><td colSpan={8} className="px-4 py-16 text-center"><div className="inline-block h-5 w-5 animate-spin rounded-full spinner" /></td></tr>
<tr><td colSpan={9} className="px-4 py-16 text-center"><div className="inline-block h-5 w-5 animate-spin rounded-full spinner" /></td></tr>
) : sorted.map((item, i) => (
<motion.tr key={item.name} initial={{ opacity: 0 }} animate={{ opacity: 1 }} transition={{ delay: i * 0.02 }}
className="row-glow transition-colors" style={{ borderBottom: "1px solid var(--surface-border)" }}>
@@ -141,6 +143,7 @@ export default function RankingsPage() {
<td className="px-4 py-3 text-right tabular-nums font-[family-name:var(--font-geist-mono)] text-xs" style={{ color: "var(--text-muted)" }}>{formatTokens(item.cache_read_tokens)}</td>
<td className="px-4 py-3 text-right tabular-nums font-[family-name:var(--font-geist-mono)] text-xs" style={{ color: "var(--text-muted)" }}>{formatTokens(item.completion_tokens)}</td>
<td className="px-4 py-3 text-right tabular-nums font-medium font-[family-name:var(--font-geist-mono)]" style={{ color: "var(--text-primary)" }}>{formatTokens(item.total_tokens)}</td>
<td className="px-4 py-3 text-right tabular-nums font-[family-name:var(--font-geist-mono)] text-xs" style={{ color: "var(--text-secondary)" }}>{formatUSD(item.quota_usd)}</td>
</motion.tr>
))}
</tbody>