From 0051ca4324f1aca7ceab4f213b607dfa03a5bd42 Mon Sep 17 00:00:00 2001
From: zhx <zhx@haiyi.com>
Date: Tue, 14 Jul 2026 11:37:57 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E9=AB=98=E4=BA=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/FinanceCoinSellerRechargeOrderList.jsx | 11 ++++++++---
 .../FinanceCoinSellerRechargeOrderList.test.jsx       |  9 +++++++++
 finance/src/styles/index.css                          | 11 +++++++++++
 3 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/finance/src/components/FinanceCoinSellerRechargeOrderList.jsx b/finance/src/components/FinanceCoinSellerRechargeOrderList.jsx
index 0478152..df87fc2 100644
--- a/finance/src/components/FinanceCoinSellerRechargeOrderList.jsx
+++ b/finance/src/components/FinanceCoinSellerRechargeOrderList.jsx
@@ -340,7 +340,12 @@ export function FinanceCoinSellerRechargeOrderList({
                                         <td className="r num">
                                             <Stacked
                                                 primary={usdText(item)}
+                                                primaryClassName="finance-recharge-amount"
                                                 secondary={`${formatAmount(item.coinAmount)} 金币${isZeroCoinMakeupOrder(item) ? "（补单）" : ""}`}
+                                                // 0 金币代表补单且不会发币，只有真实发放的金币才进入强调态，避免误导财务人员。
+                                                secondaryClassName={
+                                                    Number(item.coinAmount || 0) > 0 ? "finance-recharge-coins--positive" : ""
+                                                }
                                             />
                                         </td>
                                         <td>
@@ -507,11 +512,11 @@ function StatusBadge({ status }) {
     );
 }
 
-function Stacked({ primary, secondary }) {
+function Stacked({ primary, primaryClassName = "", secondary, secondaryClassName = "" }) {
     return (
         <span className="finance-stack">
-            <span>{primary || "-"}</span>
-            <small>{secondary || ""}</small>
+            <span className={primaryClassName}>{primary || "-"}</span>
+            <small className={secondaryClassName}>{secondary || ""}</small>
         </span>
     );
 }
diff --git a/finance/src/components/FinanceCoinSellerRechargeOrderList.test.jsx b/finance/src/components/FinanceCoinSellerRechargeOrderList.test.jsx
index a5fe428..424d8b6 100644
--- a/finance/src/components/FinanceCoinSellerRechargeOrderList.test.jsx
+++ b/finance/src/components/FinanceCoinSellerRechargeOrderList.test.jsx
@@ -198,10 +198,19 @@ test("zero coin seller recharge order uses makeup completion action", () => {
 
     fireEvent.click(screen.getByRole("button", { name: "完成补单" }));
 
+    expect(screen.getByText("USD 10.00")).toHaveClass("finance-recharge-amount");
+    expect(screen.getByText("0 金币（补单）")).not.toHaveClass("finance-recharge-coins--positive");
     expect(confirm).toHaveBeenCalledWith(expect.stringContaining("不发放金币"));
     expect(onGrant).toHaveBeenCalledWith(expect.objectContaining({ id: "makeup", coinAmount: 0 }));
 });
 
+test("highlights recharge amount and only non-zero coins", () => {
+    render(<FinanceCoinSellerRechargeOrderList {...baseProps()} />);
+
+    expect(screen.getByText("USD 10.00")).toHaveClass("finance-recharge-amount");
+    expect(screen.getByText("100,000 金币")).toHaveClass("finance-recharge-coins--positive");
+});
+
 function baseProps(overrides = {}) {
     return {
         actionLoading: "",
diff --git a/finance/src/styles/index.css b/finance/src/styles/index.css
index e444f42..74b86fd 100644
--- a/finance/src/styles/index.css
+++ b/finance/src/styles/index.css
@@ -140,6 +140,17 @@ a {
   color: var(--text-tertiary);
 }
 
+/* 充值账单金额与实际发放金币是财务核对重点；用既有语义色和字重建立层级，不改变零金币补单的弱化展示。 */
+.finance-recharge-amount {
+  color: var(--primary-strong);
+  font-weight: 750;
+}
+
+.finance-stack small.finance-recharge-coins--positive {
+  color: var(--success);
+  font-weight: 700;
+}
+
 .finance-main {
   display: flex;
   flex-direction: column;