feat(dealer): 添加客户列表功能并优化邀请流程

- 新增客户列表页面，实现客户数据获取和筛选功能
- 添加客户状态管理工具函数
- 优化邀请流程，支持绑定推荐关系
- 调整提现功能，增加调试组件
- 修复申请经销商功能中的推荐人ID逻辑

src/dealer/withdraw/index.tsx

@@ -1,7 +1,8 @@
-import React, { useState, useRef, useEffect, useCallback } from 'react'
-import { View, Text } from '@tarojs/components'
+import React, {useState, useRef, useEffect, useCallback} from 'react'
+import {View, Text} from '@tarojs/components'
 import {
   Cell,
+  Space,
   Button,
   Form,
   Input,
@@ -13,19 +14,19 @@ import {
   Loading,
   PullToRefresh
 } from '@nutui/nutui-react-taro'
-import { Wallet } from '@nutui/icons-react-taro'
-import { businessGradients } from '@/styles/gradients'
+import {Wallet} from '@nutui/icons-react-taro'
+import {businessGradients} from '@/styles/gradients'
 import Taro from '@tarojs/taro'
-import { useDealerUser } from '@/hooks/useDealerUser'
-import { pageShopDealerWithdraw, addShopDealerWithdraw } from '@/api/shop/shopDealerWithdraw'
-import type { ShopDealerWithdraw } from '@/api/shop/shopDealerWithdraw/model'
+import {useDealerUser} from '@/hooks/useDealerUser'
+import {pageShopDealerWithdraw, addShopDealerWithdraw} from '@/api/shop/shopDealerWithdraw'
+import type {ShopDealerWithdraw} from '@/api/shop/shopDealerWithdraw/model'
 
 interface WithdrawRecordWithDetails extends ShopDealerWithdraw {
   accountDisplay?: string
 }
 
 const DealerWithdraw: React.FC = () => {
-  const [activeTab, setActiveTab] = useState('0')
+  const [activeTab, setActiveTab] = useState<string | number>('0')
   const [selectedAccount, setSelectedAccount] = useState('')
   const [loading, setLoading] = useState<boolean>(false)
   const [refreshing, setRefreshing] = useState<boolean>(false)
@@ -34,16 +35,28 @@ const DealerWithdraw: React.FC = () => {
   const [withdrawRecords, setWithdrawRecords] = useState<WithdrawRecordWithDetails[]>([])
   const formRef = useRef<any>(null)
 
-  const { dealerUser } = useDealerUser()
+  const {dealerUser} = useDealerUser()
+
+  // Tab 切换处理函数
+  const handleTabChange = (value: string | number) => {
+    console.log('Tab切换到:', value)
+    setActiveTab(value)
+
+    // 如果切换到提现记录页面，刷新数据
+    if (String(value) === '1') {
+      fetchWithdrawRecords()
+    }
+  }
 
   // 获取可提现余额
   const fetchBalance = useCallback(async () => {
+    console.log(dealerUser, 'dealerUser...')
     try {
-        setAvailableAmount(dealerUser?.money || '0.00')
+      setAvailableAmount(dealerUser?.money || '0.00')
     } catch (error) {
       console.error('获取余额失败:', error)
     }
-  }, [])
+  }, [dealerUser])
 
   // 获取提现记录
   const fetchWithdrawRecords = useCallback(async () => {
@@ -104,21 +117,31 @@ const DealerWithdraw: React.FC = () => {
 
   const getStatusText = (status?: number) => {
     switch (status) {
-      case 40: return '已到账'
-      case 20: return '审核通过'
-      case 10: return '待审核'
-      case 30: return '已驳回'
-      default: return '未知'
+      case 40:
+        return '已到账'
+      case 20:
+        return '审核通过'
+      case 10:
+        return '待审核'
+      case 30:
+        return '已驳回'
+      default:
+        return '未知'
     }
   }
 
   const getStatusColor = (status?: number) => {
     switch (status) {
-      case 40: return 'success'
-      case 20: return 'success'
-      case 10: return 'warning'
-      case 30: return 'danger'
-      default: return 'default'
+      case 40:
+        return 'success'
+      case 20:
+        return 'success'
+      case 10:
+        return 'warning'
+      case 30:
+        return 'danger'
+      default:
+        return 'default'
     }
   }
 
@@ -131,9 +154,25 @@ const DealerWithdraw: React.FC = () => {
       return
     }
 
+    if (!values.accountType) {
+      Taro.showToast({
+        title: '请选择提现方式',
+        icon: 'error'
+      })
+      return
+    }
+
     // 验证提现金额
     const amount = parseFloat(values.amount)
-    const available = parseFloat(availableAmount.replace(',', ''))
+    const available = parseFloat(availableAmount.replace(/,/g, ''))
+
+    if (isNaN(amount) || amount <= 0) {
+      Taro.showToast({
+        title: '请输入有效的提现金额',
+        icon: 'error'
+      })
+      return
+    }
 
     if (amount < 100) {
       Taro.showToast({
@@ -151,6 +190,25 @@ const DealerWithdraw: React.FC = () => {
       return
     }
 
+    // 验证账户信息
+    if (values.accountType === 'alipay') {
+      if (!values.account || !values.accountName) {
+        Taro.showToast({
+          title: '请填写完整的支付宝信息',
+          icon: 'error'
+        })
+        return
+      }
+    } else if (values.accountType === 'bank') {
+      if (!values.account || !values.accountName || !values.bankName) {
+        Taro.showToast({
+          title: '请填写完整的银行卡信息',
+          icon: 'error'
+        })
+        return
+      }
+    }
+
     try {
       setSubmitting(true)
 
@@ -158,7 +216,7 @@ const DealerWithdraw: React.FC = () => {
         userId: dealerUser.userId,
         money: values.amount,
         payType: values.accountType === 'wechat' ? 10 :
-                values.accountType === 'alipay' ? 20 : 30,
+          values.accountType === 'alipay' ? 20 : 30,
         applyStatus: 10, // 待审核
         platform: 'MiniProgram'
       }
@@ -204,15 +262,21 @@ const DealerWithdraw: React.FC = () => {
   const quickAmounts = ['100', '300', '500', '1000']
 
   const setQuickAmount = (amount: string) => {
-    formRef.current?.setFieldsValue({ amount })
+    formRef.current?.setFieldsValue({amount})
   }
 
   const setAllAmount = () => {
-    formRef.current?.setFieldsValue({ amount: availableAmount.replace(',', '') })
+    formRef.current?.setFieldsValue({amount: availableAmount.replace(/,/g, '')})
+  }
+
+  // 格式化金额
+  const formatMoney = (money?: string) => {
+    if (!money) return '0.00'
+    return parseFloat(money).toFixed(2)
   }
 
   const renderWithdrawForm = () => (
-    <View className="p-4">
+    <View>
       {/* 余额卡片 */}
       <View className="rounded-xl p-6 mb-6 text-white relative overflow-hidden" style={{
         background: businessGradients.dealer.header
@@ -225,14 +289,14 @@ const DealerWithdraw: React.FC = () => {
         }}></View>
 
         <View className="flex items-center justify-between relative z-10">
-          <View>
+          <View className={'flex flex-col'}>
+            <Text className="text-2xl font-bold text-white">{formatMoney(dealerUser?.money)}</Text>
             <Text className="text-white text-opacity-80 text-sm mb-1">可提现余额</Text>
-            <Text className="text-2xl font-bold text-white">¥{availableAmount}</Text>
           </View>
           <View className="p-3 rounded-full" style={{
             background: 'rgba(255, 255, 255, 0.2)'
           }}>
-            <Wallet color="white" size="32" />
+            <Wallet color="white" size="32"/>
           </View>
         </View>
         <View className="mt-4 pt-4 relative z-10" style={{
@@ -254,7 +318,14 @@ const DealerWithdraw: React.FC = () => {
             <Input
               placeholder="请输入提现金额"
               type="number"
-              clearable
+              onChange={(value) => {
+                // 实时验证提现金额
+                const amount = parseFloat(value)
+                const available = parseFloat(availableAmount.replace(/,/g, ''))
+                if (!isNaN(amount) && amount > available) {
+                  // 可以在这里添加实时提示，但不阻止输入
+                }
+              }}
             />
           </Form.Item>
 
@@ -301,10 +372,10 @@ const DealerWithdraw: React.FC = () => {
           {selectedAccount === 'alipay' && (
             <>
               <Form.Item name="account" label="支付宝账号" required>
-                <Input placeholder="请输入支付宝账号" />
+                <Input placeholder="请输入支付宝账号"/>
               </Form.Item>
               <Form.Item name="accountName" label="支付宝姓名" required>
-                <Input placeholder="请输入支付宝实名姓名" />
+                <Input placeholder="请输入支付宝实名姓名"/>
               </Form.Item>
             </>
           )}
@@ -312,13 +383,13 @@ const DealerWithdraw: React.FC = () => {
           {selectedAccount === 'bank' && (
             <>
               <Form.Item name="bankName" label="开户银行" required>
-                <Input placeholder="请输入开户银行名称" />
+                <Input placeholder="请输入开户银行名称"/>
               </Form.Item>
               <Form.Item name="account" label="银行卡号" required>
-                <Input placeholder="请输入银行卡号" />
+                <Input placeholder="请输入银行卡号"/>
               </Form.Item>
               <Form.Item name="accountName" label="开户姓名" required>
-                <Input placeholder="请输入银行卡开户姓名" />
+                <Input placeholder="请输入银行卡开户姓名"/>
               </Form.Item>
             </>
           )}
@@ -347,60 +418,64 @@ const DealerWithdraw: React.FC = () => {
     </View>
   )
 
-  const renderWithdrawRecords = () => (
-    <PullToRefresh
-      disabled={refreshing}
-      onRefresh={handleRefresh}
-    >
-      <View className="p-4">
-        {loading ? (
-          <View className="text-center py-8">
-            <Loading />
-            <Text className="text-gray-500 mt-2">加载中...</Text>
-          </View>
-        ) : withdrawRecords.length > 0 ? (
-          withdrawRecords.map(record => (
-            <View key={record.id} className="bg-white rounded-lg p-4 mb-3 shadow-sm">
-              <View className="flex justify-between items-start mb-3">
-                <View>
-                  <Text className="font-semibold text-gray-800 mb-1">
-                    提现金额：¥{record.money}
-                  </Text>
-                  <Text className="text-sm text-gray-500">
-                    提现账户：{record.accountDisplay}
-                  </Text>
-                </View>
-                <Tag type={getStatusColor(record.applyStatus)}>
-                  {getStatusText(record.applyStatus)}
-                </Tag>
-              </View>
+  const renderWithdrawRecords = () => {
+    console.log('渲染提现记录:', {loading, recordsCount: withdrawRecords.length, dealerUserId: dealerUser?.userId})
 
-              <View className="text-xs text-gray-400">
-                <Text>申请时间：{record.createTime}</Text>
-                {record.auditTime && (
-                  <Text className="block mt-1">
-                    审核时间：{new Date(record.auditTime).toLocaleString()}
-                  </Text>
-                )}
-                {record.rejectReason && (
-                  <Text className="block mt-1 text-red-500">
-                    驳回原因：{record.rejectReason}
-                  </Text>
-                )}
-              </View>
+    return (
+      <PullToRefresh
+        disabled={refreshing}
+        onRefresh={handleRefresh}
+      >
+        <View>
+          {loading ? (
+            <View className="text-center py-8">
+              <Loading/>
+              <Text className="text-gray-500 mt-2">加载中...</Text>
             </View>
-          ))
-        ) : (
-          <Empty description="暂无提现记录" />
-        )}
-      </View>
-    </PullToRefresh>
-  )
+          ) : withdrawRecords.length > 0 ? (
+            withdrawRecords.map(record => (
+              <View key={record.id} className="rounded-lg bg-gray-50 p-4 mb-3 shadow-sm">
+                <View className="flex justify-between items-start mb-3">
+                  <Space>
+                    <Text className="font-semibold text-gray-800 mb-1">
+                      提现金额：¥{record.money}
+                    </Text>
+                    <Text className="text-sm text-gray-500">
+                      提现账户：{record.accountDisplay}
+                    </Text>
+                  </Space>
+                  <Tag type={getStatusColor(record.applyStatus)}>
+                    {getStatusText(record.applyStatus)}
+                  </Tag>
+                </View>
+
+                <View className="text-xs text-gray-400">
+                  <Text>申请时间：{record.createTime}</Text>
+                  {record.auditTime && (
+                    <Text className="block mt-1">
+                      审核时间：{new Date(record.auditTime).toLocaleString()}
+                    </Text>
+                  )}
+                  {record.rejectReason && (
+                    <Text className="block mt-1 text-red-500">
+                      驳回原因：{record.rejectReason}
+                    </Text>
+                  )}
+                </View>
+              </View>
+            ))
+          ) : (
+            <Empty description="暂无提现记录"/>
+          )}
+        </View>
+      </PullToRefresh>
+    )
+  }
 
   if (!dealerUser) {
     return (
       <View className="bg-gray-50 min-h-screen flex items-center justify-center">
-        <Loading />
+        <Loading/>
         <Text className="text-gray-500 mt-2">加载中...</Text>
       </View>
     )
@@ -408,7 +483,7 @@ const DealerWithdraw: React.FC = () => {
 
   return (
     <View className="bg-gray-50 min-h-screen">
-      <Tabs value={activeTab} onChange={() => setActiveTab}>
+      <Tabs value={activeTab} onChange={handleTabChange}>
         <Tabs.TabPane title="申请提现" value="0">
           {renderWithdrawForm()}
         </Tabs.TabPane>