| 1 | import { Card, List, Tag, Typography } from 'antd'; |
| 2 | import { useEffect, useState } from 'react'; |
| 3 | import { taskApi } from '@/api/task'; |
| 4 | import { UserTask, UserTaskStatus } from '@/api/types/task'; |
| 5 | import { Task, TaskDataInfo } from 'commont/types/task'; |
| 6 | |
| 7 | const { Text } = Typography; |
| 8 | |
| 9 | export default function ExpectedIncome() { |
| 10 | const [loading, setLoading] = useState(false); |
| 11 | const [list, setList] = useState<UserTask<Task<TaskDataInfo>>[]>([]); |
| 12 | const [pagination, setPagination] = useState({ |
| 13 | current: 1, |
| 14 | pageSize: 10, |
| 15 | total: 0, |
| 16 | }); |
| 17 | |
| 18 | const getExpectedIncomeList = async () => { |
| 19 | try { |
| 20 | setLoading(true); |
| 21 | const params = { |
| 22 | pageSize: pagination.pageSize, |
| 23 | pageNo: pagination.current, |
| 24 | status: UserTaskStatus.APPROVED |
| 25 | }; |
| 26 | const res = await taskApi.getMineTaskList(params); |
| 27 | console.log('getExpectedIncomeList', 'res', res); |
| 28 | setList(res.items || []); |
| 29 | setPagination(prev => ({ |
| 30 | ...prev, |
| 31 | current: res.meta.currentPage || 1, |
| 32 | pageSize: res.meta.itemsPerPage || 10, |
| 33 | total: res.meta.totalItems || 0 |
| 34 | })); |
| 35 | } catch (error) { |
| 36 | console.error('获取预计收入列表失败:', error); |
| 37 | } finally { |
| 38 | setLoading(false); |
| 39 | } |
| 40 | }; |
| 41 | |
| 42 | useEffect(() => { |
| 43 | getExpectedIncomeList(); |
| 44 | }, [pagination.current]); |
| 45 | |
| 46 | return ( |
| 47 | <Card title="预计收入列表" bordered={false}> |
| 48 | <List |
| 49 | loading={loading} |
| 50 | dataSource={list} |
| 51 | pagination={{ |
| 52 | ...pagination, |
| 53 | onChange: (page) => { |
| 54 | setPagination(prev => ({ ...prev, current: page })); |
| 55 | }, |
| 56 | }} |
| 57 | renderItem={(item) => ( |
| 58 | <List.Item |
| 59 | actions={[ |
| 60 | <Text key="amount" type="secondary"> |
| 61 | 金额: ¥{(typeof item.taskId === 'string' ? 0 : item.taskId?.reward)?.toFixed(2)} |
| 62 | </Text>, |
| 63 | ]} |
| 64 | > |
| 65 | <List.Item.Meta |
| 66 | title={ |
| 67 | <div className="flex items-center"> |
| 68 | <Text> |
| 69 | {typeof item.taskId === 'string' |
| 70 | ? '未知任务' |
| 71 | : item.taskId?.title || '未知任务'} |
| 72 | </Text> |
| 73 | <Tag color="processing" className="ml-2"> |
| 74 | 已批准 |
| 75 | </Tag> |
| 76 | </div> |
| 77 | } |
| 78 | description={ |
| 79 | <div> |
| 80 | <Text type="secondary"> |
| 81 | 任务ID: {typeof item.taskId === 'string' ? item.taskId : item.taskId?.id} |
| 82 | </Text> |
| 83 | <br /> |
| 84 | <Text type="secondary"> |
| 85 | 创建时间: {new Date(item.createTime).toLocaleString()} |
| 86 | </Text> |
| 87 | {item.verificationNote && ( |
| 88 | <> |
| 89 | <br /> |
| 90 | <Text type="warning" className="text-orange-500"> |
| 91 | 审核建议: {item.verificationNote} |
| 92 | </Text> |
| 93 | </> |
| 94 | )} |
| 95 | </div> |
| 96 | } |
| 97 | /> |
| 98 | </List.Item> |
| 99 | )} |
| 100 | /> |
| 101 | </Card> |
| 102 | ); |
| 103 | } |