我是人，我做了悬赏中心，可以进行悬赏哦
Change-Id: I845de799a633be286a6fadee2b7aa533238c3652
diff --git a/src/pages/Bounty/List.tsx b/src/pages/Bounty/List.tsx
new file mode 100644
index 0000000..ca789c5
--- /dev/null
+++ b/src/pages/Bounty/List.tsx
@@ -0,0 +1,183 @@
+import React, { useState, useEffect } from 'react';
+import { Table, Button, message, Space, Modal } from 'antd';
+import axios from 'axios'; // 新增 axios 导入
+import { useNavigate } from 'umi';
+
+import { getBountyList } from '@/services/bounty/bounty';
+import BountyPublish from './BountyPublish';
+import BountyReply from './BountyReply';
+const BountyList: React.FC = () => {
+ const [dataSource, setDataSource] = useState<API.Bounty[]>([]);
+ const [loading, setLoading] = useState(false);
+ const [publishVisible, setPublishVisible] = useState(false);
+ const [replyVisible, setReplyVisible] = useState(false);
+ const [selectedId, setSelectedId] = useState<number | null>(null);
+
+ const navigate = useNavigate();
+
+ // 加载悬赏列表（修改请求方式）
+
+ const loadBountyList = async () => {
+ try {
+ setLoading(true);
+ const res = await getBountyList();
+
+ // 添加详细日志输出
+ console.log('接口原始响应:', res);
+
+ // 修改数据处理逻辑以适配实际数据结构
+ if (res && Array.isArray(res)) {
+ // 当接口直接返回数组时
+ setDataSource(res);
+ } else if (res && res.code === 200) {
+ // 当接口返回标准分页结构时
+ setDataSource(res.data.records || res.data || []);
+ } else {
+ throw new Error('接口返回异常结构');
+ }
+ } catch (err) {
+ console.error('加载数据异常:', err);
+ console.error('完整错误:', err);
+
+ // 添加网络错误处理
+ // @ts-ignore
+ if (err?.response?.status === 401) {
+ message.error('认证失效，请重新登录');
+ navigate('/login');
+ } else {
+ message.error('加载悬赏列表失败');
+ }
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ useEffect(() => {
+ loadBountyList();
+ }, []);
+
+ // ✅ 发布成功回调（普通函数，无需useEffect）
+ const handlePublishSuccess = () => {
+ setPublishVisible(false);
+ loadBountyList(); // 重新加载数据
+ message.success('悬赏发布成功');
+ };
+
+ // ✅ 回复成功回调（普通函数，无需useEffect）
+ const handleReplySuccess = () => {
+ setReplyVisible(false);
+ loadBountyList(); // 重新加载数据
+ message.success('回复提交成功');
+ };
+
+
+ // 跳转详情页
+ const goDetail = (id: number) => {
+ navigate(`/bounty/detail/${id}`);
+ };
+
+ // 表格列配置
+ const columns = [
+ {
+ title: '标题',
+ dataIndex: 'title',
+ width: 200,
+ ellipsis: true,
+ },
+ {
+ title: '发布者ID',
+ dataIndex: 'creator_id', // ✅ 新增列
+ width: 100,
+ align: 'center' as const,
+ },
+ {
+ title: '奖励',
+ dataIndex: 'reward',
+ width: 100,
+ align: 'center' as const,
+ },
+ {
+ title: '状态',
+ dataIndex: 'status',
+ width: 100,
+ render: (status: number) => (
+ status === 0 ? '未回复' : status === 1 ? '已回复' : '已关闭'
+ )
+ },
+ {
+ title: '操作',
+ width: 160,
+ render: (value: unknown, record: API.Bounty) => (
+ <Space>
+ <Button
+ type="link"
+ onClick={() => navigate(`/bounty/detail/${record.id}`)}
+ >
+ 查看详情
+ </Button>
+ <Button
+ type="link"
+ onClick={() => {
+ setSelectedId(record.id);
+ setReplyVisible(true);
+ }}
+ >
+ 回复悬赏
+ </Button>
+ </Space>
+ )
+ }
+ ];
+
+ return (
+ <div className="page-container">
+ {/* 顶部操作区 */}
+ <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 16 }}>
+ <h2>悬赏列表</h2>
+ {/* 发布按钮 */}
+ <Button
+ type="primary"
+ onClick={() => setPublishVisible(true)}
+ >
+ 发布悬赏
+ </Button>
+ </div>
+
+ {/* 悬赏列表 */}
+ <Table
+ dataSource={dataSource}
+ columns={columns}
+ rowKey="id"
+ pagination={{ pageSize: 10 }}
+ loading={loading}
+ />
+
+ {/* 发布悬赏模态框 */}
+ <Modal
+ title="发布新悬赏"
+ open={publishVisible}
+ onCancel={() => setPublishVisible(false)}
+ footer={null}
+ >
+ <BountyPublish onSuccess={handlePublishSuccess} />
+ </Modal>
+
+ {/* 回复悬赏模态框 */}
+ <Modal
+ title="回复悬赏"
+ open={replyVisible}
+ onCancel={() => setReplyVisible(false)}
+ footer={null}
+ >
+ {selectedId && (
+ <BountyReply
+ bountyId={selectedId}
+ onSuccess={handleReplySuccess}
+ />
+ )}
+ </Modal>
+ </div>
+ );
+};
+
+export default BountyList;