feat: 重构和优化多个组件，增强性能和可维护性

src/features/wallet/wallet-screen.tsx

@@ -63,11 +63,13 @@ export function WalletScreen() {
 
     actionDeepLinkHandledRef.current = true;
     if (!isCreditPlayer) {
-      if (action === "transfer-in") {
-        setTransferInOpen(true);
-      } else {
-        setTransferOutOpen(true);
-      }
+      queueMicrotask(() => {
+        if (action === "transfer-in") {
+          setTransferInOpen(true);
+        } else {
+          setTransferOutOpen(true);
+        }
+      });
     }
     router.replace("/wallet", { scroll: false });
   }, [isCreditPlayer, loading, router, searchParams]);
@@ -78,7 +80,7 @@ export function WalletScreen() {
     if (section !== "logs" && section !== "pending") return;
 
     sectionDeepLinkHandledRef.current = true;
-    const targetId = "wallet-logs";
+    const targetId = section === "pending" ? "wallet-pending" : "wallet-logs";
     const timer = window.setTimeout(() => {
       scrollToWalletSection(targetId);
       router.replace("/wallet", { scroll: false });
@@ -332,6 +334,42 @@ export function WalletScreen() {
           </div>
         ) : null}
 
+        {!isCreditPlayer && (logs?.pending_reconcile?.length ?? 0) > 0 ? (
+          <section
+            id="wallet-pending"
+            className="scroll-mt-3 rounded-2xl border border-amber-200 bg-amber-50 px-3 py-3 text-sm text-amber-900"
+          >
+            <h2 className="text-sm font-black text-amber-800">
+              {t("wallet.pendingSectionTitle", { defaultValue: "待对账划转" })}
+            </h2>
+            <p className="mt-1 text-xs text-amber-700">
+              {t("wallet.pendingSectionHint", {
+                defaultValue: "以下划转仍在与主站对账，请稍后刷新查看结果。",
+              })}
+            </p>
+            <ul className="mt-3 space-y-2">
+              {logs?.pending_reconcile.map((item) => (
+                <li
+                  key={item.transfer_no}
+                  className="rounded-xl border border-amber-200 bg-white px-3 py-2"
+                >
+                  <div className="flex items-center justify-between gap-3">
+                    <span className="font-semibold">
+                      {item.direction === "in"
+                        ? t("wallet.flow.transfer_in", { defaultValue: "转入" })
+                        : t("wallet.flow.transfer_out", { defaultValue: "转出" })}
+                    </span>
+                    <span className="font-black tabular-nums text-amber-800">
+                      {formatMinorAsCurrency(item.amount, item.currency_code || currency)}
+                    </span>
+                  </div>
+                  <p className="mt-1 font-mono text-[11px] text-amber-600">{item.transfer_no}</p>
+                </li>
+              ))}
+            </ul>
+          </section>
+        ) : null}
+
         <div id="wallet-logs" className="scroll-mt-3">
         <WalletLogsBlock
           creditMode={isCreditPlayer}