fix: align client dashboard metrics
This commit is contained in:
@@ -4942,7 +4942,7 @@ npm run verify:phase8
|
||||
|
||||
| 用例ID | 场景 | 预期 |
|
||||
| --- | --- | --- |
|
||||
| TC-UI-REVIEW-001 | 查看客户端登录、首页和账户余额 | 登录页存在“返回官网”;金额为继承系统字体、常规字重的普通大号黑字;账户余额页顶部仅显示左侧图标和“账户余额”标题,不再显示“账户”眉题;客户端右上角无待审核任务按钮 |
|
||||
| TC-UI-REVIEW-001 | 查看客户端登录、工作台和账户余额 | 登录页存在“返回官网”;工作台四张指标卡的数字使用同一字体、字号、字重和颜色,账户状态不显示“余额水位”;账户余额页金额为继承系统字体、常规字重的普通大号黑字,顶部仅显示左侧图标和“账户余额”标题;客户端右上角无待审核任务按钮 |
|
||||
| TC-UI-REVIEW-002 | 首次打开批量任务、发送详情和上行短信 | 三个日期区间均为北京时间近7天(含当天) |
|
||||
| TC-UI-REVIEW-003 | 查看不同状态的短信发送记录和回执 | 用户态状态为中文;未知协议值显示“状态未知” |
|
||||
| TC-UI-REVIEW-004 | 对比两端同一应用的CMPP状态 | 两端均按已连接、已断开、未开通显示 |
|
||||
|
||||
@@ -49,11 +49,7 @@ export function ClientHome() {
|
||||
|
||||
const account = dashboard?.accounts[0];
|
||||
const availableBalance = moneyUnitsToYuan((account?.balanceCents ?? 0) + (account?.creditCents ?? 0));
|
||||
const todaySpend = moneyUnitsToYuan(dashboard?.today.spendCents);
|
||||
const todayRefundCents = Math.max(0, dashboard?.today.returnedCents ?? 0);
|
||||
const todayRefund = moneyUnitsToYuan(todayRefundCents);
|
||||
const balanceBaseline = Math.max(availableBalance + todaySpend - todayRefund, availableBalance, 1);
|
||||
const balancePercent = Math.min(100, Math.round((availableBalance / balanceBaseline) * 100));
|
||||
const recentMessages = useMemo<RecentTaskRow[]>(() => (dashboard?.recentTasks ?? []).map((task) => ({
|
||||
id: String(task.id ?? task.taskNo),
|
||||
taskNo: String(task.taskNo ?? task.id),
|
||||
@@ -101,7 +97,7 @@ export function ClientHome() {
|
||||
<div className="dashboard-grid dashboard-grid--four">
|
||||
<div className="surface metric-card metric-card--featured">
|
||||
<span>可用发送额度</span>
|
||||
<strong className="client-amount-value"><MoneyText>¥{formatAmount(availableBalance)}</MoneyText></strong>
|
||||
<strong><MoneyText>¥{formatAmount(availableBalance)}</MoneyText></strong>
|
||||
<small>现金余额 <MoneyText>¥{formatCents(account?.balanceCents)}</MoneyText></small>
|
||||
</div>
|
||||
<div className="surface metric-card">
|
||||
@@ -111,12 +107,12 @@ export function ClientHome() {
|
||||
</div>
|
||||
<div className="surface metric-card">
|
||||
<span>今日消费金额</span>
|
||||
<strong className="client-amount-value"><MoneyText>¥{formatCents(dashboard?.today.spendCents)}</MoneyText></strong>
|
||||
<strong><MoneyText>¥{formatCents(dashboard?.today.spendCents)}</MoneyText></strong>
|
||||
<small>企业今日实际消费</small>
|
||||
</div>
|
||||
<div className="surface metric-card">
|
||||
<span>今日返还金额</span>
|
||||
<strong className="client-amount-value"><MoneyText>¥{formatCents(todayRefundCents)}</MoneyText></strong>
|
||||
<strong><MoneyText>¥{formatCents(todayRefundCents)}</MoneyText></strong>
|
||||
<small>异常回执与退费返还</small>
|
||||
</div>
|
||||
</div>
|
||||
@@ -175,16 +171,7 @@ export function ClientHome() {
|
||||
</div>
|
||||
<div>
|
||||
<span>最近充值</span>
|
||||
<strong className="client-amount-value client-amount-value--compact">{latestRecharge ? <MoneyText>¥{formatCents(latestRecharge.amountCents)}</MoneyText> : '暂无充值'}</strong>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="progress-heading">
|
||||
<span>余额水位</span>
|
||||
<strong>{balancePercent}%</strong>
|
||||
</div>
|
||||
<div className="progress-track">
|
||||
<span style={{ width: `${balancePercent}%` }} />
|
||||
<strong>{latestRecharge ? <MoneyText>¥{formatCents(latestRecharge.amountCents)}</MoneyText> : '暂无充值'}</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -580,25 +580,6 @@
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.client-amount-value {
|
||||
background: none !important;
|
||||
color: #111111 !important;
|
||||
font-family: Arial, "Microsoft YaHei", sans-serif !important;
|
||||
font-size: 38px !important;
|
||||
font-style: normal;
|
||||
font-variant-numeric: tabular-nums;
|
||||
font-weight: 500 !important;
|
||||
letter-spacing: 0 !important;
|
||||
line-height: 1.2 !important;
|
||||
text-shadow: none !important;
|
||||
-webkit-background-clip: border-box !important;
|
||||
-webkit-text-fill-color: #111111 !important;
|
||||
}
|
||||
|
||||
.client-amount-value--compact {
|
||||
font-size: 28px !important;
|
||||
}
|
||||
|
||||
.client-billing-page .client-billing-amount {
|
||||
background: none;
|
||||
color: var(--color-text-strong);
|
||||
|
||||
Reference in New Issue
Block a user