举报的管理员前端
Change-Id: Ieeaa92b556ccc31539c4e0df6bfcc87625ed08a8
diff --git a/src/components/ComplainAdminPanel.jsx b/src/components/ComplainAdminPanel.jsx
new file mode 100644
index 0000000..a7985be
--- /dev/null
+++ b/src/components/ComplainAdminPanel.jsx
@@ -0,0 +1,149 @@
+import React, { useEffect, useState } from 'react';
+import {
+ Table,
+ Button,
+ Modal,
+ message,
+ Tag,
+ Space,
+ Tooltip,
+} from 'antd';
+import { ExclamationCircleOutlined } from '@ant-design/icons';
+import {
+ getAllComplains,
+ deleteComplain,
+ // 预留：你后续可以新增处理投诉的API
+} from '../api/complain';
+import { useNavigate } from 'react-router-dom';
+
+const { confirm } = Modal;
+
+const ComplainAdminPanel = () => {
+ const [complains, setComplains] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const navigate = useNavigate();
+
+ const fetchComplains = async () => {
+ setLoading(true);
+ try {
+ const data = await getAllComplains();
+ setComplains(data);
+ } catch (error) {
+ message.error('获取投诉记录失败');
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ useEffect(() => {
+ fetchComplains();
+ }, []);
+
+ const showDeleteConfirm = (complainid) => {
+ confirm({
+ title: '确认删除该投诉记录吗？',
+ icon: <ExclamationCircleOutlined />,
+ okText: '删除',
+ okType: 'danger',
+ cancelText: '取消',
+ onOk() {
+ handleDelete(complainid);
+ },
+ });
+ };
+
+ const handleDelete = async (complainid) => {
+ try {
+ const success = await deleteComplain(complainid);
+ if (success) {
+ message.success('删除成功');
+ fetchComplains();
+ } else {
+ message.error('删除失败');
+ }
+ } catch {
+ message.error('删除请求失败');
+ }
+ };
+
+ const handleProcess = (complain) => {
+ const { complainid, duser, torrentid } = complain;
+ navigate(`/complain-process/${complainid}`, {
+ state: { complainid, duser, torrentid },
+ });
+ };
+
+ const columns = [
+ {
+ title: '投诉ID',
+ dataIndex: 'complainid',
+ key: 'complainid',
+ width: 80,
+ fixed: 'left',
+ },
+ {
+ title: '投诉人ID',
+ dataIndex: 'puse',
+ key: 'puse',
+ width: 120,
+ },
+ {
+ title: '被投诉人ID',
+ dataIndex: 'duser',
+ key: 'duser',
+ width: 120,
+ },
+ {
+ title: '投诉内容',
+ dataIndex: 'content',
+ key: 'content',
+ ellipsis: { showTitle: false },
+ render: (text) => (
+ <Tooltip placement="topLeft" title={text}>
+ {text}
+ </Tooltip>
+ ),
+ },
+ {
+ title: '相关种子ID',
+ dataIndex: 'torrentid',
+ key: 'torrentid',
+ width: 120,
+ render: (val) => val ?? <Tag color="default">无</Tag>,
+ },
+ {
+ title: '操作',
+ key: 'action',
+ fixed: 'right',
+ width: 150,
+ render: (_, record) => (
+ <Space size="middle">
+ <Button type="primary" onClick={() => handleProcess(record)}>
+ 处理
+ </Button>
+ <Button danger onClick={() => showDeleteConfirm(record.complainid)}>
+ 删除
+ </Button>
+ </Space>
+ ),
+ },
+ ];
+
+ return (
+ <div style={{ padding: 20 }}>
+ <h2 style={{ marginBottom: 20 }}>投诉管理面板</h2>
+ <Table
+ rowKey="complainid"
+ columns={columns}
+ dataSource={complains}
+ loading={loading}
+ scroll={{ x: 1000 }}
+ pagination={{ pageSize: 10 }}
+ bordered
+ size="middle"
+ />
+ </div>
+ );
+};
+
+export default ComplainAdminPanel;