钱包首页

src/static/wallet/arrow-down.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 6.33301L8 10.333L4 6.33301H12Z" fill="#333333" stroke="#333333" stroke-width="1.33333" stroke-linejoin="round"/>
+</svg>

src/static/wallet/custom-service.svg

@@ -0,0 +1,12 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_4797_12170)">
+<path d="M12 10.6663C13.4728 10.6663 14.6667 9.47244 14.6667 7.99967C14.6667 6.52691 13.4728 5.33301 12 5.33301" stroke="#333333" stroke-width="1.33333" stroke-linejoin="round"/>
+<path d="M4.00001 5.33301C2.52725 5.33301 1.33334 6.52691 1.33334 7.99967C1.33334 9.47244 2.52725 10.6663 4.00001 10.6663" stroke="#333333" stroke-width="1.33333" stroke-linejoin="round"/>
+<path d="M4 10.6663V10.4997V9.66634V7.99967V5.33301C4 3.12387 5.79087 1.33301 8 1.33301C10.2091 1.33301 12 3.12387 12 5.33301V10.6663C12 12.8755 10.2091 14.6663 8 14.6663" stroke="#333333" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_4797_12170">
+<rect width="16" height="16" fill="white"/>
+</clipPath>
+</defs>
+</svg>

src/static/wallet/download.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 8.00277V14H14V8" stroke="#333333" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M11 7.66699L8 10.667L5 7.66699" stroke="#333333" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.99725 2V10.6667" stroke="#333333" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/static/wallet/search.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7 12.6663C10.1296 12.6663 12.6667 10.1293 12.6667 6.99967C12.6667 3.87007 10.1296 1.33301 7 1.33301C3.8704 1.33301 1.33333 3.87007 1.33333 6.99967C1.33333 10.1293 3.8704 12.6663 7 12.6663Z" stroke="#333333" stroke-width="1.33333" stroke-linejoin="round"/>
+<path d="M8.88566 4.78103C8.40309 4.29847 7.73643 4 7.00003 4C6.26366 4 5.59699 4.29847 5.11443 4.78103" stroke="#333333" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M11.0739 11.0737L13.9023 13.9022" stroke="#333333" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/user_pages/edit/index.scss

@@ -166,7 +166,7 @@
 
   // 表单区域
   .form_section {
-    margin-bottom: 48px;
+    margin-bottom: 16px;
     box-shadow: 0px 4px 36px 0px rgba(0, 0, 0, 0.06);
 
     .form_group {

src/user_pages/wallet/index.scss

@@ -6,10 +6,11 @@
   padding: 5px;
   
   .wallet_main_card {
-    background: white;
+    background: #000;
     border-radius: 20px;
     padding: 12px 20px 32px;
     margin-bottom: 8px;
+    color: #fff;
     
     .card_header {
       display: flex;
@@ -20,7 +21,6 @@
       .header_title {
         font-size: 12px;
         font-weight: 400;
-        color: #000;
         line-height: 1.5;
       }
       
@@ -46,9 +46,8 @@
           
           .currency_symbol {
             font-family: 'DingTalk JinBuTi', sans-serif;
-            font-size: 20px;
+            font-size: 32px;
             font-weight: 400;
-            color: #000;
             line-height: 0.8;
           }
           
@@ -60,42 +59,37 @@
               font-family: 'DingTalk JinBuTi', sans-serif;
               font-size: 32px;
               font-weight: 400;
-              color: #000;
               line-height: 0.75;
             }
             
             .decimal_amount {
               font-family: 'DingTalk JinBuTi', sans-serif;
-              font-size: 20px;
+              font-size: 32px;
               font-weight: 400;
-              color: #000;
               line-height: 0.8;
             }
           }
         }
         
         .withdraw_btn {
-          background: #000;
+          background: #fff;
-          color: white;
           border: none;
           border-radius: 20px;
           padding: 8px 20px;
           font-size: 14px;
           font-weight: 400;
-          line-height: 1.29;
           width: 68px;
           height: 34px;
-          
+          margin: unset;
-          &:active {
+          display: flex;
-            background: #333;
+          justify-content: center;
-          }
+          align-items: center;
         }
       }
       
       .available_amount {
         font-size: 12px;
         font-weight: 400;
-        color: #000;
         line-height: 1.5;
         text-align: left;
       }
@@ -122,8 +116,8 @@
       flex: 1;
       
       .function_icon {
-        width: 12px;
+        width: 16px;
-        height: 12px;
+        height: 16px;
         display: flex;
         align-items: center;
         justify-content: center;
@@ -172,6 +166,24 @@
         display: flex;
         align-items: center;
         gap: 4px;
+        position: relative;
+        padding-right: 16px;
+
+        &::before, &::after {
+          content: '';
+          display: block;
+          width: 2px;
+          height: 8px;
+          border-radius: 2px;
+          background: #000;
+          transform: translateX(-3.5px) rotate(-45deg);
+          position: absolute;
+          right: 0;
+        }
+
+        &::after {
+          transform: translateX(3px) rotate(45deg);
+        }
 
         .current_month {
           font-size: 12px;
@@ -179,11 +191,6 @@
           color: #000;
           line-height: 1.5;
         }
-
-        .dropdown_arrow {
-          font-size: 10px;
-          color: #000;
-        }
       }
     }
 

src/user_pages/wallet/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { View, Text, Input, Button } from "@tarojs/components";
+import { View, Text, Input, Button, Image } from "@tarojs/components";
 import Taro, { useDidShow } from "@tarojs/taro";
 import "./index.scss";
 import { CommonPopup } from "@/components";
@@ -284,27 +284,19 @@ const WalletPage: React.FC = () => {
       {/* 功能按钮区域 */}
       <View className="function_buttons">
         <View className="function_item">
-          <View className="function_icon">
-            <Text className="icon_text">📄</Text>
-          </View>
           <Text className="function_text">全部账单</Text>
+          <Image className="function_icon" src={require("@/static/wallet/arrow-down.svg")} />
         </View>
         <View className="function_item">
-          <View className="function_icon">
+          <Image className="function_icon" src={require("@/static/wallet/search.svg")} />
-            <Text className="icon_text">🔍</Text>
-          </View>
           <Text className="function_text">查询交易</Text>
         </View>
         <View className="function_item">
-          <View className="function_icon">
+          <Image className="function_icon" src={require("@/static/wallet/download.svg")} />
-            <Text className="icon_text">⬇️</Text>
-          </View>
           <Text className="function_text">下载账单</Text>
         </View>
         <View className="function_item">
-          <View className="function_icon">
+          <Image className="function_icon" src={require("@/static/wallet/custom-service.svg")} />
-            <Text className="icon_text">💬</Text>
-          </View>
           <Text className="function_text">客服中心</Text>
         </View>
       </View>
@@ -316,7 +308,6 @@ const WalletPage: React.FC = () => {
           <Text className="history_title">现金明细</Text>
           <View className="month_selector">
             <Text className="current_month">2025-09</Text>
-            <Text className="dropdown_arrow">⌄</Text>
           </View>
         </View>