feat(miniprogram): 温润东方风全面 UI 重设计

73 文件变更，覆盖全部 40 个页面 SCSS + TabBar 图标 + 组件样式。
统一赤陶主色 #C4623A + 暖米背景 + 衬线标题字体 + 12px 圆角体系。

apps/miniprogram/src/pages/mall/orders/index.tsx

@@ -14,11 +14,11 @@ const STATUS_TABS = [
   { key: 'expired', label: '已过期' },
 ];
 
-const STATUS_CONFIG: Record<string, { label: string; className: string }> = {
-  pending: { label: '待核销', className: 'status-pending' },
-  verified: { label: '已核销', className: 'status-verified' },
-  cancelled: { label: '已取消', className: 'status-cancelled' },
-  expired: { label: '已过期', className: 'status-expired' },
+const STATUS_CONFIG: Record<string, { label: string; tagBg: string; tagColor: string }> = {
+  pending: { label: '待核销', tagBg: '#FFF3E0', tagColor: '#C4873A' },
+  verified: { label: '已核销', tagBg: '#E8F0E8', tagColor: '#5B7A5E' },
+  cancelled: { label: '已取消', tagBg: '#FDEAEA', tagColor: '#B54A4A' },
+  expired: { label: '已过期', tagBg: '#F0EBE5', tagColor: '#A8A29E' },
 };
 
 export default function MallOrders() {
@@ -40,7 +40,6 @@ export default function MallOrders() {
           page_size: 10,
         });
         let list = res.data || [];
-        // 前端按状态过滤（后端暂不支持 status 参数）
         if (status) {
           list = list.filter((o) => o.status === status);
         }
@@ -101,7 +100,7 @@ export default function MallOrders() {
   };
 
   const getStatusConfig = (status: string) => {
-    return STATUS_CONFIG[status] || { label: status, className: 'status-pending' };
+    return STATUS_CONFIG[status] || { label: status, tagBg: '#F0EBE5', tagColor: '#A8A29E' };
   };
 
   const formatDate = (dateStr: string) => {
@@ -120,11 +119,7 @@ export default function MallOrders() {
             className={`status-tab ${activeTab === tab.key ? 'active' : ''}`}
             onClick={() => handleTabChange(tab.key)}
           >
-            <Text
-              className={`status-tab-text ${activeTab === tab.key ? 'active' : ''}`}
-            >
-              {tab.label}
-            </Text>
+            <Text className='status-tab-text'>{tab.label}</Text>
           </View>
         ))}
       </View>
@@ -132,7 +127,7 @@ export default function MallOrders() {
       {/* 订单列表 */}
       {orders.length === 0 && !loading ? (
         <EmptyState
-          icon='📋'
+          icon=''
           text='暂无订单'
           hint='去商城兑换心仪商品吧'
           actionText='去商城'
@@ -146,7 +141,10 @@ export default function MallOrders() {
               <View className='order-card' key={order.id}>
                 <View className='order-header'>
                   <Text className='order-product'>商品 {order.product_id.slice(0, 8)}</Text>
-                  <View className={`order-status ${statusCfg.className}`}>
+                  <View
+                    className='order-status-tag'
+                    style={{ background: statusCfg.tagBg, color: statusCfg.tagColor }}
+                  >
                     <Text className='order-status-text'>{statusCfg.label}</Text>
                   </View>
                 </View>
@@ -154,8 +152,8 @@ export default function MallOrders() {
                 <View className='order-body'>
                   <View className='order-row'>
                     <Text className='order-row-label'>消耗积分</Text>
-                    <Text className='order-row-value cost'>
-                      🪙 {order.points_cost.toLocaleString()}
+                    <Text className='order-row-value order-cost'>
+                      {order.points_cost.toLocaleString()}
                     </Text>
                   </View>
                   <View className='order-row'>
@@ -166,9 +164,9 @@ export default function MallOrders() {
                   </View>
                   {order.status === 'pending' && (
                     <View className='order-qrcode' onClick={() => handleShowQrCode(order.qr_code)}>
-                      <Text className='qrcode-label'>核销码: </Text>
+                      <Text className='qrcode-label'>核销码</Text>
                       <Text className='qrcode-value'>{order.qr_code}</Text>
-                      <Text className='qrcode-tap'>点击查看</Text>
+                      <Text className='qrcode-tap'>查看</Text>
                     </View>
                   )}
                 </View>