${label}
+ ${formatNumber(value)} + ${hint} +
+
+
+ `;
+
+ const sidebar = this.root.querySelector
+
+
+ 运营总览
+
+
+
+
+ 暂无趋势数据
';
+
+ const width = 720;
+ const height = 240;
+ const padding = 28;
+ const values = points.map((point) => point.registrations);
+ const max = Math.max(...values, 1);
+ const step = points.length > 1 ? (width - padding * 2) / (points.length - 1) : 0;
+ const coordinates = points.map((point, index) => ({
+ x: points.length === 1 ? width / 2 : padding + index * step,
+ y: height - padding - (point.registrations / max) * (height - padding * 2),
+ point,
+ }));
+ const polyline = coordinates.map(({ x, y }) => `${x},${y}`).join(" ");
+ const midpoint = Math.ceil(max / 2);
+
+ return `
+
+
+
+ | UTC 日期 | 新增用户 | 消耗积分 |
|---|---|---|
| ${escapeHtml(point.date)} | ${formatNumber(point.registrations)} | ${formatNumber(point.creditsUsed)} |
暂无漏斗数据
';
+ const max = Math.max(...steps.map((step) => step.count), 1);
+
+ return `
+
+ ${steps
+ .map((step, index) => {
+ return `
+
+ `;
+}
diff --git a/admin-web/src/components/ui.ts b/admin-web/src/components/ui.ts
new file mode 100644
index 0000000..eb14f7e
--- /dev/null
+++ b/admin-web/src/components/ui.ts
@@ -0,0 +1,66 @@
+import { ApiError } from "../api/client";
+import { escapeHtml } from "../lib/format";
+
+export function renderLoading(container: HTMLElement, label = "正在加载"): void {
+ container.innerHTML = `
+
+
+ `;
+ })
+ .join("")}
+
+ ${escapeHtml(step.label)}
+ ${formatNumber(step.count)}
+
+
+
+
+
+ `;
+}
+
+export function renderError(
+ container: HTMLElement,
+ error: unknown,
+ retry?: () => void,
+): void {
+ const message =
+ error instanceof ApiError ? error.message : "出现未知错误，请稍后重试";
+ container.innerHTML = `
+ ${escapeHtml(label)}…
+
+
+
+ `;
+ container.querySelector无法加载数据
+${escapeHtml(message)}
+ ${retry ? '' : ""} +${escapeHtml(message)}
+
+
+
+ 安全与合规
+ 审计日志
+追踪管理员操作、目标和执行结果。
+
+
+
+
+ ${
+ page.nextCursor
+ ? ''
+ : ""
+ }
+ `
+ }
+ | 时间 | 操作员 | 操作 | 目标 | 请求 ID | 结果 |
|---|
${escapeHtml(entry.action)}${escapeHtml(entry.targetId)}
+ OSG
+ 安全、克制、可追溯的运营管理
+运营后台
+ 管理员登录
+使用管理员凭据和认证器动态验证码登录。凭据不会保存到浏览器。
+ + `); + + const form = root.querySelector
+
+
+
+ 积分账本
+ 积分流水
+按内部用户 ID 查询不可变积分流水。
+${renderEmpty("输入内部用户 ID 开始查询")}
+ 用户 ${escapeHtml(userId)} · ${formatNumber(page.items.length)} 条记录
+
+
+
+
+ `;
+ } catch (error) {
+ renderError(results, error, () => void loadLedger(container, userId));
+ }
+}
diff --git a/admin-web/src/pages/overview.ts b/admin-web/src/pages/overview.ts
new file mode 100644
index 0000000..6af1c01
--- /dev/null
+++ b/admin-web/src/pages/overview.ts
@@ -0,0 +1,102 @@
+import { adminApi } from "../api/client";
+import { trendChart } from "../components/charts";
+import { renderError, renderLoading } from "../components/ui";
+import { escapeHtml, formatNumber } from "../lib/format";
+
+export async function renderOverview(
+ container: HTMLElement,
+ range = "30d",
+): Promise| 时间 | 流水号 | 类型 | 变动 | 结余 | 原因 |
|---|---|---|---|---|---|
| ${formatDateTime(entry.createdAt)} | +${escapeHtml(entry.entryId)} | +${statusLabel(entry.type)} | +${formatSignedCredits(entry.amount)} | +${formatNumber(entry.balanceAfter)} | +${escapeHtml(entry.reasonCode)} | +
+
+
+
+
+ 核心指标
+ 运营总览
+快速掌握增长与积分消耗情况。
+
+
+ 新增用户
+
+ ${trendChart(data.trend)}
+ 新增用户趋势
按 UTC 日期统计注册数
使用汇总
按类型统计，不包含用户内容
当前周期暂无使用记录
' + : ` +
+
+
+
+ `
+ }
+ | 类型 | 请求 | 消耗积分 | 语音毫秒 | 输入 Token | 输出 Token |
|---|---|---|---|---|---|
${escapeHtml(item.kind)} |
+ ${formatNumber(item.requests)} | +${formatNumber(item.chargedCredits)} | +${formatNumber(item.asrMillis)} | +${formatNumber(item.inputTokens)} | +${formatNumber(item.outputTokens)} | +
+
+
+
+
+ 增长分析
+ 裂变与排行
+奖励以有效使用为前提，不以注册量代替真实转化。
+待资格确认
+ ${formatNumber(data.pendingBindings)} + 等待有效使用 +不符合奖励条件
+ ${formatNumber(data.ineligibleBindings)} + 未发放积分 +
+
+
+ ${funnelChart(data.funnel)}
+
+
+
+ ${
+ data.ranking.length === 0
+ ? renderEmpty("当前周期暂无排行数据")
+ : `
+
+
+ `;
+
+ container.querySelectorAll裂变漏斗
从分享至有效使用
邀请排行
按有效邀请数排序
+
+
+
+ `
+ }
+ | 名次 | 用户 ID | 邀请 | 有效 | 奖励积分 |
|---|---|---|---|---|
| ${index + 1} | +${escapeHtml(item.userId)} | +${formatNumber(item.invited)} | +${formatNumber(item.qualified)} | +${formatNumber(item.creditsEarned)} | +
+
+
+
+
+
+
+
+ 访问控制
+ 安全中心
+管理运营人员、角色、登录锁定、会话与双重认证。
+
+
+
+ 管理员
已加载 ${operators.length} 个账户
+
+
+
+ ${
+ nextCursor
+ ? ''
+ : ""
+ }
+
+ | 管理员 | 角色 | 状态 | 最近登录 | 操作 |
|---|
${escapeHtml(operator.operatorId)}
+
+ ${
+ locked
+ ? ''
+ : ""
+ }
+
+
+ ${
+ operator.enabled
+ ? ``
+ : ''
+ }
+
+
+
+ `;
+ const close = dialog.querySelector仅显示一次
+ ${escapeHtml(title)}
+请立即把 TOTP 密钥交给对应管理员，并确认已添加到认证器。
+
+ Base32 密钥
+
+ ${escapeHtml(provisioning.totpSecret)}
+
+
+ 在认证器中打开
+
+
+
+
+
+
+
+
+ 账户管理
+ 用户查询
+按内部用户 ID 精确查询，不展示 Apple 身份标识。
+${renderEmpty("输入查询条件开始搜索")}
+
+
+
+
+ `;
+ results.querySelectorAll| 用户 | 状态 | 积分余额 | 注册时间 | 操作 |
|---|
${escapeHtml(user.userId)}
+
+
+
+
+
+ ${
+ role === "SUPER_ADMIN"
+ ? ''
+ : ""
+ }
+ 用户详情
+ ${escapeHtml(user.displayName || "未命名用户")}
+${escapeHtml(user.userId)}
+
+
+
+ ${escapeHtml(user.displayName || "未命名用户")}${statusLabel(user.status)}
+ -
+
- 积分余额
- ${formatNumber(user.creditBalance)}
- 注册时间
- ${formatDateTime(user.createdAt)}
- 最近活跃
- ${formatDateTime(user.lastActiveAt)}
- 有效使用
- ${qualifiedUsage ? "已达成" : "未达成"}${usage.length > 0 ? ` · ${formatNumber(usageRequests)} 次请求` : ""}
- 累计消耗
- ${formatNumber(chargedCredits)} 积分
- 邀请码
- ${escapeHtml(user.referralCode || "—")}
- 邀请来源
- ${escapeHtml(inviterUserId || "—")}
- 邀请成效
- ${formatNumber(referral.rewardedInvites)} / ${formatNumber(referral.invitedUsers)} 已奖励
积分流水
不可变账本记录
+
+
+
+ ${
+ ledger.nextCursor
+ ? ''
+ : ""
+ }
+
+ `
+ }
+ | 时间 | 类型 | 变动 | 结余 | 原因 |
|---|
使用统计
按使用类型汇总，不包含用户内容
+
+
+
+ | 类型 | 请求 | 消耗积分 | 语音时长（毫秒） | 输入 Token | 输出 Token |
|---|---|---|---|---|---|
${escapeHtml(item.kind)} |
+ ${formatNumber(item.requests)} | +${formatNumber(item.chargedCredits)} | +${formatNumber(item.asrMillis)} | +${formatNumber(item.inputTokens)} | +${formatNumber(item.outputTokens)} | +