feat: 优化签名热力图与金额展示

src/apps/client/ClientApplicationsPage.tsx

@@ -3,7 +3,7 @@ import { ClipboardCopy, FileText } from 'lucide-react';
 import { useNavigate } from 'react-router-dom';
 import { clientApi, type ApplicationCmppParams, type ClientSmsApplication } from '@/api/adminApi';
 import { formatCents } from '@/utils/currency';
-import { Button, Modal, Pagination, Tag } from '@/components/ui';
+import { Button, Modal, MoneyText, Pagination, Tag } from '@/components/ui';
 import { copyText } from '@/utils/clipboard';
 
 type LinkStatus = 'connected' | 'degraded' | 'disconnected' | 'inactive';
@@ -35,10 +35,6 @@ function normalizeStatus(application: ClientSmsApplication): LinkStatus {
   return application.cmppStatus ?? 'inactive';
 }
 
-function formatPrice(cents?: number | null) {
-  return `${formatCents(cents)} 元`;
-}
-
 function mapParams(params: ApplicationCmppParams): ParamRow[] {
   return [
     { label: 'ID', value: params.applicationId },
@@ -157,7 +153,7 @@ export function ClientApplicationsPage() {
                 </div>
                 <div>
                   <dt>单价</dt>
-                  <dd>{formatPrice(application.customerUnitPrice)}</dd>
+                  <dd><MoneyText>{formatCents(application.customerUnitPrice)} 元</MoneyText></dd>
                 </div>
                 <div>
                   <dt>CMPP连接状态</dt>

src/apps/client/ClientBillingPage.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 import { WalletCards } from 'lucide-react';
-import { Pagination, Tag } from '@/components/ui';
+import { MoneyText, Pagination, Tag } from '@/components/ui';
 import { clientApi, type RechargeOrder } from '@/api/adminApi';
 import { formatCents } from '@/utils/currency';
 import { formatDateTime } from '@/utils/dateTime';
@@ -40,11 +40,11 @@ export function ClientBillingPage() {
       <div className="dashboard-grid enterprise-summary-grid">
         <div className="surface mini-status-card">
           <WalletCards size={22} />
-          <div><span>现金余额</span><strong>¥{formatCents(balanceCents)}</strong><small>充值和扣费后的账面余额。</small></div>
+          <div><span>现金余额</span><strong><MoneyText>¥{formatCents(balanceCents)}</MoneyText></strong><small>充值和扣费后的账面余额。</small></div>
         </div>
         <div className="surface mini-status-card">
           <WalletCards size={22} />
-          <div><span>可用发送额度</span><strong>¥{formatCents(balanceCents + creditCents)}</strong><small>大于 0 时可以发送短信。</small></div>
+          <div><span>可用发送额度</span><strong><MoneyText>¥{formatCents(balanceCents + creditCents)}</MoneyText></strong><small>大于 0 时可以发送短信。</small></div>
         </div>
       </div>
       <div className="surface section-stack">
@@ -60,7 +60,7 @@ export function ClientBillingPage() {
                   <tr key={order.id}>
                     <td><span className="table-mono-id">{order.orderNo}</span></td>
                     <td>{formatDateTime(order.paidAt ?? order.createdAt)}</td>
-                    <td>¥{formatCents(order.amountCents)}</td>
+                    <td><MoneyText>¥{formatCents(order.amountCents)}</MoneyText></td>
                     <td><Tag tone={order.status === 'paid' ? 'success' : 'warning'}>{order.status === 'paid' ? '已入账' : order.status}</Tag></td>
                     <td>{order.remark || '-'}</td>
                   </tr>

src/apps/client/ClientHome.tsx

@@ -10,7 +10,7 @@ import {
   WalletCards,
 } from 'lucide-react';
 import { useNavigate } from 'react-router-dom';
-import { Button, Chart, Table, Tag, type TableColumn } from '@/components/ui';
+import { Button, Chart, MoneyText, Table, Tag, type TableColumn } from '@/components/ui';
 import { clientApi, type DashboardResponse } from '@/api/adminApi';
 import { createLineOption, createPieOption } from '@/theme/chartOptions';
 import { formatDateTime } from '@/utils/dateTime';
@@ -101,8 +101,8 @@ export function ClientHome() {
       <div className="dashboard-grid dashboard-grid--four">
         <div className="surface metric-card metric-card--featured">
           <span>可用发送额度</span>
-          <strong>¥{formatAmount(availableBalance)}</strong>
-          <small>现金余额 ¥{formatCents(account?.balanceCents)}</small>
+          <strong><MoneyText>¥{formatAmount(availableBalance)}</MoneyText></strong>
+          <small>现金余额 <MoneyText>¥{formatCents(account?.balanceCents)}</MoneyText></small>
         </div>
         <div className="surface metric-card">
           <span>今日发送</span>
@@ -111,12 +111,12 @@ export function ClientHome() {
         </div>
         <div className="surface metric-card">
           <span>今日消费金额</span>
-          <strong>¥{formatCents(dashboard?.today.spendCents)}</strong>
+          <strong><MoneyText>¥{formatCents(dashboard?.today.spendCents)}</MoneyText></strong>
           <small>企业今日实际消费</small>
         </div>
         <div className="surface metric-card">
           <span>今日返还金额</span>
-          <strong>¥{formatCents(todayRefundCents)}</strong>
+          <strong><MoneyText>¥{formatCents(todayRefundCents)}</MoneyText></strong>
           <small>异常回执与退费返还</small>
         </div>
       </div>
@@ -175,7 +175,7 @@ export function ClientHome() {
             </div>
             <div>
               <span>最近充值</span>
-              <strong>{latestRecharge ? `¥${formatCents(latestRecharge.amountCents)}` : '暂无充值'}</strong>
+              <strong>{latestRecharge ? <MoneyText>¥{formatCents(latestRecharge.amountCents)}</MoneyText> : '暂无充值'}</strong>
             </div>
           </div>
           <div>

src/apps/client/ClientSendPage.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useMemo, useState } from 'react';
 import { Check, Download, FileText, Plus, Search, Send, Trash2 } from 'lucide-react';
 import { useNavigate } from 'react-router-dom';
-import { Button, DateTimeInput, Input, Modal, Select, Tag, Textarea } from '@/components/ui';
+import { Button, DateTimeInput, Input, Modal, MoneyText, Select, Tag, Textarea } from '@/components/ui';
 import { clientApi, type ClientSmsApplication, type ClientSmsSignatureView, type ClientSmsTemplate, type ImportPreviewResponse, type SmsBatchTask } from '@/api/adminApi';
 import { formatCents } from '@/utils/currency';
 import { replaceLeadingSmsSignature } from '@/utils/smsSignature';
@@ -419,7 +419,7 @@ export function ClientSendPage() {
             </div>
             <div>
               <span>单价</span>
-              <strong>¥{formatCents(selectedApplication?.customerUnitPrice)} / 条</strong>
+              <strong><MoneyText>¥{formatCents(selectedApplication?.customerUnitPrice)} / 条</MoneyText></strong>
             </div>
           </div>
           <div className="preview-note">短信按 70 字/条计费，超出部分按 67 字/条计算</div>